:root{
  --paper:#F5F3EC; --surface:#FFFFFF; --surface-2:#FBFAF5;
  --ink:#1B211C; --ink-soft:#535B52; --ink-faint:#7C837A;
  --line:#E4E0D4; --line-strong:#D5D0C0;
  --pine:#1C4634; --pine-deep:#123024;
  --ochre:#C4661F; --ochre-soft:#E8A86A; --ochre-tint:#F6E7D6;
  --good:#2F7D5B; --warn:#B4791B;
  --shadow:0 1px 2px rgba(27,33,28,.04), 0 8px 24px rgba(27,33,28,.06);
  --shadow-lg:0 2px 6px rgba(27,33,28,.06), 0 20px 44px rgba(27,33,28,.12);
  --r:14px; --maxw:1180px; --measure:66ch;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#12150F; --surface:#1A1E16; --surface-2:#181C14;
  --ink:#F0EEE4; --ink-soft:#B2B7AA; --ink-faint:#868C7F;
  --line:#2A2F24; --line-strong:#39402F;
  --pine:#84B79E; --pine-deep:#A7D0BC;
  --ochre:#E29257; --ochre-soft:#B06E33; --ochre-tint:#2A2418;
  --good:#6FBF95; --warn:#D6A24B;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 10px 26px rgba(0,0,0,.4);
  --shadow-lg:0 2px 6px rgba(0,0,0,.35), 0 24px 50px rgba(0,0,0,.5);
}}
:root[data-theme="dark"]{
  --paper:#12150F; --surface:#1A1E16; --surface-2:#181C14;
  --ink:#F0EEE4; --ink-soft:#B2B7AA; --ink-faint:#868C7F;
  --line:#2A2F24; --line-strong:#39402F;
  --pine:#84B79E; --pine-deep:#A7D0BC;
  --ochre:#E29257; --ochre-soft:#B06E33; --ochre-tint:#2A2418;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 10px 26px rgba(0,0,0,.4);
  --shadow-lg:0 2px 6px rgba(0,0,0,.35), 0 24px 50px rgba(0,0,0,.5);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{margin:0; background:var(--paper); color:var(--ink);
  font-family:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:17px; line-height:1.62; -webkit-font-smoothing:antialiased}
img{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:"Bricolage Grotesque","Instrument Sans",sans-serif; text-wrap:balance; margin:0; letter-spacing:-.01em; color:var(--ink)}
p{margin:0}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px}
.narrow{max-width:760px; margin:0 auto; padding:0 24px}
.eyebrow{font-size:.78rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--ochre); margin:0 0 .6rem}
.center{text-align:center}

/* header */
.site-head{position:sticky; top:0; z-index:60; background:color-mix(in srgb,var(--paper) 86%,transparent); backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--line)}
.head-in{display:flex; align-items:center; justify-content:space-between; gap:20px; height:68px}
.brand{display:flex; align-items:center; gap:11px; font-family:"Bricolage Grotesque"; font-weight:700; font-size:1.02rem; line-height:1.05; letter-spacing:-.02em; text-decoration:none; color:var(--ink)}
.brand .mark{width:34px; height:34px; flex:none; border-radius:9px; background:var(--pine); display:grid; place-items:center; color:#fff}
.brand .mark svg{width:20px; height:20px}
.brand small{display:block; font-family:"Instrument Sans"; font-weight:500; font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint)}
.nav{display:flex; align-items:center; gap:4px}
.nav a{text-decoration:none; color:var(--ink-soft); font-weight:500; font-size:.95rem; padding:9px 12px; border-radius:9px}
.nav a:hover{color:var(--ink); background:var(--surface-2)}
.nav a[aria-current]{color:var(--ink)}
.nav a.book{background:var(--ochre); color:#fff; font-weight:600; padding:9px 18px; margin-left:8px}
.nav a.book:hover{background:var(--ink); color:#fff}

/* buttons */
.btn{display:inline-flex; align-items:center; gap:.5em; text-decoration:none; font-weight:600; border-radius:11px; padding:13px 22px; font-size:1rem; border:0; cursor:pointer; font-family:inherit}
.btn-primary{background:var(--ochre); color:#fff}
.btn-primary:hover{background:var(--pine-deep); color:#fff}
.btn-pine{background:var(--pine); color:#fff}
.btn-pine:hover{background:var(--pine-deep)}
.btn-ghost{background:transparent; color:var(--ink); border:1px solid var(--line-strong)}
.btn-ghost:hover{background:var(--ink); color:var(--paper); border-color:var(--ink)}
.btn-full{width:100%; justify-content:center}
.btn-lg{padding:15px 26px; font-size:1.05rem}
.btn[disabled]{opacity:.6; cursor:default}

/* hero */
.hero{position:relative; overflow:hidden; border-bottom:1px solid var(--line)}
.hero-bg{position:absolute; inset:0}
.hero-bg img{width:100%; height:100%; object-fit:cover}
.hero-bg::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(18,48,36,.55),rgba(18,48,36,.8))}
.hero-in{position:relative; padding:78px 24px 66px; max-width:var(--maxw); margin:0 auto; color:#fff}
.hero .eyebrow{color:var(--ochre-soft)}
.hero h1{color:#fff; font-size:clamp(2.1rem,5.2vw,3.5rem); font-weight:800; line-height:1.02; max-width:18ch}
.hero p.lead{max-width:60ch; margin:1.1rem 0 0; color:rgba(255,255,255,.92); font-size:1.1rem}
.hero-cta{display:flex; gap:12px; flex-wrap:wrap; margin-top:1.8rem}
.hero-cta .btn-ghost{background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.4)}
.hero-cta .btn-ghost:hover{background:#fff; color:var(--pine-deep)}
.hero--slim .hero-in{padding:60px 24px 52px}
.hero--slim h1{font-size:clamp(1.9rem,4.4vw,2.9rem)}

/* sections */
section.band{padding:66px 0}
.sec-head{margin-bottom:30px; max-width:64ch}
.sec-head.center{margin-left:auto; margin-right:auto}
.sec-head h2{font-size:clamp(1.5rem,3vw,2.05rem); font-weight:700}
.sec-head p{color:var(--ink-soft); margin:.5rem 0 0}
.section-tint{background:var(--surface-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.morelink{display:inline-flex; align-items:center; gap:.5em; margin-top:30px; text-decoration:none; font-weight:600; color:var(--ink); border:1px solid var(--line-strong); border-radius:10px; padding:11px 20px}
.morelink:hover{background:var(--ink); color:var(--paper); border-color:var(--ink)}

/* cards grid */
.grid{display:grid; gap:26px; grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.grid-3{grid-template-columns:repeat(3,1fr)}
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow); transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.card:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg); border-color:var(--line-strong)}
.card-media{display:block; aspect-ratio:3/2; overflow:hidden; background:var(--surface-2)}
.card-media img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease}
.card:hover .card-media img{transform:scale(1.04)}
.card-body{padding:20px 20px 22px; display:flex; flex-direction:column; gap:9px; flex:1}
.card-name{font-size:1.24rem; font-weight:700; line-height:1.12}
.card-name a{text-decoration:none}
.card-name a:hover{color:var(--pine)}
.card-route{color:var(--ink-soft); font-size:.95rem}
.both-dir{color:var(--ochre); font-weight:600; white-space:nowrap; font-size:.86em}
.card-meta{font-variant-numeric:tabular-nums; font-size:.84rem; letter-spacing:.02em; color:var(--ink-faint); text-transform:uppercase; font-weight:600}
.card-riding{font-size:.83rem; color:var(--pine); font-weight:600; background:var(--ochre-tint); display:inline-block; padding:3px 9px; border-radius:7px; align-self:flex-start}
.card-price{font-variant-numeric:tabular-nums}
.card-price .vnd{font-family:"Bricolage Grotesque"; font-weight:700; font-size:1.18rem}
.card-price .per{color:var(--ink-faint); font-size:.85rem}
.card-price .eur{color:var(--ink-soft); font-size:.9rem; margin-left:.3rem}
.card-blurb{color:var(--ink-soft); font-size:.96rem; flex:1}
.card-cta{align-self:flex-start; margin-top:.4rem; text-decoration:none; color:var(--pine); font-weight:600; border-bottom:2px solid transparent; padding-bottom:1px}
.card-cta:hover{border-bottom-color:var(--ochre); color:var(--ochre)}
.card--feature .card-media{aspect-ratio:4/3}

/* why ride: guide photo beside the reasons */
.why{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:34px; align-items:start}
.why-photo{margin:0; position:relative; border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow); background:var(--surface-2)}
.why-photo img{display:block; width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 38%}
.why-photo figcaption{position:absolute; inset:auto 0 0 0; padding:34px 18px 14px; color:#fff; font-size:.9rem; font-weight:600; background:linear-gradient(to top,rgba(20,24,20,.72),rgba(20,24,20,0))}
.why .reasons--stack{grid-template-columns:1fr; gap:14px}
.reasons--stack .reason{display:flex; align-items:flex-start; gap:16px; padding:20px 22px}
.reasons--stack .reason .ic{flex:none; margin-bottom:0}
.reasons--stack .reason h3{font-size:1.04rem}
.reasons--stack .reason p{margin-top:.3rem}

/* reasons */
.reasons{display:grid; gap:22px; grid-template-columns:repeat(4,1fr)}
.reason{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:24px}
.reason .ic{width:40px; height:40px; border-radius:10px; background:var(--ochre-tint); color:var(--ochre); display:grid; place-items:center; margin-bottom:14px}
.reason h3{font-size:1.08rem; font-weight:700}
.reason p{color:var(--ink-soft); font-size:.94rem; margin-top:.4rem}

/* steps */
.steps{list-style:none; margin:0; padding:0; display:grid; gap:16px; grid-template-columns:repeat(4,1fr)}
.steps li{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:22px; display:flex; flex-direction:column; gap:12px}
.step-n{width:34px; height:34px; border-radius:50%; background:var(--pine); color:#fff; font-family:"Bricolage Grotesque"; font-weight:700; display:grid; place-items:center}
.steps h4{font-size:1.02rem}
.steps p{color:var(--ink-soft); font-size:.93rem; margin-top:.3rem}
.steps-note{margin:22px auto 0; max-width:70ch; color:var(--ink-soft); font-size:.95rem; background:var(--ochre-tint); border-radius:10px; padding:14px 18px}

/* tour detail */
.tourhero{position:relative; overflow:hidden}
.tourhero-bg{position:absolute; inset:0}
.tourhero-bg img{width:100%;height:100%;object-fit:cover}
.tourhero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,48,36,.45),rgba(18,48,36,.82))}
.tourhero-in{position:relative; color:#fff; max-width:var(--maxw); margin:0 auto; padding:70px 24px 44px}
.crumbs{font-size:.85rem; color:rgba(255,255,255,.75); margin-bottom:16px}
.crumbs a{color:rgba(255,255,255,.85); text-decoration:none}
.tourhero h1{color:#fff; font-size:clamp(1.9rem,4.4vw,3rem); font-weight:800; max-width:20ch}
.tourhero .route{color:var(--ochre-soft); font-weight:600; margin-top:.6rem; font-size:1.05rem}
.tourhero .tmeta{color:rgba(255,255,255,.9); margin-top:.3rem; font-variant-numeric:tabular-nums}
.tourhero .price{font-family:"Bricolage Grotesque"; font-weight:700; font-size:1.5rem; margin-top:1rem; color:#fff}
.tourhero .price small{font-weight:500; font-size:.62em; color:rgba(255,255,255,.75)}
.tourhero .btn{margin-top:1.1rem}
.dir-select{display:flex; gap:8px; flex-wrap:wrap; margin-top:1.1rem}
.dir-select .lab{align-self:center; font-size:.85rem; color:rgba(255,255,255,.8); margin-right:4px}
.dir-select a{background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.35); color:#fff; text-decoration:none; padding:7px 14px; border-radius:20px; font-size:.9rem; font-weight:600}

.tsec{padding:52px 0; border-bottom:1px solid var(--line)}
.tsec h2{font-size:1.5rem; margin-bottom:18px}
.glance{display:grid; gap:1px; grid-template-columns:repeat(4,1fr); background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
.glance div{background:var(--surface); padding:16px 18px}
.glance dt{font-size:.74rem; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-faint); font-weight:600}
.glance dd{margin:.25rem 0 0; font-weight:600; font-variant-numeric:tabular-nums}
.prose{max-width:var(--measure); color:var(--ink-soft)}
.prose p{margin:0 0 1rem}
.prose h3{color:var(--ink); margin:1.6rem 0 .5rem}
.itin{display:flex; flex-direction:column; gap:26px}
.day{display:grid; grid-template-columns:auto 1fr; gap:20px}
.day-n{font-family:"Bricolage Grotesque"; font-weight:700; color:var(--ochre); font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; padding-top:3px; white-space:nowrap}
.day h3{font-size:1.15rem}
.day p{color:var(--ink-soft); margin-top:.35rem; max-width:60ch}
.incexc{display:grid; grid-template-columns:1fr 1fr; gap:26px}
.inclist{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px}
.inclist li{display:flex; gap:10px; align-items:flex-start; color:var(--ink-soft); font-size:.97rem}
.inclist .yes{color:var(--good); font-weight:700}
.inclist .no{color:var(--ink-faint); font-weight:700}
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:26px}
.opt-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:22px}
.opt-card h3{font-size:1.1rem}
.opt-card p{color:var(--ink-soft); margin-top:.4rem; font-size:.96rem}
.op-card{background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r); padding:24px; max-width:var(--measure)}
.op-card .op-name{font-family:"Bricolage Grotesque"; font-weight:700; font-size:1.15rem}
.op-card p{color:var(--ink-soft); margin-top:.5rem}
.op-card .op-sub{font-size:.88rem; color:var(--ink-faint); margin-top:.8rem}

/* gallery */
.gallery{columns:3; column-gap:14px}
.gallery img{width:100%; border-radius:10px; margin-bottom:14px; break-inside:avoid; background:var(--surface-2)}

/* faq */
.faq{max-width:var(--measure)}
.faq details{border-bottom:1px solid var(--line); padding:4px 0}
.faq summary{cursor:pointer; font-weight:600; padding:14px 0; list-style:none; display:flex; justify-content:space-between; gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; color:var(--ochre); font-size:1.3rem; line-height:1}
.faq details[open] summary::after{content:"–"}
.faq p{color:var(--ink-soft); padding:0 0 16px; max-width:62ch}

/* notice */
.notice{background:var(--ochre-tint); border:1px solid color-mix(in srgb,var(--ochre) 30%,transparent); border-radius:10px; padding:14px 18px; color:var(--ink); font-size:.95rem; display:flex; gap:10px; margin:0 0 4px}
.notice.pine{background:color-mix(in srgb,var(--pine) 10%,var(--surface)); border-color:color-mix(in srgb,var(--pine) 25%,transparent)}

/* guides */
.guide-grid{display:grid; gap:22px; grid-template-columns:repeat(3,1fr)}
.guide{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow)}
.guide img{aspect-ratio:1/1; object-fit:cover; width:100%; background:var(--surface-2)}
.guide .g-body{padding:18px 20px 22px}
.guide h3{font-size:1.15rem}
.guide .g-meta{color:var(--ochre); font-weight:600; font-size:.88rem; margin-top:.2rem}
.guide p{color:var(--ink-soft); font-size:.94rem; margin-top:.5rem}

/* reviews */
.rev-grid{columns:3; column-gap:18px}
.rev-grid figure{margin:0 0 18px; break-inside:avoid; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--surface); box-shadow:var(--shadow)}
.rev-grid img{width:100%}

/* booking form */
.book-layout{display:grid; grid-template-columns:1.3fr .9fr; gap:34px; align-items:start}
.book-form{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:28px; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:20px}
.fg{display:flex; flex-direction:column; gap:7px}
.fg label{font-weight:600; font-size:.95rem}
.fg .note{font-weight:400; color:var(--ink-faint); font-size:.85em}
.fg input,.fg select{font-family:inherit; font-size:1rem; padding:12px 14px; border:1px solid var(--line-strong); border-radius:10px; background:var(--surface-2); color:var(--ink)}
.fg input:focus,.fg select:focus{outline:2px solid var(--ochre); outline-offset:1px; border-color:var(--ochre)}
.fg .err{color:#c0392b; font-size:.85rem; min-height:1em}
.input-error{border-color:#c0392b !important}
.stepper{display:inline-flex; align-items:center; gap:0; border:1px solid var(--line-strong); border-radius:10px; overflow:hidden; align-self:flex-start; background:var(--surface-2)}
.stepper-btn{border:0; background:transparent; font-size:1.3rem; width:46px; height:46px; cursor:pointer; color:var(--ink)}
.stepper-btn:hover{background:var(--ochre-tint)}
.stepper-value{min-width:46px; text-align:center; font-weight:700; font-variant-numeric:tabular-nums}
.toggle-group{display:flex; gap:10px}
.toggle-option{flex:1; position:relative; cursor:pointer}
.toggle-option input{position:absolute; opacity:0}
.toggle-label{display:block; text-align:center; padding:12px; border:1px solid var(--line-strong); border-radius:10px; background:var(--surface-2); font-weight:600; font-size:.95rem}
.toggle-option input:checked + .toggle-label{border-color:var(--ochre); background:var(--ochre-tint); color:var(--ink)}
.toggle-note{color:var(--ink-faint); font-size:.85rem}
.pricebox{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:24px; box-shadow:var(--shadow); position:sticky; top:88px}
.pricebox h3{font-size:1.1rem; margin-bottom:14px}
.price-summary{flex-direction:column}
.prow{display:flex; justify-content:space-between; gap:12px; padding:7px 0; font-variant-numeric:tabular-nums}
.prow.total{border-top:1px solid var(--line); margin-top:6px; padding-top:12px; font-size:1.05rem; font-weight:700}
.prow.dep{color:var(--ochre); font-weight:700}
.prow .muted{color:var(--ink-faint)}
.price-note{color:var(--ink-faint); font-size:.85rem; margin-top:12px}
.submit-note{color:var(--ink-faint); font-size:.85rem; margin-top:2px}
.book-warn{background:var(--pine); color:#fff; border-radius:10px; padding:12px 16px; font-size:.92rem; font-weight:500}

/* modals */
.modal-overlay{position:fixed; inset:0; background:rgba(18,33,28,.6); backdrop-filter:blur(3px); z-index:100; display:none; align-items:center; justify-content:center; padding:20px}
.modal-overlay.active{display:flex}
.modal-box{background:var(--surface); border-radius:16px; max-width:440px; width:100%; padding:30px; box-shadow:var(--shadow-lg); text-align:center; max-height:90vh; overflow:auto}
.modal-box h2{font-size:1.4rem}
.modal-box p{color:var(--ink-soft); margin-top:.6rem}
.modal-amount{font-family:"Bricolage Grotesque"; font-weight:700; font-size:2rem; margin:16px 0; color:var(--ink)}
.confirm-row{display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--line); text-align:left; font-size:.95rem}
.confirm-deposit-row{border-bottom:0; font-size:1.05rem; padding-top:14px}
.confirm-deposit-amt{color:var(--ochre)}
.btn-modal-cancel{background:transparent; border:0; color:var(--ink-faint); font-family:inherit; cursor:pointer; margin-top:10px; font-size:.92rem; text-decoration:underline}
.modal-success-icon{width:56px; height:56px; border-radius:50%; background:var(--good); color:#fff; display:grid; place-items:center; margin:0 auto 8px; font-size:1.6rem}
.btn-whatsapp-reveal{display:inline-flex; align-items:center; gap:8px; background:#25D366; color:#fff; text-decoration:none; font-weight:600; padding:12px 20px; border-radius:11px; margin-top:14px}

/* prose pages */
.page-prose{max-width:var(--measure); margin:0 auto; padding:56px 24px 70px}
.page-prose h1{font-size:clamp(1.8rem,4vw,2.5rem); margin-bottom:.6rem}
.page-prose .updated{color:var(--ink-faint); font-size:.9rem; margin-bottom:24px}
.page-prose h2{font-size:1.35rem; margin:2rem 0 .6rem}
.page-prose p,.page-prose li{color:var(--ink-soft)}
.page-prose ul{padding-left:1.2rem}
.page-prose a{color:var(--pine); text-decoration:underline}

/* article cards */
.art-grid{display:grid; gap:24px; grid-template-columns:repeat(3,1fr)}
.art{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow); display:flex; flex-direction:column}
.art .art-media{aspect-ratio:16/10; background:var(--surface-2); overflow:hidden}
.art .art-media img{width:100%;height:100%;object-fit:cover}
.art .art-body{padding:20px; display:flex; flex-direction:column; gap:8px; flex:1}
.art h3{font-size:1.15rem}
.art p{color:var(--ink-soft); font-size:.94rem; flex:1}
.art a.card-cta{color:var(--pine); font-weight:600; text-decoration:none}

/* footer */
footer{background:var(--pine-deep); color:rgba(255,255,255,.82); margin-top:0}
.foot-in{max-width:var(--maxw); margin:0 auto; padding:56px 24px 30px; display:grid; gap:34px; grid-template-columns:1.4fr 1fr 1fr 1fr}
footer h4{font-family:"Instrument Sans"; font-size:.76rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ochre-soft); margin:0 0 14px}
footer a,.foot-op,.foot-op-sub{color:rgba(255,255,255,.82); text-decoration:none; display:block; padding:4px 0; font-size:.95rem}
footer a:hover{color:#fff}
.foot-op{font-weight:600; color:#fff}
.foot-op-sub{color:rgba(255,255,255,.6); font-size:.9rem; padding-top:0}
.foot-brand .brand{color:#fff}
.foot-brand p{font-size:.92rem; margin:14px 0 0; max-width:34ch; color:rgba(255,255,255,.72)}
.foot-note{max-width:var(--maxw); margin:0 auto; padding:22px 24px 44px; border-top:1px solid rgba(255,255,255,.14); font-size:.84rem; color:rgba(255,255,255,.6)}

/* sticky mobile cta */
.mcta{display:none; position:fixed; left:0; right:0; bottom:0; z-index:70; background:var(--surface); border-top:1px solid var(--line); padding:10px 16px calc(10px + env(safe-area-inset-bottom)); box-shadow:0 -6px 20px rgba(0,0,0,.08); align-items:center; justify-content:space-between; gap:12px}
.mcta .m-price{font-family:"Bricolage Grotesque"; font-weight:700; font-variant-numeric:tabular-nums}
.mcta .m-price small{display:block; font-weight:500; font-size:.7rem; color:var(--ink-faint)}
.mcta .btn{padding:11px 18px}

body.no-scroll{overflow:hidden}
a:focus-visible, summary:focus-visible, button:focus-visible{outline:3px solid var(--ochre); outline-offset:3px; border-radius:6px}
@media (prefers-reduced-motion:reduce){*{transition:none !important; scroll-behavior:auto}}

@media (max-width:980px){
  .why{grid-template-columns:1fr}
  .why-photo img{aspect-ratio:4/3}
  .reasons{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
  .glance{grid-template-columns:1fr 1fr}
  .book-layout{grid-template-columns:1fr}
  .guide-grid,.art-grid,.grid-3{grid-template-columns:1fr 1fr}
  .foot-in{grid-template-columns:1fr 1fr}
  .pricebox{position:static}
}
@media (max-width:680px){
  body{font-size:16px}
  .nav{display:none}
  .grid,.grid-3{grid-template-columns:1fr}
  .reasons,.steps,.incexc,.two-col{grid-template-columns:1fr}
  .glance{grid-template-columns:1fr 1fr}
  .guide-grid,.art-grid{grid-template-columns:1fr}
  .gallery,.rev-grid{columns:2}
  .day{grid-template-columns:1fr; gap:6px}
  .hero-in{padding:56px 22px 46px}
  .mcta{display:flex}
  body.has-mcta{padding-bottom:76px}
}

/* ---- carousel: swipe / click through cards when they no longer fit side by side ---- */
.carousel-nav{display:none}
@media (max-width:980px){
  .carousel-track{display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding-bottom:4px}
  .carousel-track::-webkit-scrollbar{display:none}
  .carousel-track>*{flex:0 0 46%; scroll-snap-align:start}
  .carousel-nav{display:flex; align-items:center; justify-content:center; gap:14px; margin-top:20px}
  .carousel-btn{width:40px; height:40px; padding:0; border:1px solid var(--line-strong); border-radius:50%; background:var(--surface); color:var(--ink); font-size:1.05rem; line-height:1; display:grid; place-items:center; cursor:pointer}
  .carousel-btn:hover{background:var(--ink); color:var(--paper); border-color:var(--ink)}
  .carousel-btn[disabled]{opacity:.35; cursor:default}
  .carousel-btn[disabled]:hover{background:var(--surface); color:var(--ink); border-color:var(--line-strong)}
  .carousel-dots{display:flex; align-items:center; gap:8px}
  .carousel-dot{width:8px; height:8px; padding:0; border:0; border-radius:50%; background:var(--line-strong); cursor:pointer; transition:width .18s ease, background .18s ease}
  .carousel-dot[aria-current="true"]{width:22px; border-radius:4px; background:var(--ochre)}
}
@media (max-width:680px){
  .carousel-track>*{flex:0 0 82%}
}

/* ---- guest-book marquee + typed quotes ---- */
.quotes{display:grid; gap:20px; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); margin-top:4px}
.quote{margin:0; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:22px 24px; box-shadow:var(--shadow)}
.quote blockquote{margin:0; font-size:1.02rem; line-height:1.62; color:var(--ink)}
.quote blockquote::before{content:"\201C"; color:var(--ochre); font-size:1.4em; line-height:0; vertical-align:-.15em; margin-right:.08em}
.quote figcaption{margin-top:14px; color:var(--ochre); font-weight:600; font-size:.9rem}
.quote .q-year{color:var(--ink-faint); font-weight:500}
.marquee{overflow:hidden; margin-top:34px; -webkit-mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent); mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent)}
.marquee-track{display:flex; gap:18px; width:max-content; animation:drift 80s linear infinite}
.marquee:hover .marquee-track,.marquee:focus-within .marquee-track{animation-play-state:paused}
.marquee img{display:block; height:240px; width:320px; object-fit:cover; border-radius:12px; border:1px solid var(--line); box-shadow:var(--shadow); background:var(--surface-2)}
@keyframes drift{from{transform:translateX(0)} to{transform:translateX(calc(-50% - 9px))}}
@media (max-width:680px){.marquee img{height:180px; width:240px}}
@media (prefers-reduced-motion:reduce){
  .marquee{overflow-x:auto; scrollbar-width:none}
  .marquee::-webkit-scrollbar{display:none}
  .marquee-track{animation:none}
}

/* ---- mobile menu ---- */
.head-mobile{display:none; align-items:center; gap:10px}
.menu-toggle{width:44px; height:44px; margin-right:-10px; padding:0; border:0; background:none; color:var(--ink); cursor:pointer; align-items:center; justify-content:center; flex:none}
.menu-toggle .bars{position:relative; display:block; width:20px; height:14px}
.menu-toggle .bars span{position:absolute; left:0; width:100%; height:2px; border-radius:2px; background:currentColor; transition:transform .2s ease, opacity .2s ease}
.menu-toggle .bars span:nth-child(1){top:0}
.menu-toggle .bars span:nth-child(2){top:6px}
.menu-toggle .bars span:nth-child(3){top:12px}
.menu-toggle[aria-expanded="true"] .bars span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] .bars span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] .bars span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.mobile-nav{display:none; background:var(--paper); border-top:1px solid var(--line); max-height:calc(100vh - 68px); overflow-y:auto}
.mobile-nav .wrap{display:flex; flex-direction:column; padding-top:6px; padding-bottom:20px}
.mobile-nav a{display:block; padding:15px 2px; text-decoration:none; color:var(--ink); font-weight:600; font-size:1.05rem; border-bottom:1px solid var(--line)}
.mobile-nav a[aria-current]{color:var(--ochre)}
.mobile-nav a.book{display:none}
.mobile-nav a.mn-book{margin-top:16px; padding:14px 18px; background:var(--ochre); color:#fff; text-align:center; border-radius:11px; border-bottom:0}
@media (max-width:680px){
  .head-mobile{display:flex}
  .menu-toggle{display:inline-flex}
  .mobile-nav:not([hidden]){display:block}
}

/* ---- "most popular" flag on tour cards (tours overview only) ---- */
.card{position:relative}
.card-badge{position:absolute; top:12px; left:12px; z-index:2; background:var(--ochre); color:#fff; font-family:"Instrument Sans"; font-size:.7rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; padding:6px 11px; border-radius:999px; box-shadow:0 2px 8px rgba(27,33,28,.25)}
