/* Amin Tours — engine styles shared with the sibling build, re-skinned at the END of this file
(see "AMIN TOURS — the skin"). Fonts: Outfit + Manrope · Palette: navy + terracotta */
:root{
--ink:#171B23;
--body:#3A4150;
--muted:#6D7484;
--accent:#13544A;
--accent-dark:#0D3F38;
--accent-deep:#082E29;
--accent-tint:#E6EFEC;
--accent-soft:#F1F7F5;
--ivory:#FAF9F5;
--sand:#F4F2EA;
--border:#E8E5DC;
--white:#ffffff;
--green:#2E7D43;
--red:#A0392E;
--laurel:#9C8B5D;
--serif:'Fraunces',Georgia,'Times New Roman',serif;
--sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
--maxw:1140px;
--radius:12px;
--shadow:0 1px 2px rgba(23,27,35,.05),0 10px 30px rgba(23,27,35,.07);
--shadow-lift:0 3px 6px rgba(23,27,35,.07),0 18px 50px rgba(23,27,35,.13);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--sans);color:var(--body);background:var(--white);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--accent-dark);text-decoration:none}
a:hover{color:var(--accent-deep)}
.container{max-width:var(--maxw);margin:0 auto;padding:0 22px}
h1,h2,h3,.serif{font-family:var(--serif);color:var(--ink);font-weight:600;line-height:1.18;letter-spacing:-.01em}
h1{font-size:clamp(2rem,4.4vw,3.2rem)}
h2{font-size:clamp(1.5rem,3vw,2.15rem)}
h3{font-size:1.2rem}
.eyebrow{font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:12px}
.accent-rule{width:52px;height:3px;background:var(--accent);border:0;border-radius:2px;margin:18px 0}
.center{text-align:center}
.center .accent-rule{margin-left:auto;margin-right:auto}
/* ============ header ============ */
.site-header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.topbar{background:var(--ink);color:#d6d3c8;font-size:.78rem}
.topbar .container{display:flex;justify-content:space-between;align-items:center;min-height:34px;gap:14px}
.topbar a{color:#d6d3c8}
.topbar a:hover{color:#fff}
/* one line, always — it is a strip, not a paragraph */
.topbar .tb-award{color:#E4CE97;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.topbar .tb-right{display:flex;gap:18px;white-space:nowrap}
.nav-row{display:flex;align-items:center;justify-content:space-between;min-height:78px;gap:18px}
.brand-link img{height:26px;width:auto}
.brand-sub{font-size:.62rem;letter-spacing:.34em;text-transform:uppercase;color:var(--muted);display:block;margin-top:4px}
nav.main-nav{display:flex;align-items:center;gap:28px}
nav.main-nav a{color:var(--ink);font-size:.93rem;font-weight:500}
nav.main-nav a:hover,nav.main-nav a[aria-current]{color:var(--accent)}
.nav-cta{background:var(--accent);color:#fff !important;padding:11px 22px;border-radius:999px;font-weight:600;font-size:.9rem}
.nav-cta:hover{background:var(--accent-dark)}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:8px}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0}
@media(max-width:940px){
.topbar .tb-award{display:none}
.nav-toggle{display:block}
nav.main-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--border);flex-direction:column;align-items:flex-start;padding:18px 22px;gap:16px;box-shadow:var(--shadow)}
nav.main-nav.open{display:flex}
}
/* ============ hero ============ */
.hero{position:relative;color:#fff;min-height:560px;display:flex;align-items:center;isolation:isolate;overflow:hidden}
.hero .hero-bg{position:absolute;inset:0;background-size:cover;background-position:72% 62%;z-index:-2}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(96deg,rgba(8,14,12,.86) 0%,rgba(8,14,12,.74) 34%,rgba(8,14,12,.30) 58%,rgba(8,14,12,0) 80%);z-index:-1}
.hero .container{padding-top:84px;padding-bottom:96px;width:100%}
.hero .container>*{max-width:470px}
.hero .eyebrow{color:#BCDDD2}
/* the headline is two full sentences, each meant to hold its own line, so it needs
more room than the narrow 470px column the list and buttons sit in */
.hero h1{color:#fff;font-size:clamp(1.9rem,3.4vw,2.7rem);text-shadow:0 2px 24px rgba(0,0,0,.4)}
/* .hero .container>* caps every child at 470px; the headline needs to outrank that */
.hero .container>h1{max-width:min(900px,100%)}
/* the headline is two sentences and the break between them is the line itself — it holds
on a phone too, where the second sentence starts a new line rather than running on */
.hero h1 .h1-line2{display:block}
.hero p.lead{font-size:1.08rem;margin-top:18px;color:#EDEBE2;text-shadow:0 1px 14px rgba(0,0,0,.45)}
/* the hero carries a short list instead of a paragraph. One column: the hero text
sits in a narrow column, and two columns wrapped every point onto two lines. */
.hero-ticks{list-style:none;display:grid;gap:8px;margin-top:20px;font-size:.92rem;
font-weight:500;color:#F1EFE6;text-shadow:0 1px 12px rgba(0,0,0,.45)}
.hero-ticks li{display:flex;gap:9px;align-items:flex-start;line-height:1.35}
.hero-ticks li::before{content:"✓";color:#8CC9B8;font-weight:700;flex:none}
.hero-ticks li.wide{font-weight:700;color:#fff}
@media(max-width:820px){.hero .hero-bg{background-position:60% 62%}.hero::after{background:linear-gradient(180deg,rgba(8,14,12,.55) 0%,rgba(8,14,12,.8) 100%)}.hero .container>*{max-width:none}}
.btn-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.btn{display:inline-block;padding:14px 30px;border-radius:999px;font-weight:600;font-size:.96rem;border:1.5px solid transparent;cursor:pointer;transition:.15s;font-family:var(--sans)}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-dark);color:#fff}
.btn-light{background:#fff;color:var(--ink)}
.btn-light:hover{background:var(--ivory);color:var(--ink)}
.btn-ghost{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-ghost:hover{background:var(--ink);color:#fff}
.btn-whatsapp{background:#1FA855;color:#fff}
.btn-whatsapp:hover{background:#178A45;color:#fff}
.btn[disabled]{opacity:.55;cursor:not-allowed}
/* ============ awards ============ */
.awards-strip{background:var(--ivory);border-bottom:1px solid var(--border)}
/* the three awards must sit on ONE line on desktop — tighter gaps and type buy the
room, and the badge keeps its size. Below 1080px they wrap, which is fine. */
.awards-strip .container{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 32px;padding-top:20px;padding-bottom:20px}
.award{display:flex;align-items:center;gap:11px}
.award svg{width:40px;height:40px;flex:none}
.aw-badge{width:auto;height:52px;flex:none}
/* each company's own mark, sized so the three read as one row */
.aw-logo{width:auto;flex:none;display:block}
.aw-logo.via{height:21px}
.aw-logo.gyg{height:34px}
.award-chip .aw-logo.via{height:13px}
.award-chip .aw-logo.gyg{height:19px}
/* Hero: this year's award only — the badge is gold on transparency, so no white
or black paper block sits on the photograph. Earlier years live in the footer. */
.hero-award{display:inline-flex;align-items:center;gap:16px;margin-top:22px;padding:12px 22px 12px 16px;
background:linear-gradient(120deg,rgba(212,168,60,.20),rgba(212,168,60,.06));
border:1px solid rgba(212,168,60,.55);border-radius:14px;
box-shadow:0 0 0 1px rgba(0,0,0,.10) inset,0 10px 28px rgba(0,0,0,.22);
backdrop-filter:blur(4px);width:max-content;max-width:100%}
.hero-award img{height:64px;width:auto;flex:none;
filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}
.hero-award span{display:flex;flex-direction:column;line-height:1.35;font-size:.8rem;color:#E7D9B6}
.hero-award b{font-family:var(--serif);font-size:1.06rem;color:#F3DFAE;letter-spacing:.01em}
@media(max-width:820px){.hero-award{width:auto;gap:12px;padding:10px 16px 10px 12px}
.hero-award img{height:52px;width:auto}}
.award .aw-text small{display:block;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:600}
.award .aw-text strong{font-family:var(--serif);font-size:.93rem;color:var(--ink);font-weight:600}
/* nowrap only where the one-line strip is the goal — on a phone it must be free to wrap */
@media(min-width:900px){.award .aw-text strong{white-space:nowrap}}
.awards-inline{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.award-chip{display:inline-flex;align-items:center;gap:7px;background:var(--ivory);border:1px solid var(--border);border-radius:999px;padding:6px 14px;font-size:.78rem;font-weight:600;color:var(--ink)}
.award-chip svg{width:15px;height:15px}
/* the badge is a 200x220 artwork — inside a pill it has to come down to chip size */
.award-chip .aw-badge{height:26px}
/* ============ sections ============ */
section.block{padding:76px 0}
section.block.tint{background:var(--ivory);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.section-head{margin-bottom:40px;max-width:66ch}
/* ============ tour cards (compact, OTA-style) ============ */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(252px,1fr));gap:20px}
.tour-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:.18s;box-shadow:var(--shadow)}
.tour-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.tc-media{position:relative;aspect-ratio:16/10;background:linear-gradient(135deg,#eceadf,#ddd8c6);overflow:hidden;display:block}
.tc-media .tc-art{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .5s}
.tour-card:hover .tc-art{transform:scale(1.045)}
.tc-flag{position:absolute;top:10px;left:10px;background:rgba(23,27,35,.85);color:#fff;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:999px;font-weight:600;z-index:1}
.tc-duration{position:absolute;top:10px;right:10px;background:rgba(255,255,255,.95);color:var(--ink);font-size:.68rem;font-weight:700;padding:4px 10px;border-radius:999px;z-index:1}
.tc-body{padding:14px 16px 15px;display:flex;flex-direction:column;flex:1}
/* Every card reserves exactly two lines for the title, whether or not the title fills
them. That is what makes Duration and Route start at the same height right across a
row — the ragged look came from one-line titles sitting beside two-line ones. */
.tc-body h3{font-size:.99rem;margin-bottom:5px;line-height:1.3;min-height:2.6em;
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tc-body h3 a{color:var(--ink)}
.tc-body h3 a:hover{color:var(--accent)}
.tc-route{font-size:.78rem;color:var(--muted);flex:1;letter-spacing:.01em}
.tc-foot{display:flex;justify-content:space-between;align-items:flex-end;margin-top:10px;padding-top:10px;border-top:1px solid var(--border)}
.tc-price small{display:block;font-size:.62rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:600}
.tc-price strong{font-family:var(--serif);font-size:1.16rem;color:var(--accent-dark)}
.tc-price span{font-size:.72rem;color:var(--muted)}
.tc-more{font-size:.8rem;font-weight:700;color:var(--accent);white-space:nowrap}
/* ============ trust ============ */
.trust-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:26px}
.trust-item{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:26px}
.trust-item .ti-num{font-family:var(--serif);font-size:1.8rem;color:var(--accent);font-weight:600}
.trust-item h3{font-size:1.02rem;margin:8px 0 7px}
.trust-item p{font-size:.88rem;color:var(--muted)}
/* ============ breadcrumbs ============ */
.crumbs{font-size:.8rem;color:var(--muted);padding:16px 0 0}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--accent)}
.crumbs span[aria-current]{color:var(--ink);font-weight:600}
/* ============ product page ============ */
.product-hero{padding:20px 0 30px}
.ph-meta{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px}
.chip{background:var(--ivory);border:1px solid var(--border);border-radius:999px;font-size:.79rem;padding:6px 14px;color:var(--body);font-weight:500}
.chip strong{color:var(--ink)}
.chip.chip-accent{background:var(--accent-tint);border-color:#cfe5de;color:var(--accent-deep)}
/* gallery */
.gallery{display:grid;grid-template-columns:2.05fr 1fr 1fr;grid-template-rows:210px 210px;gap:10px;border-radius:var(--radius);overflow:hidden;margin-top:22px}
.gallery a,.gallery button.lb-open{display:block;position:relative;overflow:hidden;padding:0;border:0;background:none;cursor:zoom-in}
.gallery a:first-child{grid-row:1/3}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.gallery a:hover img,.gallery button:hover img{transform:scale(1.04)}
.gallery.cells-5 a:first-child,.gallery.cells-5 button:first-child{grid-row:1/3}
.gallery.cells-4{grid-template-columns:2.05fr 1fr 1fr}
.gallery.cells-4 button:first-child{grid-row:1/3}
.gallery.cells-4 button:nth-child(4){grid-column:2/4}
.gallery.cells-3{grid-template-columns:2.05fr 1fr}
.gallery.cells-3 button:first-child{grid-row:1/3}
.gallery.cells-2{grid-template-columns:1fr 1fr;grid-template-rows:300px}
.gallery.cells-1{grid-template-columns:1fr;grid-template-rows:340px}
@media(max-width:760px){.gallery{grid-template-columns:1fr 1fr;grid-template-rows:220px 110px}.gallery a:first-child,.gallery button:first-child{grid-column:1/3;grid-row:1}.gallery a:nth-child(n+4),.gallery button:nth-child(n+4){display:none}}
/* ---- Best Seller medal ----------------------------------------------------
Sits over the first gallery photograph on a best-selling tour. The badge is
fully visible in plain HTML; only the drop-in and the shine sweep are gated on
`.motion`, so a crawler, a reader mode, or a failed script still sees it. */
.gallery{position:relative}
.bs-medal{
position:absolute;top:14px;left:14px;z-index:3;pointer-events:none;
display:flex;align-items:center;gap:10px;overflow:hidden;
padding:8px 16px 8px 11px;border-radius:999px;
background:linear-gradient(180deg,rgba(8,46,41,.84),rgba(8,46,41,.95));
border:1px solid rgba(220,183,85,.62);
box-shadow:0 8px 26px rgba(8,20,18,.40),inset 0 1px 0 rgba(255,255,255,.10);
-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
/* where a tour has no gallery the medal drops under the headline instead */
.bs-medal.bsm-inline{position:static;display:inline-flex;margin-top:14px}
.bs-medal .bsm-ico{flex:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.38))}
.bsm-txt{display:flex;flex-direction:column;line-height:1.16}
.bsm-txt b{font-family:var(--serif);font-size:1rem;font-weight:600;color:#F7E7B4;letter-spacing:.01em}
.bsm-txt small{font-size:.66rem;letter-spacing:.11em;text-transform:uppercase;color:rgba(255,255,255,.64)}
/* the sweep is parked off the left edge and clipped, so it is invisible when still */
.bsm-shine{position:absolute;inset:0;pointer-events:none;transform:translateX(-130%);
background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,.40) 49%,transparent 64%)}
@media (prefers-reduced-motion: no-preference){
.motion .bs-medal{animation:bsm-drop .74s cubic-bezier(.2,.9,.28,1.1) .38s backwards}
.motion .bs-medal .bsm-shine{animation:bsm-shine 1.6s ease-in-out 1.25s 2}
}
@keyframes bsm-drop{
0% {opacity:0;transform:translateY(-16px) scale(.8) rotate(-9deg)}
58% {opacity:1;transform:translateY(0) scale(1.07) rotate(2.5deg)}
100%{opacity:1;transform:none}
}
@keyframes bsm-shine{0%{transform:translateX(-130%)}58%,100%{transform:translateX(150%)}}
@media(max-width:560px){
.bs-medal{top:10px;left:10px;gap:8px;padding:6px 13px 6px 9px}
.bs-medal .bsm-ico{width:22px;height:26px}
.bsm-txt b{font-size:.88rem}
.bsm-txt small{font-size:.6rem}
}
.product-layout{display:grid;grid-template-columns:minmax(0,1fr) 372px;gap:48px;padding:40px 0 84px;align-items:start}
@media(max-width:980px){.product-layout{grid-template-columns:1fr}}
.p-section{margin-bottom:44px}
.p-section>h2{display:flex;align-items:center;gap:14px;margin-bottom:20px;font-size:1.45rem}
.p-section>h2::after{content:"";height:1px;background:var(--border);flex:1}
.p-section p+p{margin-top:14px}
/* highlights */
.highlights{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 26px}
@media(max-width:640px){.highlights{grid-template-columns:1fr}}
.highlights li{padding-left:26px;position:relative;font-size:.95rem}
.highlights li::before{content:"";position:absolute;left:2px;top:.52em;width:10px;height:10px;border-radius:50%;background:var(--accent-tint);border:2.5px solid var(--accent)}
/* details table */
.details-table{width:100%;border:1px solid var(--border);border-radius:var(--radius);border-collapse:separate;border-spacing:0;overflow:hidden;font-size:.92rem}
.details-table th{background:var(--ivory);text-align:left;font-weight:600;color:var(--ink);width:31%;vertical-align:top}
.details-table th,.details-table td{padding:11px 16px;border-top:1px solid var(--border)}
.details-table tr:first-child th,.details-table tr:first-child td{border-top:0}
.details-table td{white-space:pre-line}
/* itinerary accordion */
.itin-acc{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.itin-acc details{border-top:1px solid var(--border)}
.itin-acc details:first-child{border-top:0}
.itin-acc summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:14px;padding:17px 20px;background:var(--ivory);font-family:var(--serif);font-size:1.06rem;font-weight:600;color:var(--ink)}
.itin-acc summary::-webkit-details-marker{display:none}
.itin-acc summary .day-chip{flex:none;background:var(--accent);color:#fff;font-family:var(--sans);font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;border-radius:999px;padding:5px 12px}
.itin-acc summary::after{content:"+";margin-left:auto;color:var(--accent);font-size:1.3rem;font-family:var(--sans)}
.itin-acc details[open] summary::after{content:"–"}
.itin-body{padding:6px 22px 18px}
.stop{padding:14px 0;border-bottom:1px dashed var(--border)}
.stop:last-child{border-bottom:0}
.stop h3{color:var(--accent-dark);font-size:1.02rem;margin-bottom:6px}
.stop p{font-size:.94rem;white-space:pre-line}
.callout,.notebox{border-radius:10px;padding:18px 20px;margin:16px 0}
.callout{background:var(--accent-soft);border:1px solid #d5e7e1;border-left:4px solid var(--accent)}
.notebox{background:var(--sand);border-left:4px solid var(--laurel)}
.callout h4,.notebox h4{font-size:.98rem;color:var(--accent-deep);margin-bottom:6px;font-family:var(--serif)}
.notebox h4{color:#6b5c33}
.callout .co-price{margin-top:10px;font-weight:700;color:var(--accent-deep);font-size:.92rem}
.callout p,.notebox p{font-size:.93rem;white-space:pre-line}
/* collapsible plain sections */
.fold{border:1px solid var(--border);border-radius:var(--radius);margin-bottom:12px;background:#fff}
.fold summary{cursor:pointer;list-style:none;padding:16px 20px;font-weight:600;color:var(--ink);display:flex;gap:12px;font-size:.98rem}
.fold summary::-webkit-details-marker{display:none}
.fold summary::after{content:"+";margin-left:auto;color:var(--accent);font-size:1.2rem}
.fold[open] summary::after{content:"–"}
.fold .fold-body{padding:0 20px 18px}
/* notes & lists */
.note-list{list-style:none}
.note-list li{padding:8px 0 8px 24px;position:relative;font-size:.93rem;border-bottom:1px solid #f0eee6}
.note-list li:last-child{border-bottom:0}
.note-list li::before{content:"•";position:absolute;left:6px;color:var(--accent);font-weight:700}
.inc-list,.exc-list{list-style:none}
.inc-list li,.exc-list li{padding:8px 0 8px 30px;position:relative;font-size:.94rem}
.inc-list li::before{content:"✓";position:absolute;left:4px;color:var(--green);font-weight:700}
.exc-list li::before{content:"✗";position:absolute;left:4px;color:var(--red);font-weight:700}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:34px}
@media(max-width:720px){.two-col{grid-template-columns:1fr}}
/* tables (meals etc.) */
.plain-table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;font-size:.9rem}
.plain-table th{background:var(--ink);color:#fff;padding:10px 14px;text-align:left;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase}
.plain-table td{padding:10px 14px;border-top:1px solid var(--border)}
.plain-table tr:nth-child(even) td{background:var(--ivory)}
.table-note{font-size:.83rem;color:var(--muted);font-style:italic;margin-top:10px}
.table-scroll{overflow-x:auto}
/* FAQ */
.faq details{border:1px solid var(--border);border-radius:var(--radius);margin-bottom:10px;background:#fff}
.faq summary{cursor:pointer;padding:15px 18px;font-weight:600;color:var(--ink);font-size:.96rem;list-style:none;display:flex;gap:12px}
.faq summary::before{content:"+";color:var(--accent);font-weight:700;font-size:1.05rem;line-height:1.5}
.faq details[open] summary::before{content:"–"}
.faq summary::-webkit-details-marker{display:none}
.faq .faq-a{padding:0 18px 16px 42px;font-size:.93rem}
/* ============ booking widget ============ */
/* No inner scrollbar: the panel is never taller than its own content, and main.js
raises `top` when the panel is taller than the viewport so the last button stays reachable. */
.book-widget{position:sticky;top:100px;margin-bottom:26px;
background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lift)}
.book-widget .bw-body{padding-bottom:22px}
.bw-head{background:var(--accent-deep);color:#fff;padding:18px 22px}
.bw-head small{display:block;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:#8CC9B8;font-weight:700}
.bw-head .bw-price{font-family:var(--serif);font-size:1.85rem;margin-top:2px}
.bw-head .bw-price span{font-size:.82rem;font-family:var(--sans);color:#BFD9D0}
.bw-body{padding:20px 22px 24px}
.bw-body label{display:block;font-size:.74rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink);margin:14px 0 6px}
.bw-body label:first-child{margin-top:0}
.bw-body input,.bw-body select,.bw-body textarea{width:100%;padding:11px 12px;border:1px solid var(--border);border-radius:9px;font-family:var(--sans);font-size:.94rem;background:#fff;color:var(--ink)}
.bw-body input:focus,.bw-body select:focus,.bw-body textarea:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.bw-addons{margin-top:16px;border:1px solid var(--border);border-radius:10px;overflow:hidden}
.bw-addons .ba-head{background:var(--ivory);padding:10px 14px;font-size:.74rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink)}
.bw-addons label.ba-item{display:flex;align-items:flex-start;gap:10px;padding:11px 14px;border-top:1px solid var(--border);margin:0;font-size:.86rem;font-weight:500;text-transform:none;letter-spacing:0;color:var(--body);cursor:pointer}
.bw-addons label.ba-item input{width:auto;margin-top:3px;accent-color:var(--accent)}
.bw-addons .ba-price{margin-left:auto;font-weight:700;color:var(--accent-dark);white-space:nowrap;font-size:.84rem}
.bw-total{display:flex;justify-content:space-between;align-items:baseline;background:var(--accent-soft);border:1px solid #d5e7e1;border-radius:10px;padding:13px 15px;margin-top:18px}
.bw-total .t-label{font-size:.8rem;color:var(--muted)}
.bw-total .t-value{font-family:var(--serif);font-size:1.5rem;color:var(--accent-deep);font-weight:700}
.bw-total .t-pp{font-size:.76rem;color:var(--muted)}
.bw-actions{margin-top:16px;display:grid;gap:10px}
.bw-actions .btn{width:100%;text-align:center}
.bw-note{font-size:.77rem;color:var(--muted);margin-top:12px;line-height:1.55}
.bw-trust{display:flex;flex-direction:column;gap:6px;margin-top:14px;padding-top:14px;border-top:1px solid var(--border);font-size:.79rem}
.bw-trust span::before{content:"✓ ";color:var(--green);font-weight:700}
.bw-status{display:none;margin-top:12px;font-size:.84rem;padding:10px 12px;border-radius:9px}
.bw-status.ok{display:block;background:#eef7ee;color:var(--green);border:1px solid #cfe6cf}
.bw-status.err{display:block;background:#fbeeec;color:var(--red);border:1px solid #eccfc9}
/* ============ CTA band / footer ============ */
.cta-band{background:var(--accent-deep);color:#CFE0DA;padding:66px 0}
.cta-band h2{color:#fff}
.cta-band p{max-width:60ch;margin-top:10px}
footer{background:#121821;color:#9aa0ab;font-size:.87rem}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:36px;padding:56px 0 40px}
@media(max-width:860px){.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.footer-grid{grid-template-columns:1fr}}
footer h4{color:#fff;font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:16px;font-family:var(--sans)}
footer ul{list-style:none}
footer li{margin-bottom:9px}
footer a{color:#9aa0ab}
footer a:hover{color:#8CC9B8}
.footer-brand img{height:24px;width:auto;filter:invert(1) brightness(1.7);margin-bottom:14px}
/* the award reads as a badge, not a long yellow sentence */
.footer-award{display:flex;align-items:center;gap:14px;margin-top:18px;padding:12px 16px 12px 13px;
background:rgba(212,168,60,.09);border:1px solid rgba(212,168,60,.32);border-radius:12px}
.footer-award img{height:54px;width:auto;flex:none;margin:0;filter:none}
.footer-award span{display:flex;flex-direction:column;gap:3px;font-size:.76rem;color:#9aa0ab;line-height:1.5}
.footer-award b{font-family:var(--serif);font-size:.98rem;color:#E4CE97;font-weight:600}
.footer-award i{font-style:normal;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:#B99B58;font-weight:700}
.footer-bottom{border-top:1px solid #232a35;padding:20px 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.77rem}
/* ============ misc pages ============ */
.page-hero{background:linear-gradient(180deg,var(--ivory),#fff);border-bottom:1px solid var(--border);padding:60px 0 48px}
.page-hero p.lead{font-size:1.05rem;color:var(--body)}
.prose{max-width:70ch}
.prose p+p{margin-top:14px}
.prose h2{margin:34px 0 12px}
.prose ul{margin:12px 0 12px 22px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr}}
.contact-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow)}
.contact-card ul{list-style:none}
.contact-card li{padding:10px 0;border-bottom:1px solid var(--border);font-size:.94rem}
.contact-card li:last-child{border-bottom:0}
.contact-card li strong{display:block;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
/* ============ v3: awards years line · home rows · teasers · reviews ============ */
/* just the review counts — each award's own span of time sits with the award itself */
.aw-years{flex-basis:100%;text-align:center;margin-top:2px}
.aw-years span{font-size:.8rem;color:var(--muted);font-weight:500}
.tc-best{position:absolute;top:38px;left:10px;background:#B9861F;color:#fff;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;padding:5px 12px;border-radius:999px;font-weight:700;z-index:1}
.home-row{padding:56px 0}
.row-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:30px}
.row-head h2{margin-top:2px}
.row-blurb{max-width:62ch;margin-top:8px;color:var(--muted);font-size:.95rem}
.row-link{white-space:nowrap;font-weight:700;font-size:.9rem;color:var(--accent);padding-bottom:4px}
@media(max-width:640px){.row-head{flex-direction:column;align-items:flex-start;gap:8px}}
.teaser-card h3{font-size:.99rem}
.teaser-card .tc-art{opacity:.85}
.review-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.reviews-band{background:var(--accent-soft);border-top:1px solid #d5e7e1;border-bottom:1px solid #d5e7e1}
.review-card{display:flex;flex-direction:column;gap:14px;background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow);transition:.15s;color:var(--body)}
.review-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift);color:var(--body)}
.rc-stars{display:flex;align-items:center;gap:10px}
.rc-stars svg{width:26px;height:26px}
.rc-stars span{color:#00AA6C;letter-spacing:3px;font-size:.85rem}
.review-card blockquote{font-family:var(--serif);font-size:1.12rem;line-height:1.45;color:var(--ink);border:0;flex:1}
.rc-link{font-size:.8rem;font-weight:700;color:var(--accent)}
.rating-line{font-size:1.02rem;color:var(--body);margin:-6px 0 10px}
.rating-line strong{font-family:var(--serif);font-size:1.3rem;color:#00AA6C}
/* ============ v5: ribbon, card meta, rails, gallery, facts, booking modal ============ */
/* The category flag sits opposite the medal. It is capped so a long name such as
"Multi-Day Tours" can never run off the card's right edge. */
.tc-flag{left:auto;right:9px;top:9px;font-size:.56rem;letter-spacing:.08em;padding:4px 9px;
max-width:calc(100% - 130px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Best Seller badge — the same gold medal the product page carries.
It replaced a diagonal corner ribbon, which clipped its own text against the card's
rounded corner at every width we tried. A horizontal pill cannot clip. */
/* The medal shares the top of the photo with the category flag, so both are kept
deliberately small. Their combined width has to clear the narrowest card we render
(about 259px in the home rails) or one of them clips off the edge. */
.tc-best{position:absolute;top:9px;left:9px;z-index:3;display:inline-flex;align-items:center;gap:5px;
padding:4px 9px 4px 5px;border-radius:999px;white-space:nowrap;
background:linear-gradient(180deg,rgba(8,46,41,.9),rgba(8,46,41,.97));
border:1px solid rgba(220,183,85,.55);
box-shadow:0 3px 9px rgba(8,20,18,.3);
font-size:.55rem;letter-spacing:.06em;text-transform:uppercase;font-weight:700;color:#F7E7B4}
.tc-best svg{flex:none;width:14px;height:17px}
/* duration / route — bold black label, plain gray value, columns aligned */
.tc-route{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;align-items:baseline}
.tc-line{display:contents}
.tc-line small{font-size:.72rem;color:var(--ink);font-weight:700;white-space:nowrap}
.tc-line b{font-size:.78rem;color:var(--muted);font-weight:400;line-height:1.35}
/* horizontal card rail with arrows over the first and last card */
.rail-wrap{position:relative}
.rail-wrap>button{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:42px;height:42px;
border-radius:999px;border:1px solid var(--border);background:#fff;color:var(--ink);font-size:1.5rem;
line-height:1;cursor:pointer;transition:.15s;box-shadow:0 3px 14px rgba(23,27,35,.22);display:flex;
align-items:center;justify-content:center;padding-bottom:3px}
.rail-wrap>button:hover:not(:disabled){background:var(--accent);color:#fff;border-color:var(--accent)}
.rail-wrap>button:disabled,.rail-wrap>button.is-off{opacity:0;pointer-events:none}
.rail-wrap .row-prev{left:-18px}
.rail-wrap .row-next{right:-18px}
@media(max-width:1200px){.rail-wrap .row-prev{left:4px}.rail-wrap .row-next{right:4px}}
/* The rail scrolls HORIZONTALLY only. overflow-x:auto forces the vertical axis to
become scrollable too, and the rise-in cards waiting off to the right sit 22px
low until the viewport reaches them — so the rail grew a vertical scrollbar and
the row could be nudged upward, hiding the Best Seller medal and category tag
behind the top edge. overflow-y:hidden is the fix. The padding/negative-margin
pair gives the hover lift (translateY(-4px)) and its shadow room to breathe
without clipping, while keeping the row's outer spacing exactly as before. */
.card-rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 60px)/4);gap:20px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:14px 0 20px;margin:-14px 0 -14px;scrollbar-width:none}
.card-rail::-webkit-scrollbar{display:none}
.card-rail .slide{scroll-snap-align:start;display:flex}
.card-rail .slide>.tour-card{width:100%}
@media(max-width:1000px){.card-rail{grid-auto-columns:calc((100% - 40px)/3)}}
@media(max-width:760px){.card-rail{grid-auto-columns:calc((100% - 20px)/2)}}
@media(max-width:520px){.card-rail{grid-auto-columns:82%}}
/* quick facts as a compact list */
.fact-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:6px 24px;margin-bottom:34px;padding:16px 18px;border:1px solid var(--border);border-radius:var(--radius);background:var(--ivory)}
.fact-list li{display:flex;gap:9px;align-items:baseline;font-size:.87rem;padding:3px 0}
.fact-list li::before{content:"✓";color:var(--accent);font-weight:700;flex:none}
.fact-list small{flex:none;font-size:.63rem;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);font-weight:700;min-width:78px}
.fact-list span{color:var(--ink);font-weight:500}
/* gallery — one tall image left, four right, last opens the slider */
.gal-more{position:absolute;inset:0;background:rgba(15,22,19,.62);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:.82rem;font-weight:600;pointer-events:none;backdrop-filter:blur(1.5px)}
.gal-more b{font-family:var(--serif);font-size:1.5rem;font-weight:600}
/* short intro */
.readmore{margin-top:10px}
.readmore summary{cursor:pointer;list-style:none;font-weight:700;color:var(--accent);font-size:.9rem}
.readmore summary::-webkit-details-marker{display:none}
.readmore[open] summary{margin-bottom:10px}
.readmore[open] summary::after{content:" — less"}
/* traveler steppers */
.stepper{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--border)}
.stepper b{display:block;font-size:.92rem;color:var(--ink)}
.stepper small{font-size:.74rem;color:var(--muted)}
.stp{display:flex;align-items:center;gap:12px}
.stp button{width:32px;height:32px;border-radius:999px;border:1.5px solid var(--accent);background:#fff;color:var(--accent);font-size:1.1rem;line-height:1;cursor:pointer;font-weight:700}
.stp button:disabled{opacity:.3;cursor:default;border-color:var(--border);color:var(--muted)}
.stp output{min-width:20px;text-align:center;font-weight:700;color:var(--ink)}
/* what actually differs between options */
.bk-opt-pts{display:flex;flex-direction:column;gap:4px;margin-top:7px}
.bk-opt-pts span{position:relative;padding-left:21px;font-size:.82rem;line-height:1.4}
.bk-opt-pts .yes{color:var(--body)}
.bk-opt-pts .yes::before{content:"✓";position:absolute;left:2px;color:var(--green);font-weight:700}
.bk-opt-pts .no{color:var(--muted)}
.bk-opt-pts .no::before{content:"✗";position:absolute;left:2px;color:var(--red);font-weight:700}
.bk-opt-more{display:block;margin-top:7px}
.bk-opt-readmore{background:none;border:0;padding:0;color:var(--accent);font-weight:700;font-size:.8rem;
cursor:pointer;font-family:var(--sans);text-decoration:underline}
.bk-opt-full{display:block;margin-top:6px;font-size:.8rem;color:var(--muted);line-height:1.5}
.bk-opt-full[hidden]{display:none} /* the class rule would otherwise beat [hidden] */
.bk-opt-bullets{list-style:none;display:grid;gap:5px;margin-top:2px}
.bk-opt-bullets li{position:relative;padding-left:16px;font-size:.81rem;color:var(--body);line-height:1.45}
.bk-opt-bullets li::before{content:"";position:absolute;left:2px;top:.6em;width:5px;height:5px;
border-radius:50%;background:var(--accent)}
.bk-opt-price{flex:none;text-align:right}
.bk-opt-price b{display:block;font-family:var(--serif);font-size:1.25rem;color:var(--accent-deep)}
.bk-opt-price small{font-size:.7rem;color:var(--muted)}
.bk-summary{display:grid;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-bottom:16px}
.bk-summary>div{background:#fff;padding:12px 16px;display:flex;justify-content:space-between;gap:16px;font-size:.92rem}
.bk-summary small{color:var(--muted);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;font-weight:700}
.bk-summary span{color:var(--ink);font-weight:500;text-align:right}
.bk-chosen{margin:14px 0 4px}
.bk-chosen>small{display:block;font-size:.7rem;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:8px}
.bk-chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:9px}
.bk-chip{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--accent-soft);
border:1px solid #d5e7e1;border-radius:10px;padding:11px 13px}
.bk-chip b{font-size:.88rem;color:var(--ink);font-weight:600}
.bk-chip i{font-style:normal;font-size:.82rem;font-weight:700;color:var(--accent-deep);white-space:nowrap}
.bk-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 24px;border-top:1px solid var(--border);background:var(--ivory);flex-wrap:wrap}
.bk-total small{display:block;font-size:.7rem;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);font-weight:700}
.bk-total strong{font-family:var(--serif);font-size:1.55rem;color:var(--accent-deep)}
.bk-total span{font-size:.78rem;color:var(--muted);margin-left:8px}
.bk-btns{display:flex;gap:10px}
.bk-btns .btn{padding:12px 24px}
@media(max-width:560px){.bk-opt,.bk-add{flex-wrap:wrap}.bk-opt-price{text-align:left}.bk-foot{flex-direction:column;align-items:stretch}.bk-btns .btn{flex:1}}
/* booking page */
.bkp-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
/* min-width:auto on grid items lets the recommendations track (width:400%) push the
whole column past the viewport on a phone */
.bkp-grid>*{min-width:0}
@media(max-width:860px){.bkp-grid{grid-template-columns:1fr}}
.bkp-summary{background:var(--ivory);border:1px solid var(--border);border-radius:var(--radius);padding:22px}
.bkp-addons{padding:11px 0;border-bottom:1px solid var(--border)}
.bkp-addons small{display:block;color:var(--muted);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;margin-bottom:6px}
.bkp-addons ul{list-style:none;display:grid;gap:4px}
.bkp-addons li{position:relative;padding-left:20px;font-size:.9rem;color:var(--ink)}
.bkp-addons li::before{content:"✓";position:absolute;left:2px;color:var(--green);font-weight:700}
.bkp-row{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--border);font-size:.92rem}
.bkp-row small{color:var(--muted);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;flex:none}
.bkp-row span{text-align:right;color:var(--ink);font-weight:500}
.bkp-total{display:flex;justify-content:space-between;align-items:center;padding-top:16px;margin-top:6px}
.bkp-total small{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700}
.bkp-sub{font-size:.78rem;color:var(--muted)}
.bkp-total strong{font-family:var(--serif);font-size:1.9rem;color:var(--accent-deep)}
/* itinerary day summary */
.itin-hint{font-size:.86rem;color:var(--muted);margin:-8px 0 14px}
.itin-acc summary .day-title{flex:1}
.itin-acc summary .day-count{font-family:var(--sans);font-size:.75rem;font-weight:600;color:var(--muted);white-space:nowrap}
.itin-acc summary::after{margin-left:12px}
@media(max-width:520px){.itin-acc summary .day-count{display:none}}
/* itinerary stop with photo */
.stop.has-img,.callout.has-img{display:grid;grid-template-columns:132px 1fr;gap:16px;align-items:start}
.stop-thumb{padding:0;border:0;background:none;cursor:zoom-in;border-radius:9px;overflow:hidden;display:block;line-height:0}
.stop-thumb img{width:132px;height:92px;object-fit:cover;transition:transform .35s}
.stop-thumb:hover img{transform:scale(1.06)}
@media(max-width:560px){.stop.has-img,.callout.has-img{grid-template-columns:1fr}.stop-thumb img{width:100%;height:170px}}
/* lightbox */
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(12,16,14,.94);display:none;align-items:center;justify-content:center;padding:26px}
.lightbox.open{display:flex}
.lb-stage{width:min(1120px,94vw);display:flex;flex-direction:column;align-items:center;gap:12px}
/* one fixed frame, so paging never resizes the box — tall shots and wide shots
both sit inside the same rectangle */
.lb-stage img{width:100%;height:min(72vh,640px);object-fit:contain;background:#0b0f0d;
border-radius:8px;box-shadow:0 20px 70px rgba(0,0,0,.6)}
@media(max-width:760px){.lb-stage img{height:min(64vh,460px);width:auto}}
.lb-count{color:#cfd6d2;font-size:.82rem;letter-spacing:.12em}
.lightbox button{position:absolute;background:rgba(255,255,255,.12);color:#fff;border:0;cursor:pointer;border-radius:999px;display:flex;align-items:center;justify-content:center;transition:.15s;backdrop-filter:blur(4px)}
.lightbox button:hover{background:rgba(255,255,255,.26)}
.lb-close{top:20px;right:22px;width:44px;height:44px;font-size:1.8rem;line-height:1}
.lb-prev,.lb-next{top:50%;transform:translateY(-50%);width:52px;height:52px;font-size:2.1rem;line-height:1;padding-bottom:5px}
.lb-prev{left:20px}
.lb-next{right:20px}
@media(max-width:640px){.lb-prev,.lb-next{width:42px;height:42px;font-size:1.7rem}.lb-prev{left:8px}.lb-next{right:8px}}
/* ============ v6: premium date picker, OTA links, cross-sell, quick view ============ */
.kl-date{position:relative}
.kl-date-field{width:100%;display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--border);
border-radius:9px;background:#fff;cursor:pointer;font-family:var(--sans);font-size:.94rem;color:var(--ink);text-align:left;transition:.15s}
.kl-date-field:hover{border-color:var(--accent)}
.kl-date-field.empty .kl-date-text{color:var(--muted)}
.kl-date-icon{flex:none;width:19px;height:19px;color:var(--accent)}
.kl-date-icon svg{width:100%;height:100%}
.kl-cal{position:absolute;z-index:120;top:calc(100% + 8px);left:0;width:302px;background:#fff;border:1px solid var(--border);
border-radius:14px;box-shadow:0 18px 50px rgba(23,27,35,.22);padding:14px}
.kl-cal.up{top:auto;bottom:calc(100% + 8px)}
.kl-cal.shift{left:auto;right:0}
.kl-cal.fixed{position:fixed;right:auto;bottom:auto;z-index:1400}
.kl-cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.kl-cal-head strong{font-family:var(--serif);font-size:1.02rem;color:var(--ink)}
.kl-cal-head button{width:30px;height:30px;border-radius:999px;border:1px solid var(--border);background:#fff;
color:var(--ink);font-size:1.15rem;line-height:1;cursor:pointer;transition:.15s}
.kl-cal-head button:hover:not(:disabled){background:var(--accent);color:#fff;border-color:var(--accent)}
.kl-cal-head button:disabled{opacity:.28;cursor:default}
.kl-dow,.kl-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.kl-dow span{text-align:center;font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700;padding-bottom:5px}
.kl-day{aspect-ratio:1;border:0;background:none;border-radius:9px;cursor:pointer;font-family:var(--sans);
font-size:.86rem;color:var(--ink);transition:.12s}
.kl-day:hover:not(:disabled){background:var(--accent-tint);color:var(--accent-deep)}
.kl-day.off{color:#c7ccc9;cursor:default}
.kl-day.sel{background:var(--accent);color:#fff;font-weight:700}
.kl-pad{aspect-ratio:1}
.kl-cal-foot{margin-top:10px;padding-top:9px;border-top:1px solid var(--border)}
.kl-hint{font-size:.72rem;color:var(--muted)}
.kl-hint::before{content:"✓ ";color:var(--green);font-weight:700}
/* OTA member links — same footprint as Check Availability, in each brand's own color */
.ota-block{margin-top:16px;padding-top:14px;border-top:1px solid var(--border)}
/* meals, shown inside the add-ons step */
.bk-meals{border:1.5px solid var(--border);border-radius:12px;margin-top:4px;background:#fff}
.bk-meals summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:700;color:var(--ink);font-size:.95rem;display:flex}
.bk-meals summary::-webkit-details-marker{display:none}
.bk-meals summary::after{content:"+";margin-left:auto;color:var(--accent);font-size:1.2rem;line-height:1}
.bk-meals[open] summary::after{content:"–"}
.bk-meals-body{padding:0 16px 16px}
.bk-meal-ask{margin-top:12px;margin-bottom:0}
.ota-note{display:flex;gap:9px;align-items:flex-start;font-size:.8rem;color:var(--ink);margin-bottom:11px;
line-height:1.45;background:#FFF6E8;border:1px solid #F0DCBB;border-left:4px solid #E0A33A;
border-radius:9px;padding:9px 12px;font-weight:500}
.ota-note b{color:#8A5A11}
.ota-btns{display:grid;gap:10px}
/* all three booking buttons share one height so the block reads as a set */
.ota-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:0 18px;
min-height:52px;border:1.5px solid transparent;border-radius:999px;font-weight:700;font-size:.96rem;
color:#fff;transition:.15s;line-height:1;white-space:nowrap}
.bw-body .btn{min-height:52px;display:flex;align-items:center;justify-content:center}
.ota-btn>span{font-size:.9rem;font-weight:600;opacity:.95}
.ota-logo{flex:none;width:auto;display:block}
/* GetYourGuide's wordmark is stacked (tall), Viator's is a single line (wide) */
.gyg-logo{height:30px}
.via-logo{height:20px}
.ota-btn.gyg{background:#FF5533}
.ota-btn.gyg:hover{background:#E63F1F;color:#fff}
.ota-btn.via{background:#0E7C68}
.ota-btn.via:hover{background:#0A6555;color:#fff}
/* booking page: extras + recommendations */
.bkp-extra{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--border)}
.bkp-extra b{display:block;font-size:.94rem;color:var(--ink)}
.bkp-extra small{display:block;font-size:.78rem;color:var(--muted);margin-top:2px}
.bkp-extra-right{text-align:right;white-space:nowrap}
.bkp-extra-right span{font-family:var(--serif);font-size:1.06rem;color:var(--accent-deep);font-weight:700}
.bkp-remove{display:block;margin-top:3px;background:none;border:0;color:var(--muted);font-size:.74rem;cursor:pointer;text-decoration:underline}
.bkp-remove:hover{color:var(--red)}
/* the whole booking page is kept tight so the summary, the form and the extras fit together */
.bk-hero{padding:34px 0 22px}
.bk-hero h1{font-size:clamp(1.6rem,3vw,2.1rem)}
.bk-hero .lead{font-size:.92rem;max-width:70ch;margin-top:8px}
.bk-section{padding:26px 0 54px}
.bk-section .bw-body label{margin:9px 0 4px}
.bk-section .bw-body input,.bk-section .bw-body textarea{padding:9px 12px}
.bk-section .bw-actions{margin-top:13px;gap:8px}
.bk-section .contact-card{padding:22px}
/* the form follows you down the page, so booking is always one click away */
@media(min-width:861px){.bk-section .contact-card{position:sticky;top:96px}}
.bk-section .bw-trust{margin-top:11px;padding-top:11px}
.bkp-recs{margin-top:20px}
.bkp-recs h2{font-size:1.12rem}
.bkp-recs-sub{font-size:.84rem;color:var(--muted);margin:5px 0 11px}
.bkp-rec-view{overflow:hidden}
.bkp-rec-track{display:flex;transition:transform .55s cubic-bezier(.33,.9,.34,1)}
.bkp-rec-page{flex:1 0 auto;display:grid;gap:8px;padding-right:2px}
.bkp-rec-page{width:calc(100% / var(--pages, 1))}
@media(prefers-reduced-motion:reduce){.bkp-rec-track{transition:none}}
.bkp-rec-grid{display:grid;gap:8px}
.bkp-rec{display:flex;gap:12px;align-items:center;text-align:left;padding:8px;border:1px solid var(--border);
border-radius:11px;background:#fff;cursor:pointer;transition:.15s;font-family:var(--sans);width:100%}
.bkp-rec:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-2px)}
.bkp-rec-img{flex:none;width:74px;height:54px;border-radius:7px;background:var(--sand) center/cover}
.bkp-rec-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.bkp-rec-body b{font-size:.95rem;color:var(--ink)}
.bkp-rec-body small{font-size:.77rem;color:var(--muted)}
.bkp-rec-price{font-size:.8rem;font-weight:700;color:var(--accent-dark);margin-top:2px}
/* recommendation slider */
.bkp-recs-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.bkp-rec-next{flex:none;width:36px;height:36px;border-radius:999px;border:1px solid var(--border);background:#fff;
color:var(--ink);font-size:1.3rem;line-height:1;cursor:pointer;transition:.15s}
.bkp-rec-next:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.bkp-rec-dots{display:flex;gap:6px;justify-content:center;margin-top:11px}
.bkp-rec-dots span{width:7px;height:7px;border-radius:999px;background:var(--border)}
.bkp-rec-dots span.on{background:var(--accent);width:18px}
/* quick view */
.qv-panel{width:min(640px,100%)}
.qv-shots{margin:-24px -24px 16px}
.qv-stage{position:relative;background:var(--sand);line-height:0}
.qv-stage img{width:100%;height:300px;object-fit:cover;object-position:center 45%;display:block;image-rendering:auto}
.qv-nav{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:999px;border:0;
background:rgba(255,255,255,.9);color:var(--ink);font-size:1.4rem;line-height:1;cursor:pointer;padding-bottom:3px}
.qv-nav:hover{background:#fff}
.qv-prev{left:10px}
.qv-next{right:10px}
.qv-count{position:absolute;right:12px;bottom:12px;background:rgba(23,27,35,.8);color:#fff;font-size:.74rem;
padding:4px 10px;border-radius:999px;line-height:1.4}
.qv-thumbs{display:flex;gap:6px;padding:8px 24px 0}
.qv-thumb{width:56px;height:40px;border-radius:6px;border:2px solid transparent;background-size:cover;
background-position:center;cursor:pointer;padding:0;opacity:.62;transition:.15s}
.qv-thumb.on,.qv-thumb:hover{opacity:1;border-color:var(--accent)}
.qv-title{margin-bottom:14px;padding-right:34px}
.qv-title h3{font-size:1.28rem;margin:2px 0 5px}
.qv-itin{list-style:none;counter-reset:s;display:grid;gap:3px}
.qv-itin li{position:relative;padding-left:22px;font-size:.87rem;color:var(--body)}
.qv-itin li::before{counter-increment:s;content:counter(s);position:absolute;left:0;top:.15em;width:16px;height:16px;
border-radius:999px;background:var(--accent-tint);color:var(--accent-deep);font-size:.64rem;font-weight:700;
display:flex;align-items:center;justify-content:center}
.qv-itin li.qv-day{counter-reset:s;padding-left:0;font-weight:700;color:var(--ink);margin-top:8px;font-size:.83rem}
.qv-itin li.qv-day::before{content:none}
.qv-panel .bk-close{position:absolute;top:14px;right:16px;z-index:2}
.bkmodal .qv-panel{position:relative}
.qv-body{padding:24px 24px 18px;overflow-y:auto;flex:1}
.qv-head{display:flex;gap:16px;align-items:flex-start;margin-bottom:14px;padding-right:34px}
.qv-img{flex:none;width:120px;height:88px;border-radius:10px;background:var(--sand) center/cover}
.qv-head h3{font-size:1.28rem;margin:2px 0 5px}
.qv-meta{font-size:.83rem;color:var(--muted)}
.qv-pickup{color:var(--accent-dark);font-weight:600}
.qv-over{font-size:.92rem;margin-bottom:16px}
.qv-sec{margin-bottom:16px}
.qv-sec h4{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);font-weight:800;margin-bottom:8px}
.qv-list,.qv-inc{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:4px 18px}
@media(max-width:560px){.qv-list,.qv-inc{grid-template-columns:1fr}.qv-head{flex-direction:column}}
.qv-list li,.qv-inc li{position:relative;padding-left:20px;font-size:.87rem}
.qv-list li::before{content:"";position:absolute;left:2px;top:.5em;width:8px;height:8px;border-radius:50%;
background:var(--accent-tint);border:2px solid var(--accent)}
.qv-inc li::before{content:"✓";position:absolute;left:2px;color:var(--green);font-weight:700}
.qv-opts{display:grid;gap:8px;margin-bottom:16px}
.qv-opt{display:flex;gap:11px;align-items:flex-start;border:1.5px solid var(--border);border-radius:10px;padding:11px 13px;cursor:pointer}
.qv-opt.sel{border-color:var(--accent);background:var(--accent-soft)}
.qv-opt input{margin-top:3px;accent-color:var(--accent)}
.qv-opt b{display:block;font-size:.93rem;color:var(--ink)}
.qv-opt small{font-size:.8rem;color:var(--muted)}
.qv-pax{font-size:.85rem;color:var(--muted);margin-bottom:9px}
.qv-pax b{color:var(--ink)}
.qv-date{max-width:320px}
.qv-link{font-size:.84rem;font-weight:700;margin-top:4px}
.qv-total{font-family:var(--serif);font-size:1.5rem;color:var(--accent-deep)}
.bk-add-note{display:block;font-size:.83rem;color:var(--muted);margin-top:3px;line-height:1.45}
.bk-add-more{background:none;border:0;padding:0;margin-top:3px;color:var(--accent);font-weight:700;
font-size:.8rem;cursor:pointer;font-family:var(--sans);text-decoration:underline}
/* waiting state stays firmly green — muted, not washed out */
.btn.is-waiting{background:#7FB3A6;color:#fff;cursor:not-allowed;border-color:transparent}
.btn.is-waiting:hover{background:#7FB3A6;color:#fff}
/* city pages */
.city-hero{position:relative;color:#fff;padding:70px 0 58px;isolation:isolate;overflow:hidden}
.city-hero .city-bg{position:absolute;inset:0;background-size:cover;background-position:center 60%;z-index:-2}
.city-hero::after{content:"";position:absolute;inset:0;z-index:-1;
background:linear-gradient(96deg,rgba(8,14,12,.88) 0%,rgba(8,14,12,.74) 40%,rgba(8,14,12,.34) 70%,rgba(8,14,12,.12) 100%)}
.city-hero .eyebrow{color:#BCDDD2}
.city-hero h1{color:#fff;max-width:16ch}
.city-hero .lead{color:#EDEBE2;max-width:60ch;font-size:1.04rem}
.city-pickup{margin-top:14px;font-size:.86rem;color:#CBD5CF;max-width:64ch;padding-left:14px;border-left:3px solid var(--accent)}
.city-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:760px){.city-cards{grid-template-columns:1fr}}
.city-card{position:relative;border-radius:var(--radius);overflow:hidden;min-height:190px;display:flex;align-items:flex-end;color:#fff;box-shadow:var(--shadow)}
.city-card .cc-bg{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .5s}
.city-card:hover .cc-bg{transform:scale(1.06)}
.city-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,14,12,.05),rgba(8,14,12,.82))}
.city-card span{position:relative;z-index:1;padding:20px;display:block}
.city-card b{display:block;font-family:var(--serif);font-size:1.35rem}
.city-card small{font-size:.82rem;color:#D6DEDA}
/* ============ v9: WhatsApp glyph, Plan My Trip, city cards, rec carousel ============ */
/* one rule for both cases: flex buttons center it themselves and ignore vertical-align,
inline-block buttons use the offset to sit it on the text's optical center */
.wa-ico{width:18px;height:18px;flex:none;display:inline-block;vertical-align:-.28em}
.btn-whatsapp,.nav-cta,.wa-float{display:inline-flex;align-items:center;justify-content:center;gap:9px}
/* animated Plan My Trip button */
.plan-cta{position:relative;overflow:hidden}
.plan-cta::after{content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;
background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
animation:planSheen 3.6s ease-in-out infinite}
@keyframes planSheen{0%{left:-60%}55%{left:120%}100%{left:120%}}
.plan-spark{width:15px;height:15px;flex:none;background:currentColor;
-webkit-mask:var(--spark) center/contain no-repeat;mask:var(--spark) center/contain no-repeat;
--spark:url("data:image/svg+xml;utf8,");
animation:sparkPulse 2.4s ease-in-out infinite}
@keyframes sparkPulse{0%,100%{opacity:.75;transform:scale(1)}50%{opacity:1;transform:scale(1.16)}}
@media(prefers-reduced-motion:reduce){.plan-cta::after,.plan-spark{animation:none}}
/* floating WhatsApp — friendlier */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:70;background:#1FA855;color:#fff;border-radius:999px;
padding:12px 20px;font-weight:700;font-size:.88rem;box-shadow:0 6px 26px rgba(31,168,85,.42);line-height:1.15}
.wa-float:hover{background:#178A45;color:#fff;transform:translateY(-2px)}
.wa-float span{display:block}
@media(max-width:640px){.wa-float{padding:11px 16px;font-size:.8rem}}
/* city cards — the label sits on its own panel so it reads over any photo */
.city-card{min-height:210px;align-items:flex-end}
.city-card::after{background:linear-gradient(180deg,rgba(8,14,12,0) 40%,rgba(8,14,12,.34) 100%)}
.cc-text{padding:16px;width:100%}
.cc-text>b,.cc-text>small{display:block}
.cc-text{background:linear-gradient(180deg,rgba(8,14,12,0),rgba(8,14,12,.86) 55%)}
.city-card b,.city-card:hover b,.city-card:focus b{color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.7)}
.city-card small,.city-card:hover small{color:#E4EAE7;text-shadow:0 1px 8px rgba(0,0,0,.7);font-size:.84rem}
.city-card:hover{color:#fff}
/* recommendation carousel — arrows either side, auto-advancing */
.bkp-rec-wrap{position:relative}
.bkp-rec-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:34px;height:34px;
border-radius:999px;border:1px solid var(--border);background:#fff;color:var(--ink);font-size:1.25rem;
line-height:1;cursor:pointer;transition:.15s;box-shadow:0 3px 12px rgba(23,27,35,.2);padding-bottom:2px}
.bkp-rec-arrow:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.bkp-rec-prev{left:-15px}
.bkp-rec-next2{right:-15px}
@media(max-width:1100px){.bkp-rec-prev{left:2px}.bkp-rec-next2{right:2px}}
/* ============ listing filters ============ */
.listing-layout{display:grid;grid-template-columns:248px minmax(0,1fr);gap:34px;align-items:start}
@media(max-width:899px){.listing-layout{grid-template-columns:1fr;gap:18px}
/* a sticky panel that opens to full height would trap the page on a phone */
.ls-filters{position:static}}
.ls-filters{background:#fff;border:1px solid var(--border);border-radius:var(--radius);
padding:18px 18px 20px;position:sticky;top:100px}
.ls-filters>summary{cursor:pointer;list-style:none;font-size:.74rem;font-weight:700;
letter-spacing:.16em;text-transform:uppercase;color:var(--ink);display:flex;align-items:center}
.ls-filters>summary::-webkit-details-marker{display:none}
.ls-filters>summary::after{content:"+";margin-left:auto;font-size:1.2rem;line-height:1;color:var(--accent)}
.ls-filters[open]>summary::after{content:"\2013"}
.ls-filters[open]>summary{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--border)}
@media(min-width:900px){.ls-filters>summary{display:none}.ls-filters{position:sticky}}
.lsf-group+.lsf-group{margin-top:16px;padding-top:14px;border-top:1px solid var(--border)}
.lsf-group h3{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
font-weight:700;margin-bottom:9px}
.ls-opt{display:flex;align-items:center;gap:9px;padding:5px 0;font-size:.89rem;cursor:pointer;color:var(--ink)}
.ls-opt input{width:16px;height:16px;accent-color:var(--accent);flex:none;margin:0;cursor:pointer}
.ls-opt span{flex:1;min-width:0}
.ls-opt em{font-style:normal;font-size:.75rem;color:var(--muted)}
.ls-opt:hover span{color:var(--accent)}
.ls-clear{margin-top:16px;background:none;border:1px solid var(--border);border-radius:999px;
padding:7px 15px;font-size:.79rem;font-weight:600;cursor:pointer;color:var(--ink);font-family:var(--sans)}
.ls-clear:hover{border-color:var(--accent);color:var(--accent)}
.ls-count{font-size:.8rem;color:var(--muted);margin-bottom:14px}
.ls-count b{color:var(--ink)}
.ls-empty{padding:34px 0;color:var(--muted);font-size:.95rem}
.ls-group+.ls-group{margin-top:38px}
.ls-group .row-head{margin-bottom:18px}
.tour-card[hidden],.ls-group[hidden]{display:none!important}
/* ============ social band ============ */
/* Built to read as an Instagram feed: profile bar, then photographs only.
Nothing is written over the pictures. */
.social-band{background:var(--ivory)}
.ig-card{max-width:940px;margin:0 auto;background:#fff;border:1px solid var(--border);
border-radius:16px;overflow:hidden;box-shadow:var(--shadow-lift)}
.ig-head{display:flex;align-items:center;gap:15px;padding:16px 20px}
.ig-avatar{width:58px;height:58px;flex:none;border-radius:50%;padding:3px;
background:linear-gradient(45deg,#F9CE34,#EE2A7B,#6228D7)}
.ig-avatar i{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;
background:var(--accent-deep);color:#fff;font-family:var(--serif);font-size:1.02rem;
font-weight:700;font-style:normal;letter-spacing:.04em;border:2px solid #fff}
.ig-id{min-width:0}
.ig-id b{display:block;font-size:1rem;font-weight:700;color:var(--ink);letter-spacing:.02em;line-height:1.2}
.ig-id small{display:block;font-size:.86rem;color:var(--muted);margin-top:2px}
.ig-stats{display:flex;gap:26px;margin-left:22px}
.ig-stats span{text-align:center}
.ig-stats b{display:block;font-size:1rem;font-weight:700;color:var(--ink);line-height:1.2}
.ig-stats small{display:block;font-size:.78rem;color:var(--muted)}
.ig-follow{display:inline-flex;align-items:center;gap:8px;margin-left:auto;flex:none;
background:#0095F6;color:#fff;border-radius:10px;padding:10px 18px;font-weight:700;font-size:.92rem}
.ig-follow:hover{background:#0077C6;color:#fff}
.ig-follow svg{width:19px;height:19px;flex:none}
.ig-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;background:var(--border)}
.ig-tile{display:block;overflow:hidden;background:#e8e6dd;aspect-ratio:1}
.ig-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.ig-tile:hover img{transform:scale(1.06)}
@media(max-width:680px){
.ig-head{flex-wrap:wrap;gap:12px;padding:14px 15px}
.ig-avatar{width:50px;height:50px}
.ig-stats{margin-left:0;order:3;flex-basis:100%;justify-content:space-around;gap:0}
.ig-follow{padding:9px 15px;font-size:.86rem}
}
/* ============ footer contact icons ============ */
.footer-contact{margin-top:20px;padding-top:16px;border-top:1px solid #232a35;
display:flex;gap:10px;flex-wrap:wrap}
.fc-ico{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;
border:1px solid #2b3340;background:#1a212b;color:#cfd4dc;transition:.15s}
.fc-ico:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-2px)}
.fc-ico.wa:hover{background:#1FA855;border-color:#1FA855}
.fc-ico .wa-ico{width:19px;height:19px;vertical-align:0}
/* An itinerary stop opens one photograph — no arrows, no counter, just a close button.
The gallery under the title keeps the full slider. */
.lightbox.is-single .lb-prev,.lightbox.is-single .lb-next,.lightbox.is-single .lb-count{display:none}
/* ============ contact tiles (About + Contact) ============ */
.ct-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.ct-tile{display:flex;align-items:center;gap:14px;padding:15px 18px;background:#fff;
border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);transition:.15s}
.ct-tile:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.ct-ico{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:50%;
background:var(--ivory);color:var(--accent-deep);border:1px solid var(--border)}
.ct-ico.wa{background:#1FA855;color:#fff;border-color:#1FA855}
.ct-ico .wa-ico{width:21px;height:21px;vertical-align:0}
.ct-txt{min-width:0}
.ct-txt small{display:block;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;
color:var(--muted);font-weight:700}
.ct-txt b{display:block;font-size:.95rem;color:var(--ink);font-weight:600;margin-top:3px;
overflow:hidden;text-overflow:ellipsis}
.ct-tile:hover .ct-txt b{color:var(--accent)}
.ct-note{display:flex;align-items:center;gap:9px;margin-top:14px;font-size:.87rem;color:var(--muted)}
.ct-note .wa-ico{width:17px;height:17px;vertical-align:0;color:var(--accent)}
.ct-facts{list-style:none;margin-top:20px;padding-top:16px;border-top:1px solid var(--border)}
.ct-facts li{padding:9px 0;font-size:.94rem;color:var(--ink)}
.ct-facts strong{display:block;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;
color:var(--muted);margin-bottom:3px;font-weight:700}
/* the contact page card holds the tiles in one column — the grid outside is already two-up */
.contact-card .ct-tiles{grid-template-columns:1fr}
/* ============ vehicles page ============ */
.veh-nav{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
.veh-nav a{border:1px solid var(--border);background:#fff;border-radius:999px;padding:8px 16px;
font-size:.83rem;font-weight:600;color:var(--ink)}
.veh-nav a:hover{border-color:var(--accent);color:var(--accent)}
.veh-row{display:grid;grid-template-columns:1.25fr 1fr;gap:40px;align-items:center}
.veh-row.flip .veh-shot{order:2}
@media(max-width:880px){.veh-row{grid-template-columns:1fr;gap:24px}.veh-row.flip .veh-shot{order:0}}
.veh-shot{margin:0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-lift);
border:1px solid var(--border);background:#fff}
.veh-shot img{display:block;width:100%;height:auto}
.veh-copy h2{margin-top:4px}
.veh-copy p{margin-top:12px;color:var(--body)}
.veh-facts{list-style:none;margin-top:20px;border-top:1px solid var(--border)}
.veh-facts li{display:flex;gap:16px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--border)}
.veh-facts small{flex:none;width:44%;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;
color:var(--muted);font-weight:700}
.veh-facts span{font-size:.94rem;color:var(--ink)}
@media(max-width:520px){.veh-facts li{flex-direction:column;gap:3px}.veh-facts small{width:auto}}
/* ============ cart: header button, drawer, checkout lines ============ */
.cart-btn{position:relative;display:inline-grid;place-items:center;width:44px;height:44px;flex:none;
border:1px solid var(--border);background:#fff;border-radius:50%;cursor:pointer;color:var(--ink);
margin-left:14px;transition:.15s}
.cart-btn:hover{border-color:var(--accent);color:var(--accent)}
.cart-btn svg{width:21px;height:21px}
.cart-btn.has-items{border-color:var(--accent);color:var(--accent)}
.cart-count{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;border-radius:999px;
background:var(--accent);color:#fff;font-size:.68rem;font-weight:700;display:grid;place-items:center;padding:0 5px}
@keyframes cart-bump{0%{transform:scale(1)}40%{transform:scale(1.18)}100%{transform:scale(1)}}
.cart-btn.bump{animation:cart-bump .34s ease}
@media(max-width:940px){.cart-btn{margin-left:auto;margin-right:8px;order:-1}}
.cart-drawer{position:fixed;inset:0;z-index:210;display:none}
.cart-drawer.open{display:block}
.cd-scrim{position:absolute;inset:0;background:rgba(12,16,14,.5)}
.cd-panel{position:absolute;top:0;right:0;bottom:0;width:min(440px,100%);background:var(--ivory);
display:flex;flex-direction:column;box-shadow:-18px 0 60px rgba(0,0,0,.28);animation:cd-in .22s ease}
@keyframes cd-in{from{transform:translateX(24px);opacity:.6}to{transform:none;opacity:1}}
.cd-head{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;
background:var(--accent-deep);color:#fff}
.cd-head h2{font-family:var(--serif);font-size:1.2rem;color:#fff}
.cd-close{background:none;border:0;color:#fff;font-size:1.9rem;line-height:1;cursor:pointer;padding:0 4px}
.cd-body{flex:1;overflow-y:auto;padding:18px}
.cd-empty{text-align:center;padding:44px 14px;color:var(--muted)}
.cd-empty b{color:var(--ink)}
.cd-empty .btn{margin-top:18px}
.cd-item{display:grid;grid-template-columns:88px 1fr;gap:13px;background:#fff;border:1px solid var(--border);
border-radius:14px;padding:13px;margin-bottom:13px}
.cd-thumb{display:block;border-radius:9px;overflow:hidden;aspect-ratio:1;background:#e8e6dd}
.cd-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.cd-main{min-width:0}
.cd-main h3{font-size:.97rem;line-height:1.3}
.cd-main h3 a{color:var(--ink)}
.cd-main h3 a:hover{color:var(--accent)}
.cd-opt{font-size:.8rem;color:var(--muted);margin-top:2px}
.cd-date{margin-top:9px}
.cd-date .kl-date-field{padding:8px 10px;font-size:.83rem}
.cd-steppers{display:flex;gap:10px;margin-top:9px;flex-wrap:wrap}
.cd-stp small{display:block;font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:3px}
.cd-stp>span{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:999px;background:#fff}
.cd-stp button{width:28px;height:28px;border:0;background:none;cursor:pointer;font-size:1rem;color:var(--ink);line-height:1}
.cd-stp button:hover{color:var(--accent)}
.cd-stp output{min-width:20px;text-align:center;font-size:.86rem;font-weight:600}
.cd-chips,.bkp-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}
.cd-chip,.bkp-chip{background:var(--ivory);border:1px solid var(--border);border-radius:999px;
padding:3px 9px;font-size:.72rem;color:var(--muted)}
.cd-line-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-top:11px}
.cd-price b{font-family:var(--serif);font-size:1.05rem;color:var(--ink)}
.cd-price small{display:block;font-size:.72rem;color:var(--muted)}
.cd-remove,.bkp-remove{background:none;border:0;padding:0;font-size:.78rem;color:var(--muted);
cursor:pointer;text-decoration:underline;font-family:var(--sans)}
.cd-remove:hover,.bkp-remove:hover{color:var(--red)}
.cd-foot{padding:16px 18px 20px;background:#fff;border-top:1px solid var(--border)}
.cd-sum{display:flex;align-items:baseline;justify-content:space-between}
.cd-sum small{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
.cd-total{font-family:var(--serif);font-size:1.5rem;color:var(--ink)}
.cd-note{font-size:.76rem;color:var(--muted);margin:8px 0 12px}
.cd-checkout{display:block;text-align:center}
.cd-keep{display:block;width:100%;margin-top:9px;background:none;border:0;font-size:.83rem;
color:var(--muted);cursor:pointer;text-decoration:underline;font-family:var(--sans)}
/* checkout lines on /booking/ */
.bkp-line{display:grid;grid-template-columns:92px minmax(0,1fr) auto;gap:14px;padding:16px 0;border-bottom:1px solid var(--border)}
.bkp-line:first-child{padding-top:0}
.bkp-thumb{display:block;border-radius:10px;overflow:hidden;aspect-ratio:1;background:#e8e6dd}
.bkp-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.bkp-line-main{min-width:0}
.bkp-line-main h3{font-size:1rem}
.bkp-line-main h3 a{color:var(--ink)}
.bkp-opt{font-size:.83rem;color:var(--muted);margin-top:2px}
.bkp-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin-top:11px}
.bkp-date{min-width:210px}
.bkp-date .kl-date-field{padding:8px 11px;font-size:.85rem}
.bkp-stp small{display:block;font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:3px}
.bkp-stp>span{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:999px;background:#fff}
.bkp-stp button{width:30px;height:30px;border:0;background:none;cursor:pointer;font-size:1.05rem;color:var(--ink)}
.bkp-stp button:hover{color:var(--accent)}
.bkp-stp output{min-width:22px;text-align:center;font-size:.88rem;font-weight:600}
.bkp-line-price{text-align:right;white-space:nowrap}
.bkp-line-price b{font-family:var(--serif);font-size:1.15rem;color:var(--ink)}
.bkp-line-price small{display:block;font-size:.74rem;color:var(--muted);margin-bottom:6px}
@media(max-width:620px){
.bkp-line{grid-template-columns:70px minmax(0,1fr);gap:11px}
.bkp-line-price{grid-column:1/-1;text-align:left;display:flex;align-items:baseline;gap:12px}
.bkp-line-price small{margin-bottom:0}
/* flex-basis, not min-width — min-width:100% on a flex item resolves against the
content-sized row and blows the layout out past the viewport */
.bkp-date{flex:1 1 100%;min-width:0}
}
/* ============ Bokun card (the second booking card type) ============ */
.bokun-card .bokun-body{padding:18px 20px 22px}
.bokun-slot{min-height:320px;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#fff}
.bokun-frame{display:block;width:100%;height:560px;border:0}
.bokun-note{font-size:.79rem;color:var(--muted);line-height:1.5;margin-top:14px}
.bokun-demo{font-size:.76rem;background:#FFF6E8;border:1px solid #F0DCBB;border-left:4px solid #E0A33A;
border-radius:9px;padding:9px 12px;margin-bottom:12px;color:#8A5A11}
.bokun-demo code{font-size:.72rem;background:rgba(0,0,0,.05);padding:1px 4px;border-radius:4px}
.bokun-wa{display:flex;width:100%;margin-top:14px}
/* ============ header menus ============ */
/* Opens on hover and on keyboard focus. The panel is always in the DOM and only
fades/lifts, so the transition is quick (150ms) and never janky. A padded bridge
above it means the pointer can travel from the label to the panel without a gap. */
.nav-item{position:relative}
.nav-top{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:0;
cursor:pointer;font-family:var(--sans);font-size:.93rem;font-weight:500;color:var(--ink);
line-height:inherit}
.nav-top:hover,.nav-item:hover .nav-top,.nav-item.is-active .nav-top{color:var(--accent)}
.nav-caret{width:8px;height:8px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
transform:rotate(45deg) translate(-1px,-1px);transition:transform .16s ease}
.nav-item:hover .nav-caret,.nav-item:focus-within .nav-caret{transform:rotate(225deg) translate(-2px,-2px)}
.nav-menu{position:absolute;top:100%;left:50%;z-index:60;padding-top:14px;
opacity:0;visibility:hidden;transform:translate(-50%,-6px);
transition:opacity .15s ease,transform .15s ease,visibility 0s linear .15s}
.nav-item:hover .nav-menu,.nav-item:focus-within .nav-menu{
opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
.nav-menu-in{min-width:230px;background:#fff;border:1px solid var(--border);border-radius:14px;
box-shadow:0 18px 44px rgba(15,22,19,.16);padding:8px;display:flex;flex-direction:column}
.nav-menu-in a{display:block;padding:10px 14px;border-radius:9px;font-size:.92rem;
color:var(--ink);white-space:nowrap;transition:background .12s ease,color .12s ease}
.nav-menu-in a:hover{background:var(--ivory);color:var(--accent)}
.nav-menu-in a[aria-current]{color:var(--accent);font-weight:600}
.nav-menu-in .nm-all{margin-top:6px;padding-top:12px;border-top:1px solid var(--border);
border-radius:0 0 9px 9px;font-size:.83rem;font-weight:600;color:var(--muted)}
.nav-menu-in .nm-all:hover{background:none;color:var(--accent)}
@media(max-width:940px){
/* no hover on a phone: the label becomes a tap-to-open row */
.nav-item{width:100%}
.nav-top{width:100%;justify-content:space-between;padding:6px 0;font-size:1rem}
.nav-caret{transform:rotate(45deg)}
.nav-item.open .nav-caret{transform:rotate(225deg) translate(-2px,-2px)}
.nav-menu{position:static;transform:none;opacity:1;visibility:visible;padding-top:0;
display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s ease}
.nav-item.open .nav-menu{grid-template-rows:1fr}
.nav-menu-in{overflow:hidden;min-width:0;border:0;box-shadow:none;padding:0 0 0 12px;
border-left:2px solid var(--border);margin:2px 0 8px;border-radius:0}
.nav-menu-in a{padding:9px 6px;white-space:normal}
.nav-menu-in .nm-all{border-top:0;padding-top:9px;margin-top:0}
}
/* ============ header layout: brand left, menus centre-left, actions right ============ */
.nav-row{gap:26px}
.main-nav{margin-right:auto}
.nav-actions{display:flex;align-items:center;gap:14px;flex:none}
.desk-only{display:inline-flex}
.mob-only{display:none}
.cart-btn{margin-left:0}
@media(max-width:940px){
.desk-only{display:none}
.mob-only{display:block}
.main-nav .nav-cta.mob-only{display:inline-flex;margin-top:6px}
.nav-actions{margin-left:auto}
}
/* ============ awards strip: logo above, one line of proof below ============ */
.awards-strip .container{gap:20px 60px;padding-top:26px;padding-bottom:26px}
.award{flex-direction:column;align-items:center;gap:11px;text-align:center;max-width:280px}
.award strong{font-family:var(--serif);font-size:.95rem;color:var(--ink);font-weight:600;white-space:normal}
.aw-logo{width:auto;flex:none;display:block}
.aw-logo.ta{height:23px}
.aw-logo.via{height:23px}
.aw-logo.gyg{height:34px}
.award-chip{gap:9px}
.award-chip .aw-logo.ta,.award-chip .aw-logo.via{height:14px}
.award-chip .aw-logo.gyg{height:20px}
@media(max-width:760px){.awards-strip .container{gap:22px 30px}.award{max-width:none;flex-basis:100%}}
/* ============ vehicle picker on the product page ============ */
.vp-intro{color:var(--body);margin-bottom:16px}
.veh-picker{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#fff}
.vp-item+.vp-item{border-top:1px solid var(--border)}
.vp-head{display:flex;align-items:center;gap:14px;width:100%;padding:15px 18px;background:none;
border:0;cursor:pointer;font-family:var(--sans);text-align:left;transition:background .15s ease}
.vp-head:hover{background:var(--ivory)}
.vp-name{font-weight:600;font-size:.98rem;color:var(--ink)}
.vp-pax{font-size:.83rem;color:var(--muted);margin-left:auto}
.vp-caret{width:9px;height:9px;flex:none;border-right:1.7px solid var(--muted);border-bottom:1.7px solid var(--muted);
transform:rotate(45deg) translate(-2px,-2px);transition:transform .22s ease}
.vp-item.open .vp-head{background:var(--ivory)}
.vp-item.open .vp-name{color:var(--accent)}
.vp-item.open .vp-caret{transform:rotate(225deg) translate(-3px,-3px);border-color:var(--accent)}
/* 0fr -> 1fr gives a real height animation without measuring anything in JS */
.vp-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s ease}
.vp-item.open .vp-panel{grid-template-rows:1fr}
.vp-panel-in{overflow:hidden;min-height:0}
.vp-panel-in img{display:block;width:100%;height:auto;border-top:1px solid var(--border)}
.vp-panel-in p{padding:13px 18px 16px;font-size:.9rem;color:var(--body);background:var(--ivory)}
.vp-foot{margin-top:14px;font-size:.86rem;color:var(--muted)}
/* ============ quick-view traveler steppers ============ */
.qv-group{background:var(--ivory);border:1px solid var(--border);border-radius:12px;padding:14px 16px;margin-top:10px}
.qv-pax{font-size:.83rem;color:var(--muted);margin-bottom:12px}
.qv-steppers{display:grid;gap:10px}
.qv-stp{display:flex;align-items:center;justify-content:space-between;gap:14px;
background:#fff;border:1px solid var(--border);border-radius:10px;padding:9px 12px}
.qv-stp-label b{display:block;font-size:.92rem;color:var(--ink)}
.qv-stp-label small{display:block;font-size:.75rem;color:var(--muted)}
.qv-stp-ctl{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:999px;flex:none}
.qv-stp-ctl button{width:32px;height:32px;border:0;background:none;cursor:pointer;font-size:1.05rem;color:var(--ink)}
.qv-stp-ctl button:hover{color:var(--accent)}
.qv-stp-ctl output{min-width:24px;text-align:center;font-size:.92rem;font-weight:600}
/* ============ options outrank add-ons ============ */
/* Zaidu: the option is the big decision, the add-on is a small extra — the type sizes
have to say so, on the product page and in the quick-view alike. */
.bk-opt{padding:18px 20px;margin-bottom:12px;border-width:2px}
.bk-opt-main b{font-size:1.12rem;font-family:var(--serif);font-weight:600;letter-spacing:.01em}
.bk-opt-blurb{font-size:.92rem}
.bk-opt input{width:20px;height:20px;margin-top:3px}
.bk-opt-price b{font-size:1.25rem}
.bk-add{padding:12px 14px;margin-bottom:8px;border-width:1px}
.bk-add-main b{font-size:.94rem;font-weight:600}
.bk-add-note{font-size:.8rem}
.bk-add input{width:17px;height:17px}
.bk-add .bk-opt-price b{font-size:1.02rem}
/* the same order of importance inside the quick-view */
.qv-opt{padding:16px 18px;border-width:2px}
.qv-opt span b{font-size:1.1rem;font-family:var(--serif);font-weight:600}
.qv-opt span small{font-size:.9rem}
.qv-step-opts>h4,.qv-sec>h4{font-size:.74rem}
.qv-step-opts>h4{font-size:.8rem;color:var(--ink)}
/* ============ quick-view group block ============ */
.qv-pax b{color:var(--accent-deep);font-weight:700}
.qv-pax{font-size:.86rem;line-height:1.5}
.qv-group{margin-bottom:18px}
.qv-sec .qv-date{margin-top:4px}
/* ============ header: brand alone on the left, everything else on the right ============ */
/* Zaidu: the menus must not sit next to the logo — they travel right and sit with
Plan My Trip and the cart as one group. */
.nav-row{gap:22px;justify-content:space-between}
.main-nav{margin-left:auto;margin-right:0;gap:26px}
.nav-actions{gap:16px}
@media(min-width:941px){
.main-nav{margin-right:8px}
}
@media(max-width:940px){
.main-nav{margin-left:0}
}
/* ============ awards strip: one line each, real gaps between the marks ============ */
.awards-strip .container{gap:18px 54px;padding-top:24px;padding-bottom:24px;flex-wrap:nowrap}
.award{max-width:none;gap:12px}
.award strong{font-size:.9rem;white-space:nowrap}
.aw-logo.ta{height:26px}
.aw-logo.via{height:22px}
.aw-logo.gyg{height:32px}
@media(max-width:1080px){
.awards-strip .container{flex-wrap:wrap;gap:22px 34px}
.award strong{white-space:normal}
}
/* vehicle intro sits on one line */
.vp-intro{font-size:.92rem}
/* ============ footer contact icons: each one wakes up in its own brand colour ============ */
.brand-grads{position:absolute;width:0;height:0;overflow:hidden}
.fc-ico:hover{background:#fff;border-color:#fff;transform:translateY(-2px);
box-shadow:0 6px 18px rgba(0,0,0,.28)}
/* the envelope takes Gmail's four colours; the stroke can reference an SVG gradient by id */
.fc-ico.mail:hover svg{stroke:url(#gmailGrad)}
/* the classic call green */
.fc-ico.tel:hover{color:#34C759}
.fc-ico.wa:hover{background:#fff;border-color:#fff;color:#25D366}
.fc-ico.ig:hover svg{stroke:url(#igGrad)}
.fc-ico.ig:hover{color:#D62976}
/* ============ awards: one shared logo slot so the three columns line up ============ */
/* GetYourGuide's mark is stacked and taller than the two wordmarks, which pushed its
caption lower. A fixed-height row centres every mark and puts all three captions
on the same line. */
.award{display:grid;grid-template-rows:36px auto;align-items:center;justify-items:center;gap:12px}
.award>img{align-self:center}
.aw-logo.gyg{height:30px}
/* ============ motion ============ */
/* Every rule here is gated on `.motion`, which motion.js only adds when JavaScript runs
and the traveler has not asked for reduced motion. Without it the page is fully
visible and completely still — which is what a crawler and a screen reader get. */
/* the hero settles in on load: eyebrow, headline, list, award, buttons, in that order */
@media (prefers-reduced-motion: no-preference) {
.motion .hero .eyebrow,
.motion .hero h1,
.motion .hero-ticks li,
.motion .hero-award,
.motion .hero .btn-row {
animation: kl-rise .62s cubic-bezier(.22,.68,.32,1) backwards;
}
.motion .hero .eyebrow { animation-delay: .05s }
.motion .hero h1 { animation-delay: .13s }
.motion .hero-ticks li:nth-child(1) { animation-delay: .26s }
.motion .hero-ticks li:nth-child(2) { animation-delay: .32s }
.motion .hero-ticks li:nth-child(3) { animation-delay: .38s }
.motion .hero-ticks li:nth-child(4) { animation-delay: .44s }
.motion .hero-ticks li:nth-child(5) { animation-delay: .50s }
.motion .hero-award { animation-delay: .58s }
.motion .hero .btn-row { animation-delay: .68s }
}
@keyframes kl-rise {
from { opacity: 0; transform: translate3d(0, 16px, 0) }
to { opacity: 1; transform: none }
}
/* anything further down rises as it enters the viewport */
.motion .rise {
opacity: 0;
transform: translate3d(0, 22px, 0);
transition: opacity .55s ease, transform .55s cubic-bezier(.22,.68,.32,1);
transition-delay: var(--d, 0ms);
will-change: opacity, transform;
}
.motion .rise.in { opacity: 1; transform: none; will-change: auto }
/* cards lean toward the pointer — transform only, so nothing reflows */
.motion .tilt {
transform-style: preserve-3d;
transition: transform .45s cubic-bezier(.22,.68,.32,1), box-shadow .3s ease;
}
.motion .tour-card.tilt:hover { box-shadow: 0 22px 48px rgba(15,22,19,.20) }
.motion .ig-tile.tilt:hover { box-shadow: 0 20px 44px rgba(15,22,19,.24) }
/* the photo inside a tilted card lifts a touch further, which is what reads as depth */
.motion .tour-card.tilt .tc-art { transition: transform .45s cubic-bezier(.22,.68,.32,1) }
.motion .tour-card.tilt:hover .tc-art { transform: scale(1.05) translateZ(18px) }
/* the hero photograph drifts slower than the words on top of it */
.motion .hero .hero-bg { will-change: transform }
/* small lifts that make the page feel answerable */
.motion .award { transition: transform .3s cubic-bezier(.22,.68,.32,1) }
.motion .award:hover { transform: translateY(-3px) }
.motion .vp-item .vp-head { transition: background .15s ease, padding-left .22s ease }
.motion .vp-item:hover .vp-head { padding-left: 22px }
/* touch devices get the reveals but never the tilt or the parallax */
@media (hover: none), (pointer: coarse) {
.motion .tilt { transform: none !important; transition: box-shadow .3s ease }
.motion .tour-card.tilt:hover .tc-art { transform: none }
}
/* the parallax transform scales the hero photograph past its own box; without this the
image spilled down over the awards strip and hid the three logos */
.motion .hero{overflow:hidden}
/* --- 1. destinations --- */
.pl-dest{border:1px solid var(--border);border-radius:11px;padding:8px 10px;background:var(--ivory);
display:flex;flex-wrap:wrap;gap:7px;align-items:center;transition:border-color .16s,box-shadow .16s}
.pl-dest:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}
.pl-tags{display:contents}
.pl-tag{display:inline-flex;align-items:center;gap:6px;background:var(--accent);color:#fff;
border-radius:999px;padding:5px 6px 5px 13px;font-size:.9rem;font-weight:500;white-space:nowrap}
.pl-tag button{background:rgba(255,255,255,.2);border:0;color:#fff;width:19px;height:19px;border-radius:50%;
cursor:pointer;font-size:.95rem;line-height:1;display:grid;place-items:center;padding:0}
.pl-tag button:hover{background:rgba(255,255,255,.36)}
#pl-dest{flex:1 1 190px;min-width:150px;border:0;background:none;outline:0;padding:7px 4px;
font:inherit;font-size:.98rem;color:var(--ink)}
.pl-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.pl-chip{border:1px solid var(--border);background:var(--white);border-radius:999px;padding:6px 14px;
font:inherit;font-size:.88rem;color:var(--body);cursor:pointer;transition:all .15s}
.pl-chip:hover{border-color:var(--accent);color:var(--accent-dark)}
.pl-chip.is-on{background:var(--accent-tint);border-color:var(--accent);color:var(--accent-dark);font-weight:500}
/* --- 2. when --- */
.pl-seg{display:inline-flex;background:var(--sand);border-radius:10px;padding:4px;gap:4px;margin-bottom:16px}
.pl-segbtn{border:0;background:none;font:inherit;font-size:.92rem;padding:8px 16px;border-radius:7px;
cursor:pointer;color:var(--muted);transition:all .16s}
.pl-segbtn.is-on{background:var(--white);color:var(--ink);font-weight:600;box-shadow:0 1px 3px rgba(23,27,35,.12)}
.pl-months{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}
.pl-month{border:1px solid var(--border);background:var(--white);border-radius:9px;padding:11px 4px;
font:inherit;font-size:.9rem;color:var(--body);cursor:pointer;transition:all .15s}
.pl-month:hover{border-color:var(--accent)}
.pl-month.is-on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.pl-yr{display:flex;align-items:center;gap:10px;margin-top:12px}
.pl-yr label{font-size:.9rem;color:var(--muted);margin:0}
.pl-yr select,.pl-len select{border:1px solid var(--border);border-radius:9px;padding:9px 12px;
font:inherit;font-size:.95rem;background:var(--white);color:var(--ink)}
.pl-len{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:16px;
padding-top:16px;border-top:1px dashed var(--border)}
.pl-len label{font-size:.95rem;color:var(--body);margin:0}
.pl-season{margin-top:14px;display:grid;gap:8px}
.pl-season span{display:block;background:#FFF8E8;border:1px solid #EBD9A8;border-left:3px solid var(--laurel);
border-radius:8px;padding:10px 13px;font-size:.88rem;color:#5C4A1E;line-height:1.55}
/* --- 3. travelers --- */
.pl-pax{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pl-veh{margin-top:12px;font-size:.9rem;color:var(--accent-dark);font-weight:500}
/* --- 4. free text --- */
#pl-notes{width:100%;border:1px solid var(--border);border-radius:11px;padding:13px 14px;font:inherit;
font-size:.98rem;background:var(--ivory);color:var(--ink);resize:vertical;line-height:1.6}
#pl-notes:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}
.pl-go{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.btn-lg{padding:15px 30px;font-size:1.02rem}
.pl-fine{margin-top:14px;font-size:.84rem;color:var(--muted);line-height:1.6}
@media(max-width:640px){
.plan-card{padding:4px 18px 22px;border-radius:13px}
.pl-months{grid-template-columns:repeat(4,1fr)}
.pl-pax{grid-template-columns:1fr}
.pl-go .btn{width:100%;justify-content:center}
}
/* ---- header without the Plan My Trip button ---------------------------
The CTA used to sit between the menus and the cart. With it gone the three
menus slide right and end beside the cart, so the row reads brand ... menus,
cart — no gap where the button was. */
.nav-row{gap:20px}
.main-nav{margin-left:auto;margin-right:0}
.nav-actions{margin-left:18px}
@media(max-width:1024px){
.main-nav{margin-left:auto}
.nav-actions{margin-left:12px}
}
/* final pass: the tool sits inside one screen on a laptop */
.pw-rail{padding:10px 0 0}
.pw-track{margin:0 6% 9px;height:3px}
.pw-dot i{width:21px;height:21px;font-size:.72rem}
.pw-dot span{font-size:.62rem;letter-spacing:.08em}
.pw-dot em{font-size:.72rem}
.pw-stage{min-height:238px;padding:4px 0 0}
.pw-ask{font-size:clamp(1.25rem,2.4vw,1.55rem);margin:0 0 3px}
.pw-hint{font-size:.87rem;margin-bottom:11px;line-height:1.55}
.pw-orsome{margin:10px 0 6px;font-size:.7rem}
.pw-nav{margin-top:11px;padding-top:11px}
.pl-fine{margin-top:7px;font-size:.75rem;line-height:1.5}
.plan-block{padding-top:10px;padding-bottom:20px}
.plan-card{padding:2px 26px 14px}
.pl-dest{padding:6px 9px}
#pl-dest{padding:6px 4px}
.pl-route{margin-top:10px;padding:9px 12px}
.pl-len-first{margin:0 auto 12px;padding-bottom:12px}
.pl-vehwrap{max-width:400px;margin:0 auto}
/* no max-height: capping it letterboxed the panel, which is the cropping we removed.
The card's own width is what sets the size; the photo keeps its own proportions. */
@media(max-height:760px){
.plan-hero{padding:14px 0 8px}
.plan-hero .lead{display:none}
.pw-stage{min-height:220px}
}
/* Step 3 is the tallest, and the stage locks to the tallest — so trimming the
vehicle panel here shortens the whole card on every step. */
.pl-vehwrap{max-width:330px}
.pl-vehwrap.is-two{max-width:none}
.pv-body{padding:9px 14px 11px}
.pv-body b{font-size:1.05rem}
.pv-body em{margin-top:4px}
.pl-pax{gap:10px}
.stepper{padding:10px 12px}
/* the headline folds away the moment the traveler starts answering, so the tool
lifts up under the header and the whole thing sits on one screen */
.plan-hero{transition:padding .34s ease, opacity .28s ease}
.plan-hero .eyebrow,.plan-hero h1,.plan-hero .lead{
transition:opacity .24s ease, transform .3s ease, margin .3s ease, font-size .3s ease}
.plan-hero.is-folded{padding:10px 0 0}
.plan-hero.is-folded .lead{display:none}
.plan-hero.is-folded .eyebrow{margin:0;font-size:.66rem}
.plan-hero.is-folded h1{font-size:1.02rem;line-height:1.3;color:var(--muted);font-family:var(--sans);
font-weight:500;margin:0}
.plan-hero.is-folded h1 .h1-line2{display:none}
@media (prefers-reduced-motion: reduce){
.plan-hero,.plan-hero .eyebrow,.plan-hero h1,.plan-hero .lead{transition:none}
}
/* Step 3 side by side on a wide screen: travelers left, vehicle right. The photo
keeps its full size — stacking them was what made this the tallest step and set
the height of all four. */
@media(min-width:820px){
.pw-step[data-step="3"] .pl-pax{
display:grid;grid-template-columns:1fr 1fr;gap:12px;
max-width:380px;margin:0 0 0 auto}
.pw-step[data-step="3"] .pl-3col{
display:grid;grid-template-columns:1fr 340px;gap:26px;align-items:center;
max-width:760px;margin:0 auto;text-align:left}
.pw-step[data-step="3"] .pl-3col>*{min-width:0}
.pw-step[data-step="3"] #pl-vehlabel{margin:0 0 7px;text-align:left}
.pw-step[data-step="3"] .pl-vehwrap{max-width:340px;margin:0}
.pw-step[data-step="3"] .pl-vehwrap.is-two{max-width:none;grid-template-columns:1fr}
.pw-step[data-step="3"] .pl-vehwrap.is-two .pv-art{max-height:120px;object-fit:cover}
}
/* =====================================================================================
AMIN TOURS — the skin. Appended after the shared engine styles; every rule here
either re-tokens the palette/type or styles the components that exist only on this
site (split hero with the postcard stack, proof strip, poster cards, category tiles,
the "firsts" track, press band, product cover, itinerary tabs + timeline).
Palette is the logo's: navy #112131 · terracotta #CE4420 · white.
Type: Outfit (display — the same heavy geometric family as the wordmark) + Manrope.
===================================================================================== */
:root{
--ink:#112131;
--navy:#112131;
--navy-2:#1B3350;
--body:#34404E;
--muted:#6C7787;
--accent:#CE4420;
--accent-dark:#A8331A;
--accent-deep:#112131;
--accent-tint:#FBE3DB;
--accent-soft:#FDF1EC;
--terra-2:#E8663F;
--ivory:#FBF8F4;
--sand:#F6F1EA;
--cloud:#F2F5F8;
--border:#E7E4DF;
--white:#fff;
--green:#1E8A4A;
--red:#A0392E;
--laurel:#B98A3C;
--serif:'Outfit','Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--sans:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
--maxw:1160px;
--radius:16px;
--shadow:0 1px 2px rgba(17,33,49,.05),0 12px 32px rgba(17,33,49,.08);
--shadow-lift:0 4px 8px rgba(17,33,49,.08),0 24px 56px rgba(17,33,49,.16);
}
body{color:var(--body);font-weight:450}
h1,h2,h3,.serif{font-weight:700;letter-spacing:-.022em;line-height:1.14}
h1{font-size:clamp(2rem,4.2vw,3.1rem);font-weight:800}
h2{font-size:clamp(1.55rem,3vw,2.2rem)}
a{color:var(--accent-dark)}
a:hover{color:var(--accent)}
.eyebrow{letter-spacing:.2em;font-size:.7rem}
/* the two-tone bar: terracotta with a navy tail — the site's small signature */
.accent-rule{width:48px;height:4px;border-radius:2px;background:linear-gradient(90deg,var(--accent) 0 66%,var(--ink) 66% 100%)}
.btn{border-radius:12px;font-weight:700;padding:14px 26px}
.btn-primary{background:var(--accent);box-shadow:0 8px 20px -8px rgba(206,68,32,.6)}
.btn-primary:hover{background:var(--accent-dark)}
.btn-ghost{border-color:#D5D9E0;color:var(--ink)}
.btn-ghost:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.btn.sm{padding:10px 18px;font-size:.86rem;border-radius:10px}
section.block{padding:70px 0}
section.block.tint{background:var(--sand);border-color:transparent}
.section-head p:not(.eyebrow){color:var(--muted)}
.trust-item{border-radius:var(--radius)}
.trust-item .ti-num{color:var(--accent);font-weight:800}
.faq details{border-radius:14px}
.cta-band{background:var(--ink)}
.cta-band h2{color:#fff}
/* ---------- header ---------- */
.topbar{background:var(--ink);color:#C8D0DA}
.topbar a{color:#C8D0DA}
.topbar .tb-award{color:#FFB59B;letter-spacing:.14em;font-size:.7rem}
.topbar .tb-ta b{color:#fff;font-weight:800}
.topbar .tb-right{gap:22px}
.brand-link img{height:44px;width:auto}
.nav-row{min-height:82px}
nav.main-nav a.nav-link{font-weight:600}
.nav-actions{display:flex;align-items:center;gap:12px}
.nav-actions .nav-cta{display:inline-flex;align-items:center;gap:8px;background:var(--accent);border-radius:12px;padding:10px 16px;font-size:.88rem;font-weight:700;box-shadow:0 8px 18px -8px rgba(206,68,32,.7)}
.nav-actions .nav-cta:hover{background:var(--accent-dark)}
.nav-actions .nav-cta .wa-ico{width:18px;height:18px}
.nav-top{font-weight:600}
@media(max-width:940px){
.nav-actions .nav-cta span{display:none}
.nav-actions .nav-cta{padding:10px 12px}
nav.main-nav a.nav-link{display:block}
}
/* ---------- hero: white, split, a stack of postcards in 3D ---------- */
.hero.hero-split{background:#fff;color:var(--ink);min-height:0;overflow:visible;isolation:auto}
.hero.hero-split::after{display:none}
.hero-split .container>*{max-width:none}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center;padding-top:54px;padding-bottom:64px}
.hero-split .eyebrow{color:var(--accent)}
.hero-split h1{color:var(--ink);text-shadow:none;font-size:clamp(2.1rem,3.7vw,3.2rem);max-width:none;letter-spacing:-.03em}
.hero-split .h1-line2{display:block;color:var(--accent)}
.hero-lead{font-size:1.06rem;line-height:1.65;color:var(--body);max-width:540px;margin-top:18px}
.hero-lead b{color:var(--ink);font-weight:800}
.hero-chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.hero-chips li{background:var(--sand);border:1px solid var(--border);border-radius:999px;padding:7px 13px;font-size:.8rem;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:6px}
.hero-chips li::before{content:"✓";color:var(--accent);font-weight:800}
.hero-split .btn-row{margin-top:28px}
.hero-stage{perspective:1300px;position:relative;min-height:470px}
.stack{position:relative;height:470px;transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .18s ease-out;will-change:transform}
.pc{position:absolute;margin:0;background:#fff;padding:8px 8px 34px;border-radius:16px;box-shadow:0 34px 60px -24px rgba(17,33,49,.42),0 6px 14px -8px rgba(17,33,49,.25);transform-style:preserve-3d;overflow:hidden}
.pc img{width:100%;height:100%;object-fit:cover;border-radius:10px;display:block}
.pc figcaption{position:absolute;left:14px;bottom:10px;font:700 .68rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.pc-1{left:0;top:18px;width:64%;height:72%;transform:translateZ(40px) rotate(-3deg)}
.pc-2{right:0;top:0;width:42%;height:50%;transform:translateZ(0) rotate(4deg)}
.pc-3{right:2%;bottom:0;width:44%;height:50%;transform:translateZ(90px) rotate(-2deg)}
.stamp{position:absolute;left:8%;bottom:-6px;width:124px;height:124px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;transform:translateZ(140px) rotate(-10deg);box-shadow:0 22px 40px -16px rgba(206,68,32,.7);animation:stamp-bob 6s ease-in-out infinite}
.stamp::before{content:"";position:absolute;inset:7px;border:2px dashed rgba(255,255,255,.75);border-radius:50%;animation:stamp-spin 40s linear infinite}
.stamp-in{text-align:center;line-height:1}
.stamp-in b{display:block;font-family:var(--serif);font-size:2rem;font-weight:800;letter-spacing:-.03em}
.stamp-in small{display:block;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;margin-top:4px}
.stamp-in i{display:block;font-style:normal;font-size:.7rem;font-weight:700;margin-top:5px;color:#FFD9CB}
@keyframes stamp-bob{0%,100%{transform:translateZ(140px) rotate(-10deg) translateY(0)}50%{transform:translateZ(140px) rotate(-10deg) translateY(-8px)}}
@keyframes stamp-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.stamp,.stamp::before{animation:none}}
@media(max-width:940px){
.hero-grid{grid-template-columns:1fr;gap:34px;padding-top:36px;padding-bottom:44px}
.hero-stage,.stack{min-height:0;height:300px}
.stamp{width:96px;height:96px}
.stamp-in b{font-size:1.5rem}
}
@media(max-width:520px){.hero-stage,.stack{height:250px}.pc{padding:5px 5px 24px}.pc figcaption{display:none}}
/* the stage settles in after the words */
@media (prefers-reduced-motion:no-preference){
.motion .hero-lead,.motion .hero-chips li,.motion .hero-stage .pc,.motion .stamp{animation:kl-rise .62s cubic-bezier(.22,.68,.32,1) backwards}
.motion .hero-lead{animation-delay:.22s}
.motion .hero-chips li:nth-child(1){animation-delay:.3s}
.motion .hero-chips li:nth-child(2){animation-delay:.36s}
.motion .hero-chips li:nth-child(3){animation-delay:.42s}
.motion .hero-chips li:nth-child(4){animation-delay:.48s}
.motion .pc-2{animation-delay:.2s}
.motion .pc-1{animation-delay:.32s}
.motion .pc-3{animation-delay:.44s}
.motion .stamp{animation:kl-rise .62s cubic-bezier(.22,.68,.32,1) .6s backwards, stamp-bob 6s ease-in-out 1.3s infinite}
}
/* ---------- proof strip ---------- */
.proof-strip{background:var(--sand);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.proof-strip .container{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 28px;padding-top:20px;padding-bottom:20px}
.proof{display:flex;align-items:center;gap:12px;min-width:0}
.proof>svg{width:34px;height:34px;color:var(--accent);flex:none}
.pf-logo{height:22px;width:auto;flex:none}
.pf-word{font-family:var(--serif);font-weight:800;letter-spacing:-.02em;font-size:1.05rem;line-height:1;color:var(--ink);flex:none;white-space:nowrap}
.pf-word.lp{text-transform:lowercase;letter-spacing:-.03em}
.pf-text{display:flex;flex-direction:column;min-width:0}
.pf-text b{font-size:.88rem;font-weight:800;color:var(--ink);line-height:1.2}
.pf-text small{font-size:.72rem;color:var(--muted);line-height:1.35;margin-top:2px}
@media(max-width:940px){.proof-strip .container{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.proof-strip .container{grid-template-columns:1fr}}
/* ---------- poster cards ---------- */
.card-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px}
.tour-card.poster{background:transparent;border:0;box-shadow:none;border-radius:18px;overflow:visible;transition:none}
.tour-card.poster:hover{transform:none;box-shadow:none}
.pc-link{display:block;position:relative;aspect-ratio:4/5;border-radius:18px;overflow:hidden;box-shadow:var(--shadow);color:#fff;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;isolation:isolate}
.pc-link:hover{color:#fff;box-shadow:var(--shadow-lift);transform:translateY(-4px)}
.pc-media{position:absolute;inset:0;background:var(--navy-2)}
.pc-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.pc-link:hover .pc-img{transform:scale(1.06)}
.pc-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,33,49,.18) 0%,rgba(17,33,49,0) 32%,rgba(17,33,49,.22) 55%,rgba(17,33,49,.9) 100%)}
.pc-top{position:absolute;top:12px;left:12px;right:12px;display:flex;gap:6px;justify-content:space-between;align-items:flex-start;z-index:2}
.pc-chips{display:flex;gap:6px;flex-wrap:wrap;min-width:0}
.pc-chip{background:rgba(255,255,255,.93);color:var(--ink);font-size:.68rem;font-weight:700;padding:5px 10px;border-radius:999px;line-height:1.2}
.pc-chip.cat{background:var(--accent);color:#fff;text-transform:uppercase;letter-spacing:.08em;font-size:.6rem;font-weight:800}
.pc-best{flex:none;background:#F5C451;color:#3D2A00;font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;padding:5px 10px;border-radius:999px;line-height:1.2}
.pc-body{position:absolute;left:0;right:0;bottom:0;padding:18px 18px 16px;z-index:2;display:flex;flex-direction:column;gap:5px}
.pc-title{font-family:var(--serif);font-weight:700;font-size:1.1rem;line-height:1.22;color:#fff;letter-spacing:-.012em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pc-route{font-size:.76rem;color:rgba(255,255,255,.84);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-foot{display:flex;justify-content:space-between;align-items:center;margin-top:6px;padding-top:10px;border-top:1px solid rgba(255,255,255,.22)}
.pc-price{display:flex;align-items:baseline;gap:5px}
.pc-price small{font-size:.64rem;text-transform:uppercase;letter-spacing:.1em;opacity:.85;font-weight:700}
.pc-price b{font-family:var(--serif);font-size:1.32rem;font-weight:800;line-height:1}
.pc-go{width:34px;height:34px;border-radius:50%;background:var(--accent);display:grid;place-items:center;font-weight:800;font-size:1rem;transition:transform .3s,background .3s}
.pc-link:hover .pc-go{transform:translateX(4px);background:var(--terra-2)}
.motion .tour-card.poster.tilt:hover{box-shadow:none}
.card-rail{grid-auto-columns:calc((100% - 66px)/4);gap:22px}
@media(max-width:1000px){.card-rail{grid-auto-columns:calc((100% - 44px)/3)}}
@media(max-width:700px){.card-rail{grid-auto-columns:calc((100% - 22px)/2)}}
@media(max-width:460px){.card-rail{grid-auto-columns:82%}}
.rail-wrap>button{border-radius:12px}
/* ---------- category tiles ---------- */
.cat-block{padding-top:60px}
.cat-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.cat-tile{position:relative;display:block;aspect-ratio:4/3.1;border-radius:20px;overflow:hidden;color:#fff;box-shadow:var(--shadow);isolation:isolate}
.cat-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.cat-tile:hover img{transform:scale(1.06)}
.cat-tile:hover{color:#fff}
.ct-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,33,49,0) 30%,rgba(17,33,49,.86) 100%)}
.ct-text{position:absolute;left:22px;right:22px;bottom:20px}
.ct-text small{display:block;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:#FFD9CB;margin-bottom:6px}
.ct-text b{display:block;font-family:var(--serif);font-size:1.7rem;font-weight:800;line-height:1.05;letter-spacing:-.02em}
.ct-text i{display:block;font-style:normal;font-size:.9rem;opacity:.92;margin-top:5px}
@media(max-width:800px){.cat-tiles{grid-template-columns:1fr}.cat-tile{aspect-ratio:16/8}}
/* ---------- the firsts: five cards on a curved 3D track ---------- */
.firsts{background:var(--ink);color:#C9D1DC;overflow:hidden}
.firsts .section-head h2{color:#fff}
.firsts .section-head p:not(.eyebrow){color:#B9C3D1}
.firsts .eyebrow{color:#FFB59B}
.firsts .accent-rule{background:linear-gradient(90deg,var(--accent) 0 66%,#fff 66% 100%)}
.firsts-track{perspective:1600px;perspective-origin:50% 40%;padding:24px 4px 26px}
.firsts-list{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;transform-style:preserve-3d;position:relative;margin:0;padding:0}
.firsts-list::before{content:"";position:absolute;left:0;right:0;top:34px;height:2px;background:linear-gradient(90deg,var(--accent),rgba(255,255,255,.14))}
.first-card{position:relative;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:56px 18px 22px;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.2,.7,.2,1),background .3s,border-color .3s;backface-visibility:hidden}
.first-card::before{content:"";position:absolute;top:25px;left:18px;width:18px;height:18px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px rgba(206,68,32,.28)}
.fc-year{position:absolute;top:25px;left:44px;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:#FFB59B;white-space:nowrap}
.first-card h3{color:#fff;font-size:1.04rem;margin-bottom:8px;line-height:1.25}
.first-card p{font-size:.86rem;color:#C9D1DC;line-height:1.6}
.first-card:nth-child(1){transform:rotateY(16deg) translateZ(-10px)}
.first-card:nth-child(2){transform:rotateY(8deg)}
.first-card:nth-child(3){transform:translateZ(14px)}
.first-card:nth-child(4){transform:rotateY(-8deg)}
.first-card:nth-child(5){transform:rotateY(-16deg) translateZ(-10px)}
.first-card:hover{transform:rotateY(0) translateZ(48px);background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28)}
@media(max-width:1000px){
.firsts-track{overflow-x:auto;perspective:none;scrollbar-width:none;margin:0 -22px;padding-left:22px;padding-right:22px}
.firsts-track::-webkit-scrollbar{display:none}
.firsts-list{grid-auto-flow:column;grid-auto-columns:minmax(250px,72%);grid-template-columns:none}
.first-card,.first-card:hover{transform:none}
}
/* ---------- press band ---------- */
.press-band{background:var(--sand)}
.press-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:24px;align-items:stretch}
.press-copy p:not(.eyebrow){color:var(--muted);margin-top:14px}
.press-card{background:#fff;border:1px solid var(--border);border-radius:18px;padding:28px 26px;box-shadow:var(--shadow);display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.press-card::before{content:"“";position:absolute;right:16px;top:-14px;font-family:var(--serif);font-size:6rem;font-weight:800;color:var(--accent-tint);line-height:1}
.press-card .pf-word{font-size:1.5rem;display:block;margin-bottom:10px;white-space:normal}
.press-card p{color:var(--muted);font-size:.9rem}
@media(max-width:900px){.press-grid{grid-template-columns:1fr}}
/* ---------- reviews ---------- */
.reviews-band{background:#fff}
.rv-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:36px;align-items:center;margin-bottom:34px}
.rv-score{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;gap:2px 16px;align-items:center;background:#fff;border:1px solid var(--border);border-radius:22px;padding:22px 28px;box-shadow:var(--shadow)}
.rv-big{font-family:var(--serif);font-size:4.2rem;font-weight:800;line-height:.95;color:var(--ink);grid-row:1/3;letter-spacing:-.04em}
.rv-owl img{height:20px;width:auto;display:block}
.rc-stars .ta-mark{height:16px;width:auto;display:inline-block;vertical-align:middle;margin-right:6px}
.rv-sub b{display:block;color:#00AA6C;font-weight:800;font-size:.95rem}
.rv-sub small{color:var(--muted);font-size:.78rem}
.rv-copy h2{font-size:clamp(1.35rem,2.4vw,1.75rem)}
.rv-copy p:not(.eyebrow){color:var(--muted);margin-top:12px;max-width:62ch}
.review-card{border-radius:16px}
.rc-who{display:block;font-size:.76rem;color:var(--muted);margin-top:10px;font-weight:600}
@media(max-width:800px){.rv-head{grid-template-columns:1fr;gap:20px}}
/* ---------- product page: cover, thumbs, chips, tabs, timeline ---------- */
.product-cover{position:relative;color:#fff;background-color:var(--ink);background-image:var(--cover,none);background-size:cover;background-position:center 40%;isolation:isolate;padding:14px 0 44px;min-height:440px;display:flex;align-items:flex-end}
.product-cover::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,33,49,.42) 0%,rgba(17,33,49,.12) 35%,rgba(17,33,49,.55) 65%,rgba(17,33,49,.9) 100%);z-index:-1}
.product-cover .container{position:relative;width:100%}
.product-cover .crumbs{padding:0;color:rgba(255,255,255,.78)}
.product-cover .crumbs a{color:rgba(255,255,255,.78)}
.product-cover .crumbs a:hover{color:#fff}
.product-cover .crumbs span[aria-current]{color:#fff}
.product-cover .eyebrow{color:#FFB59B;margin-top:150px}
.product-cover h1{color:#fff;font-size:clamp(1.7rem,3.3vw,2.55rem);max-width:820px;text-shadow:0 2px 20px rgba(0,0,0,.35)}
.cover-sub{max-width:660px;color:rgba(255,255,255,.9);font-size:1rem;margin-top:12px;line-height:1.6}
.cover-open{position:relative;display:inline-flex;margin-top:18px;background:rgba(255,255,255,.94);color:var(--ink);border:0;border-radius:12px;padding:10px 14px 10px 12px;font:700 .8rem var(--sans);cursor:pointer;display:flex;align-items:center;gap:8px;box-shadow:var(--shadow)}
.cover-open::before{content:"";width:16px;height:14px;background:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,") center/contain no-repeat}
.cover-open:hover{background:#fff}
.product-layout{padding-top:0;gap:44px}
.product-layout>.book-widget{margin-top:-72px;position:sticky;z-index:5}
.thumb-strip{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:-42px 0 26px;z-index:2}
.thumb-strip>button.lb-open{border:4px solid #fff;border-radius:14px;overflow:hidden;padding:0;background:#fff;aspect-ratio:4/3;cursor:zoom-in;box-shadow:var(--shadow);display:block}
.thumb-strip>button.lb-open img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.thumb-strip>button.lb-open:hover img{transform:scale(1.05)}
.fact-chips{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0 0 30px}
.fact-chips li{display:flex;flex-direction:column;gap:2px;background:var(--sand);border:1px solid var(--border);border-radius:14px;padding:10px 14px;flex:1 1 150px;min-width:0}
.fact-chips small{font-size:.62rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:800}
.fact-chips span{font-size:.86rem;font-weight:700;color:var(--ink);line-height:1.3}
.p-section>h2{font-size:1.4rem}
.itin-hint{font-size:.86rem;color:var(--muted);margin-bottom:12px}
.itin-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 8px;margin-bottom:12px;scrollbar-width:thin}
.itin-tab{flex:none;border:1px solid var(--border);background:#fff;border-radius:14px;padding:10px 16px;text-align:left;cursor:pointer;font-family:var(--sans);min-width:150px;max-width:220px;transition:background .2s,border-color .2s}
.itin-tab b{display:block;font-family:var(--serif);font-size:.95rem;font-weight:700;color:var(--ink)}
.itin-tab small{display:block;font-size:.72rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.itin-tab:hover{border-color:var(--ink)}
.itin-tab[aria-selected=true]{background:var(--ink);border-color:var(--ink)}
.itin-tab[aria-selected=true] b,.itin-tab[aria-selected=true] small{color:#fff}
.itin-day[hidden]{display:none}
.day-head{display:flex;align-items:center;gap:12px;font-size:1.05rem;margin:8px 0 16px;color:var(--ink)}
.day-head .day-chip{background:var(--accent);color:#fff;font-size:.66rem;font-weight:800;padding:4px 10px;border-radius:999px;letter-spacing:.08em;text-transform:uppercase;font-family:var(--sans);flex:none}
.day-head .day-count{margin-left:auto;font-size:.76rem;color:var(--muted);font-family:var(--sans);font-weight:700;flex:none}
.timeline{list-style:none;position:relative;padding-left:32px;margin:0}
.timeline::before{content:"";position:absolute;left:9px;top:10px;bottom:10px;width:2px;background:linear-gradient(var(--accent),var(--border))}
.timeline .stop{position:relative;padding:10px 0 20px;border:0}
.timeline .stop h3{color:var(--ink);font-size:1.02rem;margin-bottom:6px}
.tl-dot{position:absolute;left:-32px;top:15px;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--accent);box-shadow:0 0 0 4px #fff}
.timeline .callout,.timeline .notebox{margin:4px 0 20px;list-style:none}
.timeline .callout{background:var(--accent-soft);border:1px solid var(--accent-tint);border-left:4px solid var(--accent)}
.timeline .callout h4{color:var(--accent-dark)}
.timeline .callout .co-price{color:var(--accent-dark)}
.timeline .notebox{background:var(--sand);border-left:4px solid var(--laurel)}
.tl-more[hidden]{display:none}
.tl-more{padding:0;list-style:none}
.tl-tail{list-style:none;margin:0;padding:0}
.tl-more-btn{list-style:none;padding:4px 0 6px}
@media(max-width:940px){
.product-cover .eyebrow{margin-top:110px}
.product-layout>.book-widget{margin-top:0}
.thumb-strip{margin-top:-30px}
}
@media(max-width:560px){.thumb-strip{grid-template-columns:repeat(2,1fr)}}
/* keep the booking panel head navy, the price terracotta */
.bw-head{background:var(--ink)}
.bw-head small{color:#FFB59B}
.bw-head .bw-price span{color:#B9C3D1}
.bw-total{background:var(--accent-soft);border-color:var(--accent-tint)}
.bw-total .t-value{color:var(--ink)}
.callout{background:var(--accent-soft);border-color:var(--accent-tint)}
.callout h4{color:var(--accent-dark)}
.callout .co-price{color:var(--accent-dark)}
.highlights li::before{background:var(--accent-tint);border-color:var(--accent)}
/* ---------- footer ---------- */
footer{background:var(--ink);color:#B9C3D1}
footer a{color:#B9C3D1}
footer a:hover{color:#FFB59B}
.footer-brand img{height:44px;width:auto;filter:none;margin-bottom:16px}
.footer-award{display:block;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:16px 18px;margin-top:20px}
.fa-ta{display:flex;align-items:center;gap:12px;color:#fff}
.fa-ta:hover{color:#fff}
.fa-ta b{color:#fff;font-family:var(--serif);font-size:2.2rem;font-weight:800;line-height:1;letter-spacing:-.03em}
.fa-ta small{font-size:.76rem;color:#B9C3D1;line-height:1.35}
.fa-press{display:block;font-size:.76rem;color:#B9C3D1;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.1);line-height:1.5}
.fa-press b{color:#fff;font-weight:700}
.footer-bottom{border-color:rgba(255,255,255,.1)}
.wa-float{border-radius:14px}
.product-cover .bs-medal{position:absolute;top:auto;left:auto;right:0;bottom:8px;margin:0}
@media(max-width:940px){.product-cover .bs-medal{display:none}}
.bs-medal{background:linear-gradient(180deg,rgba(17,33,49,.86),rgba(17,33,49,.96));border-color:rgba(245,196,81,.6)}
/* ---------- "Most booked" mark (replaces any medal) ---------- */
.mb-mark{position:absolute;right:0;bottom:8px;z-index:3;display:inline-flex;align-items:center;gap:9px;background:#fff;color:var(--ink);border-radius:12px;padding:8px 14px 8px 11px;box-shadow:var(--shadow);font-family:var(--sans)}
.mb-mark i{width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-tint);flex:none}
.mb-mark b{font-size:.82rem;font-weight:800;line-height:1.1}
.mb-mark small{display:block;font-size:.66rem;color:var(--muted);font-weight:600;letter-spacing:.04em}
.mb-mark.mb-inline{position:static;margin-top:14px}
@media(max-width:940px){.product-cover .mb-mark{display:none}}
.pc-best{flex:none;display:inline-flex;align-items:center;gap:6px;background:#fff;color:var(--ink);font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;padding:5px 10px 5px 8px;border-radius:999px;line-height:1.2}
.pc-best i{width:7px;height:7px;border-radius:50%;background:var(--accent);flex:none}
.credits-table td,.credits-table th{font-size:.86rem;vertical-align:top}
/* =============== the trip builder (replaces the OTA-style 3-step modal) ===============
One panel, no wizard: the traveler's date sits in a bar at the top, the choices are
below it, and an itemised running quote is pinned underneath — so the price is never
more than a glance away and there is no "next step" to guess at. */
.tb{margin-top:16px;border-top:1px solid var(--border);padding-top:16px}
.tb[hidden]{display:none}
.tb-bar{display:flex;align-items:center;gap:12px;background:var(--ink);color:#fff;border-radius:12px;padding:11px 12px 11px 15px}
.tb-when{min-width:0;flex:1}
.tb-when b{display:block;font-size:.88rem;font-weight:700;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-when small{display:block;font-size:.74rem;color:#B9C3D1;margin-top:2px}
.tb-edit{flex:none;background:rgba(255,255,255,.14);border:0;color:#fff;border-radius:8px;padding:7px 12px;font:700 .76rem var(--sans);cursor:pointer}
.tb-edit:hover{background:rgba(255,255,255,.26)}
.tb-scroll{padding-top:4px}
.tb-block{margin-top:16px}
.tb-block[hidden]{display:none}
.tb-h{font-size:.72rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--ink);margin-bottom:9px;display:flex;align-items:center;gap:8px}
.tb-h span{background:var(--sand);color:var(--muted);border-radius:999px;padding:2px 8px;font-size:.62rem;letter-spacing:.08em}
.tb-opt{display:flex;gap:11px;align-items:flex-start;border:1.5px solid var(--border);border-radius:12px;padding:12px 13px;margin-bottom:9px;cursor:pointer;background:#fff;transition:border-color .18s,background .18s}
.tb-opt:hover{border-color:var(--ink)}
.tb-opt.sel{border-color:var(--accent);background:var(--accent-soft)}
.tb-opt input{margin-top:3px;accent-color:var(--accent);width:18px;height:18px;flex:none}
.tb-opt-txt{flex:1;min-width:0}
.tb-opt-txt b{display:block;font-size:.95rem;font-weight:800;color:var(--ink);line-height:1.25}
.tb-opt-txt small{display:block;font-size:.8rem;color:var(--muted);margin-top:3px;line-height:1.45}
.tb-more{display:block;margin-top:6px}
.tb-more-btn{background:none;border:0;padding:0;color:var(--accent-dark);font:800 .76rem var(--sans);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.tb-more ul{list-style:none;margin-top:6px;display:grid;gap:4px}
.tb-more ul[hidden]{display:none}
.tb-more li{position:relative;padding-left:14px;font-size:.78rem;color:var(--body);line-height:1.45}
.tb-more li::before{content:"";position:absolute;left:2px;top:.55em;width:5px;height:5px;border-radius:50%;background:var(--accent)}
.tb-opt-pp{flex:none;text-align:right}
.tb-opt-pp b{display:block;font-family:var(--serif);font-size:1.1rem;font-weight:800;color:var(--ink)}
.tb-opt-pp small{font-size:.66rem;color:var(--muted)}
.tb-chips{display:flex;flex-wrap:wrap;gap:8px}
.tb-chip{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--border);background:#fff;border-radius:999px;padding:7px 13px 7px 10px;cursor:pointer;font-family:var(--sans);transition:border-color .18s,background .18s,color .18s}
.tb-chip:hover{border-color:var(--ink)}
.tb-chip-x{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--border);position:relative;flex:none;transition:background .18s,border-color .18s}
.tb-chip-x::before,.tb-chip-x::after{content:"";position:absolute;background:var(--muted);border-radius:1px;transition:background .18s}
.tb-chip-x::before{left:3px;right:3px;top:6.2px;height:1.6px}
.tb-chip-x::after{top:3px;bottom:3px;left:6.2px;width:1.6px}
.tb-chip-t{font-size:.82rem;font-weight:700;color:var(--ink)}
.tb-chip-p{font-size:.78rem;font-weight:800;color:var(--muted)}
.tb-chip.on{border-color:var(--accent);background:var(--accent-soft)}
.tb-chip.on .tb-chip-x{background:var(--accent);border-color:var(--accent)}
.tb-chip.on .tb-chip-x::before{background:#fff}
.tb-chip.on .tb-chip-x::after{opacity:0}
.tb-chip.on .tb-chip-p{color:var(--accent-dark)}
.tb-quote{margin-top:18px;background:var(--sand);border:1px solid var(--border);border-radius:14px;padding:14px 15px 15px}
.tb-lines{list-style:none;display:grid;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.tb-lines li{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#fff;padding:10px 12px}
.tb-lines li.extra{background:#fff}
.tb-lines li.muted .tl-t b{color:var(--muted);font-weight:600}
.tl-t b{display:block;font-size:.86rem;font-weight:700;color:var(--ink);line-height:1.25}
.tl-t small{display:block;font-size:.72rem;color:var(--muted);margin-top:2px}
.tl-v{font-family:var(--serif);font-size:1rem;font-weight:800;color:var(--ink);white-space:nowrap}
.tb-total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:12px;padding-top:11px;border-top:2px solid var(--ink)}
.tb-total span{font-size:.82rem;color:var(--muted);font-weight:600}
.tb-total b{color:var(--ink)}
.tb-total .tb-sum{font-family:var(--serif);font-size:1.7rem;font-weight:800;letter-spacing:-.02em}
.tb-note{font-size:.74rem;color:var(--muted);line-height:1.5;margin:10px 0 11px}
.tb-add{width:100%}
.tb-add[disabled]{background:#D8DEE6;color:#6C7787;box-shadow:none}
.tb-wa{display:block;text-align:center;margin-top:9px;font-size:.78rem;font-weight:700;color:var(--accent-dark)}
/* on a phone the builder docks to the bottom of the screen and the page stays put */
@media(max-width:940px){
body.tb-open{overflow:hidden}
body.tb-open .tb{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:80;margin:0;background:#fff;
border-radius:18px 18px 0 0;border-top:0;box-shadow:0 -18px 50px rgba(17,33,49,.3);
padding:12px 16px calc(14px + env(safe-area-inset-bottom));max-height:88vh;display:flex;flex-direction:column}
body.tb-open .tb-scroll{overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch}
body.tb-open .tb-quote{margin-top:12px}
body.tb-open::after{content:"";position:fixed;inset:0;background:rgba(17,33,49,.5);z-index:79}
}
.tb-chips{display:grid;gap:8px}
.tb-group{border:1px solid var(--border);border-radius:12px;background:#fff;overflow:hidden}
.tb-group summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;padding:10px 13px;font-size:.84rem;font-weight:700;color:var(--ink)}
.tb-group summary::-webkit-details-marker{display:none}
.tb-group summary::after{content:"+";margin-left:auto;color:var(--accent);font-size:1.15rem;line-height:1;font-weight:700}
.tb-group[open] summary::after{content:"–"}
.tb-group .tb-count{background:var(--accent);color:#fff;border-radius:999px;min-width:19px;height:19px;display:inline-flex;align-items:center;justify-content:center;font-size:.68rem;font-weight:800;padding:0 5px}
.tb-group .tb-count[hidden]{display:none}
.tb-group-in{display:flex;flex-wrap:wrap;gap:7px;padding:0 13px 13px}
@media(min-width:941px){.tb-scroll{max-height:calc(100vh - 430px);min-height:150px;overflow-y:auto;padding-right:4px}}
/* once the builder is open the date and steppers fold away — the bar at the top of the
builder carries them, and "Change" brings them back */
.book-widget.is-building .bw-body > label,
.book-widget.is-building #bw-date,
.book-widget.is-building .stepper,
.book-widget.is-building .bw-actions,
.book-widget.is-building .bw-note{display:none}
.book-widget.is-building .tb{margin-top:0;border-top:0;padding-top:0}
/* ---------- the quick-view pop-up on /booking/ (the only overlay left on the site) ---------- */
.bkmodal{position:fixed;inset:0;z-index:90;background:rgba(17,33,49,.55);display:none;align-items:center;justify-content:center;padding:22px}
.bkmodal.open{display:flex}
.bk-panel{background:#fff;border-radius:18px;width:min(720px,100%);max-height:min(90vh,900px);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 80px rgba(17,33,49,.4)}
.bk-close{background:rgba(17,33,49,.06);border:0;width:34px;height:34px;border-radius:50%;font-size:1.3rem;line-height:1;cursor:pointer;color:var(--ink)}
.bk-close:hover{background:rgba(17,33,49,.14)}
.bk-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 22px;border-top:1px solid var(--border);background:var(--sand)}
.bk-total small{display:block;font-size:.68rem;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);font-weight:800}
.bk-total strong{font-family:var(--serif);font-size:1.4rem;font-weight:800;color:var(--ink)}
.bk-btns{display:flex;gap:10px}
/* ---------- vehicles: drawn, not photographed ---------- */
.veh-art{width:100%;height:auto;display:block;max-width:340px}
.veh-list{display:grid;gap:18px}
.veh-list .veh-row{display:grid;grid-template-columns:300px minmax(0,1fr);gap:26px;align-items:center;background:#fff;border:1px solid var(--border);border-radius:18px;padding:24px 26px;box-shadow:var(--shadow)}
.veh-art-wrap{background:var(--sand);border-radius:14px;padding:18px;display:grid;place-items:center}
.veh-txt h2{font-size:1.4rem;margin:2px 0 8px}
.veh-txt>p{color:var(--muted)}
.veh-specs{list-style:none;display:grid;gap:7px;margin-top:14px}
.veh-specs li{display:grid;grid-template-columns:200px minmax(0,1fr);gap:12px;font-size:.88rem;padding-bottom:7px;border-bottom:1px dashed var(--border)}
.veh-specs li:last-child{border-bottom:0}
.veh-specs b{color:var(--ink);font-weight:800}
.veh-specs span{color:var(--muted)}
.vp-panel .veh-art{max-width:230px;margin-bottom:10px}
@media(max-width:760px){
.veh-list .veh-row{grid-template-columns:1fr;gap:16px;padding:18px}
.veh-specs li{grid-template-columns:1fr;gap:2px}
}
/* cover: the mark and the photo button sit together under the summary line */
.product-cover .cover-open{margin-top:0}
.cover-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px}
.product-cover .mb-mark{position:static;margin:0}
@media(max-width:940px){.product-cover .mb-mark{display:inline-flex}}
/* a stop body may hold two paragraphs separated by a blank line; pre-line was giving
them a three-line gap, which read as a mistake */
.timeline .stop p,.timeline .callout p,.timeline .notebox p{white-space:normal}
.timeline .stop p{margin:0}
.timeline .stop .stop-txt p+p{margin-top:10px}
/* =====================================================================================
v2 (Zaidu review 2026-08-17) — every component below replaces one that read as a copy
of the sibling site: header without a strip above the logo, a one-per-row tour list
instead of a filter rail, numbered open questions instead of a plus/minus accordion,
a vehicle list instead of picture cards.
===================================================================================== */
/* ---- header: no topbar; rating sits with the actions ---- */
.site-header{border-bottom:1px solid var(--border)}
.nav-row{min-height:86px}
.hd-ta{display:flex;align-items:center;gap:9px;padding:7px 13px 7px 11px;border:1px solid var(--border);border-radius:12px;background:var(--sand)}
.hd-ta:hover{border-color:var(--ink);color:inherit}
.hd-ta b{font-family:var(--serif);font-size:1.34rem;font-weight:800;color:var(--ink);line-height:1;letter-spacing:-.03em}
.hd-ta small{font-size:.64rem;line-height:1.25;color:var(--muted);font-weight:700}
@media(max-width:1100px){.hd-ta{display:none}}
nav.main-nav{gap:22px}
.nav-menu-in .nm-all{color:var(--accent);font-weight:700}
/* ---- listing: tabs + one tour per row ---- */
.block.pt0{padding-top:26px}
.ls-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.ls-tabs a{border:1px solid var(--border);border-radius:999px;padding:9px 18px;font-size:.88rem;font-weight:700;color:var(--ink);background:#fff}
.ls-tabs a:hover{border-color:var(--ink);color:var(--ink)}
.ls-tabs a.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.ls-count{font-size:.82rem;color:var(--muted);font-weight:700;margin-bottom:14px}
.row-list{display:flex;flex-direction:column;gap:16px}
.row-card{display:grid;grid-template-columns:288px minmax(0,1fr) 210px;gap:0;border:1px solid var(--border);border-radius:18px;overflow:hidden;background:#fff;transition:box-shadow .3s,border-color .3s}
.row-card:hover{box-shadow:var(--shadow-lift);border-color:#D8D3CB}
.rc-img{position:relative;display:block;overflow:hidden;background:var(--sand);min-height:210px}
.rc-img img,.rc-noimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.row-card:hover .rc-img img{transform:scale(1.05)}
.rc-tag{position:absolute;top:12px;left:12px;background:var(--accent);color:#fff;font-size:.64rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:999px;z-index:1}
.rc-mid{padding:20px 24px;display:flex;flex-direction:column;gap:8px;min-width:0}
.rc-cat{font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--accent)}
.rc-mid h3{font-size:1.22rem;line-height:1.24}
.rc-mid h3 a{color:var(--ink)}
.rc-mid h3 a:hover{color:var(--accent)}
.rc-facts{list-style:none;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.82rem;color:var(--body);font-weight:600}
.rc-facts li{display:flex;align-items:center;gap:6px}
.rc-facts li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent);flex:none}
.rc-sum{font-size:.88rem;color:var(--muted);line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rc-side{border-left:1px solid var(--border);background:var(--sand);padding:20px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:10px}
.rc-price{display:flex;flex-direction:column;line-height:1.1}
.rc-price small{font-size:.66rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:800}
.rc-price b{font-family:var(--serif);font-size:1.9rem;font-weight:800;color:var(--ink);letter-spacing:-.03em;margin:2px 0}
.rc-side .btn{width:100%;text-align:center}
.rc-note{font-size:.7rem;color:var(--muted);line-height:1.35}
@media(max-width:900px){
.row-card{grid-template-columns:1fr}
.rc-img{min-height:200px;aspect-ratio:16/9}
.rc-side{border-left:0;border-top:1px solid var(--border);flex-direction:row;align-items:center;justify-content:space-between;gap:14px}
.rc-price{flex-direction:row;align-items:baseline;gap:6px}
.rc-price b{margin:0}
.rc-side .btn{width:auto}
.rc-note{display:none}
}
/* ---- questions: numbered, answered in the open ---- */
.qa-list{list-style:none;counter-reset:none;display:grid;grid-template-columns:1fr 1fr;gap:6px 40px;margin:0;padding:0}
.qa{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;padding:18px 0;border-top:1px solid var(--border)}
.qa-n{font-family:var(--serif);font-size:.9rem;font-weight:800;color:var(--accent);letter-spacing:.02em;padding-top:2px}
.qa-b h3{font-size:1.02rem;margin-bottom:6px;line-height:1.32}
.qa-b p{font-size:.92rem;color:var(--body);line-height:1.65}
.qa-more[hidden]{display:none}
.qa-toggle{margin-top:18px}
.product-main .qa-list,.narrow .qa-list{grid-template-columns:1fr}
@media(max-width:900px){.qa-list{grid-template-columns:1fr}}
/* ---- your vehicle ---- */
.sec-sub{font-size:.9rem;color:var(--muted);margin:-8px 0 16px;max-width:64ch}
.vh-list{list-style:none;border:1px solid var(--border);border-radius:16px;overflow:hidden}
.vh-list li{display:grid;grid-template-columns:86px 200px minmax(0,1fr);gap:16px;align-items:center;padding:14px 18px;border-top:1px solid var(--border);font-size:.9rem}
.vh-list li:first-child{border-top:0}
.vh-list li:nth-child(odd){background:var(--sand)}
.vh-pax{font-family:var(--serif);font-weight:800;color:var(--ink);font-size:1rem}
.vh-name{font-weight:700;color:var(--accent-dark)}
.vh-note{color:var(--muted);font-size:.85rem}
@media(max-width:720px){
.vh-list li{grid-template-columns:70px minmax(0,1fr);gap:4px 14px}
.vh-note{grid-column:2}
}
/* ---- product page: the cover carries no badge now ---- */
.cover-actions{display:flex;align-items:center;gap:12px;margin-top:18px}
.p-section>h2{font-size:1.35rem}
#not-included .exc-list{columns:2;column-gap:34px}
@media(max-width:720px){#not-included .exc-list{columns:1}}
/* ---- vehicles page: specification cards, no artwork (real fleet photos pending) ---- */
.veh-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.veh-card{border:1px solid var(--border);border-radius:18px;padding:26px 24px;background:#fff;box-shadow:var(--shadow)}
.veh-card h2{font-size:1.3rem;margin-bottom:8px}
.veh-blurb{font-size:.9rem;color:var(--muted);margin-bottom:16px;line-height:1.6}
.veh-specs{list-style:none;border-top:1px solid var(--border)}
.veh-specs li{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--border);font-size:.86rem}
.veh-specs b{color:var(--ink);font-weight:700}
.veh-specs span{color:var(--muted);text-align:right}
/* ---- footer, rebuilt: contact band on top, then proof + flat link row, then one line ---- */
footer{background:var(--ink);color:#B9C3D1}
.foot-talk{background:linear-gradient(100deg,#16283C 0%,#112131 62%);border-bottom:1px solid rgba(255,255,255,.09)}
.foot-talk .container{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:34px;align-items:center;padding-top:38px;padding-bottom:38px}
.ft-copy h2{color:#fff;font-size:clamp(1.3rem,2.2vw,1.75rem)}
.ft-copy p{color:#9FADBE;font-size:.92rem;margin-top:8px;max-width:52ch;line-height:1.6}
.ft-ways{display:flex;gap:10px;flex-wrap:wrap}
.ft-way{display:flex;align-items:center;gap:11px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:12px 16px;color:#fff;transition:background .2s,border-color .2s,transform .2s}
.ft-way:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);color:#fff;transform:translateY(-2px)}
.ft-way.wa:hover{background:#25D366;border-color:#25D366}
.ft-way .wa-ico{width:20px;height:20px;flex:none}
.ft-way span{display:flex;flex-direction:column;line-height:1.25}
.ft-way small{font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:#8FA0B4;font-weight:800}
.ft-way b{font-size:.9rem;font-weight:700}
.ft-way:hover small{color:rgba(255,255,255,.8)}
.foot-main{display:grid;grid-template-columns:300px minmax(0,1fr);gap:48px;padding-top:44px;padding-bottom:34px}
.foot-proof img{height:40px;width:auto;margin-bottom:18px}
.foot-proof .footer-award{margin-top:0}
.foot-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px}
.foot-links h4{color:#fff;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:14px;font-family:var(--sans)}
.foot-links a{display:block;color:#A9B6C6;font-size:.88rem;padding:5px 0}
.foot-links a:hover{color:#FFB59B}
.ft-soon{display:block;color:#6E7E90;font-size:.82rem;padding:5px 0}
.foot-legal{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.09);padding-top:18px;padding-bottom:26px;font-size:.76rem;color:#7E8DA0}
@media(max-width:900px){
.foot-talk .container{grid-template-columns:1fr;gap:22px}
.foot-main{grid-template-columns:1fr;gap:30px}
.foot-links{grid-template-columns:1fr 1fr}
}
/* ---- request page: three plain suggestions, no carousel, no pop-up ---- */
.bkp-also{margin-top:26px}
.alsoh{font-size:1.05rem;margin-bottom:12px}
.also-list{list-style:none;display:grid;gap:10px}
.also-list a{display:grid;grid-template-columns:74px minmax(0,1fr) auto;gap:14px;align-items:center;border:1px solid var(--border);border-radius:14px;padding:10px;background:#fff;color:var(--ink)}
.also-list a:hover{border-color:var(--ink)}
.also-list img,.also-noimg{width:74px;height:56px;object-fit:cover;border-radius:9px;display:block;background:var(--sand)}
.also-txt{display:flex;flex-direction:column;min-width:0}
.also-txt b{font-size:.92rem;line-height:1.3;font-weight:700}
.also-txt small{font-size:.76rem;color:var(--muted);margin-top:2px}
.also-price{font-weight:800;color:var(--accent-dark);font-size:.86rem;white-space:nowrap}
/* ---- trip builder extras: tidy rows, never a collapsible box ---- */
.ex-group{margin-bottom:16px}
.ex-h{display:flex;align-items:center;gap:8px;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--muted);margin-bottom:8px}
.ex-h i{font-style:normal;background:var(--accent);color:#fff;border-radius:999px;padding:2px 8px;font-size:.6rem;letter-spacing:.06em}
.ex-row{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:11px;align-items:start;width:100%;text-align:left;background:#fff;border:1px solid var(--border);border-radius:12px;padding:11px 13px;margin-bottom:7px;cursor:pointer;font-family:var(--sans);transition:border-color .16s,background .16s}
.ex-row:hover{border-color:var(--ink)}
.ex-row.on{border-color:var(--accent);background:var(--accent-soft)}
.ex-tick{width:20px;height:20px;border:1.5px solid #C9CFD7;border-radius:6px;background:#fff;position:relative;margin-top:1px;flex:none}
.ex-row.on .ex-tick{background:var(--accent);border-color:var(--accent)}
.ex-row.on .ex-tick::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:2px solid #fff;border-top:0;border-left:0;transform:rotate(42deg)}
.ex-txt{display:flex;flex-direction:column;min-width:0}
.ex-txt b{font-size:.87rem;font-weight:700;color:var(--ink);line-height:1.35}
.ex-txt small{font-size:.76rem;color:var(--muted);line-height:1.45;margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ex-price{font-size:.84rem;font-weight:800;color:var(--accent-dark);white-space:nowrap;margin-top:1px}
.ex-more{display:flex;justify-content:space-between;align-items:center;width:100%;background:var(--sand);border:1px dashed #CFD5DD;border-radius:12px;padding:11px 13px;font-family:var(--sans);font-size:.86rem;font-weight:700;color:var(--ink);cursor:pointer}
.ex-more:hover{border-color:var(--accent);color:var(--accent-dark)}
.ex-more span{font-size:.74rem;font-weight:600;color:var(--muted)}
/* ---- "Our firsts": the connector line must never run through the text ----
It sits BEHIND the cards (z-index) and the cards carry a solid fill, so the line is
only ever visible in the gaps between them. The year label moved below the dot. */
.firsts-list::before{top:31px;z-index:0}
.first-card{position:relative;z-index:1;background:#182B40;padding-top:76px}
.first-card:hover{background:#1E3450}
.first-card::before{top:22px;left:20px;width:18px;height:18px}
.fc-year{top:50px;left:20px;font-size:.66rem;letter-spacing:.16em}
@media(max-width:1000px){.firsts-list::before{display:none}}
/* =====================================================================================
v3 (Zaidu review 2026-08-17 evening)
===================================================================================== */
/* ---- the cart is a CENTRED CARD, not a slide-over drawer ----
Two travelers on a phone and one on a laptop should see the same object: a card that
arrives in the middle of the screen, not a panel that slides off the right edge. */
.cd-scrim{background:rgba(11,18,28,.62);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.cart-drawer.open{display:grid;place-items:center;padding:24px}
.cd-panel{position:relative;top:auto;right:auto;bottom:auto;
width:min(560px,100%);max-height:min(84vh,780px);border-radius:20px;overflow:hidden;
box-shadow:0 30px 90px rgba(0,0,0,.45);animation:cd-pop .26s cubic-bezier(.2,.8,.3,1)}
@keyframes cd-pop{from{transform:translateY(14px) scale(.97);opacity:0}to{transform:none;opacity:1}}
.cd-head{background:var(--ink);padding:18px 22px}
.cd-body{padding:20px 22px}
.cd-item{grid-template-columns:104px 1fr;gap:16px;border-radius:16px;padding:14px}
.cd-foot{padding:18px 22px 22px}
.cd-checkout{display:block;text-align:center;width:100%}
@media(max-width:620px){
.cart-drawer.open{padding:0;place-items:end center}
.cd-panel{width:100%;max-height:92vh;border-radius:20px 20px 0 0}
.cd-item{grid-template-columns:82px 1fr;gap:12px}
}
/* ---- "You might also like": the same big cards as the tour list ---- */
.bkp-also{margin-top:30px}
.bkp-also .row-list{gap:14px}
.bkp-also .row-card{grid-template-columns:200px minmax(0,1fr) 170px}
.bkp-also .rc-img{min-height:150px}
.bkp-also .rc-mid{padding:16px 18px;gap:6px}
.bkp-also .rc-mid h3{font-size:1.05rem}
.bkp-also .rc-side{padding:16px}
.bkp-also .rc-price b{font-size:1.55rem}
@media(max-width:1100px){.bkp-also .row-card{grid-template-columns:1fr}
.bkp-also .rc-img{aspect-ratio:16/9}
.bkp-also .rc-side{flex-direction:row;align-items:center;justify-content:space-between;border-left:0;border-top:1px solid var(--border)}
.bkp-also .rc-price{flex-direction:row;align-items:baseline;gap:6px}}
/* ---- the request page: your details on the LEFT, your selection on the RIGHT ---- */
.bkp-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:34px;align-items:start}
.bkp-grid>.bkp-form-col{order:1}
.bkp-grid>.bkp-sel-col{order:2;position:sticky;top:100px}
@media(max-width:980px){
.bkp-grid{grid-template-columns:1fr}
.bkp-grid>.bkp-form-col{order:2}
.bkp-grid>.bkp-sel-col{order:1;position:static}
}
/* ---- footer: the proof box sits with the link columns, no second logo ---- */
.foot-main{grid-template-columns:280px minmax(0,1fr);align-items:start;padding-top:40px;padding-bottom:30px}
.foot-proof img{display:none}
.foot-proof .footer-award{margin-top:0}
/* =====================================================================================
v4 — three patterns Zaidu liked in the Fable-5 draft, rebuilt in THIS site's type
(Outfit + Manrope) and palette (navy + terracotta): scroll-stacking "firsts" cards,
guidebooks drawn as book covers, and reviews fanned like a hand of cards.
Plus the three-column footer with the Instagram strip.
===================================================================================== */
/* ---- "Our firsts": cards that rise and settle as they enter ---- */
.firsts-list::before{display:none}
.firsts-track{padding:10px 4px 30px}
.firsts-list{gap:20px;align-items:stretch}
.first-card{padding:26px 22px 0;border-radius:20px;background:#182B40;border:1px solid rgba(255,255,255,.1);
display:flex;flex-direction:column;overflow:hidden;transform:none;transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s,border-color .4s}
.first-card::before{display:none}
.fc-year{position:static;font-family:var(--serif);font-size:1.5rem;font-weight:800;color:#fff;letter-spacing:-.02em;line-height:1;display:block}
.fc-kicker{display:block;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;font-weight:800;color:var(--terra-2);margin:7px 0 12px}
.first-card h3{font-size:1.05rem;margin-bottom:8px}
.first-card p{flex:1}
.fc-shot{display:block;margin:18px -22px 0;height:132px;overflow:hidden}
.fc-shot img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.first-card:hover{transform:translateY(-10px);border-color:rgba(255,255,255,.3);box-shadow:0 30px 60px -28px rgba(0,0,0,.8)}
.first-card:hover .fc-shot img{transform:scale(1.07)}
/* The stack: each card starts lower and tilted, then settles. It rides motion.js's own
.rise/.in mechanism — a bespoke opacity:0 rule with no matching class left the whole
section blank when nothing ever added .in. Content is never hidden without a way back. */
.motion .first-card.rise{transform:perspective(1100px) rotateX(9deg) translateY(46px)}
.motion .first-card.rise.in{transform:none}
.motion .firsts-list li:nth-child(1).in{transition-delay:0s}
.motion .firsts-list li:nth-child(2).in{transition-delay:.09s}
.motion .firsts-list li:nth-child(3).in{transition-delay:.18s}
.motion .firsts-list li:nth-child(4).in{transition-delay:.27s}
.motion .firsts-list li:nth-child(5).in{transition-delay:.36s}
@media(max-width:1000px){.motion .first-card{transform:translateY(30px)}}
/* ---- the guidebooks, as books ---- */
.book-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;perspective:1200px}
.book{position:relative;border-radius:6px 16px 16px 6px;overflow:hidden;min-height:250px;display:flex;
box-shadow:0 26px 50px -26px rgba(17,33,49,.6);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s;
transform-style:preserve-3d;transform:rotateY(-6deg)}
.book:hover{transform:rotateY(0) translateY(-6px);box-shadow:0 34px 66px -28px rgba(17,33,49,.7)}
.book-spine{position:absolute;left:0;top:0;bottom:0;width:16px;background:rgba(0,0,0,.22);
box-shadow:inset -6px 0 12px -6px rgba(0,0,0,.45)}
.book-face{position:relative;padding:30px 28px 28px 40px;display:flex;flex-direction:column;justify-content:center;gap:8px;width:100%}
.book-face::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.22),rgba(255,255,255,0) 46%);pointer-events:none}
.book b{font-family:var(--serif);font-size:1.5rem;font-weight:800;line-height:1.1;letter-spacing:-.02em}
.book small{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;opacity:.9}
.book i{font-style:normal;font-size:.88rem;line-height:1.5;opacity:.92}
.book.lp{background:linear-gradient(150deg,#1668D8,#0B4FAE);color:#fff}
.book.pf{background:linear-gradient(150deg,#14705E,#0C4C40);color:#fff}
.book.score{background:var(--ink);color:#fff;transform:rotateY(6deg)}
.book.score:hover{transform:rotateY(0) translateY(-6px)}
.book b.bk-num{font-size:3.6rem;line-height:.9;color:#fff;letter-spacing:-.04em}
.book.score small{color:#00C08B}
@media(max-width:900px){.book-row{grid-template-columns:1fr}.book,.book.score{transform:none}}
/* ---- reviews, fanned like a hand of cards ---- */
.rv-deck{position:relative;display:flex;justify-content:center;align-items:stretch;gap:0;padding:26px 0 10px;perspective:1400px;overflow:hidden}
.rv-card{position:relative;width:min(300px,80vw);flex:none;background:#fff;border:1px solid var(--border);border-radius:18px;
padding:22px 20px 18px;margin:0 -50px;color:var(--body);box-shadow:0 22px 48px -26px rgba(17,33,49,.5);
transform:rotate(calc(var(--i) * 4.5deg)) translateY(calc(abs(var(--i)) * 14px)) scale(.93);
transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,z-index 0s;z-index:1}
.rv-card.is-front{transform:none;z-index:5;box-shadow:0 30px 60px -26px rgba(17,33,49,.6)}
.rv-deck:hover .rv-card{transform:rotate(calc(var(--i) * 3deg)) translateX(calc(var(--i) * 34px)) translateY(calc(abs(var(--i)) * 8px)) scale(.97)}
.rv-deck:hover .rv-card.is-front{transform:translateY(-8px)}
.rv-card:hover{z-index:9!important;box-shadow:0 34px 70px -24px rgba(17,33,49,.65)}
.rv-bubbles{color:#00AA6C;letter-spacing:3px;font-size:.8rem;display:block;margin-bottom:12px}
.rv-card blockquote{font-family:var(--serif);font-size:1.02rem;line-height:1.45;color:var(--ink);font-weight:600}
.rv-who{display:block;font-size:.76rem;color:var(--muted);margin-top:14px;font-weight:700}
.rv-read{display:block;font-size:.78rem;color:var(--accent-dark);font-weight:700;margin-top:10px}
.rv-foot{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap;margin-top:34px}
.rv-foot .rv-score{display:flex;align-items:baseline;gap:9px}
.rv-foot .rv-score b{font-family:var(--serif);font-size:2.6rem;font-weight:800;color:var(--ink);line-height:1;letter-spacing:-.03em}
.rv-foot .rv-score small{font-size:.82rem;color:var(--muted);font-weight:700}
@media(max-width:900px){
.rv-deck{flex-direction:column;align-items:center;gap:14px;perspective:none}
.rv-card,.rv-deck:hover .rv-card,.rv-card.is-front{margin:0;transform:none;width:min(420px,100%)}
}
/* ---- footer: three columns + the Instagram strip ---- */
.foot-main{grid-template-columns:1fr 1fr 1.5fr;gap:40px;padding-top:44px;padding-bottom:36px}
.foot-col h4{color:#fff;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:16px;font-family:var(--sans)}
.foot-col a{display:block;color:#A9B6C6;font-size:.9rem;padding:6px 0}
.foot-col a:hover{color:#FFB59B}
.foot-ig .fig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:330px}
.foot-ig .fig-tile{padding:0;display:block;aspect-ratio:1;border-radius:10px;overflow:hidden}
.foot-ig .fig-tile img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.foot-ig .fig-tile:hover img{transform:scale(1.08)}
.fig-link{display:inline-block;margin-top:14px;color:#FFB59B;font-weight:700;font-size:.86rem}
.fig-none{color:#7E8DA0;font-size:.86rem;line-height:1.6;max-width:34ch}
.foot-legal .fl-proof b{color:#fff;font-family:var(--serif);font-weight:800}
@media(max-width:900px){.foot-main{grid-template-columns:1fr 1fr}.foot-ig{grid-column:1/-1}}
/* ---- "Our firsts": drawings, not photographs ----
One 140x86 drawing per card, all the same stroke weight and all sitting in an identical
panel, so the five read as a set rather than five different pictures. */
.fc-art{display:grid;place-items:center;margin:20px -22px 0;height:126px;
background:rgba(255,255,255,.045);border-top:1px solid rgba(255,255,255,.09);color:var(--terra-2)}
.fc-art svg{width:150px;height:92px;overflow:visible}
.first-card:hover .fc-art{background:rgba(206,68,32,.12);color:#FF7A4D}
.fc-art,.first-card:hover .fc-art{transition:background .35s ease,color .35s ease}
/* ---- About and Contact: a two-photograph band, same language as the product cover ---- */
.page-cover{position:relative;color:#fff;background-color:var(--ink);background-image:var(--cover,none);
background-size:cover;background-position:center 42%;isolation:isolate;padding:26px 0 52px;min-height:340px;
display:flex;align-items:flex-end}
.page-cover::before{content:"";position:absolute;inset:0;z-index:-1;
background:linear-gradient(180deg,rgba(17,33,49,.72) 0%,rgba(17,33,49,.34) 26%,rgba(17,33,49,.30) 46%,rgba(17,33,49,.72) 74%,rgba(17,33,49,.94) 100%)}
.page-cover .container{position:relative;width:100%}
.page-cover .crumbs{padding:0 0 16px;color:rgba(255,255,255,.85);text-shadow:0 1px 8px rgba(0,0,0,.5)}
.page-cover .crumbs a{color:rgba(255,255,255,.78)}
.page-cover .crumbs a:hover,.page-cover .crumbs span[aria-current]{color:#fff}
.page-cover .eyebrow{color:#FFC2AC;text-shadow:0 1px 10px rgba(0,0,0,.55);margin-bottom:14px}
.page-cover h1{color:#fff;max-width:20ch;text-shadow:0 2px 20px rgba(0,0,0,.35)}
.page-cover .cover-sub{max-width:62ch;color:rgba(255,255,255,.92);font-size:1.02rem;margin-top:14px;line-height:1.6;text-shadow:0 1px 12px rgba(0,0,0,.45)}
@media(max-width:700px){.page-cover{min-height:270px;padding-bottom:36px}}
/* ---- footer Instagram: ONE row of three, so the column ends level with the links ---- */
.foot-ig .fig-grid{grid-template-columns:repeat(3,1fr);max-width:300px;gap:9px}
.foot-ig .fig-tile{aspect-ratio:1}
.fig-none{margin-top:12px}
/* the proof chips sit right under the About cover, not in a section of their own */
.block.pt0{padding-top:26px;padding-bottom:0}
.awards-inline{margin-bottom:0}
/* a left scrim so the small type reads over a bright sky without dimming the photographs */
.page-cover::after{content:"";position:absolute;inset:0;z-index:-1;
background:linear-gradient(90deg,rgba(17,33,49,.66) 0%,rgba(17,33,49,.30) 42%,rgba(17,33,49,0) 72%)}
.product-cover::after{content:"";position:absolute;inset:0;z-index:-1;
background:linear-gradient(90deg,rgba(17,33,49,.60) 0%,rgba(17,33,49,.24) 46%,rgba(17,33,49,0) 76%)}
/* =====================================================================================
v5 — the last four things that still echoed the sibling site: the cart mark, the header
links, the booking panel and the confirmation page.
===================================================================================== */
/* ---- the trip button: a suitcase with a word, not an anonymous trolley ---- */
.cart-btn{display:inline-flex;align-items:center;gap:8px;width:auto;height:auto;padding:9px 15px;
border:1px solid var(--border);border-radius:12px;background:#fff;position:relative}
.cart-btn:hover{border-color:var(--ink)}
.cart-btn svg{width:19px;height:19px;color:var(--ink)}
.cart-btn b{font-size:.86rem;font-weight:700;color:var(--ink);letter-spacing:.01em}
.cart-btn .cart-count{position:static;display:inline-grid;place-items:center;min-width:20px;height:20px;
padding:0 6px;border-radius:999px;background:var(--accent);color:#fff;font-size:.7rem;font-weight:800}
@media(max-width:640px){.cart-btn b{display:none}.cart-btn{padding:9px 11px}}
/* ---- header links: uppercase and letterspaced, with a rule that draws in ---- */
nav.main-nav .nav-top,nav.main-nav a.nav-link{
font-size:.76rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);
position:relative;padding:6px 0}
nav.main-nav a.nav-link::after,nav.main-nav .nav-top::after{content:"";position:absolute;left:0;right:100%;
bottom:0;height:2px;background:var(--accent);transition:right .28s cubic-bezier(.2,.8,.2,1)}
nav.main-nav a.nav-link:hover::after,nav.main-nav .nav-item:hover .nav-top::after,
nav.main-nav a.nav-link[aria-current]::after{right:0}
.nav-menu-in a{letter-spacing:0;text-transform:none;font-size:.9rem}
/* ---- the booking panel ---- */
/* No overflow:hidden here — it clipped the date picker's popup, which is absolutely
positioned inside this card. The rail rounds its own top corners instead. */
.book-widget{border:1px solid var(--border);border-radius:18px;background:#fff}
.book-widget > :first-child{border-radius:17px 17px 0 0}
.book-widget > :last-child{border-bottom-left-radius:17px;border-bottom-right-radius:17px}
.bw-rail{display:flex;align-items:baseline;gap:8px;padding:16px 20px;background:var(--sand);
border-bottom:1px solid var(--border)}
.bw-from{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--muted)}
.bw-amt{font-family:var(--serif);font-size:2.1rem;font-weight:800;color:var(--ink);letter-spacing:-.03em;line-height:1}
.bw-per{font-size:.82rem;color:var(--muted);font-weight:600}
.bw-body{padding:18px 20px 22px}
.bw-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bw-field label{display:block;font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;font-weight:800;
color:var(--muted);margin:0 0 6px}
.bw-who{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;
border:1px solid var(--border);border-radius:11px;background:#fff;padding:11px 12px;cursor:pointer;
font-family:var(--sans);font-size:.9rem;font-weight:600;color:var(--ink);text-align:left}
.bw-who:hover{border-color:var(--ink)}
.bw-who-caret{width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);
transform:rotate(45deg);margin-top:-4px;flex:none}
.bw-who[aria-expanded="true"]{border-color:var(--accent)}
.bw-group{margin-top:10px;border:1px solid var(--border);border-radius:12px;padding:4px 12px;background:var(--sand)}
.bw-group[hidden]{display:none}
.bw-group .stepper{border-bottom:1px solid var(--border)}
.bw-group .stepper:last-child{border-bottom:0}
.bw-actions{margin-top:14px}
.bw-note{font-size:.78rem;color:var(--muted);margin-top:10px;line-height:1.5}
.bw-trust{list-style:none;margin-top:16px;padding-top:14px;border-top:1px solid var(--border);display:grid;gap:7px}
.bw-trust li{display:flex;gap:8px;font-size:.79rem;color:var(--body)}
.bw-trust li::before{content:"";width:15px;height:15px;flex:none;margin-top:1px;border-radius:50%;
background:var(--accent-tint);
-webkit-mask:url("data:image/svg+xml;utf8,") center/contain no-repeat;
box-shadow:inset 0 0 0 2px var(--accent)}
/* ---- the confirmation page: numbered steps, and the selection as a receipt ---- */
.bkf-steps{list-style:none;margin:0;padding:0}
.bkf-step{display:grid;grid-template-columns:38px minmax(0,1fr);gap:16px;padding-bottom:22px}
.bkf-n{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--ink);
color:#fff;font-family:var(--serif);font-weight:800;font-size:.95rem}
.bkf-body h2{font-size:1.12rem;margin-bottom:3px}
.bkf-hint{font-size:.85rem;color:var(--muted);margin-bottom:12px}
.bkf-two{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
@media(max-width:620px){.bkf-two{grid-template-columns:1fr}}
.receipt{background:#fff;border:1px solid var(--border);border-radius:16px;padding:0;overflow:hidden}
.rc-head{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:var(--ink);color:#fff}
.rc-head span{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;font-weight:800;color:#FFB59B}
.rc-head b{font-size:.85rem;font-weight:700}
.receipt #bk-rows,.receipt #bk-extras{padding:0 20px}
.receipt #bk-rows>*:first-child{padding-top:16px}
/* the torn edge: a row of half-circles punched out of the card, so the panel reads as a
ticket rather than another white box */
.rc-tear{height:16px;margin:6px 0;background-image:radial-gradient(circle at 8px 8px,var(--sand) 7px,transparent 7px);
background-size:20px 16px;background-repeat:repeat-x;border-top:1px dashed var(--border)}
.receipt .bkp-total{margin:0;padding:0 20px 4px;border:0}
.rc-notes{list-style:none;padding:12px 20px 0;margin:0;display:grid;gap:6px}
.rc-notes li{font-size:.78rem;color:var(--muted);display:flex;gap:7px}
.rc-notes li::before{content:"✓";color:var(--green);font-weight:800}
.rc-back{padding:12px 20px 18px;margin:0;font-size:.84rem}
/* the waiting state was the sibling's muted green; here it is muted terracotta on sand,
so even the disabled button belongs to this palette */
.btn.is-waiting,.btn.is-waiting:hover{background:var(--accent-tint);color:var(--accent-dark);
border-color:transparent;cursor:not-allowed;box-shadow:none}
/* two columns when there is no Instagram account yet, three once there is */
.foot-main:has(.foot-ig){grid-template-columns:1fr 1fr 1.5fr}
.foot-main{grid-template-columns:1fr 1fr}
@media(max-width:900px){.foot-main,.foot-main:has(.foot-ig){grid-template-columns:1fr 1fr}}
/* --- guide languages band ---------------------------------------------------
Nine languages, every one included. The pitch on the left, the languages as a
chip list on the right, so the count reads at a glance without anyone counting.
Deliberately NOT a price table — a price table would imply a charge, and there
is never a charge on this. Uses the shared tokens, so it picks up Amin's navy
and terracotta automatically. */
.langs{
display:grid;grid-template-columns:minmax(0,1fr);gap:24px 48px;align-items:start;
}
.langs__head h2{margin-top:6px}
.langs__head .lead{max-width:46ch;margin-top:10px}
.langs__list{
list-style:none;margin:0;padding:0;
display:flex;flex-wrap:wrap;gap:10px;
}
.langs__list li{
font-size:.9rem;font-weight:700;color:var(--navy);
background:var(--white);border:1px solid var(--accent-tint);
border-radius:999px;padding:8px 16px;line-height:1.2;
box-shadow:0 1px 2px rgba(17,33,49,.05);
}
.langs-block:not(.tint) .langs__list li{background:var(--accent-soft)}
@media(min-width:900px){
.langs{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}
}
@media(max-width:640px){
.langs__list{gap:8px}
.langs__list li{font-size:.82rem;padding:7px 13px}
}
/* ============ language switcher =====================================================
Amin's header idiom, not the sibling's: uppercase and letterspaced like the nav
links, with the same terracotta rule drawing in from the left, and a navy panel
rather than a white bordered card. Opens on hover AND focus-within, so it works
from the keyboard without any JavaScript.
==================================================================================== */
.langsw{position:relative;flex:none}
.langsw__btn{background:none;border:0;padding:6px 16px 6px 0;cursor:pointer;color:var(--ink);
font:inherit;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
position:relative;line-height:1.2}
.langsw__btn::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;
background:var(--accent);transition:right .28s cubic-bezier(.2,.8,.2,1)}
.langsw:hover .langsw__btn::after,.langsw:focus-within .langsw__btn::after{right:16px}
/* the chevron */
.langsw__btn::before{content:"";position:absolute;right:2px;top:50%;width:6px;height:6px;
margin-top:-4px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
transform:rotate(45deg);opacity:.55}
.langsw__menu{position:absolute;top:calc(100% + 10px);right:0;z-index:60;margin:0;padding:8px;
list-style:none;min-width:184px;background:var(--navy);border-radius:14px;
box-shadow:0 18px 44px rgba(17,33,49,.28);opacity:0;visibility:hidden;transform:translateY(-6px);
transition:opacity .18s ease,transform .18s ease,visibility .18s}
.langsw:hover .langsw__menu,.langsw:focus-within .langsw__menu{opacity:1;visibility:visible;transform:none}
.langsw__menu a{display:block;padding:9px 12px;border-radius:9px;color:#EAF0F6;text-decoration:none;
font-size:.88rem;letter-spacing:0;text-transform:none;transition:background .15s,color .15s}
.langsw__menu a:hover{background:rgba(255,255,255,.09);color:#fff}
.langsw__menu a[aria-current]{color:var(--terra-2);font-weight:700}
@media(max-width:900px){
.langsw{order:-1}
.langsw__btn{padding-right:14px;font-size:.68rem}
.langsw__menu{right:auto;left:0}
}