/* Must match the rendered .site-header height exactly, or the section nav
   tucks under it when both are pinned. Measured: 79px desktop, 67px mobile. */
body.subpage{--header-h:79px}

/* The homepage header is position:absolute and floats over an 820px dark hero.
   Subpages have no such hero, so it must occupy layout space instead - otherwise
   it covers whatever renders first. Sticky keeps the nav available while scrolling. */
body.subpage .site-header{position:sticky;top:0;background:rgba(7,21,34,.96);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.12)}
body.subpage .site-header.scrolled{box-shadow:0 10px 30px rgba(0,0,0,.18)}

/* .btn-outline is white-on-transparent, built for dark heroes. On a light
   background it needs the gold treatment or it disappears. */
.btn-outline.on-light{border-color:var(--gold-deep);color:var(--gold-deep)}
.btn-outline.on-light:hover{background:var(--gold-deep);color:#fff;transform:translateY(-2px)}

.crumbs{padding:26px 0 0;font-size:10px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:9px;margin:0;padding:0}
.crumbs li+li:before{content:"/";margin-right:9px;color:var(--stone)}
.crumbs a:hover{color:var(--gold-deep)}
.crumbs [aria-current]{color:var(--gold-deep);font-weight:700}

.tour-hero{padding:40px 0 8px}
.tour-hero-grid{display:grid;grid-template-columns:1fr .82fr;gap:64px;align-items:center}
.tour-hero h1{font:600 clamp(40px,4.6vw,62px)/.98 var(--serif);letter-spacing:-.035em;margin:0 0 22px;color:#0f1d2a}
.tour-hero .lead{color:var(--muted);font-size:15px;max-width:52ch;margin:0 0 30px}
.tour-facts{display:grid;grid-template-columns:repeat(2,1fr);gap:16px 26px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:30px}
.tour-facts span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);margin-bottom:5px}
.tour-facts strong{font-size:13px;font-weight:700;color:var(--ink)}
.tour-cta{display:flex;gap:12px;flex-wrap:wrap}

.tour-body{display:grid;grid-template-columns:1fr .42fr;gap:70px;align-items:start}
.tour-main h2{font:600 44px/1 var(--serif);letter-spacing:-.03em;margin:0 0 22px;color:#0f1d2a}
.placeholder-note{background:#fdf6e3;border-left:3px solid var(--gold);padding:13px 16px;font-size:12px;color:#6b5628;margin:0 0 34px}

.itinerary{list-style:none;margin:0 0 46px;padding:0}
.itinerary li{display:grid;grid-template-columns:84px 1fr;gap:22px;padding:24px 0;border-top:1px solid var(--line)}
.itin-day{font:600 15px var(--serif);color:var(--gold-deep);letter-spacing:.04em;padding-top:2px}
.itin-body h3{font:600 21px var(--serif);margin:0 0 7px;color:#0f1d2a}
.itin-body p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.75}

.incl-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding-top:34px;border-top:1px solid var(--line)}
.incl-grid h3{font:600 22px var(--serif);margin:0 0 16px;color:#0f1d2a}
.incl-grid ul{list-style:none;margin:0;padding:0}
.incl-grid li{font-size:13px;color:var(--muted);padding:7px 0 7px 24px;position:relative}
.ticks li:before{content:"✓";position:absolute;left:0;color:var(--gold-deep);font-weight:700}
.crosses li:before{content:"—";position:absolute;left:0;color:var(--stone)}

/* Sits directly under the sticky header. --header-h keeps the two offsets in step. */
.section-nav{position:sticky;top:var(--header-h);z-index:40;background:rgba(255,253,249,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.section-nav .container{display:flex;gap:34px;overflow-x:auto;scrollbar-width:none}
.section-nav .container::-webkit-scrollbar{display:none}
.section-nav a{position:relative;flex:none;padding:17px 0;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.15em;color:var(--muted);white-space:nowrap;transition:color .2s}
.section-nav a:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gold-deep);transform:scaleX(0);transition:transform .25s}
.section-nav a:hover{color:var(--ink)}
.section-nav a.active{color:var(--gold-deep)}
.section-nav a.active:after{transform:scaleX(1)}

.tour-section{scroll-margin-top:calc(var(--header-h) + 62px)}
.tour-section+.tour-section{margin-top:64px}
.tour-lede{color:var(--muted);font-size:14.5px;max-width:62ch}

.tour-aside{position:sticky;top:calc(var(--header-h) + 76px);display:grid;gap:20px}
.aside-form{background:var(--navy);color:#e8edf1;padding:30px 26px;border:1px solid rgba(195,162,101,.3)}
.aside-form strong{display:block;font:600 25px/1.2 var(--serif);color:#fff;margin:14px 0 10px}
.aside-form>p{font-size:12px;color:#9facb6;margin:0 0 22px;line-height:1.7}
.aside-form label{display:flex;flex-direction:column;gap:6px;font-size:9px;text-transform:uppercase;letter-spacing:.1em;font-weight:800;color:#b9c4cd;margin-bottom:14px}
.aside-form input,.aside-form textarea{width:100%;border:0;border-bottom:1px solid rgba(255,255,255,.24);background:transparent;padding:8px 0;color:#fff;outline:0;text-transform:none;letter-spacing:0;font-weight:500;font-size:13px;resize:vertical}
.aside-form input::placeholder,.aside-form textarea::placeholder{color:#66727c}
.aside-form input:focus,.aside-form textarea:focus{border-color:var(--gold)}
.aside-form .btn{width:100%;margin-top:4px}
.aside-more{display:block;width:100%;margin-top:14px;background:none;border:0;padding:0;text-align:center;color:var(--gold);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.11em}
.aside-more:hover{color:#fff}
.aside-facts{border:1px solid var(--line);padding:28px 26px;background:var(--ivory)}
.aside-facts h4{font:600 20px var(--serif);margin:0 0 16px;color:#0f1d2a}
.aside-facts dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:11px 18px}
.aside-facts dt{font-size:9px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);align-self:center}
.aside-facts dd{margin:0;font-size:12.5px;font-weight:700;color:var(--ink);text-align:right}

.related{background:var(--ivory)}
.related .program-body a{display:inline-block;margin-top:14px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.13em;color:var(--gold-deep)}

@media (max-width:980px){
  .tour-hero-grid,.tour-body{grid-template-columns:1fr;gap:44px}
  .tour-aside{position:static}
  .section-nav .container{gap:24px}
}
@media (max-width:700px){
  body.subpage{--header-h:67px}
}
@media (max-width:560px){
  .tour-facts{grid-template-columns:1fr}
  .incl-grid{grid-template-columns:1fr;gap:28px}
  .itinerary li{grid-template-columns:1fr;gap:8px}
  .tour-main h2{font-size:34px}
}
