:root{
  --bg:#fbfbfd;
  --bg-alt:#f5f5f7;
  --ink:#1d1d1f;
  --ink-soft:#494949;
  --muted:#86868b;
  --line:rgba(0,0,0,0.08);
  --accent:#0071e3;
  --accent-hover:#0077ed;
  --glass:rgba(255,255,255,0.72);
  --glass-dark:rgba(29,29,31,0.72);
  --r-sm:14px;
  --r-md:22px;
  --r-lg:30px;
  --r-pill:980px;
  --maxw:1100px;
  --shadow-soft:0 4px 24px rgba(0,0,0,0.06);
  --shadow-lift:0 12px 40px rgba(0,0,0,0.10);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; background:var(--bg); color-scheme:light only;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:-apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Inter', 'Helvetica Neue', sans-serif;
  font-size:17px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3{
  font-family:-apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', 'Helvetica Neue', sans-serif;
  font-weight:600;
  line-height:1.1;
  margin:0;
  letter-spacing:-0.015em;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.eyebrow{
  font-size:14px;
  font-weight:600;
  letter-spacing:0.01em;
  color:var(--accent);
}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px; border-radius:6px;}

/* ---------- NAV (liquid glass) ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:var(--glass);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--line);
}
.navbar{
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center;
  padding:14px 24px; max-width:var(--maxw); margin:0 auto; gap:12px;
}
.nav-side{display:flex; align-items:center; gap:24px;}
.nav-left{justify-self:start;}
.nav-right{justify-self:end;}
.nav-spacer{display:inline-block; width:42px; height:1px;}
@media(min-width:900px){ .nav-spacer{display:none;} }
.brand{
  font-weight:600; font-size:19px; letter-spacing:-0.01em;
  display:flex; align-items:baseline; gap:6px;
}
.brand span{
  font-size:12px; color:var(--accent); font-weight:600;
}
nav.links{display:none; gap:28px; align-items:center;}
nav.links a{font-size:14px; font-weight:500; color:var(--ink-soft); transition:color .15s;}
nav.links a:hover{color:var(--ink);}
.nav-cta{
  display:none;
  font-weight:600; font-size:14px;
  background:var(--accent); color:#fff;
  padding:9px 20px; border-radius:var(--r-pill);
  transition:background .15s;
}
.nav-cta:hover{background:var(--accent-hover);}
.menu-btn{
  background:rgba(0,0,0,0.04); border:none; border-radius:var(--r-pill);
  width:42px; height:42px; display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.menu-btn span, .menu-btn::before, .menu-btn::after{
  content:''; display:block; width:17px; height:1.5px; background:var(--ink);
  position:relative; border-radius:2px;
  transition:transform .32s cubic-bezier(.32,.72,.28,1), opacity .2s ease;
}
.menu-btn::before{position:absolute; transform:translateY(-5px);}
.menu-btn::after{position:absolute; transform:translateY(5px);}
.menu-btn.open span{opacity:0; transform:scaleX(0.4);}
.menu-btn.open::before{transform:translateY(0) rotate(45deg);}
.menu-btn.open::after{transform:translateY(0) rotate(-45deg);}

.mobile-panel{
  display:flex; flex-direction:column;
  background:var(--glass);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-top:1px solid transparent;
  padding:0 16px;
  max-height:0; overflow:hidden;
  opacity:0; transform:translateY(-8px);
  transition:max-height .38s cubic-bezier(.32,.72,.28,1),
             opacity .28s ease,
             transform .38s cubic-bezier(.32,.72,.28,1),
             padding .38s cubic-bezier(.32,.72,.28,1),
             border-color .3s ease;
}
.mobile-panel.open{
  max-height:420px;
  opacity:1; transform:none;
  padding:10px 16px 18px;
  border-top-color:var(--line);
}
.mobile-panel a{
  padding:14px 18px; font-size:16px; font-weight:500; text-align:center;
  border-radius:var(--r-sm); margin-top:4px;
  transition:background .15s;
}
.mobile-panel a:active{background:rgba(0,0,0,0.05);}
.mobile-panel a.cta-row{
  background:var(--accent); color:#fff; font-weight:600; margin-top:10px;
  border-radius:var(--r-pill);
}

@media(min-width:900px){
  nav.links{display:flex;}
  .nav-cta{display:inline-block;}
  .menu-btn{display:none;}
}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  overflow:hidden;
  background:var(--bg-alt);
  color:#fff;
}
.hero-inner{
  position:relative; z-index:1;
  padding:96px 24px 110px;
  max-width:var(--maxw); margin:0 auto;
  text-align:center;
}
.hero .eyebrow{color:#cfe3ff; margin-bottom:20px; display:block; text-shadow:0 1px 10px rgba(0,0,0,0.45);}
.hero h1{
  font-size:clamp(38px, 7vw, 68px);
  font-weight:700;
  letter-spacing:-0.02em;
  max-width:16ch;
  margin-left:auto; margin-right:auto;
  color:#fff;
  text-shadow:0 2px 18px rgba(0,0,0,0.45);
}
.hero p.lede{
  margin:26px auto 0; max-width:52ch;
  font-size:19px; color:var(--ink-soft); line-height:1.6;
  font-weight:400;
}
.hero-ctas{
  margin-top:40px; display:flex; flex-wrap:wrap; gap:14px; justify-content:center;
}
.btn-primary{
  background:var(--accent); color:#fff; font-weight:600; font-size:16px;
  padding:14px 30px; border-radius:var(--r-pill);
  display:inline-flex; align-items:center; gap:8px;
  transition:background .15s, transform .2s;
}
.btn-primary:hover{background:var(--accent-hover); transform:scale(1.02);}
.btn-ghost{
  background:rgba(0,0,0,0.05); color:var(--ink);
  font-weight:600; font-size:16px; padding:14px 28px; border-radius:var(--r-pill);
  transition:background .15s;
}
.btn-ghost:hover{background:rgba(0,0,0,0.09);}

.hero-coords{
  margin:70px auto 0;
  display:flex; flex-wrap:wrap; gap:14px; justify-content:center;
  font-size:13px; color:#a1a1a6;
}
.hero-coords span{
  background:rgba(255,255,255,0.08);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  padding:9px 18px; border-radius:var(--r-pill);
  border:1px solid rgba(255,255,255,0.08);
}
.hero-coords strong{color:#f5f5f7; font-weight:600;}

/* ---------- SECTION SHELL ---------- */
section{padding:96px 0;}
.section-head{
  max-width:60ch; margin:0 auto 56px; text-align:center;
}
.section-head .eyebrow{margin-bottom:12px; display:block;}
.section-head h2{
  font-size:clamp(30px,4.5vw,44px); font-weight:700; letter-spacing:-0.02em;
}
.section-head p{margin:16px auto 0; color:var(--ink-soft); font-size:17px; max-width:54ch;}

/* ---------- JOURNEY (zig-zag route) ---------- */
.journey{background:var(--bg-alt);}
.route{
  position:relative;
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:22px;
}
/* the path the steps hang off: faint track + a line that draws itself in */
.route::before,
.route::after{
  content:'';
  position:absolute; left:21px; top:10px; width:2px;
  border-radius:2px;
}
.route::before{
  bottom:10px;
  background:rgba(0,113,227,0.13);
}
.route::after{
  height:calc(var(--route-progress, 0) * (100% - 20px));
  background:linear-gradient(to bottom, var(--accent), #5fb0ff);
}
.checkpoint{
  position:relative;
  padding-left:56px;
  max-width:none; margin:0;
}
.checkpoint-dot{
  position:absolute; left:14px; top:36px;
  width:16px; height:16px; border-radius:50%;
  background:#fff; border:2px solid rgba(0,113,227,0.28);
  box-shadow:0 0 0 5px var(--bg-alt);
  transition:background .45s ease, border-color .45s ease, transform .45s ease, box-shadow .45s ease;
}
.checkpoint.in-view .checkpoint-dot{
  background:var(--accent); border-color:var(--accent);
  transform:scale(1.12);
  box-shadow:0 0 0 5px var(--bg-alt), 0 0 0 10px rgba(0,113,227,0.12);
}
.checkpoint-card{
  position:relative;
  background:#fff; border-radius:var(--r-lg);
  box-shadow:var(--shadow-soft);
  padding:28px 28px 26px;
  text-align:left;
  transition:transform .25s, box-shadow .25s;
}
.checkpoint-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-lift);}
.checkpoint-head{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  margin-bottom:16px;
}
.checkpoint-icon{
  width:54px; height:54px; border-radius:18px; flex-shrink:0;
  background:rgba(0,113,227,0.08); color:var(--accent);
  display:flex; align-items:center; justify-content:center;
}
.checkpoint-icon svg{width:27px; height:27px; display:block;}
.checkpoint-num{
  font-size:46px; font-weight:700; line-height:1; letter-spacing:-0.04em;
  color:rgba(0,113,227,0.16);
}
.checkpoint-coord{
  font-size:12.5px; font-weight:600; color:var(--accent);
  letter-spacing:0.05em; text-transform:uppercase;
  display:block; margin-bottom:10px;
}
.checkpoint h3{margin:0 0 4px;}
.checkpoint p{color:var(--ink-soft); font-size:16px; margin:0;}
.checkpoint .mini{margin:16px 0 0; max-width:none;}
.checkpoint .mini li{text-align:left; font-size:15px;}
.checkpoint-title-btn{
  display:inline-flex; align-items:center; gap:10px;
  font-weight:600; letter-spacing:-0.015em;
  font-size:20px; line-height:1.2; color:var(--ink);
  background:rgba(0,113,227,0.07);
  border:1px solid rgba(0,113,227,0.14);
  border-radius:var(--r-pill);
  padding:12px 22px;
  transition:background .2s, color .2s, transform .2s, box-shadow .2s, border-color .2s;
}
.checkpoint-title-btn::after{
  content:'\2192'; font-size:17px; line-height:1;
  transition:transform .25s;
}
.checkpoint-title-btn:hover{
  background:var(--accent); color:#fff; border-color:transparent;
  box-shadow:var(--shadow-lift);
}
.checkpoint-title-btn:hover::after{transform:translateX(4px);}
@media(min-width:860px){
  .checkpoint-title-btn{font-size:22px; padding:13px 26px;}
}
.step-link{
  display:inline-flex; align-items:center; gap:6px; margin-top:14px;
  font-size:15px; font-weight:500; color:var(--accent);
}
.step-link:hover{text-decoration:underline;}

/* zig-zag on desktop: cards alternate either side of the path */
@media(min-width:900px){
  .route{gap:0;}
  .route::before,
  .route::after{left:50%; transform:translateX(-1px);}
  .checkpoint{
    width:calc(50% - 46px);
    padding-left:0;
  }
  .checkpoint:nth-child(odd){align-self:flex-start;}
  .checkpoint:nth-child(even){align-self:flex-end;}
  .checkpoint + .checkpoint{margin-top:-44px;}
  .checkpoint:nth-child(odd) .checkpoint-dot{left:auto; right:-54px;}
  .checkpoint:nth-child(even) .checkpoint-dot{left:-54px;}
  /* short connector from card to the path */
  .checkpoint-card::after{
    content:''; position:absolute; top:43px; width:38px; height:1px;
    background:rgba(0,113,227,0.2);
  }
  .checkpoint:nth-child(odd) .checkpoint-card::after{right:-42px;}
  .checkpoint:nth-child(even) .checkpoint-card::after{left:-42px;}
  .checkpoint-card{padding:32px 32px 30px;}
}

/* ---------- SERVICES TEASER ---------- */
.services-grid{
  display:grid; grid-template-columns:1fr; gap:20px;
}
@media(min-width:760px){ .services-grid{grid-template-columns:repeat(3,1fr);} }
.service-card{
  background:#fff; padding:36px 30px;
  border-radius:var(--r-lg);
  box-shadow:var(--shadow-soft);
  display:flex; flex-direction:column; align-items:center; gap:12px;
  text-align:center;
  transition:transform .25s, box-shadow .25s;
}
.service-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-lift);}
.service-card .eyebrow{color:var(--muted);}
.service-card h3{font-size:20px;}
.service-card p{font-size:15px; color:var(--ink-soft); flex:1; margin:0;}
.service-card .tag{
  font-size:12.5px; color:var(--muted); font-weight:500;
  background:var(--bg-alt); display:inline-block; padding:6px 14px; border-radius:var(--r-pill); width:fit-content;
}

/* ---------- WHY ---------- */
.why-list{display:grid; grid-template-columns:1fr; gap:20px; justify-items:stretch;}
@media(min-width:760px){ .why-list{grid-template-columns:repeat(2,1fr);} }
.why-item{
  background:#fff; border-radius:var(--r-lg); padding:32px 30px;
  box-shadow:var(--shadow-soft); text-align:center;
}
.why-item h3{font-size:18px; margin-bottom:10px; font-weight:600;}
.why-item p{font-size:15px; color:var(--ink-soft); margin:0;}

/* ---------- FAQ ---------- */
.faq{background:var(--bg-alt);}
.faq-item{
  background:#fff; border-radius:var(--r-md); margin-bottom:12px;
  box-shadow:var(--shadow-soft);
  overflow:hidden;
}
.faq-item summary{
  padding:20px 24px; cursor:pointer; font-weight:600; font-size:16px;
  display:flex; justify-content:space-between; align-items:center; list-style:none;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:'+'; font-size:22px; color:var(--muted); flex-shrink:0; margin-left:16px;
  font-weight:300; transition:transform .2s;
}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item p{margin:0; padding:0 24px 22px; color:var(--ink-soft); font-size:15px; max-width:62ch; text-align:left;}

/* ---------- FINAL CTA ---------- */
.final-cta{
  background:var(--bg-alt); color:var(--ink);
}
.final-cta .wrap{
  display:flex; flex-direction:column; gap:28px; align-items:center; text-align:center;
}
.final-cta h2{color:var(--ink); font-size:clamp(28px,4.5vw,42px); font-weight:700; letter-spacing:-0.02em; max-width:20ch; margin:0 auto;}
.final-cta p{color:var(--ink-soft); max-width:48ch; margin:0 auto;}

/* ---------- FOOTER ---------- */
footer{
  border-top:1px solid var(--line);
  background:var(--bg-alt);
  padding:64px 0 30px;
}
.footer-inner{display:flex; flex-direction:column; gap:40px;}
.footer-top{
  display:grid; grid-template-columns:1fr; gap:34px;
  text-align:center; justify-items:center;
}
@media(min-width:720px){
  .footer-top{
    grid-template-columns:1.5fr 1fr 1fr;
    text-align:left; justify-items:start; gap:36px 28px;
  }
  .footer-cta{grid-column:1 / -1;}
}
@media(min-width:1000px){
  .footer-top{grid-template-columns:1.35fr .85fr 1fr 1.6fr;}
  .footer-cta{grid-column:auto;}
}
.footer-brand{display:flex; flex-direction:column; align-items:center; gap:16px;}
@media(min-width:720px){ .footer-brand{align-items:flex-start;} }
.footer-logo{height:52px; width:auto; display:block;}
.footer-brand p{
  margin:0; font-size:14px; line-height:1.65; color:var(--ink-soft); max-width:36ch;
}
.footer-social{display:flex; gap:10px;}
.footer-social a{
  width:40px; height:40px; border-radius:14px;
  background:#fff; color:var(--ink-soft);
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-soft);
  transition:background .18s, color .18s, transform .18s;
}
.footer-social a svg{width:19px; height:19px; display:block;}
.footer-social a:hover{background:var(--accent); color:#fff; transform:translateY(-2px);}
.footer-col h3{
  font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.06em;
  color:var(--muted); margin:0 0 14px;
}
.footer-col ul{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:11px;
}
.footer-col li{font-size:14.5px; color:var(--ink-soft); line-height:1.4;}
.footer-col a{transition:color .15s;}
.footer-col a:hover{color:var(--accent);}
.footer-cta{
  display:flex; flex-direction:column; align-items:center; gap:12px;
  background:#fff; border-radius:var(--r-lg);
  box-shadow:var(--shadow-soft);
  padding:26px 26px 24px;
  width:100%;
}
@media(min-width:720px){ .footer-cta{align-items:flex-start;} }
.footer-cta h3{font-size:17px; margin:0;}
.footer-cta p{margin:0; font-size:14px; color:var(--ink-soft); line-height:1.6; max-width:32ch;}
.footer-wa{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  background:#25d366; color:#fff; font-weight:600; font-size:15px;
  padding:13px 22px; border-radius:var(--r-pill);
  white-space:nowrap;
  box-shadow:0 6px 20px rgba(37,211,102,0.3);
  transition:background .15s, transform .2s, box-shadow .2s;
  margin-top:4px;
}
.footer-wa svg{width:20px; height:20px; display:block; flex-shrink:0;}
.footer-wa:hover{background:#1fba59; transform:translateY(-2px); box-shadow:0 10px 26px rgba(37,211,102,0.36);}
.footer-wa-note{font-size:12.5px; color:var(--muted);}
.footer-bottom{
  border-top:1px solid var(--line);
  padding-top:22px;
  display:flex; flex-wrap:wrap; gap:8px 18px;
  align-items:center; justify-content:center; text-align:center;
  font-size:12.5px; color:var(--muted);
}
@media(min-width:720px){ .footer-bottom{justify-content:space-between; text-align:left;} }
.footer-bottom p{margin:0;}
.footer-bottom a{transition:color .15s;}
.footer-bottom a:hover{color:var(--accent);}


.placeholder-flag{
  display:inline-block; font-size:11px; font-weight:600;
  color:var(--accent); background:rgba(0,113,227,0.08); padding:3px 10px; border-radius:var(--r-pill); margin-left:8px; vertical-align:middle;
}

/* ---------- SUB-PAGE HERO ---------- */
.page-hero{
  background:var(--bg-alt);
  color:#fff;
  padding:72px 0 80px;
}
.page-hero .wrap{text-align:center;}
.page-hero .eyebrow{color:#cfe3ff; font-size:17px; margin-bottom:16px; display:block; text-shadow:0 1px 10px rgba(0,0,0,0.45);}
.page-hero h1{
  font-size:clamp(32px,5.5vw,52px); font-weight:700; letter-spacing:-0.02em;
  color:#fff; max-width:20ch; margin-left:auto; margin-right:auto;
  text-shadow:0 2px 16px rgba(0,0,0,0.45);
}
.page-hero p{margin:18px auto 0; max-width:54ch; color:#f0f0f2; font-size:17px; text-shadow:0 1px 10px rgba(0,0,0,0.45);}
.crumb{
  font-size:12.5px; color:#f0f0f2;
  display:flex; gap:8px; align-items:center; justify-content:center;
  width:fit-content; margin:0 auto;
  background:rgba(20,22,26,0.35);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  padding:7px 16px; border-radius:var(--r-pill);
}
.crumb a{color:#f0f0f2;}
.crumb a:hover{color:#fff;}

/* ---------- INFO / VILLAGE CARDS ---------- */
.info-grid{display:grid; grid-template-columns:1fr; gap:20px;}
@media(min-width:700px){ .info-grid{grid-template-columns:repeat(2,1fr);} }
.info-card{
  background:#fff; padding:34px 30px; border-radius:var(--r-lg);
  box-shadow:var(--shadow-soft); text-align:center;
  transition:transform .25s, box-shadow .25s;
}
.info-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-lift);}
.info-card .eyebrow{color:var(--muted); margin-bottom:10px; display:block;}
.info-card h3{font-size:20px; margin-bottom:10px;}
.info-card p{font-size:15px; color:var(--ink-soft); margin:0;}

.tip-columns{display:grid; grid-template-columns:1fr; gap:20px;}
@media(min-width:760px){ .tip-columns{grid-template-columns:repeat(2,1fr);} }
.tip-columns > div{
  background:#fff; border-radius:var(--r-lg); padding:30px;
  box-shadow:var(--shadow-soft);
}
.tip-columns h3{
  font-size:16px; font-weight:600; margin:0 0 16px;
  display:flex; align-items:center; gap:10px; justify-content:center;
}
.tip-columns h3 .dot{width:8px; height:8px; border-radius:50%; background:var(--accent);}
.tip-columns ul{margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:14px;}
.tip-columns li{font-size:14.5px; color:var(--ink-soft); padding-left:20px; position:relative; text-align:left;}
.tip-columns li::before{content:''; position:absolute; left:0; top:8px; width:6px; height:6px; border-radius:50%; background:rgba(0,113,227,0.35);}

/* ---------- TRANSPORT OPTIONS ---------- */
.transport-list{display:flex; flex-direction:column; gap:20px;}
.transport-option{
  background:#fff; padding:34px 30px; border-radius:var(--r-lg);
  box-shadow:var(--shadow-soft);
  display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center;
  transition:transform .25s, box-shadow .25s;
}
.transport-option:hover{transform:translateY(-3px); box-shadow:var(--shadow-lift);}
.transport-option .eyebrow{color:var(--muted); margin-bottom:6px; display:block;}
.transport-option h3{font-size:20px;}
.transport-option p{font-size:15px; color:var(--ink-soft); max-width:50ch; margin:0 auto;}
.transport-option .req-link{
  font-size:14px; font-weight:600; color:var(--accent);
  background:rgba(0,113,227,0.08);
  padding:11px 24px; border-radius:var(--r-pill); text-align:center;
  transition:background .15s, color .15s;
}
.transport-option .req-link:hover{background:var(--accent); color:#fff;}

.vehicle-note{
  margin-top:40px; padding:26px 28px;
  background:#fff; border-radius:var(--r-md);
  box-shadow:var(--shadow-soft);
  font-size:14px; color:var(--ink-soft); text-align:center;
}
.vehicle-note strong{
  color:var(--ink); font-size:13px; font-weight:600; text-transform:uppercase;
  letter-spacing:0.04em; display:block; margin-bottom:8px;
}

/* ---------- FULL EXPERIENCE CARDS ---------- */
.experience-full{
  background:#fff; border-radius:var(--r-lg);
  box-shadow:var(--shadow-soft);
  overflow:hidden;
  transition:transform .25s, box-shadow .25s;
}
.experience-full:hover{transform:translateY(-3px); box-shadow:var(--shadow-lift);}
.exp-header{padding:34px 30px 0; text-align:center;}
.exp-header .eyebrow{color:var(--muted); margin-bottom:8px; display:block;}
.exp-header h3{font-size:24px; margin-bottom:12px;}
.exp-header p.desc{font-size:15px; color:var(--ink-soft); max-width:62ch; margin:0 auto;}
.exp-meta{
  display:grid; grid-template-columns:1fr 1fr; gap:12px;
  margin:26px 30px 0; text-align:center;
}
@media(min-width:640px){ .exp-meta{grid-template-columns:repeat(4,1fr);} }
.exp-meta div{background:var(--bg-alt); padding:16px; border-radius:var(--r-sm);}
.exp-meta .label{font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--muted); display:block; margin-bottom:6px; font-weight:600;}
.exp-meta .value{font-size:14.5px; font-weight:600; color:var(--ink);}
.exp-inex{display:grid; grid-template-columns:1fr; gap:16px; padding:26px 30px; justify-items:center;}
@media(min-width:640px){ .exp-inex{grid-template-columns:1fr 1fr;} }
.exp-inex > div{text-align:left; background:var(--bg-alt); border-radius:var(--r-sm); padding:20px 22px; width:100%;}
.exp-inex h4{font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; margin:0 0 12px; color:var(--muted);}
.exp-inex ul{margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px;}
.exp-inex li{font-size:14.5px; color:var(--ink-soft); padding-left:20px; position:relative;}
.exp-inex .in li::before{content:'✓'; position:absolute; left:0; color:var(--accent); font-size:13px; top:1px; font-weight:600;}
.exp-inex .out li::before{content:'–'; position:absolute; left:0; color:var(--muted);}
.exp-footer{
  display:flex; flex-direction:column; align-items:center; gap:14px;
  padding:4px 30px 32px; text-align:center;
}
.exp-footer .price{font-size:13px; color:var(--muted); font-weight:500;}

/* ---------- FORM ---------- */
.booking-shell{
  max-width:640px; margin:0 auto;
  background:#fff; border-radius:var(--r-lg);
  box-shadow:var(--shadow-lift);
  padding:44px 40px;
}
@media(max-width:520px){ .booking-shell{padding:30px 22px;} }
.form-row{display:grid; grid-template-columns:1fr; gap:18px; margin-bottom:18px;}
@media(min-width:600px){ .form-row.two{grid-template-columns:1fr 1fr;} }
label{
  display:block; font-size:13px; font-weight:600;
  color:var(--ink-soft); margin-bottom:8px;
}
input, select, textarea{
  width:100%; font-family:inherit; font-size:16px; color:var(--ink);
  background:var(--bg-alt); border:1px solid transparent; border-radius:var(--r-sm);
  padding:14px 16px;
  transition:border-color .15s, background .15s;
  appearance:none; -webkit-appearance:none;
}
input:focus, select:focus, textarea:focus{border-color:var(--accent); background:#fff; outline:none;}
textarea{resize:vertical; min-height:100px;}
.form-submit{
  width:100%; background:var(--accent); color:#fff; font-weight:600; font-size:16px;
  padding:16px; border:none; border-radius:var(--r-pill); cursor:pointer;
  transition:background .15s, transform .2s;
  font-family:inherit;
}
.form-submit:hover{background:var(--accent-hover); transform:scale(1.01);}
.form-note{font-size:13px; color:var(--muted); margin-top:16px; line-height:1.6; text-align:center;}
.form-success{
  display:none; padding:18px 22px; background:rgba(0,113,227,0.08);
  border-radius:var(--r-sm); font-size:14.5px; color:var(--accent); margin-bottom:20px;
  font-weight:500; text-align:center;
}
.form-success.show{display:block;}

/* ---------- PHOTOS ---------- */
.hero, .page-hero{ background-size:cover; background-position:center; }
.service-card .card-photo{
  width:100%; height:170px; object-fit:cover;
  border-radius:var(--r-md); margin-bottom:8px;
}
.exp-photo{ width:100%; height:230px; object-fit:cover; display:block; }
.photo-band{
  display:grid; grid-template-columns:1fr; gap:16px; margin-top:0;
}
@media(min-width:700px){ .photo-band{grid-template-columns:repeat(3,1fr);} }
.photo-band img{
  width:100%; height:220px; object-fit:cover; border-radius:var(--r-lg);
  box-shadow:var(--shadow-soft);
}

/* ---------- MINI DOT LISTS (scannable content) ---------- */
.mini{
  list-style:none; padding:0; margin:12px auto 0;
  display:flex; flex-direction:column; gap:8px;
  max-width:44ch;
}
.mini li{
  font-size:15.5px; color:var(--ink-soft); line-height:1.45;
}
.mini li::before{content:'·  '; color:var(--accent); font-weight:700;}
.mini.left{margin-left:0;}
.mini.left li{text-align:left;}

/* ---------- VIDEO CARDS ---------- */
.video-grid{
  display:grid; grid-template-columns:1fr; gap:20px;
}
@media(min-width:700px){ .video-grid{grid-template-columns:repeat(2,1fr);} }
@media(min-width:1000px){ .video-grid{grid-template-columns:repeat(3,1fr);} }
.video-card{
  background:#fff; border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--shadow-soft);
  transition:transform .25s, box-shadow .25s;
}
.video-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-lift);}
.video-frame{
  aspect-ratio:16/9; background:var(--bg-alt); position:relative; overflow:hidden;
}
.video-frame iframe{
  position:absolute; inset:0; width:100%; height:100%; border:0;
}
.video-placeholder{
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:12px;
  color:var(--muted); font-size:13px; font-weight:500;
  background:var(--bg-alt);
}
.video-placeholder .play{
  width:56px; height:56px; border-radius:50%;
  background:#fff;
  box-shadow:var(--shadow-soft);
  display:flex; align-items:center; justify-content:center;
}
.video-placeholder .play::after{
  content:''; display:block; margin-left:4px;
  border-left:16px solid var(--accent); border-top:10px solid transparent; border-bottom:10px solid transparent;
}
.video-card h3{
  font-size:16.5px; padding:18px 20px 6px; margin:0; text-align:center;
}
.video-card p{
  font-size:13.5px; color:var(--muted); margin:0; padding:0 20px 20px; text-align:center;
}

/* ---------- TRANSPORT CAROUSEL ---------- */
.transport-list{
  flex-direction:row; gap:16px;
  overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding:8px 4px 20px;
  scrollbar-width:none;
}
.transport-list::-webkit-scrollbar{display:none;}
.transport-list .transport-option{
  flex:0 0 86%;
  scroll-snap-align:center;
  justify-content:flex-start;
}
@media(min-width:700px){
  .transport-list .transport-option{flex:0 0 46%;}
}
@media(min-width:1000px){
  .transport-list .transport-option{flex:0 0 340px;}
}
.carousel-dots{
  display:flex; gap:8px; justify-content:center; margin-top:6px;
}
.carousel-dots button{
  width:8px; height:8px; border-radius:50%; border:none; padding:0; cursor:pointer;
  background:rgba(0,0,0,0.15); transition:background .2s, transform .2s;
}
.carousel-dots button.active{background:var(--accent); transform:scale(1.25);}


/* ---------- SCROLL REVEAL (journey steps) ---------- */
@media (prefers-reduced-motion: no-preference){
  .checkpoint{
    opacity:0; transform:translateY(30px);
    transition:opacity .8s cubic-bezier(.32,.72,.28,1), transform .8s cubic-bezier(.32,.72,.28,1);
  }
  .checkpoint.in-view{opacity:1; transform:none;}

  /* each card slides in from its own side of the path */
  .checkpoint .checkpoint-icon{
    opacity:0; transform:scale(.82) rotate(-8deg);
    transition:opacity .5s ease, transform .6s cubic-bezier(.34,1.56,.64,1);
  }
  .checkpoint.in-view .checkpoint-icon{opacity:1; transform:none; transition-delay:.18s;}
  .checkpoint .checkpoint-num{
    opacity:0; transform:translateY(-6px);
    transition:opacity .6s ease, transform .6s ease;
  }
  .checkpoint.in-view .checkpoint-num{opacity:1; transform:none; transition-delay:.1s;}
  .checkpoint .checkpoint-coord,
  .checkpoint h3,
  .checkpoint .mini li{
    opacity:0; transform:translateY(12px);
    transition:opacity .55s ease, transform .55s cubic-bezier(.32,.72,.28,1);
  }
  .checkpoint.in-view .checkpoint-coord{opacity:1; transform:none; transition-delay:.16s;}
  .checkpoint.in-view h3{opacity:1; transform:none; transition-delay:.24s;}
  .checkpoint.in-view .mini li{opacity:1; transform:none;}
  .checkpoint.in-view .mini li:nth-child(1){transition-delay:.32s;}
  .checkpoint.in-view .mini li:nth-child(2){transition-delay:.39s;}
  .checkpoint.in-view .mini li:nth-child(3){transition-delay:.46s;}
}
@media (prefers-reduced-motion: no-preference) and (min-width:900px){
  .checkpoint:nth-child(odd){transform:translate(-52px,30px);}
  .checkpoint:nth-child(even){transform:translate(52px,30px);}
  .checkpoint.in-view{transform:none;}
}
@media (prefers-reduced-motion: reduce){
  .checkpoint,
  .checkpoint .checkpoint-icon,
  .checkpoint .checkpoint-num,
  .checkpoint .checkpoint-coord,
  .checkpoint h3,
  .checkpoint .mini li{opacity:1; transform:none;}
  .route::after{height:calc(100% - 20px);}
}

/* ---------- TAP AFFORDANCE (subtle) ---------- */
@media (prefers-reduced-motion: no-preference){
  /* Gentle breathing glow on primary actions — barely noticeable, just alive */
  @keyframes soft-breathe{
    0%, 100%{box-shadow:0 4px 18px rgba(0,113,227,0.18);}
    50%{box-shadow:0 6px 26px rgba(0,113,227,0.34);}
  }
  .btn-primary{animation:soft-breathe 3.6s ease-in-out infinite;}
}

/* Press feedback on touch/click — universal, instant */
.btn-primary:active,
.btn-ghost:active,
.checkpoint-title-btn:active,
.nav-cta:active,
.form-submit:active,
.transport-option .req-link:active,
.mobile-panel a:active,
.footer-wa:active,
.footer-social a:active,
.checkpoint-title-btn:active{
  transform:scale(0.96);
  transition-duration:.08s;
}


/* ---------- TRANSPORT CARD PHOTOS ---------- */
.transport-option{padding-top:0; overflow:hidden;}
.transport-option .card-photo{
  width:calc(100% + 60px); max-width:none;
  align-self:center; flex-shrink:0;
  margin:0 0 10px;
  height:190px; object-fit:cover; display:block;
  border-radius:var(--r-lg) var(--r-lg) 0 0;
}
.transport-option.no-photo{padding-top:34px;}


/* ---------- LOGO ---------- */
.brand-logo{height:40px; width:auto; display:block;}
@media(min-width:900px){ .brand-logo{height:44px;} }


/* ---------- DESKTOP HERO HEIGHT ---------- */
@media(min-width:900px){
  .hero{
    min-height:82vh;
    display:flex; align-items:center;
  }
  .hero-inner{width:100%;}
  .page-hero{
    min-height:64vh;
    display:flex; align-items:center;
  }
  .page-hero .wrap{width:100%;}
}

/* ---------- SINGLE FEATURE VIDEO (one per page) ---------- */
.video-feature{
  max-width:760px; margin:0 auto;
}
.video-feature .video-frame{
  border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-soft);
}
.video-feature .video-frame iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}

/* ---------- EXPERIENCE TIMES / PRICING / ADD-ONS ---------- */
.exp-times{padding:0 30px 22px; display:flex; flex-wrap:wrap; gap:8px;}
.exp-time-chip{background:var(--bg-alt); border-radius:var(--r-pill); padding:6px 14px; font-size:13px; font-weight:600; color:var(--ink);}
.exp-pricing{display:grid; grid-template-columns:1fr; gap:14px; padding:0 30px 22px;}
@media(min-width:640px){ .exp-pricing{grid-template-columns:1fr 1fr;} }
.exp-price-card{background:var(--bg-alt); border-radius:var(--r-sm); padding:20px 22px; text-align:center;}
.exp-price-card .type{font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; color:var(--muted); display:block; margin-bottom:6px;}
.exp-price-card .amount{font-size:26px; font-weight:700; color:var(--ink);}
.exp-price-card .amount span{font-size:13px; font-weight:500; color:var(--muted);}
.exp-price-card .note{font-size:12.5px; color:var(--ink-soft); margin-top:6px; display:block;}
.exp-discount{background:rgba(0,113,227,0.06); border-radius:var(--r-sm); padding:16px 22px; margin:0 30px 22px; font-size:13.5px; color:var(--ink-soft); text-align:center; line-height:1.6;}
.exp-discount strong{color:var(--accent);}
.exp-addons{padding:0 30px 22px;}
.exp-addons h4{font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; margin:0 0 10px; color:var(--muted);}
.exp-addons ul{margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:6px;}
.exp-addons li{font-size:14.5px; color:var(--ink-soft); padding-left:20px; position:relative;}
.exp-addons li::before{content:'+'; position:absolute; left:0; color:var(--accent); font-weight:700;}