/* Rimba theme · look "Sungai": light and airy, river teal and dusk orange, the klotok route in the hero. */
body.style-sungai{
  --mist:#F3F5F1;--leaf:#FFFFFF;--ink:#17231E;--muted:#4F5F55;--line:#DDE3DB;
  --forest:#13615F;--forest-ink:#FFFFFF;--enggang:#8A4310;--sun:#D9772B;
  --tannin:#17231E;--tannin-2:#13615F;--on-dark:#F1F5F2;--on-dark-muted:#C3D3CB;
  --canopy-1:#3E6A55;--canopy-2:#2E5546;--canopy-3:#22443A;
  --f-display:"Young Serif",Georgia,"Times New Roman",serif;
  --f-body:"Hanken Grotesk","Segoe UI",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --r:14px;
}
body.style-sungai h1,body.style-sungai h2:where(:not(.h4):not(.h3)){font-weight:400;font-stretch:normal;letter-spacing:-.005em;line-height:1.08}
body.style-sungai h1{font-size:clamp(2.4rem,5.4vw,4.2rem)}
body.style-sungai h3{font-family:var(--f-body);font-weight:700;font-stretch:normal;letter-spacing:0}
body.style-sungai .eyebrow{font-weight:500}
body.style-sungai .brand b{font-family:var(--f-body);font-weight:700;font-stretch:normal}
body.style-sungai .motif{display:none}

/* hero */
.hero-sg{padding-block:clamp(2.5rem,6vw,4.5rem) 2rem}
.hero-sg .wrap{display:flex;flex-wrap:wrap;gap:3rem;align-items:center}
.hero-sg .hs-text{flex:999 1 440px;min-width:0;display:grid;gap:1.3rem}
.hero-sg h1 em{font-style:normal;color:var(--forest)}
.hero-sg .lede{font-size:1.18rem}
.hero-sg .btn--ghost{color:var(--forest)}
.sg-route{flex:1 1 360px;min-width:0;background:var(--leaf);border:1px solid var(--line);border-radius:20px;padding:1.6rem;display:grid;gap:.35rem}
.sg-route .eyebrow{color:var(--muted);font-size:.68rem}
.sg-route h2{font-size:1.5rem;margin-bottom:.6rem}
.sg-route ol{list-style:none;margin:0;padding:0}
.sg-route li{display:grid;grid-template-columns:96px 22px minmax(0,1fr);gap:0 .7rem;min-height:56px}
.sg-route time{font:500 .76rem/1.5 var(--f-mono);color:var(--forest)}
.sg-route .dot{position:relative;display:flex;justify-content:center}
.sg-route .dot::before{content:"";position:absolute;top:18px;bottom:0;width:3px;border-radius:2px;background:#9CC3BF}
.sg-route li:last-child .dot::before{display:none}
.sg-route .dot::after{content:"";box-sizing:border-box;width:16px;height:16px;margin-top:3px;border-radius:50%;background:var(--leaf);border:3px solid var(--forest);position:relative}
.sg-route li:first-child .dot::after,.sg-route li:last-child .dot::after{background:var(--forest)}
.sg-route li>span:last-child{padding-bottom:.85rem;font-size:.92rem;color:var(--muted)}
.sg-route b{display:block;color:var(--ink);font-size:1rem}
.sg-route .link{justify-self:start;margin-top:.3rem;color:var(--forest)}
@media (max-width:420px){.sg-route li{grid-template-columns:78px 18px minmax(0,1fr)}}

/* finder */
body.style-sungai .finder{margin:0 0 3.5rem}
body.style-sungai .finder form{background:var(--ink);border:0;border-radius:18px;box-shadow:none}
body.style-sungai .finder label{color:#B9C7BE}
body.style-sungai .finder select{background:#FFFFFF;border:0}

/* in short */
body.style-sungai .band--quick{padding-block:1rem 4rem}
body.style-sungai .quick{background:transparent;border:0;border-top:3px solid var(--ink);border-radius:0;padding:1.4rem 0 0}

/* destinations: cards */
body.style-sungai .band--dest{background:var(--leaf)}
body.style-sungai .reaches{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem;border:0}
body.style-sungai .reach{grid-template-columns:1fr;gap:.55rem;padding:1.4rem;border:1px solid var(--line);border-radius:16px;background:var(--mist);align-content:start}
body.style-sungai .reach>*{grid-column:auto}
body.style-sungai .reach .km{display:flex;flex-wrap:wrap;gap:.35rem;align-items:baseline;font-size:.78rem}
body.style-sungai .reach .km b{display:inline;font:500 .78rem var(--f-mono);color:var(--muted)}
body.style-sungai .reach .km b::before{content:"from "}
body.style-sungai .reach .km b::after{content:" ·"}
body.style-sungai .reach h3{font-family:var(--f-display);font-weight:400;font-size:1.4rem;line-height:1.2}
body.style-sungai .reach .go{color:var(--forest)}

/* popular tours: light, borderless cards */
body.style-sungai .band--tours{background:var(--mist);color:var(--ink)}
body.style-sungai .band--tours .eyebrow,body.style-sungai .band--tours .link{color:var(--forest)}
body.style-sungai .tour{border:0;background:transparent;border-radius:0;overflow:visible}
body.style-sungai .tour .scene{border-radius:14px}
body.style-sungai .tour-b{padding:1rem 0 0}
body.style-sungai .tour .days{background:var(--leaf);color:var(--forest);font-family:var(--f-mono);font-weight:500;font-size:.85rem;border-radius:8px}
body.style-sungai .tour-f{border-top:0;padding-top:.2rem}
body.style-sungai .tour-f .btn{display:none}

/* open trip: river teal band */
body.style-sungai .band--opentrip{background:var(--forest)}
body.style-sungai .band--opentrip .eyebrow{color:#F3C18F}
body.style-sungai .band--opentrip .lede{color:#CFE2DE}
body.style-sungai .band--opentrip .seat{background:rgba(255,255,255,.15);color:#FFFFFF}
body.style-sungai .band--opentrip .seat--low{background:#F3C18F;color:#1A120B}

/* why, steps, faq */
body.style-sungai .mosaic .scene{border-radius:14px}
body.style-sungai .facts div{border-top-color:var(--sun)}
body.style-sungai .band--steps{background:var(--leaf);padding-top:clamp(3.5rem,8vw,6rem)}
body.style-sungai .pay{background:var(--mist)}
body.style-sungai .band--faq{background:var(--mist);color:var(--ink)}
body.style-sungai .band--faq .eyebrow{color:var(--forest)}
body.style-sungai .band--faq .lede{color:var(--muted)}
body.style-sungai .band--faq .faq{--line:#C9D2C7;--muted:#4F5F55;--forest:#13615F}
body.style-sungai .faq summary::after{font-family:var(--f-display)}
body.style-sungai #journal{background:var(--leaf)}
body.style-sungai .post .scene{border-radius:14px}

/* inner pages: light page header unless it shows a photo */
body.style-sungai .phero:not(.phero--photo){background:var(--leaf);color:var(--ink);border-bottom:1px solid var(--line)}
body.style-sungai .phero:not(.phero--photo)>svg{display:none}
body.style-sungai .phero:not(.phero--photo) .lede,body.style-sungai .phero:not(.phero--photo) .meta{color:var(--muted);opacity:1}
body.style-sungai .phero:not(.phero--photo) .crumbs,body.style-sungai .phero:not(.phero--photo) .crumbs a{color:var(--muted)}
body.style-sungai .phero:not(.phero--photo) .crumbs span{color:var(--ink)}
body.style-sungai .phero:not(.phero--photo) .eyebrow{color:var(--forest)}
body.style-sungai .phero:not(.phero--photo) .turl{color:var(--muted)}
body.style-sungai .gallery .scene,body.style-sungai .box{border-radius:14px}
