/* SATUJELAJAH / EXPEDITION ATELIER
   Art direction: travel journal, restrained editorial luxury and purposeful motion.
   Designed for real marketplace content, with no JS dependency for legibility. */
:root{
 --pine:#14271e;--pine-2:#234431;--pine-3:#37664b;
 --ink:#14271e;--muted:#777e75;--line:#d9dcd2;
 --ivory:#f4f2ec;--paper:#faf9f5;--cream:#e9e6dc;
 --sand:#d6aa73;--gold:#c99b65;--serif:"Instrument Serif",Georgia,serif;
 --sans:"DM Sans",Arial,sans-serif;--shadow:0 25px 80px rgba(15,33,24,.12);
}
html{scroll-padding-top:90px}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
.lenis.lenis-smooth iframe{pointer-events:none}
body{background:var(--paper);color:var(--ink);letter-spacing:-.009em}
::selection{color:#122a1b;background:#dfba7c}
.container{max-width:1480px;padding-inline:clamp(24px,4.2vw,74px)}
.announcement{background:#182c21;height:34px;color:#e4e0d4;letter-spacing:.19em;font-weight:600}
.announcement .signal-dot{background:#d7ad74;box-shadow:0 0 0 4px #d7ad7420}
.announcement-right{color:#d6af76}
.site-header{background:rgba(247,246,240,.93);border-color:#dfe1d7;backdrop-filter:blur(18px)}
.header-inner{height:84px;gap:25px}
.brand{font-size:23px;letter-spacing:-.075em}
.brand-mark{border-radius:0;background:#183829;color:#ecc694;width:44px;height:44px}
.brand-mark svg{width:30px;height:30px}
.desktop-nav{gap:clamp(14px,2.3vw,38px)}
.desktop-nav a{font-weight:600;font-size:12px;letter-spacing:.005em;color:#6f7c6f}
.desktop-nav .nav-active:after{height:2px;bottom:-33px}
.icon-button{border:1px solid transparent}
.icon-button:hover{border-color:#cfd6ca;background:#e5e9dd}
.button{border-radius:2px;min-height:42px;letter-spacing:.01em}
.button-sm{padding:12px 20px}
.button-lg{padding:20px 28px}
.button-dark{background:#183a2a}
.button-dark:hover{background:#2f5940}
.button-outline{border-color:#cad1c5;background:transparent}
.button-sand{background:#d9af79}
.button-sand:hover{background:#e6bf8d}
.text-action{letter-spacing:.005em}
.account-pill{border-radius:2px;background:#eaeee5}
/* Homepage: large photographic opening with editorial typography. */
.hero{height:min(800px,83vh);min-height:660px;max-height:880px}
.hero-photo img{object-position:center 53%;filter:saturate(.72) contrast(1.04) brightness(.77)}
.hero-overlay{
 background:
 linear-gradient(90deg,rgba(10,27,20,.94) 0%,rgba(11,32,24,.86) 35%,rgba(15,37,27,.34) 73%,rgba(11,31,21,.19) 100%),
 linear-gradient(0deg,rgba(12,31,23,.5),transparent 40%);
}
.hero:after{
 content:"";pointer-events:none;position:absolute;z-index:1;
 left:clamp(24px,4.2vw,74px);right:clamp(24px,4.2vw,74px);top:26px;bottom:36px;
 border:1px solid #ffffff20;
}
.hero-content{padding-bottom:45px}
.hero-copy{max-width:970px;position:relative;z-index:2;margin-top:-46px}
.eyebrow{letter-spacing:.24em;font-size:10px}
.eyebrow.light{color:#ead0a5}
.hero h1{font-weight:500;font-size:clamp(70px,8.55vw,136px);letter-spacing:-.09em;line-height:.84;margin:38px 0 38px}
.hero h1 em{font-size:1.08em;color:#e9c18a}
.hero-copy p{font-size:16px;line-height:2;max-width:520px;color:#e0e5dc}
.hero-links{gap:37px;margin-top:36px}
.hero-links .button{border-radius:2px}
.hero-link{font-weight:600;letter-spacing:.03em}
.hero-index{bottom:68px;right:74px}
.hero-index span:last-child{letter-spacing:.17em}
.hero-vertical{
 position:absolute;z-index:3;right:clamp(38px,5vw,82px);top:50%;
 writing-mode:vertical-rl;transform:translateY(-50%);
 font-size:10px;font-weight:800;letter-spacing:.23em;color:#ffffffa8
}
.hero-stamp{position:absolute;z-index:3;bottom:155px;right:clamp(72px,9vw,150px);width:120px;height:120px;border:1px solid #ffffff96;border-radius:50%;display:grid;place-items:center;transform:rotate(-12deg);color:#f5e6d1}
.hero-stamp span{text-align:center;line-height:1.5;letter-spacing:.18em;font-size:9px;font-weight:800}
.hero-stamp:before{content:"✦";position:absolute;top:13px;left:50%;transform:translateX(-50%);font-size:15px;color:#e5ba81}
.hero-stamp:after{content:"↗";position:absolute;bottom:10px;left:50%;transform:translateX(-50%);font-size:16px}
.search-wrap{margin-top:-56px;position:relative;z-index:7}
.search-bar{background:#fcfbf7;border:1px solid #ffffffc9;box-shadow:0 19px 70px #132d242f;padding:15px 15px 15px 24px;min-height:111px;border-radius:2px}
.search-field{gap:17px}
.search-field small{font-size:9px;letter-spacing:.19em;color:#63806e}
.search-field input,.search-field select{font-size:13px;font-weight:600}
.search-icon{background:#e9eee5;border-radius:0;width:40px;height:40px}
.search-submit{border-radius:1px;min-width:170px}
.proof-strip{padding:45px 0;border-bottom:1px solid #e2e2d8;background:var(--paper)}
.proof-inner{gap:75px}
.proof-inner>span:not(.proof-divider){font-size:11px;letter-spacing:.03em;font-weight:600}
.proof-inner svg{color:#66866b}
.section{padding:125px 0}
.section-index{letter-spacing:.17em;color:#7e907e}
.section-trail{color:#92958a}
.section-header{margin-bottom:53px;align-items:end}
.section-header h2,.corporate-copy h2{font-weight:500;letter-spacing:-.085em;font-size:clamp(52px,5.4vw,85px);line-height:.95}
.section-header h2 em,.corporate-copy h2 em{color:#8a977a}
.section-header p{line-height:1.9;margin-top:23px;font-size:14px}
.subtle-link{border-bottom:1px solid #829585;letter-spacing:.01em}
.category-grid{gap:1px;background:#d6dbd1;border:1px solid #d6dbd1;grid-template-columns:repeat(5,minmax(0,1fr))}
.category-tile{margin:0;border:0;border-radius:0;min-height:150px;padding:23px;gap:24px;background:#f8f8f3;box-shadow:none!important}
.category-tile:hover,.category-tile.active{background:#203d2c;color:#fcf7ed;transform:translateY(0)}
.category-tile>.cat-icon{border-radius:1px;width:40px;height:40px;background:#e6ebdf}
.category-tile strong{font-size:14px;font-weight:650}
.category-tile small{font-size:11px}
.category-tile>svg:last-child{right:23px;top:25px;opacity:.5}
.inventory-bar{margin-top:67px}
.inventory-caption h3{font-size:27px;letter-spacing:-.07em}
.segmented{background:#eaece6;border-radius:1px}
.segmented button{border-radius:0}
.segmented .selected{background:#fff}
.listing-grid{gap:clamp(13px,1.8vw,28px)}
.listing-card{border-radius:0;border-color:#e1e4da;background:#fffefa;box-shadow:none;overflow:hidden}
.listing-card:hover{transform:translateY(-7px);box-shadow:0 20px 50px rgba(20,45,28,.09)}
.listing-image{height:310px;background-color:#244a38}
.listing-image:after{background:linear-gradient(0deg,#162d244f,transparent 50%)}
.listing-badge{border-radius:0;top:20px;left:20px;padding:9px 12px;letter-spacing:.15em;font-size:9px}
.heart-button{border-radius:50%;width:38px;height:38px}
.listing-location{font-size:11px;bottom:18px;left:23px}
.listing-body{padding:26px 25px 22px}
.listing-type{letter-spacing:.17em;color:#7f937a}
.listing-title{font-weight:600;font-size:22px;line-height:1.25;letter-spacing:-.055em;margin:13px 0}
.listing-vendor{font-size:11px;margin:13px 0 20px}
.listing-details{padding-bottom:22px}
.listing-footer{padding-top:22px}
.listing-price strong{font-size:25px;font-weight:650}
.listing-footer>.button{padding:13px 17px;min-height:44px}
.listing-footer>.button:hover{background:#1b3b2b;color:white}
.section-bottom{padding-top:53px}
.section-bottom .button{min-width:220px}
.destination-section{background:#e9ebe3;padding:114px 0 134px}
.destination-grid{gap:14px;grid-template-columns:1.18fr 1fr 1fr;min-height:470px}
.destination-card{border-radius:0;min-height:465px}
.destination-card:nth-child(2){margin-top:40px}
.destination-card:nth-child(3){margin-top:80px}
.destination-card:after{background:linear-gradient(0deg,#0c251ecc 0%,#0a231a16 80%)}
.destination-card-content{left:30px;bottom:27px}
.destination-card h3{font-family:var(--serif);font-size:clamp(32px,3.5vw,52px);font-weight:400;letter-spacing:-.03em}
.destination-card small{font-size:10px;letter-spacing:.19em;color:#e6d1ae}
.destination-arrow{border-radius:0!important}
.story-section{min-height:790px;grid-template-columns:1fr 1fr}
.story-visual{min-height:790px}
.story-visual:after{background:linear-gradient(transparent 65%,#0f281f7f)}
.story-content{padding:90px clamp(48px,6.1vw,110px)}
.story-content h2{font-size:clamp(56px,5.3vw,88px);letter-spacing:-.08em;margin:30px 0}
.story-content h2 em{color:#e7c192}
.story-content>p{font-size:14px}
.story-points{margin:44px 0}
.story-points>div{gap:20px;padding-bottom:15px;border-bottom:1px solid #ffffff14}
.story-points strong{font-weight:600;font-size:14px}
.story-points span{line-height:1.8}
.story-image-note{bottom:45px;left:55px}
.corporate-section{padding:140px 0}
.corporate-inner{grid-template-columns:1fr 1fr;gap:8%}
.corporate-copy h2{margin:30px 0 33px}
.corporate-copy>p{font-size:14px}
.corporate-tags span{border-radius:0}
.corporate-visual{height:570px;border-radius:0}
.corporate-overlay-card{background:#f6f0e3;border-radius:0;padding:30px;left:30px;right:30px;bottom:30px}
.corporate-overlay-card strong{font-size:47px}
.partner-section{padding:93px 0;background:#183f2b}
.partner-inner h2{font-size:clamp(43px,4.1vw,66px)}
.partner-inner p{max-width:720px}
.site-footer{background:#0e2119}
.footer-main{padding-top:100px;padding-bottom:95px}
.footer-brand{font-size:26px}
.footer-brand .brand-mark{border-radius:0;background:#cfa36d}
.footer-bottom{border-color:#ffffff24}
.footer-links strong{letter-spacing:.14em}
.footer-links a,.footer-links button{transition:color .2s}
.footer-links a:hover,.footer-links button:hover{color:#e1bf8b}
/* Product detail and every operational overlay share one premium system. */
.app-drawer{width:min(545px,100%);background:#faf9f5;box-shadow:-24px 0 90px #071e173d}
.drawer-header{padding:35px 38px 29px;border-color:#e0e2d8}
.drawer-header small{font-size:10px;letter-spacing:.2em;color:#8a9b85}
.drawer-header h2{font-family:var(--serif);font-weight:400;font-size:40px;letter-spacing:-.025em}
.drawer-body{padding:32px 38px 60px}
.drawer-field input,.drawer-field textarea,.drawer-field select,.field{border-radius:1px;background:white;border-color:#d2dbcf}
.drawer-item{border-radius:1px;border-color:#dce2d6;background:#fff}
.drawer-item h3{font-weight:600;font-size:17px}
.drawer-item .order-state{letter-spacing:.14em}
.note-box,.panel-empty{border-radius:0}
.note-box{line-height:1.8}
.pill{border-radius:2px}
.pill.active{background:#1c3e2b}
.status-pill{border-radius:2px}
.google-button{border-radius:1px}
.drawer-list button{border-radius:2px;padding:21px}
.detail-dialog{max-width:min(1010px,95vw);border-radius:1px}
.detail-photo{height:410px}
.detail-content{padding:46px 56px 55px}
.detail-content h2{font-size:clamp(40px,5vw,63px);font-family:var(--serif);font-weight:400;letter-spacing:-.025em}
.detail-book{border-radius:1px}
.detail-stats span{border-radius:1px}
.detail-grid h3{letter-spacing:-.025em}
.detail-close{border-radius:50%}
.toast{border-radius:1px;max-width:min(500px,92vw);letter-spacing:.01em}
.search-icon,.listing-badge,.destination-card,.category-tile,.button{backface-visibility:hidden}
.category-tile:after,.listing-card:after{
 content:"";position:absolute;inset:0;opacity:0;pointer-events:none;
 background:radial-gradient(300px circle at var(--spot-x,50%) var(--spot-y,50%),rgba(234,205,145,.18),transparent 72%);
 transition:opacity .22s
}
.category-tile:hover:after,.listing-card:hover:after{opacity:1}
.listing-card{position:relative}
.sj-screenflash{
 pointer-events:none;position:fixed;z-index:1000;inset:0;opacity:0;
 background:#f3e8d5;mix-blend-mode:screen;will-change:opacity;
}
.sj-screenflash.is-active{animation:sj-soft-flash .42s ease-out both}
@keyframes sj-soft-flash{0%{opacity:0}12%{opacity:.23}24%{opacity:.16}100%{opacity:0}}
.sj-scroll-progress{pointer-events:none;position:fixed;top:0;left:0;right:0;z-index:900;height:2px;background:#d4aa72;transform:scaleX(0);transform-origin:left center;will-change:transform}
/* tablet */
@media(max-width:1120px){
 .header-inner{height:76px}
 .category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .hero h1{font-size:clamp(68px,9vw,105px)}
 .hero-stamp{right:60px;bottom:155px;width:105px;height:105px}
 .listing-image{height:270px}
 .story-content{padding:70px 47px}
 .story-content h2{font-size:clamp(50px,5.4vw,72px)}
}
@media(max-width:950px){
 .hero{min-height:670px;height:720px}
 .hero-vertical{display:none}
 .hero-stamp{right:44px;bottom:150px}
 .story-section{grid-template-columns:1fr;min-height:auto}
 .story-visual{height:460px;min-height:460px}
 .story-content{padding:82px clamp(24px,6vw,65px)}
 .destination-grid{grid-template-columns:1fr 1fr}
 .destination-card:first-child{grid-column:1/-1}
 .destination-card:nth-child(2),.destination-card:nth-child(3){margin-top:0}
 .corporate-inner{grid-template-columns:1fr}
}
@media(max-width:640px){
 .container{padding-inline:21px}
 .announcement{height:29px;letter-spacing:.07em}
 .announcement-inner{font-size:8px}
 .header-inner{height:70px}
 .site-header .brand{font-size:19px}
 .hero{height:700px;min-height:670px}
 .hero:after{left:20px;right:20px;top:20px;bottom:29px}
 .hero-content{padding-top:125px;align-items:flex-start}
 .hero-copy{margin:0}
 .hero h1{font-size:clamp(60px,12vw,80px);letter-spacing:-.075em;margin:23px 0}
 .hero-copy p{font-size:13px;max-width:350px}
 .hero-links{flex-direction:column;align-items:flex-start;gap:19px}
 .hero-links .button{padding:17px 21px}
 .hero-stamp{bottom:128px;right:36px;width:86px;height:86px}
 .hero-stamp span{font-size:7px}
 .hero-index{display:none}
 .search-wrap{margin-top:-64px}
 .search-bar{border-radius:1px;min-height:auto}
 .search-field{gap:9px}
 .proof-strip{padding:28px 0}
 .proof-inner{gap:9px}
 .proof-inner>span:not(.proof-divider){font-size:9px}
 .section{padding:80px 0}
 .section-header{margin-bottom:37px}
 .section-header h2,.corporate-copy h2{font-size:clamp(45px,10vw,59px)}
 .section-header p{font-size:12px;margin-top:15px}
 .category-grid{display:flex;gap:0;background:#d6dbd1;overflow-x:auto;margin-inline:-21px;padding:0 21px;scrollbar-width:none}
 .category-tile{flex:0 0 171px;min-height:146px;border-right:1px solid #d6dbd1}
 .inventory-bar{margin-top:47px}
 .listing-grid{grid-template-columns:1fr;gap:21px}
 .listing-image{height:270px}
 .listing-body{padding:23px}
 .listing-title{font-size:22px}
 .listing-price strong{font-size:23px}
 .destination-section{padding:80px 0}
 .destination-grid{display:grid;grid-template-columns:1fr;gap:12px}
 .destination-card,.destination-card:first-child{min-height:320px;grid-column:auto}
 .destination-card:nth-child(2),.destination-card:nth-child(3){min-height:250px}
 .destination-card h3{font-size:39px}
 .story-visual{height:380px;min-height:380px}
 .story-content{padding:72px 22px}
 .story-content h2{font-size:58px}
 .story-image-note{left:22px;bottom:25px}
 .corporate-section{padding:85px 0}
 .corporate-visual{height:370px}
 .corporate-overlay-card{left:16px;right:16px;bottom:16px;padding:22px}
 .corporate-overlay-card strong{font-size:34px}
 .partner-section{padding:73px 0}
 .partner-inner h2{font-size:44px}
 .footer-main{padding-top:72px;padding-bottom:48px}
 .drawer-header{padding:25px 23px}
 .drawer-header h2{font-size:35px}
 .drawer-body{padding:24px 21px 105px}
 .detail-photo{height:290px}
 .detail-content{padding:27px 22px 40px}
 .detail-content h2{font-size:44px}
}
@media(max-width:420px){
 .hero{height:690px}
 .hero h1{font-size:clamp(53px,12.2vw,67px)}
 .hero-stamp{width:77px;height:77px;bottom:140px}
 .section-header h2,.corporate-copy h2{font-size:44px}
 .listing-footer{align-items:flex-start}
 .listing-footer>.button{width:100%}
 .listing-price strong{font-size:24px}
 .story-content h2{font-size:50px}
 .detail-content h2{font-size:39px}
}
@media(prefers-reduced-motion:reduce){
 .sj-screenflash,.sj-scroll-progress{display:none}
 [data-reveal]{opacity:1!important;transform:none!important}
}
