/**
 * The Himalayan Guides — Design Tokens
 * Single source of truth for color, type and spacing — no raw hex in components.
 */
/* Base page gutter — declared above the media queries so the ≤1024px
   blocks below can settle phones at 32px and ≤640px at 20px. */
:root{--pad: 48px; --container-padding: 48px}
@media(max-width: 1100px){
:root{--pad: 32px; --container-padding: 32px}
}
@media(max-width: 640px){
:root{--pad: 20px; --container-padding: 20px}
}

@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
:root{--pad: 20px}
.foot-main{grid-template-columns: 1fr; gap: 40px}
}
.p404{min-height: 100vh; background: var(--ink); color: #fff; display: grid; place-items: center; position: relative; overflow: hidden; padding: 120px 0 80px}
.p404-bg{position: absolute; inset: 0; background: radial-gradient(ellipse at 30% 40%,rgba(184,68,42,.12),transparent 60%),radial-gradient(ellipse at 70% 70%,rgba(182,150,88,.08),transparent 60%),var(--ink)}
.p404-grain{position: absolute; inset: 0; opacity: .04; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E")}
.p404-inner{position: relative; z-index: 2; text-align: center; max-width: 720px; padding: 0 var(--pad)}
.p404-num{font-family: var(--fd); font-weight: 500; font-size: clamp(140px,22vw,280px); line-height: .9; letter-spacing: -.04em; color: transparent; -webkit-text-stroke: 1px var(--gold-lt); margin-bottom: 8px}
.p404 .eyebrow{color: var(--gold); margin-bottom: 20px; display: block}
.p404 h1{font-family: var(--fe); font-weight: 400; font-size: clamp(38px,5vw,64px); line-height: 1.1; letter-spacing: -.02em; margin-bottom: 20px}
.p404 h1 i{font-style: italic; color: var(--gold-lt)}
.p404 p{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: 18px; color: rgba(244,239,230,.7); line-height: 1.65; margin-bottom: 40px; max-width: 52ch; margin-inline: auto}
.p404-actions{display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 60px}
.p404-links{display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.08); max-width: 640px; margin-inline: auto}
.p404-link{background: var(--ink); padding: 26px 20px; text-align: center; transition: background .3s}
.p404-link:hover{background: var(--ink-2)}
.p404-link i{font-size: 22px; color: var(--gold-lt); margin-bottom: 10px; display: block}
.p404-link span{font-family: var(--fu); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.8)}
@media(max-width:640px){
.p404-links{grid-template-columns: repeat(2,1fr)}
}

@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
:root{--pad: 20px}
.foot-main{grid-template-columns: 1fr; gap: 40px}
}
  .phero.ab .phero-bg{background-image: linear-gradient(rgba(14,20,17,.4),rgba(14,20,17,.75)),linear-gradient(158deg,#1A2420,#0E1411); filter: brightness(.72) contrast(1.06) saturate(1.02)}
  .phero.ab .phero-inner h1{margin-top: 22px}
  .founder h2{margin-top: 14px}
  /* About hero — the background is the page's Featured Image (any brightness), so an
     always-on readable veil keeps the title legible: lighter mid-frame so the photo
     shows, darkest at the bottom where the headline sits. */
  .phero.ab .phero-veil{background: radial-gradient(120% 100% at 50% 40%, rgba(14,20,17,.16) 0%, rgba(14,20,17,.34) 52%, rgba(14,20,17,.64) 100%), linear-gradient(180deg, rgba(14,20,17,.34) 0%, rgba(14,20,17,.22) 44%, rgba(14,20,17,.90) 100%)}
.founder{background: var(--paper); padding: 120px 0}
.founder-grid{display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: center}
.founder-img{aspect-ratio: 4/5; background: center/cover linear-gradient(158deg,#1A2420,#0E1411)}
.founder h2{font-family: var(--fe); font-size: clamp(38px,4vw,60px); font-weight: 400; line-height: 1.05; letter-spacing: -.02em; margin-bottom: 28px}
.founder h2 i{font-style: italic; color: var(--ember)}
.founder .quote{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: 22px; line-height: 1.55; color: var(--t2l); margin-bottom: 28px; border-left: 2px solid var(--gold); padding-left: 24px}
.founder p{font-family: var(--fu); font-size: 15.5px; color: var(--t2l); line-height: 1.8; margin-bottom: 18px}
.founder .sig{margin-top: 36px; display: flex; align-items: center; gap: 16px; font-family: var(--fe); font-style: italic; color: var(--ink)}
.founder .sig b{display: block; font-family: var(--fu); font-style: normal; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--brand-orange); margin-top: 4px; font-weight: 500}
.founder .entry-content{max-width: none; margin: 0}
.founder .entry-content p{font-family: var(--fu); font-size: 15.5px; color: var(--t2l); line-height: 1.8; margin-bottom: 18px; font-weight: 400}
.founder .entry-content p:last-child{margin-bottom: 0}
.numbers{background: var(--ink); color: #fff; padding: 100px 0; border-top: 1px solid rgba(255,255,255,.05); border-bottom: 1px solid rgba(255,255,255,.05)}
.numbers-grid{display: grid; grid-template-columns: repeat(4,1fr); gap: 60px}
.stat{border-left: 1px solid rgba(255,255,255,.1); padding-left: 24px}
.stat .n{font-family: var(--fd); font-size: 72px; font-weight: 500; letter-spacing: -.03em; color: var(--gold-lt); line-height: 1}
.stat .l{font-family: var(--fu); font-size: 11px; letter-spacing: .28em; text-transform: uppercase; color: rgba(244,239,230,.7); margin-top: 14px}
.stat p{font-family: var(--fe); font-style: italic; color: rgba(244,239,230,.55); margin-top: 10px; font-size: 14px; line-height: 1.5}
.why{background: var(--bone); padding: 120px 0}
.why-head{text-align: center; max-width: 640px; margin: 0 auto 72px}
.why-head h2{font-family: var(--fe); font-size: clamp(38px,4.5vw,64px); font-weight: 400; letter-spacing: -.02em; line-height: 1.05; margin: 14px 0 20px}
.why-head h2 i{font-style: italic; color: var(--ember)}
.why-head p{font-family: var(--fe); font-style: italic; color: var(--t2l); font-size: 18px}
.why-grid{display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--bone-3); border: 1px solid var(--bone-3)}
.why-card{background: var(--paper); padding: 48px 40px; display: flex; flex-direction: column; gap: 16px; transition: background .4s}
.why-card:hover{background: #fff}
.why-card .why-card-top{display: flex; justify-content: space-between; align-items: flex-start}
.why-card .n{font-family: var(--fd); font-size: 22px; color: var(--brand-orange); font-weight: 500; letter-spacing: .1em}
.why-card i.ph{font-size: 36px; color: var(--ember)}
.why-card h3{font-family: var(--fe); font-size: 26px; font-weight: 400; line-height: 1.15; color: var(--ink)}
.why-card p{font-family: var(--fu); font-size: 14.5px; color: var(--t2l); line-height: 1.7}
.team{background: var(--bone-2); padding: 120px 0}
.team-head{display: flex; justify-content: space-between; align-items: end; margin-bottom: 56px; flex-wrap: wrap; gap: 20px}
.team-head h2{font-family: var(--fe); font-size: 48px; font-weight: 400; letter-spacing: -.02em; margin-top: 14px}
.team-head h2 i{font-style: italic; color: var(--ember)}
.team-head p{font-family: var(--fe); font-style: italic; color: var(--t2l); max-width: 44ch}
.team-grid{display: grid; grid-template-columns: repeat(4,1fr); gap: 32px}
.tcard{background: var(--paper); border: 1px solid var(--bone-3); transition: transform .5s var(--ex)}
.tcard:hover{transform: translateY(-6px)}
.tcard .img{aspect-ratio: 3/4; overflow: hidden; background: var(--bone-3)}
.tcard .img img{width: 100%; height: 100%; object-fit: cover; filter: grayscale(.2); transition: filter .6s}
.tcard:hover .img img{filter: grayscale(0)}
.tcard .img .tcard-avatar{display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-family: var(--fe); font-style: italic; font-size: 54px; color: var(--paper); background: linear-gradient(150deg, var(--ink) 0%, var(--ink-2) 100%)}
.tcard .body{padding: 22px}
.tcard h4{font-family: var(--fe); font-size: 20px; color: var(--ink); margin-bottom: 4px}
.tcard .r{font-family: var(--fu); font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--brand-orange); margin-bottom: 10px}
.tcard p{font-family: var(--fu); font-size: 13px; color: var(--t2l); line-height: 1.55}
.tcard .m{display: flex; gap: 14px; margin-top: 14px; font-family: var(--fu); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--t3l)}
.tcard .m i{color: var(--gold)}
.story{background: var(--ink); color: #fff; padding: 120px 0; position: relative}
.story-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center}
.story-img{aspect-ratio: 5/6; background: center/cover linear-gradient(158deg,#1A2420,#0E1411)}
.story h2{font-family: var(--fe); font-size: clamp(38px,4vw,60px); font-weight: 400; letter-spacing: -.02em; line-height: 1.05; margin: 14px 0 28px}
.story h2 i{font-style: italic; color: var(--gold-lt)}
.story p{font-family: var(--fe); font-style: italic; font-weight: 300; color: rgba(244,239,230,.75); font-size: 17.5px; line-height: 1.8; margin-bottom: 18px}
.timeline{margin-top: 36px; border-top: 1px solid rgba(255,255,255,.1)}
  .tl-row .y{font-family: var(--fd); font-size: 24px; color: var(--gold-lt); font-weight: 500; letter-spacing: -.02em}
  .tl-row .t{font-family: var(--fu); font-size: 14px; color: rgba(244,239,230,.8); line-height: 1.55}
  /* Story timeline — scoped to the dark band so the trip itinerary .tl-row (light
     border, 88px column) does not bleed in. Specificity keeps this ahead of it. */
  .story .tl-row{display: grid; grid-template-columns: 110px 1fr; padding: 26px 0; border-bottom: 1px solid rgba(255,255,255,.12); gap: 44px; align-items: baseline; position: relative}
  .story .tl-row:last-child{border-bottom: none}
.story .tl-row .y{font-family: var(--fd); font-size: 24px; color: var(--gold-lt); font-weight: 500; letter-spacing: -.02em}
    .story .tl-row .t{font-family: var(--fu); font-size: 14px; color: rgba(244,239,230,.8); line-height: 1.55; padding-left: 0}
  /* About CTA — a warm, light closing band. The Story section above and the footer
     below are both dark, so a solid dark CTA would stack three near-identical black
     bands. This light bone band (with a soft gold glow + ember accent) closes the
     page with contrast instead, and keeps the loud orange to one signature button. */
  .about-cta{background: var(--bone); padding: 120px 0; text-align: center; position: relative; overflow: hidden}
  .about-cta::before{content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: min(920px,90%); height: 160px; background: radial-gradient(60% 100% at 50% 0%, rgba(214,185,126,.22) 0%, transparent 70%); pointer-events: none}
  .about-cta .container{position: relative; z-index: 2}
  .about-cta h2{font-family: var(--fe); font-size: clamp(38px,4.5vw,56px); font-weight: 400; letter-spacing: -.02em; line-height: 1.05; color: var(--ink); max-width: 760px; margin: 16px auto 40px}
  .about-cta h2 i{font-style: italic; color: var(--ember)}
  .about-cta .about-cta-btn{display: inline-flex; align-items: center; gap: 12px; font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; padding: 16px 30px; background: var(--brand-orange); color: #fff; text-decoration: none; transition: background .3s var(--ex), transform .3s var(--ex)}
  .about-cta .about-cta-btn:hover{background: var(--brand-orange-dk)}
  .about-cta .about-cta-btn i.ph{font-size: 15px}
  @media(max-width:960px){
.founder-grid,.story-grid{grid-template-columns: 1fr; gap: 48px}
.numbers-grid{grid-template-columns: repeat(2,1fr); gap: 40px}
.why-grid{grid-template-columns: 1fr}
.team-grid{grid-template-columns: repeat(2,1fr)}
.story .tl-row{grid-template-columns: 1fr; gap: 18px; padding: 22px 0}
}
@media(max-width:640px){
.team-grid{grid-template-columns: 1fr}
.founder-img,.story-img{max-height: 420px}
}

@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
:root{--pad: 20px}
.foot-main{grid-template-columns: 1fr; gap: 40px}
}
.phero.blog .phero-bg{background-image: linear-gradient(rgba(14,20,17,.4),rgba(14,20,17,.75)),linear-gradient(158deg,#1A2420,#0E1411)}
.blog-hero-meta{display: flex; gap: 24px; margin-top: 32px; font-family: var(--fu); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.6)}
.blog-hero-meta b{color: var(--gold-lt); font-weight: 500}
/* topic rail */
  /* Topic rail — wraps onto new lines so EVERY category is visible and selectable (no hidden horizontal scroll). Sticky directly under the fixed nav: the offset is the runtime-measured nav height (the nav is content-sized per install, so hardcoded px guesses left the bar pinned behind the menu; main.js sets --nav-h, the px fallback covers no-JS). */
  .topics{background: rgba(250,246,239,.97); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--bone-3); position: sticky; top: calc(var(--nav-h, 96px) + 14px); z-index: 80; box-shadow: 0 10px 24px -18px rgba(14,20,17,.18)}
  .topics .container{padding-right: 0}
  .topics-row{display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 14px 0}
  .topic{font-family: var(--fu); font-size: 11.5px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; padding: 9px 16px; color: var(--t2l); border: 1px solid var(--bone-3); border-radius: 999px; white-space: nowrap; transition: color .25s, background .25s, border-color .25s; cursor: pointer; display: inline-flex; align-items: center; gap: 6px}
  .topic:hover{color: var(--ink); border-color: var(--ink)}
  .topic.on{background: var(--ink); color: #fff; border-color: var(--ink)}
  .topic .n{font-family: var(--fd); font-size: 10px; color: var(--brand-orange); font-style: normal; letter-spacing: 0}
  .topic.on .n{color: var(--gold-lt)}
  @media(max-width:1100px){.topics{top: calc(var(--nav-h, 84px) + 12px)}}
  /* on phones the topics rail stops sticking (it was eating the screen) and becomes a single calm scroll strip: one row, swipeable, edge-to-edge, no wrap. */
  @media(max-width:760px){
    .topics{position: static; box-shadow: none; border-bottom: 1px solid var(--bone-3)}
    .topics .container{padding: 0}
    .topics-row{flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; margin: 0; padding: 12px var(--pad); gap: 8px}
    .topics-row::-webkit-scrollbar{display: none}
    .topics-row .topic{white-space: nowrap; flex: 0 0 auto}
  }
/* featured */
.feat{padding: 80px 0 40px; background: var(--bone)}
.feat-grid{display: grid; grid-template-columns: 1.4fr 1fr; gap: 48px; align-items: stretch}
.feat-card{position: relative; min-height: 520px; overflow: hidden; background: #000; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; padding: 48px}
.feat-card::before{content: ''; position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 1.2s var(--ex); z-index: 0}
.feat-card:hover::before{transform: scale(1.04)}
.feat-card::after{content: ''; position: absolute; inset: 0; background: linear-gradient(180deg,rgba(0,0,0,.2) 0%,rgba(0,0,0,.85) 100%); z-index: 1}
.feat-card>*{position: relative; z-index: 2}
.feat-card.a::before{background-image: linear-gradient(158deg,#1A2420,#0E1411)}
.feat-card.b{min-height: 250px; padding: 32px}
.feat-card.b::before{background-image: linear-gradient(158deg,#1A2420,#0E1411)}
.feat-card.c{min-height: 250px; padding: 32px}
.feat-card.c::before{background-image: linear-gradient(158deg,#1A2420,#0E1411)}
.feat-side{display: grid; grid-template-rows: 1fr 1fr; gap: 24px}
.feat-tag{font-family: var(--fu); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: var(--gold-lt); margin-bottom: 14px}
.feat-card h3{font-family: var(--fe); font-weight: 400; font-size: 32px; line-height: 1.1; letter-spacing: -.015em; max-width: 20ch; margin-bottom: 14px}
.feat-card.b h3,.feat-card.c h3{font-size: 22px}
.feat-meta{font-family: var(--fu); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: rgba(244,239,230,.7); display: flex; gap: 16px}
.feat-meta i{color: var(--gold-lt); margin-right: 4px}
/* grid list */
  .list-sec{padding: 80px 0 104px; background: var(--bone)}
  @media(max-width:760px){.list-sec{padding-bottom: 72px}}
.list-head{display: flex; justify-content: space-between; align-items: end; margin-bottom: 48px; border-bottom: 1px solid var(--bone-3); padding-bottom: 24px}
.list-head h2{font-family: var(--fe); font-size: 36px; font-weight: 400; letter-spacing: -.015em}
.list-head .sort{font-family: var(--fu); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--t2l); display: flex; gap: 14px; align-items: center}
.list-head select{font-family: var(--fu); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; background: transparent; border: 1px solid var(--bone-3); padding: 8px 14px; color: var(--ink); cursor: pointer}
.b-grid{display: grid; grid-template-columns: repeat(3,1fr); gap: 48px 32px}
.b-card{cursor: pointer}
.b-card .img{aspect-ratio: 4/3; overflow: hidden; background: #e5dcc9; position: relative; margin-bottom: 20px}
.b-card .img img{width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ex)}
.b-card:hover .img img{transform: scale(1.04)}
.b-card .cat{position: absolute; top: 14px; left: 14px; background: rgba(14,20,17,.85); color: #fff; font-family: var(--fu); font-size: 9.5px; letter-spacing: .24em; text-transform: uppercase; padding: 6px 10px; z-index: 2}
.b-card .meta{font-family: var(--fu); font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--t3l); display: flex; gap: 14px; margin-bottom: 12px}
.b-card .meta b{color: var(--brand-orange); font-weight: 500}
.b-card h3{font-family: var(--fe); font-weight: 400; font-size: 24px; line-height: 1.2; letter-spacing: -.015em; color: var(--ink); margin-bottom: 10px}
.b-card:hover h3{color: var(--ember)}
.b-card p{font-family: var(--fu); font-size: 14px; color: var(--t2l); line-height: 1.65; margin-bottom: 14px}
.b-card .auth{display: flex; align-items: center; gap: 10px; font-family: var(--fu); font-size: 12px; color: var(--t2l)}
  .b-card .avatar{width: 28px; height: 28px; border-radius: 50%; background: var(--bone-3) center/cover; flex-shrink: 0}
  .b-card .avatar--initials{display: grid; place-items: center; background: linear-gradient(135deg, var(--brand-orange), var(--ember-dk)); color: #fff; font-family: var(--fe); font-style: italic; font-size: 13px; font-weight: 500; line-height: 1}
  .b-card .auth b{color: var(--ink); font-weight: 500}
/* the journal pager shares the trip archive's .pnums design; only the spacing is journal-specific (the section's bottom padding breathes). */
.b-pag{margin-top: 64px}
/* newsletter */
.news{background: var(--ink); color: #fff; padding: 120px 0; text-align: center; position: relative}
@media(max-width:760px){.news{padding: 88px 0}}
/* a thin gold rule crowns the band (quiet brand signature) */
.news::before{content: ''; display: block; width: 64px; height: 1px; background: var(--gold); margin: 0 auto 40px; opacity: .8}
@media(max-width:760px){.news::before{margin-bottom: 28px}}
.news h2{font-family: var(--fe); font-weight: 400; font-size: clamp(32px,4vw,52px); letter-spacing: -.02em; margin-bottom: 16px}
.news h2 i{font-style: italic; color: var(--gold-lt)}
.news p{font-family: var(--fe); font-style: italic; color: rgba(244,239,230,.7); max-width: 52ch; margin-inline: auto; margin-bottom: 36px}
/* .news-form (hand-rolled form) removed with markup; the newsletter renders the WPForms form via .news-form-wrap below. */
@media(max-width:960px){
.feat-grid{grid-template-columns: 1fr}
.b-grid{grid-template-columns: repeat(2,1fr)}
}
@media(max-width:640px){
.b-grid{grid-template-columns: 1fr}
.list-head{flex-direction: column; align-items: flex-start; gap: 16px}
}

@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
:root{--pad: 20px}
.foot-main{grid-template-columns: 1fr; gap: 40px}
}
  /* journal essay hero. Feature image fills the fold; title + short description sit on it, bottom-anchored (same block pattern as .archive-hero, NOT the trip .hero-body 2-col grid). Header blends with the image (see the :has(.bs-hero) scrim list further down). Text is always white-on-image. */
  .bs-hero{position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; background: #0E1411 center/cover no-repeat; color: #fff; min-height: 86svh; padding-bottom: 64px}
  .bs-hero.no-img{min-height: 0; padding-bottom: 56px}
  .bs-hero.no-img .container{padding-top: calc(var(--nav-h, 84px) + 64px)}
  .bs-hero-veil{position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 30%, rgba(14,20,17,.16) 0%, rgba(14,20,17,.34) 55%, rgba(14,20,17,.76) 100%), linear-gradient(180deg, rgba(14,20,17,.30) 0%, rgba(14,20,17,.22) 38%, rgba(14,20,17,.94) 100%); pointer-events: none}
  .bs-hero .container{position: relative; z-index: 2; width: 100%; max-width: 1160px; margin: 0 auto; padding: 180px var(--pad) 56px}
  .bs-hero .crumb{margin-bottom: 32px; color: var(--t2d); font-family: var(--fu); font-size: 12px; letter-spacing: .06em; text-transform: uppercase}
  .bs-hero .crumb a{color: var(--t2d); transition: color .2s}
  .bs-hero .crumb a:hover{color: #fff}
  .bs-hero .crumb span.sep{color: rgba(244,239,230,.4); margin: 0 6px}
  .bs-hero .crumb b{color: var(--t2d); font-weight: 500}
  .bs-hero .cat{display: inline-block; font-family: var(--fu); font-size: 11px; letter-spacing: .32em; text-transform: uppercase; color: var(--brand-orange); margin-bottom: 22px}
  .bs-hero h1{font-family: var(--fe); font-weight: 300; font-size: clamp(38px,5.4vw,68px); line-height: 1.04; letter-spacing: -.025em; margin-bottom: 22px; max-width: 20ch; text-wrap: balance}
  .bs-hero h1 i{font-style: italic; color: var(--gold-lt)}
  .bs-hero .sub{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: 20px; color: rgba(244,239,230,.84); line-height: 1.6; max-width: 60ch; margin-bottom: 4px; text-shadow: 0 2px 18px rgba(0,0,0,.5)}
  .bs-hero h1, .bs-hero .crumb, .bs-hero .cat{text-shadow: 0 2px 22px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.4)}
  @media(max-width:640px){
  .bs-hero .container{padding-top: 150px}
  .bs-hero h1{font-size: clamp(30px,8.4vw,44px)}
  .bs-hero .sub{font-size: 18px}
  }
.bs-meta{display: flex; align-items: center; gap: 32px; margin-top: 40px; padding-top: 32px; border-top: 1px solid rgba(255,255,255,.1); flex-wrap: wrap}
.bs-auth{display: flex; align-items: center; gap: 14px}
.bs-auth-av{width: 52px; height: 52px; border-radius: 50%; background: center/cover; background-image: url('https://i.pravatar.cc/120?img=12'); border: 1px solid rgba(255,255,255,.15)}
.bs-auth-name{font-family: var(--fe); font-size: 17px; color: #fff}
.bs-auth-role{font-family: var(--fu); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold-lt); margin-top: 2px}
.bs-mstat{font-family: var(--fu); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.6); display: flex; gap: 10px; align-items: center}
.bs-mstat i{color: var(--gold-lt)}
.bs-share{margin-left: auto; display: flex; gap: 8px}
.bs-share a, .bs-share button{width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.15); display: grid; place-items: center; color: rgba(244,239,230,.7); transition: all .3s; background: transparent; padding: 0; cursor: pointer; font: inherit}
.bs-share a:hover, .bs-share button:hover{background: var(--brand-orange); border-color: var(--brand-orange); color: #fff}
  .bs-body{padding: 100px 0; background: var(--bone)}
.bs-layout{display: grid; grid-template-columns: 220px 1fr; gap: 64px; max-width: 1160px; margin: 0 auto; padding: 0 var(--pad)}
.toc-links{display: flex; flex-direction: column; gap: 2px}
.toc-links a{display: block; position: relative; padding: 8px 10px 8px 18px; border-left: 2px solid transparent; font-family: var(--fu); font-size: 13px; color: var(--t2l); text-decoration: none; line-height: 1.4; transition: color .25s, border-color .25s}
.toc-links a:hover{color: var(--ink)}
.toc-links a.on{color: var(--ink); border-left-color: var(--brand-orange)}
.toc-load{font-family: var(--fu); font-size: 13px; color: var(--t3l); font-style: italic}
.toc h5{font-family: var(--fu); font-size: 10.5px; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: var(--t3l); padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid var(--bone-3)}
.toc a:hover,.toc a.on{color: var(--ink); border-left-color: var(--brand-orange)}
  .bs-article{font-family: var(--fe); font-weight: 400; font-size: 18.5px; line-height: 1.75; color: var(--t1l); max-width: 76ch; overflow-wrap: break-word}
.bs-article p{margin-bottom: 28px}
.bs-article p:first-of-type::first-letter{font-family: var(--fe); font-size: 76px; font-weight: 400; float: left; line-height: .85; margin: 6px 12px 0 -4px; color: var(--ember)}
.bs-article.entry-content h2{font-family: var(--fe); font-weight: 400; font-size: 36px; line-height: 1.2; letter-spacing: -.015em; margin: 56px 0 24px; color: var(--ink)}
.bs-article.entry-content h3{font-family: var(--fe); font-weight: 500; font-size: 24px; line-height: 1.3; margin: 40px 0 16px; color: var(--ink)}
.bs-article.entry-content h4{font-family: var(--fe); font-weight: 500; font-size: 20px; line-height: 1.35; margin: 32px 0 12px; color: var(--ink)}
.bs-article.entry-content h5{font-family: var(--fe); font-weight: 500; font-size: 17px; line-height: 1.4; margin: 28px 0 10px; color: var(--ink)}
.bs-article.entry-content h6{font-family: var(--fu); font-weight: 600; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--t3l); margin: 24px 0 10px}
/* Article body keeps the design's Fraunces voice — the generic .entry-content
   paragraph and list rules further down must not restyle it. */
.bs-article.entry-content p{font-family: var(--fe); font-size: 18.5px; line-height: 1.75; color: var(--t1l); margin-bottom: 28px}
.bs-article.entry-content ul li, .bs-article.entry-content ol li{font-family: var(--fe); font-size: 18px; line-height: 1.75}
.bs-article a{color: var(--ember); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px}
.bs-article blockquote{font-family: var(--fe); font-style: italic; font-size: 26px; line-height: 1.4; color: var(--ember-dk); border-left: 2px solid var(--gold); padding: 12px 0 12px 32px; margin: 40px 0; max-width: 38em}
.bs-article ul,.bs-article ol{margin: 0 0 28px 24px}
.bs-article li{margin-bottom: 10px; font-size: 18px}
.bs-article img.wide{width: calc(100% + 120px); margin: 48px -60px; max-width: none}
/* no horizontal scroll on phones: wide images fold back into the column, editor align-wide/full classes clamp, and code/embeds scroll inside their own box instead of the page. At 961-1100px the two-column journal layout leaves too little side room for the ±60px breakout, so the wide image takes a half step (+48px) instead of overshooting the fold. Long URLs: only overflow-wrap:anywhere softens the intrinsic min-content (break-word does not), so the column track can actually shrink. */
.bs-article.entry-content p, .bs-article.entry-content li{overflow-wrap: anywhere}
.bs-article a{overflow-wrap: anywhere}
/* the 1fr grid track sizes to the item's content min-content unless the
   item may shrink: min-width:0 lets the track take the free space and
   width:100% makes the article fill it, so oversize content (a wide pre
   or table) scrolls inside its own box instead of pushing the page. */
.bs-article{min-width: 0; width: 100%}
@media(max-width:1100px){
  .bs-article img.wide{width: calc(100% + 48px); margin: 44px -24px}
}
@media(max-width:960px){
  .bs-article img.wide{width: 100%; margin: 40px 0; max-width: 100%}
  .bs-article .alignwide{width: 100%; margin-left: 0; margin-right: 0; max-width: 100%}
  .bs-article .alignfull{width: 100%; margin-left: 0; margin-right: 0; max-width: 100%}
  .bs-article iframe,.bs-article video{max-width: 100%}
}
/* journal tables are wrapped in a .table-wrap by thg_wrap_tables() (single.php, same as page.php), so the horizontal scroll lives on the wrapper, not on the table. The table itself stays display:table at width:100% — small tables fill the column (no dead space on the right), wide ones overflow the wrapper and scroll inside it on every screen. The !important is deliberate: the generic .entry-content table rules further down carry min-width 480-600px for the .table-wrap pattern — inside the journal article we never force that. */
.bs-article .table-wrap{margin: 36px 0; max-width: 100%}
.bs-article .table-wrap table{margin: 0}
.bs-article.entry-content table{min-width: 0 !important}
.bs-article figure{margin: 48px 0}
.bs-article figcaption{font-family: var(--fu); font-size: 12px; letter-spacing: .08em; color: var(--t3l); margin-top: 12px; font-style: normal}
.bs-article table{width: 100%; border-collapse: collapse; margin: 36px 0; font-family: var(--fu); font-size: 14px}
.bs-article th{background: var(--ink); color: #fff; text-align: left; padding: 14px 16px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; font-size: 11px}
.bs-article td{padding: 14px 16px; border-bottom: 1px solid var(--bone-3); color: var(--t1l)}
.bs-tag-row{display: flex; gap: 8px; flex-wrap: wrap; margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--bone-3)}
.bs-tag{font-family: var(--fu); font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; padding: 8px 14px; border: 1px solid var(--bone-3); color: var(--t2l)}
.inq{background: var(--ink); color: #fff; padding: 32px 26px}
.inq h4{font-family: var(--fe); font-size: 22px; line-height: 1.2; margin-bottom: 8px}
.inq h4 i{font-style: italic; color: var(--gold-lt)}
.inq p{font-family: var(--fu); font-size: 12.5px; color: rgba(244,239,230,.65); line-height: 1.5; margin-bottom: 20px}
.inq input,.inq textarea{width: 100%; background: transparent; border: none; border-bottom: 1px solid rgba(255,255,255,.2); padding: 12px 0; color: #fff; font-family: var(--fu); font-size: 13px; margin-bottom: 14px; outline: none}
.inq input::placeholder,.inq textarea::placeholder{color: rgba(244,239,230,.4)}
.inq textarea{resize: vertical; min-height: 60px}
.inq button{width: 100%; background: var(--brand-orange); color: #fff; border: none; padding: 14px; font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; cursor: pointer; margin-top: 12px}
/* author bio */
.bs-bio{background: var(--paper); border: 1px solid var(--bone-3); padding: 36px; display: grid; grid-template-columns: 100px 1fr; gap: 28px; align-items: center; max-width: 880px; margin: 80px auto 0}
.bs-bio-av{width: 100px; height: 100px; border-radius: 50%; background: center/cover; background-image: url('https://i.pravatar.cc/200?img=12')}
.bs-bio h4{font-family: var(--fe); font-size: 24px; color: var(--ink); margin-bottom: 4px}
.bs-bio .r{font-family: var(--fu); font-size: 10.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--brand-orange); margin-bottom: 12px}
.bs-bio p{font-family: var(--fu); font-size: 14px; color: var(--t2l); line-height: 1.6; margin-bottom: 14px}
.bs-bio .links{display: flex; gap: 14px; font-family: var(--fu); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--ember)}
  .rel{background: var(--bone-2); padding: 64px 0}
.rel h2{font-family: var(--fe); font-size: 40px; letter-spacing: -.015em; margin-bottom: 14px}
.rel .sub{font-family: var(--fe); font-style: italic; color: var(--t2l); margin-bottom: 48px}
.rel-grid{display: grid; grid-template-columns: repeat(3,1fr); gap: 32px}
.rel-card{cursor: pointer}
.rel-card .img{aspect-ratio: 3/2; overflow: hidden; margin-bottom: 16px}
.rel-card .img img{width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ex)}
.rel-card:hover .img img{transform: scale(1.04)}
.rel-card .cat{font-family: var(--fu); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--brand-orange); margin-bottom: 8px}
.rel-card h3{font-family: var(--fe); font-size: 22px; line-height: 1.25; color: var(--ink)}
.rel-card:hover h3{color: var(--ember)}
.rel-card .m{font-family: var(--fu); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--t3l); margin-top: 8px}
@media(max-width:960px){
.bs-layout{grid-template-columns: 1fr}.toc {position: static}
.rel-grid{grid-template-columns: 1fr}
}

@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
:root{--pad: 20px}
.foot-main{grid-template-columns: 1fr; gap: 40px}
}
  .phero.co .phero-bg{background-image: linear-gradient(rgba(14,20,17,.45),rgba(14,20,17,.8)),linear-gradient(158deg,#1A2420,#0E1411); filter: brightness(.62) contrast(1.05) saturate(1.02)}
  /* Contact hero — lighter overlay so the photo reads while the title stays legible. */
  .phero.co .phero-veil{background: radial-gradient(120% 90% at 50% 30%, rgba(14,20,17,.10) 0%, rgba(14,20,17,.22) 55%, rgba(14,20,17,.50) 100%), linear-gradient(180deg, rgba(14,20,17,.22) 0%, rgba(14,20,17,.12) 42%, rgba(14,20,17,.80) 100%)}
.co-body{background: var(--bone); padding: 100px 0}
.co-grid{display: grid; grid-template-columns: 1fr 1.1fr; gap: 80px; align-items: start}
/* left: contact info */
.co-info h2{font-family: var(--fe); font-size: 44px; font-weight: 400; letter-spacing: -.015em; line-height: 1.05; margin-bottom: 20px}
.co-info h2 i{font-style: italic; color: var(--ember)}
.co-info .lede{font-family: var(--fe); font-style: italic; color: var(--t2l); font-size: 17.5px; line-height: 1.7; margin-bottom: 48px; max-width: 44ch}
.co-block{padding: 24px 0; border-top: 1px solid var(--bone-3); display: grid; grid-template-columns: 48px 1fr; gap: 18px; align-items: start}
.co-block:last-of-type{border-bottom: 1px solid var(--bone-3)}
.co-block i.ph{font-size: 26px; color: var(--brand-orange); margin-top: 4px}
.co-block .lbl{font-family: var(--fu); font-size: 10.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--t3l); margin-bottom: 6px}
.co-block .val{font-family: var(--fe); font-size: 22px; color: var(--ink); line-height: 1.35; overflow-wrap: anywhere}
.co-block .val a{color: var(--ink); transition: color .2s}
.co-block .val a:hover{color: var(--ember)}
.co-block small{font-family: var(--fu); font-size: 12.5px; color: var(--t2l); display: block; margin-top: 6px}
.co-reps{margin-top: 48px; display: grid; grid-template-columns: repeat(3,1fr); gap: 20px}
.co-rep{background: var(--paper); border: 1px solid var(--bone-3); padding: 20px}
.co-rep .c{font-family: var(--fu); font-size: 10.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--brand-orange); margin-bottom: 6px}
.co-rep h4{font-family: var(--fe); font-size: 17px; color: var(--ink); margin-bottom: 4px}
.co-rep p{font-family: var(--fu); font-size: 12px; color: var(--t2l); line-height: 1.5; overflow-wrap: anywhere}
/* right: form */
.co-form{background: var(--paper); border: 1px solid var(--bone-3); padding: 48px}
.co-form .eyebrow{margin-bottom: 14px; display: block}
.co-form h3{font-family: var(--fe); font-size: 32px; font-weight: 400; letter-spacing: -.015em; line-height: 1.15; margin-bottom: 14px}
.co-form h3 i{font-style: italic; color: var(--ember)}
.co-form p.i{font-family: var(--fe); font-style: italic; color: var(--t2l); margin-bottom: 32px}
.co-form label{display: block; font-family: var(--fu); font-size: 10.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--t3l); margin-bottom: 8px}
.co-form .fld{margin-bottom: 24px}
.co-form input,.co-form select,.co-form textarea{width: 100%; background: transparent; border: none; border-bottom: 1px solid var(--bone-3); padding: 12px 0; font-family: var(--fu); font-size: 15px; color: var(--ink); outline: none; transition: border-color .2s}
.co-form input:focus,.co-form textarea:focus,.co-form select:focus{border-bottom-color: var(--brand-orange)}
.co-form textarea{resize: vertical; min-height: 100px}
.co-form .two{display: grid; grid-template-columns: 1fr 1fr; gap: 24px}
.co-form .chk{display: flex; gap: 10px; align-items: flex-start; margin: 8px 0 28px; font-family: var(--fu); font-size: 12.5px; color: var(--t2l); line-height: 1.5}
.co-form .chk input{width: auto; margin-top: 3px}
.co-form button{width: 100%; background: var(--brand-orange); color: #fff; border: none; padding: 18px; font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; cursor: pointer; transition: background .3s; display: flex; align-items: center; justify-content: center; gap: 10px}
.co-form button:hover{background: var(--ember-dk)}
  .co-form .fine{font-family: var(--fe); font-style: italic; font-size: 13px; color: var(--t3l); text-align: center; margin-top: 20px}
  .co-notice{font-family: var(--fu); font-size: 13px; line-height: 1.5; padding: 14px 16px; margin-bottom: 28px; border: 1px solid var(--bone-3)}
  .co-notice.ok{color: var(--pine); border-color: rgba(74,91,67,.35); background: rgba(74,91,67,.08)}
  .co-notice.err{color: var(--ember); border-color: rgba(184,68,42,.35); background: rgba(184,68,42,.08)}
  /* WPForms inside the light .co-form card — brand underline fields on paper.
     Scoped so it can't leak to other forms. Mirrors the .thg-slot-form skin. */
  .co-form .wpforms-container,
  .co-form .wpforms-container .wpforms-form{margin: 0; padding: 0}
  .co-form .wpforms-field{margin: 0 0 24px; padding: 0}
  .co-form .wpforms-field-label{display: block; font-family: var(--fu); font-size: 10.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--t3l); margin: 0 0 8px; font-weight: 500}
  .co-form .wpforms-field-label .wpforms-required-label{color: var(--ember)}
  .co-form .wpforms-field input[type=text],
  .co-form .wpforms-field input[type=email],
  .co-form .wpforms-field input[type=tel],
  .co-form .wpforms-field input[type=number],
  .co-form .wpforms-field input[type=date],
  .co-form .wpforms-field select,
  .co-form .wpforms-field textarea{width: 100% !important; max-width: 100% !important; background: transparent !important; border: none !important; border-bottom: 1px solid var(--bone-3) !important; border-radius: 0 !important; box-shadow: none !important; padding: 12px 0 !important; font-family: var(--fu) !important; font-size: 15px !important; color: var(--ink) !important; outline: none !important; transition: border-color .2s}
  .co-form .wpforms-field input:focus,
  .co-form .wpforms-field select:focus,
  .co-form .wpforms-field textarea:focus{border-bottom-color: var(--brand-orange) !important}
  .co-form .wpforms-field input::placeholder,
  .co-form .wpforms-field textarea::placeholder{color: var(--t3l); opacity: .7}
  .co-form .wpforms-field select option{background: #fff; color: var(--ink)}
  .co-form .wpforms-field textarea{resize: vertical; min-height: 100px}
  .co-form .wpforms-field-row{display: flex; gap: 24px}
  .co-form .wpforms-field-row .wpforms-field-row-block{flex: 1; padding: 0}
  .co-form .wpforms-submit-container{padding: 0; margin-top: 8px}
  .co-form button[type=submit],
  .co-form .wpforms-submit{background: var(--brand-orange) !important; color: #fff !important; border: none !important; border-radius: 0 !important; font-family: var(--fu) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .2em !important; text-transform: uppercase !important; padding: 18px !important; transition: background .3s !important; box-shadow: none !important; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer}
  .co-form button[type=submit]:hover,
  .co-form .wpforms-submit:hover{background: var(--ember-dk) !important}
  .co-form .wpforms-error{font-family: var(--fu) !important; font-size: 13px !important; color: var(--ember) !important; margin-top: 6px}
  .co-form .wpforms-field.wpforms-has-error input,
  .co-form .wpforms-field.wpforms-has-error textarea{border-bottom-color: var(--brand-orange) !important}
  .co-form .wpforms-confirmation-container-full{background: transparent !important; border: 1px solid var(--bone-3) !important; padding: 24px !important; font-family: var(--fe) !important; font-style: italic !important; font-size: 17px !important; color: var(--pine) !important}
  .co-form .thg-contact-fallback .two{grid-template-columns: 1fr 1fr; gap: 24px}
  @media(max-width:960px){
  .co-form .wpforms-field-row{flex-direction: column; gap: 0}
  .co-form .thg-contact-fallback .two{grid-template-columns: 1fr; gap: 0}
  }
/* map section */
.map-sec{background: var(--ink); color: #fff; position: relative}
.map-grid{display: grid; grid-template-columns: 400px 1fr; min-height: 520px}
.map-side{padding: 60px 48px; display: flex; flex-direction: column; justify-content: center; background: var(--ink-2)}
.map-side h3{font-family: var(--fe); font-size: 36px; font-weight: 400; letter-spacing: -.015em; line-height: 1.1; margin: 14px 0 20px}
.map-side h3 i{font-style: italic; color: var(--gold-lt)}
.map-side p{font-family: var(--fe); font-style: italic; color: rgba(244,239,230,.7); line-height: 1.7; margin-bottom: 24px}
.map-side .row{display: flex; align-items: center; gap: 14px; padding: 14px 0; border-top: 1px solid rgba(255,255,255,.08); font-family: var(--fu); font-size: 13px; color: rgba(244,239,230,.85)}
.map-side .row:last-child{border-bottom: 1px solid rgba(255,255,255,.08)}
.map-side .row i{color: var(--gold-lt); font-size: 18px}
.map-frame{background: #0A0F0C linear-gradient(158deg,#1A2420,#0E1411) center/cover; position: relative}
.map-frame::after{content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(14,20,17,.35),transparent 30%)}
/* Google Maps embed fills the frame; suppress the decorative gradient + pin
   so the live map is unobstructed. */
.map-frame.has-embed{background: var(--ink-2)}
.map-frame.has-embed::after{content: none}
.map-frame .map-embed,
.map-frame iframe{position: absolute; inset: 0; width: 100%; height: 100%; max-width: 100%; border: 0; display: block}
/* embed markup pasted from map sites often arrives WRAPPED (<div class="mapouter">…<iframe width="600" style="…">) so the old direct-child selector missed it and the intrinsic iframe width pushed the page sideways on phones. Any descendant iframe is pinned to the frame; !important beats the pasted inline width/style attributes. */
.map-frame iframe{width: 100% !important; height: 100% !important; max-width: 100% !important}
.map-frame > iframe{filter: none}
.map-pin{position: absolute; top: 44%; left: 52%; width: 22px; height: 22px; background: var(--brand-orange); border-radius: 50%; box-shadow: 0 0 0 8px rgba(255,103,1,.25),0 0 0 20px rgba(255,103,1,.12); animation: pulse 2s ease-in-out infinite; z-index: 2}
.map-pin::after{content: attr(data-label); position: absolute; top: -38px; left: 50%; transform: translateX(-50%); background: #fff; color: var(--ink); padding: 6px 12px; font-family: var(--fu); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; white-space: nowrap}
@keyframes pulse{
0%,100%{box-shadow:0 0 0 8px rgba(255,103,1,.25),0 0 0 20px rgba(255,103,1,.12);}50%{box-shadow:0 0 0 12px rgba(255,103,1,.15),0 0 0 30px rgba(255,103,1,.05);}
}
@media(max-width:960px){
.co-grid{grid-template-columns: 1fr; gap: 60px}
.co-reps{grid-template-columns: 1fr}
.map-grid{grid-template-columns: 1fr}
.map-side{padding: 40px 32px}
.map-frame{min-height: 340px}
}
/* last line of defence for pasted embeds on phones: whatever escapes the pinned-iframe rules is clipped by the frame, never the page. */
.map-frame{overflow: hidden}

/* TOKENS — from Brand Guideline v1.0 */
/* atoms */
.dark .eyebrow{color: var(--gold)}
.chip.gold{background: transparent; color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold)}
.chip.green{background: rgba(74,91,67,.14); color: var(--moss)}
/* NAV (shared) */
@media(max-width:900px){
.nav-links{display: none}
}
/* HERO — day tour scale, editorial not "epic" */
@keyframes heroZoom{
to{transform:scale(1);}
}
.hero-tag{display: inline-flex; gap: 10px; margin-bottom: 26px; flex-wrap: wrap}
.hero-tag .chip{background: rgba(255,255,255,.08); color: #fff; backdrop-filter: blur(8px)}
.hero-tag .chip.hot{background: var(--brand-orange); color: #fff}
/* SEO H1 small-caps + poetic Fraunces H2 title */
.hero-meta-row{display: flex; align-items: center; gap: 20px; margin-top: 32px; font-family: var(--fu); font-size: 12px; color: rgba(244,239,230,.7); letter-spacing: .06em}
.hero-meta-row .dot{width: 4px; height: 4px; border-radius: 50%; background: rgba(244,239,230,.4)}
.hero-meta-row i.ph{color: var(--gold-lt); margin-right: 6px; font-size: 15px}
/* hero side card */
.qbook{background: rgba(14,20,17,.6); backdrop-filter: blur(22px) saturate(130%); -webkit-backdrop-filter: blur(22px) saturate(130%); border: 1px solid rgba(255,255,255,.1); padding: 32px 30px}
.qbook-head{display: flex; align-items: center; justify-content: space-between; padding-bottom: 16px; margin-bottom: 20px; border-bottom: 1px solid rgba(255,255,255,.08)}
.qbook-t{font-family: var(--fe); font-style: italic; font-size: 17px; color: var(--gold-lt)}
.qbook-no{font-family: var(--fu); font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: rgba(244,239,230,.4)}
.qbook-price{display: flex; align-items: baseline; gap: 8px; margin-bottom: 6px}
.qbook-price .from{font-family: var(--fu); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: rgba(244,239,230,.5); align-self: center}
.qbook-price .amt{font-family: var(--fd); font-size: 44px; font-weight: 500; color: #fff; letter-spacing: -.02em; line-height: 1}
.qbook-price .amt sup{font-size: 18px; color: var(--gold-lt); font-family: var(--fe); font-style: italic; margin-right: 2px}
.qbook-price .per{font-family: var(--fe); font-style: italic; font-size: 13px; color: rgba(244,239,230,.55)}
.qbook-badge{display: flex; gap: 6px; flex-wrap: wrap; margin-top: 14px}
.qbook-badge span{font-family: var(--fu); font-size: 9.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-lt); padding: 6px 10px; box-shadow: inset 0 0 0 1px rgba(214,185,126,.35)}
.qbook-btn{margin-top: 22px; width: 100%; justify-content: center; background: var(--brand-orange); color: #fff; padding: 16px}
.qbook-btn:hover{background: #e55d00}
.qbook-alt{margin-top: 12px; width: 100%; text-align: center; font-family: var(--fu); font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.7); padding: 12px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); cursor: pointer; transition: all .2s; display: block}
.qbook-alt:hover{color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.5)}
.qbook-foot{margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.08); display: flex; flex-direction: column; gap: 8px; font-family: var(--fu); font-size: 11px; color: rgba(244,239,230,.65)}
.qbook-foot i{color: var(--gold-lt); margin-right: 8px}
@media(max-width:1000px){
.hero-body{grid-template-columns: 1fr; padding: 150px 28px 60px; gap: 32px}
}
/* STICKY SUB-NAV */
/* FACTS STRIP */
.facts{background: var(--bone); padding: 64px 0; border-bottom: 1px solid var(--bone-3)}
.facts-row{display: grid; grid-template-columns: repeat(6,1fr); gap: 0}
.fact{padding: 4px 24px; border-right: 1px solid var(--bone-3); display: flex; flex-direction: column; gap: 10px}
.fact:first-child{padding-left: 0}
.fact:last-child{border-right: none; padding-right: 0}
.fact i.ph{font-size: 22px; color: var(--brand-orange)}
.fact-l{font-family: var(--fu); font-size: 10px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--t3l)}
.fact-v{font-family: var(--fe); font-size: 17px; font-weight: 500; color: var(--ink); line-height: 1.25}
.fact-v em{font-style: italic; color: var(--brand-orange); font-weight: 400}
.fact-v small{display: block; font-family: var(--fu); font-size: 11px; font-style: normal; color: var(--t3l); letter-spacing: .02em; text-transform: none; margin-top: 4px; font-weight: 400}
@media(max-width:900px){
.facts-row{grid-template-columns: repeat(2,1fr); gap: 28px}
.fact{padding: 0; border: none}
}
/* SECTIONS */
@media(max-width:900px){
.sec-head{grid-template-columns: 1fr; gap: 24px}
}
/* HIGHLIGHTS */
.hl-grid{display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; background: var(--bone-3)}
.hl{background: var(--paper); padding: 44px 34px; position: relative; transition: background .3s}
.hl:hover{background: #fff}
.hl-no{font-family: var(--fd); font-size: 12px; font-weight: 600; color: var(--brand-orange); letter-spacing: .14em; margin-bottom: 20px}
.hl-t{font-family: var(--fe); font-size: 22px; font-weight: 400; line-height: 1.25; color: var(--ink); margin-bottom: 14px}
.hl-p{font-family: var(--fu); font-size: 14.5px; color: var(--t2l); line-height: 1.65}
.hl i.ph{font-size: 28px; color: var(--ember); margin-bottom: 22px; display: block}
@media(max-width:900px){
.hl-grid{grid-template-columns: 1fr}
}
/* OVERVIEW — two-col editorial */
.ov-grid{display: grid; grid-template-columns: 1.3fr .9fr; gap: 80px; align-items: start}
.ov-body p{font-family: var(--fe); font-size: 19px; font-weight: 300; line-height: 1.7; color: var(--t1l); margin-bottom: 22px}
.ov-body p:first-child::first-line{font-family: var(--fe); letter-spacing: .02em}
.ov-body p.lead{font-size: 22px; color: var(--ink)}
.ov-body p.lead em{font-style: italic; color: var(--ember)}
.ov-body .drop{font-family: var(--fe); font-size: 82px; font-weight: 400; line-height: .85; float: left; padding: 8px 18px 0 0; color: var(--ember); font-style: italic}
.ov-aside{background: var(--bone); padding: 38px 34px; border-top: 2px solid var(--brand-orange)}
.ov-aside h4{font-family: var(--fu); font-size: 11px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--brand-orange); margin-bottom: 22px}
.ov-aside ul li{display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--bone-3); font-family: var(--fu); font-size: 14px; color: var(--t1l)}
.ov-aside ul li:last-child{border-bottom: none}
.ov-aside ul li i.ph{color: var(--brand-orange); font-size: 18px; flex-shrink: 0; margin-top: 2px}
.ov-aside ul li span.l{font-family: var(--fu); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); display: block; margin-bottom: 3px}
@media(max-width:900px){
.ov-grid{grid-template-columns: 1fr; gap: 44px}
}
/* ITINERARY (hour-by-hour timeline) */
.tl{position: relative; padding-left: 0}
.tl::before{content: ''; position: absolute; left: 88px; top: 8px; bottom: 8px; width: 1px; background: var(--bone-3)}
.tl-row{display: grid; grid-template-columns: 88px 1fr; padding: 32px 0; border-bottom: 1px solid var(--bone-3); gap: 44px; align-items: baseline; position: relative}
.tl-row:last-child{border-bottom: none}
.tl-time{font-family: var(--fd); font-size: 22px; font-weight: 500; color: var(--ink); letter-spacing: -.01em; position: relative}
.tl-time small{display: block; font-family: var(--fu); font-size: 10px; font-weight: 500; color: var(--t3l); letter-spacing: .22em; text-transform: uppercase; margin-top: 4px}
.tl-dot{position: absolute; left: 88px; top: 6px; width: 11px; height: 11px; border-radius: 50%; background: var(--paper); box-shadow: 0 0 0 1px var(--brand-orange); transform: translateX(-5px)}
.tl-row:hover .tl-dot{background: var(--brand-orange)}
.tl-content{padding-left: 26px}
.tl-t{font-family: var(--fe); font-size: 24px; font-weight: 400; color: var(--ink); margin-bottom: 10px; line-height: 1.25}
.tl-t .stop{font-family: var(--fu); font-size: 10px; font-weight: 600; color: var(--gold); letter-spacing: .24em; text-transform: uppercase; display: block; margin-bottom: 6px}
.tl-p{font-family: var(--fu); font-size: 15px; color: var(--t2l); line-height: 1.7; max-width: 640px; margin-bottom: 14px}
.tl-meta{display: flex; gap: 20px; flex-wrap: wrap; font-family: var(--fu); font-size: 12px; color: var(--t3l); letter-spacing: .06em}
.tl-meta span i{color: var(--ember); margin-right: 6px}
@media(max-width:900px){
.tl::before{left: 14px}
.tl-row{grid-template-columns: 1fr; gap: 16px}
.tl-time{padding-left: 34px}
.tl-dot{left: 14px}
.tl-content{padding-left: 34px}
}
/* INCLUDES / EXCLUDES / NOT SUITABLE */
.inc-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--bone-3)}
.inc-col{background: var(--paper); padding: 44px 40px}
.inc-col h3{font-family: var(--fe); font-size: 26px; font-weight: 400; margin-bottom: 24px; color: var(--ink); display: flex; align-items: center; gap: 14px}
.inc-col.ex h3{color: var(--t2l)}
.inc-col h3 i{font-size: 26px; color: var(--brand-orange)}
.inc-col.ex h3 i{color: var(--t3l)}
.inc-col ul li{padding: 14px 0; border-bottom: 1px solid var(--bone-3); font-family: var(--fu); font-size: 14.5px; color: var(--t1l); display: flex; gap: 14px; line-height: 1.55}
.inc-col ul li:last-child{border-bottom: none}
.inc-col ul li i{color: var(--brand-orange); flex-shrink: 0; margin-top: 3px; font-size: 16px}
.inc-col.ex ul li i{color: var(--t3l)}
.inc-col.ex ul li{color: var(--t2l)}
@media(max-width:800px){
.inc-grid{grid-template-columns: 1fr}
}
.ns-band{background: linear-gradient(to right,var(--bone-2) 0%,var(--bone) 100%); padding: 56px 48px; margin-top: 40px; border-left: 3px solid var(--ember); display: grid; grid-template-columns: .7fr 1.3fr; gap: 60px; align-items: center}
.ns-band h3{font-family: var(--fe); font-size: 30px; font-weight: 400; color: var(--ink); line-height: 1.15}
.ns-band h3 em{font-style: italic; color: var(--ember)}
.ns-band ul{display: grid; grid-template-columns: 1fr 1fr; gap: 14px 32px}
.ns-band ul li{font-family: var(--fu); font-size: 14px; color: var(--t2l); display: flex; gap: 12px; line-height: 1.55}
.ns-band ul li i{color: var(--ember); flex-shrink: 0; margin-top: 3px}
@media(max-width:800px){
.ns-band{grid-template-columns: 1fr; gap: 28px; padding: 36px 28px}
.ns-band ul{grid-template-columns: 1fr}
}
/* IMPORTANT INFO — rich content article */
.info-grid{display: grid; grid-template-columns: 220px 1fr; gap: 64px; align-items: start}
.info-toc{position: sticky; top: calc(var(--nav-h, 84px) + 86px)}
.info-toc h5{font-family: var(--fu); font-size: 10px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--t3l); margin-bottom: 18px}
.info-toc a{display: block; padding: 9px 0; font-family: var(--fu); font-size: 13px; color: var(--t2l); border-left: 1px solid var(--bone-3); padding-left: 14px; transition: all .2s}
.info-toc a:hover,.info-toc a.active{color: var(--brand-orange); border-left-color: var(--brand-orange)}
.info-body h3{font-family: var(--fe); font-size: 28px; font-weight: 400; color: var(--ink); margin: 44px 0 14px; line-height: 1.2}
.info-body h3:first-child{margin-top: 0}
.info-body h3 em{font-style: italic; color: var(--ember)}
.info-body h4{font-family: var(--fu); font-size: 12px; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; color: var(--brand-orange); margin: 26px 0 12px}
.info-body p{font-family: var(--fu); font-size: 15.5px; color: var(--t1l); line-height: 1.8; margin-bottom: 14px}
.info-body ul.bul li{padding: 8px 0 8px 22px; position: relative; font-family: var(--fu); font-size: 15px; color: var(--t1l); line-height: 1.7}
.info-body ul.bul li::before{content: ''; position: absolute; left: 0; top: 18px; width: 8px; height: 1px; background: var(--brand-orange)}
.info-body blockquote{border-left: 2px solid var(--gold); padding: 8px 0 8px 22px; margin: 22px 0; font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--t2l); line-height: 1.55}
.info-body table{width: 100%; border-collapse: collapse; margin: 20px 0; font-family: var(--fu); font-size: 13.5px}
.info-body th,.info-body td{padding: 12px 14px; text-align: left; border-bottom: 1px solid var(--bone-3)}
.info-body th{font-family: var(--fu); font-size: 10px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--t3l); background: var(--bone)}
.info-body strong{color: var(--ink); font-weight: 600}
@media(max-width:900px){
.info-grid{grid-template-columns: 1fr}
.info-toc{position: static}
}
/* COST & DATES */
.price-card{background: var(--ink-2); color: var(--t1d); padding: 44px 40px; position: relative; overflow: hidden}
.price-card::before{content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--brand-orange)}
.price-card .from{font-family: var(--fu); font-size: 11px; letter-spacing: .3em; text-transform: uppercase; color: var(--t3d); margin-bottom: 10px}
.price-card .main{display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px}
.price-card .main .amt{font-family: var(--fd); font-size: 78px; font-weight: 500; color: #fff; letter-spacing: -.03em; line-height: 1}
.price-card .main .amt sup{font-size: 26px; color: var(--gold-lt); font-family: var(--fe); font-style: italic; margin-right: 4px}
.price-card .main .per{font-family: var(--fe); font-style: italic; font-size: 15px; color: var(--t2d)}
.price-card .strike{font-family: var(--fu); font-size: 14px; color: var(--t3d); text-decoration: line-through; margin-bottom: 22px}
.price-card .strike em{color: var(--brand-orange); font-style: normal; font-weight: 500; margin-left: 10px; text-decoration: none; letter-spacing: .06em}
.tier{display: flex; justify-content: space-between; align-items: center; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.08); font-family: var(--fu); font-size: 13.5px; color: var(--t2d)}
.tier:last-child{border-bottom: none}
.tier .n{font-family: var(--fd); color: #fff; font-weight: 500; font-size: 17px; letter-spacing: -.01em}
.tier .n small{color: var(--t2d); font-family: var(--fu); font-size: 12px; font-weight: 400; margin-left: 8px; letter-spacing: 0}
.price-card h4{font-family: var(--fu); font-size: 10.5px; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: var(--gold-lt); margin: 32px 0 4px}
.dates-card{background: var(--paper); padding: 44px 40px}
.dates-card h3{font-family: var(--fe); font-size: 26px; font-weight: 400; color: var(--ink); margin-bottom: 6px}
.dates-card .lead{font-family: var(--fe); font-style: italic; color: var(--t2l); font-size: 14.5px; margin-bottom: 26px}
.dates-card .privateline{margin-top: 22px; padding: 20px; background: var(--bone); border-left: 2px solid var(--gold); font-family: var(--fe); font-style: italic; font-size: 14.5px; color: var(--t1l); line-height: 1.6}
.dates-card .privateline strong{font-family: var(--fu); font-style: normal; font-weight: 600; letter-spacing: .06em; color: var(--brand-orange)}
@media(max-width:1000px){
.cost-wrap{grid-template-columns: 1fr}
}
/* REVIEWS */
.rv-top{display: grid; grid-template-columns: auto 1fr auto; gap: 60px; align-items: center; margin-bottom: 56px; padding-bottom: 44px; border-bottom: 1px solid var(--bone-3)}
.rv-score{text-align: center}
.rv-score .n{font-family: var(--fd); font-size: 76px; font-weight: 600; color: var(--ink); line-height: 1; letter-spacing: -.03em}
.rv-score .stars{color: var(--brand-orange); font-size: 16px; letter-spacing: .1em; margin-top: 8px}
.rv-score .of{font-family: var(--fu); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--t3l); margin-top: 8px}
.rv-badges{display: flex; flex-direction: column; gap: 10px; text-align: center}
.rv-badges .b{padding: 14px 20px; background: var(--bone); border-left: 2px solid var(--brand-orange); font-family: var(--fe); font-style: italic; font-size: 13px; color: var(--t1l)}
.rv-badges .b strong{font-family: var(--fu); font-style: normal; font-weight: 600; color: var(--brand-orange); letter-spacing: .12em}
.rv-grid{display: grid; grid-template-columns: repeat(2,1fr); gap: 32px}
.rv-h{display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px}
.rv-h .rv-who{display: flex; align-items: center; gap: 12px}
.rv-h .av{width: 44px; height: 44px; border-radius: 50%; background: var(--ember); color: #fff; display: grid; place-items: center; font-family: var(--fe); font-size: 18px}
.rv-h .rv-who .name{font-family: var(--fe); font-size: 15px; color: var(--ink)}
.rv-h .rv-who .from{font-family: var(--fu); font-size: 11px; color: var(--t3l); letter-spacing: .14em; text-transform: uppercase}
.rv-h .stars{color: var(--brand-orange); font-size: 12px; letter-spacing: .1em}
.rv-card blockquote{font-family: var(--fe); font-size: 16px; font-style: italic; color: var(--t1l); line-height: 1.6; margin-bottom: 14px}
.rv-card .rv-meta{font-family: var(--fu); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--t3l); display: flex; gap: 14px}
.rv-more{text-align: center; margin-top: 40px}
@media(max-width:900px){
.rv-top{grid-template-columns: 1fr; gap: 36px}
.rv-grid{grid-template-columns: 1fr}
}

.faq-q .plus{font-family: var(--fu); font-size: 22px; font-weight: 300; color: var(--brand-orange); transition: transform .3s}
.faq-row.open .faq-q .plus{transform: rotate(45deg)}
.faq-a p{font-family: var(--fu); font-size: 14.5px; color: var(--t2l); line-height: 1.75; padding: 0 0 26px; max-width: 820px}

.cta-bg{position: absolute; inset: 0; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover no-repeat; opacity: .32; filter: grayscale(.4)}
.cta-veil{position: absolute; inset: 0; background: radial-gradient(80% 100% at 50% 50%,transparent 0%,rgba(14,20,17,.75) 60%,rgba(14,20,17,.95) 100%)}
.cta h2{font-family: var(--fe); font-weight: 300; font-size: clamp(2.4rem,5vw,4.4rem); line-height: 1.05; color: #fff; letter-spacing: -.02em; margin: 26px auto 26px; max-width: 820px}
.cta h2 em{font-style: italic; color: var(--gold-lt)}
.cta p{font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--t2d); max-width: 600px; margin: 0 auto 44px; line-height: 1.6}
.cta-btns{display: flex; gap: 18px; justify-content: center; flex-wrap: wrap}
.cta-btns .btn-line-light{padding: 16px 32px}
/* FOOTER (same shell as EBC / homepage) */
.foot-col ul li{margin-bottom: 12px}
.foot-col ul li a{font-family: var(--fu); font-size: 14px; color: var(--t2d); transition: color .2s}
.foot-col ul li a:hover{color: #fff}
.foot-contact ul li{display: flex; align-items: flex-start; gap: 14px; margin-bottom: 16px}
.foot-contact ul li i{color: var(--brand-orange); font-size: 18px; margin-top: 2px}
.foot-contact ul li .lbl{font-family: var(--fu); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--t3d); display: block; margin-bottom: 3px}
.foot-contact ul li .val{font-family: var(--fe); font-size: 14px; color: #fff}
.foot-bottom .legal a:hover{color: var(--t1d)}
@media(max-width:1000px){
.foot-main{grid-template-columns: 1fr 1fr; gap: 40px}
}
/* MOBILE */
@media(max-width:700px){
:root{--pad: 20px}
.sec{padding: 80px 0}
.hero-body{padding: 130px 20px 50px}
.facts{padding: 44px 0}
.subnav a{padding: 8px 12px}
}

@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
:root{--pad: 20px}
.foot-main{grid-template-columns: 1fr; gap: 40px}
}
.phero.def .phero-bg{background-image: linear-gradient(rgba(14,20,17,.4),rgba(14,20,17,.75)),linear-gradient(158deg,#1A2420,#0E1411)}
.def-body{background: var(--bone); padding: 84px 0 110px}
.def-wrap{max-width: 920px; margin: 0 auto; padding: 0 var(--pad)}
.def-article{font-family: var(--fe); font-size: 18.5px; line-height: 1.75; color: var(--t1l)}
.def-article.entry-content{max-width: none}
.def-article p{margin-bottom: 24px}
.def-article p:first-of-type::first-letter{font-family: var(--fe); font-size: 76px; font-weight: 400; float: left; line-height: .85; margin: 6px 12px 0 -4px; color: var(--ember)}
.def-article.entry-content h2{font-family: var(--fe); font-weight: 400; font-size: 38px; line-height: 1.15; letter-spacing: -.015em; margin: 64px 0 20px; color: var(--ink)}
.def-article.entry-content h3{font-family: var(--fe); font-weight: 500; font-size: 24px; margin: 40px 0 14px; color: var(--ink)}
.def-article.entry-content h4{font-family: var(--fe); font-weight: 500; font-size: 20px; line-height: 1.35; margin: 32px 0 12px; color: var(--ink)}
.def-article.entry-content h5{font-family: var(--fe); font-weight: 500; font-size: 17px; line-height: 1.4; margin: 28px 0 10px; color: var(--ink)}
.def-article.entry-content h6{font-family: var(--fu); font-weight: 600; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--t3l); margin: 24px 0 10px}
.def-article.entry-content p{font-family: var(--fe); font-size: 18.5px; line-height: 1.75; color: var(--t1l); margin-bottom: 24px}
.def-article.entry-content ul li, .def-article.entry-content ol li{font-family: var(--fe); font-size: 17.5px; line-height: 1.75}
.def-article ul,.def-article ol{margin: 0 0 28px 24px}
.def-article li{margin-bottom: 10px; font-size: 17.5px}
.def-article strong{color: var(--ink)}
.def-article blockquote{font-family: var(--fe); font-style: italic; font-size: 26px; line-height: 1.45; color: var(--ember-dk); border-left: 2px solid var(--gold); padding: 8px 0 8px 28px; margin: 36px 0}

.eyebrow.d{color: var(--gold-lt)}
.display{font-family: var(--fe); font-weight: 400; line-height: 1.05; letter-spacing: -.02em; font-variation-settings: "opsz" 144}
.display i{font-style: italic; color: var(--ember); font-weight: 400}
.dark .display i{color: var(--gold-lt)}
.btn-primary{background: var(--brand-orange); color: #fff}
.btn-primary:hover{background: var(--brand-orange-dk)}
.btn-ghost-d{background: transparent; color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.28)}
.btn-ghost-d:hover{background: #fff; color: var(--ink)}
.nav.solid{background: rgba(14,20,17,.92); backdrop-filter: blur(28px)}
.phero{position: relative; min-height: 72vh; background: var(--ink); color: #fff; display: flex; align-items: flex-end; padding: 180px 0 80px; overflow: hidden}
  .phero-bg{position: absolute; inset: 0; background-size: cover; background-position: center; filter: brightness(.52) contrast(1.06) saturate(1.02)}
  /* The blog / page heroes carry a `.hero-bg` element (not `.phero-bg`), so they
     pick up the darken here too — keeps the overlay from being the only contrast. */
  .phero .hero-bg, .hero .hero-bg{background-size: cover; background-position: center; filter: brightness(.5) contrast(1.06) saturate(1.02)}
  /* Text-safe overlay: a soft global darken keeps mid-tones calm, then a
     bottom-weighted scrim guarantees the title/lede always read on any image
     colour, while the upper photo stays visible for beauty. */
  .phero-veil{position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 30%, rgba(14,20,17,.18) 0%, rgba(14,20,17,.38) 55%, rgba(14,20,17,.78) 100%), linear-gradient(180deg, rgba(14,20,17,.30) 0%, rgba(14,20,17,.20) 38%, rgba(14,20,17,.94) 100%)}
  .phero h1, .phero .lede, .phero .crumb, .phero .eyebrow{text-shadow: 0 2px 24px rgba(0,0,0,.55), 0 1px 3px rgba(0,0,0,.45)}
.phero-inner{position: relative; z-index: 2; width: 100%}
.phero h1{font-family: var(--fe); font-weight: 400; font-size: clamp(48px,7vw,104px); line-height: 1.02; letter-spacing: -.02em; max-width: 14ch; font-variation-settings: "opsz" 144}
.phero h1 i{font-style: italic; color: var(--gold-lt)}
.phero .lede{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: clamp(17px,1.5vw,20px); color: rgba(244,239,230,.78); max-width: 60ch; margin-top: 28px; line-height: 1.6}
@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
:root{--pad: 20px}
.foot-main{grid-template-columns: 1fr; gap: 40px}
}
.phero.doc .hero-bg{background-image: linear-gradient(rgba(14,20,17,.5),rgba(14,20,17,.8)),linear-gradient(158deg,#1A2420,#0E1411)}
.doc-body{background: var(--bone); padding: 100px 0}
.doc-layout{display: grid; grid-template-columns: 260px 1fr; gap: 64px; align-items: start}
.doc-row{display: grid; grid-template-columns: auto 1fr auto auto auto; gap: 20px; align-items: center; padding: 20px 24px; border-bottom: 1px solid var(--bone-3)}
.doc-row .meta{font-size: 12px; color: var(--t3l); text-align: right}
.doc-row .meta b{display: block; color: var(--t2l)}
@media (max-width: 900px){
  .doc-layout{grid-template-columns: 1fr; gap: 40px}
  .doc-side{position: static}
}
@media (max-width: 760px){
  .doc-row{grid-template-columns: auto 1fr auto; row-gap: 12px; padding: 18px 4px}
  .doc-row .dl{grid-row: 1; grid-column: 3}
  .doc-row .meta{grid-column: 1 / -1; text-align: left; display: flex; gap: 12px}
  .doc-row .meta b{display: inline}
  .doc-row .st{grid-column: 1 / -1; justify-self: start}
}
.doc-side{position: sticky; top: calc(var(--nav-h, 84px) + 26px); align-self: start}
.doc-side h5{font-family: var(--fu); font-size: 10.5px; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: var(--t3l); margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--bone-3)}
.doc-side a{display: flex; justify-content: space-between; align-items: center; padding: 10px 0; font-family: var(--fu); font-size: 13px; color: var(--t2l); border-left: 2px solid transparent; padding-left: 14px; margin-left: -16px; transition: all .2s}
.doc-side a:hover,.doc-side a.on{color: var(--ink); border-left-color: var(--brand-orange)}
.doc-side a .n{font-family: var(--fd); font-size: 11px; color: var(--t3l)}
.doc-sec{margin-bottom: 80px}
.doc-sec h2{font-family: var(--fe); font-size: 36px; font-weight: 400; letter-spacing: -.015em; margin-bottom: 8px; color: var(--ink)}
.doc-sec .lede{font-family: var(--fe); font-style: italic; color: var(--t2l); font-size: 16px; margin-bottom: 32px; max-width: 60ch}
.doc-list{border-top: 1px solid var(--bone-3)}
.doc-row{display: grid; grid-template-columns: 60px 1fr 160px 140px 44px; gap: 24px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--bone-3); transition: background .3s}
.doc-row:hover{background: var(--paper); padding-left: 12px; padding-right: 12px}
.doc-row .ic{width: 44px; height: 52px; background: var(--ink); color: var(--gold-lt); display: grid; place-items: center; font-family: var(--fd); font-size: 10px; letter-spacing: .1em; position: relative}
.doc-row .ic::after{content: ''; position: absolute; top: 0; right: 0; width: 10px; height: 10px; background: var(--bone); clip-path: polygon(0 0,100% 100%,0 100%)}
.doc-row h4{font-family: var(--fe); font-size: 19px; font-weight: 400; color: var(--ink); line-height: 1.3; margin-bottom: 4px}
.doc-row p{font-family: var(--fu); font-size: 12.5px; color: var(--t2l); line-height: 1.5}
.doc-row .meta{font-family: var(--fu); font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--t3l)}
.doc-row .meta b{color: var(--brand-orange); font-weight: 500; display: block; margin-bottom: 2px}
.doc-row .st{font-family: var(--fu); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; padding: 5px 10px; background: rgba(74,91,67,.1); color: var(--moss); text-align: center}
.doc-row .st.exp{background: var(--ember-soft); color: var(--ember-dk)}
.doc-row .dl{width: 44px; height: 44px; background: transparent; border: 1px solid var(--bone-3); display: grid; place-items: center; color: var(--ink); transition: all .3s}
.doc-row .dl:hover{background: var(--brand-orange); color: #fff; border-color: var(--brand-orange)}
.doc-note{background: var(--ink); color: var(--t1d); padding: 26px 24px; margin-top: 48px; display: flex; flex-direction: column; gap: 12px}
.doc-note i.ph{font-size: 26px; color: var(--gold-lt)}
.doc-note h4{font-family: var(--fe); font-size: 19px; color: #fff; margin: 0}
.doc-note p{font-family: var(--fu); font-size: 12.5px; color: rgba(244,239,230,.72); line-height: 1.65; margin: 0}
.doc-note a{color: var(--gold-lt); text-decoration: underline}
@media(max-width:960px){
.doc-layout{grid-template-columns: 1fr}
.doc-side{position: static}
.doc-row{grid-template-columns: 44px 1fr 44px; gap: 16px; row-gap: 14px; padding: 20px 0; align-items: start}
.doc-row .dl{grid-row: 1; grid-column: 3; align-self: start}
.doc-row .meta{grid-column: 1 / -1; text-align: left; display: flex; gap: 14px}
.doc-row .meta b{display: inline; margin: 0}
.doc-row .st{grid-column: 1 / -1; justify-self: start}
}
/* documents: the honest empty state got its own classes (the inline styles are gone from the template) and on small screens the sidebar is a compact chip row of category links, never a tall sticky column. */
.doc-empty{max-width: 640px; margin: 0 auto; text-align: center; padding: 48px 24px; border: 1px solid var(--bone-3); background: #fff}
.doc-empty h2{font-family: var(--fe); font-size: 28px; font-weight: 400; margin: 0 0 12px}
.doc-empty h2 em{color: var(--ember); font-style: italic}
.doc-empty p{font-size: 15px; color: var(--t2l); line-height: 1.7; margin: 0}
@media (max-width: 900px){
  .doc-side{display: flex; flex-wrap: wrap; align-items: center; gap: 8px; row-gap: 10px}
  .doc-side h5{flex: 1 0 100%; margin: 0 0 2px; padding: 0 0 12px; border-bottom: 1px solid var(--bone-3)}
  .doc-side a{border: 1px solid var(--bone-3); border-radius: 999px; padding: 8px 14px; margin-left: 0; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; line-height: 1.2; justify-content: center}
  .doc-side a:hover,.doc-side a.on{border-color: var(--ember); background: var(--ember-soft)}
  .doc-side a .n{margin-left: 8px}
  .doc-side .doc-note{flex: 1 0 100%; padding: 22px 20px; margin-top: 28px}
}
.lede{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: 1.25rem; line-height: 1.55; color: var(--t2d)}
.h-light .lede{color: var(--t2l)}
/* Buttons */
/* Reveal */
.d5{transition-delay: .4s}
/* ════════════════════════════════════════════════════════════════
   NAV  —  ultra-thin, editorial
═══════════════════════════════════════════════════════════════════ */
/* ════════════════════════════════════════════════════════════════
   HERO  —  cinematic editorial split
   Concept: A vertical magazine spread. Massive italic serif headline
   on the left over a darkened mountain photograph; a "field journal"
   index card on the right with three signature itineraries. A
   numeric counter strip across the bottom replaces noisy filters.
═══════════════════════════════════════════════════════════════════ */
@keyframes heroZoom{
to{transform:scale(1);}
}
/* Side rails (vertical text — editorial signature) */
/* Hero body */
.hero-eyebrow{font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .4em; text-transform: uppercase; color: rgba(244,239,230,.7); display: flex; align-items: center; gap: 18px; margin-bottom: 34px}
.hero-eyebrow::before{content: ''; width: 48px; height: 1px; background: var(--ember)}
.hero-eyebrow b{color: var(--ember); font-weight: 600}
.hero-title .line{display: block; overflow: hidden}
.hero-title .word{display: inline-block}
.hero-ctas .ghost .play{width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; transition: all .3s}
.hero-ctas .ghost:hover .play{background: #fff; color: var(--ink); border-color: #fff}
/* Right column: signature journeys card  */
.signature{background: rgba(14,20,17,.55); backdrop-filter: blur(22px) saturate(130%); -webkit-backdrop-filter: blur(22px) saturate(130%); border: 1px solid rgba(255,255,255,.1); padding: 36px 34px; position: relative}
.signature::before{content: ''; position: absolute; top: -1px; left: -1px; width: 32px; height: 32px; border-top: 1px solid var(--gold-lt); border-left: 1px solid var(--gold-lt)}
.signature::after{content: ''; position: absolute; bottom: -1px; right: -1px; width: 32px; height: 32px; border-bottom: 1px solid var(--gold-lt); border-right: 1px solid var(--gold-lt)}
.sig-list{display: flex; flex-direction: column}
.sig-item{display: grid; grid-template-columns: 48px 1fr auto; gap: 16px; align-items: center; padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.06); cursor: pointer; transition: transform .3s var(--ex)}
.sig-item:last-child{border-bottom: none}
.sig-item:hover{transform: translateX(6px)}
.sig-no{font-family: var(--fe); font-style: italic; font-size: 24px; color: var(--ember); font-weight: 400}
.sig-name{font-family: var(--fe); font-size: 18px; font-weight: 500; color: #fff; line-height: 1.2; margin-bottom: 4px}
.sig-meta{font-family: var(--fu); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: rgba(244,239,230,.5)}
.sig-arr{width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(255,255,255,.18); display: grid; place-items: center; color: rgba(244,239,230,.7); transition: all .3s}
.sig-item:hover .sig-arr{background: var(--ember); border-color: var(--ember); color: #fff}
.sig-foot{margin-top: 24px; display: flex; align-items: center; justify-content: space-between; font-family: var(--fu); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: rgba(244,239,230,.55)}
.sig-foot a{color: var(--gold-lt); transition: color .2s}
.sig-foot a:hover{color: var(--ember)}
/* Bottom marquee — kinetic stats replacing search bar */
.hmq:first-child{padding-left: 0}
.hmq:last-child{border-right: none; padding-right: 0}
.hmq-n{font-family: var(--fd); font-size: 2.6rem; font-weight: 500; color: #fff; line-height: 1; letter-spacing: -.02em; display: flex; align-items: baseline; gap: 4px}
.hmq-n sup{font-family: var(--fe); font-style: italic; font-size: 1rem; color: var(--gold-lt); font-weight: 400}
.hmq-l{font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: rgba(244,239,230,.55)}
@media(max-width:1100px){
.hero-body{grid-template-columns: 1fr; padding: 140px 32px 0; gap: 32px}
.hero-rail{display: none !important}
.hero-marquee{padding: 28px 32px 32px !important; gap: 24px !important}
.signature{display: none}
}
/* ════════════════════════════════════════════════════════════════
   TRUST RIBBON  —  thin warm-bone strip
═══════════════════════════════════════════════════════════════════ */
.ribbon{background: var(--bone); color: var(--t2l); border-top: 1px solid var(--bone-3); border-bottom: 1px solid var(--bone-3)}
.ribbon-row{display: flex; align-items: center; justify-content: space-between; padding: 22px 0; gap: 32px; flex-wrap: wrap}
.ribbon-item{display: flex; align-items: center; gap: 12px; font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--t2l)}
.ribbon-item i.ph{font-size: 18px; color: var(--ember)}
/* ════════════════════════════════════════════════════════════════
   SECTION — INVITATION (intro / about teaser)
═══════════════════════════════════════════════════════════════════ */
.invite{background: var(--paper); color: var(--t1l); padding: 140px 0; position: relative}
.invite-grid{display: grid; grid-template-columns: .9fr 1.3fr; gap: 96px; align-items: start}
.invite-side .eyebrow{margin-bottom: 30px; color: var(--ember)}
.invite-side .vert{writing-mode: vertical-rl; transform: rotate(180deg); font-family: var(--fu); font-size: 10px; letter-spacing: .4em; text-transform: uppercase; color: var(--t3l); position: absolute; left: 24px; top: 50%}
.invite-h{font-family: var(--fe); font-weight: 300; color: var(--t1l); font-size: clamp(2.4rem,4.6vw,4rem); line-height: 1.05; letter-spacing: -.02em; font-variation-settings: "opsz" 144; margin-bottom: 34px}
.invite-h em{font-style: italic; color: var(--ember); font-weight: 300}
.invite-h sup{font-family: var(--fu); font-size: 14px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); vertical-align: super; margin-left: 6px}
.invite-body p{font-size: 16px; color: var(--t2l); line-height: 1.85; margin-bottom: 20px; font-weight: 300}
.invite-body p:first-of-type::first-letter{font-family: var(--fe); font-size: 4.2rem; font-style: italic; font-weight: 300; float: left; line-height: .85; padding: 8px 14px 0 0; color: var(--ember)}
.invite-sig{display: flex; align-items: center; gap: 18px; margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--bone-3)}
.invite-sig-name{font-family: var(--fe); font-style: italic; font-size: 22px; color: var(--t1l); font-weight: 400}
.invite-sig-role{font-family: var(--fu); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--t3l); margin-top: 4px}
/* ════════════════════════════════════════════════════════════════
   SECTION — JOURNEYS  (cards, editorial layout)
═══════════════════════════════════════════════════════════════════ */
.journeys{background: var(--ink); padding: 140px 0 160px}
.h-light .sec-h{color: var(--t1l)}
.h-light .sec-h em{color: var(--ember)}
.h-light .sec-head .right p{color: var(--t2l)}
.journey-grid{display: grid; grid-template-columns: repeat(3,1fr); gap: 28px}
.jcard{position: relative; background: var(--ink-2); overflow: hidden; cursor: pointer; transition: transform .6s var(--ex)}
.jcard:hover{transform: translateY(-6px)}
.jcard-img::after{content: ''; position: absolute; inset: 0; background: linear-gradient(to top,rgba(14,20,17,.95) 0%,rgba(14,20,17,.3) 45%,transparent 70%)}
.jcard-img > div{position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 1.4s var(--ex)}
.jcard:hover .jcard-img > div{transform: scale(1.08)}
.jcard-tag{position: absolute; top: 24px; left: 24px; z-index: 2; font-family: var(--fu); font-size: 10px; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; color: #fff; padding: 6px 12px; background: rgba(184,68,42,.9); backdrop-filter: blur(8px)}
.jcard-tag.gold{background: rgba(182,150,88,.92); color: var(--ink)}
.jcard-tag.pine{background: rgba(31,46,37,.88)}
.jcard-num{position: absolute; top: 24px; right: 24px; z-index: 2; font-family: var(--fe); font-style: italic; font-weight: 300; font-size: 32px; color: rgba(255,255,255,.55); line-height: 1}
.jcard-body{position: absolute; bottom: 0; left: 0; right: 0; padding: 32px; z-index: 2}
.jcard-region{font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; color: var(--gold-lt); margin-bottom: 12px; display: flex; align-items: center; gap: 10px}
.jcard-region::before{content: ''; width: 18px; height: 1px; background: var(--gold-lt)}
.jcard-meta{display: flex; gap: 24px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.14)}
.jcard-meta div{display: flex; flex-direction: column; gap: 4px}
.jcard-meta dt{font-family: var(--fu); font-size: 9.5px; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.5)}
.jcard-meta dd{font-family: var(--fe); font-style: italic; font-size: 14px; color: #fff; font-weight: 400}
.jcard-cta{position: absolute; bottom: 32px; right: 32px; z-index: 3; width: 48px; height: 48px; border-radius: 50%; background: #fff; color: var(--ink); display: grid; place-items: center; transition: all .35s var(--ex)}
.jcard:hover .jcard-cta{background: var(--ember); color: #fff; transform: rotate(-45deg)}
.journey-foot{display: flex; align-items: center; justify-content: space-between; margin-top: 64px; padding-top: 40px; border-top: 1px solid rgba(255,255,255,.08); flex-wrap: wrap; gap: 24px}
.journey-foot p{font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--t2d); font-weight: 300}
/* ════════════════════════════════════════════════════════════════
   SECTION — ATLAS  (regions, asymmetric grid)
═══════════════════════════════════════════════════════════════════ */
.atlas{background: var(--bone); padding: 140px 0; color: var(--t1l)}
.atlas-grid{display: grid; grid-template-columns: 1.6fr 1fr 1fr; grid-template-rows: 280px 280px; gap: 18px}
.region{position: relative; overflow: hidden; cursor: pointer; background: var(--ink)}
.region.lg{grid-row: span 2}
.region:hover .region-img{transform: scale(1.07)}
.region-veil{position: absolute; inset: 0; background: linear-gradient(to top,rgba(14,20,17,.88) 0%,rgba(14,20,17,.25) 50%,transparent 75%)}
.region-body{position: absolute; inset: auto 0 0 0; padding: 28px 30px; color: #fff}
.region-no{font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--gold-lt); margin-bottom: 8px}
.region-name{font-family: var(--fe); font-size: 1.5rem; font-weight: 400; line-height: 1.1; margin-bottom: 6px}
.region.lg .region-name{font-size: 2.4rem}
.region-meta{font-family: var(--fu); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: rgba(244,239,230,.7)}
.region-arr{position: absolute; top: 24px; right: 24px; width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); color: #fff; display: grid; place-items: center; transition: all .3s}
.region:hover .region-arr{background: #fff; color: var(--ink)}
/* ════════════════════════════════════════════════════════════════
   SECTION — PHILOSOPHY (why us / luxury statement)
═══════════════════════════════════════════════════════════════════ */
.philo-watermark{position: absolute; top: -20px; left: -20px; font-family: var(--fe); font-style: italic; font-size: 18rem; font-weight: 300; color: rgba(255,255,255,.025); line-height: 1; pointer-events: none; font-variation-settings: "opsz" 144}
.philo-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 96px; position: relative}
.philo-a{position: absolute; top: 0; left: 0; width: 78%; height: 72%; overflow: hidden; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover}
.philo-b{position: absolute; bottom: 0; right: 0; width: 56%; height: 50%; overflow: hidden; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover; border: 6px solid var(--ink)}
.philo-stamp{position: absolute; top: 38%; right: 8%; width: 140px; height: 140px; border: 1px solid var(--gold-lt); border-radius: 50%; display: grid; place-items: center; text-align: center; background: var(--ink); color: var(--gold-lt); transform: rotate(-8deg)}
.philo-stamp-n{font-family: var(--fe); font-style: italic; font-size: 2.6rem; font-weight: 300; line-height: 1}
.philo-stamp-t{font-family: var(--fu); font-size: 9px; letter-spacing: .28em; text-transform: uppercase; margin-top: 6px; color: rgba(214,185,126,.8)}
.philo-h em{font-style: italic; color: var(--gold-lt)}
.philo-pillars{display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: rgba(255,255,255,.06); margin-bottom: 40px}
.pillar-n{font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--ember); margin-bottom: 14px}
.pillar h4{font-family: var(--fe); font-size: 18px; font-weight: 500; color: #fff; margin-bottom: 8px}
/* ════════════════════════════════════════════════════════════════
   SECTION — MOMENTS  (short / cultural experiences)
═══════════════════════════════════════════════════════════════════ */
.moments-head{text-align: center; margin-bottom: 80px; max-width: 680px; margin-left: auto; margin-right: auto}
.moments-head .eyebrow{margin-bottom: 24px}
.moments-head .sec-h{margin-bottom: 24px}
.moments-head p{font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--t2l); line-height: 1.6; font-weight: 300}
.moments-grid{display: grid; grid-template-columns: repeat(4,1fr); gap: 20px}
.moment:hover{transform: translateY(-6px)}
.moment-img > div{position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 1s var(--ex)}
.moment:hover .moment-img > div{transform: scale(1.06)}
.moment-cat::before{content: ''; width: 18px; height: 1px; background: var(--ember)}
/* ════════════════════════════════════════════════════════════════
   SECTION — DISPATCH (testimonial, big editorial pull-quote)
═══════════════════════════════════════════════════════════════════ */
.dispatch::before{content: ''; position: absolute; inset: 0; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover; opacity: .18; filter: saturate(.5)}
.dispatch::after{content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom,rgba(14,20,17,.9),rgba(14,20,17,.7))}
.dispatch .container{position: relative; z-index: 2; text-align: center; max-width: 1000px}
.dispatch .eyebrow::after{content: ''; width: 28px; height: 1px; background: currentColor; opacity: .9}
.dot{width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.2); cursor: pointer; transition: all .3s}
.dot.on{background: var(--ember); width: 24px; border-radius: 3px}
/* ════════════════════════════════════════════════════════════════
   SECTION — CONSERVATION (the brand promise — soft sell)
═══════════════════════════════════════════════════════════════════ */
.conserve p{font-family: var(--fu); font-size: 14.5px; font-weight: 300; line-height: 1.8; color: rgba(244,239,230,.85); margin-bottom: 24px}
/* ════════════════════════════════════════════════════════════════
   SECTION — JOURNAL  (editorial blog)
═══════════════════════════════════════════════════════════════════ */
.jl-card.feat .jl-img{height: 480px}
.jl-img > div{position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 1s var(--ex)}
.jl-card:hover .jl-img > div{transform: scale(1.05)}
.jl-card:not(.feat) .jl-title{font-size: 1.25rem}
/* ════════════════════════════════════════════════════════════════
   SECTION — INVITATION CTA
═══════════════════════════════════════════════════════════════════ */
.invite-cta::before{content: ''; position: absolute; inset: 0; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover; opacity: .25}
.invite-cta::after{content: ''; position: absolute; inset: 0; background: linear-gradient(135deg,rgba(14,20,17,.95) 0%,rgba(14,20,17,.7) 100%)}
.invite-cta .container{position: relative; z-index: 2}
.cta-actions .btn{justify-content: center; width: 100%}
.cta-note i.ph{color: var(--gold-lt)}
/* ════════════════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════════════════ */
/* ════════════════════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════════════════════ */
@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.invite-grid{grid-template-columns: 1fr; gap: 48px}
.journey-grid,.moments-grid{grid-template-columns: repeat(2,1fr)}
.atlas-grid{grid-template-columns: 1fr 1fr; grid-template-rows: 240px 240px 240px}
.atlas-grid .region.lg{grid-column: span 2; grid-row: span 1}
.philo-grid{grid-template-columns: 1fr; gap: 64px}
.philo-vis{height: 480px}
.conserve-grid{grid-template-columns: 1fr; text-align: center}
.conserve-stat{border: none; border-top: 1px solid rgba(255,255,255,.12); border-bottom: 1px solid rgba(255,255,255,.12); padding: 32px 0}
.journal-grid{grid-template-columns: 1fr 1fr}
.cta-grid{grid-template-columns: 1fr; gap: 48px}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
.hero-marquee{grid-template-columns: 1fr 1fr !important; gap: 24px !important; padding: 24px 24px 32px !important}
.hmq{padding: 0 !important; border: none !important}
.sec-head{grid-template-columns: 1fr}
.sec-head .right{align-items: flex-start}
.sec-head .right p{text-align: left}
.journey-grid,.moments-grid,.journal-grid{grid-template-columns: 1fr}
.atlas-grid{grid-template-columns: 1fr; grid-template-rows: repeat(5,220px)}
.atlas-grid .region.lg{grid-column: span 1}
.philo-pillars{grid-template-columns: 1fr}
.foot-main{grid-template-columns: 1fr; gap: 40px}
}

/* ═══════════ TOKENS (brand-aligned, from ) ═══════════ */
/* ═══════════ NAV (identical to homepage / EBC page) ═══════════ */
#nav{position: fixed; top: 0; left: 0; right: 0; z-index: 200; padding: 22px 0; transition: all .5s var(--ex); background: transparent}
#nav.scrolled,
#nav.menu-open{background: rgba(14,20,17,.92); backdrop-filter: blur(16px) saturate(160%); -webkit-backdrop-filter: blur(16px) saturate(160%); padding: 14px 0; border-bottom: 1px solid rgba(244,239,230,.06)}
.nav-inner{display: flex; align-items: center; justify-content: space-between; gap: 36px}
/* Logo lockup — Helvetica for the wordmark only, per brand guideline */
.logo{display: flex; align-items: center; gap: 12px}
.logo-mark{width: 38px; height: 38px; border: 1.5px solid var(--t1d); display: grid; place-items: center; flex-shrink: 0; position: relative}
.logo-mark svg{width: 22px; height: 22px}
.logo-word{font-family: 'Helvetica Neue','Helvetica','Arial Narrow',sans-serif; font-weight: 800; font-stretch: condensed; font-size: 10.5px; letter-spacing: .14em; line-height: 1.05; color: var(--t1d); text-transform: uppercase}
.logo-word span{display: block}
/* Nav items */
.nav-menu{display: flex; align-items: center; gap: 6px}
.nav-item{position: relative}
.nav-link{display: inline-flex; align-items: center; gap: 6px; padding: 10px 16px; font-size: 12.5px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--t1d); opacity: .85; transition: opacity .3s var(--ex),color .3s var(--ex); cursor: pointer}
.nav-link:hover,.nav-item.active .nav-link{opacity: 1; color: var(--brand-orange)}
.nav-link .caret{font-size: 10px; transition: transform .4s var(--ex); opacity: .6}
.nav-item.active .nav-link .caret{transform: rotate(180deg); opacity: 1}
/* ═══════════ MEGA MENU PANEL ═══════════ */
.mega-inner{max-width: var(--maxw); margin: 0 auto; padding: 56px var(--pad) 48px; display: grid; grid-template-columns: 1.15fr 1.15fr 1.4fr; gap: 64px; min-height: 520px}
.mega-col h4{font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .32em; text-transform: uppercase; color: var(--brand-orange); padding-bottom: 14px; border-bottom: 1px solid var(--bone-3); margin-bottom: 18px; display: flex; align-items: center; justify-content: space-between}
.mega-col h4 .count{font-family: var(--fd); color: var(--t3l); letter-spacing: .05em; font-weight: 500}
.mega-list{display: flex; flex-direction: column; gap: 2px}
.mega-list a{display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 12px 8px; border-radius: 2px; transition: background .3s var(--ex),padding .3s var(--ex)}
.mega-list a:hover{background: var(--bone-2); padding-left: 14px}
.mega-list a .ico{width: 32px; height: 32px; border: 1px solid var(--bone-3); display: grid; place-items: center; color: var(--ember); font-size: 16px; transition: border-color .3s var(--ex),background .3s var(--ex),color .3s var(--ex)}
.mega-list a:hover .ico{border-color: var(--brand-orange); background: var(--brand-orange); color: #fff}
.mega-list a .txt{display: flex; flex-direction: column; gap: 2px}
.mega-list a .title{font-family: var(--fe); font-size: 19px; font-weight: 400; letter-spacing: -.01em; color: var(--t1l)}
.mega-list a .sub{font-size: 12px; color: var(--t3l); letter-spacing: .02em}
.mega-list a .arrow{font-size: 14px; color: var(--t3l); opacity: 0; transform: translateX(-6px); transition: all .3s var(--ex)}
.mega-list a:hover .arrow{opacity: 1; transform: translateX(0); color: var(--brand-orange)}
/* Featured card (right column) */
.mega-feature{position: relative; display: flex; flex-direction: column; gap: 20px}
.mega-feature h4{font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .32em; text-transform: uppercase; color: var(--brand-orange); padding-bottom: 14px; border-bottom: 1px solid var(--bone-3); margin: 0}
.feature-card{position: relative; overflow: hidden; flex: 1; min-height: 380px; background: #000}
.feature-card img{width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; transition: transform 1.2s var(--ex)}
.feature-card:hover img{transform: scale(1.04)}
.feature-card::after{content: ''; position: absolute; inset: 0; background: linear-gradient(180deg,rgba(14,20,17,.05) 0%,rgba(14,20,17,.75) 100%)}
.feature-body{position: absolute; left: 0; right: 0; bottom: 0; padding: 32px; color: #fff; z-index: 2}
.feature-body .badge{display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; background: var(--brand-orange); color: #fff; font-size: 10.5px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; margin-bottom: 14px}
.feature-body h3{font-family: var(--fe); font-weight: 400; font-size: 34px; line-height: 1.05; letter-spacing: -.02em; margin-bottom: 12px}
.feature-body h3 em{font-style: italic; color: var(--gold-lt); font-weight: 300}
.feature-body .meta{display: flex; gap: 22px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: rgba(244,239,230,.85); padding-top: 14px; border-top: 1px solid rgba(244,239,230,.18)}
.feature-body .meta span{display: inline-flex; align-items: center; gap: 6px}
.feature-body .meta i{color: var(--gold-lt)}
.feature-body .cta-line{margin-top: 20px; display: inline-flex; align-items: center; gap: 10px; font-size: 11.5px; letter-spacing: .24em; text-transform: uppercase; font-weight: 600; color: #fff; padding-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,.4)}
/* Mega footer strip */
.mega-footer{border-top: 1px solid var(--bone-3); background: var(--bone)}
.mega-footer-inner{max-width: var(--maxw); margin: 0 auto; padding: 22px var(--pad); display: flex; align-items: center; justify-content: space-between; gap: 24px; font-size: 12px; color: var(--t2l)}
.mega-footer-inner .quick{display: flex; gap: 28px; align-items: center}
.mega-footer-inner .quick a{display: inline-flex; align-items: center; gap: 8px; letter-spacing: .14em; text-transform: uppercase; font-size: 11px; font-weight: 500; color: var(--t1l); transition: color .3s var(--ex)}
.mega-footer-inner .quick a:hover{color: var(--brand-orange)}
.mega-footer-inner .quick i{color: var(--ember)}
.mega-footer-inner .callus{display: inline-flex; align-items: center; gap: 12px; font-family: var(--fd); letter-spacing: .02em}
.mega-footer-inner .callus strong{color: var(--t1l); font-weight: 600}
/* Backdrop dimmer */
.mega-backdrop{position: fixed; inset: 0; background: rgba(14,20,17,.4); backdrop-filter: blur(2px); opacity: 0; visibility: hidden; pointer-events: none; z-index: 180; transition: opacity .45s var(--ex),visibility 0s linear .45s}
.mega-backdrop.open{opacity: 1; visibility: visible; pointer-events: auto; transition: opacity .45s var(--ex),visibility 0s}
/* ═══════════ RESPONSIVE ═══════════ */
@media (max-width:1100px){
.mega-inner{grid-template-columns: 1fr 1fr; gap: 48px}
.mega-feature{grid-column: 1/-1}
.feature-card{min-height: 280px}
}
@media (max-width:820px){
:root{--pad: 20px}
.nav-menu{display: none}
.mega-inner{grid-template-columns: 1fr; gap: 32px; padding: 40px var(--pad) 32px; min-height: auto}
.mega-footer-inner{flex-direction: column; align-items: flex-start; gap: 14px}
.mega-footer-inner .quick{flex-wrap: wrap; gap: 18px}
}

/* TOKENS — identical to homepage v4 */
/* atoms */
.d1{transition-delay: .08s}
.d2{transition-delay: .16s}
.d3{transition-delay: .24s}
.d4{transition-delay: .32s}
/* corner-brackets utility */
.brackets{position: relative}
.brackets::before,.brackets::after{content: ''; position: absolute; width: 22px; height: 22px; border-color: var(--gold-lt); pointer-events: none}
.brackets::before{top: -1px; left: -1px; border-top: 1px solid; border-left: 1px solid}
.brackets::after{bottom: -1px; right: -1px; border-bottom: 1px solid; border-right: 1px solid}
/* NAV — same as homepage */

@keyframes heroZoom{
to{transform:scale(1);}
}
.hero-grain{position: absolute; inset: 0; opacity: .07; mix-blend-mode: overlay; pointer-events: none; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/></svg>")}
.hero-rail{position: absolute; top: 0; bottom: 0; width: 84px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 120px 0 32px; z-index: 5}
.hero-rail.left{left: 0; border-right: 1px solid rgba(255,255,255,.07)}
.hero-rail.right{right: 0; border-left: 1px solid rgba(255,255,255,.07)}
.rail-text{writing-mode: vertical-rl; transform: rotate(180deg); font-family: var(--fu); font-size: 10.5px; font-weight: 500; letter-spacing: .42em; text-transform: uppercase; color: rgba(244,239,230,.55)}
.rail-dot{width: 5px; height: 5px; border-radius: 50%; background: var(--ember); box-shadow: 0 0 0 6px rgba(184,68,42,.18)}
.rail-num{font-family: var(--fe); font-style: italic; font-size: 14px; color: rgba(244,239,230,.6)}
.hero-title em::after{content: ''; position: absolute; left: 0; right: 0; bottom: .08em; height: 1px; background: linear-gradient(to right,transparent,var(--gold-lt) 30%,var(--gold-lt) 70%,transparent); opacity: .5}
.hero-title strong{font-weight: 600; font-style: normal; color: #fff; display: block}
.hero-ctas{display: flex; align-items: center; gap: 20px; flex-wrap: wrap}
.hero-ctas .ghost{display: inline-flex; align-items: center; gap: 14px; font-family: var(--fu); font-size: 13px; font-weight: 400; color: rgba(244,239,230,.85); letter-spacing: .04em; cursor: pointer}
.hero-ctas .ghost .ico{width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; transition: all .3s}
.hero-ctas .ghost:hover .ico{background: #fff; color: var(--ink); border-color: #fff}
/* hero side card — at-a-glance */
.glance{background: rgba(14,20,17,.55); backdrop-filter: blur(22px) saturate(130%); -webkit-backdrop-filter: blur(22px) saturate(130%); border: 1px solid rgba(255,255,255,.1); padding: 36px 32px; position: relative}
.glance-head{display: flex; align-items: center; justify-content: space-between; padding-bottom: 18px; margin-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.08)}
.glance-title{font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--gold-lt); font-weight: 400}
.glance-no{font-family: var(--fu); font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: rgba(244,239,230,.4)}
.glance-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(255,255,255,.08)}
.glance-cell{background: rgba(14,20,17,.4); padding: 18px 16px}
.glance-cell .glance-l{display: flex; align-items: center; gap: 7px}
.glance-cell .glance-l i.ph{font-size: 14px; color: var(--gold-lt); flex-shrink: 0}
.glance-l{font-family: var(--fu); font-size: 9.5px; letter-spacing: .3em; text-transform: uppercase; color: rgba(244,239,230,.5); margin-bottom: 6px}
.glance-v{font-family: var(--fd); font-size: 22px; font-weight: 500; color: #fff; letter-spacing: -.01em}
.glance-v small{font-family: var(--fe); font-style: italic; font-size: 12px; color: var(--gold-lt); font-weight: 400; margin-left: 4px}
.glance-price{padding: 20px 0 4px; display: flex; align-items: baseline; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.08); margin-top: 18px}
.glance-price .from{font-family: var(--fu); font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: rgba(244,239,230,.5)}
.glance-price .amt{font-family: var(--fe); font-size: 28px; color: #fff; font-weight: 400}
.glance-price .amt sup{font-size: 14px; color: var(--gold-lt); font-style: italic}
.glance-price .per{font-family: var(--fe); font-style: italic; font-size: 13px; color: rgba(244,239,230,.55)}
/* bottom meta strip */
.hero-strip{position: relative; z-index: 5; margin-top: auto; padding: 30px 132px 34px; display: grid; grid-template-columns: repeat(6,1fr); gap: 0; border-top: 1px solid rgba(255,255,255,.08)}
.hstrip{padding: 0 24px; border-right: 1px solid rgba(255,255,255,.06); display: flex; flex-direction: column; gap: 6px}
.hstrip:first-child{padding-left: 0}
.hstrip:last-child{border-right: none; padding-right: 0}
.hstrip .l{font-family: var(--fu); font-size: 10px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.55)}
.hstrip .v{font-family: var(--fe); font-size: 17px; color: #fff; font-weight: 400; line-height: 1.2}
.hstrip .v em{font-style: italic; color: var(--gold-lt)}
@media(max-width:1100px){
.hero-body{grid-template-columns: 1fr; padding: 140px 32px 0; gap: 32px}
.hero-rail{display: none !important}
.hero-strip{padding: 24px 32px 28px; grid-template-columns: repeat(3,1fr)}
.hstrip{padding: 14px 16px; border-right: 1px solid rgba(255,255,255,.06)}
}
/* STICKY SUB-NAV */
.subnav a::after{content: ''; position: absolute; left: 18px; right: 18px; bottom: 0; height: 1px; background: var(--ember); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ex)}
.subnav .sub-cta::after{display: none}
/* SECTION HEAD */
.sec.alt{background: var(--bone)}
.sec-head .right{display: flex; flex-direction: column; gap: 18px; align-items: flex-start}
.sec-head .right p{font-family: var(--fe); font-style: italic; font-size: 16px; color: var(--t2l); max-width: 440px; line-height: 1.6; font-weight: 300; text-align: right}
.dark .sec-head .right p{color: var(--t2d)}
/* FIELD BRIEF (quick facts row) */
.brief{background: var(--bone); padding: 70px 0; border-top: 1px solid var(--bone-3); border-bottom: 1px solid var(--bone-3)}
.brief-row{display: grid; grid-template-columns: repeat(6,1fr); gap: 0}
.brief-cell{padding: 6px 28px; border-right: 1px solid var(--bone-3); display: flex; flex-direction: column; gap: 10px; position: relative}
.brief-cell:first-child{padding-left: 0}
.brief-cell:last-child{border-right: none; padding-right: 0}
.brief-cell i.ph{font-size: 22px; color: var(--ember)}
.brief-l{font-family: var(--fu); font-size: 10px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--t3l)}
.brief-v{font-family: var(--fe); font-size: 18px; font-weight: 500; color: var(--ink); line-height: 1.2}
.brief-v em{font-style: italic; color: var(--ember); font-weight: 400}
@media(max-width:900px){
.brief-row{grid-template-columns: repeat(2,1fr); gap: 24px}
.brief-cell{padding: 0; border: none}
}
/* OVERVIEW */
.over-grid{display: grid; grid-template-columns: 1.4fr .9fr; gap: 96px; align-items: start}
.over-body p{font-family: var(--fu); font-size: 16.5px; line-height: 1.85; color: var(--t2l); font-weight: 300; margin-bottom: 22px}
.over-body p:first-child::first-letter{font-family: var(--fe); font-style: italic; font-weight: 500; color: var(--ember); font-size: 5.2rem; float: left; line-height: .85; margin: 8px 16px 0 0}
.over-body .pull{font-family: var(--fe); font-style: italic; font-size: 24px; font-weight: 300; color: var(--ink); line-height: 1.4; padding: 24px 0 24px 28px; border-left: 2px solid var(--ember); margin: 32px 0}
.over-side{position: relative; top: 170px; background: #fff; border: 1px solid var(--bone-3); padding: 36px 32px}
.over-side h4{font-family: var(--fu); font-size: 11px; letter-spacing: .28em; text-transform: uppercase; color: var(--ember); margin-bottom: 22px; font-weight: 600}
.over-side ul{display: flex; flex-direction: column; gap: 14px}
.over-side li{display: flex; align-items: flex-start; gap: 12px; font-family: var(--fu); font-size: 14px; color: var(--t2l); line-height: 1.55}
.over-side li i.ph{color: var(--gold); font-size: 18px; margin-top: 2px; flex-shrink: 0}
.over-side li b{color: var(--ink); font-weight: 600}
.over-side .more{margin-top: 26px; padding-top: 24px; border-top: 1px solid var(--bone-3)}
/* MOMENTS — horizontal scroll */
.moments-scroll{display: flex; gap: 24px; overflow-x: auto; padding: 0 var(--pad) 32px; scroll-snap-type: x mandatory; scrollbar-width: thin}
.moments-scroll::-webkit-scrollbar{height: 3px}
.moments-scroll::-webkit-scrollbar-thumb{background: var(--ember)}
.moment:hover .moment-img{transform: scale(1.06)}
.moment-veil{position: absolute; inset: 0; background: linear-gradient(to top,rgba(14,20,17,.92) 0%,rgba(14,20,17,.2) 50%,transparent 100%)}
.moment-num{position: absolute; top: 20px; left: 24px; font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--gold-lt)}
.moment-loc{font-family: var(--fu); font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: var(--gold-lt); margin-bottom: 8px}
.moment-name em{font-style: italic; color: var(--gold-lt)}
.moment-meta{font-family: var(--fe); font-style: italic; font-size: 13px; color: rgba(244,239,230,.65)}
/* ITINERARY */
.itin-list{max-width: 980px; margin: 0 auto; border-top: 1px solid var(--bone-3)}
.itin-row{border-bottom: 1px solid var(--bone-3)}
.itin-head{display: grid; grid-template-columns: 90px 1fr 200px 60px; gap: 32px; align-items: center; padding: 28px 8px; cursor: pointer; transition: background .25s}
.itin-head:hover{background: rgba(184,68,42,.04)}
.itin-day{font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--ember); letter-spacing: .04em}
.itin-day b{display: block; font-family: var(--fd); font-style: normal; font-size: 28px; color: var(--ink); font-weight: 500; margin-top: 2px}
.itin-name{font-family: var(--fe); font-size: 20px; font-weight: 500; color: var(--ink); line-height: 1.3}
.itin-name span{display: block; font-family: var(--fu); font-style: normal; font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--t3l); margin-top: 6px}
.itin-meta{display: flex; flex-direction: column; gap: 4px; font-family: var(--fu); font-size: 12px; color: var(--t2l)}
.itin-meta i.ph{color: var(--gold); font-size: 14px; margin-right: 6px}
.itin-toggle{width: 42px; height: 42px; border: 1px solid var(--bone-3); border-radius: 50%; display: grid; place-items: center; font-family: var(--fe); font-size: 22px; color: var(--ember); transition: all .3s var(--ex); justify-self: end}
.itin-body{max-height: 0; overflow: hidden; transition: max-height .5s var(--ex)}
.itin-body-inner{padding: 0 8px 36px 122px; display: grid; grid-template-columns: 1.6fr 1fr; gap: 48px}
.itin-body-inner p{font-family: var(--fu); font-size: 15px; color: var(--t2l); line-height: 1.75; font-weight: 300}
.itin-facts{display: flex; flex-direction: column; gap: 12px; font-family: var(--fu); font-size: 13px}
.itin-facts div{display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px dashed var(--bone-3)}
.itin-facts dt{color: var(--t3l); letter-spacing: .12em; text-transform: uppercase; font-size: 10.5px; font-weight: 600}
.itin-facts dd{font-family: var(--fe); font-size: 14px; color: var(--ink)}
@media(max-width:780px){
.itin-head{grid-template-columns: 80px 1fr 44px; gap: 14px}
.itin-meta{display: none}
.itin-body-inner{padding: 0 8px 28px; grid-template-columns: 1fr; gap: 20px}
}
/* ROUTE & ALTITUDE */
.route-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 48px}
.route-card,.alt-card{background: #fff; border: 1px solid var(--bone-3); padding: 36px; position: relative; min-height: 520px; display: flex; flex-direction: column}
.route-card h4,.alt-card h4{font-family: var(--fe); font-style: italic; font-size: 22px; font-weight: 400; color: var(--ink); margin-bottom: 8px}
.route-card h4 em,.alt-card h4 em{color: var(--ember)}
.route-card h4 p,.alt-card h4 p{margin: 0; font: inherit}
.route-card .sub,.alt-card .sub{font-family: var(--fu); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--t3l); margin-bottom: 28px}
.route-img,.alt-img{flex: 1; width: 100%; height: 380px; object-fit: contain; object-position: center}
/* Self-contained heading — immune to the cross-section .sec-head cascade so
   the title always sits LEFT, the note RIGHT, and the <em> stays ember. */
#route .sec-head{display: grid; grid-template-columns: 1.1fr .9fr; gap: 64px; align-items: end; margin-bottom: 72px}
#route .sec-h{font-family: var(--fe); font-weight: 300; font-size: clamp(2.4rem,4.6vw,4rem); line-height: 1.04; letter-spacing: -.02em; color: var(--t1l); font-variation-settings: "opsz" 144}
#route .sec-h em{font-style: italic; color: var(--ember); font-weight: 300}
#route .sec-head .right{display: flex; flex-direction: column; align-items: flex-start; gap: 18px}
#route .sec-head .right p{font-family: var(--fe); font-style: italic; font-size: 16px; color: var(--t2l); max-width: 440px; line-height: 1.6; font-weight: 300; text-align: left}
@media(max-width:900px){
#route .sec-head{grid-template-columns: 1fr; gap: 24px}
}
@media(max-width:900px){
.route-grid{grid-template-columns: 1fr}
}
/* COST & DATES — the centerpiece */
.cost-wrap{display: grid; grid-template-columns: 1fr .95fr; gap: 64px; align-items: start; background: var(--ink); color: var(--t1d); padding: 130px 0; position: relative; overflow: hidden}
.cost-wrap::before{content: ''; position: absolute; inset: 0; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover; opacity: .12}
.cost-wrap::after{content: ''; position: absolute; inset: 0; background: linear-gradient(180deg,rgba(14,20,17,.95),rgba(14,20,17,.98))}
.cost-wrap .container{position: relative; z-index: 2}
.cost-head{text-align: center; margin-bottom: 62px}
.cost-head .eyebrow{justify-content: center; color: var(--ember)}
.cost-head .eyebrow::after{content: ''; width: 28px; height: 1px; background: currentColor; opacity: .9}
.cost-head h2{font-family: var(--fe); font-weight: 300; font-size: clamp(2.4rem,4.6vw,3.8rem); color: #fff; line-height: 1.05; margin-top: 20px; letter-spacing: -.02em; font-variation-settings: "opsz" 144}
.cost-head h2 em{font-style: italic; color: var(--gold-lt)}
.cost-head p{font-family: var(--fe); font-style: italic; font-size: 16px; color: rgba(244,239,230,.7); max-width: 560px; margin: 18px auto 0; line-height: 1.6}
/* tabs */
.cost-tabs{display: flex; justify-content: center; gap: 0; margin-bottom: 42px; border-bottom: 1px solid rgba(255,255,255,.1)}
.cost-tab{font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.55); padding: 18px 36px; cursor: pointer; background: none; border: none; border-bottom: 1px solid transparent; transition: all .3s var(--ex); position: relative}
.cost-tab i.ph{margin-right: 10px; font-size: 16px}
.cost-tab.active{color: #fff; border-bottom-color: var(--ember)}
.cost-tab:hover{color: #fff}
.cost-tab .badge{position: absolute; top: 8px; right: 8px; font-family: var(--fe); font-style: italic; font-size: 10px; color: var(--gold-lt)}
.cost-panel{display: none}
.cost-panel.active{display: block}
/* Season pills */
.season-pills{display: flex; justify-content: center; gap: 8px; margin-bottom: 42px; flex-wrap: wrap}
/* Departure cards */
.deps{display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-bottom: 60px}
.dep{display: grid; grid-template-columns: auto 1fr auto auto; gap: 20px; align-items: center; padding: 26px 24px; border: 1px solid rgba(255,255,255,.1); margin-bottom: 10px; transition: all .3s var(--ex); background: rgba(244,239,230,.04); position: relative}
.dep:hover{border-color: var(--gold-lt); background: rgba(244,239,230,.06)}
.dep-month{font-family: var(--fu); font-size: 10px; letter-spacing: .36em; text-transform: uppercase; color: rgba(244,239,230,.5); margin-bottom: 8px}
.dep-year{font-family: var(--fe); font-style: italic; font-size: 14px; color: rgba(244,239,230,.55); margin-bottom: 18px}
.dep-cta:hover{gap: 14px}
.dep.sold .dep-cta{color: rgba(244,239,230,.45); border-color: rgba(244,239,230,.25); pointer-events: none}
/* Pricing matrix — field-document style */
.matrix-wrap::before,.matrix-wrap::after,.matrix-wrap > .br1,.matrix-wrap > .br2{content: ''; position: absolute; width: 24px; height: 24px; border-color: var(--gold-lt)}
.matrix-wrap::before{top: -1px; left: -1px; border-top: 1px solid; border-left: 1px solid}
.matrix-wrap::after{top: -1px; right: -1px; border-top: 1px solid; border-right: 1px solid}
.matrix-wrap > .br1{bottom: -1px; left: -1px; border-bottom: 1px solid; border-left: 1px solid}
.matrix-wrap > .br2{bottom: -1px; right: -1px; border-bottom: 1px solid; border-right: 1px solid}
.matrix-meta{display: flex; align-items: center; justify-content: space-between; padding: 16px 22px; border-bottom: 1px solid rgba(255,255,255,.08)}
.matrix-meta .tag{font-family: var(--fm); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-lt)}
.matrix-meta .stamp{font-family: var(--fe); font-style: italic; font-size: 13px; color: rgba(244,239,230,.55); border: 1px dashed rgba(214,185,126,.4); padding: 4px 12px}
.matrix th,.matrix td{padding: 18px 22px; text-align: left; border-bottom: 1px solid rgba(255,255,255,.06)}
.matrix th{font-family: var(--fu); font-size: 10px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.55); background: rgba(255,255,255,.03)}
.matrix th:not(:first-child){text-align: right}
.matrix td:not(:first-child){text-align: right; font-family: var(--fd); font-size: 22px; font-weight: 500; color: #fff; letter-spacing: -.01em}
.matrix td:first-child{font-family: var(--fe); font-size: 15px; color: rgba(244,239,230,.92)}
.matrix td:first-child small{display: block; font-family: var(--fu); font-style: normal; font-size: 10.5px; color: rgba(244,239,230,.45); letter-spacing: .08em; margin-top: 2px}
.matrix td:first-child em{font-style: italic; color: var(--gold-lt)}
.matrix tr:hover td{background: rgba(184,68,42,.08); color: #fff}
.matrix tr.featured td{background: rgba(184,68,42,.12)}
.matrix tr.featured td:not(:first-child){color: var(--gold-lt)}
.matrix tr:last-child td{border-bottom: none}
.matrix-foot{padding: 18px 22px; border-top: 1px solid rgba(255,255,255,.08); display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap}
.matrix-foot .note{font-family: var(--fe); font-style: italic; font-size: 13px; color: rgba(244,239,230,.65)}
.matrix-foot .note b{color: var(--ember); font-style: normal; font-weight: 600}
/* private departure card */
.private{background: linear-gradient(135deg,rgba(184,68,42,.12),rgba(184,68,42,.02)); border: 1px solid rgba(214,185,126,.3); padding: 48px; display: grid; grid-template-columns: 1fr 320px; gap: 48px; align-items: center}
.private h3{font-family: var(--fe); font-weight: 300; font-size: 34px; color: #fff; line-height: 1.1; margin-bottom: 14px}
.private h3 em{font-style: italic; color: var(--gold-lt)}
.private p{font-family: var(--fu); font-size: 15px; color: rgba(244,239,230,.75); line-height: 1.7; font-weight: 300}
.private ul{display: flex; flex-direction: column; gap: 10px; margin-top: 18px; font-family: var(--fu); font-size: 13.5px; color: rgba(244,239,230,.85)}
.private li{display: flex; align-items: flex-start; gap: 10px}
.private li i.ph{color: var(--gold-lt); font-size: 16px; margin-top: 3px}
@media(max-width:900px){
.deps{grid-template-columns: 1fr}
.private{grid-template-columns: 1fr; padding: 32px}
.matrix th,.matrix td{padding: 14px 12px; font-size: 13px}
.matrix td:not(:first-child){font-size: 18px}
}
/* whats included / not */
.incl-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 0; background: var(--bone-3)}
.incl-col{background: var(--paper); padding: 56px 48px}
.incl-col:first-child{background: var(--bone)}
.incl-col h3{font-family: var(--fe); font-size: 24px; font-weight: 400; color: var(--ink); margin-bottom: 8px}
.incl-col h3 em{font-style: italic; color: var(--ember)}
.incl-col .sub{font-family: var(--fu); font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--t3l); margin-bottom: 34px}
.incl-col ul{display: flex; flex-direction: column; gap: 14px}
.incl-col li{display: flex; align-items: flex-start; gap: 14px; font-family: var(--fu); font-size: 14.5px; color: var(--t2l); line-height: 1.6; padding-bottom: 14px; border-bottom: 1px dashed var(--bone-3)}
.incl-col li i.ph{font-size: 18px; margin-top: 2px; flex-shrink: 0}
.incl-col.yes li i.ph{color: var(--moss)}
.incl-col.no li i.ph{color: var(--t3l)}
@media(max-width:780px){
.incl-grid{grid-template-columns: 1fr}
}
/* gallery */
.gal{display: grid; grid-template-columns: 1.4fr 1fr 1fr; grid-template-rows: 240px 240px 240px; gap: 14px}
.gtile{position: relative; overflow: hidden; background: var(--ink); cursor: pointer}
.gtile > div{position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 1s var(--ex)}
.gtile:hover > div{transform: scale(1.06)}
.gtile::after{content: ''; position: absolute; inset: 0; background: linear-gradient(to top,rgba(14,20,17,.6),transparent 50%); opacity: 0; transition: opacity .3s}
.gtile:hover::after{opacity: 1}
.gtile .cap{position: absolute; bottom: 18px; left: 20px; right: 20px; font-family: var(--fe); font-style: italic; font-size: 13px; color: #fff; opacity: 0; transform: translateY(8px); transition: all .35s var(--ex)}
.gtile:hover .cap{opacity: 1; transform: none}
.gtile.lg{grid-row: span 2}
.gtile.tall{grid-row: span 2}
@media(max-width:780px){
.gal{grid-template-columns: 1fr 1fr; grid-template-rows: repeat(4,200px)}
.gtile.lg{grid-row: span 1}
.gtile.tall{grid-row: span 1}
}
/* conservation band */
.cons{background: var(--ink-2); color: #fff; padding: 90px 0; border-top: 1px solid rgba(255,255,255,.06); border-bottom: 1px solid rgba(255,255,255,.06)}
.cons-grid{display: grid; grid-template-columns: 1.1fr 1.4fr; gap: 80px; align-items: center}
.cons h2{font-family: var(--fe); font-weight: 300; font-size: clamp(2.2rem,4vw,3.4rem); line-height: 1.05; letter-spacing: -.02em}
.cons p{font-family: var(--fe); font-style: italic; font-size: 16px; color: rgba(244,239,230,.72); line-height: 1.7; font-weight: 300; margin-top: 18px; max-width: 520px}
.cons-stats{display: grid; grid-template-columns: repeat(3,1fr); gap: 0; border-left: 1px solid rgba(255,255,255,.1)}
.cons-stat{padding: 0 28px}
.cons-stat .n{font-family: var(--fd); font-size: 48px; font-weight: 500; color: #fff; line-height: 1; letter-spacing: -.02em}
.cons-stat .n sup{font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--gold-lt)}
.cons-stat .l{font-family: var(--fu); font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.55); margin-top: 8px}
@media(max-width:900px){
.cons-grid{grid-template-columns: 1fr; gap: 48px}
.cons-stats{grid-template-columns: 1fr; border-left: none}
.cons-stat{border-top: 1px solid rgba(255,255,255,.1); padding: 24px 0}
}
/* voices */
.voices{display: grid; grid-template-columns: 1.6fr 1fr; gap: 48px; align-items: start}
.voice-lg{background: var(--bone); padding: 64px 56px; border-left: 3px solid var(--ember); position: relative}
.voice-lg .mark{font-family: var(--fe); font-style: italic; font-size: 120px; line-height: .6; color: var(--ember); position: absolute; top: 36px; right: 48px; opacity: .18}
.voice-lg blockquote{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: 28px; line-height: 1.45; color: var(--ink); margin-bottom: 32px}
.voice-lg blockquote em{color: var(--ember)}
.voice-by{display: flex; align-items: center; gap: 16px}
.voice-av{width: 54px; height: 54px; border-radius: 50%; background: var(--bone-3) center/cover; border: 1px solid var(--gold-lt)}
.voice-meta .nm{font-family: var(--fe); font-size: 16px; color: var(--ink); font-weight: 500}
.voice-meta .rl{font-family: var(--fu); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--t3l); margin-top: 3px}
.voice-sm-col{display: flex; flex-direction: column; gap: 20px}
.voice-sm{padding: 28px 26px; background: #fff; border: 1px solid var(--bone-3)}
.voice-sm blockquote{font-family: var(--fe); font-style: italic; font-size: 16px; line-height: 1.55; color: var(--t1l); margin-bottom: 18px; font-weight: 300}
.voice-sm .by b{color: var(--ink); font-weight: 600}
.stars{display: inline-flex; gap: 2px; color: var(--ember); margin-bottom: 12px}
@media(max-width:900px){
.voices{grid-template-columns: 1fr}
.voice-lg{padding: 40px 28px}
.voice-lg blockquote{font-size: 20px}
}
/* FAQ */
.faq{max-width: 880px; margin: 0 auto}
.faq-q{width: 100%; background: transparent; border: none; text-align: left; padding: 26px 8px; display: flex; justify-content: space-between; gap: 24px; cursor: pointer; font-family: var(--fe); font-size: 19px; color: var(--ink); align-items: center; font-weight: 500}
.faq-q em{font-style: italic; color: var(--ember); font-weight: 400; margin-right: 14px; font-size: 16px}
.faq-q .tg{width: 28px; height: 28px; border: 1px solid var(--bone-3); border-radius: 50%; display: grid; place-items: center; color: var(--ember); font-size: 18px; transition: all .3s; flex-shrink: 0}
.faq-row.open .faq-q .tg{background: var(--ember); color: #fff; border-color: var(--ember); transform: rotate(45deg)}
.faq-a{max-height: 0; overflow: hidden; transition: max-height .5s var(--ex)}
.faq-a-inner{padding: 0 8px 28px 8px; font-family: var(--fu); font-size: 15px; color: var(--t2l); line-height: 1.8; font-weight: 300}
/* CTA */
.cta{position: relative; padding: 120px 0; background: var(--ink); color: #fff; overflow: hidden; text-align: center}
.cta::before{content: ''; position: absolute; inset: 0; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover; opacity: .18}
.cta::after{content: ''; position: absolute; inset: 0; background: linear-gradient(120deg,rgba(14,20,17,.96) 0%,rgba(14,20,17,.72) 100%)}
.cta .container{position: relative; z-index: 2}
.cta-contacts{margin-top: 36px; display: flex; flex-direction: column; gap: 18px}
.cta-contacts a{display: flex; align-items: center; gap: 14px; font-family: var(--fe); font-style: italic; font-size: 15.5px; color: rgba(244,239,230,.92); transition: color .25s}
.cta-contacts a i.ph{color: var(--gold-lt); font-size: 20px}
.cta-contacts a:hover{color: var(--gold-lt)}
.cta-form{background: rgba(14,20,17,.55); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,.1); padding: 42px}
.cta-form h4{font-family: var(--fe); font-style: italic; font-size: 20px; color: var(--gold-lt); margin-bottom: 24px; font-weight: 400}
.cta-form .field{margin-bottom: 20px}
.cta-form label{display: block; font-family: var(--fu); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: rgba(244,239,230,.55); margin-bottom: 8px; font-weight: 500}
.cta-form input,.cta-form select,.cta-form textarea{width: 100%; background: transparent; border: none; border-bottom: 1px solid rgba(255,255,255,.18); padding: 10px 0 12px; font-family: var(--fu); font-size: 15px; color: #fff; outline: none; transition: border-color .25s}
.cta-form input:focus,.cta-form select:focus,.cta-form textarea:focus{border-bottom-color: var(--gold-lt)}
.cta-form textarea{resize: vertical; min-height: 80px}
.cta-form select option{background: var(--ink-2)}
.cta-form .row2{display: grid; grid-template-columns: 1fr 1fr; gap: 24px}
.cta-form .submit{width: 100%; margin-top: 14px; background: var(--ember); color: #fff; border: none; padding: 18px; font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; cursor: pointer; transition: background .3s}
.cta-form .submit:hover{background: var(--ember-dk)}
@media(max-width:900px){
.cta-grid{grid-template-columns: 1fr; gap: 48px}
}
/* FOOTER — ported from homepage */
/* responsive */
@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.over-grid{grid-template-columns: 1fr; gap: 48px}
.over-side{position: static}
.sec-head{grid-template-columns: 1fr; gap: 24px}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
.hero-body{padding: 140px 32px 0}
}
@media(max-width:640px){
.hero-title{font-size: clamp(2.2rem, 8vw, 3rem) !important; line-height: .95}
.foot-main{grid-template-columns: 1fr; gap: 40px}
.voice-lg blockquote{font-size: 18px}
}
/* ADDITIONS — SEO H1, Itinerary variants, Video tile,
   Good-to-Know, FAQ tabs, Departures footer */
/* SEO H1 — small, refined, sits above poetic display title */
.h1-trip::before{content: ''; width: 36px; height: 1px; background: var(--gold-lt); opacity: .65}
.h1-trip .h1-main{color: #fff; font-weight: 500}
.h1-trip .h1-dot{color: rgba(244,239,230,.4); margin: 0 4px}
@media(max-width:640px){
.h1-trip{font-size: 10px; letter-spacing: .26em; flex-wrap: wrap}
.h1-trip::before{width: 20px}
}
/* Itinerary variants pill row */
.itin-variants{display: flex; flex-wrap: wrap; gap: 0; margin: -32px 0 44px; border: 1px solid var(--bone-3); background: #fff; position: relative}
.itin-variants::before{content: '⚑ Itinerary editions'; position: absolute; top: -10px; left: 24px; background: var(--bone); padding: 0 12px; font-family: var(--fu); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: var(--t3l)}
.itin-var{flex: 1; min-width: 200px; padding: 22px 24px; font-family: var(--fe); font-size: 16px; color: var(--t1l); cursor: pointer; background: transparent; border: none; border-right: 1px solid var(--bone-3); text-align: left; display: flex; flex-direction: column; gap: 6px; transition: background .25s,color .25s; text-decoration: none}
.itin-var:last-child{border-right: none}
.itin-var .iv-name{font-style: italic; font-size: 17px; font-weight: 400; color: var(--ink)}
.itin-var .iv-sub{font-family: var(--fu); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--t3l); font-style: normal}
.itin-var.active{background: var(--ink); color: #fff}
.itin-var.active .iv-name{color: #fff}
.itin-var.active .iv-sub{color: var(--gold-lt)}
.itin-var:not(.active):hover{background: var(--bone-2); color: var(--ember)}
.itin-var:not(.active):hover .iv-name{color: var(--ember)}
/* Departures: see-more strip */
.deps-foot{display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-top: 28px; padding: 22px 26px; border: 1px dashed rgba(255,255,255,.18); background: rgba(255,255,255,.02)}
.deps-foot p{font-family: var(--fe); font-style: italic; font-size: 15px; color: rgba(244,239,230,.78); margin: 0; font-weight: 300}
.deps-foot p b{color: var(--gold-lt); font-weight: 400}
/* Video tile in gallery */
.gtile.video{position: relative; cursor: pointer}
.gtile.video video{position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover}
.gtile.video::before{content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom,rgba(14,20,17,.15),rgba(14,20,17,.55)); z-index: 2; pointer-events: none}
.gtile.video .play{position: absolute; inset: 0; display: grid; place-items: center; z-index: 3; color: #fff}
.gtile.video .play .ring{width: 78px; height: 78px; border: 1px solid rgba(255,255,255,.8); border-radius: 50%; display: grid; place-items: center; background: rgba(14,20,17,.32); backdrop-filter: blur(6px); transition: transform .4s var(--ex),background .25s}
.gtile.video:hover .play .ring{transform: scale(1.08); background: var(--ember); border-color: var(--ember)}
.gtile.video .play i{font-size: 30px; margin-left: 4px}
.gtile.video .vlabel{position: absolute; top: 18px; left: 20px; z-index: 3; font-family: var(--fu); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: #fff; display: inline-flex; align-items: center; gap: 8px}
.gtile.video .vlabel .vdot{width: 7px; height: 7px; border-radius: 50%; background: var(--ember); box-shadow: 0 0 0 4px rgba(196,93,71,.28); animation: vpulse 2s infinite}
@keyframes vpulse{
0%,100%{box-shadow:0 0 0 4px rgba(196,93,71,.28);}50%{box-shadow:0 0 0 9px rgba(196,93,71,0);}
}
.gtile.video .cap{z-index: 3; opacity: 1; transform: none; color: #fff}
/* Good-to-Know section */
.gtk-grid{display: grid; grid-template-columns: repeat(3,1fr); gap: 0; border: 1px solid var(--bone-3); background: #fff}
.gtk-card{padding: 36px 32px; border-right: 1px solid var(--bone-3); border-bottom: 1px solid var(--bone-3); display: flex; flex-direction: column; gap: 14px; position: relative; transition: background .3s}
.gtk-card:nth-child(3n){border-right: none}
.gtk-card:nth-last-child(-n+3){border-bottom: none}
.gtk-card:hover{background: var(--bone-2)}
.gtk-icon{width: 46px; height: 46px; border: 1px solid var(--bone-3); display: grid; place-items: center; color: var(--ember); font-size: 22px; margin-bottom: 6px}
.gtk-num{position: absolute; top: 24px; right: 24px; font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--t3l)}
.gtk-card h3{font-family: var(--fe); font-weight: 400; font-size: 22px; color: var(--ink); letter-spacing: -.01em}
.gtk-card h3 em{font-style: italic; color: var(--ember)}
.gtk-card p{font-family: var(--fu); font-size: 14px; color: var(--t2l); line-height: 1.7; font-weight: 300; flex: 1}
.gtk-card .gtk-meta{font-family: var(--fu); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--t3l); padding-top: 14px; border-top: 1px solid var(--bone-3); display: flex; justify-content: space-between; align-items: center; gap: 10px}
.gtk-card .gtk-meta a{color: var(--ember); transition: gap .25s; display: inline-flex; align-items: center; gap: 6px}
.gtk-card .gtk-meta a:hover{gap: 12px}
@media(max-width:900px){
.gtk-grid{grid-template-columns: 1fr 1fr}
.gtk-card:nth-child(3n){border-right: 1px solid var(--bone-3)}
.gtk-card:nth-child(2n){border-right: none}
.gtk-card:nth-last-child(-n+3){border-bottom: 1px solid var(--bone-3)}
.gtk-card:nth-last-child(-n+2){border-bottom: none}
}
@media(max-width:600px){
.gtk-grid{grid-template-columns: 1fr}
.gtk-card{border-right: none !important; border-bottom: 1px solid var(--bone-3) !important}
.gtk-card:last-child{border-bottom: none !important}
}
/* FAQ category tabs */
.faq-cats{display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 36px; max-width: 880px; margin: 0 auto 36px; justify-content: center}
.faq-cat{padding: 10px 18px; font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--t2l); background: transparent; border: 1px solid var(--bone-3); cursor: pointer; transition: all .25s var(--ex); display: inline-flex; align-items: center; gap: 8px}
.faq-cat i.ph{font-size: 14px; color: var(--ember)}
.faq-cat:hover{border-color: var(--ink); color: var(--ink)}
.faq-cat.active{background: var(--ink); color: #fff; border-color: var(--ink)}
.faq-cat.active i.ph{color: var(--gold-lt)}
.faq-row{border-bottom: 1px solid var(--bone-3); transition: opacity .25s}
.faq-row.hidden{display: none}

/* NAV — same as main */
/* PAGE HEAD */
/* sub nav */
.subnav .sub-cta{margin-left: auto; background: var(--brand-orange); color: #fff; padding: 10px 18px; font-size: 11px; letter-spacing: .16em; transition: background .25s; border: none}
.subnav .sub-cta:hover{background: var(--ember-dk); color: #fff; border-color: transparent}
/* Section */
.sec{padding: 110px 0; background: var(--paper); color: var(--t1l); position: relative}
.sec.dark{background: var(--ink); color: var(--t1d)}
.sec-h{font-family: var(--fe); font-weight: 300; font-size: clamp(2.2rem,4vw,3.4rem); line-height: 1.05; letter-spacing: -.02em; color: var(--ink); font-variation-settings: "opsz" 144}
.sec-h em{font-style: italic; color: var(--ember); font-weight: 300}
.dark .sec-h{color: #fff}
.dark .sec-h em{color: var(--gold-lt)}
.sec-head{display: grid; grid-template-columns: 1.1fr .9fr; gap: 64px; align-items: end; margin-bottom: 60px}
.sec-head p{font-family: var(--fe); font-style: italic; font-size: 16px; color: var(--t2l); max-width: 640px; line-height: 1.6; font-weight: 300; margin-top: 18px}
.dark .sec-head p{color: var(--t2d)}
/* SEASON SELECTOR + DEPARTURE LIST */
.season-row{display: flex; gap: 8px; margin-bottom: 32px; flex-wrap: wrap}
.season-pill{font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--t2l); padding: 12px 22px; background: #fff; border: 1px solid var(--bone-3); cursor: pointer; transition: all .25s; display: inline-flex; align-items: center; gap: 10px}
.season-pill .dot{width: 7px; height: 7px; border-radius: 50%; background: var(--gold); opacity: .5}
.season-pill.peak .dot{background: var(--ember)}
.season-pill.active{background: var(--ember); border-color: var(--ember); color: #fff}
.season-pill.active .dot{background: #fff; opacity: 1}
.season-pill.disabled{opacity: .4; cursor: not-allowed}
.dep-list{border-top: 1px solid var(--bone-3)}
.dep-row{display: grid; grid-template-columns: 170px 1fr 220px 140px 160px; gap: 32px; align-items: center; padding: 30px 8px; border-bottom: 1px solid var(--bone-3); transition: background .25s}
.dep-row:hover{background: rgba(184,68,42,.04)}
.dep-row.sold{opacity: .55}
.dep-num{font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--ember)}
.dep-num b{display: block; font-family: var(--fd); font-style: normal; font-size: 28px; color: var(--ink); font-weight: 500; margin-top: 2px}
.dep-date{font-family: var(--fe); font-size: 20px; font-weight: 500; color: var(--ink); line-height: 1.2; margin-bottom: 4px}
.dep-date em{font-style: italic; color: var(--ember)}
.dep-date span{display: block; font-family: var(--fu); font-style: normal; font-size: 10.5px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--t3l); margin-top: 6px}
.dep-avail{display: flex; align-items: center; gap: 8px; margin-bottom: 18px; padding-top: 18px; border-top: 1px dashed rgba(255,255,255,.12); flex-direction: column}
.dep-avail .dots{display: flex; gap: 4px}
.dep-avail .d{width: 10px; height: 10px; background: var(--ember); border-radius: 50%}
.dep-avail .d.empty{background: var(--bone-3)}
.dep-avail .txt{font-family: var(--fu); font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--t2l); margin-left: auto}
.dep-status{position: absolute; top: 18px; right: 20px; font-family: var(--fu); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; padding: 7px 12px; text-align: center; width: fit-content}
.dep-status.open{color: var(--moss); border: 1px solid var(--moss)}
.dep-status.filling{color: var(--ember); border: 1px solid var(--ember); background: rgba(184,68,42,.08)}
.dep-status.sold{color: var(--t3l); border: 1px solid var(--bone-3)}
.dep-cta{display: inline-flex; align-items: center; gap: 8px; font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--ember); padding-bottom: 4px; border-bottom: 1px solid var(--ember); transition: gap .3s; justify-self: end}
.dep-cta a{font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--ember); padding: 11px 18px; border: 1px solid var(--ember); transition: all .25s; display: inline-flex; align-items: center; gap: 8px}
.dep-cta a:hover{background: var(--ember); color: #fff}
.dep-row.sold .dep-cta a{color: var(--t3l); border-color: var(--bone-3)}
@media(max-width:980px){
.dep-row{grid-template-columns: 1fr 1fr; gap: 14px}
.dep-cta{justify-self: start; grid-column: span 2}
}
/* PRICING — comparison cards */
.price-cards{display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; margin-top: 10px}
@media(max-width:1000px){
.price-cards{grid-template-columns: repeat(2,1fr)}
}
@media(max-width:560px){
.price-cards{grid-template-columns: 1fr}
}
/* PRIVATE DEPARTURE form */
.private-grid{display: grid; grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: start}
.private-grid .left h3{font-family: var(--fe); font-weight: 300; font-size: 36px; line-height: 1.05; color: var(--ink)}
.private-grid .left h3 em{font-style: italic; color: var(--ember)}
.private-grid .left p{font-family: var(--fu); font-size: 15.5px; color: var(--t2l); line-height: 1.75; margin-top: 22px; font-weight: 300}
.private-grid .left ul{margin-top: 24px; display: flex; flex-direction: column; gap: 12px; font-family: var(--fu); font-size: 14px; color: var(--t2l)}
.private-grid .left li{display: flex; gap: 12px; align-items: flex-start}
.private-grid .left li i.ph{color: var(--ember); font-size: 18px; margin-top: 2px}
.form{background: #fff; border: 1px solid var(--bone-3); padding: 42px 38px}
.form .field{margin-bottom: 22px}
.form label{display: block; font-family: var(--fu); font-size: 10px; letter-spacing: .26em; text-transform: uppercase; color: var(--t3l); margin-bottom: 8px; font-weight: 600}
.form input,.form select,.form textarea{width: 100%; background: transparent; border: none; border-bottom: 1px solid var(--bone-3); padding: 10px 0 12px; font-family: var(--fu); font-size: 15px; color: var(--ink); outline: none; transition: border-color .25s}
.form input:focus,.form select:focus,.form textarea:focus{border-bottom-color: var(--ember)}
.form textarea{resize: vertical; min-height: 90px}
.form .row2{display: grid; grid-template-columns: 1fr 1fr; gap: 22px}
.form .submit{width: 100%; margin-top: 14px; background: var(--ember); color: #fff; border: none; padding: 18px; font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; cursor: pointer; transition: background .3s}
.form .submit:hover{background: var(--ember-dk)}
@media(max-width:900px){
.private-grid{grid-template-columns: 1fr}
}
/* DEPOSIT / POLICY band */
.policy{background: var(--ink); color: #fff; padding: 90px 0}
.policy-grid{display: grid; grid-template-columns: repeat(4,1fr); gap: 0; border-left: 1px solid rgba(255,255,255,.1)}
.pol{padding: 0 28px; min-width: 0}
.pol .n{font-family: var(--fd); font-size: 44px; font-weight: 500; color: #fff; letter-spacing: -.02em; line-height: 1}
.pol .n sup{font-family: var(--fe); font-style: italic; font-size: 16px; color: var(--gold-lt)}
.pol .l{font-family: var(--fu); font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.55); margin-top: 8px; overflow-wrap: break-word}
.pol .d{font-family: var(--fe); font-style: italic; font-size: 14px; color: rgba(244,239,230,.75); margin-top: 10px; line-height: 1.55; overflow-wrap: break-word}
@media(max-width:900px){
.policy-grid{grid-template-columns: 1fr 1fr}
.pol{padding: 24px 20px; border-top: 1px solid rgba(255,255,255,.1)}
}
/* CONFIRM / faq */
.confirm{display: grid; grid-template-columns: repeat(3,1fr); gap: 22px}
.confirm .ccard{background: #fff; border: 1px solid var(--bone-3); padding: 30px 28px}
.confirm .ccard i.ph{font-size: 28px; color: var(--ember); margin-bottom: 16px}
.confirm .ccard h4{font-family: var(--fe); font-size: 18px; color: var(--ink); font-weight: 500; margin-bottom: 10px}
.confirm .ccard p{font-family: var(--fu); font-size: 13.5px; color: var(--t2l); line-height: 1.65; font-weight: 300}
@media(max-width:780px){
.confirm{grid-template-columns: 1fr}
}
/* footer (reuse) */
@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
.foot-main{grid-template-columns: 1fr; gap: 40px}
}

/* HEADER */
.g-head{padding: 170px 0 60px; text-align: left}
.g-title{font-family: var(--fe); font-size: clamp(2.4rem,5.4vw,4.8rem); font-weight: 300; line-height: 1.02; letter-spacing: -.025em; color: #fff; max-width: 1100px; font-variation-settings: "opsz" 144; margin-top: 14px}
.g-title em{font-style: italic; color: var(--gold-lt)}
.g-meta{display: flex; gap: 34px; flex-wrap: wrap; border-top: 1px solid rgba(255,255,255,.1); margin-top: 44px; padding-top: 24px}
.g-meta div{display: flex; flex-direction: column; gap: 4px}
.g-meta .l{font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: rgba(244,239,230,.5)}
.g-meta .v{font-family: var(--fe); font-size: 15px; color: #fff}
.g-meta .v em{font-style: italic; color: var(--gold-lt)}
/* FILTER BAR */
.filter-bar{position: sticky; top: var(--nav-h, 82px); z-index: 80; background: rgba(14,20,17,.94); backdrop-filter: blur(20px); border-top: 1px solid rgba(255,255,255,.06); border-bottom: 1px solid rgba(255,255,255,.06)}
.chip{display: inline-flex; align-items: center; gap: 8px; padding: 8px 18px; font-family: var(--fu); font-size: 11.5px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; background: transparent; color: rgba(244,239,230,.6); border-radius: 2px; border: none; cursor: pointer; position: relative; white-space: nowrap; transition: color .2s}
.chip .c{font-family: var(--fd); font-size: 10px; color: var(--gold); margin-left: 6px; font-weight: 600}
.chip:hover,.chip.on{color: #fff}
.chip.on::after{content: ''; position: absolute; left: 18px; right: 18px; bottom: -1px; height: 2px; background: var(--brand-orange)}
.tool{background: transparent; border: 1px solid rgba(255,255,255,.15); color: rgba(244,239,230,.75); padding: 8px 12px; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; transition: .25s}
.tool:hover,.tool.on{background: #fff; color: var(--ink); border-color: #fff}
.tool i{font-size: 14px}
.grid{display: grid; grid-template-columns: repeat(12,1fr); grid-auto-rows: 120px; gap: 8px}
.tile{position: relative; overflow: hidden; background: var(--ink-3); cursor: pointer; transition: transform .5s var(--ex)}
.tile img{width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ex),filter .6s}
.tile:hover img{transform: scale(1.06); filter: saturate(1.1)}
.tile .cap{position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 22px 20px; background: linear-gradient(to top,rgba(14,20,17,.9) 0%,rgba(14,20,17,.5) 40%,transparent 100%); opacity: 0; transform: translateY(10px); transition: .4s var(--ex); pointer-events: none}
.tile:hover .cap{opacity: 1; transform: none}
.tile .cap .n{font-family: var(--fd); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: var(--gold-lt); font-weight: 600; margin-bottom: 4px}
.tile .cap .t{font-family: var(--fe); font-size: 16px; color: #fff; font-weight: 400; line-height: 1.3; font-style: italic}
.tile .badge{position: absolute; top: 14px; left: 14px; font-size: 9.5px; letter-spacing: .24em; text-transform: uppercase; color: #fff; background: rgba(14,20,17,.5); backdrop-filter: blur(8px); padding: 5px 10px; font-weight: 500; z-index: 2}
.tile .play{position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; z-index: 2}
.tile .play span{width: 64px; height: 64px; border-radius: 50%; background: rgba(14,20,17,.55); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.5); color: #fff; display: grid; place-items: center; font-size: 22px; transition: .4s; box-shadow: 0 0 0 0 rgba(255,103,1,.6)}
.tile:hover .play span{background: var(--brand-orange); border-color: var(--brand-orange); transform: scale(1.08)}
/* sizes (mosaic) */
.s-1{grid-column: span 4; grid-row: span 3}
/* CHAPTER STRIP */
.chapter{grid-column: 1 / -1; padding: 60px 8px 20px; display: flex; align-items: end; justify-content: space-between; gap: 24px}
.chapter .num{font-family: var(--fd); font-size: 13px; letter-spacing: .32em; text-transform: uppercase; color: var(--gold); font-weight: 600}
.chapter h3{font-family: var(--fe); font-size: clamp(1.8rem,3.6vw,2.8rem); font-weight: 300; color: #fff; line-height: 1.05; letter-spacing: -.02em; max-width: 640px; margin-top: 8px}
.chapter h3 em{font-style: italic; color: var(--gold-lt)}
.chapter .r{font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--t2d); max-width: 360px; text-align: right}
.lb.on{display: flex; animation: fi .3s ease}
@keyframes fi{
from{opacity:0}
}
/* END */
@media(max-width:1000px){
.grid{grid-template-columns: repeat(6,1fr); grid-auto-rows: 110px}.s-1 {grid-column: span 3; grid-row: span 3}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 40px}
.chapter{flex-direction: column; align-items: flex-start}
.chapter .r{text-align: left}
}

/* GTK page-specific styles */
.gtk-nav{position: sticky; top: var(--nav-h, 72px); z-index: 50; background: rgba(244,239,230,.92); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--bone-3)}
.gtk-nav .container{display: flex; gap: 6px; overflow-x: auto; padding: 14px var(--pad)}
.gtk-nav a{flex-shrink: 0; padding: 10px 18px; font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--t2l); border: 1px solid transparent; transition: all .25s; display: inline-flex; align-items: center; gap: 8px}
.gtk-nav a i.ph{font-size: 14px; color: var(--ember)}
.gtk-nav a:hover{border-color: var(--bone-3); color: var(--ink)}
.gtk-nav a.active{background: var(--ink); color: #fff; border-color: var(--ink)}
.gtk-nav a.active i.ph{color: var(--gold-lt)}
.gtk-topic{padding: 100px 0 80px; border-bottom: 1px solid var(--bone-3)}
.gtk-topic.alt{background: var(--bone-2)}
.gtk-topic-head{display: grid; grid-template-columns: auto 1fr auto; gap: 32px; align-items: center; margin-bottom: 48px; padding-bottom: 24px; border-bottom: 1px solid var(--bone-3)}
.gtk-topic-no{font-family: var(--fe); font-style: italic; font-size: 80px; color: var(--bone-3); line-height: 1; font-weight: 300}
.gtk-topic-head h2{font-family: var(--fe); font-weight: 300; font-size: clamp(2rem,4vw,3.4rem); color: var(--ink); letter-spacing: -.02em; line-height: 1.05}
.gtk-topic-head h2 em{font-style: italic; color: var(--ember)}
.gtk-topic-head .gtk-tag{font-family: var(--fu); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); padding: 8px 16px; border: 1px solid var(--bone-3)}
.gtk-content{display: grid; grid-template-columns: 1.4fr .9fr; gap: 64px}
.gtk-content p{font-family: var(--fu); font-size: 16px; color: var(--t2l); line-height: 1.85; font-weight: 300; margin-bottom: 18px}
.gtk-content p b{color: var(--ink); font-weight: 600}
.gtk-content h4{font-family: var(--fe); font-style: italic; font-size: 22px; color: var(--ink); margin: 32px 0 16px; font-weight: 400}
.gtk-content blockquote{border-left: 2px solid var(--ember); padding: 8px 0 8px 24px; margin: 28px 0; font-family: var(--fe); font-style: italic; font-size: 19px; color: var(--ink); line-height: 1.55; font-weight: 300}
.gtk-aside{position: sticky; top: calc(var(--nav-h, 84px) + 56px); align-self: start}
.gtk-aside .gtk-fact{background: #fff; border: 1px solid var(--bone-3); padding: 28px; margin-bottom: 18px; position: relative}
.gtk-aside .gtk-fact h5{font-family: var(--fu); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: var(--t3l); margin-bottom: 14px; font-weight: 600}
.gtk-aside .gtk-fact .v{font-family: var(--fe); font-style: italic; font-size: 28px; color: var(--ink); line-height: 1.15; font-weight: 300}
.gtk-aside .gtk-fact .v em{color: var(--ember); font-style: italic}
.gtk-aside .gtk-fact .v small{display: block; margin-top: 6px; font-family: var(--fu); font-style: normal; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--t3l); font-weight: 500}
.gtk-list{list-style: none; margin: 18px 0}
.gtk-list li{display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px dotted var(--bone-3); font-family: var(--fu); font-size: 15px; color: var(--t2l); line-height: 1.6}
.gtk-list li:last-child{border-bottom: none}
.gtk-list li i.ph{color: var(--ember); font-size: 18px; flex-shrink: 0; margin-top: 2px}
.gtk-list li b{color: var(--ink); font-weight: 600}
@media(max-width:900px){
.gtk-topic-head{grid-template-columns: auto 1fr}
.gtk-topic-head .gtk-tag{grid-column: 1/-1; justify-self: start}
.gtk-content{grid-template-columns: 1fr; gap: 36px}
.gtk-aside{position: static}
}

.eyebrow.center{justify-content: center}
.eyebrow.center::after{content: ''; width: 28px; height: 1px; background: currentColor; opacity: .9}
/* nav */
/* PAGE HEAD (compact hero) */
.phead{position: relative; min-height: 62vh; display: flex; align-items: flex-end; background: var(--ink); color: #fff; overflow: hidden; padding-top: 84px}
.phead-bg{position: absolute; inset: 0; background: linear-gradient(158deg,#1A2420,#0E1411) center 40%/cover no-repeat; filter: saturate(1.05)}
.phead-veil{position: absolute; inset: 0; background: linear-gradient(180deg,rgba(14,20,17,.55) 0%,rgba(14,20,17,.35) 40%,rgba(14,20,17,.95) 100%)}
.phead-body{position: relative; z-index: 2; padding: 130px var(--pad) 70px; width: 100%; max-width: var(--maxw); margin: 0 auto}
.crumb .sep{color: rgba(244,239,230,.3); opacity: .4}
.phead h1{font-family: var(--fe); font-weight: 300; font-size: clamp(2.8rem,5.6vw,5rem); line-height: 1.02; color: #fff; letter-spacing: -.025em; max-width: 980px; font-variation-settings: "opsz" 144}
.phead h1 em{font-style: italic; color: var(--gold-lt)}
.phead p{font-family: var(--fe); font-style: italic; font-size: 18px; color: rgba(244,239,230,.78); max-width: 680px; line-height: 1.6; margin-top: 22px; font-weight: 300}
.phead-meta{display: flex; gap: 32px; margin-top: 36px; flex-wrap: wrap; font-family: var(--fu); font-size: 11.5px; letter-spacing: .22em; text-transform: uppercase; color: rgba(244,239,230,.65)}
.phead-meta span b{color: var(--gold-lt); font-weight: 500; margin-right: 8px}
/* page contents — table of days */
.toc-wrap{background: var(--bone); padding: 60px 0; border-bottom: 1px solid var(--bone-3)}
.toc-wrap .toc{position: sticky; top: calc(var(--nav-h, 84px) + 26px); align-self: start; display: grid; grid-template-columns: repeat(7,1fr); gap: 6px}
.toc a{display: flex; font-family: var(--fu); font-size: 13px; color: var(--t2l); padding: 14px 6px; line-height: 1.4; border-left: 2px solid transparent; padding-left: 12px; margin-left: -14px; transition: all .25s; flex-direction: column; align-items: center; justify-content: center; background: #fff; border: 1px solid var(--bone-3); text-align: center}
.toc a:hover{border-color: var(--ember); background: rgba(184,68,42,.06)}
.toc a .n{font-family: var(--fe); font-style: italic; font-size: 11px; color: var(--ember); letter-spacing: .1em}
.toc a .d{font-family: var(--fd); font-size: 18px; font-weight: 500; color: var(--ink); margin-top: 2px}
@media(max-width:900px){
.toc-wrap .toc{grid-template-columns: repeat(4,1fr)}
}
@media(max-width:560px){
.toc-wrap .toc{grid-template-columns: repeat(3,1fr)}
}
/* DAYS — long editorial layout */
.day{display: grid; grid-template-columns: 180px 1fr 320px; gap: 48px; padding: 60px 0; border-bottom: 1px solid var(--bone-3); align-items: start}
.day:last-child{border-bottom: none}
.day-no{position: sticky; top: calc(var(--nav-h, 84px) + 56px)}
.day-no .n{font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--ember); letter-spacing: .1em}
.day-no .num{font-family: var(--fd); font-size: 84px; font-weight: 500; color: var(--ink); line-height: .85; letter-spacing: -.04em; margin-top: 6px}
.day-no .alt{font-family: var(--fu); font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); margin-top: 14px}
.day-no .alt b{font-family: var(--fe); font-size: 16px; font-style: italic; color: var(--gold); font-weight: 400; display: block; margin-top: 4px; letter-spacing: 0; text-transform: none}
.day-body h3{font-family: var(--fe); font-weight: 400; font-size: 30px; line-height: 1.15; letter-spacing: -.015em; color: var(--ink); margin-bottom: 14px}
.day-body h3 em{font-style: italic; color: var(--ember)}
.day-body .sub{font-family: var(--fu); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); margin-bottom: 24px}
.day-body p{font-family: var(--fu); font-size: 16px; color: var(--t2l); line-height: 1.85; font-weight: 300; margin-bottom: 18px}
.day-body .quote{font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--ink); line-height: 1.5; border-left: 2px solid var(--ember); padding: 14px 0 14px 22px; margin: 24px 0}
.day-side{position: relative; top: 140px; background: #fff; border: 1px solid var(--bone-3); padding: 28px 26px}
.day-side::before,.day-side::after{content: ''; position: absolute; width: 18px; height: 18px; border-color: var(--gold-lt)}
.day-side::before{top: -1px; left: -1px; border-top: 1px solid; border-left: 1px solid}
.day-side::after{bottom: -1px; right: -1px; border-bottom: 1px solid; border-right: 1px solid}
.day-side h4{font-family: var(--fu); font-size: 10px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--ember); margin-bottom: 20px}
.day-side dl{display: flex; flex-direction: column}
.day-side dl > div{display: flex; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px dashed var(--bone-3)}
.day-side dl > div:last-child{border-bottom: none}
.day-side dt{font-family: var(--fu); font-size: 10.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--t3l)}
.day-side dd{font-family: var(--fe); font-size: 14px; color: var(--ink); text-align: right}
.day-side dd em{font-style: italic; color: var(--ember)}
.day-img{margin-top: 18px; height: 180px; background-size: cover; background-position: center}
@media(max-width:1024px){
:root{--pad: 32px}
.nav-links{display: none}
.day{grid-template-columns: 1fr; gap: 28px}
.day-no,.day-side{position: static}
.day-no .num{font-size: 64px}
}
/* footer CTA strip */
.endcta .actions{display: flex; justify-content: center; gap: 14px; flex-wrap: wrap}
/* footer */
@media(max-width:1024px){
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
.foot-main{grid-template-columns: 1fr; gap: 40px}
}
.reveal{opacity: 0; transform: translateY(28px); transition: opacity .8s var(--ex),transform .8s var(--ex)}
.reveal.in{opacity: 1; transform: none}

/* HERO */
@keyframes hz{
to{transform:scale(1)}
}
/* SWITCHER */
.switch-wrap{background: var(--bone); border-bottom: 1px solid var(--bone-3); position: sticky; top: var(--nav-h, 84px); z-index: 80; backdrop-filter: blur(20px)}
.switch{display: flex; gap: 0; height: 78px; align-items: center; overflow-x: auto}
.switch::-webkit-scrollbar{display: none}
.sw-tab{flex: 1; min-width: 220px; padding: 16px 22px; background: none; border: none; border-right: 1px solid var(--bone-3); cursor: pointer; text-align: left; transition: .3s; position: relative; height: 100%}
.sw-tab:last-child{border-right: none}
.sw-tab .n{font-family: var(--fd); font-size: 10px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); display: block; margin-bottom: 4px}
.sw-tab .t{font-family: var(--fe); font-size: 19px; color: var(--t1l); letter-spacing: -.005em; line-height: 1.15}
.sw-tab .t em{font-style: italic; color: var(--ember)}
.sw-tab .d{font-family: var(--fd); font-size: 11px; color: var(--t2l); margin-top: 4px; letter-spacing: .04em}
.sw-tab.on{background: var(--ink); border-right-color: var(--ink)}
.sw-tab.on .n{color: var(--gold)}
.sw-tab.on .t{color: #fff}
.sw-tab.on .t em{color: var(--gold-lt)}
.sw-tab.on .d{color: var(--t2d)}
.sw-tab.on::after{content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--brand-orange)}
/* COMPARE STRIP */
/* PANELS */
.badge{display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; font-size: 10.5px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; background: rgba(255,103,1,.1); color: var(--brand-orange)}
.badge.gold{background: transparent; box-shadow: inset 0 0 0 1px var(--gold); color: var(--gold)}
.badge i{font-size: 14px}
/* FACT ROW */
/* DAYS TABLE (accordion) */
.days{padding: 80px 0 40px; background: var(--paper); margin-top: 14px}
/* CALLOUT */
/* END */
.btns{display: inline-flex; gap: 14px; flex-wrap: wrap; justify-content: center}
@media(max-width:1000px){
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 40px}
}

/* HERO */
@keyframes hz{
to{transform:scale(1)}
}
.hero-meta{margin-top: 40px; display: flex; gap: 38px; flex-wrap: wrap; border-top: 1px solid rgba(255,255,255,.1); padding-top: 26px}
.hero-meta div{display: flex; flex-direction: column; gap: 4px}
.hero-meta .l{font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: rgba(244,239,230,.5)}
.hero-meta .v{font-family: var(--fe); font-size: 16px; color: #fff}
.hero-meta .v em{font-style: italic; color: var(--gold-lt)}
/* SUBNAV */
.subnav-row{display: flex; align-items: center; gap: 6px; height: 60px; overflow-x: auto}
.subnav-row::-webkit-scrollbar{display: none}
.subnav a{font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--t2l); padding: 8px 16px; position: relative; white-space: nowrap; transition: color .2s; border-bottom: 2px solid transparent}
.subnav a:hover,.subnav a.active{color: var(--brand-orange); border-bottom-color: var(--ember)}
.subnav a.active::after{transform: scaleX(1); content: ''; position: absolute; left: 16px; right: 16px; bottom: 0; height: 1px; background: var(--brand-orange)}
.subnav .back{margin-left: auto; background: var(--ink); color: #fff; padding: 10px 18px}
.subnav .back:hover{background: var(--brand-orange)}
/* ARTICLE */
.article{padding: 120px 0; background: var(--paper)}
.a-grid{display: grid; grid-template-columns: .28fr 1fr; gap: 80px; align-items: start}
.a-toc{position: sticky; top: calc(var(--nav-h, 84px) + 86px); font-size: 12px}
.a-toc h5{font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: var(--t3l); margin-bottom: 18px; padding-bottom: 12px; border-bottom: 1px solid var(--bone-3)}
.a-toc a{display: block; padding: 8px 0; color: var(--t2l); border-left: 1px solid transparent; padding-left: 14px; margin-left: -14px; transition: .2s}
.a-toc a:hover,.a-toc a.on{color: var(--brand-orange); border-left-color: var(--brand-orange)}
.prose{max-width: 780px; font-size: 17px; line-height: 1.85; color: var(--t1l)}
.prose h2{font-family: var(--fe); font-size: clamp(2rem,3.4vw,2.9rem); font-weight: 300; line-height: 1.1; letter-spacing: -.015em; color: var(--ink); margin: 80px 0 8px; font-variation-settings: "opsz" 144}
.prose h2:first-child{margin-top: 0}
.prose h2 em{font-style: italic; color: var(--ember)}
.prose .eyebrow{margin-bottom: 24px}
.prose h3{font-family: var(--fe); font-size: 26px; font-weight: 400; color: var(--ink); margin: 40px 0 12px; letter-spacing: -.01em}
.prose h4{font-family: var(--fu); font-size: 13px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--brand-orange); margin: 32px 0 10px}
.prose p{margin: 0 0 20px; color: var(--t1l)}
.prose p.lede{font-family: var(--fe); font-style: italic; font-size: 22px; line-height: 1.55; color: var(--t2l); font-weight: 300; margin-bottom: 32px}
.prose p.lede::first-letter{font-family: var(--fe); float: left; font-size: 74px; line-height: .85; padding: 8px 14px 0 0; font-weight: 500; color: var(--ember); font-style: normal}
.prose a{color: var(--brand-orange); border-bottom: 1px solid currentColor}
.prose blockquote{margin: 40px 0; padding: 26px 34px; border-left: 2px solid var(--brand-orange); background: var(--bone); font-family: var(--fe); font-style: italic; font-size: 20px; line-height: 1.5; color: var(--ink)}
.prose blockquote cite{display: block; margin-top: 12px; font-style: normal; font-family: var(--fu); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l)}
.prose ul.bul,.prose ol.num{margin: 16px 0 24px; padding-left: 0}
.prose ul.bul li{position: relative; padding-left: 28px; margin-bottom: 10px}
.prose ul.bul li::before{content: ''; position: absolute; left: 0; top: .75em; width: 14px; height: 1px; background: var(--brand-orange)}
.prose ol.num{counter-reset: x}
.prose ol.num li{counter-increment: x; position: relative; padding-left: 44px; margin-bottom: 14px}
.prose ol.num li::before{content: counter(x,decimal-leading-zero); position: absolute; left: 0; top: 0; font-family: var(--fd); font-size: 14px; font-weight: 600; color: var(--gold); letter-spacing: .05em}
.prose figure{margin: 44px 0}
.prose figure img{width: 100%; height: auto; filter: saturate(1.02)}
.prose figcaption{margin-top: 14px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--t3l); text-align: center}
.prose figcaption em{font-family: var(--fe); font-style: italic; text-transform: none; letter-spacing: 0; font-size: 13px; color: var(--t2l)}
.prose figure.wide{margin-left: calc(-1 * min(120px, 8vw)); margin-right: calc(-1 * min(120px, 8vw))}
.two-img{display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 44px 0}
.two-img img{height: 100%; object-fit: cover; aspect-ratio: 4/5}
/* CALLOUT */
.callout{margin: 44px 0; padding: 32px 34px; background: var(--ink); color: var(--t1d); position: relative}
.callout::before{content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--brand-orange)}
.callout .eyebrow{color: var(--gold-lt)}
.callout h4{font-family: var(--fe); font-size: 22px; color: #fff; margin: 12px 0 12px; font-weight: 400}
.callout p{color: var(--t2d); margin: 0; font-size: 15px}
/* END STRIP */
.endcta{padding: 120px 0; background: var(--ink); color: var(--t1d); text-align: center; border-top: 1px solid rgba(255,255,255,.06)}
.endcta h2{font-family: var(--fe); font-size: clamp(2.2rem,4vw,3.4rem); font-weight: 300; color: #fff; margin: 16px auto 22px; max-width: 720px; line-height: 1.1; letter-spacing: -.02em; font-variation-settings: "opsz" 144}
.endcta h2 em{font-style: italic; color: var(--gold-lt)}
.endcta p{font-family: var(--fe); font-style: italic; font-size: 17px; color: var(--t2d); max-width: 560px; margin: 0 auto 34px; line-height: 1.6}
.endcta .btns{display: inline-flex; gap: 14px; flex-wrap: wrap; justify-content: center}
.btn-ghost{background: transparent; color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.35)}
.btn-ghost:hover{background: var(--ink); color: #fff; box-shadow: inset 0 0 0 1px #fff}
/* FOOTER (compact) */
@media(max-width:900px){
.a-grid{grid-template-columns: 1fr; gap: 32px}
.a-toc{position: static}
.prose figure.wide{margin-left: 0; margin-right: 0}
.two-img{grid-template-columns: 1fr}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr}
}

ul,ol{list-style: none}
button{font-family: inherit}
input,textarea,select{font-family: inherit}
.eyebrow.gold{color: var(--gold)}
.nav-links a:hover{color: #fff}
/* HERO */
@keyframes hz{
to{transform:scale(1)}
}
  /* Text-safe hero overlay (used by .phero / .hero / .archive-hero / page heroes).
     Two layers: a soft global darken plus a strong bottom-weighted scrim so the
     title + lede always read on any photo colour, while the upper photo stays
     visible for beauty. Text also gets a hard shadow below. */
  .hero-veil{position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 28%, rgba(14,20,17,.16) 0%, rgba(14,20,17,.34) 55%, rgba(14,20,17,.72) 100%), linear-gradient(180deg, rgba(14,20,17,.30) 0%, rgba(14,20,17,.22) 40%, rgba(14,20,17,.96) 100%)}
  .hero-body, .phero-inner, .archive-hero .hero-body{text-shadow: 0 2px 22px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.45)}
  .hero-body h1, .hero-body .hero-sub, .hero-body .eyebrow,
  .phero h1, .phero .lede, .phero .eyebrow, .phero .crumb,
  .archive-hero .ph-h1, .archive-hero .ph-lede, .archive-hero .eyebrow, .archive-hero .crumb{text-shadow: 0 2px 24px rgba(0,0,0,.55), 0 1px 3px rgba(0,0,0,.45)}
.hero-body{position: relative; z-index: 3; flex: 1; display: grid; grid-template-columns: 1.45fr .9fr; gap: 64px; align-items: center; padding: 140px 132px 0; padding-top: 170px; width: 100%}
.crumb b{color: var(--brand-orange); font-weight: 600}
.h1-trip{font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .32em; text-transform: uppercase; color: var(--gold); margin: 0 0 22px 0; display: flex; align-items: center; gap: 14px; margin-bottom: 18px}
.hero-title em{font-style: italic; font-weight: 300; color: var(--gold-lt); position: relative; display: inline-block}
.hero-sub{max-width: 640px; font-family: var(--fe); font-size: 18px; font-weight: 300; color: var(--t2d); line-height: 1.55; margin-bottom: 42px; font-style: italic; margin-top: 22px}
.big{background: var(--ink); color: var(--t1d)}
.big .num{font-family: var(--fd); font-size: 64px; font-weight: 500; color: #fff; line-height: 1; letter-spacing: -.03em}
.big .num small{font-family: var(--fe); font-style: italic; font-size: 22px; color: var(--gold-lt); font-weight: 400}
.big .stars{color: var(--brand-orange); font-size: 18px; letter-spacing: 2px; margin-top: 4px}
.big .lbl{font-size: 10.5px; letter-spacing: .3em; text-transform: uppercase; color: var(--t3d); margin-top: 8px}
/* LAYOUT */
.wrap{padding: 80px 0 120px; background: var(--paper)}
.layout{display: grid; grid-template-columns: 280px 1fr; gap: 60px; align-items: start}
/* FILTER SIDEBAR */
.fgroup:first-child{border-top: none; padding-top: 0}
.fgroup h5{font-family: var(--fu); font-size: 10.5px; letter-spacing: .3em; text-transform: uppercase; color: var(--ink); margin-bottom: 14px; font-weight: 600; display: flex; justify-content: space-between; align-items: center; cursor: pointer}
.fgroup h5 i{font-size: 16px; transition: .3s}
.fgroup.collapsed h5 i{transform: rotate(-90deg)}
/* MAIN */
.main-head{display: flex; justify-content: space-between; align-items: end; flex-wrap: wrap; gap: 20px; margin-bottom: 32px; padding-bottom: 24px; border-bottom: 1px solid var(--bone-3)}
.chips{display: flex; flex-wrap: wrap; gap: 8px}
.achip{display: inline-flex; align-items: center; gap: 8px; background: var(--bone); color: var(--ink); padding: 6px 12px; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; border: 1px solid var(--bone-3); cursor: pointer}
.achip i{font-size: 14px}
.count{font-family: var(--fd); font-size: 26px; font-weight: 500; color: var(--ink)}
.count em{font-family: var(--fe); font-style: italic; color: var(--ember); font-size: 18px; margin-left: 6px}
.rev{background: var(--paper); border: 1px solid var(--bone-3); padding: 34px 36px; display: grid; grid-template-columns: 200px 1fr; gap: 36px; transition: .3s}
.rev:hover{border-color: var(--ink)}
.rt{font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); border: 1px solid var(--gold); padding: 4px 10px}
/* PAGINATION */
.pager button,.pager span{background: transparent; border: 1px solid var(--bone-3); color: var(--t1l); width: 40px; height: 40px; display: grid; place-items: center; cursor: pointer; font-family: var(--fd); font-size: 13px; transition: .25s}
.pager button:hover,.pager .on{background: var(--ink); color: #fff; border-color: var(--ink)}
.pager .arr{width: auto; padding: 0 18px; font-family: var(--fu); font-size: 11px; letter-spacing: .2em; text-transform: uppercase}
/* WRITE MODAL */
.modal{position: fixed; inset: 0; background: rgba(6,8,7,.7); backdrop-filter: blur(6px); z-index: 10000; display: none; align-items: center; justify-content: center; padding: 40px 20px; overflow-y: auto}
.modal.on{display: flex}
.form-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 18px}
.f-row{display: flex; flex-direction: column; gap: 6px}
.f-row.full{grid-column: 1/-1}
.f-row label{font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); font-weight: 600}
.f-row input,.f-row select,.f-row textarea{background: #fff; border: 1px solid var(--bone-3); padding: 12px 14px; font-size: 14px; color: var(--t1l); transition: border-color .25s}
.f-row input:focus,.f-row select:focus,.f-row textarea:focus{outline: none; border-color: var(--brand-orange)}
.f-row textarea{resize: vertical; min-height: 130px; font-family: var(--fu); line-height: 1.6}
.tag-row{display: flex; flex-wrap: wrap; gap: 6px}
.tag-row label{background: var(--bone); padding: 6px 12px; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--t2l); cursor: pointer; transition: .2s; border: 1px solid var(--bone-3)}
.tag-row input{position: absolute; opacity: 0}
.tag-row input:checked+span{color: var(--brand-orange)}
.tag-row label:has(input:checked){background: rgba(255,103,1,.08); border-color: var(--brand-orange); color: var(--brand-orange)}
.consent{font-size: 11.5px; color: var(--t3l); display: flex; align-items: flex-start; gap: 10px; line-height: 1.55}
.submit{background: var(--brand-orange); color: #fff; border: none; padding: 16px 34px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; cursor: pointer; transition: .25s; font-weight: 500}
.submit:hover{background: var(--ember-dk)}
.foot-col li{margin-bottom: 10px}
@media(max-width:1000px){
.layout{grid-template-columns: 1fr}
.side{position: fixed; inset: 0 20% 0 0; z-index: 9600; background: #FAF6EF; max-height: none; overflow-y: auto; padding: 24px; transform: translateX(-105%); transition: transform .4s cubic-bezier(.16,1,.3,1); box-shadow: 8px 0 40px rgba(14,20,17,.18)}
.rev{grid-template-columns: 1fr; gap: 20px}
.nav-links{display: none}
.foot-main{grid-template-columns: 1fr 1fr; gap: 40px}
.form-grid{grid-template-columns: 1fr}
}

/* ═════════════ TOKENS (same as Homepage v4) ═════════════ */
*,*::before,*::after{margin: 0; padding: 0; box-sizing: border-box}
html{font-size: 16px; scroll-behavior: smooth; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; scroll-padding-top: 150px}
a{text-decoration: none; color: inherit}
ul{list-style: none}
i.ph{vertical-align: middle}
::selection{background: var(--ember); color: #fff}
.container{max-width: var(--maxw); margin: 0 auto; padding: 0 var(--pad)}
.eyebrow{font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .32em; text-transform: uppercase; color: var(--ember); display: inline-flex; align-items: center; gap: 14px}
.eyebrow::before{content: ''; width: 28px; height: 1px; background: currentColor; opacity: .9}
.eyebrow.light{color: var(--gold-lt)}
.btn{display: inline-flex; align-items: center; gap: 12px; font-family: var(--fu); font-size: 13px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; padding: 16px 26px; transition: all .35s var(--ex); cursor: pointer; border: none; position: relative; border-radius: 0; overflow: hidden}
.btn .arr{display: inline-flex; width: 22px; height: 1px; background: currentColor; position: relative; transition: width .35s var(--ex)}
.btn .arr::after{content: ''; position: absolute; right: -1px; top: -3px; width: 7px; height: 7px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg)}
.btn:hover .arr{width: 34px; transition: width .35s var(--ex)}
.btn-fill{background: var(--brand-orange); color: #fff}
.btn-fill:hover{background: var(--brand-orange-dk)}
.btn-line-dark{background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1px rgba(22,29,25,.3)}
.btn-line-dark:hover{box-shadow: inset 0 0 0 1px var(--ink); background: rgba(22,29,25,.03)}
.btn-line-light{background: transparent; color: var(--t1d); box-shadow: inset 0 0 0 1px rgba(255,255,255,.25)}
.btn-line-light:hover{box-shadow: inset 0 0 0 1px rgba(255,255,255,.7); background: rgba(255,255,255,.04)}
.link-arrow{display: inline-flex; align-items: center; gap: 10px; font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: inherit; padding-bottom: 6px; border-bottom: 1px solid currentColor; transition: gap .3s var(--ex),color .25s}
.link-arrow:hover{gap: 18px; color: var(--ember)}
/* ═════════════ NAV ═════════════ */
.nav.on-dark{background: transparent}
.nav.scrolled{background: rgba(14,20,17,.82); backdrop-filter: blur(28px) saturate(140%); border-bottom-color: rgba(255,255,255,.06); -webkit-backdrop-filter: blur(28px) saturate(140%)}
.brand{display: flex; align-items: center; gap: 14px; margin-right: auto}
.nav-links{display: flex; gap: 36px}
.nav-links a{font-family: var(--fu); font-size: 13px; color: rgba(244,239,230,.78); letter-spacing: .04em; transition: color .2s; position: relative; padding: 6px 0; font-weight: 400}
.nav-links a:hover,.nav-links a.active{color: #fff}
.nav-cta:hover{background: var(--ember); box-shadow: inset 0 0 0 1px var(--brand-orange); transform: translateY(-1px); border-color: var(--ember)}
/* ═════════════ HERO / PAGE HEADER ═════════════ */
.page-hero{position: relative; min-height: 78vh; display: flex; align-items: flex-end; color: #fff; overflow: hidden; padding-bottom: 80px; padding-top: 160px}
.ph-bg{position: absolute; inset: 0; background: linear-gradient(180deg,rgba(14,20,17,.45) 0%,rgba(14,20,17,.15) 35%,rgba(14,20,17,.55) 80%,rgba(14,20,17,.9) 100%),
  linear-gradient(158deg,#1A2420,#0E1411) center 40%/cover no-repeat; filter: saturate(.85)}
.ph-grain{position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,.05) 1px,transparent 1px); background-size: 3px 3px; opacity: .5; pointer-events: none; mix-blend-mode: overlay}
.ph-inner{position: relative; z-index: 2; width: 100%}
.crumb{display: flex; gap: 10px; align-items: center; font-family: var(--fu); font-size: 11px; letter-spacing: .28em; text-transform: uppercase; color: rgba(244,239,230,.7); margin-bottom: 36px; flex-wrap: wrap}
.crumb a{color: rgba(244,239,230,.7); transition: color .2s}
.crumb a:hover{color: var(--gold-lt)}
.crumb span.sep{color: rgba(244,239,230,.35)}
.crumb .cur{color: var(--gold-lt)}
.ph-eyebrow{color: var(--gold-lt); display: inline-flex; align-items: center; gap: 14px; font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .32em; text-transform: uppercase; margin-bottom: 22px}
.ph-eyebrow::before{content: ''; width: 28px; height: 1px; background: currentColor}
.ph-h1{font-family: var(--fe); font-weight: 400; font-variation-settings: "opsz" 144; font-size: clamp(3rem,7vw,6.2rem); line-height: 1; letter-spacing: -.02em; max-width: 14ch}
.ph-h1 em{font-style: italic; font-weight: 300; color: var(--gold-lt)}
.ph-lede-wrap{display: grid; grid-template-columns: 1fr 1fr; gap: 80px; margin-top: 44px; align-items: end}
.ph-lede{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: 1.25rem; line-height: 1.6; color: rgba(244,239,230,.82); max-width: 56ch}
.ph-lede-more{display: none}
.ph-lede.expanded .ph-lede-more{display: inline}
.ph-readmore{font-family: var(--fu); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold-lt); cursor: pointer; background: none; border: none; padding: 8px 0; border-bottom: 1px solid var(--gold-lt); margin-top: 14px; transition: color .2s}
.ph-readmore:hover{color: #fff}
.ph-facts{display: grid; grid-template-columns: repeat(3,1fr); gap: 0; border-top: 1px solid rgba(255,255,255,.14); border-bottom: 1px solid rgba(255,255,255,.14)}
.ph-fact{padding: 22px 26px; border-right: 1px solid rgba(255,255,255,.1)}
.ph-fact:last-child{border-right: none}
.ph-fact .num{font-family: var(--fd); font-size: 2rem; font-weight: 500; color: #fff; line-height: 1; letter-spacing: -.02em}
.ph-fact .num sup{font-size: .55em; color: var(--gold-lt); vertical-align: top; font-weight: 400; margin-left: 2px}
.ph-fact .lbl{font-family: var(--fu); font-size: 10px; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; color: rgba(244,239,230,.55); margin-top: 10px}
/* ═════════════ CATEGORY RAIL ═════════════ */
/* .cat-rail / .cat-row / .cat-chip category strip removed: no template or script emits it (journal categories use .topics, trip archives use the filter bar). Dead weight, gone. */
/* ═════════════ LAYOUT ═════════════ */
  .archive{padding: 64px 0 0; background: var(--paper)}
  /* the breathing room belongs to the SECTION only. WordPress also puts .archive on the <body> of every archive page, so a bottom padding on the shared .archive rule painted 104px of paper BELOW the site footer the report was 104px of stray paper at the end of the page. */
.archive-grid{display: grid; grid-template-columns: 300px 1fr; gap: 56px; align-items: flex-start}
/* ═════════════ SIDEBAR FILTERS ═════════════ */
.side{position: sticky; top: 100px; max-height: calc(100vh - 120px); overflow-y: auto; padding-right: 8px}
.side::-webkit-scrollbar{width: 4px}
.side::-webkit-scrollbar-thumb{background: rgba(22,29,25,.15)}
.side-head{display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; padding-bottom: 18px; border-bottom: 1px solid rgba(22,29,25,.12)}
.side-head h3{font-family: var(--fe); font-size: 1.5rem; font-weight: 400; letter-spacing: -.01em}
.side-head h3 em{font-style: italic; color: var(--ember)}
.side-clear{font-family: var(--fu); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--t3l); cursor: pointer; background: none; border: none; transition: color .2s}
.side-clear:hover{color: var(--ember)}
.fgroup{border-top: 1px solid var(--bone-3); padding: 18px 0; border-bottom: 1px solid rgba(22,29,25,.08)}
.fgroup:last-child{border-bottom: none}
.fg-head{display: flex; align-items: center; justify-content: space-between; cursor: pointer; user-select: none}
.fg-head h4{font-family: var(--fu); font-size: 11px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--ink)}
.fg-head .ic{transition: transform .3s; color: var(--t3l); font-size: 16px}
.fgroup.closed .fg-head .ic{transform: rotate(-90deg)}
.fg-body{margin-top: 16px; display: flex; flex-direction: column; gap: 10px; transition: max-height .4s var(--ex),opacity .3s,margin .3s; overflow: hidden; max-height: 600px}
.fgroup.closed .fg-body{max-height: 0; opacity: 0; margin-top: 0}
.chk{display: flex; align-items: center; gap: 10px; cursor: pointer; font-family: var(--fu); font-size: 13.5px; color: var(--t2l); transition: color .2s; padding: 2px 0}
.chk:hover{color: var(--ink)}
.chk input{position: absolute; opacity: 0; pointer-events: none}
.chk .box{width: 16px; height: 16px; border: 1px solid rgba(22,29,25,.3); display: grid; place-items: center; flex-shrink: 0; transition: all .2s; background: #fff}
.chk input:checked ~ .box{background: var(--ember); border-color: var(--ember)}
.chk input:checked ~ .box::after{content: ''; width: 8px; height: 4px; border-left: 1.5px solid #fff; border-bottom: 1.5px solid #fff; transform: rotate(-45deg) translate(1px,-1px)}
.chk .cnt{margin-left: auto; font-family: var(--fd); font-size: 11px; color: var(--t3l)}
.chk input:checked ~ .lbl{color: var(--ink); font-weight: 500}
.pill-row{display: flex; flex-wrap: wrap; gap: 6px}
.pill-btn:hover{border-color: var(--ink); color: var(--ink)}
.pill-btn.on{background: var(--ink); color: #fff; border-color: var(--ink)}
.slider-wrap{padding: 6px 4px 2px}
.slider-vals{display: flex; justify-content: space-between; font-family: var(--fd); font-size: 12px; color: var(--ink); margin-bottom: 10px}
.slider-vals span:last-child{color: var(--ember)}
input[type=range]{width: 100%; accent-color: var(--ember)}
.range-labels{display: flex; justify-content: space-between; font-family: var(--fu); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--t3l); margin-top: 6px}
/* ═════════════ RESULTS TOOLBAR ═════════════ */
.results-head{display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 32px; gap: 24px; flex-wrap: wrap}
.results-head .rh-left h2{font-family: var(--fe); font-size: 2rem; font-weight: 400; letter-spacing: -.01em; line-height: 1.1}
.results-head .rh-left h2 em{font-style: italic; color: var(--ember); font-weight: 300}
.results-head .rh-left p{font-family: var(--fu); font-size: 13px; color: var(--t3l); margin-top: 6px; letter-spacing: .02em}
.rh-right{display: flex; align-items: center; gap: 14px}
.sort{border: 1px solid var(--bone-3); background: var(--paper); padding: 10px 14px; font-size: 12px; letter-spacing: .06em; color: var(--t1l); position: relative}
.sort-btn{display: inline-flex; align-items: center; gap: 10px; font-family: var(--fu); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); background: transparent; border: 1px solid rgba(22,29,25,.2); padding: 12px 18px; cursor: pointer; transition: all .2s}
.sort-btn:hover{border-color: var(--ink)}
.sort-btn i.ph{font-size: 14px; color: var(--t3l)}
/* ═════════════ ACTIVE FILTER CHIPS ═════════════ */
.active-chips{display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px}
.ach{display: inline-flex; align-items: center; gap: 8px; font-family: var(--fu); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; padding: 8px 12px; background: var(--ink); color: #fff; border-radius: 999px}
.ach i.ph{font-size: 12px; cursor: pointer; opacity: .7; transition: opacity .2s}
.ach i.ph:hover{opacity: 1}
/* ═════════════ TRIP CARDS (LIST) ═════════════ */
.trips{display: flex; flex-direction: column; gap: 28px}
.trip{display: grid; grid-template-columns: 380px 1fr; background: #fff; border: 1px solid rgba(22,29,25,.08); transition: transform .5s var(--ex),box-shadow .5s var(--ex),border-color .3s; overflow: hidden; position: relative}
.trip:hover{transform: translateY(-3px); box-shadow: 0 32px 60px -30px rgba(14,20,17,.28); border-color: rgba(22,29,25,.16)}
.trip-media{position: relative; overflow: hidden; min-height: 340px}
.trip-media img{width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ex)}
.trip:hover .trip-media img{transform: scale(1.06)}
.trip-media::after{content: ''; position: absolute; inset: 0; background: linear-gradient(180deg,transparent 40%,rgba(14,20,17,.55) 100%); pointer-events: none}
.tm-tag{position: absolute; top: 16px; left: 16px; font-family: var(--fu); font-size: 9.5px; letter-spacing: .28em; text-transform: uppercase; background: rgba(255,255,255,.92); color: var(--ink); padding: 8px 12px; z-index: 2; font-weight: 600}
.tm-tag.hot{background: var(--ember); color: #fff}
.tm-tag.new{background: var(--gold); color: #fff}
.tm-num{position: absolute; bottom: 14px; left: 16px; font-family: var(--fd); font-size: .75rem; letter-spacing: .28em; text-transform: uppercase; color: rgba(255,255,255,.85); z-index: 2}
.tm-num strong{font-size: 1.1rem; color: #fff; font-weight: 500; margin-right: 6px}
.tm-region{position: absolute; bottom: 14px; right: 16px; font-family: var(--fe); font-style: italic; font-size: 13px; color: #fff; z-index: 2; display: inline-flex; align-items: center; gap: 6px}
.trip-body{padding: 32px 36px; display: flex; flex-direction: column; position: relative}
.tb-rating{display: inline-flex; align-items: center; gap: 8px; font-family: var(--fu); font-size: 11px; color: var(--t3l); letter-spacing: .08em; margin-bottom: 10px}
.tb-rating .stars{color: var(--gold); letter-spacing: .05em}
.tb-rating strong{color: var(--ink); font-weight: 600; font-family: var(--fd)}
.trip h3{font-family: var(--fe); font-size: 1.85rem; font-weight: 400; line-height: 1.1; letter-spacing: -.01em; color: var(--ink); margin-bottom: 6px}
.trip h3 a:hover{color: var(--ember)}
.trip .sub{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: 15px; color: var(--t2l); margin-bottom: 16px}
.trip p.blurb{font-family: var(--fu); font-size: 14.5px; font-weight: 300; line-height: 1.7; color: var(--t2l); margin-bottom: 22px; max-width: 62ch}
.tb-facts{display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px 24px; padding: 14px 0 16px; border-top: 1px solid rgba(22,29,25,.08); border-bottom: 1px solid rgba(22,29,25,.08); margin-bottom: 20px}
.tf{display: flex; flex-direction: column; gap: 3px; min-width: 0}
.tf .lb{font-family: var(--fu); font-size: 10px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--t3l)}
.tf .vl{font-family: var(--fd); font-size: 14px; color: var(--ink); font-weight: 500; display: inline-flex; align-items: center; gap: 6px; min-width: 0; overflow-wrap: anywhere}
.tf .vl i.ph{font-size: 14px; color: var(--gold); flex-shrink: 0}
.tb-foot{margin-top: auto; display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap}
.price{display: flex; flex-direction: column; gap: 2px}
.price .from{font-family: var(--fu); font-size: 9.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--t3l)}
.price .amt{font-family: var(--fd); font-size: 1.8rem; font-weight: 500; color: var(--ink); line-height: 1; letter-spacing: -.02em}
.price .amt small{font-size: .55em; font-weight: 400; color: var(--t3l); margin-left: 4px; font-family: var(--fu); letter-spacing: .06em}
.price .per{font-family: var(--fe); font-style: italic; font-size: 12px; color: var(--t3l); margin-top: 2px}
.tb-cta{display: flex; gap: 10px}
.btn-sm{padding: 12px 20px; font-size: 11px; letter-spacing: .14em}
.trip .ribbon{position: absolute; top: 24px; right: -4px; background: var(--ember); color: #fff; font-family: var(--fu); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; padding: 6px 14px; z-index: 3}
.trip .ribbon::after{content: ''; position: absolute; right: 0; bottom: -4px; border-top: 4px solid var(--ember-dk); border-right: 4px solid transparent}
/* GRID view alt */
.trips.grid-view{display: grid; grid-template-columns: repeat(2,1fr); gap: 28px}
.trips.grid-view .trip{grid-template-columns: 1fr; grid-template-rows: 280px auto}
.trips.grid-view .trip-media{min-height: 0}
.trips.grid-view .trip-body{padding: 26px 28px}
.trips.grid-view h3{font-size: 1.5rem}
.trips.grid-view p.blurb{display: none}
/* ═════════════ PAGINATION ═════════════ */
.pager{margin-top: 56px; display: flex; justify-content: space-between; gap: 24px; align-items: center; flex-wrap: wrap; padding-top: 32px; border-top: 1px solid rgba(22,29,25,.08)}
.pager .load-more{background: var(--ink); color: #fff; padding: 20px 40px; font-family: var(--fu); font-size: 12px; letter-spacing: .24em; text-transform: uppercase; border: none; cursor: pointer; display: inline-flex; align-items: center; gap: 14px; transition: background .3s}
.pager .load-more:hover{background: var(--ember)}
.pager .prog{font-family: var(--fu); font-size: 12px; letter-spacing: .14em; color: var(--t3l)}
.pager .prog strong{color: var(--ink); font-family: var(--fd); font-size: 14px}
.pnums{display: flex; gap: 6px; flex-wrap: wrap}
.pnums a{width: 38px; height: 38px; display: grid; place-items: center; font-family: var(--fd); font-size: 13px; color: var(--t2l); border: 1px solid rgba(22,29,25,.14); transition: all .25s}
.pnums a:hover{border-color: var(--ink); color: var(--ink)}
.pnums a.on{background: var(--ink); color: #fff; border-color: var(--ink)}
/* paginate_links 'plain' markup: current page is a <span>, dots are a bare span; style them as part of the same rhythm. */
.pnums .page-numbers{width: 38px; height: 38px; display: grid; place-items: center; font-family: var(--fd); font-size: 13px; color: var(--t2l); border: 1px solid rgba(22,29,25,.14); transition: all .25s; text-decoration: none}
.pnums a.page-numbers:hover{border-color: var(--ink); color: var(--ink)}
.pnums .page-numbers.current{background: var(--ink); color: #fff; border-color: var(--ink)}
.pnums .page-numbers.dots{border-color: transparent; color: var(--t3l); letter-spacing: .1em}
.pnums .page-numbers.prev,.pnums .page-numbers.next{width: 44px}
.pnums .scr{position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap}
.pager-count{font-family: var(--fu); font-size: 12px; letter-spacing: .14em; color: var(--t3l); text-transform: uppercase}
.pager-count strong{font-family: var(--fd); color: var(--ink); font-size: 14px}
@media(max-width:760px){
  .pnums .page-numbers,.pnums a{width: 44px; height: 44px}
  .pnums .page-numbers.prev,.pnums .page-numbers.next{width: 52px}
  .pager{gap: 16px}
}
/* mobile filter drawer: a close affordance inside the drawer (it opens over the page; there was no way to dismiss it). */
.side-close{display: none}
@media(max-width:960px){
  .side-close{display: inline-flex; align-items: center; gap: 8px; width: 100%; justify-content: flex-end; background: none; border: none; font-family: var(--fu); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--ink); cursor: pointer; padding: 4px 0 18px}
  .side-close i{font-size: 18px}
}
/* ═════════════ HELP / CTA STRIP ═════════════ */
.helper{background: var(--ink); color: var(--t1d); padding: 96px 0}
.helper-in{display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: center}
.helper h2{font-family: var(--fe); font-size: clamp(2rem,3.6vw,3.2rem); font-weight: 400; letter-spacing: -.02em; line-height: 1.05}
.helper h2 em{font-style: italic; color: var(--gold-lt)}
.helper p{font-family: var(--fu); font-size: 15.5px; font-weight: 300; color: rgba(244,239,230,.75); line-height: 1.7; margin-top: 20px; max-width: 52ch}
.helper-acts{display: flex; flex-direction: column; gap: 14px}
.helper-note{font-family: var(--fe); font-style: italic; font-size: 14px; color: rgba(244,239,230,.6); display: inline-flex; align-items: center; gap: 10px}
.helper-note i.ph{color: var(--gold-lt)}
/* ═════════════ FOOTER (same as v4) ═════════════ */
.foot-main{display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 64px; margin-bottom: 80px; padding-bottom: 50px; border-bottom: 1px solid rgba(255,255,255,.06)}
.foot-sub{font-family: var(--fu); font-size: 10px; letter-spacing: .32em; text-transform: uppercase; color: rgba(244,239,230,.4); margin-top: 4px}
.foot-desc{font-family: var(--fe); font-style: italic; font-size: 15px; font-weight: 300; color: rgba(244,239,230,.65); line-height: 1.65; margin-bottom: 28px; max-width: 340px}
.foot-soc{display: flex; gap: 10px; margin-bottom: 28px}
.fsoc{width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.15); display: grid; place-items: center; color: rgba(244,239,230,.65); transition: all .3s; border-radius: 50%}
.fsoc:hover{background: var(--ember); border-color: var(--ember); color: #fff}
.foot-cred{display: flex; gap: 8px; flex-wrap: wrap}
.fcred{font-family: var(--fu); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: rgba(244,239,230,.5); padding: 6px 12px; border: 1px solid rgba(255,255,255,.1); font-weight: 500; box-shadow: inset 0 0 0 1px rgba(214,185,126,.28)}
.foot-col h4{font-family: var(--fu); font-size: 11px; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: var(--gold-lt); margin-bottom: 24px}
.foot-col ul{display: flex; flex-direction: column; gap: 14px}
.foot-col a{font-family: var(--fe); font-style: italic; font-size: 15px; color: rgba(244,239,230,.72); transition: color .25s,padding-left .25s; font-weight: 400}
.foot-col a:hover{color: var(--ember); padding-left: 6px}
.foot-contact li{display: flex; align-items: flex-start; gap: 14px; margin-bottom: 18px}
.foot-contact i.ph{color: var(--gold-lt); font-size: 18px; margin-top: 2px; flex-shrink: 0}
.foot-contact .lbl{display: block; font-family: var(--fu); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: rgba(244,239,230,.45); margin-bottom: 4px}
.foot-contact .val{font-family: var(--fe); font-style: italic; font-size: 15px; color: rgba(244,239,230,.85)}
.foot-bottom{display: flex; align-items: center; justify-content: space-between; padding-top: 32px; border-top: 1px solid rgba(255,255,255,.06); font-family: var(--fu); font-size: 12px; color: rgba(244,239,230,.4); letter-spacing: .04em; flex-wrap: wrap; gap: 18px}
.foot-bottom .legal{display: flex; gap: 24px}
.foot-bottom a:hover{color: var(--gold-lt)}
/* Mobile filter toggle */
.mobile-filter-bar{display: none; position: sticky; top: 60px; z-index: 40; background: var(--paper); padding: 12px 0; border-bottom: 1px solid rgba(22,29,25,.08)}
.mfilter-btn{width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-family: var(--fu); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; background: var(--ink); color: #fff; padding: 14px; border: none; cursor: pointer}
/* ═════════════ RESPONSIVE ═════════════ */
@media(max-width:1100px){
:root{--pad: 32px}
.nav-links{display: none}
.archive-grid{grid-template-columns: 1fr; gap: 32px}
.side{position: static; max-height: none; overflow: visible; display: none; background: #fff; padding: 24px; border: 1px solid rgba(22,29,25,.1)}
.side.open{display: block}
.mobile-filter-bar{display: block}
.trip{grid-template-columns: 1fr; grid-template-rows: auto auto}
.trip-media{min-height: 260px}
.ph-lede-wrap{grid-template-columns: 1fr; gap: 36px}
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
.helper-in{grid-template-columns: 1fr; gap: 36px}
.trips.grid-view{grid-template-columns: 1fr}
}
@media(max-width:640px){
.tb-facts{gap: 10px 16px}
.foot-main{grid-template-columns: 1fr; gap: 40px}
.results-head{flex-direction: column; align-items: flex-start}
}
/* THEME CUSTOM OVERRIDES — DYNAMIC LOGIC */
/* Hero — critical responsive 320-460 */
.hero{position: relative; min-height: 60vh; width: 100%; display: flex; flex-direction: column; background: var(--color-dark); overflow: hidden; color: var(--t1d); align-items: center; padding-bottom: 60px; justify-content: center}
.hero__image{position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center}
.hero::after,
.brand-image-wrap::after{content: ''; position: absolute; inset: 0; background: var(--color-overlay); opacity: var(--color-overlay-opacity); pointer-events: none; z-index: 1}
.hero__content{position: relative; z-index: 2; color: var(--color-white); text-align: center; padding: var(--container-padding); max-width: var(--container-max); width: 100%}
.trip-hero__title{font-family: var(--font-heading); font-size: var(--text-hero-h1); font-weight: 700; line-height: 1.05; word-break: break-word; hyphens: auto}
@media (max-width: 460px){
.hero{min-height: 100vh}
.hero__content{padding-top: calc(var(--header-height-mobile) + 2rem); padding-bottom: 2rem}
.trip-hero__title{font-size: clamp(1.5rem, 7vw, 2.25rem)}
}
@media (max-width: 320px){
.trip-hero__title{font-size: 1.5rem; line-height: 1.1}
}
/* DYNAMIC THEME OVERRIDES */
.site-logo{display: flex; align-items: center; gap: 10px; text-decoration: none}
.footer .site-logo__text{color: #fff}
.foot-brand{display: flex; align-items: center; gap: 12px; margin-bottom: 24px}
.brand-image-wrap{position: relative; overflow: hidden; border-radius: var(--border-radius)}
/* Inquiry popup — : a managed dialog. Centred card on desktop, a true bottom sheet on phones (slide-up, grab handle, safe-area padding), and a real 44px close button that always sits clear of the form content. */
.thg-modal{position: fixed; inset: 0; z-index: 10000; display: none}
.thg-modal.open{display: block}
body.modal-open{overflow: hidden}
.thg-modal__backdrop{position: absolute; inset: 0; background: rgba(14,20,17,.72); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); animation: thgFadeIn .3s ease}
.thg-modal__panel{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: var(--paper); width: min(560px,92vw); max-height: 90vh; overflow-y: auto; padding: 60px 32px 36px; border: 1px solid var(--bone-3); border-radius: 6px; box-shadow: 0 40px 90px rgba(10,14,12,.35); animation: thgModalIn .34s var(--ex)}
/* top padding keeps the first field's (full-width) label box clear of the
   44px close button, which sits 14px from the top */
.thg-modal__content{position: relative}
.thg-modal__close{position: absolute; top: 14px; right: 14px; z-index: 6; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--bone-3); border-radius: 50%; background: var(--paper); color: var(--t2l); cursor: pointer; transition: background .25s var(--ex), color .25s var(--ex), border-color .25s var(--ex), transform .25s var(--ex)}
.thg-modal__close i{font-size: 19px; line-height: 1; font-style: normal}
.thg-modal__close:hover{background: var(--ink); border-color: var(--ink); color: var(--paper); transform: rotate(90deg)}
.thg-modal__close:focus-visible{outline: 2px solid var(--ember); outline-offset: 3px}
@keyframes thgFadeIn{from{opacity: 0} to{opacity: 1}}
@keyframes thgModalIn{from{opacity: 0; transform: translate(-50%,-46%)} to{opacity: 1; transform: translate(-50%,-50%)}}
@media (max-width: 768px){
  /* bottom sheet: full width, pinned to the bottom, slides up */
  .thg-modal__panel{top: auto; bottom: 0; left: 0; right: 0; width: 100%; max-height: 88vh; max-height: 88svh; transform: none; border: 0; border-top: 1px solid var(--bone-3); border-radius: 16px 16px 0 0; padding: 14px 20px calc(24px + env(safe-area-inset-bottom)); animation: thgSheetUp .4s var(--ex)}
  .thg-modal__panel::before{content: ''; position: sticky; top: 0; display: block; width: 44px; height: 4px; border-radius: 2px; background: var(--bone-3); margin: 0 auto 10px; z-index: 7}
  .thg-modal__content{padding-top: 28px} /* keeps the label box clear of the close button */
  .thg-modal__close{top: 10px; right: 10px}
  @keyframes thgSheetUp{from{transform: translateY(26px); opacity: .4} to{transform: translateY(0); opacity: 1}}
}

.dates-table-wrap{overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--bone-3)}
@media(max-width:460px){
.hero{min-height: 100svh}
.hero-body{padding: 120px 20px 0}
.container{padding: 0 20px}
}
@media(max-width:320px){
.hero-title{font-size: 2rem !important; line-height: .95; letter-spacing: -.02em}
.nav-row{height: 64px !important; gap: 16px !important}
}
/* ADDITIONAL FIXES FOR PERFECT PIXEL & RESPONSIVE & OVERLAY BEST FIT */
/* Transparent overlay best fit - brand maintains, font readable, low quality images kept perfect */
.brand-image-wrap.has-overlay::after{content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(14,20,17,0.15) 0%, rgba(14,20,17,0.45) 60%, rgba(14,20,17,0.65) 100%); opacity: 1; pointer-events: none; z-index: 1}
.brand-image-wrap.has-overlay.has-ink::after{background: var(--ink); opacity: var(--color-overlay-opacity,0.45)}
.hero .brand-image-wrap.has-overlay::after{background: radial-gradient(120% 80% at 20% 50%,rgba(14,20,17,.85) 0%,rgba(14,20,17,.5) 40%,rgba(14,20,17,.15) 70%,transparent 100%), linear-gradient(to bottom,rgba(14,20,17,.45) 0%,transparent 35%,rgba(14,20,17,.2) 60%,rgba(14,20,17,.92) 100%); opacity: 1}
/* Content trim — line-clamp is for card titles ONLY.
   Do NOT apply to .sec-h: it is a major H2 that must render as a normal
   block so the .sec-head grid (title-LEFT / note-RIGHT) works and inline
   children like <em> keep their color. `-webkit-line-clamp` on a grid
   child collapses its intrinsic size and can strip inline child styling
   in Chromium — that is what broke the Route section heading. */
.trip-card__title, .jcard-name, .hero-title, .ph-h1{display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis}
.trip-card__title{-webkit-line-clamp: 2; line-clamp: 2; min-height: 2.4em}
.jcard-name{font-family: var(--fe); font-size: 1.75rem; font-weight: 400; color: #fff; line-height: 1.1; letter-spacing: -.01em; margin-bottom: 16px; -webkit-line-clamp: 2; line-clamp: 2; min-height: 2.5em}
.trip-card__sub{-webkit-line-clamp: 2; line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; min-height: 3em}
.hero-title{font-family: var(--fe); color: #fff; font-size: clamp(2.4rem,5.2vw,4.6rem); font-weight: 300; line-height: 1.02; letter-spacing: -.02em; font-variation-settings: "opsz" 144; margin-bottom: 30px; max-width: 1000px; -webkit-line-clamp: 4; line-clamp: 4; word-break: break-word; hyphens: auto}
/* Images height & width responsive dynamic */
.trip-card__media, .jcard-img, .gallery-item, .brand-image-wrap{position: relative; overflow: hidden; width: 100%}
.trip-card__media{aspect-ratio: 3/2}
.trip-card__media img, .jcard-img div, .gallery-item img, .brand-image-wrap img{width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 1s var(--ex)}
.jcard-img{position: relative; height: 440px; overflow: hidden; aspect-ratio: 3/2}
.jcard-img div{width: 100%; height: 100%; background-size: cover; background-position: center}
.gallery-item{aspect-ratio: 4/3}
.hero-bg{position: absolute; inset: 0; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover; transform: scale(1.05); animation: hz 18s var(--ex) forwards; filter: saturate(1.05); width: 100%; height: 100%; object-fit: cover; background-size: cover; background-position: center 40%}
/* Responsive image heights per device */
@media(max-width:1100px){
.trip-card__media{aspect-ratio: 4/3}
.jcard-img{aspect-ratio: 4/3}
}
@media(max-width:640px){
.trip-card__media{aspect-ratio: 16/10}
.hero-bg{background-position: center 30%}
}
@media(max-width:460px){
.trip-card__media{aspect-ratio: 16/10; min-height: 220px}
.jcard-img{aspect-ratio: 16/10; min-height: 220px}
.gallery-item{aspect-ratio: 1/1; min-height: 220px}
.hero-bg{height: 100%}
}
@media(max-width:375px){
.trip-card__media{min-height: 200px}
}
@media(max-width:320px){
.trip-card__media{min-height: 180px}
}
/* Header & Mega Menu - perfect mobile */
.nav-toggle{display: none; width: 36px; height: 36px; position: relative; background: transparent; border: 1px solid rgba(255,255,255,.2); cursor: pointer}
.nav-toggle .line{position: absolute; left: 8px; right: 8px; height: 1px; background: #fff; transition: all .3s var(--ex)}
.nav-toggle .line:first-child{top: 12px}
.nav-toggle .line:last-child{top: 22px}
.nav-toggle[aria-expanded="true"] .line:first-child{transform: rotate(45deg) translate(5px,5px)}
.nav-toggle[aria-expanded="true"] .line:last-child{transform: rotate(-45deg) translate(5px,-5px)}
.mobile-menu{position: fixed; inset: 0; z-index: 9500; background: var(--paper); transform: translateX(100%); transition: transform .5s var(--ex); overflow-y: auto; -webkit-overflow-scrolling: touch}
.mobile-menu.open{transform: translateX(0)}
.mobile-menu__head{display: flex; justify-content: space-between; align-items: center; padding: 20px var(--pad); border-bottom: 1px solid var(--bone-3); position: sticky; top: 0; background: var(--paper); z-index: 1}
.mobile-menu__body{padding: 0 var(--pad) 32px}
.mobile-nav{display: flex; flex-direction: column}
.mobile-nav .menu-item{border-bottom: 1px solid var(--bone-2); position: relative}
.mobile-nav .menu-item a{display: flex; align-items: center; padding: 18px 0; font-family: var(--fe); font-size: 22px; color: var(--t1l); transition: color .2s}
.mobile-nav .menu-item-has-children > a::after{content: '+'; margin-left: auto; padding-left: 16px; font-family: var(--fu); font-size: 19px; line-height: 1; color: var(--brand-orange,#FF6701); transition: transform .3s, color .3s}
.mobile-nav .menu-item-has-children.open > a::after{transform: rotate(45deg); color: var(--ink)}
.mobile-nav .sub-menu{display: none; background: var(--bone); margin: 0 -20px; padding: 12px 20px}
.mobile-nav .menu-item-has-children.open > .sub-menu{display: block} /* direct child only — nested levels reveal on their own tap */
.mobile-nav .sub-menu a{font-size: 16px; padding: 12px 0; border-bottom: 1px solid var(--bone-3)}
.mobile-nav .sub-menu li:last-child a{border-bottom: none}
body.menu-open{overflow: hidden; position: fixed; width: 100%}
body.modal-open{overflow: hidden}
@media(max-width:820px){
.nav-links{display: none}
.nav-toggle{display: block}
.nav-row{height: 72px !important; gap: 24px !important}
.mega{display: none !important}
/* Hide mega on mobile, use mobile menu accordion */
.mega-backdrop{display: none !important}
}
/* Footer responsive perfect */
.footer{background: #0A0F0C; color: var(--t2d); padding: 80px 0 40px; border-top: 1px solid rgba(255,255,255,.06)}
@media(max-width:1100px){
.foot-main{grid-template-columns: 1fr 1fr; gap: 48px}
}
@media(max-width:640px){
.footer{padding: 60px 0 32px}
.foot-main{grid-template-columns: 1fr; gap: 40px}
.foot-brand{margin-bottom: 16px}
.foot-desc{max-width: 100%}
.foot-bottom{flex-direction: column; gap: 16px; text-align: center}
.foot-bottom .legal{justify-content: center; flex-wrap: wrap}
}
@media(max-width:460px){
.footer{padding: 48px 0 24px}
.foot-main{gap: 32px}
.foot-col h4{margin-bottom: 16px}
.foot-col ul{gap: 8px}
.foot-contact li{flex-direction: row; align-items: flex-start}
.fsoc{width: 36px; height: 36px}
}
/* Hero responsive 320-470 critical */
@media(max-width:1100px){
.hero-body{grid-template-columns: 1fr; padding: 140px 32px 0; gap: 32px}
.hero-rail{display: none !important}
.hero-strip{padding: 24px 32px 28px; grid-template-columns: repeat(3,1fr)}
.hstrip{padding: 14px 16px; border-right: 1px solid rgba(255,255,255,.06)}
}
@media(max-width:640px){
.hero{min-height: 100dvh}
.hero-body{padding: 120px 20px 0}
.hero-title{font-size: clamp(2.2rem, 8vw, 3rem) !important; line-height: .95}
.hero-sub{font-size: 14px; max-width: 100%}
.hero-ctas{flex-direction: column; align-items: stretch; gap: 12px}
.hero-ctas .btn, .hero-ctas .ghost{width: 100%; justify-content: center}
.hero-strip{grid-template-columns: 1fr 1fr; padding: 18px 12px}
.hstrip{padding: 12px; border-right: 1px solid rgba(255,255,255,.06)}
.hstrip:nth-child(2n){border-right: none}
.hstrip .v{font-size: 14px}
.glance{padding: 24px 20px; margin-top: 24px}
.glance-grid{grid-template-columns: 1fr 1fr}
.glance-v{font-size: 18px}
}
@media(max-width:414px){
.hero-title{font-size: 2.4rem !important}
.hero-eyebrow{font-size: 10px; gap: 12px; margin-bottom: 20px}
.hero-eyebrow::before{width: 24px}
.glance{padding: 20px 16px}
.glance-cell{padding: 14px 12px}
.hero-strip{padding: 16px 10px}
.hstrip{padding: 10px 12px}
.hstrip .l{font-size: 9px}
.hstrip .v{font-size: 13px}
}
@media(max-width:375px){
.hero-title{font-size: 2.2rem !important; line-height: 1}
.hero-body{padding: 110px 16px 0}
.container{padding: 0 16px}
.trip-card__body{padding: 20px 16px}
.trip-card__title{font-size: 18px}
.glance-v{font-size: 16px}
.sec{padding: 60px 0}
.sec-head{margin-bottom: 32px}
}
@media(max-width:320px){
.hero{min-height: 100dvh}
.hero-title{font-size: 2rem !important; line-height: .95; letter-spacing: -.02em}
.hero-sub{font-size: 13px; line-height: 1.6}
.hero-eyebrow{font-size: 9px; letter-spacing: .2em}
.nav-row{height: 64px !important; gap: 16px !important}
.site-logo__icon{width: 48px !important; height: 48px !important}
.site-logo__text{font-size: 11px !important}
.subnav-row{height: 52px; gap: 4px}
.subnav a{padding: 6px 10px; font-size: 10px}
.subnav .sub-cta{padding: 8px 12px; font-size: 10px}
.container{padding: 0 14px}
.foot-main{gap: 28px}
.trip-grid{grid-template-columns: 1fr; gap: 20px}
.gallery-grid{grid-template-columns: 1fr; gap: 2px}
html{font-size: 14px}
}
/* Ensure fonts over images always readable */
.hero-title, .ph-h1, .trip-card__title, .jcard-name, .foot-name, .feature-body h3{text-shadow: 0 1px 20px rgba(0,0,0,0.4)}
.trip-card__region, .jcard-region{text-shadow: 0 1px 10px rgba(0,0,0,0.6); background: rgba(14,20,17,0.4); backdrop-filter: blur(4px); padding: 4px 8px; border-radius: 2px}
/* Content trim for pixel perfect - max display */
.entry-content p, .entry-content li{overflow-wrap: break-word; word-break: break-word; hyphens: auto}
/* Fix for low quality images - blur up + overlay keeps perfect */
img{display: block; max-width: 100%; image-rendering: -webkit-optimize-contrast}
.brand-image-wrap img{width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(0.95) contrast(1.02); transition: filter .3s, transform 1s var(--ex)}
.brand-image-wrap:hover img{filter: saturate(1.05) contrast(1.05)}
/* Blog Single — Classic Editor Formatting Perfect — Table Horizontal Scroll */
.entry-content{max-width: 760px; margin: 0 auto}
.entry-content h1{font-family: var(--fe); font-size: clamp(2rem,4vw,3.2rem); font-weight: 400; line-height: 1.1; letter-spacing: -.02em; margin: 1.2em 0 .5em; font-variation-settings: "opsz" 144}
.entry-content h1 em{font-style: italic; font-weight: 300; color: var(--ember)}
.entry-content h2{font-family: var(--fe); font-size: clamp(28px,3vw,36px); font-weight: 400; line-height: 1.15; letter-spacing: -.015em; margin: .9em 0 .45em; font-variation-settings: "opsz" 144}
.entry-content h2 em{font-style: italic; font-weight: 300; color: var(--ember)}
.entry-content h3{font-family: var(--fu); font-size: 20px; font-weight: 600; line-height: 1.3; margin: 1.3em 0 .6em; letter-spacing: -.005em}
.entry-content h4{font-family: var(--fu); font-size: 16px; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; margin: 1.4em 0 .6em; color: var(--ink)}
.entry-content h5{font-family: var(--fu); font-size: 14px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--t2l); margin: 1.3em 0 .6em}
.entry-content h6{font-family: var(--fu); font-size: 12px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); margin: 1.3em 0 .5em}
.entry-content p.lead{font-family: var(--fe); font-size: 20px; font-weight: 300; line-height: 1.6; font-style: italic; color: var(--t2l)}
.entry-content a{color: var(--ember); text-decoration: underline; text-underline-offset: 3px; transition: color .2s}
.entry-content a:hover{color: var(--ember-dk)}
/* Bullet & Numbering Perfect */
.entry-content ul{list-style: none; padding-left: 0; margin: 1.5em 0}
.entry-content ul li{position: relative; padding-left: 28px; margin-bottom: 12px; font-size: 16px; line-height: 1.7; font-family: var(--fu)}
.entry-content ul li::before{content: ''; position: absolute; left: 0; top: 11px; width: 8px; height: 8px; background: var(--ember); border-radius: 50%}
.entry-content ul li ul{margin: 12px 0 0 0}
.entry-content ul li ul li::before{background: var(--bone-3)}
.entry-content ol{list-style: decimal; padding-left: 1.5em; margin: 1.5em 0}
.entry-content ol li{margin-bottom: 12px; font-size: 16px; line-height: 1.7; font-family: var(--fu); padding-left: 6px}
.entry-content ol li::marker{color: var(--ember); font-weight: 600; font-family: var(--fe)}
.entry-content ol li ol{margin: 12px 0 0 0; list-style: lower-alpha}
/* Table - Desktop Full Display, Mobile Horizontal Scroll */
.table-wrap{overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 2em 0; border: 1px solid var(--bone-3); border-radius: 2px; background: var(--paper)}
.table-wrap::-webkit-scrollbar{height: 6px}
.table-wrap::-webkit-scrollbar-thumb{background: var(--bone-3); border-radius: 3px}
.table-wrap::-webkit-scrollbar-track{background: var(--bone)}
.entry-content table{width: 100%; min-width: 600px; border-collapse: collapse; margin: 0; font-family: var(--fu); font-size: 14px}
.entry-content table th{background: var(--ink); color: var(--t1d); padding: 14px 18px; text-align: left; font-family: var(--fu); font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap}
.entry-content table td{padding: 14px 18px; border-bottom: 1px solid var(--bone-2); font-size: 14px; line-height: 1.6; vertical-align: top}
.entry-content table tr:last-child td{border-bottom: none}
.entry-content table tr:nth-child(even) td{background: var(--bone-2)}
.entry-content table tr:hover td{background: var(--paper)}
@media(max-width:768px){
.entry-content table{font-size: 13px; min-width: 500px}
.entry-content table th, .entry-content table td{padding: 12px 14px}
}
@media(max-width:460px){
.table-wrap{margin: 1.5em -16px; border-left: none; border-right: none; border-radius: 0}
.entry-content table{min-width: 480px}
}
/* Images in content */
.entry-content img{max-width: 100%; height: auto; object-fit: cover; border-radius: 2px; margin: 1.8em 0; display: block; box-shadow: 0 4px 20px -10px rgba(14,20,17,.15)}
.entry-content figure{margin: 2em 0}
.entry-content figcaption{font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--t3l); margin-top: 10px; text-align: center}
/* CTA and Links Buttons in content */
.entry-content .btn, .entry-content .link-arrow{margin: 1em 0}
.entry-content .btn{display: inline-flex; align-items: center; gap: 10px; font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; padding: 14px 26px; background: var(--ember); color: #fff; text-decoration: none; border: none; cursor: pointer; transition: all .3s var(--ex)}
.entry-content .btn:hover{background: var(--ember-dk); color: #fff}
.entry-content .link-arrow{color: var(--ink); border-bottom: 1px solid currentColor; padding-bottom: 6px; display: inline-flex; gap: 10px; text-decoration: none; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 500}
.entry-content .link-arrow:hover{color: var(--ember); gap: 18px}
/* Blockquote */
.entry-content blockquote{border-left: 3px solid var(--ember); padding: 20px 24px; margin: 2.2em 0; font-family: var(--fe); font-style: italic; font-size: 20px; line-height: 1.5; color: var(--t1l); background: var(--bone-2); border-radius: 0 2px 2px 0}
.entry-content blockquote cite{display: block; font-family: var(--fu); font-style: normal; font-size: 13px; color: var(--t3l); margin-top: 12px; letter-spacing: .04em}
/* Code */
.entry-content code{font-family: var(--fm, monospace); background: var(--bone-2); padding: 2px 6px; border-radius: 2px; font-size: 14px}
.entry-content pre{background: var(--ink-2); color: var(--t1d); padding: 24px; border-radius: 2px; overflow-x: auto; margin: 1.5em 0}
.entry-content pre code{background: transparent; padding: 0; color: inherit}
/* FINAL FIXES FOR HOMEPAGE ISSUES MENTIONED */
/* Hero eyebrow Nº I different colour - b tag ember */
.hero-eyebrow b, .hero-eyebrow strong{color: var(--ember) !important; font-weight: 600}
/* Font sizes increase for all viewports - check s and manage accordingly */
:root{--bone: #F4EFE6; --bone-2: #ECE5D8; --bone-3: #DDD3C0; --paper: #FAF6EF; --ink: #0E1411; --ink-2: #161D19; --ink-3: #1F2823; --ink-4: #2D3832; --brand-orange: #FF6701; --brand-orange-dk: #C8510A; --brand-ink: #231F20; --ember: #B8442A; --ember-dk: #8E3320; --ember-soft: rgba(184,68,42,.12); --ember-soft-2: rgba(184,68,42,.12); --gold: #B69658; --gold-lt: #D6B97E; --pine: #1F2E25; --moss: #4A5B43; --t1d: #F4EFE6; --t2d: #B7AC9B; --t3d: #6F695E; --t1l: #161D19; --t2l: #4A453E; --t3l: #8A8074; --color-primary: var(--brand-orange); --color-secondary: var(--ink); --color-accent: var(--gold); --color-dark: var(--ink); --color-light: var(--paper); --color-text: var(--t1l); --color-text-muted: var(--t2l); --color-white: #ffffff; --color-border: var(--bone-3); --fe: 'Fraunces','Cormorant Garamond',Georgia,serif; --fu: 'Inter Tight',system-ui,sans-serif; --fd: 'Bricolage Grotesque','Inter Tight',sans-serif; --fm: 'JetBrains Mono',monospace; --text-hero-h1: clamp(3.6rem, 7.2vw, 6.8rem); --text-trip-hero: clamp(2.4rem, 5vw, 4.2rem); --text-h1: clamp(2rem, 4.5vw, 3.5rem); --text-h2: clamp(1.75rem, 3.5vw, 2.75rem); --text-h3: clamp(1.25rem, 2.5vw, 2rem); --text-h4: clamp(1.1rem, 2vw, 1.5rem); --text-body: clamp(1rem, 1.5vw, 1.125rem); --text-small: 13px; --text-micro: 11px; --ex: cubic-bezier(.16,1,.3,1); --io: cubic-bezier(.4,0,.2,1); --maxw: 1360px; --container-max: 1320px; --space-xs: 0.5rem; --space-sm: 1rem; --space-md: 1.5rem; --space-lg: 2rem; --space-xl: 3rem; --space-2xl: 5rem; --border-radius: 2px; --border-radius-pill: 999px; --transition: 0.35s cubic-bezier(.16,1,.3,1); --header-height: 84px; --header-height-mobile: 64px}
  body{font-family: var(--fu); background: var(--paper); color: var(--t1l); line-height: 1.65; overflow-x: hidden; min-height: 100vh; min-height: 100svh; font-size: 16px; display: flex; flex-direction: column}
  html{min-height: 100%}
  /* Sticky footer — content shorter than the viewport leaves a light strip below the footer: the main region grows to push the footer to the bottom edge. (Nav is position:fixed so it stays out of this flex flow.) */
.site-main{flex: 1 0 auto; width: 100%}
.home{font-size: 18px}
.home .entry-content p{font-size: 18px}
.entry-content p{line-height: 1.8; font-size: 18px; margin-bottom: 1.3em; color: var(--t1l); font-family: var(--fu); font-weight: 400}
.home .sec-h{font-size: clamp(40px, 5vw, 64px) !important}
.h2, .sec-h{letter-spacing: -.02em}
/* Marquee stats more spacing to cover all areas while increasing font size */
.hero-marquee{padding: 40px 132px 48px !important; gap: 32px !important; display: grid !important; grid-template-columns: repeat(4,1fr) !important; position: relative; z-index: 5; margin-top: auto; border-top: 1px solid rgba(255,255,255,.08); justify-content: space-between}
.hmq{padding: 0 40px !important; gap: 12px !important; border-right: 1px solid rgba(255,255,255,.08); display: flex; flex-direction: column}
.home .hmq-n{font-size: 3.2rem !important; font-weight: 600; letter-spacing: -.02em}
.home .hmq-l{font-size: 13px !important; color: rgba(244,239,230,.65) !important; letter-spacing: .24em}
@media(max-width:1100px){
.hero-marquee{padding: 28px 32px 32px !important; gap: 24px !important}
.hmq{padding: 0 24px !important}
}
@media(max-width:640px){
.hero-marquee{grid-template-columns: 1fr 1fr !important; gap: 24px !important; padding: 24px 24px 32px !important}
.hmq{padding: 0 !important; border: none !important}
.hmq-n{font-size: 2.4rem !important}
}
/* The homepage uses its scoped hero overlay at the end of this file. */
/* Founder note founder image */
.invite-sig-img{width: 80px; height: 80px; border-radius: 50%; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover; border: 2px solid var(--gold-lt); background-size: cover; background-position: center; margin-bottom: 16px}
/* Signature section no eyebrow - ensure no eyebrow in signature card */
.signature .eyebrow{display: none !important}
.sig-head{display: flex; align-items: center; justify-content: space-between; padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.08)}
.sig-title{font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--gold-lt); font-weight: 400}
.sig-num{font-family: var(--fu); font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: rgba(244,239,230,.4)}
/* Atlas region feature image upload */
.region-img{background-size: cover !important; background-position: center !important; position: absolute; inset: 0; transition: transform 1.2s var(--ex)}
.region-img.has-custom{filter: saturate(1.05) contrast(1.05)}
/* Our Philosophy description font colour readable and as per design */
.philosophy{background: var(--ink) !important; color: var(--t1d) !important; padding: 160px 0; position: relative; overflow: hidden}
.philo-body p{color: var(--t1d) !important; font-size: 17px !important; line-height: 1.85 !important; font-weight: 300 !important; margin-bottom: 36px}
.philo-body .eyebrow{color: var(--gold-lt) !important; margin-bottom: 30px !important}
.philo-h{color: #fff !important; font-size: clamp(2.2rem, 4vw, 3.6rem) !important; font-family: var(--fe); font-weight: 300; line-height: 1.1; letter-spacing: -.02em; margin-bottom: 28px; font-variation-settings: "opsz" 144}
.pillar{background: var(--ink-2) !important; padding: 28px 24px; border: 1px solid rgba(255,255,255,.06)}
.pillar p{color: var(--t2d) !important; font-size: 14px !important; line-height: 1.7 !important; margin: 0}
.philo-vis{height: 640px !important; position: relative}
.philo-a, .philo-b{background-size: cover !important; background-position: center !important}
@media(max-width:1100px){
.philo-vis{height: 480px !important}
}
/* Half-Day & Day Experiences exact as per */
.moments{background: var(--paper) !important; color: var(--t1l) !important; padding: 140px 0 !important}
.moments-head .eyebrow.center{color: var(--ember) !important; justify-content: center}
.moments-head .eyebrow.center::before, .moments-head .eyebrow.center::after{content: ''; width: 28px; height: 1px; background: currentColor; opacity: .9}
.moment{position: relative; background: #000; transition: transform .5s var(--ex); flex: 0 0 380px; scroll-snap-align: start; overflow: hidden; cursor: pointer; min-height: 420px}
.moment-img{position: absolute; height: 100%; overflow: hidden; background-size: cover; background-position: center; transition: transform 1s var(--ex); inset: 0; width: 100%}
.moment-img div{width: 100%; height: 100%; background-size: cover; background-position: center; transition: transform 1s var(--ex)}
.moment:hover .moment-img div{transform: scale(1.05)}
.moment-time{position: absolute; top: 20px; left: 20px; font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: #fff; padding: 6px 12px; background: rgba(14,20,17,.7); backdrop-filter: blur(6px); z-index: 2}
.moment-body{padding: 28px; position: absolute; bottom: 0; left: 0; right: 0; color: #fff; z-index: 2; background: linear-gradient(to top, rgba(14,20,17,.85) 0%, transparent 100%)}
.moment-cat{font-family: var(--fu); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold-lt); margin-bottom: 8px; display: flex; align-items: center; gap: 10px}
.moment-name{font-family: var(--fe); font-size: 22px; font-weight: 400; color: #fff; line-height: 1.2; margin-bottom: 8px}
.moment-desc{font-family: var(--fu); font-size: 13px; color: rgba(244,239,230,.75); line-height: 1.6; font-weight: 300; margin-bottom: 16px}
.moment-foot{display: flex; align-items: center; justify-content: space-between; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.15)}
.moment-price{font-family: var(--fd); font-style: italic; font-size: 18px; color: #fff; font-weight: 500}
.moment-price sub{font-family: var(--fu); font-style: normal; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: rgba(244,239,230,.6); margin-left: 4px}
.moment-arr{width: 28px; height: 28px; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); display: grid; place-items: center; color: #fff; transition: all .3s}
.moment:hover .moment-arr{background: #fff; border-color: #fff; color: var(--ink)}
/* Dispatch from the Trail exact */
.dispatch{background: var(--ink-3); color: var(--t1d); padding: 120px 0; position: relative; overflow: hidden; text-align: center}
.dispatch .eyebrow{justify-content: center; margin-bottom: 24px; color: var(--gold-lt)}
.dispatch-quote{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: clamp(24px, 3vw, 36px); line-height: 1.3; color: #fff; letter-spacing: -.005em; margin-bottom: 48px; font-variation-settings: "opsz" 144; max-width: 900px; margin: 0 auto; position: relative}
.dispatch-quote .mark{color: var(--ember); font-style: normal; font-family: var(--fe); font-size: 4rem; opacity: .5; position: absolute; top: -20px; left: -40px}
.dispatch-author{display: flex; align-items: center; justify-content: center; gap: 16px; margin-bottom: 36px; margin-top: 32px}
.dispatch-avatar{width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover; border: 2px solid var(--gold-lt); background-size: cover; background-position: center}
.dispatch-name{font-family: var(--fe); font-size: 18px; font-weight: 500; color: #fff; text-align: left}
.dispatch-trip{font-family: var(--fu); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--t2d); margin-top: 4px}
.dispatch-dots{display: flex; justify-content: center; gap: 12px; margin-top: 32px}
.dispatch-dots .dot{width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.2)}
.dispatch-dots .dot.on{background: var(--ember)}
/* Our Promise to the Mountain exact */
.conserve{background: var(--pine); color: var(--t1d); padding: 120px 0}
.conserve .eyebrow{color: var(--gold-lt) !important; margin-bottom: 18px !important}
.conserve h2{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: clamp(28px, 3.5vw, 44px); line-height: 1.2; color: #fff}
.conserve h2 em{font-style: italic; color: var(--gold-lt)}
.conserve h2 strong{font-style: normal; font-weight: 600; color: #fff; display: block}
.conserve-grid{display: grid; grid-template-columns: 1.2fr .6fr 1fr; gap: 64px; align-items: center}
.conserve-stat{text-align: center; border-left: 1px solid rgba(255,255,255,.1); border-right: 1px solid rgba(255,255,255,.12); padding: 0 32px; padding-left: 32px}
.conserve-stat .n{font-family: var(--fd); font-size: 3rem; font-weight: 600; color: #fff; line-height: 1; letter-spacing: -.02em}
.conserve-stat .n sup{font-family: var(--fe); font-style: italic; font-size: 1.4rem; color: var(--gold-lt)}
.conserve-stat .t{font-family: var(--fu); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--t2d); margin-top: 8px}
@media(max-width:900px){
.conserve-grid{grid-template-columns: 1fr; gap: 48px}
.conserve-stat{border-left: none; border-top: 1px solid rgba(255,255,255,.1); border-bottom: 1px solid rgba(255,255,255,.1); padding: 32px 0; display: flex; justify-content: space-around}
}
/* From the Journal exact */
.journal{background: var(--paper); color: var(--t1l); padding: 140px 0}
.journal-grid{display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 2px; background: var(--bone-3)}
.jl-card{cursor: pointer; background: var(--paper); padding: 0; overflow: hidden; transition: background .3s}
.jl-card:hover{background: #fff}
.jl-img{position: relative; height: 300px; overflow: hidden; margin-bottom: 24px; aspect-ratio: 16/10}
.jl-img div{width: 100%; height: 100%; background-size: cover; background-position: center; transition: transform .8s var(--ex)}
.jl-card:hover .jl-img div{transform: scale(1.05)}
.jl-cat{position: absolute; top: 16px; left: 16px; font-family: var(--fu); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--t1l); padding: 6px 12px; background: var(--paper); backdrop-filter: blur(8px)}
.jl-meta{display: flex; align-items: center; gap: 12px; margin-bottom: 14px; font-family: var(--fu); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--t3l); padding: 16px 24px 0}
.jl-meta .sep{width: 1px; height: 12px; background: var(--bone-3); opacity: .5; align-self: center}
.jl-title{font-family: var(--fe); font-weight: 400; color: var(--t1l); line-height: 1.3; letter-spacing: -.01em; margin-bottom: 14px; font-size: 20px; padding: 12px 24px 0}
.jl-card.feat .jl-title{font-size: 28px; font-weight: 400}
.jl-ex{font-family: var(--fu); font-size: 14px; color: var(--t2l); line-height: 1.6; font-weight: 300; margin-bottom: 20px; padding: 12px 24px 0}
.jl-read{font-family: var(--fu); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--t1l); border-bottom: 1px solid var(--ember); padding-bottom: 4px; display: inline-flex; align-items: center; gap: 8px; padding: 16px 24px 24px; border-top: 1px solid var(--bone-3); margin-top: 16px; width: 100%}
.jl-card:hover .jl-read{color: var(--ember)}
/* An Invitation exact */
.invite-cta{background: var(--ink); color: var(--t1d); padding: 120px 0; position: relative; overflow: hidden}
.cta-grid{display: grid; grid-template-columns: 1.2fr .8fr; gap: 80px; align-items: center}
.cta-grid .eyebrow{color: var(--gold-lt); margin-bottom: 24px}
.cta-grid h2{font-family: var(--fe); font-weight: 300; font-size: clamp(32px, 4vw, 48px); line-height: 1.1; letter-spacing: -.02em; color: #fff; font-variation-settings: "opsz" 144; margin-bottom: 24px}
.cta-grid h2 em{font-style: italic; color: var(--gold-lt)}
.cta-grid p{font-family: var(--fu); font-size: 16px; font-weight: 300; color: var(--t2d); line-height: 1.7; max-width: 480px; margin-top: 20px}
.cta-actions{display: flex; flex-direction: column; gap: 16px; align-items: flex-start}
.cta-note{font-family: var(--fu); font-style: italic; font-size: 12px; color: var(--t3d); display: flex; align-items: center; gap: 10px; margin-top: 12px}
.cta-note i{color: var(--gold-lt)}
@media(max-width:900px){
.cta-grid{grid-template-columns: 1fr; gap: 48px}
}
/* LOGO HEIGHT & FONT SIZE INCREASED PER USER REQUEST */
@media(max-width:320px){
.site-logo__icon{width: 48px !important; height: 48px !important}
.site-logo__text{font-size: 11px !important}
}
/* FINAL LOGO HEIGHT & FONT SIZE INCREASE PER USER REQUEST - LARGER THAN BEFORE */
.site-logo__icon{width: 72px !important; height: 72px !important; display: grid; place-items: center; flex-shrink: 0}
.site-logo__text{font-size: 15px !important; letter-spacing: .18em !important; line-height: 1.1 !important; font-weight: 800 !important; display: flex; flex-direction: column; font-family: 'Helvetica Neue','Helvetica','Arial Narrow',sans-serif; font-stretch: condensed; text-transform: uppercase; color: #fff}
.site-logo__text span{line-height: 1.05 !important; display: block}
.brand-mark{width: var(--bm, 72px); height: var(--bm, 72px); display: grid; place-items: center; color: var(--gold-lt); font-family: var(--fe); font-style: italic; font-weight: 500; font-size: 22px; box-sizing: border-box; overflow: hidden}
.brand-mark img, .brand-mark svg{width: 100%; height: 100%; object-fit: contain; display: block}
.foot-name{font-size: 22px !important; font-family: var(--fe); font-weight: 500; color: #fff; letter-spacing: .02em}
.site-logo__icon img{width: 100% !important; height: 100% !important; object-fit: contain !important}
@media(max-width:768px){
.site-logo__icon{width: 56px !important; height: 56px !important}
.site-logo__text{font-size: 13px !important}
.brand-mark{--bm: 56px}
}
@media(max-width:320px){
.site-logo__icon{width: 48px !important; height: 48px !important}
.site-logo__text{font-size: 11px !important}
}
/* Header menu managed from default WordPress menu settings - ensure visible and perfect align */
.nav-row{height: 96px !important; gap: 40px !important; display: flex; align-items: center}
.nav-menu-list{gap: 32px !important}
.nav-menu-list a{font-size: 13px !important; letter-spacing: .16em !important; font-weight: 500 !important}
.nav-cta{padding: 14px 28px !important; font-size: 12px !important; letter-spacing: .18em !important; font-family: var(--fu); font-weight: 500; text-transform: uppercase; color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); transition: all .3s; background: var(--brand-orange); display: inline-flex; align-items: center; gap: 10px; border: 1px solid rgba(255,255,255,.35)}
@media(max-width:1100px){
.nav-row{height: 84px !important; gap: 32px !important}
}
@media(max-width:820px){
.nav-row{height: 72px !important; gap: 24px !important}
}
@media(max-width:320px){
.nav-row{height: 64px !important; gap: 16px !important}
}
/* Ensure header menu items from WP menu are visible */
.nav-links, .nav-menu-list{display: flex !important; align-items: center !important}
.nav-menu-list li{list-style: none !important; position: relative !important}
.nav-menu-list li a{color: rgba(244,239,230,.86) !important; transition: color .2s !important}
.nav-menu-list li a:hover{color: #fff !important}
.nav-menu-list li.current-menu-item a, .nav-menu-list li.current_page_item a{color: #fff !important}
/* b: no underline 'after line' design on menu items (legacy rule removed) */
.nav-links a::after, .nav-menu-list > li > a::after{display:none !important}
/* Mega menu triggered by WP menu data-mega */
.nav-item[data-mega], .menu-item-has-children[data-mega]{position: relative}
.mega{position: fixed; left: 0; right: 0; top: 0; padding-top: 82px; background: var(--paper); color: var(--t1l); transform: translateY(-12px); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .45s var(--ex),transform .55s var(--ex),visibility 0s linear .55s; z-index: 190; border-bottom: 1px solid var(--bone-3); box-shadow: 0 40px 80px -30px rgba(14,20,17,.35)}
.mega.open{opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); transition: opacity .45s var(--ex),transform .55s var(--ex),visibility 0s}
/* HOMEPAGE CASCADE REPAIR — scoped after the trip-template rules.
   Later trip-template rules share class names with the homepage
   (.sec-head, .moments, .journal, etc.); these homepage-only rules
   restore the intended homepage styling without touching inner pages. */
.home .invite-body .entry-content{max-width: none; margin: 0}
.home .invite-body .entry-content p{font-family: var(--fu); font-size: 16px; line-height: 1.85; color: var(--t2l); font-weight: 300; margin: 0 0 20px}
.home .invite-body .entry-content p:first-of-type::first-letter{font-family: var(--fe); font-size: 4.2rem; font-style: italic; font-weight: 300; float: left; line-height: .85; padding: 8px 14px 0 0; color: var(--ember)}
.home .invite-sig-img{width: 64px; height: 64px; margin: 0; border-radius: 50%; background-position: center; background-size: cover; background-repeat: no-repeat; border: 1px solid var(--bone-3)}
.home .journeys .sec-head,.home .atlas .sec-head,.home .journal .sec-head{display: grid; grid-template-columns: 1fr auto; gap: 48px; align-items: end; margin-bottom: 72px}
.home .journeys .sec-head .right,.home .atlas .sec-head .right,.home .journal .sec-head .right{display: flex; flex-direction: column; align-items: flex-end; gap: 14px}
.home .journeys .sec-head .right p{max-width: 340px; font-family: var(--fu); font-size: 14px; color: var(--t2d); line-height: 1.7; font-weight: 300; text-align: right}
.home .atlas .sec-head .right p,.home .journal .sec-head .right p{max-width: 340px; font-family: var(--fe); font-style: italic; font-size: 16px; color: var(--t2l); line-height: 1.6; font-weight: 300; text-align: right}
.home .journeys .sec-h{font-family: var(--fe); font-weight: 300; color: var(--t1d); font-size: clamp(2.4rem,4.6vw,4rem); line-height: 1.04; letter-spacing: -.02em}
.home .atlas .sec-h,.home .journal .sec-h{font-family: var(--fe); font-weight: 300; color: var(--t1l); font-size: clamp(2.4rem,4.6vw,4rem); line-height: 1.04; letter-spacing: -.02em}
.home .journey-grid{display: grid; grid-template-columns: repeat(3,1fr); gap: 28px}
.home .jcard-img{height: 440px; aspect-ratio: auto}
.home .jcard-img>div{position: absolute; inset: 0}
.home .jcard-body{position: absolute; bottom: 0; left: 0; right: 0}
.home .moments{background: var(--paper) !important; color: var(--t1l) !important; padding: 140px 0 !important}
.home .moments-grid{display: grid; grid-template-columns: repeat(4,1fr); gap: 20px}
.home .moment{position: relative; background: #fff; min-height: 0; overflow: visible}
.home .moment-img{position: relative; height: 340px; inset: auto}
.home .moment-img>div{position: absolute; inset: 0; background-size: cover; background-position: center}
.home .moment-body{position: relative; left: auto; right: auto; bottom: auto; padding: 28px 24px 30px; background: #fff; color: var(--t1l)}
.home .moment-name{color: var(--t1l); font-family: var(--fe); font-size: 1.25rem; font-weight: 500}
.home .moment-desc{color: var(--t2l)}
.home .moment-foot{border-top: 1px solid var(--bone-3)}
.home .moment-price{color: var(--t1l); font-family: var(--fe); font-style: italic; font-size: 20px}
.home .moment-arr{color: var(--t2l); border-color: var(--bone-3)}
.home .dispatch{background: var(--ink); padding: 160px 0; text-align: center}
.home .dispatch .container{max-width: 1000px; text-align: center}
.home .dispatch-quote{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: clamp(1.8rem,3.4vw,2.8rem); line-height: 1.35; color: #fff; max-width: none; margin: 0 0 48px; position: static}
.home .dispatch-quote .mark{position: static; font-family: var(--fe); font-size: inherit; color: var(--ember); opacity: 1}
.home .dispatch-author{margin-bottom: 36px}
.home .dispatch-dots{margin-top: 0}
.home .conserve{padding: 120px 0}
.home .conserve-grid{display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 48px; align-items: center}
.home .conserve-stat{border-left: 1px solid rgba(255,255,255,.12); border-right: 1px solid rgba(255,255,255,.12); padding: 0 32px; text-align: center}
.home .conserve h2{font-family: var(--fe); font-style: italic; font-weight: 300; font-size: clamp(2rem,3.6vw,2.8rem); line-height: 1.15; color: #fff}
.home .conserve h2 strong{font-style: normal; font-weight: 500; color: var(--gold-lt); display: block}
.home .journal{padding: 140px 0; background: var(--paper)}
.home .journal-grid{display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 36px; background: transparent}
.home .jl-img{height: 300px; aspect-ratio: auto; margin-bottom: 24px}
.home .jl-card.feat .jl-img{height: 480px}
.home .jl-img>div{position: absolute; inset: 0; background-size: cover; background-position: center}
.home .jl-meta{padding: 0; margin-bottom: 14px}
.home .jl-title{padding: 0; margin-bottom: 14px}
.home .jl-ex{padding: 0; margin-bottom: 20px}
.home .jl-read{padding: 0 0 4px; margin: 0; width: auto; border-top: 0; border-bottom: 1px solid var(--ember)}
@media(max-width:1024px){
.home .journey-grid,.home .moments-grid{grid-template-columns: repeat(2,1fr)}
.home .atlas .sec-head,.home .journal .sec-head,.home .journeys .sec-head{grid-template-columns: 1fr; gap: 24px}
.home .journeys .sec-head .right,.home .atlas .sec-head .right,.home .journal .sec-head .right{align-items: flex-start}
.home .journeys .sec-head .right p,.home .atlas .sec-head .right p,.home .journal .sec-head .right p{text-align: left}
.home .conserve-grid{grid-template-columns: 1fr; text-align: center}
.home .conserve-stat{border-left: 0; border-right: 0; border-top: 1px solid rgba(255,255,255,.12); border-bottom: 1px solid rgba(255,255,255,.12); padding: 32px 0}
.home .journal-grid{grid-template-columns: 1fr 1fr}
}
@media(max-width:640px){
.home .journey-grid,.home .moments-grid,.home .journal-grid{grid-template-columns: 1fr}
.home .jcard-img{height: 360px}
.home .jl-card.feat .jl-img,.home .jl-img{height: 260px}
.home .invite-sig-img{width: 64px; height: 64px}
}
/* HOMEPAGE DIRECT MARKERS — independent of WordPress body classes */
.thg-home-journeys .sec-head,.thg-home-atlas .sec-head,.thg-home-journal .sec-head{display: grid !important; grid-template-columns: 1fr auto !important; gap: 48px !important; align-items: end !important; margin-bottom: 72px !important}
.thg-home-journeys .sec-head .right,.thg-home-atlas .sec-head .right,.thg-home-journal .sec-head .right{display: flex !important; flex-direction: column !important; align-items: flex-end !important; gap: 14px !important}
.thg-home-atlas .sec-head .right p,.thg-home-journal .sec-head .right p{max-width: 340px !important; font-family: var(--fe) !important; font-style: italic !important; font-size: 16px !important; color: var(--t2l) !important; line-height: 1.6 !important; text-align: right !important}
.thg-home-journeys .journey-grid{display: grid !important; grid-template-columns: repeat(3,1fr) !important; gap: 28px !important}
.thg-home-journeys .jcard-img{height: 440px !important; aspect-ratio: auto !important}
.thg-home-moments{background: var(--paper) !important; color: var(--t1l) !important; padding: 140px 0 !important}
.thg-home-moments .moments-grid{display: grid !important; grid-template-columns: repeat(4,1fr) !important; gap: 20px !important}
.thg-home-moments .moment{background: #fff !important; min-height: 0 !important; overflow: visible !important}
.thg-home-moments .moment-img{position: relative !important; height: 340px !important; inset: auto !important}
.thg-home-moments .moment-body{position: relative !important; inset: auto !important; padding: 28px 24px 30px !important; background: #fff !important; color: var(--t1l) !important}
.thg-home-dispatch{background: var(--ink) !important; padding: 160px 0 !important; text-align: center !important}
.thg-home-dispatch .dispatch-quote{position: static !important; max-width: none !important; margin: 0 0 48px !important}
.thg-home-dispatch .dispatch-quote .mark{position: static !important; font-size: inherit !important; opacity: 1 !important}
.thg-home-conserve{padding: 120px 0 !important}
.thg-home-conserve .conserve-grid{display: grid !important; grid-template-columns: 1fr 1fr 1fr !important; gap: 48px !important; align-items: center !important}
.thg-home-journal{padding: 140px 0 !important; background: var(--paper) !important}
.thg-home-journal .journal-grid{display: grid !important; grid-template-columns: 1.5fr 1fr 1fr !important; gap: 36px !important; background: transparent !important}
.thg-home-journal .jl-img{height: 300px !important; aspect-ratio: auto !important}
.thg-home-journal .jl-card.feat .jl-img{height: 480px !important}
.thg-home-invite .invite-body .entry-content{max-width: none !important; margin: 0 !important}
.thg-home-invite .invite-sig-img{margin: 0 !important; width: 64px !important; height: 64px !important}
@media(max-width:1024px){
.thg-home-journeys .sec-head,.thg-home-atlas .sec-head,.thg-home-journal .sec-head{grid-template-columns: 1fr !important; gap: 24px !important}
.thg-home-journeys .sec-head .right,.thg-home-atlas .sec-head .right,.thg-home-journal .sec-head .right{align-items: flex-start !important}
.thg-home-journeys .sec-head .right p,.thg-home-atlas .sec-head .right p,.thg-home-journal .sec-head .right p{text-align: left !important}
.thg-home-journeys .journey-grid,.thg-home-moments .moments-grid{grid-template-columns: repeat(2,1fr) !important}
.thg-home-conserve .conserve-grid{grid-template-columns: 1fr !important; text-align: center !important}
.thg-home-journal .journal-grid{grid-template-columns: 1fr 1fr !important}
}
@media(max-width:640px){
.thg-home-journeys .journey-grid,.thg-home-moments .moments-grid,.thg-home-journal .journal-grid{grid-template-columns: 1fr !important}
.thg-home-journeys .jcard-img{height: 360px !important}
.thg-home-journal .jl-img,.thg-home-journal .jl-card.feat .jl-img{height: 260px !important}
}
/* HOMEPAGE SECTION HEAD PRECISION — titles entered as one ACF line wrap like the design */
.thg-home-journeys .sec-head,
.thg-home-atlas .sec-head,
.thg-home-journal .sec-head{grid-template-columns: minmax(0,1fr) 340px !important; align-items: end !important}
.thg-home-journeys .sec-h,
.thg-home-atlas .sec-h,
.thg-home-journal .sec-h{display: block !important; width: 100% !important; max-width: 620px !important; overflow: visible !important; text-overflow: clip !important; -webkit-line-clamp: unset !important; line-clamp: unset !important; font-family: var(--fe) !important; font-weight: 300 !important; letter-spacing: -.02em !important; line-height: 1.04 !important}
.thg-home-atlas .sec-h,
.thg-home-journal .sec-h{color: var(--t1l) !important; font-size: clamp(2.4rem,4.6vw,4rem) !important}
.thg-home-atlas .sec-h em,
.thg-home-journal .sec-h em{color: var(--ember) !important; font-style: italic !important}
.thg-home-journeys .sec-head .right,
.thg-home-atlas .sec-head .right,
.thg-home-journal .sec-head .right{width: 340px !important; max-width: 340px !important; align-items: flex-end !important}
.thg-home-journeys .sec-head .right p,
.thg-home-atlas .sec-head .right p,
.thg-home-journal .sec-head .right p{width: 100% !important; max-width: 340px !important; margin: 0 !important; text-align: right !important}
@media(max-width:1024px){
.thg-home-journeys .sec-head,
  .thg-home-atlas .sec-head,
  .thg-home-journal .sec-head{grid-template-columns: 1fr !important}
.thg-home-journeys .sec-head .right,
  .thg-home-atlas .sec-head .right,
  .thg-home-journal .sec-head .right{width: 100% !important; max-width: 440px !important; align-items: flex-start !important}
.thg-home-journeys .sec-head .right p,
  .thg-home-atlas .sec-head .right p,
  .thg-home-journal .sec-head .right p{max-width: 440px !important; text-align: left !important}
}
@media(max-width:640px){
.thg-home-journeys .sec-h,
  .thg-home-atlas .sec-h,
  .thg-home-journal .sec-h{max-width: 100% !important; font-size: clamp(2.2rem,10vw,3rem) !important}
}
/* HOMEPAGE TYPOGRAPHY PASS — exact section hierarchy */
.thg-home-journeys .sec-h{color: var(--t1d) !important; font-size: clamp(2.4rem,4.6vw,4rem) !important; max-width: 620px !important; font-family: var(--fe) !important; line-height: 1.04 !important; font-weight: 300 !important}
.thg-home-journeys .sec-h em{color: var(--gold-lt) !important; font-style: italic !important}
.thg-home-atlas .sec-h{max-width: 620px !important; color: var(--t1l) !important; font-family: var(--fe) !important; font-size: clamp(2.4rem,4.6vw,4rem) !important; line-height: 1.04 !important; font-weight: 300 !important}
.thg-home-atlas .sec-h em{color: var(--ember) !important; font-style: italic !important}
.thg-home-journal .sec-h{max-width: none !important; width: max-content !important; white-space: nowrap !important; color: var(--t1l) !important; font-family: var(--fe) !important; font-size: clamp(2.4rem,4.6vw,4rem) !important; line-height: 1.04 !important; font-weight: 300 !important}
.thg-home-journal .sec-h em{color: var(--ember) !important; font-style: italic !important}
.thg-home-journeys .sec-head .right p{max-width: 340px !important; font-family: var(--fu) !important; font-size: 14px !important; color: var(--t2d) !important; line-height: 1.7 !important; text-align: right !important; font-style: normal !important}
.thg-home-atlas .sec-head .right p,
.thg-home-journal .sec-head .right p{font-family: var(--fe) !important; font-style: italic !important; font-size: 16px !important; color: var(--t2l) !important; line-height: 1.6 !important}
.thg-home-journeys .sec-head .right a,
.thg-home-atlas .sec-head .right a,
.thg-home-journal .sec-head .right a{font-family: var(--fu) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .2em !important; line-height: 1.2 !important}
.thg-home-philosophy .philo-body .link-arrow{display: inline-flex !important; visibility: visible !important; opacity: 1 !important}
.thg-home-conserve .entry-content{max-width: none !important; margin: 0 !important}
.thg-home-conserve .entry-content p,
.thg-home-conserve .entry-content li{color: rgba(244,239,230,.85) !important; font-family: var(--fu) !important; font-size: 14.5px !important; line-height: 1.8 !important; font-weight: 300 !important}
@media(max-width:1024px){
.thg-home-journal .sec-h{width: auto !important; white-space: normal !important}
}
@media(max-width:640px){
.thg-home-journeys .sec-h,.thg-home-atlas .sec-h,.thg-home-journal .sec-h{max-width: 100% !important; width: auto !important; white-space: normal !important; font-size: clamp(2.2rem,10vw,3rem) !important}
}
/* HOMEPAGE DISPATCH SLIDER — replaces obsolete single/voice mockup */
.thg-home-dispatch .dispatch-slides{position: relative; min-height: 245px}
.thg-home-dispatch .dispatch-slide{display: none; animation: thgDispatchIn .55s var(--ex)}
.thg-home-dispatch .dispatch-slide.is-active{display: block}
.thg-home-dispatch .dispatch-dots{display: flex; justify-content: center; gap: 10px; margin-top: 0}
.thg-home-dispatch .dispatch-dots .dot{appearance: none; border: 0; padding: 0; width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.25); cursor: pointer; transition: all .3s var(--ex)}
.thg-home-dispatch .dispatch-dots .dot.on{width: 24px; border-radius: 4px; background: var(--ember)}
@keyframes thgDispatchIn{
from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}
}
@media(max-width:640px){
.thg-home-dispatch .dispatch-slides{min-height: 300px}
}
/* HOMEPAGE UNIQUE SECTION HEAD CLASSES — no shared sec-head collision */
.thg-home-journeys .home-section-head,
.thg-home-atlas .home-section-head,
.thg-home-journal .home-section-head{display: grid !important; grid-template-columns: minmax(0,1fr) 340px !important; gap: 48px !important; align-items: end !important; margin-bottom: 72px !important; direction: ltr !important}
.thg-home-journeys .home-section-title,
.thg-home-atlas .home-section-title,
.thg-home-journal .home-section-title{grid-column: 1 !important; grid-row: 1 !important; display: block !important; direction: ltr !important; margin: 0 !important; text-align: left !important; font-family: var(--fe) !important; font-weight: 300 !important; letter-spacing: -.02em !important; line-height: 1.04 !important; overflow: visible !important; text-overflow: clip !important; -webkit-line-clamp: unset !important; line-clamp: unset !important}
.thg-home-journeys .home-section-title{color: var(--t1d) !important; font-size: clamp(2.4rem,4.6vw,4rem) !important; max-width: 620px !important}
.thg-home-journeys .home-section-title em{color: var(--gold-lt) !important; font-style: italic !important}
.thg-home-atlas .home-section-title{color: var(--t1l) !important; font-size: clamp(2.4rem,4.6vw,4rem) !important; max-width: 620px !important}
.thg-home-atlas .home-section-title em{color: var(--ember) !important; font-style: italic !important}
.thg-home-journal .home-section-title{color: var(--t1l) !important; font-size: clamp(2.4rem,4.6vw,4rem) !important; max-width: none !important; white-space: nowrap !important}
.thg-home-journal .home-section-title em{color: var(--ember) !important; font-style: italic !important}
.thg-home-journeys .home-section-copy,
.thg-home-atlas .home-section-copy,
.thg-home-journal .home-section-copy{grid-column: 2 !important; grid-row: 1 !important; width: 340px !important; max-width: 340px !important; display: flex !important; flex-direction: column !important; align-items: flex-end !important; gap: 14px !important; direction: ltr !important; text-align: right !important}
.thg-home-journeys .home-section-copy p{font-family: var(--fu) !important; font-size: 14px !important; font-style: normal !important; line-height: 1.7 !important; color: var(--t2d) !important}
.thg-home-atlas .home-section-copy p,
.thg-home-journal .home-section-copy p{font-family: var(--fe) !important; font-size: 16px !important; font-style: italic !important; line-height: 1.6 !important; color: var(--t2l) !important}
.thg-home-journeys .home-section-copy a,
.thg-home-atlas .home-section-copy a,
.thg-home-journal .home-section-copy a{font-family: var(--fu) !important; font-size: 12px !important; letter-spacing: .2em !important}
@media(max-width:1024px){
.thg-home-journeys .home-section-head,
  .thg-home-atlas .home-section-head,
  .thg-home-journal .home-section-head{grid-template-columns: 1fr !important; gap: 24px !important}
.thg-home-journeys .home-section-title,
  .thg-home-atlas .home-section-title,
  .thg-home-journal .home-section-title{grid-column: 1 !important; grid-row: 1 !important; max-width: 100% !important; white-space: normal !important}
.thg-home-journeys .home-section-copy,
  .thg-home-atlas .home-section-copy,
  .thg-home-journal .home-section-copy{grid-column: 1 !important; grid-row: 2 !important; width: 100% !important; max-width: 440px !important; align-items: flex-start !important; text-align: left !important}
.thg-home-journeys .home-section-copy p,
  .thg-home-atlas .home-section-copy p,
  .thg-home-journal .home-section-copy p{text-align: left !important}
}
/* HOMEPAGE ACF TITLE NORMALISER — users may enter plain text or any h1-h6 */
.thg-home-invite .invite-h > h1,.thg-home-invite .invite-h > h2,.thg-home-invite .invite-h > h3,
.thg-home-invite .invite-h > h4,.thg-home-invite .invite-h > h5,.thg-home-invite .invite-h > h6,
.thg-home-journeys .home-section-title > h1,.thg-home-journeys .home-section-title > h2,.thg-home-journeys .home-section-title > h3,
.thg-home-atlas .home-section-title > h1,.thg-home-atlas .home-section-title > h2,.thg-home-atlas .home-section-title > h3,
.thg-home-journal .home-section-title > h1,.thg-home-journal .home-section-title > h2,.thg-home-journal .home-section-title > h3,
.thg-home-philosophy .philo-h > h1,.thg-home-philosophy .philo-h > h2,.thg-home-philosophy .philo-h > h3,
.thg-home-moments .moments-title > h1,.thg-home-moments .moments-title > h2,.thg-home-moments .moments-title > h3,
.thg-home-conserve .conserve-title > h1,.thg-home-conserve .conserve-title > h2,.thg-home-conserve .conserve-title > h3,
.thg-home-cta .cta-title > h1,.thg-home-cta .cta-title > h2,.thg-home-cta .cta-title > h3{font: inherit !important; color: inherit !important; line-height: inherit !important; letter-spacing: inherit !important; margin: 0 !important; padding: 0 !important; max-width: none !important}
.thg-home-invite .invite-h > p,.thg-home-journeys .home-section-title > p,.thg-home-atlas .home-section-title > p,
.thg-home-journal .home-section-title > p,.thg-home-philosophy .philo-h > p,.thg-home-moments .moments-title > p,
.thg-home-conserve .conserve-title > p,.thg-home-cta .cta-title > p{margin: 0 !important; padding: 0 !important; font: inherit !important; color: inherit !important}
@media(min-width:768px){
.thg-home-journeys .home-section-head,.thg-home-atlas .home-section-head,.thg-home-journal .home-section-head{grid-template-columns: minmax(0,1fr) 340px !important}
.thg-home-journeys .home-section-copy,.thg-home-atlas .home-section-copy,.thg-home-journal .home-section-copy{grid-column: 2 !important; grid-row: 1 !important; width: 340px !important; max-width: 340px !important; align-items: flex-end !important; text-align: right !important}
}
@media(max-width:767px){
.thg-home-journeys .home-section-head,.thg-home-atlas .home-section-head,.thg-home-journal .home-section-head{grid-template-columns: 1fr !important; gap: 24px !important}
.thg-home-journeys .home-section-copy,.thg-home-atlas .home-section-copy,.thg-home-journal .home-section-copy{grid-column: 1 !important; grid-row: 2 !important; width: 100% !important; max-width: 100% !important; align-items: flex-start !important; text-align: left !important}
.thg-home-journal .home-section-title{white-space: normal !important; width: auto !important}
}
/* HOMEPAGE DESIGN TOKEN PASS — keep homepage palette/type independent of later template globals */
.thg-home-hero,
.thg-home-journeys,
.thg-home-atlas,
.thg-home-philosophy,
.thg-home-moments,
.thg-home-dispatch,
.thg-home-conserve,
.thg-home-journal,
.thg-home-cta{--home-ember: #B8442A; --home-ember-dk: #8E3320; --home-gold: #B69658; --home-gold-lt: #D6B97E; --home-ink: #0E1411; --home-ink-2: #161D19; --home-pine: #1F2E25; --home-paper: #FAF6EF; --home-bone: #F4EFE6; --home-t1l: #161D19; --home-t2l: #4A453E; --home-t1d: #F4EFE6; --home-t2d: #B7AC9B}
/* Hero — source template size and overlay, undoing oversized global hero rules */
.thg-home-hero .hero-title em{color: var(--home-gold-lt) !important}
.thg-home-hero .hero-title strong{color: #fff !important; font-weight: 600 !important}
.thg-home-hero .hero-veil{background: radial-gradient(120% 80% at 20% 50%,rgba(14,20,17,.85) 0%,rgba(14,20,17,.5) 40%,rgba(14,20,17,.15) 70%,transparent 100%),
    linear-gradient(to bottom,rgba(14,20,17,.45) 0%,transparent 35%,rgba(14,20,17,.2) 60%,rgba(14,20,17,.92) 100%) !important}
.thg-home-hero .btn-fill{background: var(--brand-orange) !important}
.thg-home-hero .hero-eyebrow b{color: var(--home-ember) !important}
/* Journey right-side CTA */
.thg-home-journeys .home-section-copy .link-arrow{color: var(--home-gold-lt) !important}
/* Conservation title wrapper — source template typography */
.thg-home-conserve .conserve-title{font-family: var(--fe) !important; font-style: italic !important; font-weight: 300 !important; font-size: clamp(2rem,3.6vw,2.8rem) !important; line-height: 1.15 !important; color: #fff !important}
.thg-home-conserve .conserve-title strong{font-style: normal !important; font-weight: 500 !important; color: var(--home-gold-lt) !important; display: block !important}
.thg-home-conserve .conserve-title em{color: var(--home-gold-lt) !important}
.thg-home-conserve .conserve-stat .n{color: #fff !important}
.thg-home-conserve .conserve-stat .t{color: rgba(244,239,230,.7) !important}
/* Invitation CTA title wrapper — source template typography */
.thg-home-cta .cta-title{font-family: var(--fe) !important; font-weight: 300 !important; font-size: clamp(2.4rem,5vw,4rem) !important; line-height: 1.04 !important; letter-spacing: -.02em !important; color: #fff !important}
.thg-home-cta .cta-title em{font-style: italic !important; color: var(--home-gold-lt) !important}
.thg-home-cta .cta-actions .btn-fill{background: var(--brand-orange) !important}
.thg-home-cta .cta-note{color: rgba(244,239,230,.6) !important}
/* Homepage editorial colors for all neutral title wrappers */
.thg-home-invite .invite-h{color: var(--home-t1l) !important}
.thg-home-invite .invite-h em{color: var(--brand-orange) !important}
.thg-home-philosophy .philo-h{color: #fff !important}
.thg-home-philosophy .philo-h em{color: var(--home-gold-lt) !important}
.thg-home-moments .moments-title{color: var(--home-t1l) !important}
.thg-home-moments .moments-title em{color: var(--brand-orange) !important}
.thg-home-moments .moments-head p{color: var(--home-t2l) !important; font-family: var(--fe) !important; font-size: 18px !important}
@media(max-width:640px){
.thg-home-hero .hero-title{font-size: clamp(2.2rem,7vw,3rem) !important}
}
/* HOMEPAGE HERO FINAL REPAIR — remove the second generic overlay */
.thg-home-hero::after{display: none !important; content: none !important}
.thg-home-hero .hero-title{font-family: var(--fe) !important; font-size: clamp(3rem,6vw,5.8rem) !important; font-weight: 300 !important; line-height: .98 !important; letter-spacing: -.025em !important; color: #fff !important}
.thg-home-hero .hero-marquee{background: transparent !important}
@media(max-width:1100px){
.thg-home-hero .hero-title{font-size: clamp(2.8rem,7vw,5rem) !important}
}
@media(max-width:640px){
.thg-home-hero .hero-title{font-size: clamp(2.2rem,7vw,3rem) !important}
}
/* HOMEPAGE HERO ISOLATION — no shared .hero classes remain in its markup */
.thg-home-hero{position: relative !important; min-height: 100vh !important; width: 100% !important; display: flex !important; flex-direction: column !important; background: var(--home-ink,#0E1411) !important; color: var(--home-t1d,#F4EFE6) !important; overflow: hidden !important}
.thg-home-hero-bg{position: absolute !important; inset: 0 !important; background-position: center 40% !important; background-size: cover !important; background-repeat: no-repeat !important; transform: scale(1.08) !important; animation: thgHomeHeroZoom 18s var(--ex) forwards !important; filter: saturate(1.05) contrast(1.05) !important}
@keyframes thgHomeHeroZoom{
to{transform:scale(1)!important;}
}
.thg-home-hero-grain{position: absolute !important; inset: 0 !important; opacity: .06 !important; mix-blend-mode: overlay !important; pointer-events: none !important; z-index: 2 !important; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/></svg>") !important}
.thg-home-hero-rail{position: absolute !important; top: 0 !important; bottom: 0 !important; width: 84px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: space-between !important; padding: 120px 0 32px !important; z-index: 5 !important}
.thg-home-hero-rail.left{left: 0 !important; border-right: 1px solid rgba(255,255,255,.07) !important}
.thg-home-hero-rail.right{right: 0 !important; border-left: 1px solid rgba(255,255,255,.07) !important}
.thg-home-rail-text{writing-mode: vertical-rl !important; transform: rotate(180deg) !important; font-family: var(--fu) !important; font-size: 10.5px !important; font-weight: 500 !important; letter-spacing: .42em !important; text-transform: uppercase !important; color: rgba(244,239,230,.55) !important}
.thg-home-rail-num{font-family: var(--fe) !important; font-style: italic !important; font-size: 14px !important; color: rgba(244,239,230,.6) !important}
.thg-home-rail-dot{width: 5px !important; height: 5px !important; border-radius: 50% !important; background: var(--home-ember,#B8442A) !important; box-shadow: 0 0 0 6px rgba(184,68,42,.18) !important}
.thg-home-hero-eyebrow{font-family: var(--fu) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .4em !important; text-transform: uppercase !important; color: rgba(244,239,230,.7) !important; display: flex !important; align-items: center !important; gap: 18px !important; margin-bottom: 34px !important}
.thg-home-hero-eyebrow::before{content: ''; width: 48px; height: 1px; background: var(--home-ember,#B8442A)}
.thg-home-hero-title em{font-style: italic !important; font-weight: 300 !important; color: var(--home-gold-lt,#D6B97E) !important; position: relative !important; display: inline-block !important}
.thg-home-hero-title strong{font-weight: 600 !important; font-style: normal !important; color: #fff !important; display: block !important}
.thg-home-hero-line{display: block !important; overflow: visible !important}
.thg-home-hero-sub{max-width: 520px !important; font-family: var(--fu) !important; font-size: 16px !important; font-weight: 300 !important; color: rgba(244,239,230,.78) !important; line-height: 1.7 !important; margin-bottom: 44px !important}
.thg-home-hero-ctas{display: flex !important; align-items: center !important; gap: 20px !important; flex-wrap: wrap !important}
.thg-home-hero-ctas .btn-fill{background: var(--brand-orange) !important; color: #fff !important}
.thg-home-signature{background: rgba(14,20,17,.55) !important; backdrop-filter: blur(22px) saturate(130%) !important; border: 1px solid rgba(255,255,255,.1) !important; padding: 36px 34px !important; position: relative !important; color: #fff !important}
.thg-home-signature::before{content: ''; position: absolute; top: -1px; left: -1px; width: 32px; height: 32px; border-top: 1px solid var(--home-gold-lt,#D6B97E); border-left: 1px solid var(--home-gold-lt,#D6B97E)}
.thg-home-signature::after{content: ''; position: absolute; bottom: -1px; right: -1px; width: 32px; height: 32px; border-bottom: 1px solid var(--home-gold-lt,#D6B97E); border-right: 1px solid var(--home-gold-lt,#D6B97E)}
.thg-home-sig-head{display: flex !important; align-items: center !important; justify-content: space-between !important; padding-bottom: 18px !important; margin-bottom: 8px !important; border-bottom: 1px solid rgba(255,255,255,.08) !important}
.thg-home-sig-title{font-family: var(--fe) !important; font-style: italic !important; font-size: 18px !important; color: var(--home-gold-lt,#D6B97E) !important}
.thg-home-sig-num,.thg-home-sig-meta{font-family: var(--fu) !important; font-size: 10px !important; letter-spacing: .3em !important; text-transform: uppercase !important; color: rgba(244,239,230,.4) !important}
.thg-home-sig-list{display: flex !important; flex-direction: column !important}
.thg-home-sig-item{display: grid !important; grid-template-columns: 48px 1fr auto !important; gap: 16px !important; align-items: center !important; padding: 18px 0 !important; border-bottom: 1px solid rgba(255,255,255,.06) !important}
.thg-home-sig-no{font-family: var(--fe) !important; font-style: italic !important; font-size: 24px !important; color: var(--home-ember,#B8442A) !important}
.thg-home-sig-name{font-family: var(--fe) !important; font-size: 18px !important; font-weight: 500 !important; color: #fff !important; line-height: 1.2 !important; margin-bottom: 4px !important}
.thg-home-sig-arr{width: 34px !important; height: 34px !important; border-radius: 50% !important; border: 1px solid rgba(255,255,255,.18) !important; display: grid !important; place-items: center !important; color: rgba(244,239,230,.7) !important}
.thg-home-sig-foot{margin-top: 24px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; font-family: var(--fu) !important; font-size: 11px !important; letter-spacing: .18em !important; text-transform: uppercase !important; color: rgba(244,239,230,.55) !important}
.thg-home-sig-foot a{color: var(--home-gold-lt,#D6B97E) !important}
.thg-home-hero-marquee{position: relative !important; z-index: 5 !important; margin-top: auto !important; padding: 32px 132px 36px !important; display: grid !important; grid-template-columns: repeat(4,1fr) !important; gap: 0 !important; border-top: 1px solid rgba(255,255,255,.08) !important; background: transparent !important}
.thg-home-hmq{padding: 0 32px !important; border-right: 1px solid rgba(255,255,255,.06) !important; display: flex !important; flex-direction: column !important; gap: 8px !important}
.thg-home-hmq:first-child{padding-left: 0 !important}
.thg-home-hmq:last-child{border-right: none !important; padding-right: 0 !important}
.thg-home-hmq-n{font-family: var(--fd) !important; font-size: 2.6rem !important; font-weight: 500 !important; color: #fff !important; line-height: 1 !important; letter-spacing: -.02em !important}
.thg-home-hmq-n sup{font-family: var(--fe) !important; font-style: italic !important; font-size: 1rem !important; color: var(--home-gold-lt,#D6B97E) !important}
.thg-home-hmq-l{font-family: var(--fu) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .22em !important; text-transform: uppercase !important; color: rgba(244,239,230,.55) !important}
@media(max-width:1100px){
.thg-home-hero-body{grid-template-columns: 1fr !important; padding: 140px 32px 0 !important; padding-top: 170px !important}
.thg-home-signature{display: none !important}
.thg-home-hero-rail{display: none !important}
.thg-home-hero-marquee{padding: 24px 32px 28px !important}
.thg-home-hmq{padding: 0 24px !important}
}
@media(max-width:640px){
.thg-home-hero{min-height: 100svh !important}
.thg-home-hero-body{padding: 120px 20px 0 !important; padding-top: 120px !important}
.thg-home-hero-title{font-size: clamp(2.15rem,7vw,3rem) !important}
.thg-home-hero-sub{font-size: 14px !important; max-width: 100% !important}
.thg-home-hero-ctas{flex-direction: column !important; align-items: stretch !important}
.thg-home-hero-ctas .btn{width: 100% !important; justify-content: center !important}
.thg-home-hero-marquee{grid-template-columns: 1fr 1fr !important; gap: 24px !important; padding: 24px 24px 32px !important}
.thg-home-hmq{padding: 0 !important; border: none !important}
.thg-home-hmq-n{font-size: 2.4rem !important}
}
/* HEADER ALIGNMENT — logo locked left, actions locked right */
.nav .site-logo{display: flex !important; align-items: center !important; gap: 10px !important; margin-right: auto !important; flex: 0 0 auto !important}
.nav .nav-links{display: flex !important; align-items: center !important; flex: 0 1 auto !important; margin-left: auto !important}
.nav .nav-actions{display: flex !important; align-items: center !important; gap: 12px !important; margin-left: auto !important; flex: 0 0 auto !important}
.nav .nav-cta{white-space: nowrap !important}
.thg-home-hero-body{position: relative !important; z-index: 4 !important; flex: 1 !important; display: grid !important; grid-template-columns: 1.4fr .9fr !important; gap: 64px !important; align-items: center !important; padding: 140px 132px 0 !important; padding-top: 190px !important}
@media(max-width:1100px){
.thg-home-hero-body{grid-template-columns: 1fr !important; padding: 140px 32px 0 !important; padding-top: 170px !important}
}
@media(max-width:820px){
.nav .nav-row{height: 72px !important}
.nav .nav-links{display: none !important}
.nav .nav-actions{margin-left: auto !important}
.thg-home-hero-body{padding-top: 130px !important}
}
@media(max-width:640px){
.thg-home-hero-body{padding: 120px 20px 0 !important; padding-top: 120px !important}
}
/* FINAL HOMEPAGE HERO VISUAL CALIBRATION */
.thg-home-hero-title{font-family: var(--fe) !important; color: #fff !important; font-size: clamp(2.8rem,5.6vw,5.4rem) !important; font-weight: 300 !important; line-height: .96 !important; letter-spacing: -.025em !important; font-variation-settings: "opsz" 144 !important; margin-bottom: 36px !important; display: block !important; max-width: 760px !important; overflow: visible !important}
.thg-home-hero-veil{position: absolute !important; inset: 0 !important; background: radial-gradient(120% 80% at 20% 50%,rgba(14,20,17,.72) 0%,rgba(14,20,17,.38) 42%,rgba(14,20,17,.08) 72%,transparent 100%),
    linear-gradient(to bottom,rgba(14,20,17,.28) 0%,transparent 36%,rgba(14,20,17,.12) 60%,rgba(14,20,17,.78) 100%) !important; z-index: 1 !important}
@media(max-width:1100px){
.thg-home-hero-title{font-size: clamp(2.6rem,6.4vw,4.8rem) !important}
}
@media(max-width:640px){
.thg-home-hero-title{font-size: clamp(2.15rem,7vw,3rem) !important}
}
/* FINAL VISUAL MATCH TO THG HOMEPAGE DESIGN REFERENCE */
.home .nav .site-logo__text small{display: block !important; margin-top: 6px !important; font-family: var(--fu) !important; font-size: 9.5px !important; font-weight: 400 !important; letter-spacing: .32em !important; text-transform: uppercase !important; color: rgba(244,239,230,.45) !important}
@media(max-width:1100px){
.home .thg-home-hero-body{padding: 120px 32px 0 !important; padding-top: 130px !important; align-items: start !important}
.home .thg-home-hero-title{font-size: clamp(2.3rem,4.8vw,3.8rem) !important}
}
@media(max-width:640px){
.home .nav .site-logo__icon,.home .nav .site-logo__icon img{width: 40px !important; height: 40px !important}
.home .nav .site-logo__text{font-size: 9.5px !important}
.home .thg-home-hero-body{padding: 108px 20px 44px !important; padding-top: 110px !important; align-items: start !important}
.home .thg-home-hero-title{font-size: clamp(2.15rem,9vw,3.2rem) !important; line-height: 1 !important}
}
/* HERO COMPOSITION MATCH — preserve ACF repeater rows as design lines */
@media(max-width:760px){
.home .thg-home-hero-line{white-space: normal !important}
.home .thg-home-hero-title{max-width: 100% !important; font-size: clamp(2.1rem,7vw,2.8rem) !important}
}
/* FINAL HOMEPAGE REFERENCE CALIBRATION */
/* Header logo: three-line mark, compact vertical alignment */
.home .nav .nav-links{margin-left: auto !important}
.home .nav .nav-actions{margin-left: auto !important}
/* Hero: smaller and shorter than the previous oversized version */
/* Founder title: design width forces three editorial lines and preserves Ember italic */
.home .thg-home-invite .invite-h{max-width: 520px !important; font-size: clamp(2.4rem,4.6vw,4rem) !important; line-height: 1.05 !important; color: var(--home-t1l) !important}
.home .thg-home-invite .invite-h > h1,.home .thg-home-invite .invite-h > h2,.home .thg-home-invite .invite-h > h3{max-width: 520px !important; line-height: 1.05 !important; color: var(--home-t1l) !important}
.home .thg-home-invite .invite-h em,.home .thg-home-invite .invite-h > h1 em,.home .thg-home-invite .invite-h > h2 em,.home .thg-home-invite .invite-h > h3 em{color: var(--brand-orange) !important; font-style: italic !important}
.home .thg-home-invite .invite-h sup,.home .thg-home-invite .invite-h > h1 sup,.home .thg-home-invite .invite-h > h2 sup{color: #B69658 !important; font-size: 14px !important}
@media(max-width:1100px){
.home .thg-home-hero{min-height: 100vh !important; height: auto !important}
.home .thg-home-hero-body{padding: 120px 32px 0 !important; padding-top: 130px !important; align-items: start !important}
.home .thg-home-hero-title{font-size: clamp(2.3rem,4.8vw,3.8rem) !important}
}
@media(max-width:640px){
.home .nav .nav-row{height: 64px !important}
.home .nav .site-logo__icon,.home .nav .site-logo__icon img{width: 40px !important; height: 40px !important}
.home .nav .site-logo__text{font-size: 9.5px !important}
.home .thg-home-hero{min-height: 92svh !important}
.home .thg-home-hero-body{padding: 108px 20px 44px !important; padding-top: 110px !important; align-items: start !important}
.home .thg-home-hero-title{font-size: clamp(2.15rem,9vw,3.2rem) !important; line-height: 1 !important}
.home .thg-home-invite .invite-h,.home .thg-home-invite .invite-h > h1,.home .thg-home-invite .invite-h > h2{max-width: 100% !important}
}
/* HERO VERTICAL COMPOSITION FIX — prevent H1 from sitting underneath fixed nav */
@media(max-width:1100px){
.home .thg-home-hero-body{padding: 120px 32px 0 !important; padding-top: 130px !important; align-items: start !important}
}
@media(max-width:640px){
.home .thg-home-hero-body{padding: 108px 20px 44px !important; padding-top: 110px !important; align-items: start !important}
}
/* HERO SINGLE-VIEW COMPOSITION — all hero content must fit one viewport */
.home .thg-home-hero{min-height: 100vh !important; height: 100vh !important}
.home .thg-home-hero-sub{font-size: 15px !important; line-height: 1.6 !important; margin-bottom: 28px !important; max-width: 500px !important}
.home .thg-home-hero-ctas{gap: 16px !important}
@media(max-width:1100px){
.home .thg-home-hero{min-height: 100vh !important; height: auto !important}
.home .thg-home-hero-body{padding: 120px 32px 0 !important; padding-top: 130px !important; align-items: start !important}
.home .thg-home-hero-title{font-size: clamp(2.3rem,4.8vw,3.8rem) !important}
.home .thg-home-hero-marquee{padding: 24px 32px 28px !important}
}
@media(max-width:760px){
.home .thg-home-hero{height: auto !important; min-height: 100svh !important}
.home .thg-home-hero-body{padding: 110px 20px 0 !important}
.home .thg-home-hero-title{max-width: 100% !important; font-size: clamp(2.1rem,7vw,2.8rem) !important}
.home .thg-home-hero-line{white-space: normal !important}
.home .thg-home-hero-marquee{padding: 24px 24px 32px !important}
}
/* HERO FINAL SIZE FIX — keep three ACF title rows and marquee in one frame */
.home .thg-home-hero-line{white-space: nowrap !important; display: block !important; margin: 0 !important; padding: 0 !important; line-height: .96 !important}
.home .thg-home-hero-body{padding: 110px 132px 0 !important; padding-top: 150px !important; align-items: center !important; min-height: 0 !important; flex: 1 1 auto !important}
.home .thg-home-hero-marquee{padding: 24px 132px 28px !important; flex: 0 0 auto !important; position: relative !important; z-index: 8 !important; display: grid !important; visibility: visible !important; opacity: 1 !important}
@media(max-width:1100px){
.home .thg-home-hero-title{font-size: clamp(2.3rem,4.8vw,3.8rem) !important}
.home .thg-home-hero-line{white-space: nowrap !important}
}
@media(max-width:760px){
.home .thg-home-hero-title{max-width: 100% !important; font-size: clamp(2.1rem,7vw,2.8rem) !important}
.home .thg-home-hero-line{white-space: normal !important}
}
/* HERO TYPE WEIGHT CALIBRATION — match Fraunces editorial reference */
.home .thg-home-hero-title{font-size: clamp(2.4rem,4vw,4rem) !important; max-width: none !important; line-height: .96 !important; margin-top: 0 !important; margin-bottom: 20px !important; font-weight: 300 !important; font-variation-settings: "opsz" 144,"wght" 300 !important}
.home .thg-home-hero-title strong{font-weight: 500 !important; font-variation-settings: "opsz" 144,"wght" 500 !important}
.home .thg-home-hero-line > p{display: inline !important; margin: 0 !important; padding: 0 !important; font: inherit !important; line-height: inherit !important; font-weight: 300 !important}
/* 1366/1440 DESKTOP CALIBRATION — keep hero at reference scale */
.home .thg-home-hero-bg{filter: saturate(1.05) contrast(1.05) !important}
.home .thg-home-hero-veil{background: radial-gradient(120% 80% at 20% 50%,rgba(14,20,17,.85) 0%,rgba(14,20,17,.5) 40%,rgba(14,20,17,.15) 70%,transparent 100%),linear-gradient(to bottom,rgba(14,20,17,.45) 0%,transparent 35%,rgba(14,20,17,.2) 60%,rgba(14,20,17,.92) 100%) !important}
@media(min-width:1101px) and (max-width:1440px){
.home .thg-home-hero-body{align-items: start !important; padding-top: 120px !important}
.home .thg-home-hero-title{font-size: clamp(2.8rem,4.4vw,3.6rem) !important}
.home .thg-home-hero-sub{font-size: 14px !important; line-height: 1.6 !important; margin-bottom: 24px !important}
.home .thg-home-hero-marquee{padding-top: 20px !important; padding-bottom: 24px !important}
}
@media(min-width:1441px){
.home .thg-home-hero-title{font-size: clamp(3rem,4.4vw,4.2rem) !important}
}
/* RESPONSIVE HERO REBUILD — no flex/grid compression on tablet and mobile */
@media(max-width:900px){
.home .thg-home-hero{height: auto !important; min-height: 0 !important; display: block !important; overflow: hidden !important}
.home .thg-home-hero-body{display: block !important; min-height: 0 !important; height: auto !important; padding: 128px 32px 56px !important}
.home .thg-home-hero-title{max-width: 760px !important; font-size: clamp(2.6rem,6vw,4.2rem) !important; line-height: .98 !important; margin: 0 0 24px !important}
.home .thg-home-hero-line{white-space: normal !important}
.home .thg-home-hero-sub{max-width: 560px !important; margin: 0 0 28px !important; font-size: 15px !important}
.home .thg-home-hero-ctas{display: flex !important; flex-direction: row !important; align-items: center !important; gap: 14px !important}
.home .thg-home-signature{display: none !important}
.home .thg-home-hero-marquee{display: grid !important; grid-template-columns: repeat(4,1fr) !important; width: 100% !important; padding: 24px 32px 28px !important}
}
@media(max-width:640px){
.home .thg-home-hero-body{padding: 108px 20px 44px !important; padding-top: 110px !important; align-items: start !important}
.home .thg-home-hero-title{font-size: clamp(2.15rem,9vw,3.2rem) !important; line-height: 1 !important}
.home .thg-home-hero-line{white-space: normal !important}
.home .thg-home-hero-sub{font-size: 14px !important; line-height: 1.65 !important}
.home .thg-home-hero-ctas{flex-direction: column !important; align-items: stretch !important}
.home .thg-home-hero-ctas .btn{width: 100% !important; justify-content: center !important}
.home .thg-home-hero-marquee{grid-template-columns: 1fr 1fr !important; padding: 22px 20px 28px !important; gap: 22px !important}
.home .thg-home-hmq{padding: 0 !important; border: 0 !important}
}
/* 1366px SAFE MODE — remove fixed-height compression and prevent marquee overlap */
@media(min-width:901px) and (max-width:1440px){
.home .thg-home-hero{height: auto !important; min-height: 92vh !important}
.home .thg-home-hero-body{display: grid !important; flex: none !important; min-height: 0 !important; height: auto !important; align-items: start !important; padding: 112px 96px 54px !important}
.home .thg-home-hero-title{font-size: clamp(2.6rem,4vw,3.35rem) !important; line-height: .98 !important; margin-bottom: 22px !important}
.home .thg-home-hero-sub{font-size: 14px !important; line-height: 1.55 !important; margin-bottom: 22px !important}
.home .thg-home-hero-marquee{position: relative !important; display: grid !important; flex: none !important; padding: 22px 96px 26px !important}
.home .thg-home-signature{padding: 28px 26px !important}
.home .thg-home-sig-name{font-size: 16px !important}
.home .thg-home-sig-item{gap: 10px !important; padding: 14px 0 !important}
}
/* Scaled 1920px monitors: 125% Windows scaling reports a ~1536px CSS viewport */
@media(min-width:901px) and (max-width:1700px){
.home .thg-home-hero{height: auto !important; min-height: 92vh !important}
.home .thg-home-hero-body{display: grid !important; flex: none !important; min-height: 0 !important; height: auto !important; align-items: start !important; padding: 120px 110px 54px !important}
.home .thg-home-hero-title{font-size: clamp(2.8rem,4.2vw,3.8rem) !important; line-height: .98 !important; margin-bottom: 24px !important}
.home .thg-home-hero-sub{font-size: 14px !important; line-height: 1.6 !important; margin-bottom: 24px !important}
.home .thg-home-hero-marquee{position: relative !important; display: grid !important; flex: none !important; padding: 24px 110px 28px !important}
.home .thg-home-signature{padding: 30px 28px !important}
.home .thg-home-sig-item{gap: 12px !important; padding: 15px 0 !important}
.home .thg-home-sig-name{font-size: 16px !important}
}
/* REVIEW ARCHIVE — THG Trip Reviews design, dynamic */
.rv-hero{min-height: 52vh; padding: 170px 0 72px; background: linear-gradient(180deg,rgba(14,20,17,.38),rgba(14,20,17,.92)),var(--rv-hero,linear-gradient(135deg,var(--ink),var(--ink-3))) center/cover; color: #fff}
.rv-hero .crumb{display: flex; gap: 10px; font: 11px var(--fu); letter-spacing: .28em; text-transform: uppercase; color: rgba(244,239,230,.6); margin-bottom: 28px}
.rv-hero .crumb b{color: var(--gold-lt)}
.rv-hero .eyebrow{color: var(--gold-lt); margin-bottom: 22px}
.rv-hero h1{font: 300 clamp(2.8rem,6vw,5.8rem)/1.02 var(--fe); letter-spacing: -.025em; max-width: 900px}
.rv-hero h1 em{color: var(--gold-lt)}
.rv-hero p{font: italic 18px/1.6 var(--fe); color: var(--t2d); max-width: 620px; margin-top: 22px}
.rv-scoreband{background: var(--bone); border-bottom: 1px solid var(--bone-3)}
.rv-scoregrid{display: grid; grid-template-columns: 240px 1fr 260px; gap: 48px; align-items: center; padding: 34px 0}
.rv-overall{background: var(--ink); padding: 25px; color: #fff}
.rv-average{font: 500 54px/1 var(--fd); letter-spacing: -.04em}
.rv-average small{font: italic 20px var(--fe); color: var(--gold-lt); margin-left: 4px}
.rv-stars,.rv-cardstars{display: flex; gap: 3px; margin-top: 10px}
.rv-label{font: 10px var(--fu); letter-spacing: .2em; text-transform: uppercase; color: var(--t2d); margin-top: 10px}
.rv-distribution{display: flex; flex-direction: column; gap: 10px}
.rv-distrow{display: grid; grid-template-columns: 46px 1fr 34px; gap: 10px; align-items: center; font: 12px var(--fu); color: var(--t2l)}
.rv-distrow i{color: var(--gold)}
.rv-distrow small{text-align: right; color: var(--t3l)}
.rv-track{height: 7px; background: var(--bone-3); overflow: hidden; border-radius: 99px}
.rv-track b{display: block; height: 100%; background: var(--ember); border-radius: 99px}
.rv-write h3{font: 400 20px/1.2 var(--fe); color: var(--ink); margin-bottom: 16px}
.rv-write h3 em{color: var(--ember)}
.rv-wrap{background: var(--paper); padding: 80px 0 120px}
.rv-layout{display: grid; grid-template-columns: 260px 1fr; gap: 64px; align-items: start}
.rv-filters{position: sticky; top: calc(var(--nav-h, 84px) + 26px); background: var(--bone); border: 1px solid var(--bone-3); padding: 25px}
.rv-filterhead{display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid var(--bone-3); padding-bottom: 17px; margin-bottom: 20px}
.rv-filterhead h2{font: 400 25px var(--fe); color: var(--ink)}
.rv-filterhead h2 em{color: var(--ember)}
.rv-filterhead a{font: 10px var(--fu); letter-spacing: .16em; text-transform: uppercase; color: var(--ember)}
.rv-filters fieldset{border: 0; padding: 0; margin: 0 0 20px}
.rv-filters legend{font: 600 10px var(--fu); letter-spacing: .25em; text-transform: uppercase; color: var(--ink); margin-bottom: 8px}
.rv-filters select{width: 100%; padding: 12px 10px; border: 1px solid var(--bone-3); background: #fff; color: var(--t2l); font: 13px var(--fu)}
.rv-apply{padding: 13px 15px !important; width: 100%; justify-content: center; margin-top: 3px}
.rv-mainhead{display: flex; justify-content: space-between; align-items: end; border-bottom: 1px solid var(--bone-3); padding-bottom: 23px; margin-bottom: 28px}
.rv-mainhead h2{font: 400 32px var(--fe); color: var(--ink); margin-top: 8px}
.rv-mainhead h2 em{font-style: italic; color: var(--ember); font-size: 20px}
.rv-sort{font: 11px var(--fu); letter-spacing: .15em; text-transform: uppercase; color: var(--t3l)}
.rv-list{display: flex; flex-direction: column; gap: 22px}
.rv-card{padding: 30px 34px; background: #fff; border: 1px solid var(--bone-3)}
.rv-cardtop{display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--bone-3)}
.rv-person{display: flex; align-items: center; gap: 14px}
.rv-avatar{width: 52px; height: 52px; border-radius: 50%; background: var(--ink); background-size: cover; background-position: center; display: grid; place-items: center; color: var(--gold-lt); font: italic 22px var(--fe); flex-shrink: 0}
.rv-person h3{font: 400 18px var(--fe); color: var(--ink)}
.rv-person p{font: 12px var(--fu); color: var(--t3l); margin-top: 3px}
.rv-body{font: 16px/1.75 var(--fu); color: var(--t1l); padding: 22px 0}
.rv-body p{margin: 0 0 14px}
.rv-body p:last-child{margin-bottom: 0}
.rv-cardfoot{display: flex; justify-content: space-between; border-top: 1px solid var(--bone-3); padding-top: 15px; font: 10px var(--fu); letter-spacing: .12em; text-transform: uppercase; color: var(--t3l)}
.rv-cardfoot span:last-child{color: var(--ember)}
.rv-empty{padding: 50px; background: var(--bone); text-align: center}
.rv-empty h3{font: 28px var(--fe); margin-bottom: 20px}
.rv-pagination{margin-top: 40px}
.rv-pagination ul{display: flex; justify-content: center; gap: 7px; list-style: none}
.rv-pagination a,.rv-pagination span{display: grid; place-items: center; min-width: 40px; height: 40px; padding: 0 12px; border: 1px solid var(--bone-3); font: 12px var(--fu); color: var(--t2l)}
.rv-pagination .current{background: var(--ink); border-color: var(--ink); color: #fff}
.rv-modal{position: fixed; inset: 0; display: none; place-items: center; padding: 25px; background: rgba(14,20,17,.78); backdrop-filter: blur(8px); z-index: 99999}
.rv-modal.open{display: grid}
.rv-modalpanel{position: relative; background: var(--paper); max-width: 680px; width: 100%; max-height: 90vh; overflow: auto; padding: 42px}
.rv-modalpanel h2{font: 300 35px var(--fe); color: var(--ink); margin: 10px 0 22px}
.rv-modalpanel h2 em{color: var(--ember)}
.rv-modalclose{position: absolute; right: 18px; top: 15px; border: 0; background: none; font-size: 28px; color: var(--ink); cursor: pointer}
/* WPForms inside the review modal: brand underline fields on paper (mirrors the .co-form skin; scoped to the modal so it can't leak). */
.rv-modal .wpforms-container,
.rv-modal .wpforms-container .wpforms-form{margin: 0; padding: 0}
.rv-modal .wpforms-field{margin: 0 0 22px; padding: 0}
.rv-modal .wpforms-field-label{display: block; font-family: var(--fu); font-size: 10.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--t3l); margin: 0 0 8px; font-weight: 500}
.rv-modal .wpforms-field-label .wpforms-required-label{color: var(--ember)}
.rv-modal .wpforms-field input[type=text],
.rv-modal .wpforms-field input[type=email],
.rv-modal .wpforms-field input[type=tel],
.rv-modal .wpforms-field input[type=number],
.rv-modal .wpforms-field input[type=date],
.rv-modal .wpforms-field select,
.rv-modal .wpforms-field textarea{width: 100% !important; max-width: 100% !important; background: transparent !important; border: none !important; border-bottom: 1px solid var(--bone-3) !important; border-radius: 0 !important; box-shadow: none !important; padding: 12px 0 !important; font-family: var(--fu) !important; font-size: 15px !important; color: var(--ink) !important; outline: none !important; transition: border-color .2s}
.rv-modal .wpforms-field input:focus,
.rv-modal .wpforms-field select:focus,
.rv-modal .wpforms-field textarea:focus{border-bottom-color: var(--brand-orange) !important}
.rv-modal .wpforms-field input::placeholder,
.rv-modal .wpforms-field textarea::placeholder{color: var(--t3l); opacity: .7}
.rv-modal .wpforms-field select option{background: #fff; color: var(--ink)}
.rv-modal .wpforms-field textarea{resize: vertical; min-height: 100px}
.rv-modal .wpforms-field-row{display: flex; gap: 24px}
.rv-modal .wpforms-field-row .wpforms-field-row-block{flex: 1; padding: 0}
.rv-modal .wpforms-submit-container{padding: 0; margin-top: 8px}
.rv-modal button[type=submit],
.rv-modal .wpforms-submit{background: var(--brand-orange) !important; color: #fff !important; border: none !important; border-radius: 0 !important; font-family: var(--fu) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .2em !important; text-transform: uppercase !important; padding: 18px !important; transition: background .3s !important; box-shadow: none !important; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer}
.rv-modal button[type=submit]:hover,
.rv-modal .wpforms-submit:hover{background: var(--ember-dk) !important}
.rv-modal .wpforms-error{font-family: var(--fu) !important; font-size: 13px !important; color: var(--ember) !important; margin-top: 6px}
.rv-modal .wpforms-field.wpforms-has-error input,
.rv-modal .wpforms-field.wpforms-has-error textarea{border-bottom-color: var(--brand-orange) !important}
.rv-modal .wpforms-confirmation-container-full{background: transparent !important; border: 1px solid var(--bone-3) !important; padding: 24px !important; font-family: var(--fe) !important; font-style: italic !important; font-size: 17px !important; color: var(--pine) !important}
@media(max-width:600px){
  .rv-modalpanel{padding: 30px 22px}
  .rv-modal .wpforms-field-row{flex-direction: column; gap: 0}
}
@media(max-width:900px){
.rv-scoregrid{grid-template-columns: 1fr 1fr}
.rv-write{grid-column: 1/-1}
.rv-layout{grid-template-columns: 1fr}
.rv-filters{position: static}
.rv-mainhead{align-items: flex-start; gap: 16px; flex-direction: column}
}
@media(max-width:600px){
.rv-hero{min-height: 55vh; padding: 130px 0 55px}
.rv-scoregrid{grid-template-columns: 1fr}
.rv-card{padding: 22px 20px}
.rv-cardtop{align-items: flex-start; flex-direction: column}
.rv-cardstars{margin-top: 0}
.rv-mainhead h2{font-size: 28px}
}
/* REVIEWS PAGE SHELL */
body:has(.rv-hero) .nav .site-logo__text{color: #fff !important}
body:has(.rv-hero) .foot-bottom{min-height: 48px !important}
/* Reviews archive footer/body seam */
html:has(body .rv-hero),body:has(.rv-hero){background: #0A0F0C !important; min-height: 100% !important}
body:has(.rv-hero) .site-main{background: var(--paper)}
body:has(.rv-hero) .footer{margin-top: 0 !important; display: block !important; clear: both !important; background: #0A0F0C !important; margin-bottom: 0 !important; position: relative; min-height: 260px}
body:has(.rv-hero) .footer::after{content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: #0A0F0C}
/* Review rating stars — filled count follows the stored review_rating value */
.rv-stars .thg-star-filled,.rv-cardstars .thg-star-filled,.stars .thg-star-filled{color: #B69658 !important; opacity: 1 !important}
.rv-stars .thg-star-empty,.rv-cardstars .thg-star-empty,.stars .thg-star-empty{color: #DDD3C0 !important; opacity: 1 !important}
.rv-stars .stars,.rv-cardstars .stars{display: inline-flex; gap: 3px}
.rv-stars .stars i,.rv-cardstars .stars i{font-size: 16px}
/* Solid deterministic review stars */
.thg-stars{display: inline-flex !important; align-items: center !important; gap: 3px !important; line-height: 1 !important; white-space: nowrap !important}
.thg-stars .thg-star{font-family: Arial,sans-serif !important; font-size: 18px !important; font-style: normal !important; line-height: 1 !important}
.thg-stars .thg-star-filled{color: #B69658 !important; text-shadow: 0 0 1px rgba(182,150,88,.35) !important}
.thg-stars .thg-star-empty{color: #DDD3C0 !important}
/* Trip direct pricing: sale price active, full price crossed out */
.glance-price .amt-old,.trip-card__meta .amt-old{display: block; color: var(--t3l); font: italic 13px var(--fu); text-decoration: line-through; margin-bottom: 3px}
.glance-price .amt-old sup,.trip-card__meta .amt-old sup{font-size: 10px}
/* TRIP MODULE 2 — editorial typography, optional rails, overview side panel */
.single-trip .hero-title{font-family: var(--fe) !important; font-size: clamp(3rem,5.4vw,4.8rem) !important; font-weight: 300 !important; line-height: 1.02 !important; letter-spacing: -.025em !important; color: #fff !important}
.single-trip .hero-title em{color: var(--gold-lt) !important; font-style: italic !important}
.single-trip .over-body{font-family: var(--fe); font-size: 19px; line-height: 1.75; color: var(--t1l)}
.single-trip .over-body>p:first-of-type::first-letter{float: left; font: 400 82px/.78 var(--fe); padding: 8px 15px 0 0; color: var(--ember)}
.single-trip .over-side.brackets::before,.single-trip .over-side.brackets::after{content: ''; position: absolute; width: 24px; height: 24px; border-color: var(--gold-lt)}
.single-trip .over-side.brackets::before{top: -2px; left: -1px; border-top: 1px solid; border-left: 1px solid}
.single-trip .over-side.brackets::after{right: -1px; bottom: -1px; border-right: 1px solid; border-bottom: 1px solid}
.single-trip .over-side dl{display: flex; flex-direction: column; margin: 0}
.single-trip .over-side dl>div{display: flex; justify-content: space-between; gap: 15px; padding: 13px 0; border-bottom: 1px solid var(--bone-3)}
.single-trip .over-side dt{font: 10px var(--fu); letter-spacing: .2em; text-transform: uppercase; color: var(--t3l)}
.single-trip .over-side dt i{color: var(--ember); margin-right: 7px}
.single-trip .over-side dd{font: italic 15px var(--fe); color: var(--t1l); text-align: right; margin: 0}
.trip-overview-head{background-image: var(--trip-overview-bg); background-size: cover; background-position: center}
.trip-overview-head h1{font-family: var(--fe); font-weight: 300; font-size: clamp(2.8rem,5.4vw,4.8rem); line-height: 1.02; color: #fff}
.trip-overview-head h1 em{color: var(--gold-lt); font-style: italic}
.overview-highlights{margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--bone-3)}
@media(max-width:900px){
.single-trip .over-grid{grid-template-columns: 1fr !important; gap: 48px !important}
.single-trip .over-side{position: static !important}
.single-trip .hero-title{font-size: clamp(2.5rem,7vw,4rem) !important}
}
.archive .price .amt-old{display: block; color: var(--t3l); font: italic 13px var(--fu); text-decoration: line-through; margin-bottom: 3px}
/* TRIP HERO FINAL ISOLATION — ACF title cannot be overridden by shared .hero-title rules */
.single-trip .trip-hero-title{font-family: var(--fe) !important; font-size: clamp(3.4rem,5.4vw,4.8rem) !important; font-weight: 300 !important; font-variation-settings: "opsz" 144,"wght" 300 !important; line-height: 1.02 !important; letter-spacing: -.025em !important; color: #fff !important; margin: 0 0 30px !important; max-width: 900px !important; display: block !important}
.single-trip .trip-hero-title em{font-style: italic !important; color: var(--gold-lt) !important; font-weight: 300 !important}
.single-trip .trip-hero-title strong{font-weight: 600 !important; color: #fff !important}
.single-trip .glance-price .amt-old{font-size: 18px !important; color: var(--ember) !important; font-family: var(--fu) !important; font-style: normal !important; font-weight: 600 !important; line-height: 1 !important; text-decoration: line-through !important; margin-bottom: 5px !important}
.single-trip .glance-price .amt{font: 400 30px var(--fe) !important; color: #fff !important}
.single-trip .glance-price .from{font: 500 10px var(--fu) !important; letter-spacing: .3em !important; text-transform: uppercase !important; color: rgba(244,239,230,.5) !important}
@media(max-width:900px){
.single-trip .trip-hero-title{font-size: clamp(2.6rem,7vw,4rem) !important}
}
.single-trip .sec-h>h1,.single-trip .sec-h>h2,.single-trip .sec-h>h3,.single-trip .sec-h>p{font: inherit !important; color: inherit !important; margin: 0 !important; padding: 0 !important; line-height: inherit !important}
.single-trip .sec-h>h2 em,.single-trip .sec-h>p em{color: var(--ember) !important; font-style: italic !important}
/* TRIP DESIGN TOKEN OVERRIDES — prevent later shared template rules */
.single-trip .hero-rail .rail-dot{display: block !important; width: 5px !important; height: 5px !important; border-radius: 50% !important; background: var(--ember) !important; box-shadow: 0 0 0 6px rgba(184,68,42,.18) !important}
.single-trip .hero-sub{font-family: var(--fu) !important; font-style: italic !important; font-size: 16px !important; font-weight: 300 !important; line-height: 1.7 !important; color: rgba(244,239,230,.78) !important; max-width: 520px !important; margin-bottom: 42px !important}
.single-trip .glance-grid{display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 1px !important; background: rgba(255,255,255,.08) !important}
.single-trip .glance-cell{font-family: var(--fu) !important; background: rgba(14,20,17,.4) !important; padding: 18px 16px !important; display: block !important}
.single-trip .glance-l{font-size: 9.5px !important; letter-spacing: .3em !important; color: rgba(244,239,230,.5) !important; font: 500 9.5px var(--fu) !important; text-transform: uppercase !important; font-family: var(--fu) !important; font-weight: 500 !important; margin-bottom: 6px !important}
.single-trip .glance-v{font-family: var(--fd) !important; font-size: 22px !important; font-weight: 500 !important; color: #fff !important; font: 500 22px var(--fd) !important; letter-spacing: -.01em !important; line-height: 1 !important}
.single-trip .glance-v small{font-family: var(--fe) !important; font-size: 12px !important; font-style: italic !important; color: var(--gold-lt) !important; margin-left: 4px !important; font-weight: 400 !important}
@media(max-width:900px){
.single-trip .hero-sub{font-size: 15px !important}
}
/* Trip-only classes to avoid shared-rule collisions */
.single-trip .trip-glance{background: rgba(14,20,17,.55) !important; backdrop-filter: blur(22px) saturate(130%) !important; border: 1px solid rgba(255,255,255,.1) !important; padding: 36px 32px !important; position: relative !important}
.single-trip .trip-glance-head{display: flex !important; align-items: center !important; justify-content: space-between !important; padding-bottom: 18px !important; margin-bottom: 18px !important; border-bottom: 1px solid rgba(255,255,255,.08) !important}
.single-trip .trip-glance-title{font: italic 18px var(--fe) !important; color: var(--gold-lt) !important}
.single-trip .trip-glance-no{font: 500 10px var(--fu) !important; letter-spacing: .3em !important; text-transform: uppercase !important; color: rgba(244,239,230,.4) !important}
.single-trip .trip-glance-grid{display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 1px !important; background: rgba(255,255,255,.08) !important}
.single-trip .trip-glance-cell{background: rgba(14,20,17,.4) !important; padding: 18px 16px !important}
.single-trip .trip-glance-l{font: 500 9.5px var(--fu) !important; letter-spacing: .3em !important; text-transform: uppercase !important; color: rgba(244,239,230,.5) !important; margin-bottom: 6px !important}
.single-trip .trip-glance-v{font: 500 22px/1 var(--fd) !important; letter-spacing: -.01em !important; color: #fff !important}
.single-trip .trip-glance-v small{font: italic 12px var(--fe) !important; color: var(--gold-lt) !important; margin-left: 4px !important}
.single-trip .trip-glance-price{padding: 20px 0 4px !important; display: flex !important; align-items: baseline !important; justify-content: space-between !important; border-top: 1px solid rgba(255,255,255,.08) !important; margin-top: 18px !important}
.single-trip .trip-glance-price .from{font: 500 10px var(--fu) !important; letter-spacing: .3em !important; text-transform: uppercase !important; color: rgba(244,239,230,.5) !important}
.single-trip .trip-glance-price .amt{font: 400 28px var(--fe) !important; color: #fff !important}
.single-trip .trip-glance-price .per{font: italic 13px var(--fe) !important; color: rgba(244,239,230,.55) !important}
.single-trip .trip-hero-sub{max-width: 520px !important; font: 300 16px/1.7 var(--fu) !important; color: rgba(244,239,230,.78) !important; margin-bottom: 42px !important}
.single-trip .trip-brief{background: var(--bone) !important; padding: 70px 0 !important; border-top: 1px solid var(--bone-3) !important; border-bottom: 1px solid var(--bone-3) !important}
.single-trip .trip-brief-row{display: grid !important; grid-template-columns: repeat(6,1fr) !important; gap: 0 !important}
.single-trip .trip-brief-cell{padding: 6px 28px !important; border-right: 1px solid var(--bone-3) !important; display: flex !important; flex-direction: column !important; gap: 10px !important; position: relative !important}
.single-trip .trip-brief-cell:first-child{padding-left: 0 !important}
.single-trip .trip-brief-cell:last-child{border-right: 0 !important; padding-right: 0 !important}
.single-trip .trip-brief-l{font: 600 10px var(--fu) !important; letter-spacing: .3em !important; text-transform: uppercase !important; color: var(--t3l) !important; display: flex !important; align-items: center; gap: 7px}
.single-trip .trip-brief-l i.ph{font-size: 14px; color: var(--ember); flex-shrink: 0}
.single-trip .trip-brief-v{font: 500 18px/1.2 var(--fe) !important; color: var(--ink) !important}
.single-trip .trip-brief-v em{color: var(--ember) !important; font-style: italic !important}
.single-trip .trip-glance-price .amt-old{font-size: 18px !important; color: var(--ember) !important}
@media(max-width:1000px){
.single-trip .trip-brief-row{grid-template-columns: repeat(2,1fr) !important; gap: 24px !important}
.single-trip .trip-brief-cell{padding: 0 !important; border: 0 !important}
}
@media(max-width:560px){
.single-trip .trip-brief-row{grid-template-columns: 1fr !important}
.single-trip .trip-brief{padding: 44px 0 !important}
}
/* Trip Overview subpage — H2 title, dynamic lede, generated H2 TOC */
.trip-overview-head .trip-overview-title{font: 300 clamp(2.4rem,4.8vw,4.8rem)/1.02 var(--fe) !important; color: #fff !important; letter-spacing: -.025em !important; margin: 0 !important; max-width: 950px !important}
.trip-overview-head .trip-overview-title em{font-style: italic !important; color: var(--gold-lt) !important}
.trip-overview-head .trip-overview-lede{font: 300 italic 18px/1.6 var(--fe) !important; color: rgba(244,239,230,.78) !important; max-width: 640px !important; margin-top: 22px !important}
/* overview subpage: tighter editorial heading rhythm. The h2 break is 44px — a clear section break above h3's 36px without reading high. Scoped to the overview article only; the blog .prose keeps the wider rhythm. */
.trip-overview-article .prose h2{margin: 44px 0 14px}
.trip-overview-article .prose h3{margin: 36px 0 10px}
.trip-overview-article .prose h4{margin: 28px 0 8px}
.trip-overview-article .prose h2:first-child{margin-top: 0}
.trip-overview-article .a-toc a{display: block; padding: 9px 0; border-left: 1px solid transparent; padding-left: 14px; margin-left: -14px; font: 13px var(--fu); color: var(--t2l); transition: all .2s}
.trip-overview-article .a-toc a:hover{color: var(--ember); border-left-color: var(--ember)}
.trip-overview-article .prose h2{scroll-margin-top: 160px}
.trip-overview-article .prose>p:first-of-type::first-letter{float: left; font: 400 82px/.78 var(--fe); padding: 8px 15px 0 0; color: var(--ember)}
/* Trip Overview side panel — exact design card */
.single-trip .over-grid{display: grid !important; grid-template-columns: 1.4fr .9fr !important; gap: 96px !important; align-items: start !important}
.single-trip .over-side{position: relative !important; top: auto !important; background: #fff !important; border: 1px solid var(--bone-3) !important; padding: 36px 32px !important; border-top: 2px solid var(--ember)}
.single-trip .over-side::before,.single-trip .over-side::after{content: ''; position: absolute; width: 22px; height: 22px; border-color: var(--gold-lt); pointer-events: none}
.single-trip .over-side::before{top: -1px; left: -1px; border-top: 1px solid; border-left: 1px solid}
.single-trip .over-side::after{bottom: -1px; right: -1px; border-bottom: 1px solid; border-right: 1px solid}
.single-trip .over-side h4{font: 600 11px var(--fu) !important; letter-spacing: .28em !important; text-transform: uppercase !important; color: var(--ember) !important; margin: 0 0 22px !important}
.single-trip .over-side ul{display: flex !important; flex-direction: column !important; gap: 14px !important; margin: 0 !important; padding: 0 !important; list-style: none !important}
.single-trip .over-side li{display: flex !important; align-items: flex-start !important; gap: 12px !important; font: 14px/1.55 var(--fu) !important; color: var(--t2l) !important}
.single-trip .over-side li i{color: var(--gold) !important; font-size: 18px !important; margin-top: 2px !important; flex-shrink: 0 !important}
.single-trip .over-side li strong{color: var(--ink) !important; font-weight: 600 !important}
.single-trip .over-side .more{margin-top: 26px !important; padding-top: 24px !important; border-top: 1px solid var(--bone-3) !important}
@media(max-width:900px){
.single-trip .over-grid{grid-template-columns: 1fr !important; gap: 48px !important}
.single-trip .over-side{position: static !important}
}
/* Trip Moments section heading — dynamic ACF title/description */
.single-trip #moments .moments-title{font-family: var(--fe) !important; font-size: clamp(2.4rem,4.6vw,4rem) !important; font-weight: 300 !important; line-height: 1.04 !important; letter-spacing: -.02em !important; color: var(--t1l) !important; display: block !important; max-width: 620px !important}
.single-trip #moments .moments-title em{color: var(--ember) !important; font-style: italic !important}
.single-trip #moments .moments-title>h1,.single-trip #moments .moments-title>h2,.single-trip #moments .moments-title>h3,.single-trip #moments .moments-title>p{font: inherit !important; color: inherit !important; margin: 0 !important; padding: 0 !important; line-height: inherit !important}
.single-trip #moments .moments-description{font-family: var(--fe) !important; font-style: italic !important; font-size: 16px !important; line-height: 1.6 !important; color: var(--t2l) !important; max-width: 440px !important}
/* TRIP ITINERARY NEW DYNAMIC LAYOUT */
.trip-itinerary-head{background-image: var(--trip-itinerary-bg); background-size: cover; background-position: center}
.trip-itinerary-head h1{font: 300 clamp(2.8rem,5.6vw,5rem)/1.02 var(--fe); color: #fff; letter-spacing: -.025em}
.trip-itinerary-head h1 em{color: var(--gold-lt); font-style: italic}
.trip-itinerary-head p{font: 300 italic 18px/1.6 var(--fe); color: var(--t2d); max-width: 680px; margin-top: 22px}
.trip-days{padding: 80px 0 40px; background: var(--paper)}
.trip-days .day-no .n{font: italic 14px var(--fe); color: var(--ember)}
.trip-days .day-no .num{font: 500 84px/.85 var(--fd); color: var(--ink); letter-spacing: -.04em; margin-top: 6px}
.trip-days .day-side:before,.trip-days .day-side:after{content: ''; position: absolute; width: 18px; height: 18px; border-color: var(--gold-lt)}
.trip-days .day-side:before{top: -1px; left: -1px; border-top: 1px solid; border-left: 1px solid}
.trip-days .day-side:after{right: -1px; bottom: -1px; border-right: 1px solid; border-bottom: 1px solid}
.trip-days .day-side>div{display: flex; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px dashed var(--bone-3); font: 14px var(--fu)}
.trip-days .day-side>div b{font: 600 10.5px var(--fu); letter-spacing: .16em; text-transform: uppercase; color: var(--t3l)}
.trip-days .day-side>div span{font: 14px var(--fe); color: var(--ink); text-align: right}
.trip-days .day-img{margin-top: 18px; height: 180px; background-size: cover; background-position: center}
.empty-state{background: var(--bone); padding: 48px; text-align: center; font: 22px var(--fe)}
@media(max-width:1024px){
.trip-days .day{grid-template-columns: 1fr; gap: 28px}
.trip-days .day-no,.trip-days .day-side{position: static}
}
@media(max-width:600px){
.trip-days .day-no .num{font-size: 64px}
}
/* ── Itinerary subpage — sticky layers + dynamic head image ── */
.trip-itinerary-head .phead-bg{background-image: var(--trip-itinerary-bg)}
.thg-itin-switch .container{padding: 0 var(--pad)}
.trip-days .day-no{position: sticky; top: calc(var(--nav-h, 84px) + 152px)}
.trip-days .day-side{position: sticky; top: calc(var(--nav-h, 84px) + 152px); background: #fff; border: 1px solid var(--bone-3); padding: 28px 26px}
/* ════════════════════════════════════════════════════════════════
   ITINERARY — main-page alignment + subpage showcase/overview/note
   ════════════════════════════════════════════════════════════════ */
/* Main-page sec-head: top-align heading + description */
.thg-itin .sec-head{align-items: start}
.thg-itin .sec-head .right{padding-top: 6px}
/* Main-page day title em → brand ember */
.itin-name em{font-style: italic; color: var(--ember)}
/* Subpage — showcase facts band (adapted from the compare design) */
.itin-showcase{background: var(--paper); padding: 80px 0 64px; border-bottom: 1px solid var(--bone-3)}
.ishow-grid{display: grid; grid-template-columns: 1.45fr .75fr; gap: 56px; align-items: center}
.ishow-facts .eyebrow{margin-bottom: 24px}
.ishow-tiles{display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--bone-3); border: 1px solid var(--bone-3)}
.ishow-tile{background: #fff; padding: 22px 20px; display: flex; flex-direction: column; gap: 6px; min-height: 84px; justify-content: center}
/* Price hero (right column) — matches the trip page glance-price. */
.ishow-hero{position: relative; background: #fff; border: 1px solid var(--bone-3); padding: 44px 40px; display: flex; flex-direction: column; gap: 12px; justify-self: stretch}
.ishow-hero::before{content: ''; position: absolute; top: -1px; left: -1px; width: 20px; height: 20px; border-top: 2px solid var(--gold); border-left: 2px solid var(--gold)}
.ishow-hero::after{content: ''; position: absolute; bottom: -1px; right: -1px; width: 20px; height: 20px; border-bottom: 2px solid var(--gold); border-right: 2px solid var(--gold)}
.ishow-hero-l{font-family: var(--fu); font-size: 10px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l)}
.ishow-old sup{font-size: .6em; margin-right: 1px}
@media(max-width:900px){
.ishow-grid{grid-template-columns: 1fr; gap: 32px}
.ishow-tiles{grid-template-columns: repeat(2,1fr)}
}
@media(max-width:520px){
.ishow-tiles{grid-template-columns: 1fr}
}
/* Subpage — variant overview prose */
.var-overview{padding: 80px 0 60px; background: var(--paper); border-bottom: 1px solid var(--bone-3)}
.var-overview .sec-head{margin-bottom: 48px}
.var-overview-body{max-width: none; margin: 0}
.var-overview-body p{font-family: var(--fu); font-size: 17px; line-height: 1.8; color: var(--t2l); font-weight: 300; margin-bottom: 20px}
.var-overview-body h1,.var-overview-body h2,.var-overview-body h3,.var-overview-body h4,.var-overview-body h5,.var-overview-body h6{font-family: var(--fe); font-weight: 400; color: var(--ink); letter-spacing: -.015em; margin: 2em 0 .6em}
.var-overview-body h2{font-size: clamp(26px,3vw,34px)}
.var-overview-body blockquote{font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--ink); border-left: 2px solid var(--ember); padding: 6px 0 6px 22px; margin: 24px 0}
.var-overview-body a{color: var(--ember); text-decoration: underline; text-underline-offset: 3px}
/* Subpage — guide note panel (end of itinerary) */
.itin-note{padding: 40px 0 80px; background: var(--paper)}
.itin-note-card{background: var(--bone); border: 1px solid var(--bone-3); border-left: 3px solid var(--ember); padding: 40px 44px}
.itin-note-card .eyebrow{margin-bottom: 18px}
.itin-note-card .entry-content{max-width: none; margin: 0}
.itin-note-card .entry-content p{font-family: var(--fu); font-size: 16px; line-height: 1.8; color: var(--t1l); font-weight: 300; margin: 0 0 14px}
.itin-note-card .entry-content h1,.itin-note-card .entry-content h2,.itin-note-card .entry-content h3,.itin-note-card .entry-content h4,.itin-note-card .entry-content h5,.itin-note-card .entry-content h6{font-family: var(--fe); font-weight: 400; color: var(--ink); letter-spacing: -.015em}
.itin-note-card .entry-content blockquote{font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--ink); border-left: 2px solid var(--ember); padding: 6px 0 6px 22px; margin: 20px 0}
.itin-note-card .entry-content a{color: var(--ember); text-decoration: underline; text-underline-offset: 3px}
.itin-note-card .entry-content p:last-child{margin-bottom: 0}
/* ── Day card typography (matches design) ── */
.trip-days .day-body h3{font: 400 30px/1.15 var(--fe); color: var(--ink); margin: 0 0 14px; position: static; padding-top: 0; font-family: var(--fe); font-weight: 400; font-size: 30px; line-height: 1.15; letter-spacing: -.015em}
.trip-days .day-body h3 em{color: var(--ember); font-style: italic}
.trip-days .day-body h3 p{margin: 0; font: inherit}
.trip-days .day-body .sub{font: 500 11px var(--fu); letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); margin-bottom: 24px; font-family: var(--fu); font-size: 11px; font-weight: 500}
.trip-days .day-body .entry-content{font: 300 16px/1.85 var(--fu); color: var(--t2l); max-width: none; margin: 0}
.trip-days .day-body .entry-content p{font-family: var(--fu); font-size: 16px; color: var(--t2l); line-height: 1.85; font-weight: 300; margin-bottom: 18px}
.trip-days .day-body .entry-content h1,.trip-days .day-body .entry-content h2,
.trip-days .day-body .entry-content h3,.trip-days .day-body .entry-content h4,
.trip-days .day-body .entry-content h5,.trip-days .day-body .entry-content h6{font-family: var(--fe); font-weight: 400; color: var(--ink); letter-spacing: -.015em}
.trip-days .day-body .entry-content blockquote{font-family: var(--fe); font-style: italic; font-size: 18px; color: var(--ink); border-left: 2px solid var(--ember); padding: 6px 0 6px 22px; margin: 24px 0}
.trip-days .day-body .entry-content a{color: var(--ember); text-decoration: underline; text-underline-offset: 3px}
/* Day number column — design pattern (): activity = small uppercase label, then "key place · altitude" = gold italic value. */
.trip-days .day-no .alt{font: 500 10.5px var(--fu); letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); margin-top: 14px; font-family: var(--fu); font-size: 10.5px; font-weight: 500; line-height: 1.6}
.trip-days .day-no .alt b{display: block; font: italic 16px var(--fe); color: var(--gold); margin-top: 4px; letter-spacing: 0; text-transform: none; font-family: var(--fe); font-style: italic; font-size: 16px; font-weight: 400; line-height: 1.35}
/* ── Accordion toggle: use + / − (no rotate) ── */
.itin-row.open .itin-toggle{background: var(--ember); color: #fff; border-color: var(--ember); transform: none; font-size: 18px}
/* Accordion fallback: the open row is always visible (JS refines the height). */
.itin-row.open .itin-body{max-height: 800px}
/* Day cards must never be hidden by a stray reveal/animation state. Layout stays owned by the base .day rule and its ≤1024px stacking rules — re-asserting the 3-column grid here overrode the mobile stack and forced horizontal scroll on phones (). */
.trip-days .day{opacity: 1 !important; transform: none !important}
/* Itinerary list + variants pills must render even without scroll animation JS. */
.itin-list,.itin-variants{opacity: 1 !important; transform: none !important}
/* Main-page itinerary accordion description — match design (15px/300/1.75). */
.itin-desc.entry-content{max-width: none; margin: 0}
.itin-desc.entry-content p{margin-bottom: 12px; font-family: var(--fu); font-size: 15px; font-weight: 300; color: var(--t2l); line-height: 1.75}
.itin-desc.entry-content p:last-child{margin-bottom: 0}
.itin-desc.entry-content h1,.itin-desc.entry-content h2,.itin-desc.entry-content h3,
.itin-desc.entry-content h4,.itin-desc.entry-content h5,.itin-desc.entry-content h6{font-family: var(--fe); font-weight: 400; color: var(--ink); letter-spacing: -.015em}
.itin-desc.entry-content blockquote{font-family: var(--fe); font-style: italic; font-size: 16px; color: var(--ink); border-left: 2px solid var(--ember); padding: 4px 0 4px 20px; margin: 16px 0}
.itin-desc.entry-content a{color: var(--ember); text-decoration: underline; text-underline-offset: 3px}
/* ── Itinerary polish: facts blend with brand, price hero refined ── */
.thg-itin .sec-head .right p{text-align: left; font-family: var(--fu); font-style: normal; font-size: 15px; color: var(--t2l); font-weight: 300; line-height: 1.7}
/* Showcase facts — editorial values (Inter Tight), gold micro-labels. */
.ishow-tile .ishow-v{font-family: var(--fu); font-size: 17px; font-weight: 500; color: var(--t2l); letter-spacing: -.005em; line-height: 1.3; font-variant-numeric: tabular-nums}
.ishow-tile .ishow-l{font-family: var(--fu); font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gold)}
/* Price hero — Bricolage numerals, refined sale strike. */
.ishow-hero-price{display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap}
.ishow-old{font-family: var(--fd); font-size: 22px; font-weight: 500; color: var(--t3l); text-decoration: line-through; text-decoration-thickness: 1.5px; text-decoration-color: var(--ember); font-variant-numeric: tabular-nums}
.ishow-hero-n{font-family: var(--fd); font-weight: 500; font-size: clamp(2.6rem,4.6vw,3.8rem); line-height: 1; color: var(--ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums}
.ishow-hero-n sup{font-size: .5em; font-weight: 400; margin-right: 3px; color: var(--ember); font-family: var(--fe); font-style: italic}
.ishow-hero-sub{font-family: var(--fe); font-size: 13px; font-weight: 400; color: var(--t2l); letter-spacing: .04em; font-style: italic}
/* variant hero inquiry button (light-skin outline, matches card) */
.ishow-inq{margin-top: 18px; justify-content: center}
.ishow-ask{font-family: var(--fe); font-style: italic; font-size: clamp(1.5rem,2.6vw,2rem); font-weight: 300; color: var(--t2l); letter-spacing: -.01em}
/* Route heading: pinned with LITERAL values (font names + hex) so it
   renders correctly even when :root variables are missing or overridden
   by plugin / Customizer CSS — an invalid var() falls back to the
   inherited or initial value (browser default sans-serif). */
#route .sec-head,
section#route .sec-head{display: grid !important; grid-template-columns: 1.1fr .9fr !important; gap: 64px !important; align-items: start !important; margin-bottom: 72px !important; text-align: left !important; direction: ltr !important}
#route .sec-head > *{text-align: left !important}
/* Highest-specificity selector for the H2 with LITERAL values so it
   works even when CSS variables get clobbered by a plugin. */
html body #route .sec-head h2.sec-h,
html body #route .sec-head .sec-h{display: block !important; grid-column: auto !important; order: 0 !important; -webkit-box-orient: initial !important; overflow: visible !important; text-overflow: clip !important; -webkit-line-clamp: unset !important; line-clamp: unset !important; font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-weight: 300 !important; font-style: normal !important; font-size: clamp(2.4rem,4.6vw,4rem) !important; line-height: 1.04 !important; letter-spacing: -.02em !important; color: #161D19 !important; font-variation-settings: "opsz" 144 !important; text-align: left !important; margin: 0 !important; padding: 0 !important; max-width: none !important; width: auto !important; float: none !important; position: static !important; text-transform: none !important}
html body #route .sec-head h2.sec-h em,
html body #route .sec-head .sec-h em{font-style: italic !important; color: #B8442A !important; font-weight: 400 !important; font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; display: inline !important; background: transparent !important; text-decoration: none !important}
html body #route .sec-head .right{display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 18px !important; text-align: left !important; justify-self: start !important; max-width: 440px !important; grid-column: auto !important; order: 0 !important}
html body #route .sec-head .right p{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-style: italic !important; font-size: 16px !important; color: #4A453E !important; max-width: 440px !important; line-height: 1.6 !important; font-weight: 300 !important; text-align: left !important; margin: 0 !important}
/* Route/Altitude card H4 <em> — same defensive literal color */
html body #route .route-card h4 em,
html body #route .alt-card h4 em{font-style: italic !important; color: #B8442A !important; font-weight: 400 !important}
/* Belt-and-braces: if a legacy <p> ever sneaks inside the h2, render inline */
html body #route .sec-head .sec-h p{display: inline !important; margin: 0 !important; padding: 0 !important; font: inherit !important; color: inherit !important; background: transparent !important}
@media(max-width:900px){
html body #route .sec-head{grid-template-columns: 1fr !important; gap: 24px !important}
html body #route .sec-head .right{justify-self: start !important}
}
/* 
   Cost & Dates section — both trip page (#cost) and subpage.

   Fixes the conflict where an older ".cost-wrap {display:grid;...}"
   and ".dep {display:grid;...}" block (~line 1113/1143) leaks into
   the new dark cost-wrap section. Uses literal font names + hex
   colors (literal-value pattern) so plugin CSS that wipes CSS vars
   cannot break the render. */
section.cost-wrap#cost{display: block !important; background: #0E1411 !important; color: #F4EFE6 !important; padding: 130px 0 !important; position: relative !important; overflow: hidden !important}
section.cost-wrap#cost::before{content: '' !important; position: absolute !important; inset: 0 !important; background: linear-gradient(158deg,#1A2420,#0E1411) center/cover !important; opacity: .12 !important}
section.cost-wrap#cost::after{content: '' !important; position: absolute !important; inset: 0 !important; background: linear-gradient(180deg,rgba(14,20,17,.95),rgba(14,20,17,.98)) !important}
section.cost-wrap#cost > .container{position: relative !important; z-index: 2 !important}
/* Heading (centered editorial) */
#cost .cost-head{text-align: center !important; margin-bottom: 62px !important}
#cost .cost-head .eyebrow{justify-content: center !important; color: #B8442A !important}
#cost .cost-head .eyebrow.center{display: inline-flex !important}
#cost .cost-head .eyebrow::after{content: '' !important; width: 28px !important; height: 1px !important; background: currentColor !important; opacity: .9 !important}
#cost .cost-head h2{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-weight: 300 !important; font-size: clamp(2.4rem,4.6vw,3.8rem) !important; color: #fff !important; line-height: 1.05 !important; margin-top: 20px !important; letter-spacing: -.02em !important; font-variation-settings: "opsz" 144 !important; text-align: center !important; display: block !important; overflow: visible !important; -webkit-line-clamp: unset !important; line-clamp: unset !important}
#cost .cost-head h2 em{font-style: italic !important; color: #D6B97E !important; font-weight: 300 !important}
#cost .cost-head p{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-style: italic !important; font-size: 16px !important; color: rgba(244,239,230,.7) !important; max-width: 560px !important; margin: 18px auto 0 !important; line-height: 1.6 !important; text-align: center !important}
/* Tabs */
#cost .cost-tabs{display: flex !important; justify-content: center !important; gap: 0 !important; margin-bottom: 42px !important; border-bottom: 1px solid rgba(255,255,255,.1) !important}
#cost .cost-tab.active{color: #fff !important; border-bottom-color: #B8442A !important}
#cost .cost-tab:hover{color: #fff !important}
#cost .cost-tab i.ph{margin-right: 10px !important; font-size: 16px !important}
#cost .cost-panel{display: none !important}
#cost .cost-panel.active{display: block !important}
/* Season pills */
#cost .season-pills{display: flex !important; justify-content: center !important; gap: 8px !important; margin-bottom: 42px !important; flex-wrap: wrap !important}
#cost .season-pill .dot{width: 7px !important; height: 7px !important; border-radius: 50% !important; background: #B69658 !important; opacity: .5 !important}
#cost .season-pill.peak .dot{background: #B8442A !important}
#cost .season-pill.active{background: #B8442A !important; border-color: #B8442A !important; color: #fff !important}
#cost .season-pill.active .dot{background: #fff !important; opacity: 1 !important}
#cost .season-pill.disabled{opacity: .3 !important; cursor: not-allowed !important}
/* Departure cards grid (dark theme, on trip page) */
#cost .deps{display: grid !important; grid-template-columns: repeat(3,1fr) !important; gap: 16px !important; margin-bottom: 60px !important}
#cost .deps > .dep-wrap{display: contents}
#cost .dep{display: block !important; grid-template-columns: none !important; background: rgba(244,239,230,.04) !important; border: 1px solid rgba(255,255,255,.1) !important; padding: 26px 24px !important; position: relative !important; color: #F4EFE6 !important; margin: 0 !important}
#cost .dep:hover{background: rgba(244,239,230,.06) !important; border-color: #D6B97E !important}
#cost .dep .dep-status{position: absolute !important; top: 18px !important; right: 20px !important; font-family: 'Inter Tight',sans-serif !important; font-size: 9.5px !important; letter-spacing: .24em !important; text-transform: uppercase !important; padding: 5px 10px !important; width: auto !important}
#cost .dep .dep-status.open{color: #D6B97E !important; border: 1px solid #D6B97E !important; background: transparent !important}
#cost .dep .dep-status.filling{color: #B8442A !important; border: 1px solid #B8442A !important; background: rgba(184,68,42,.1) !important}
#cost .dep .dep-status.sold{color: rgba(244,239,230,.45) !important; border: 1px solid rgba(244,239,230,.25) !important; background: transparent !important}
#cost .dep .dep-month{font-family: 'Inter Tight',sans-serif !important; font-size: 10px !important; letter-spacing: .36em !important; text-transform: uppercase !important; color: rgba(244,239,230,.5) !important; margin-bottom: 8px !important}
#cost .dep .dep-date{font-family: 'Fraunces',serif !important; font-size: 28px !important; font-weight: 400 !important; color: #fff !important; line-height: 1.1 !important; margin-bottom: 4px !important}
#cost .dep .dep-date em{font-style: italic !important; color: #D6B97E !important}
#cost .dep .dep-year{font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 14px !important; color: rgba(244,239,230,.55) !important; margin-bottom: 18px !important}
#cost .dep .dep-avail{display: flex !important; flex-direction: row !important; align-items: center !important; gap: 10px !important; margin-bottom: 18px !important; padding-top: 18px !important; border-top: 1px dashed rgba(255,255,255,.12) !important}
#cost .dep .dep-avail .dots{display: flex !important; flex-direction: row !important; gap: 5px !important}
#cost .dep .dep-avail .d{width: 9px !important; height: 9px !important; background: #D6B97E !important; border-radius: 50% !important}
#cost .dep .dep-avail .d.empty{background: rgba(255,255,255,.12) !important}
#cost .dep .dep-avail .txt{font-family: 'Inter Tight',sans-serif !important; font-size: 10.5px !important; letter-spacing: .16em !important; text-transform: uppercase !important; color: rgba(244,239,230,.65) !important; margin-left: auto !important}
#cost .dep .dep-cta{display: inline-flex !important; align-items: center !important; gap: 8px !important; font-family: 'Inter Tight',sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .2em !important; text-transform: uppercase !important; color: #B8442A !important; padding: 0 0 4px 0 !important; border-bottom: 1px solid #B8442A !important; background: transparent !important; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; text-decoration: none !important; justify-self: auto !important}
#cost .dep .dep-cta:hover{gap: 14px !important; color: #B8442A !important; background: transparent !important}
#cost .dep.sold .dep-cta{color: rgba(244,239,230,.45) !important; border-color: rgba(244,239,230,.25) !important}
/* Deps footer link */
#cost .deps-foot{text-align: center !important; margin-top: 20px !important; padding: 24px 0 !important; display: block !important}
#cost .deps-foot p{font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 14px !important; color: rgba(244,239,230,.65) !important; margin-bottom: 16px !important}
#cost .deps-foot p b{color: #D6B97E !important; font-weight: 400 !important; font-style: normal !important; font-family: 'Inter Tight',sans-serif !important; letter-spacing: .06em !important}
#cost .deps-foot .link-arrow{color: #D6B97E !important; border-color: #D6B97E !important}
/* Pricing matrix — inside cost-wrap, keep spacing */
#cost .matrix-wrap{margin-top: 60px !important}
/* Private departure inside compact tab */
#cost .private{display: grid !important; grid-template-columns: 1.4fr 1fr !important; gap: 64px !important; align-items: start !important}
#cost .private h3{font-family: 'Fraunces',serif !important; font-weight: 300 !important; font-size: 36px !important; line-height: 1.1 !important; color: #fff !important; margin-bottom: 22px !important}
#cost .private h3 em{font-style: italic !important; color: #D6B97E !important}
#cost .private .private-body{font-family: 'Inter Tight',sans-serif !important; font-size: 15.5px !important; color: rgba(244,239,230,.75) !important; line-height: 1.75 !important}
#cost .private .private-body p{margin-bottom: 16px !important}
#cost .private .private-body ul{margin: 20px 0 !important; padding: 0 !important; list-style: none !important}
#cost .private .private-body li{padding-left: 26px !important; position: relative !important; margin-bottom: 10px !important; font-family: 'Inter Tight',sans-serif !important; color: rgba(244,239,230,.75) !important}
#cost .private .private-body li::before{content: '✓' !important; position: absolute !important; left: 0 !important; color: #D6B97E !important}
/* .private-cta (compact mode) removed in 1.54.0 — the private departure now
   renders inline with its real form; no template emits that class. */
/* Responsive */
@media (max-width:1000px){
#cost .deps{grid-template-columns: repeat(2,1fr) !important}
#cost .private{grid-template-columns: 1fr !important}
}
@media (max-width:640px){
#cost .deps{grid-template-columns: 1fr !important}
#cost .cost-tabs{flex-direction: column !important}
}
/* SUBPAGE (light .sec + .sec.alt) — keep departure cards + matrix legible.
   The subpage's dep cards live inside a light .sec, so they need the LIGHT
   variant of the card styling. */
section#scheduled .deps{display: grid !important; grid-template-columns: repeat(3,1fr) !important; gap: 16px !important}
section#scheduled .dep{display: block !important; background: #fff !important; color: #161D19 !important; border: 1px solid #DDD3C0 !important; padding: 26px 24px !important; position: relative !important}
section#scheduled .dep .dep-status{position: absolute !important; top: 18px !important; right: 20px !important}
section#scheduled .dep .dep-status.open{color: #4A5B43 !important; border: 1px solid #4A5B43 !important}
section#scheduled .dep .dep-status.filling{color: #B8442A !important; border: 1px solid #B8442A !important; background: rgba(184,68,42,.08) !important}
section#scheduled .dep .dep-status.sold{color: #8A8074 !important; border: 1px solid #DDD3C0 !important}
section#scheduled .dep .dep-month{font-family: 'Inter Tight',sans-serif !important; font-size: 10px !important; letter-spacing: .36em !important; text-transform: uppercase !important; color: #8A8074 !important; margin-bottom: 8px !important}
section#scheduled .dep .dep-date{font-family: 'Fraunces',serif !important; font-size: 28px !important; color: #161D19 !important; line-height: 1.1 !important; margin-bottom: 4px !important}
section#scheduled .dep .dep-date em{color: #B8442A !important; font-style: italic !important}
section#scheduled .dep .dep-year{font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 14px !important; color: #4A453E !important; margin-bottom: 18px !important}
section#scheduled .dep .dep-avail{display: flex !important; flex-direction: row !important; align-items: center !important; padding-top: 18px !important; border-top: 1px dashed #DDD3C0 !important}
section#scheduled .dep .dep-avail .dots{display: flex !important; flex-direction: row !important; gap: 5px !important}
section#scheduled .dep .dep-avail .d{width: 9px !important; height: 9px !important; background: #B8442A !important; border-radius: 50% !important}
section#scheduled .dep .dep-avail .d.empty{background: #DDD3C0 !important}
section#scheduled .dep .dep-avail .txt{font-family: 'Inter Tight',sans-serif !important; font-size: 10.5px !important; letter-spacing: .16em !important; text-transform: uppercase !important; color: #4A453E !important; margin-left: auto !important}
section#scheduled .dep .dep-cta{display: inline-flex !important; align-items: center !important; gap: 8px !important; color: #B8442A !important; font-family: 'Inter Tight',sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .2em !important; text-transform: uppercase !important; padding: 0 0 4px 0 !important; border-bottom: 1px solid #B8442A !important; background: transparent !important; text-decoration: none !important}
@media (max-width:1000px){
section#scheduled .deps{grid-template-columns: repeat(2,1fr) !important}
}
@media (max-width:640px){
section#scheduled .deps{grid-template-columns: 1fr !important}
}
/* Cost-tab badge sits inline rather than absolutely overlapping */
#cost .cost-tab{font-family: 'Inter Tight',system-ui,sans-serif !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .24em !important; text-transform: uppercase !important; color: rgba(244,239,230,.55) !important; padding: 18px 36px !important; cursor: pointer !important; background: none !important; border: none !important; border-bottom: 1px solid transparent !important; position: relative !important; padding-right: 36px !important; padding-left: 36px !important}
#cost .cost-tab .badge{position: static !important; top: 8px !important; right: 8px !important; font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 10px !important; color: #D6B97E !important; margin-left: 10px !important; display: inline-block !important; vertical-align: middle !important}
/* deps-foot should not read "Showing 0 of 6" when every default-season card is visible; hide the sentence when all are shown */
/* 
   Refinements:
   - Matrix footnote (main + subpage) small italic under matrix.
   - Subpage: intro is full-width rich content BEFORE season pills.
   - Subpage: departure list-row layout (light theme).
   - Subpage: matrix on light background — dark text, readable.
   - Subpage private: title LEFT, price RIGHT; body colours.
   - Subpage policy: light editorial background (bone-2) instead of ink. */
/* Matrix footnote — small italic below matrix (works dark + light) */
#cost .matrix-footnote,
section#pricing .matrix-footnote{max-width: 1000px !important; margin: 22px auto 0 !important; font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-style: italic !important; font-size: 14px !important; line-height: 1.6 !important; text-align: center !important}
#cost .matrix-footnote{color: rgba(244,239,230,.55) !important}
#cost .matrix-footnote em{color: #D6B97E !important}
section#pricing .matrix-footnote{color: #4A453E !important}
section#pricing .matrix-footnote em{color: #B8442A !important; font-style: italic !important}
section#pricing .matrix-footnote p{margin: 0 0 8px !important}
/* ─── Subpage: Fixed Departures Intro — FULL-WIDTH rich content ─── */
section#scheduled .cost-intro{max-width: 920px !important; margin: 0 auto 42px !important; font-family: 'Inter Tight',system-ui,sans-serif !important; font-size: 16px !important; line-height: 1.75 !important; color: #4A453E !important; text-align: left !important}
section#scheduled .cost-intro h1,
section#scheduled .cost-intro h2,
section#scheduled .cost-intro h3,
section#scheduled .cost-intro h4{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-weight: 400 !important; color: #161D19 !important; margin: 24px 0 12px !important; line-height: 1.25 !important}
section#scheduled .cost-intro h2{font-size: 24px !important}
section#scheduled .cost-intro h3{font-size: 20px !important}
section#scheduled .cost-intro h4{font-size: 16px !important; letter-spacing: .02em !important}
section#scheduled .cost-intro em{font-style: italic !important; color: #B8442A !important}
section#scheduled .cost-intro p{margin: 0 0 14px !important}
section#scheduled .cost-intro ul,
section#scheduled .cost-intro ol{margin: 0 0 16px 22px !important; padding: 0 !important}
section#scheduled .cost-intro li{margin-bottom: 6px !important}
section#scheduled .cost-intro a{color: #B8442A !important; text-decoration: underline !important; text-underline-offset: 2px !important}
section#scheduled .cost-intro a:hover{color: #8E3320 !important}
section#scheduled .cost-intro table{width: 100% !important; border-collapse: collapse !important; margin: 16px 0 !important}
section#scheduled .cost-intro th,
section#scheduled .cost-intro td{padding: 10px 14px !important; border: 1px solid #DDD3C0 !important; text-align: left !important}
section#scheduled .cost-intro th{background: #ECE5D8 !important; font-weight: 600 !important; font-family: 'Inter Tight',sans-serif !important; font-size: 12px !important; letter-spacing: .12em !important; text-transform: uppercase !important}
section#scheduled .cost-intro img{max-width: 100% !important; height: auto !important}
section#scheduled .cost-intro blockquote{border-left: 3px solid #B8442A !important; padding: 8px 0 8px 20px !important; margin: 16px 0 !important; font-style: italic !important; color: #4A453E !important; font-family: 'Fraunces',serif !important}
/* ─── Subpage: List-row departures (Item 9) ─── */
section#scheduled .dep-list{border-top: 1px solid #DDD3C0 !important; margin-top: 20px !important}
/* no !important — must let inline style="display:none" (from PHP
   default-hide + JS pill filter) win. <div> is display:block by default,
   so we don't actually need any rule; keep this line only as documentation. */
section#scheduled .dep-row-wrap{display: block}
section#scheduled .dep-row{display: grid !important; grid-template-columns: 130px 1fr 260px 110px 150px !important; gap: 28px !important; align-items: center !important; padding: 26px 12px !important; border-bottom: 1px solid #DDD3C0 !important; background: transparent !important; transition: background .25s !important}
section#scheduled .dep-row:hover{background: rgba(184,68,42,.04) !important}
section#scheduled .dep-row.sold{opacity: .55 !important}
section#scheduled .dep-num{font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 14px !important; color: #B8442A !important}
section#scheduled .dep-num b{display: block !important; font-family: 'Bricolage Grotesque','Inter Tight',sans-serif !important; font-style: normal !important; font-size: 28px !important; color: #161D19 !important; font-weight: 500 !important; margin-top: 2px !important}
section#scheduled .dep-row .dep-date{font-family: 'Fraunces',serif !important; font-size: 22px !important; font-weight: 400 !important; color: #161D19 !important; line-height: 1.2 !important; margin: 0 !important}
section#scheduled .dep-row .dep-date em{font-style: italic !important; color: #B8442A !important; margin: 0 6px !important}
section#scheduled .dep-row .dep-date span{display: block !important; font-family: 'Inter Tight',sans-serif !important; font-style: normal !important; font-size: 10.5px !important; font-weight: 500 !important; letter-spacing: .22em !important; text-transform: uppercase !important; color: #8A8074 !important; margin-top: 6px !important}
section#scheduled .dep-row .dep-avail{display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; padding-top: 0 !important; border-top: 0 !important; margin: 0 !important}
section#scheduled .dep-row .dep-avail .dots{display: flex !important; gap: 4px !important}
section#scheduled .dep-row .dep-avail .d{width: 10px !important; height: 10px !important; background: #B8442A !important; border-radius: 50% !important}
section#scheduled .dep-row .dep-avail .d.empty{background: #DDD3C0 !important}
section#scheduled .dep-row .dep-avail .txt{font-family: 'Inter Tight',sans-serif !important; font-size: 10.5px !important; letter-spacing: .18em !important; text-transform: uppercase !important; color: #4A453E !important; margin: 0 !important}
section#scheduled .dep-row .dep-status{position: static !important; font-family: 'Inter Tight',sans-serif !important; font-size: 10px !important; letter-spacing: .24em !important; text-transform: uppercase !important; padding: 7px 12px !important; text-align: center !important; width: fit-content !important; background: transparent !important}
section#scheduled .dep-row .dep-status.open{color: #4A5B43 !important; border: 1px solid #4A5B43 !important}
section#scheduled .dep-row .dep-status.filling{color: #B8442A !important; border: 1px solid #B8442A !important; background: rgba(184,68,42,.08) !important}
section#scheduled .dep-row .dep-status.sold{color: #8A8074 !important; border: 1px solid #DDD3C0 !important}
section#scheduled .dep-row .dep-cta{justify-self: end !important; display: block !important}
section#scheduled .dep-row .dep-cta a{display: inline-flex !important; align-items: center !important; gap: 8px !important; font-family: 'Inter Tight',sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .18em !important; text-transform: uppercase !important; color: #B8442A !important; padding: 11px 18px !important; border: 1px solid #B8442A !important; background: transparent !important; text-decoration: none !important; transition: all .25s !important}
section#scheduled .dep-row .dep-cta a:hover{background: #B8442A !important; color: #fff !important}
section#scheduled .dep-row.sold .dep-cta a{color: #8A8074 !important; border-color: #DDD3C0 !important}
@media (max-width:1024px){
section#scheduled .dep-row{grid-template-columns: 100px 1fr 110px !important}
section#scheduled .dep-row .dep-avail{grid-column: 2 !important}
section#scheduled .dep-row .dep-cta{grid-column: 1 / -1 !important; justify-self: start !important; margin-top: 10px !important}
}
@media (max-width:640px){
section#scheduled .dep-row{grid-template-columns: 1fr !important; gap: 14px !important}
}
/* ─── Subpage: Matrix on light .sec.alt background (Item 10) ─── */
section#pricing.sec.alt .matrix-wrap{background: #FAF6EF !important; border: 1px solid #DDD3C0 !important; padding: 8px !important; position: relative !important; color: #161D19 !important}
section#pricing.sec.alt .matrix-wrap::before,
section#pricing.sec.alt .matrix-wrap::after,
section#pricing.sec.alt .matrix-wrap > .br1,
section#pricing.sec.alt .matrix-wrap > .br2{border-color: #B69658 !important}
section#pricing.sec.alt .matrix-meta{border-bottom: 1px solid #DDD3C0 !important}
section#pricing.sec.alt .matrix-meta .tag{color: #8E3320 !important; font-family: 'Inter Tight',sans-serif !important}
section#pricing.sec.alt .matrix-meta .stamp{color: #4A453E !important; border-color: #B69658 !important}
section#pricing.sec.alt .matrix{background: transparent !important}
section#pricing.sec.alt .matrix th,
section#pricing.sec.alt .matrix td{border-bottom: 1px solid #DDD3C0 !important}
section#pricing.sec.alt .matrix th{color: #4A453E !important; background: #ECE5D8 !important; font-family: 'Inter Tight',sans-serif !important}
section#pricing.sec.alt .matrix td{color: #161D19 !important; font-family: 'Fraunces',serif !important}
section#pricing.sec.alt .matrix td:first-child{color: #161D19 !important; font-family: 'Fraunces',serif !important; font-size: 15px !important}
section#pricing.sec.alt .matrix td:first-child small{color: #8A8074 !important; font-family: 'Inter Tight',sans-serif !important}
section#pricing.sec.alt .matrix td:first-child em{color: #B8442A !important; font-style: italic !important}
section#pricing.sec.alt .matrix td:not(:first-child){font-family: 'Bricolage Grotesque','Inter Tight',sans-serif !important; color: #161D19 !important; font-size: 22px !important; font-weight: 500 !important; text-align: right !important}
section#pricing.sec.alt .matrix tr.featured td{background: rgba(184,68,42,.08) !important; color: #8E3320 !important}
section#pricing.sec.alt .matrix tr.featured td:not(:first-child){color: #8E3320 !important}
section#pricing.sec.alt .matrix tr:hover td{background: rgba(184,68,42,.04) !important}
/* ─── Subpage: Private Departure (Item 11) — title LEFT, price RIGHT ─── */
section#private.private-sec{background: #161D19 !important; padding: 110px 0 !important}
section#private .private-head{display: grid !important; grid-template-columns: 1fr auto !important; gap: 64px !important; align-items: end !important; margin-bottom: 50px !important}
section#private .private-head .left-col{text-align: left !important}
section#private .private-head .left-col .eyebrow{color: #D6B97E !important}
section#private .private-head .left-col .sec-h{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-weight: 300 !important; color: #fff !important; font-size: clamp(2.2rem,4vw,3.4rem) !important; line-height: 1.06 !important; letter-spacing: -.02em !important; text-align: left !important; margin: 18px 0 0 !important; display: block !important; overflow: visible !important; -webkit-line-clamp: unset !important; line-clamp: unset !important}
section#private .private-head .left-col .sec-h em{font-style: italic !important; color: #D6B97E !important; font-weight: 300 !important}
section#private .private-head .right-col{align-self: end !important}
section#private .private-from-price{text-align: right !important; padding: 0 !important}
section#private .private-from-price .lg{font-family: 'Bricolage Grotesque','Inter Tight',sans-serif !important; font-size: 56px !important; font-weight: 500 !important; color: #fff !important; line-height: 1 !important; letter-spacing: -.02em !important}
section#private .private-from-price .lg sup{font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 18px !important; color: #D6B97E !important; vertical-align: super !important; margin-right: 4px !important}
section#private .private-from-price .lb{font-family: 'Inter Tight',sans-serif !important; font-size: 10px !important; letter-spacing: .3em !important; text-transform: uppercase !important; color: rgba(244,239,230,.55) !important; margin-top: 8px !important}
section#private .private-grid{display: grid !important; grid-template-columns: 1.1fr 1fr !important; gap: 64px !important; align-items: start !important}
section#private .private-grid .left .entry-content,
section#private .private-body{color: rgba(244,239,230,.85) !important; font-family: 'Inter Tight',sans-serif !important; font-size: 15.5px !important; line-height: 1.75 !important; font-weight: 300 !important; max-width: none !important}
section#private .private-body p,
section#private .private-grid .left .entry-content p{color: rgba(244,239,230,.75) !important; margin-bottom: 14px !important}
section#private .private-body h1,
section#private .private-body h2,
section#private .private-body h3,
section#private .private-body h4,
section#private .private-grid .left .entry-content h1,
section#private .private-grid .left .entry-content h2,
section#private .private-grid .left .entry-content h3,
section#private .private-grid .left .entry-content h4{color: #fff !important; font-family: 'Fraunces',serif !important; font-weight: 400 !important; margin: 24px 0 12px !important}
section#private .private-body h3{font-size: 22px !important}
section#private .private-body h4{font-size: 18px !important}
section#private .private-body em,
section#private .private-grid .left .entry-content em{color: #D6B97E !important; font-style: italic !important}
section#private .private-body strong{color: #fff !important; font-weight: 600 !important}
section#private .private-body ul,
section#private .private-body ol,
section#private .private-grid .left .entry-content ul,
section#private .private-grid .left .entry-content ol{margin: 12px 0 18px 0 !important; padding: 0 !important; list-style: none !important}
section#private .private-body li,
section#private .private-grid .left .entry-content li{padding-left: 26px !important; position: relative !important; margin-bottom: 10px !important; color: rgba(244,239,230,.85) !important; font-family: 'Inter Tight',sans-serif !important}
section#private .private-body li::before,
section#private .private-grid .left .entry-content li::before{content: '✓' !important; position: absolute !important; left: 0 !important; color: #D6B97E !important; font-weight: 400 !important}
section#private .private-body a{color: #D6B97E !important; text-decoration: underline !important}
section#private .private-body a:hover{color: #B8442A !important}
@media (max-width:900px){
section#private .private-head{grid-template-columns: 1fr !important; gap: 32px !important; align-items: start !important}
section#private .private-from-price{text-align: left !important}
section#private .private-grid{grid-template-columns: 1fr !important}
}
/* ─── Subpage: Deposit & Policy — LIGHT editorial background (Item 12) ─── */
section.policy{background: #ECE5D8 !important; color: #161D19 !important; padding: 120px 0 !important; border-top: 1px solid #DDD3C0 !important}
section.policy .sec-head{text-align: left !important; margin-bottom: 50px !important; display: block !important}
section.policy .sec-head .eyebrow{color: #B8442A !important; justify-content: flex-start !important; display: inline-flex !important}
section.policy .sec-head .eyebrow.gold{color: #B8442A !important}
section.policy .sec-head .sec-h{color: #161D19 !important; text-align: left !important; font-family: 'Fraunces',serif !important; font-weight: 300 !important; font-size: clamp(2.2rem,4vw,3.4rem) !important; line-height: 1.05 !important; letter-spacing: -.02em !important; display: block !important; overflow: visible !important; -webkit-line-clamp: unset !important; line-clamp: unset !important; margin: 18px 0 !important}
section.policy .sec-head .sec-h em{color: #B8442A !important; font-style: italic !important; font-weight: 300 !important}
section.policy .sec-head .entry-content{font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 16px !important; color: #4A453E !important; max-width: none !important; line-height: 1.6 !important; margin-top: 14px !important}
section.policy .sec-head .entry-content p{color: #4A453E !important; margin-bottom: 8px !important}
/* 4-cell policy grid — light theme */
section.policy .policy-grid .pol .n sup{font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 16px !important; color: #B8442A !important; vertical-align: super !important; margin-left: 2px !important; font-weight: 400 !important}
/* 3-card confirm — light theme */
section.policy .confirm .ccard p{font-family: 'Inter Tight',sans-serif !important; font-size: 13.5px !important; color: #4A453E !important; line-height: 1.65 !important; font-weight: 300 !important}
@media (max-width:900px){
section.policy .policy-grid{grid-template-columns: 1fr 1fr !important}
section.policy .confirm{grid-template-columns: 1fr !important}
}
@media (max-width:600px){
section.policy .policy-grid{grid-template-columns: 1fr !important}
}
/* 
   Subpage section-head layout fix, description flush,
   season pill logic decoupled from peak flag, dot overflow cap.
   Literal fonts + hex only (literal-value pattern) so plugin CSS
   that wipes CSS variables cannot break the render. */
/* ---- Item 4: Cost subpage sec-head is a stacked block ----
   Overrides the shared `.sec-head { display:grid; grid-template-columns:1.1fr .9fr }`
   ONLY when used on the Cost & Dates subpage. Eyebrow on top,
   H2 below it, description below that — all LEFT aligned. */
.cost-sub .cost-sec-head{display: block !important; grid-template-columns: none !important; grid-template-rows: none !important; gap: 0 !important; margin-bottom: 44px !important; max-width: none !important; text-align: left !important}
.cost-sub .cost-sec-head .eyebrow{display: inline-flex !important; justify-content: flex-start !important; align-items: center !important; margin: 0 0 18px 0 !important; padding: 0 !important; color: #B8442A !important; font-family: 'Inter Tight',system-ui,sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .32em !important; text-transform: uppercase !important; text-align: left !important}
.cost-sub .cost-sec-head .eyebrow.gold{color: #B69658 !important}
.cost-sub .cost-sec-h{display: block !important; grid-column: auto !important; order: 0 !important; margin: 0 0 18px 0 !important; padding: 0 !important; max-width: none !important; width: auto !important; text-align: left !important; font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-weight: 300 !important; font-size: clamp(2.2rem,4vw,3.4rem) !important; line-height: 1.05 !important; letter-spacing: -.02em !important; color: #161D19 !important; font-variation-settings: "opsz" 144 !important; overflow: visible !important; -webkit-line-clamp: unset !important; line-clamp: unset !important; text-overflow: clip !important; -webkit-box-orient: initial !important}
.cost-sub .cost-sec-h em{font-style: italic !important; color: #B8442A !important; font-weight: 300 !important; display: inline !important}
/* ---- Item 5: Description flush with heading, no auto-center margins ---- */
.cost-sub .cost-sec-desc,
.cost-sub .cost-sec-desc.entry-content,
.cost-sub .cost-fixed-intro,
.cost-sub .cost-fixed-intro.entry-content{max-width: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important; font-family: 'Inter Tight',system-ui,sans-serif !important; font-size: 15.5px !important; line-height: 1.75 !important; color: #4A453E !important; font-weight: 300 !important}
.cost-sub .cost-sec-desc > *:first-child,
.cost-sub .cost-fixed-intro > *:first-child{margin-top: 0 !important}
.cost-sub .cost-sec-desc > *:last-child,
.cost-sub .cost-fixed-intro > *:last-child{margin-bottom: 0 !important}
.cost-sub .cost-sec-desc p,
.cost-sub .cost-fixed-intro p{margin: 0 0 14px 0 !important; font-family: 'Inter Tight',system-ui,sans-serif !important; color: #4A453E !important; font-size: 15.5px !important; line-height: 1.75 !important}
.cost-sub .cost-sec-desc em,
.cost-sub .cost-fixed-intro em{font-style: italic !important; color: #B8442A !important; font-weight: 400 !important}
.cost-sub .cost-sec-desc a,
.cost-sub .cost-fixed-intro a{color: #B8442A !important; text-decoration: underline}
.cost-sub .cost-sec-desc strong,
.cost-sub .cost-fixed-intro strong{color: #161D19 !important; font-weight: 600 !important}
.cost-sub .cost-sec-desc h1,.cost-sub .cost-sec-desc h2,.cost-sub .cost-sec-desc h3,
.cost-sub .cost-sec-desc h4,.cost-sub .cost-sec-desc h5,.cost-sub .cost-sec-desc h6,
.cost-sub .cost-fixed-intro h1,.cost-sub .cost-fixed-intro h2,.cost-sub .cost-fixed-intro h3,
.cost-sub .cost-fixed-intro h4,.cost-sub .cost-fixed-intro h5,.cost-sub .cost-fixed-intro h6{font-family: 'Fraunces',serif !important; color: #161D19 !important; font-weight: 400 !important; margin: 22px 0 10px 0 !important; line-height: 1.2 !important}
.cost-sub .cost-sec-desc h2, .cost-sub .cost-fixed-intro h2{font-size: 22px !important}
.cost-sub .cost-sec-desc h3, .cost-sub .cost-fixed-intro h3{font-size: 19px !important}
.cost-sub .cost-sec-desc h4, .cost-sub .cost-fixed-intro h4{font-size: 16px !important}
.cost-sub .cost-sec-desc ul, .cost-sub .cost-sec-desc ol,
.cost-sub .cost-fixed-intro ul, .cost-sub .cost-fixed-intro ol{margin: 12px 0 16px 0 !important; padding-left: 22px !important}
.cost-sub .cost-sec-desc li, .cost-sub .cost-fixed-intro li{margin-bottom: 6px !important}
.cost-sub .cost-sec-desc blockquote, .cost-sub .cost-fixed-intro blockquote{border-left: 3px solid #B8442A !important; padding: 6px 0 6px 18px !important; font-style: italic !important; margin: 16px 0 !important; color: #4A453E !important}
.cost-sub .cost-sec-desc table, .cost-sub .cost-fixed-intro table{width: 100% !important; border-collapse: collapse !important; margin: 14px 0 !important}
/* descriptions render via thg_render_rich_content — wide WYSIWYG tables sit in a .table-wrap so they scroll instead of blowing out the page on phones. Inside a wrap a table keeps min-width:100% (fills when it fits) but may grow to its natural width and scroll. Long words in the description wrap instead of overflowing. */
.cost-sub .cost-sec-desc .table-wrap table, .cost-sub .cost-fixed-intro .table-wrap table,
section.policy .cost-sec-desc .table-wrap table{width: auto !important; min-width: 100% !important}
.cost-sub .cost-sec-desc, .cost-sub .cost-fixed-intro,
section.policy .cost-sec-desc{overflow-wrap: break-word}
.cost-sub .cost-sec-desc th, .cost-sub .cost-sec-desc td,
.cost-sub .cost-fixed-intro th, .cost-sub .cost-fixed-intro td{padding: 10px 12px !important; border-bottom: 1px solid #DDD3C0 !important; text-align: left !important}
.cost-sub .cost-sec-desc th, .cost-sub .cost-fixed-intro th{background: #ECE5D8 !important; font-family: 'Inter Tight',sans-serif !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .18em !important; text-transform: uppercase !important; color: #4A453E !important}
.cost-sub .cost-sec-desc img, .cost-sub .cost-fixed-intro img{max-width: 100% !important; height: auto !important; margin: 14px 0 !important}
/* Dark-variant description (private + policy on dark backgrounds) */
.cost-sub.private-sec .cost-sec-desc,
.cost-sub.cost-sub-policy .cost-sec-desc{color: rgba(244,239,230,.85) !important}
.cost-sub.private-sec .cost-sec-desc p,
.cost-sub.cost-sub-policy .cost-sec-desc p{color: rgba(244,239,230,.85) !important}
.cost-sub.private-sec .cost-sec-desc em,
.cost-sub.cost-sub-policy .cost-sec-desc em{color: #D6B97E !important}
.cost-sub.private-sec .cost-sec-desc a,
.cost-sub.cost-sub-policy .cost-sec-desc a{color: #D6B97E !important}
.cost-sub.private-sec .cost-sec-desc strong,
.cost-sub.cost-sub-policy .cost-sec-desc strong{color: #fff !important}
.cost-sub.private-sec .cost-sec-h,
.cost-sub.cost-sub-policy .cost-sec-h{color: #fff !important}
.cost-sub.private-sec .cost-sec-h em,
.cost-sub.cost-sub-policy .cost-sec-h em{color: #D6B97E !important}
.cost-sub.private-sec .cost-sec-head .eyebrow,
.cost-sub.cost-sub-policy .cost-sec-head .eyebrow{color: #D6B97E !important}
/* ---- Item 4b: Private-departure header split (title LEFT, price RIGHT) ---- */
.cost-sub.private-sec .cost-sec-head.private-head{display: grid !important; grid-template-columns: 1fr auto !important; gap: 32px !important; align-items: end !important}
.cost-sub.private-sec .private-head-body{text-align: left !important}
.cost-sub.private-sec .private-head-body .eyebrow,
.cost-sub.private-sec .private-head-body .cost-sec-h{text-align: left !important}
.cost-sub.private-sec .private-head-price{text-align: right !important}
.cost-sub.private-sec .private-head-price .private-from-price .lg{font-family: 'Bricolage Grotesque','Inter Tight',sans-serif !important; font-size: 44px !important; font-weight: 500 !important; color: #fff !important; line-height: 1 !important; letter-spacing: -.02em !important}
.cost-sub.private-sec .private-head-price .private-from-price .lg sup{font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 14px !important; color: #D6B97E !important; margin-right: 4px !important}
.cost-sub.private-sec .private-head-price .private-from-price .lb{font-family: 'Inter Tight',sans-serif !important; font-size: 10px !important; letter-spacing: .28em !important; text-transform: uppercase !important; color: rgba(244,239,230,.55) !important; margin-top: 6px !important}
@media(max-width:820px){
.cost-sub.private-sec .cost-sec-head.private-head{grid-template-columns: 1fr !important}
.cost-sub.private-sec .private-head-price{text-align: left !important}
}
/* ---- Item 3 (bis): Matrix meta stamp — no white on white ---- */
.cost-sub .matrix-wrap .matrix-meta{border-bottom: 1px solid #DDD3C0 !important}
.cost-sub .matrix-wrap .matrix-meta .tag{color: #B69658 !important}
.cost-sub .matrix-wrap .matrix-meta .stamp{color: #4A453E !important; border-color: rgba(182,150,88,.4) !important; font-family: 'Fraunces',serif !important; font-style: italic !important}
/* Matrix header + featured-row em must stay ember on light bg */
.cost-sub .matrix{color: #161D19 !important}
.cost-sub .matrix em{color: #B8442A !important; font-style: italic !important}
.cost-sub .matrix tr.featured td{background: rgba(184,68,42,.10) !important}
.cost-sub .matrix tr.featured td:not(:first-child){color: #8E3320 !important}
/* ---- Item 6: Season pills — off-peak seasons are ACTIVE when they have dates ---- */
/* Peak visual accent only, no functional gate. */
.cost-sub .season-pill{cursor: pointer !important}
.cost-sub .season-pill.disabled,
.cost-sub .season-pill[disabled]{opacity: .4 !important; cursor: not-allowed !important; pointer-events: none !important}
/* Also make sure the trip page's cost section pills follow the same rule */
#cost .season-pill{font-family: 'Inter Tight',system-ui,sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .22em !important; text-transform: uppercase !important; color: rgba(244,239,230,.65) !important; padding: 11px 22px !important; background: rgba(255,255,255,.04) !important; border: 1px solid rgba(255,255,255,.12) !important; cursor: pointer !important; display: inline-flex !important; align-items: center !important; gap: 10px !important}
#cost .season-pill.disabled,
#cost .season-pill[disabled]{opacity: .35 !important; cursor: not-allowed !important; pointer-events: none !important}
/* ---- Item 7: Dot overflow cap — text-only mode ---- */
.dep-avail.dep-avail--text-only .dots{display: none !important}
.dep-avail.dep-avail--text-only .txt{margin-left: 0 !important; padding-left: 0 !important}
/* Also nudge the text-only variant so it visually balances without the dots */
#cost .dep-avail.dep-avail--text-only{padding-top: 14px !important}
.cost-sub .dep-row .dep-avail.dep-avail--text-only{gap: 0 !important}
/* 
   - Remove ::before ✓ bullets in private-body (replaced by
     auto-injected <i class="ph ph-check-circle">).
   - Style the injected Phosphor icon so it aligns to the text.
   - Policy section: proper vertical rhythm between eyebrow,
     H2, description, 4-tile grid and 3-card confirm strip.
   - Ember accent (--ember #B8442A) forced on em everywhere the
     old rules were bleeding gold-lt onto the light policy panel. */
/* Kill any legacy ::before check glyphs */
section#private .private-body li::before,
section#private .private-grid .left .entry-content li::before,
section#private .private-grid .left .private-body li::before,
#cost .private .private-body li::before,
.cost-sub .private-body li::before{content: none !important; display: none !important}
/* New: style the injected <i class="ph ph-check-circle"> */
section#private .private-body,
#cost .private .private-body,
.cost-sub .private-body{list-style: none !important}
section#private .private-body ul,
#cost .private .private-body ul,
.cost-sub .private-body ul{list-style: none !important; padding-left: 0 !important; margin: 20px 0 !important}
section#private .private-body ul li,
#cost .private .private-body ul li,
.cost-sub .private-body ul li{position: relative !important; padding-left: 34px !important; margin-bottom: 12px !important; list-style: none !important; font-family: 'Inter Tight',system-ui,sans-serif !important; color: rgba(244,239,230,.85) !important; line-height: 1.6 !important}
section#private .private-body ul li > i.ph,
#cost .private .private-body ul li > i.ph,
.cost-sub .private-body ul li > i.ph{position: absolute !important; left: 0 !important; top: 2px !important; font-size: 18px !important; line-height: 1 !important; color: #D6B97E !important; font-style: normal !important}
/* Compact mode (#cost tab card) — same visual */
#cost .private .private-body ul li{color: rgba(244,239,230,.82) !important}
#cost .private .private-body ul li > i.ph{color: #D6B97E !important}
/* ─── Policy section: spacing + em color ─── */
/* Target both policy class variants: .cost-sub-policy and .policy */
section.policy.cost-sub-policy,
section.policy{padding: 130px 0 130px !important}
section.policy .cost-sec-head,
section.policy .sec-head{margin-bottom: 64px !important; max-width: none !important}
section.policy .cost-sec-head .eyebrow,
section.policy .sec-head .eyebrow{color: #B8442A !important; margin-bottom: 18px !important; display: inline-flex !important; align-items: center !important; gap: 14px !important}
section.policy .cost-sec-head .eyebrow.gold,
section.policy .sec-head .eyebrow.gold{color: #B8442A !important}
section.policy .cost-sec-h,
section.policy .sec-head .sec-h,
section.policy .cost-sec-head .cost-sec-h{color: #161D19 !important; margin: 0 0 22px 0 !important; line-height: 1.06 !important}
section.policy .cost-sec-h em,
section.policy .sec-head .sec-h em,
section.policy .cost-sec-head .cost-sec-h em,
section.policy .cost-sec-head .cost-sec-h p em{color: #B8442A !important; font-style: italic !important; font-weight: 300 !important}
section.policy .cost-sec-desc,
section.policy .cost-sec-head .cost-sec-desc,
section.policy .cost-sec-head .entry-content,
section.policy .sec-head .entry-content{margin: 0 !important; max-width: none !important; font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 16px !important; line-height: 1.7 !important; color: #4A453E !important}
section.policy .cost-sec-desc p,
section.policy .cost-sec-head .entry-content p,
section.policy .sec-head .entry-content p{color: #4A453E !important; margin: 0 0 10px 0 !important}
section.policy .cost-sec-desc em,
section.policy .cost-sec-head .entry-content em,
section.policy .sec-head .entry-content em{color: #B8442A !important; font-style: italic !important}
/* 4-cell grid — add breathing room above (from the head) */
/* column count deliberately not set here — the ≤900/≤600 responsive rules below own it (last !important wins) and forced 4 columns on phones ≈ 20px of content per cell → the grid blew out sideways (the cost-dates h-scroll). Columns: base 4 / ≤900 2 / ≤600 1. */
section.policy .policy-grid{display: grid !important; gap: 0 !important; border-left: 1px solid #DDD3C0 !important; border-top: 1px solid #DDD3C0 !important; background: #FAF6EF !important; margin-top: 0 !important}
/* Each policy tile — richer spacing so numbers/labels/desc are legible */
section.policy .policy-grid .pol{padding: 40px 32px !important; border-right: 1px solid #DDD3C0 !important; border-bottom: 1px solid #DDD3C0 !important}
section.policy .policy-grid .pol .n{font-family: 'Bricolage Grotesque','Inter Tight',sans-serif !important; font-size: 52px !important; font-weight: 500 !important; color: #161D19 !important; letter-spacing: -.02em !important; line-height: 1 !important; margin-bottom: 4px !important}
section.policy .policy-grid .pol .l{font-family: 'Inter Tight',sans-serif !important; font-size: 10.5px !important; letter-spacing: .24em !important; text-transform: uppercase !important; color: #4A453E !important; margin-top: 16px !important; font-weight: 500 !important}
section.policy .policy-grid .pol .d{font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 14px !important; color: #8A8074 !important; margin-top: 14px !important; line-height: 1.55 !important}
/* 3-card confirm strip — sit clearly BELOW the 4-cell grid */
section.policy .confirm{display: grid !important; grid-template-columns: repeat(3,1fr) !important; gap: 22px !important; margin-top: 72px !important}
section.policy .confirm .ccard{background: #FAF6EF !important; border: 1px solid #DDD3C0 !important; padding: 38px 32px !important; color: #161D19 !important}
section.policy .confirm .ccard h4{font-family: 'Fraunces',serif !important; font-size: 18px !important; color: #161D19 !important; font-weight: 500 !important; margin-bottom: 12px !important}
section.policy .confirm .ccard i.ph{font-size: 28px !important; color: #B8442A !important; margin-bottom: 20px !important; display: inline-block !important}
/* 
   Inclusions main-page dynamic head + auto-injected icons +
   subpage stacked-groups layout. Literal fonts + hex only
   (literal-value pattern) so plugin CSS wiping vars cannot break. */
/* Main-page: sub-label under the H3 in each column */
section#included .incl-col .sub{font-family: 'Inter Tight',system-ui,sans-serif !important; font-size: 10.5px !important; letter-spacing: .22em !important; text-transform: uppercase !important; color: #8A8074 !important; margin-bottom: 26px !important; margin-top: 6px !important; font-weight: 500 !important}
/* Main-page: right-col link-arrow visibility */
section#included .sec-head .right{gap: 14px !important}
section#included .sec-head .right p{margin: 0 !important}
section#included .sec-head .right .link-arrow{color: #B8442A !important; border-bottom-color: #B8442A !important; font-family: 'Inter Tight',sans-serif !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .2em !important; text-transform: uppercase !important; padding-bottom: 4px !important; border-bottom: 1px solid #B8442A !important; display: inline-flex !important; align-items: center !important; gap: 10px !important}
section#included .sec-head .right .link-arrow:hover{color: #8E3320 !important; border-bottom-color: #8E3320 !important}
/* Auto-injected bullet icons in inclusion columns.
   The .entry-content wrapper turns each <ul><li> into flex-row with icon+text. */
section#included .incl-col .entry-content ul,
section.incl-sub .incl-col .entry-content ul{list-style: none !important; padding: 0 !important; margin: 0 !important; display: flex !important; flex-direction: column !important; gap: 14px !important}
section#included .incl-col .entry-content li,
section.incl-sub .incl-col .entry-content li{list-style: none !important; display: flex !important; align-items: flex-start !important; gap: 14px !important; font-family: 'Inter Tight',sans-serif !important; font-size: 14.5px !important; color: #4A453E !important; line-height: 1.6 !important; padding: 0 0 14px 0 !important; border-bottom: 1px dashed #DDD3C0 !important; margin: 0 !important}
section#included .incl-col .entry-content li:last-child,
section.incl-sub .incl-col .entry-content li:last-child{border-bottom: 0 !important}
section#included .incl-col .entry-content li > i.ph,
section.incl-sub .incl-col .entry-content li > i.ph{position: static !important; font-size: 18px !important; line-height: 1 !important; margin-top: 2px !important; flex-shrink: 0 !important; font-style: normal !important}
section#included .incl-col.yes .entry-content li > i.ph,
section.incl-sub .incl-col.yes .entry-content li > i.ph{color: #4A5B43 !important}
/* moss */
section#included .incl-col.no  .entry-content li > i.ph,
section.incl-sub .incl-col.no  .entry-content li > i.ph{color: #8A8074 !important}
/* muted grey */
section#included .incl-col .entry-content b,
section.incl-sub .incl-col .entry-content b{color: #161D19 !important; font-weight: 600 !important}
/* ─── SUBPAGE — phead H1 with <em> and <strong> per design ─── */
.phead .incl-h1,
.phead .phead-h1{display: block !important; font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-weight: 300 !important; font-size: clamp(2.6rem,5.2vw,4.4rem) !important; line-height: 1.05 !important; color: #fff !important; letter-spacing: -.025em !important; max-width: 920px !important; font-variation-settings: "opsz" 144 !important; margin: 20px 0 0 0 !important}
.phead .incl-h1 em,
.phead .phead-h1 em{font-style: italic !important; color: #D6B97E !important; font-weight: 300 !important; display: inline !important}
.phead .incl-h1 strong,
.phead .phead-h1 strong{font-weight: 500 !important; font-style: normal !important; color: #fff !important; display: inline !important}
.phead .phead-sub{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-style: italic !important; font-size: 18px !important; color: rgba(244,239,230,.78) !important; max-width: 680px !important; line-height: 1.6 !important; margin-top: 28px !important; font-weight: 300 !important}
.phead .phead-sub p{margin: 0 !important; color: inherit !important; font: inherit !important}
.phead .phead-sub p + p{margin-top: 12px !important}
/* ─── SUBPAGE — stacked incl-grid (one full-width col per group) ─── */
section.incl-sub .incl-grid.incl-grid--stacked{display: block !important; background: transparent !important; border: 0 !important}
section.incl-sub .incl-grid.incl-grid--stacked .incl-col{background: transparent !important; padding: 36px 0 !important; border-bottom: 1px solid #DDD3C0 !important}
section.incl-sub .incl-grid.incl-grid--stacked .incl-col:last-child{border-bottom: 0 !important}
section.incl-sub .incl-grid.incl-grid--stacked .incl-col:first-child{padding-top: 8px !important}
section.incl-sub .incl-col h3{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-size: 22px !important; font-weight: 400 !important; color: #161D19 !important; margin: 0 0 22px 0 !important; letter-spacing: -.01em !important}
section.incl-sub .incl-col h3 em{font-style: italic !important; color: #B8442A !important}
/* Subpage footer link row */
section.incl-sub .incl-footer-links{text-align: center !important; margin-top: 64px !important; font-family: 'Inter Tight',sans-serif !important; font-size: 12px !important; letter-spacing: .2em !important; text-transform: uppercase !important}
section.incl-sub .incl-footer-links .link-arrow{color: #B8442A !important; border-bottom: 1px solid #B8442A !important; padding-bottom: 4px !important; display: inline-flex !important; align-items: center !important; gap: 10px !important; font-weight: 500 !important}
section.incl-sub .incl-footer-links .link-arrow:hover{color: #8E3320 !important; border-bottom-color: #8E3320 !important}
section.incl-sub .incl-footer-links .sep{margin: 0 18px !important; color: #8A8074 !important}
@media(max-width:900px){
section.incl-sub .cost-sec-head{margin-bottom: 32px !important}
}
/* 
   Small polish:
   - Subpage entry-content had a big left margin because the
     global .entry-content { max-width:760px; margin:0 auto; }
     was centering it in a narrow 760px column. Kill that ONLY
     inside .incl-sub so the bullet list stretches full-width.
   - Remove the little "before dot" decoration on the eyebrow
     inside the inclusions sections ( asked to remove it). */
section.incl-sub .cost-sec-head .cost-sec-desc,
section.incl-sub .cost-sec-head .entry-content,
section.incl-sub .incl-col .entry-content,
section.incl-sub .cost-sec-desc,
section.incl-sub .entry-content{max-width: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important}
/* Kill the .eyebrow::before dash decoration inside inclusion sections (main #included + subpage .incl-sub). asked to remove it. */
section#included .cost-sec-head .eyebrow::before,
section#included .sec-head .eyebrow::before,
section.incl-sub .cost-sec-head .eyebrow::before,
section.incl-sub .sec-head .eyebrow::before,
section.incl-sub .eyebrow::before{content: none !important; display: none !important; width: 0 !important; background: transparent !important}
/* 
   -  asked to REMOVE the icon 'dot' before every bullet
     ("in design there is befor dot displaying i think which is
     no used so remove it"). The ph-check-circle / ph-minus-circle
     icons are  auto-injected by PHP. This CSS reclaims
     the row space: no icon column, no gap, text sits flush left.
   - Bullets are plain rows separated by a dashed hairline; no
     list-marker either (list-style:none). Rounded moss/ember
     dot decoration REMOVED entirely. */
/* If an editor hand-types an <i class="ph …"> icon inside a bullet
   (per-line override), leave it alone — style it inline like the old
   icon column would have looked, but tiny + inline. */
/* kill the global .entry-content ul li::before ember dot
   inside inclusion sections (the source of the stray leading dot). */
/* Also reset the padding-left that made room for that dot, so text sits flush. */
section#included .incl-col .entry-content ul li,
section.incl-sub  .incl-col .entry-content ul li,
section#included .incl-col ul li,
section.incl-sub  .incl-col ul li{padding-left: 0 !important; position: static !important}
/* 
   Restore the design's icons (a previous pass was
   wrong to remove them). Main page uses ph-check (bold weight,
   moss on yes, small design accent). Subpage + main-page excludes
   use ph-check-circle / ph-minus-circle (duotone, larger accent).
   Still keep the global ember dot suppressed inside inclusion
   sections (the actual source of the stray leading dot). */
/* Bullets are flex-rows again — icon + text side by side */
section#included .incl-col .entry-content ul,
section.incl-sub  .incl-col .entry-content ul,
section#included .incl-col ul,
section.incl-sub  .incl-col ul{list-style: none !important; padding: 0 !important; margin: 0 !important; display: flex !important; flex-direction: column !important; gap: 0 !important}
section#included .incl-col .entry-content li,
section.incl-sub  .incl-col .entry-content li,
section#included .incl-col li,
section.incl-sub  .incl-col li{list-style: none !important; display: flex !important; padding: 14px 0 !important; gap: 14px !important; font-family: 'Inter Tight',system-ui,sans-serif !important; font-size: 14.5px !important; color: #4A453E !important; line-height: 1.6 !important; border-bottom: 1px dashed #DDD3C0 !important; margin: 0 !important; flex-direction: row !important; align-items: flex-start !important; position: static !important}
section#included .incl-col .entry-content li:first-child,
section.incl-sub  .incl-col .entry-content li:first-child{padding-top: 0 !important}
section#included .incl-col .entry-content li:last-child,
section.incl-sub  .incl-col .entry-content li:last-child{border-bottom: 0 !important; padding-bottom: 0 !important}
section#included .incl-col .entry-content li b,
section.incl-sub  .incl-col .entry-content li b{color: #161D19 !important; font-weight: 600 !important}
/* Icon inside each bullet — restore proper design colouring */
section#included .incl-col .entry-content li > i.ph,
section.incl-sub  .incl-col .entry-content li > i.ph{display: inline-block !important; font-size: 18px !important; margin-right: 0 !important; vertical-align: baseline !important; color: currentColor !important; line-height: 1.4 !important; margin-top: 1px !important; flex-shrink: 0 !important; font-style: normal !important}
/* Main-page ph-check (bold weight, small tick) — moss green */
section#included .incl-col.yes .entry-content li > i.ph{color: #4A5B43 !important; font-size: 16px !important}
/* Main-page excludes AND all subpage bullets → ph-check-circle / ph-minus-circle (duotone) */
section#included .incl-col.no .entry-content li > i.ph,
section.incl-sub  .incl-col.yes .entry-content li > i.ph{color: #4A5B43 !important}
section.incl-sub  .incl-col.no .entry-content li > i.ph{color: #8A8074 !important}
/* muted grey */
/* Kill the global .entry-content ul li::before ember dot inside inclusions
   (this rule was the actual source of the stray "before dot") */
section#included .incl-col .entry-content ul li::before,
section.incl-sub  .incl-col .entry-content ul li::before,
section#included .incl-col ul li::before,
section.incl-sub  .incl-col ul li::before{content: none !important; display: none !important; background: transparent !important; width: 0 !important; height: 0 !important}
/* 
   Main page: switch to LEFT-aligned single-column head
   (.incl-main-head), no more .sec-head grid split. 
   instruction: "make it text left alignment".
   Main-page inclusion icon changed from ph-check (bold) →
   ph-check-circle (duotone) to match the subpage.
   All ACF-title fields are gone — content is hard-coded in the
   template, so no more risk of wysiwyg-title-fields breaking the
   wp-admin tab. */
section.incl-main{padding: 110px 0 !important}
section.incl-main .incl-main-h em{font-style: italic !important; color: #B8442A !important; font-weight: 300 !important}
section.incl-main .incl-main-desc .link-arrow{font-family: 'Inter Tight',sans-serif !important; font-style: normal !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .2em !important; text-transform: uppercase !important; color: #B8442A !important; border-bottom: 1px solid #B8442A !important; padding-bottom: 4px !important; display: inline-flex !important; align-items: center !important; gap: 10px !important; margin-top: 6px !important}
section.incl-main .incl-main-desc .link-arrow:hover{color: #8E3320 !important; border-bottom-color: #8E3320 !important}
/* Main-page includes icon change: was ph-check bold, now ph-check-circle duotone
   — matches the subpage. Icon sizing rules below are already correct. */
section.incl-main .incl-col.yes .entry-content li > i.ph{color: #4A5B43 !important; font-size: 18px !important}
section.incl-main .incl-col.no .entry-content li > i.ph{color: #8A8074 !important; font-size: 18px !important}
/* 
   Subpage restored to CATEGORISED layout (matches the design):
     - h2 sec-h + right caption (grouped by category…)
     - stacked incl-col rows, each with h3 category + <ul> bullets
   The .sec-head and .incl-grid--stacked rules already exist from
   Only tune the sec-head so the right-column caption
   sits nicely beside the h2 on the subpage, and make sure the h3
   inside each stacked group shows. */
section.incl-sub .sec-head.incl-sec-head{display: grid !important; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) !important; gap: 48px !important; align-items: end !important; margin-bottom: 56px !important}
section.incl-sub .sec-head.incl-sec-head .right{align-self: end !important}
section.incl-sub .sec-head.incl-sec-head .right p{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-style: italic !important; font-size: 15.5px !important; line-height: 1.7 !important; color: #4A453E !important; margin: 0 !important; max-width: 520px !important}
section.incl-sub .cost-sec-h,
section.incl-sub .sec-h{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-weight: 300 !important; color: #161D19 !important; text-align: left !important; letter-spacing: -.02em !important; margin: 0 !important; max-width: none !important; overflow: visible !important; -webkit-line-clamp: unset !important; line-clamp: unset !important}
section.incl-sub .cost-sec-h em,
section.incl-sub .sec-h em{font-style: italic !important; color: #B8442A !important; font-weight: 300 !important}
/* Every stacked group shows its h3 category title */
section.incl-sub .incl-grid--stacked .incl-col > h3{display: block !important; font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-size: 22px !important; font-weight: 400 !important; color: #161D19 !important; margin: 0 0 22px 0 !important; letter-spacing: -.01em !important}
section.incl-sub .incl-grid--stacked .incl-col > h3 em{font-style: italic !important; color: #B8442A !important}
/* Small screens — caption falls under the h2 */
@media (max-width: 900px){
section.incl-sub .sec-head.incl-sec-head{grid-template-columns: 1fr !important; gap: 18px !important; align-items: start !important}
section.incl-sub .sec-head.incl-sec-head .right p{max-width: none !important}
}
/* 
   MAIN PAGE only —  correction: description belongs on the
   RIGHT side of the head, not stacked below on the left.
     - .incl-main-head becomes a 2-column grid (H2 left, desc right)
     - inside the right column, text stays left-aligned (not
       right-aligned) so it reads naturally
     - stacks under 900px so mobile shows H2 then desc
   Also reverts an earlier attempt to make .incl-main-desc full width.
   ACF schema for Inclusions is reverted to the ZIP 86 state. */
section.incl-main .incl-main-head{display: grid !important; margin: 0 0 56px 0 !important; text-align: left !important; max-width: none !important; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) !important; gap: 56px !important; align-items: end !important}
section.incl-main .incl-main-h{display: block !important; font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-weight: 300 !important; font-size: clamp(2.2rem,4vw,3.4rem) !important; line-height: 1.05 !important; letter-spacing: -.02em !important; color: #161D19 !important; text-align: left !important; margin: 0 !important; max-width: none !important; overflow: visible !important; -webkit-line-clamp: unset !important; line-clamp: unset !important; align-self: end !important}
section.incl-main .incl-main-desc{font-family: 'Fraunces',serif !important; font-style: italic !important; font-size: 16px !important; line-height: 1.7 !important; color: #4A453E !important; max-width: none !important; margin: 0 !important; text-align: left !important; align-self: end !important; width: 100% !important}
section.incl-main .incl-main-desc p{margin: 0 0 12px 0 !important; color: #4A453E !important; font-family: 'Fraunces',serif !important; font-style: italic !important; max-width: none !important}
section.incl-main .incl-main-desc p:last-of-type{margin-bottom: 14px !important}
@media (max-width: 900px){
section.incl-main .incl-main-head{grid-template-columns: 1fr !important; gap: 20px !important; align-items: start !important; margin-bottom: 36px !important}
section.incl-main .incl-main-h,
  section.incl-main .incl-main-desc{align-self: start !important}
}
/* #gallery =====
   Main-page gallery: tiles are now <a> elements linking to
   full-size images (opened in a GLightbox with prev/next). The
   video tile also opens a YouTube lightbox. These rules polish
   the tiles so they behave visually the same as the original
   <div> tiles. */
a.gtile{display: block !important; color: inherit !important; text-decoration: none !important; outline: none !important}
a.gtile:focus-visible{outline: 2px solid #B8442A !important; outline-offset: 3px !important}
a.gtile,
a.gtile > div,
a.gtile .cap{text-decoration: none !important}
/* Video-tile play icon should not be underlined by any global <a> rule */
a.gtile.video .play,
a.gtile.video .play .ring,
a.gtile.video .play i{text-decoration: none !important}
/* #gallery =====
   Two  corrections on the gallery main-page:
   1) H2 <em> accent needs the ember italic treatment (matches
      every other .sec-h em on light sections). We spell fonts
      + hex literally so plugin var-wipes can't strip it.
   2) Right-column description (paragraph) must stay LEFT-aligned
      inside its column. rule was fine but let's be
      explicit + also handle the case where the subdesc renders
      as multiple <p> lines from wpautop. */
section#gallery .sec-h,
section.sec.alt#gallery .sec-h{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-weight: 300 !important; color: #161D19 !important; letter-spacing: -.02em !important; text-align: left !important}
section#gallery .sec-h em,
section#gallery h2.sec-h em,
section.sec.alt#gallery .sec-h em{font-style: italic !important; color: #B8442A !important; font-weight: 300 !important; background: none !important}
/* Right-column description — stays LEFT aligned inside the right column */
section#gallery .sec-head{display: grid !important; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) !important; gap: 56px !important; align-items: end !important; text-align: left !important; margin-bottom: 36px !important}
section#gallery .sec-head .right{align-self: end !important; text-align: left !important; justify-self: start !important}
section#gallery .sec-head .right p{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif !important; font-style: italic !important; font-size: 15px !important; line-height: 1.65 !important; color: #4A453E !important; margin: 0 0 8px 0 !important; max-width: 520px !important; text-align: left !important}
section#gallery .sec-head .right p:last-child{margin-bottom: 0 !important}
@media (max-width: 900px){
section#gallery .sec-head{grid-template-columns: 1fr !important; gap: 18px !important; align-items: start !important; margin-bottom: 24px !important}
section#gallery .sec-head .right p{max-width: none !important}
}
/* #gallery =====
   Video tile: guarantee the click reaches GLightbox even though
   the .play overlay + .vlabel + .cap sit above the anchor's
   background. Every child gets pointer-events:none so the click
   registers on the parent <a class="gtile video">. GLightbox's
   own listener will preventDefault, so the browser never follows
   the href to youtube.com unless our fallback runs.
   Also: split the background image out of the anchor into its
   own <div class="gtile-bg"> so the anchor itself can be the
   click target with no background trickery. */
a.gtile.video{position: relative !important; display: block !important; cursor: pointer !important; overflow: hidden !important; background: #0E1411 !important}
a.gtile.video .gtile-bg{position: absolute !important; inset: 0 !important; background-size: cover !important; background-position: center !important; transition: transform 1s var(--ex) !important; pointer-events: none !important}
a.gtile.video:hover .gtile-bg{transform: scale(1.06) !important}
a.gtile.video .play,
a.gtile.video .play .ring,
a.gtile.video .play i,
a.gtile.video .vlabel,
a.gtile.video .vlabel .vdot,
a.gtile.video .cap{pointer-events: none !important}
a.gtile.video::before,
a.gtile.video::after{pointer-events: none !important}
/* Same treatment for image tiles — clicks always land on <a>. */
a.gtile > div,
a.gtile .cap{pointer-events: none !important}
/* Video tile caption is always visible (no hover) */
a.gtile.video .cap{opacity: 1 !important; transform: none !important}

/* Repeater-driven Good to Know. Most structural CSS already exists for
   .gtk-grid/.gtk-card/.gtk-topic/.gtk-content/.gtk-aside. This block only
   adds the (a) main-card summary paragraph polish, (b) subpage entry-content
   typography for H4/UL/OL/TABLE that WYSIWYG content needs, (c) hero type
   on the subpage, and (d) small-screen tweaks. Scoped, additive, no overrides
   of prior blocks. */
.gtk-card .gtk-summary p{font-family: var(--fu); font-size: 14px; color: var(--t2l); line-height: 1.7; font-weight: 300; margin: 0 0 10px}
.gtk-card .gtk-summary p:last-child{margin-bottom: 0}
.gtk-card .gtk-summary b,
.gtk-card .gtk-summary strong{color: var(--ink); font-weight: 600}
/* Subpage topic body: entry-content typography beyond what the global
   .gtk-content p rules already handle. WYSIWYG may emit H4, UL, OL,
   TABLE, BLOCKQUOTE, IMG, HR — give them the same visual language as
   the static design. */
.gtk-body ul li{position: relative; padding: 8px 0 8px 26px; font-family: var(--fu); font-size: 15.5px; color: var(--t2l); line-height: 1.65; font-weight: 300}
.gtk-body ul li::before{content: ''; position: absolute; left: 0; top: 18px; width: 14px; height: 1px; background: var(--ember)}
.gtk-body ol li{position: relative; padding: 8px 0 8px 38px; font-family: var(--fu); font-size: 15.5px; color: var(--t2l); line-height: 1.65; font-weight: 300; counter-increment: gtk-ol}
.gtk-body ol li::before{content: counter(gtk-ol,decimal-leading-zero); position: absolute; left: 0; top: 8px; font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--ember); letter-spacing: .04em}
.gtk-body table td em{font-family: var(--fe); font-style: italic; color: var(--ember)}
/* Subpage hero: breadcrumb + display title + lede. The display H1 is
   rendered on a <p> in markup (because <h1> is already used for the
   SEO eyebrow) — keep that in lockstep with the static template. */
.gtk-hero-title em{font-style: italic; color: var(--gold-lt); font-weight: 300}
.gtk-hero-title strong{font-weight: 600; font-style: normal; color: #fff; display: block}
.gtk-hero-lede p{margin: 0}
/* Main-card meta row: when there is no read-time but there IS a Read
   more link, push the link to the right. When both exist, keep the
   space-between layout from the base .gtk-card .gtk-meta rule. */
.gtk-meta span:empty{display: none}
.gtk-meta span:empty + a{margin-left: auto}
/* Sticky aside offset adjustment for shorter admin toolbars and the
   GTK sub-nav (which is itself sticky at top:72px). */
@media(min-width:901px){
.gtk-aside{top: 160px}
}
/* Subpage hero on small screens — pull padding in so the 2.6rem title
   does not kiss the edge. */
@media(max-width:640px){
.gtk-hero{padding: 120px 0 60px !important}
.gtk-hero-title{font-size: 2.4rem !important}
.gtk-topic-no{font-size: 56px !important}
}
/* 
   (a) subpage feature-image hero — ensure the image is actually visible
       regardless of ACF return format (array or ID); lifted opacity to
       .28 so the moody background reads behind the veil gradient.
   (b) end-of-briefing CTA — matches the static design's BACK CTA block
       exactly (centered, gold-lt eyebrow, italic em in h2, two actions).
       We intentionally do NOT reuse .endcta-card because that variant is
       a two-column "next in dossier" card used by other subpages; the
       Good-to-Know design is a centered standalone CTA.
   (c) complete WYSIWYG typography for .gtk-body — every element the
       WordPress editor can emit (h1-h6, p, ul/ol/li incl. nesting,
       table w/ horizontal scroll on small screens, blockquote, pre/code,
       img + wp-caption, alignment classes, hr). Pixel-paired with the
       static design's .gtk-content rules. */
/* (a) hero -------------------------------------------------------- */
.gtk-hero{background-color: var(--ink); background-image: radial-gradient(120% 80% at 18% 50%, rgba(14,20,17,.88) 0%, rgba(14,20,17,.5) 42%, rgba(14,20,17,.18) 70%, transparent 100%),
    linear-gradient(to bottom, rgba(14,20,17,.5) 0%, transparent 32%, rgba(14,20,17,.3) 62%, rgba(14,20,17,.92) 100%)}
.gtk-hero-bg{will-change: opacity; -webkit-backface-visibility: hidden; backface-visibility: hidden}
/* (b) end CTA ----------------------------------------------------- */
.gtk-endcta{position: relative; padding: 120px 0; background: var(--ink); color: #fff; text-align: center; overflow: hidden}
.gtk-endcta::before{content: ''; position: absolute; inset: 0; background: radial-gradient(80% 60% at 50% 0%, rgba(184,68,42,.10), transparent 60%),
    linear-gradient(180deg, rgba(14,20,17,.92), rgba(14,20,17,1)); pointer-events: none}
.gtk-endcta .container{position: relative; z-index: 2}
.gtk-endcta-eyebrow{justify-content: center; color: var(--gold-lt); font-family: var(--fu); font-size: 11px; font-weight: 500; letter-spacing: .32em; text-transform: uppercase; display: inline-flex; align-items: center; gap: 14px; margin: 0 auto}
.gtk-endcta-eyebrow::before,
.gtk-endcta-eyebrow::after{content: ''; width: 28px; height: 1px; background: currentColor; opacity: .9}
.gtk-endcta-h2{font-family: var(--fe); font-weight: 300; font-size: clamp(2.2rem,4vw,3.4rem); line-height: 1.08; letter-spacing: -.02em; color: #fff; max-width: 780px; margin: 22px auto 0; font-variation-settings: "opsz" 144}
.gtk-endcta-h2 em{font-style: italic; color: var(--gold-lt); font-weight: 300}
.gtk-endcta-actions{display: flex; gap: 18px; justify-content: center; margin-top: 40px; flex-wrap: wrap; align-items: center}
.gtk-endcta-ghost{display: inline-flex; align-items: center; gap: 8px; color: #fff; border-bottom: 1px solid var(--gold-lt); padding-bottom: 6px; font-family: var(--fu); font-size: 12px; letter-spacing: .18em; text-transform: uppercase; transition: color .25s, border-color .25s, gap .25s}
.gtk-endcta-ghost:hover{color: var(--gold-lt); border-color: var(--ember); gap: 12px}
@media(max-width:640px){
.gtk-endcta{padding: 90px 0}
.gtk-endcta-h2{font-size: 1.9rem}
.gtk-endcta-actions{flex-direction: column; gap: 22px}
}
/* (c) complete WYSIWYG typography for .gtk-body ------------------- */
.gtk-body{font-family: var(--fu); font-size: 16px; line-height: 1.85; color: var(--t2l); font-weight: 300; min-width: 0}
.gtk-body > *:first-child{margin-top: 0}
.gtk-body > *:last-child{margin-bottom: 0}
.gtk-body p{margin: 0 0 18px}
.gtk-body p:last-child{margin-bottom: 0}
.gtk-body a{color: var(--ember); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; transition: color .2s}
.gtk-body a:hover{color: var(--ember-dk)}
.gtk-body strong,
.gtk-body b{color: var(--ink); font-weight: 600}
.gtk-body em,
.gtk-body i{font-style: italic}
.gtk-body h1,
.gtk-body h2,
.gtk-body h3{font-family: var(--fe); color: var(--ink); font-weight: 400; letter-spacing: -.01em; line-height: 1.15; margin: 40px 0 18px}
.gtk-body h1{font-size: clamp(1.9rem,3vw,2.6rem); font-weight: 300}
.gtk-body h2{font-size: clamp(1.6rem,2.4vw,2.1rem); font-weight: 300}
.gtk-body h3{font-size: 1.35rem; font-weight: 500}
.gtk-body h4{font-family: var(--fe); font-style: italic; font-size: 22px; color: var(--ink); margin: 32px 0 16px; font-weight: 400; line-height: 1.25}
.gtk-body h5,
.gtk-body h6{font-family: var(--fu); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); font-weight: 600; margin: 28px 0 12px}
.gtk-body h6{color: var(--ember)}
/* lists — unordered (ember dash bullet) and ordered (italic 01,02...) */
.gtk-body ul,
.gtk-body ol{margin: 18px 0 24px; padding-left: 0; list-style: none}
.gtk-body li{position: relative; padding: 8px 0; font-size: 15.5px; line-height: 1.65; color: var(--t2l)}
.gtk-body ul > li{padding-left: 26px}
.gtk-body ul > li::before{content: ''; position: absolute; left: 0; top: 18px; width: 14px; height: 1px; background: var(--ember)}
.gtk-body ol{counter-reset: gtk-ol}
.gtk-body ol > li{padding-left: 38px; counter-increment: gtk-ol}
.gtk-body ol > li::before{content: counter(gtk-ol,decimal-leading-zero); position: absolute; left: 0; top: 8px; font-family: var(--fe); font-style: italic; font-size: 14px; color: var(--ember); letter-spacing: .04em}
/* nested lists */
.gtk-body li > ul,
.gtk-body li > ol{margin: 8px 0 4px}
.gtk-body li > ul > li{padding-left: 22px; font-size: 15px}
.gtk-body li > ul > li::before{width: 10px; top: 16px; background: var(--gold)}
.gtk-body li > ol > li{padding-left: 32px}
/* long-form blockquote — pull-quote style */
.gtk-body blockquote{border-left: 2px solid var(--ember); padding: 8px 0 8px 24px; margin: 28px 0; font-family: var(--fe); font-style: italic; font-size: 19px; color: var(--ink); line-height: 1.55; font-weight: 300}
.gtk-body blockquote p{margin: 0}
.gtk-body blockquote cite{display: block; margin-top: 10px; font-family: var(--fu); font-style: normal; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l)}
/* code */
.gtk-body pre{background: var(--ink); color: var(--bone); padding: 20px 24px; margin: 24px 0; font-family: 'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace; font-size: 13.5px; line-height: 1.6; overflow-x: auto; border-left: 2px solid var(--ember)}
.gtk-body code{font-family: 'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace; font-size: .92em; background: var(--bone-2); padding: 2px 6px; border-radius: 2px; color: var(--ember-dk)}
.gtk-body pre code{background: transparent; padding: 0; color: inherit}
/* tables — horizontal scroll wrapper on small screens. WYSIWYG may
   or may not wrap the table; guard both with overflow on the table
   parent by also allowing the table itself to display:block on narrow
   viewports (acceptable for this content). */
.gtk-body table{width: 100%; border-collapse: collapse; margin: 24px 0; font-family: var(--fu); font-size: 14px; border-top: 1px solid var(--bone-3)}
.gtk-body thead{background: var(--bone-2)}
.gtk-body table th,
.gtk-body table td{padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--bone-3); font-size: 14px; vertical-align: top}
.gtk-body table th{font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l); font-weight: 600; background: var(--bone-2)}
.gtk-body table td{color: var(--t1l)}
.gtk-body table td em,
.gtk-body table tfoot td em{font-family: var(--fe); font-style: italic; color: var(--ember)}
.gtk-body table tfoot td{background: var(--bone); font-family: var(--fe); font-style: italic; color: var(--ink)}
.gtk-body table tbody tr:hover{background: rgba(184,68,42,.03)}
@media(max-width:720px){
.gtk-body table{display: block; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch}
.gtk-body thead,.gtk-body tbody,.gtk-body tfoot{display: table}
}
/* images + WP caption + alignment classes */
.gtk-body img{max-width: 100%; height: auto; margin: 24px 0; border-radius: 2px}
.gtk-body figure{margin: 26px 0}
.gtk-body figure img{margin: 0; display: block}
.gtk-body figcaption,
.gtk-body .wp-caption-text{font-family: var(--fe); font-style: italic; font-size: 13.5px; color: var(--t3l); text-align: center; margin-top: 10px; line-height: 1.5}
.gtk-body .alignleft{float: left; margin: 6px 26px 16px 0; max-width: 48%}
.gtk-body .alignright{float: right; margin: 6px 0 16px 26px; max-width: 48%}
.gtk-body .aligncenter{display: block; margin-left: auto; margin-right: auto}
.gtk-body .alignwide,
.gtk-body .alignfull{max-width: none}
@media(max-width:640px){
.gtk-body .alignleft,
  .gtk-body .alignright{float: none; max-width: 100%; margin: 20px 0}
}
/* misc inline elements WP editor may produce */
.gtk-body hr{border: none; border-top: 1px solid var(--bone-3); margin: 40px 0}
.gtk-body dt{font-family: var(--fe); font-style: italic; color: var(--ink); font-size: 17px; margin-top: 18px}
.gtk-body dd{margin: 4px 0 0 0; padding-left: 18px; border-left: 2px solid var(--bone-3); color: var(--t2l)}
.gtk-body address{font-family: var(--fe); font-style: italic; color: var(--t2l); font-size: 15.5px; padding: 18px 0 18px 22px; border-left: 2px solid var(--gold); margin: 24px 0}
.gtk-body sub,.gtk-body sup{font-size: .7em; line-height: 0; position: relative; vertical-align: baseline}
.gtk-body sup{top: -.5em}
.gtk-body sub{bottom: -.25em}
.gtk-body mark,
.gtk-body .marker{background: linear-gradient(transparent 55%,rgba(214,185,126,.55) 55%); color: var(--ink); padding: 0 2px}
.gtk-body .btn,
.gtk-body .wp-block-button__link{display: inline-flex; align-items: center; gap: 10px; background: var(--brand-orange); color: #fff; font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; padding: 14px 24px; margin: 14px 0; text-decoration: none; border: none; cursor: pointer; transition: background .25s}
.gtk-body .btn:hover,
.gtk-body .wp-block-button__link:hover{background: var(--ember-dk)}
/* if the editor drops a plain .gtk-list or .gtk-table (the classes used
   by the design), leave them alone — the base styles already match. */
/* Good-to-Know section head — right description stays LEFT-aligned
   (user: "main page section description content left alignment").
   Literal values so plugin var-wipes can't break it. */
#goodtoknow .sec-head .right{align-items: flex-start}
#goodtoknow .sec-head .right p{text-align: left; font-family: 'Cormorant Garamond',Georgia,serif; font-style: italic; font-size: 16px; line-height: 1.6; font-weight: 300; max-width: 440px; color: #4A453E}
/* 
   Our Promise (conservation band). Markup now mirrors the static design:
   .cons-grid > [ eyebrow.gold + h2 + .cons-desc ] + .cons-stats > .cons-stat.
   .cons-desc wraps the WYSIWYG output; design styles paragraphs via
   `.cons p` which still matches. Rules below are defensive only —
   literal fonts/colors so plugin var-wipes can't break the band. */
.cons .cons-desc p{font-family: 'Cormorant Garamond',Georgia,serif; font-style: italic; font-size: 16px; line-height: 1.7; font-weight: 300; color: rgba(244,239,230,.72); margin-top: 18px; max-width: 520px}
.cons .cons-desc ul,
.cons .cons-desc ol{margin: 14px 0 0 20px; max-width: 520px; font-family: 'Cormorant Garamond',Georgia,serif; font-style: italic; font-size: 16px; line-height: 1.7; font-weight: 300; color: rgba(244,239,230,.72)}
.cons .cons-desc li{margin: 4px 0}
.cons .cons-desc a{color: #D6B97E; text-decoration: underline; text-underline-offset: 3px}
.cons .eyebrow.gold{color: #D6B97E}
.cons h2 em{font-style: italic; color: #D6B97E; font-weight: 300}
/* 
   Voices section head — dynamic aggregate rating row.
   Design head is: H2 left, right column = sub description (italic serif,
   left-aligned) + aggregate stars/score + "View all N reviews" link-arrow.
   Literal fonts/hex so plugin var-wipes can't break it. */
#voices .sec-head .right{align-items: flex-start}
#voices .sec-head .right p{text-align: left; font-family: 'Cormorant Garamond',Georgia,serif; font-style: italic; font-size: 16px; line-height: 1.6; font-weight: 300; max-width: 440px; color: #4A453E}
.voices-agg{display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; background: #FBF7EF; border: 1px solid #E9E0CF}
.voices-agg .thg-stars .thg-star{font-size: 15px !important}
.voices-agg-score{font-family: 'Archivo','Inter',sans-serif; font-size: 14px; font-weight: 600; color: #161D19; letter-spacing: .02em}
.voices-agg-count{font-family: 'Archivo','Inter',sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: #8A8074}
.voice-sm .by{font-family: var(--fu); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--t3l); line-height: 1.6}
@media(max-width:900px){
.voices-agg{padding: 8px 12px; gap: 8px}
}
/* voices-agg sits below the section title; .voices-head-left stacks H2 + aggregate chip in the head's left cell. */
.voices-head-left{display: flex; flex-direction: column; align-items: flex-start; gap: 22px}
.voices-head-left .voices-agg{margin: 0}
/* 
   FAQ — category tabs + accordion, defensive copies with literal values
   so plugin var-wipes can't kill the toggle affordance. The <em> prefix
   before questions no longer exists in the markup. */
#faq .faq-q{font-family: 'Fraunces','Cormorant Garamond',Georgia,serif}
#faq .faq-q .tg{color: #B8442A; border-color: #E9E0CF}
#faq .faq-row.open .faq-q .tg{background: #B8442A; color: #fff; border-color: #B8442A; transform: rotate(45deg)}
#faq .faq-a{max-height: 0; overflow: hidden; transition: max-height .5s cubic-bezier(.16,1,.3,1)}
#faq .faq-row.hidden{display: none}
#faq .faq-cat i.ph{color: #B8442A}
#faq .faq-cat.active{background: #161D19; color: #fff; border-color: #161D19}
#faq .faq-cat.active i.ph{color: #D6B97E}
@media(max-width:640px){
#faq .faq-cats{gap: 6px}
#faq .faq-cat{padding: 8px 12px; letter-spacing: .14em}
}
/* FAQ section head: ACF title + sub description.
   Right-column note stays LEFT-aligned italic serif, same treatment as
   #goodtoknow / #voices. Literal values so plugin var-wipes can't break. */
#faq .sec-head .right{align-items: flex-start}
#faq .sec-head .right p{text-align: left; font-family: 'Cormorant Garamond',Georgia,serif; font-style: italic; font-size: 16px; line-height: 1.6; font-weight: 300; max-width: 440px; color: #4A453E}
/* 
   CTA (Begin the Conversation) — global band before the footer.

   THE BACKGROUND PROBLEM: the CTA was flat ink and the footer below is
   near-black (#0A0F0C) — the two fused into one long dark slab and the
   CTA read as "footer stuff". Treatment:
   1. a real photograph behind the band (ACF Trip Global image, falls
      back to the trip hero) with a diagonal veil that keeps the LEFT
      readable and lets the image breathe on the RIGHT — same recipe as
      the trip heroes, so it reads as *content*, not chrome;
   2. a gold hairline + soft glow across the very top of the band —
      the brand's "gold rule" moment that announces a new chapter;
   3. the band bottom fades to the footer's #0A0F0C so the footer starts
      visibly *after* the story ends.
   Literal fonts/hex throughout — plugin var-wipes can't kill it. */
.thg-cta::before,
.thg-cta::after{content: none}
/* neutralise old .cta unsplash pseudo layers */
.thg-cta .container{position: relative; z-index: 3}
.thg-cta-bg{z-index: 0}
/* gold rule + glow announcing the band */
.thg-cta .thg-cta-veil::before{content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent 0%, #B69658 18%, #D6B97E 50%, #B69658 82%, transparent 100%)}
.thg-cta .thg-cta-veil::after{content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: min(880px,90%); height: 120px; pointer-events: none; background: radial-gradient(60% 100% at 50% 0%, rgba(214,185,126,.13), transparent 70%)}
.thg-cta-eyebrow{color: #D6B97E}
.thg-cta .cta-grid h2 em{font-style: italic; color: #D6B97E}
/* form card — glassy panel from the design */
.thg-cta-form{background: rgba(10,15,12,.62); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,.12); border-top: 1px solid rgba(214,185,126,.35); padding: 42px}
/* ── WPForms re-skin: brand underline fields, no default chrome ──
   Scoped inside .thg-cta-form so it can't leak to other forms. */
.thg-cta-form .wpforms-container,
.thg-cta-form .wpforms-container .wpforms-form{margin: 0; padding: 0}
.thg-cta-form .wpforms-field{margin: 0 0 20px; padding: 0}
.thg-cta-form .wpforms-field-label{display: block; font-family: 'Archivo','Inter',sans-serif; font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: rgba(244,239,230,.55); margin: 0 0 8px; font-weight: 500}
.thg-cta-form .wpforms-field-label .wpforms-required-label{color: #B8442A}
.thg-cta-form .wpforms-field input[type=text],
.thg-cta-form .wpforms-field input[type=email],
.thg-cta-form .wpforms-field input[type=tel],
.thg-cta-form .wpforms-field input[type=number],
.thg-cta-form .wpforms-field input[type=date],
.thg-cta-form .wpforms-field select,
.thg-cta-form .wpforms-field textarea{width: 100% !important; max-width: 100% !important; background: transparent !important; border: none !important; border-bottom: 1px solid rgba(255,255,255,.18) !important; border-radius: 0 !important; box-shadow: none !important; padding: 10px 0 12px !important; font-family: 'Archivo','Inter',sans-serif !important; font-size: 15px !important; color: #fff !important; outline: none !important; transition: border-color .25s}
.thg-cta-form .wpforms-field input:focus,
.thg-cta-form .wpforms-field select:focus,
.thg-cta-form .wpforms-field textarea:focus{border-bottom-color: #D6B97E !important}
.thg-cta-form .wpforms-field input::placeholder,
.thg-cta-form .wpforms-field textarea::placeholder{color: rgba(244,239,230,.35)}
.thg-cta-form .wpforms-field select option{background: #141b17; color: #fff}
.thg-cta-form .wpforms-field textarea{resize: vertical; min-height: 80px}
/* 2-col rows (WPForms columns layout) keep working */
.thg-cta-form .wpforms-field-row{display: flex; gap: 18px}
.thg-cta-form .wpforms-field-row .wpforms-field-row-block{flex: 1; padding: 0}
/* submit — brand fill button */
.thg-cta-form .wpforms-submit-container{padding: 0; margin-top: 16px}
.thg-cta-form button[type=submit],
.thg-cta-form .wpforms-submit{background: #B8442A !important; color: #fff !important; border: none !important; border-radius: 0 !important; font-family: 'Archivo','Inter',sans-serif !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .18em !important; text-transform: uppercase !important; padding: 16px 24px !important; transition: background .25s !important; box-shadow: none !important; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer}
.thg-cta-form button[type=submit]:hover,
.thg-cta-form .wpforms-submit:hover{background: #9C3822 !important}
/* kill WPForms error/confirmation default look, keep it on-brand */
.thg-cta-form .wpforms-error{font-family: 'Archivo','Inter',sans-serif !important; font-size: 11px !important; color: #E2A093 !important; margin-top: 6px}
.thg-cta-form .wpforms-field.wpforms-has-error input,
.thg-cta-form .wpforms-field.wpforms-has-error textarea{border-bottom-color: #B8442A !important}
.thg-cta-form .wpforms-confirmation-container-full{background: transparent !important; border: 1px solid rgba(214,185,126,.4) !important; padding: 24px !important; font-family: 'Cormorant Garamond',Georgia,serif !important; font-size: 17px !important; color: #F4EFE6 !important; font-style: italic}
/* native fallback form inherits the same underline fields */
.thg-cta-form .field{margin-bottom: 20px}
.thg-cta-form label{display: block; font-family: 'Archivo','Inter',sans-serif; font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: rgba(244,239,230,.55); margin-bottom: 8px; font-weight: 500}
.thg-cta-form input,
.thg-cta-form select,
.thg-cta-form textarea{width: 100%; background: transparent; border: none; border-bottom: 1px solid rgba(255,255,255,.18); padding: 10px 0 12px; font-family: 'Archivo','Inter',sans-serif; font-size: 15px; color: #fff; outline: none; transition: border-color .25s}
.thg-cta-form input:focus,
.thg-cta-form select:focus,
.thg-cta-form textarea:focus{border-bottom-color: #D6B97E}
.thg-cta-form .row2{display: grid; grid-template-columns: 1fr 1fr; gap: 18px}
@media(max-width:900px){
.thg-cta{padding: 100px 0 110px}
.thg-cta-form{padding: 30px 24px}
.thg-cta-form .wpforms-field-row{flex-direction: column; gap: 0}
.thg-cta-form .row2{grid-template-columns: 1fr; gap: 0}
}
/* Trip CTA is left-aligned (the shared .cta centering must not apply);
   the veil lets the photograph read a touch more on the right. */
.thg-cta{position: relative; overflow: hidden; padding: 130px 0 140px; background: #0E1411; color: #fff; text-align: left}
.thg-cta .thg-cta-form,.thg-cta .cta-form{text-align: left}
.thg-cta-form h4{font-family: 'Cormorant Garamond',Georgia,serif; font-style: italic; font-size: 20px; color: #D6B97E; margin-bottom: 24px; font-weight: 400; text-align: left}
.thg-cta-form label,.thg-cta-form .wpforms-field-label{text-align: left}
.thg-cta-veil{background: linear-gradient(to bottom, rgba(10,15,12,0) 82%, #0A0F0C 100%),
    linear-gradient(120deg, rgba(14,20,17,.95) 0%, rgba(14,20,17,.8) 44%, rgba(14,20,17,.42) 100%) !important; z-index: 1}
/* Pin the trip CTA copy hard-left. */
.thg-cta .cta-grid h2{color: #fff; text-align: left; margin: 22px 0 0; max-width: none}
.thg-cta .cta-grid p{text-align: left; margin: 22px 0 0; max-width: 480px; font-family: 'Archivo','Inter',sans-serif; font-style: normal; font-size: 15.5px; color: rgba(244,239,230,.78)}
.thg-cta .cta-contacts{align-items: flex-start}
.thg-cta .cta-contacts a{margin: 0}
/* Remaining single-trip fixes */
/* (a) Moments head — H2 left, sub description right, LEFT-aligned text.
   Literal values so plugin var-wipes can't break it. */
#moments .sec-head .right{align-items: flex-start}
#moments .sec-head .right p{text-align: left; font-family: 'Cormorant Garamond',Georgia,serif; font-style: italic; font-size: 16px; line-height: 1.6; font-weight: 300; max-width: 440px; color: #4A453E}
/* (b) One sticky bar at a time — when the subnav pins (.subnav-stuck on
   body, set by JS), the fixed header slides away and the subnav takes
   the top edge. Both transitions eased so the swap feels intentional.
   the header markup is <nav class="nav" id="nav"> and the
   stylesheet also has an #nav{} ID block (line ~2303) whose specificity
   beats any class-based rule — that's why the header stayed sticky on
   Local. Target BOTH selectors and use !important so no ID rule,
   plugin sheet, or inline style can out-compete the hide. -110% (not
   -100%) so the .scrolled state's blur/shadow can't peek. */
.nav, #nav{transition: transform .35s cubic-bezier(.16,1,.3,1),background .5s,border-color .5s}
body.subnav-stuck .nav,
body.subnav-stuck #nav{transform: translateY(-110%) !important; pointer-events: none}
.subnav{position: sticky; top: var(--nav-h, 84px); z-index: 80; background: rgba(250,246,239,.94); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid var(--bone-3); transition: top .35s cubic-bezier(.16,1,.3,1)}
body.subnav-stuck .subnav{top: 0 !important}
/* Logged-in on Local/production: WP admin bar is fixed 32px (46px on
   mobile) — keep the pinned subnav below it, never underneath. */
body.admin-bar.subnav-stuck .subnav{top: 32px !important}
@media(max-width:782px){
body.admin-bar.subnav-stuck .subnav{top: 46px !important}
}
/* (c) Unified subpage end-CTA — .trip-endcta reuses the gtk-endcta band. Retire two-column card everywhere. */
.trip-endcta .gtk-endcta-h2 em{color: #D6B97E}
/* Responsive  pass — 320px */
/* (a) Pricing matrix: scrolls horizontally on small screens instead of
   pushing the page wide. Wrapper stays decorative; the table keeps its
   natural width and pans under the finger. */
.matrix-wrap{max-width: 1000px; margin: 0 auto; background: rgba(244,239,230,.03); border: 1px solid rgba(255,255,255,.1); padding: 8px; position: relative; overflow-x: auto; -webkit-overflow-scrolling: touch}
.matrix{width: 100%; border-collapse: collapse; min-width: 560px}
@media(max-width:640px){
.matrix-wrap{padding: 4px}
.matrix th,.matrix td{padding: 14px 12px; font-size: 14px}
.matrix td:not(:first-child){font-size: 17px}
}
/* (b) Itinerary edition switcher — sticky offset + mobile ergonomics.
   The bar sticks below the subnav: 84px header + 62px subnav normally,
   just 62px once the header has slid away (body.subnav-stuck). */
.thg-itin-switch{position: sticky; top: calc(var(--nav-h, 84px) + 62px); z-index: 79}
body.subnav-stuck .thg-itin-switch{top: 62px}
body.admin-bar.subnav-stuck .thg-itin-switch{top: 94px}
/* GTK topic nav stacks below the subnav the same way (the subnav joined the Good-to-Know page this round; before that gtk-nav stuck at 72px under nothing). */
.gtk-nav{top: 146px}
body.subnav-stuck .gtk-nav{top: 62px}
body.admin-bar.subnav-stuck .gtk-nav{top: 94px}
@media(max-width:782px){
body.admin-bar.subnav-stuck .thg-itin-switch{top: 108px}
body.admin-bar.subnav-stuck .gtk-nav{top: 108px}
}
/* Mobile: smaller tabs, comfortable tap targets, visible scroll hint */
@media(max-width:700px){
.switch{height: auto}
.sw-tab{min-width: 180px; padding: 12px 16px; height: auto}
.sw-tab .t{font-size: 16px}
.sw-tab .d{font-size: 10px}
/* right-edge fade signals there are more editions off-screen */
.switch-wrap{position: sticky}
.switch-wrap::after{content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 36px; background: linear-gradient(to left, #F4EFE6 15%, rgba(244,239,230,0)); pointer-events: none}
}
/* (c) Day rails: sticky offsets follow the compact (subnav-stuck) state */
body.subnav-stuck .trip-days .day-no,
body.subnav-stuck .trip-days .day-side{top: 152px}
/* (d) 320px hygiene: long trip titles in the breadcrumb/H1 never force
   a wide layout; overlong words wrap instead of overflowing. */
@media(max-width:480px){
.crumb{flex-wrap: wrap; row-gap: 6px}
.h1-trip{flex-wrap: wrap; row-gap: 4px}
.phead h1,.hero-title,.sec-h{overflow-wrap: break-word}
}
/* Sticky subnav — top-gap fixes (mobile device-toolbar report) */
/* The subnav's resting sticky offset must match the real header height,
   which shrinks at mobile breakpoints (96/84 → 72 → 56). A fixed 84px
   left a strip of page content visible between header and subnav. */
@media(max-width:820px){
.subnav{top: 72px}
.thg-itin-switch{top: 124px}
.gtk-nav{top: 124px}
/* 72 header + 52-62 subnav */
}
@media(max-width:320px){
.subnav{top: 56px}
.thg-itin-switch{top: 108px}
.gtk-nav{top: 108px}
}
/* Below 600px WordPress switches #wpadminbar to position:absolute — it
   scrolls away with the page — so the stuck subnav must sit at the very
   top, not 46px down (that offset left an empty strip up top). */
@media(max-width:600px){
body.admin-bar.subnav-stuck .subnav{top: 0 !important}
body.admin-bar.subnav-stuck .thg-itin-switch{top: 52px}
body.admin-bar.subnav-stuck .gtk-nav{top: 52px}
}
/* Compact subnav height at small screens → switcher hugs it (subnav row
   is 52-62px depending on breakpoint). */
@media(max-width:820px){
body.subnav-stuck .thg-itin-switch{top: 62px}
}
@media(max-width:320px){
body.subnav-stuck .thg-itin-switch{top: 52px}
}
/* Dynamic slot picker + polish */
/* "Choose your slot" is a WPForms form on the paper dates-card.
   Light variant of the brand form language: underline fields on paper,
   uppercase micro-labels, ember submit. Scoped so nothing leaks. */
.thg-slot-form .wpforms-container,
.thg-slot-form .wpforms-container .wpforms-form{margin: 0; padding: 0}
.thg-slot-form .wpforms-field{margin: 0 0 18px; padding: 0}
.thg-slot-form .wpforms-field-label{display: block; font-family: 'Archivo','Inter',sans-serif; font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: #8A8074; margin: 0 0 8px; font-weight: 500}
.thg-slot-form .wpforms-field-label .wpforms-required-label{color: #B8442A}
.thg-slot-form .wpforms-field input[type=text],
.thg-slot-form .wpforms-field input[type=email],
.thg-slot-form .wpforms-field input[type=tel],
.thg-slot-form .wpforms-field input[type=number],
.thg-slot-form .wpforms-field input[type=date],
.thg-slot-form .wpforms-field select,
.thg-slot-form .wpforms-field textarea{width: 100% !important; max-width: 100% !important; background: transparent !important; border: none !important; border-bottom: 1px solid #DDD3C0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 10px 0 12px !important; font-family: 'Archivo','Inter',sans-serif !important; font-size: 15px !important; color: #161D19 !important; outline: none !important; transition: border-color .25s}
.thg-slot-form .wpforms-field input:focus,
.thg-slot-form .wpforms-field select:focus,
.thg-slot-form .wpforms-field textarea:focus{border-bottom-color: #B8442A !important}
.thg-slot-form .wpforms-field input::placeholder,
.thg-slot-form .wpforms-field textarea::placeholder{color: #B7AC9B}
/* radio / checkbox choices render as slot chips */
.thg-slot-form .wpforms-field ul{list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px}
.thg-slot-form .wpforms-field ul li{margin: 0}
.thg-slot-form .wpforms-field ul li label{display: inline-flex; align-items: center; gap: 8px; border: 1px solid #DDD3C0; padding: 10px 16px; cursor: pointer; font-family: 'Archivo','Inter',sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: #4A453E; transition: all .25s}
.thg-slot-form .wpforms-field ul li input{accent-color: #B8442A}
.thg-slot-form .wpforms-field ul li input:checked + label,
.thg-slot-form .wpforms-field ul li label:has(input:checked){background: #161D19; color: #fff; border-color: #161D19}
.thg-slot-form .wpforms-field-row{display: flex; gap: 16px}
.thg-slot-form .wpforms-field-row .wpforms-field-row-block{flex: 1; padding: 0}
.thg-slot-form .wpforms-submit-container{padding: 0; margin-top: 14px}
.thg-slot-form button[type=submit],
.thg-slot-form .wpforms-submit{background: #B8442A !important; color: #fff !important; border: none !important; border-radius: 0 !important; font-family: 'Archivo','Inter',sans-serif !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .18em !important; text-transform: uppercase !important; padding: 16px 24px !important; transition: background .25s !important; box-shadow: none !important; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer}
.thg-slot-form button[type=submit]:hover,
.thg-slot-form .wpforms-submit:hover{background: #9C3822 !important}
.thg-slot-form .wpforms-error{font-family: 'Archivo','Inter',sans-serif !important; font-size: 11px !important; color: #B8442A !important; margin-top: 6px}
.thg-slot-form .wpforms-confirmation-container-full{background: transparent !important; border: 1px solid #B69658 !important; padding: 22px !important; font-family: 'Cormorant Garamond',Georgia,serif !important; font-size: 16px !important; color: #161D19 !important; font-style: italic}
.thg-slot-fallback p{font-family: 'Cormorant Garamond',Georgia,serif; font-style: italic; font-size: 15px; color: #4A453E; line-height: 1.65; margin: 0 0 18px}
@media(max-width:640px){
.thg-slot-form .wpforms-field-row{flex-direction: column; gap: 0}
}
/* Brand color pass + section fixes */
/* (a) Brand palette per + homepage: primary CTA = --brand-orange #FF6701, ember washes decorative only. The day-tour block's own tokens already say this, but a later template's `.btn-fill{background:var(--ember)}` (trip pages, source order wins) repainted every day-tour button ember. Scope the page. */
.single-day_tour .btn-fill{background: var(--brand-orange); color: #fff}
.single-day_tour .btn-fill:hover{background: var(--brand-orange-dk)}
.single-day_tour .qbook-btn{background: var(--brand-orange); color: #fff}
.single-day_tour .qbook-btn:hover{background: var(--brand-orange-dk)}
.single-day_tour .subnav .sub-cta{background: var(--brand-orange)}
.single-day_tour .subnav .sub-cta:hover{background: var(--brand-orange-dk)}
.single-day_tour .subnav a:hover,
.single-day_tour .subnav a.active{color: var(--brand-orange)}
.single-day_tour .subnav a::after{background: var(--brand-orange)}
.single-day_tour .eyebrow{color: var(--brand-orange)}
.single-day_tour .crumb b{color: var(--brand-orange)}
.single-day_tour .chip{background: rgba(255,103,1,.10); color: var(--brand-orange)}
.single-day_tour .hero-tag .chip{background: rgba(255,255,255,.08); color: #fff}
.single-day_tour .hero-tag .chip.hot{background: var(--brand-orange); color: #fff}
.single-day_tour .fact i.ph{color: var(--brand-orange)}
.single-day_tour .fact-v em{color: var(--brand-orange)}
.single-day_tour .hl-no{color: var(--brand-orange)}
.single-day_tour .rv-score .stars{color: var(--brand-orange)}
.single-day_tour .rv-h .stars{color: var(--brand-orange)}
.single-day_tour .rv-badges .b{border-left-color: var(--brand-orange)}
.single-day_tour .rv-badges .b strong{color: var(--brand-orange)}
/* display-title accents stay ember (editorial), per guideline. */
/* (b) Cost & Dates readability — the trip page's dark section styles
   (.cost-wrap{background:ink} + ::before image + ::after veil, ~line
   2799) leak onto the day tour's cost GRID and bury the text under two
   dark layers. The day-tour cost wrap is a light grid inside #cost. */
.single-day_tour #cost .cost-wrap,
#cost div.cost-wrap{background: transparent !important; padding: 0 !important; display: grid; grid-template-columns: 1fr .95fr; gap: 64px; align-items: start; color: inherit; overflow: visible}
.single-day_tour #cost .cost-wrap::before,
.single-day_tour #cost .cost-wrap::after,
#cost div.cost-wrap::before,
#cost div.cost-wrap::after{content: none !important}
@media(max-width:1000px){
.single-day_tour #cost .cost-wrap,
  #cost div.cost-wrap{grid-template-columns: 1fr}
}
/* (c) Section head descriptions — right column, text left-aligned,
   across the whole day-tour page. */
.single-day_tour .sec-head .right{align-items: flex-start}
.single-day_tour .sec-head .right p{text-align: left; font-family: 'Fraunces','Cormorant Garamond',Georgia,serif; font-style: italic; font-size: 16px; line-height: 1.6; font-weight: 300; max-width: 440px; color: #4A453E}
/* (d) Review distribution rows on the day-tour reviews block —
   the archive's .rv-distribution styles exist but are sized for the
   scoreband; give the day-tour context its own rhythm. */
.single-day_tour .rv-distribution{display: flex; flex-direction: column; gap: 10px; min-width: 280px}
.single-day_tour .rv-distrow{display: grid; grid-template-columns: 40px 1fr 34px; gap: 10px; align-items: center; font: 12px 'Inter Tight',sans-serif; color: #4A453E}
.single-day_tour .rv-distrow small{text-align: right; color: #8A8074}
.single-day_tour .rv-track{height: 7px; background: #DDD3C0; overflow: hidden; border-radius: 99px}
.single-day_tour .rv-track b{display: block; height: 100%; background: var(--brand-orange); border-radius: 99px}
.single-day_tour .rv-more .btn-line-dark{box-shadow: inset 0 0 0 1px #161D19; color: #161D19; background: transparent}
.single-day_tour .rv-more .btn-line-dark:hover{background: #161D19; color: #fff}
/* Day tour — rich "additional info" blocks under the itinerary timeline
   and the inclusion columns. Full WYSIWYG typography: headings, lists,
   tables (scrollable), blockquotes, images. Literal values throughout. */
.itin-extra,
.inc-extra{max-width: 880px; margin: 56px auto 0; font-family: 'Inter Tight',sans-serif; font-size: 15.5px; line-height: 1.75; color: #4A453E}
.itin-extra h2,.inc-extra h2,
.itin-extra h3,.inc-extra h3{font-family: 'Fraunces',Georgia,serif; font-weight: 400; color: #161D19; margin: 36px 0 14px; line-height: 1.15}
.itin-extra h2,.inc-extra h2{font-size: 26px}
.itin-extra h3,.inc-extra h3{font-size: 21px}
.itin-extra h3 em,.inc-extra h3 em,
.itin-extra h2 em,.inc-extra h2 em{font-style: italic; color: #B8442A}
.itin-extra p,.inc-extra p{margin: 0 0 16px}
.itin-extra ul,.inc-extra ul,
.itin-extra ol,.inc-extra ol{margin: 0 0 18px 22px}
.itin-extra li,.inc-extra li{margin: 6px 0}
.itin-extra ul li::marker,.inc-extra ul li::marker{color: var(--brand-orange)}
.itin-extra blockquote,.inc-extra blockquote{font-family: 'Fraunces',Georgia,serif; font-style: italic; font-size: 17px; color: #161D19; border-left: 2px solid #B69658; padding: 6px 0 6px 22px; margin: 24px 0}
.itin-extra table,.inc-extra table{width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 14px}
.itin-extra th,.inc-extra th{font-family: 'Inter Tight',sans-serif; font-size: 10.5px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; text-align: left; background: #161D19; color: #F4EFE6; padding: 12px 14px}
.itin-extra td,.inc-extra td{padding: 12px 14px; border-bottom: 1px solid #DDD3C0; vertical-align: top}
.itin-extra img,.inc-extra img{max-width: 100%; height: auto; margin: 18px 0}
.itin-extra .table-wrap,.inc-extra .table-wrap{overflow-x: auto; -webkit-overflow-scrolling: touch}
/* Day tour pricing — USD currency tag + strike-through treatment.
   Line-through propagates from a parent to children and cannot be
   cancelled by text-decoration:none on the note — so the strike now
   lives ONLY on the <s> price element; the note stays clean. */
.single-day_tour .qbook-price .amt{display: flex; align-items: baseline; gap: 6px}
.single-day_tour .qbook-price .amt .cur{font-family: 'Inter Tight',sans-serif; font-size: 11px; font-weight: 600; letter-spacing: .22em; color: #B7AC9B; align-self: center; margin-right: 2px}
.single-day_tour .qbook-strike{display: flex; align-items: baseline; gap: 10px; margin: 2px 0 12px}
.single-day_tour .qbook-strike s{font-family: 'Bricolage Grotesque','Inter Tight',sans-serif; font-size: 17px; font-weight: 500; color: #8A8074; text-decoration: line-through; text-decoration-color: #B8442A; text-decoration-thickness: 1.5px}
.single-day_tour .qbook-strike em{font-family: 'Inter Tight',sans-serif; font-style: normal; font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--brand-orange)}
/* price-card: old price must read clearly as "was this much" —
   bigger type, ember strike line, note un-struck beside it. */
.single-day_tour .price-card .strike{display: flex; align-items: baseline; gap: 12px; font-family: inherit; font-size: inherit; color: inherit; text-decoration: none; margin-bottom: 22px}
.single-day_tour .price-card .strike s{font-family: 'Bricolage Grotesque','Inter Tight',sans-serif; font-size: 22px; font-weight: 500; color: #B7AC9B; text-decoration: line-through; text-decoration-color: var(--brand-orange); text-decoration-thickness: 2px}
.single-day_tour .price-card .strike em{font-family: 'Inter Tight',sans-serif; font-style: normal; font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--brand-orange); text-decoration: none}
/* Shared archive engine polish */
/* pill filters are now real <label><input> pairs — keep the button look */
.pill-btn{font-family: var(--fu); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; padding: 8px 12px; border: 1px solid rgba(22,29,25,.14); background: #fff; color: var(--t2l); cursor: pointer; transition: all .2s; border-radius: 999px; display: inline-flex; align-items: center; position: relative; user-select: none}
/* active chips are links */
a.ach{text-decoration: none}
a.ach:hover{background: #B8442A}
/* sale price inside cards */
.trip .price .amt-old{font-family: 'Bricolage Grotesque','Inter Tight',sans-serif; font-size: 15px; color: #8A8074; margin-right: 6px; text-decoration: line-through; text-decoration-color: var(--brand-orange)}
/* sort select — style like the design's sort button */
select.sort-btn{appearance: none; -webkit-appearance: none; background: transparent; border: 1px solid rgba(22,29,25,.14); font-family: 'Inter Tight',sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: #161D19; padding: 10px 34px 10px 16px; cursor: pointer; border-radius: 999px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23161D19' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center}
select.sort-btn:hover{border-color: #161D19}
/* empty state */
.arch-empty{background: #F4EFE6; border: 1px solid #DDD3C0; padding: 56px 40px; text-align: center}
.arch-empty .eyebrow{color: #B8442A}
.arch-empty h3{font-family: 'Fraunces',Georgia,serif; font-weight: 400; font-size: 26px; color: #161D19; margin: 14px 0 10px}
.arch-empty p{font-family: 'Inter Tight',sans-serif; font-size: 14.5px; color: #4A453E; max-width: 520px; margin: 0 auto 24px; line-height: 1.7}
/* WP paginate_links inside the design pager */
.pager .pnums{display: flex; gap: 8px; align-items: center; margin: 0 auto}
.pager .pnums .page-numbers{min-width: 40px; height: 40px; display: inline-grid; place-items: center; border: 1px solid #DDD3C0; color: #161D19; background: transparent; font-family: 'Bricolage Grotesque','Inter Tight',sans-serif; font-size: 13px; text-decoration: none; padding: 0 10px; transition: all .25s}
.pager .pnums .page-numbers.current,
.pager .pnums .page-numbers:hover{background: #161D19; color: #fff; border-color: #161D19}
.pager .pnums .page-numbers.dots{border: none}
/* section-only: room to breathe between the results/pager and the "Not seeing what you had in mind?" band. body.archive gets nothing. */
section.archive{padding-bottom: 104px}
/* archive pager tap targets on phones (44px rule) */
@media(max-width:760px){
  .pager .pnums .page-numbers{min-width: 44px; height: 44px}
  .pager .pnums .page-numbers.prev,.pager .pnums .page-numbers.next{min-width: 52px}
}
/* mobile: slide-in filter panel */
@media(max-width:1000px){
.archive-grid{grid-template-columns: 1fr}
.side{position: fixed; inset: 0 20% 0 0; z-index: 9600; background: #FAF6EF; max-height: none; overflow-y: auto; padding: 24px; transform: translateX(-105%); transition: transform .4s cubic-bezier(.16,1,.3,1); box-shadow: 8px 0 40px rgba(14,20,17,.18)}
.side.open{transform: translateX(0)}
.mobile-filter-bar{position: sticky; top: 0; z-index: 70; background: #FAF6EF; border-bottom: 1px solid #DDD3C0; padding: 12px 0}
.mfilter-btn{display: inline-flex; align-items: center; gap: 10px; background: #161D19; color: #fff; border: none; padding: 12px 20px; font-family: 'Inter Tight',sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; cursor: pointer}
}
@media(min-width:1001px){
.mobile-filter-bar{display: none}
}
/* Archive hero — the class had no styles, so the absolute .hero-bg
   inside escaped and painted behind the whole page. Contain it. */
.archive-hero{position: relative; overflow: hidden; display: flex; align-items: flex-end; background: #0E1411; color: #fff; min-height: 55vh}
.archive-hero .hero-bg{position: absolute; inset: 0; background-size: cover; background-position: center 40%; animation: none; transform: none}
  .archive-hero .hero-veil{position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 28%, rgba(14,20,17,.16) 0%, rgba(14,20,17,.32) 55%, rgba(14,20,17,.70) 100%), linear-gradient(180deg, rgba(14,20,17,.30) 0%, rgba(14,20,17,.24) 42%, rgba(14,20,17,.95) 100%)}
.archive-hero .ph-h1 em{font-style: italic; color: #D6B97E}
/* Archive hero — title hard-left, wide lede, pixel-set read-more.
   Root cause of the drift: the trip page's `.hero-body` is a 2-column
   GRID (1.35fr/.85fr) — the eyebrow filled cell one and pushed the H1
   into the right column. The archive hero body is a plain block. */
.archive-hero .hero-body{position: relative; z-index: 2; width: 100%; display: block; text-align: left; padding-top: 170px; padding-bottom: 70px}
.archive-hero .eyebrow{justify-content: flex-start}
.archive-hero .ph-h1{font-family: 'Fraunces',Georgia,serif; font-weight: 300; font-size: clamp(2.8rem,5.4vw,4.6rem); line-height: 1.04; color: #fff; letter-spacing: -.025em; margin-top: 18px; max-width: 16ch; margin: 18px 0 0; text-align: left}
/* Lede: single wide column — no grid — so long copy breathes. */
.archive-hero .ph-lede-wrap{display: block; margin-top: 28px; max-width: 760px}
.archive-hero .ph-lede{font-family: 'Fraunces',Georgia,serif; font-style: italic; font-weight: 300; font-size: 1.15rem; color: rgba(244,239,230,.82); max-width: 66ch; margin-top: 20px; line-height: 1.65; text-align: left; margin: 0}
.archive-hero .ph-lede-more{display: none}
.archive-hero .ph-lede.expanded .ph-lede-more{display: inline}
/* Read-more sits on its own line, clear of the text, design spec:
   11px uppercase, gold underline, 14px above. */
.archive-hero .ph-readmore{display: table; font-family: 'Inter Tight',sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: #D6B97E; cursor: pointer; background: none; border: none; padding: 8px 0 6px; border-bottom: 1px solid #D6B97E; margin: 14px 0 0; transition: color .2s; line-height: 1}
.archive-hero .ph-readmore i.ph{font-size: 12px; vertical-align: -1px; margin-left: 6px}
.archive-hero .ph-readmore:hover{color: #fff}
@media(max-width:640px){
.archive-hero .hero-body{padding-top: 140px; padding-bottom: 50px}
.archive-hero .ph-lede{font-size: 1.05rem}
}
/* ════════════════════════════════════════════════════════════════ — UNIFORM HERO + HEADER CONSISTENCY brief: (1) every page + archive hero must cover the fold (min-height uniform, pixel-perfect responsive); (2) the header height + logo must match the trip page on EVERY page, including the home page (it was smaller there); (3) the header must show the brand ink on first load everywhere — never a white/off-white band behind a transparent nav. ════════════════════════════════════════════════════════════════ */
/* ── 1) Above-the-fold heroes, uniform across every page ──────────
   All image-backed brand heroes fill the first viewport. min-height
   only (content still grows taller if it needs to). `!important`
   overrides the older per-page inline `min-height:NNvh` styles
   (author stylesheet !important beats a normal inline style). */
.phero,
.archive-hero,
.phead,
.rv-hero,
.gtk-hero,
.page-hero,
.hero{min-height: 100dvh !important}
/* Keep the flex-backed heroes bottom-anchored so the title sits near
   the fold, and let the veil reach the very top so the header never
   floats on a light gap. (rv-hero / gtk-hero are block + padded and
   keep their own layout.) */
.phero,.archive-hero,.phead,.page-hero{display: flex !important; align-items: flex-end !important; justify-content: flex-start !important}
/* ── 2) Header height + logo — identical on the trip page and home ──
   Match the winning "perfect" trip-page values: 96px row, 72px logo,
   15px condensed wordmark. Home-specific shrink overrides are nullified
   by an equally-specific, later !important rule. */
.nav .nav-row{display: flex !important; align-items: center !important; gap: 32px !important; height: 96px !important}
.nav .site-logo__icon,.nav .site-logo__icon img{width: 72px !important; height: 72px !important}
.nav .site-logo__text{font-family: 'Helvetica Neue','Helvetica','Arial Narrow',sans-serif !important; font-size: 15px !important; font-weight: 800 !important; font-stretch: condensed !important; letter-spacing: .18em !important; line-height: 1.1 !important; text-transform: uppercase !important; color: #fff !important; display: flex !important; flex-direction: column !important}
.nav .site-logo__text span{display: block !important; line-height: 1.1 !important; margin: 0 !important; padding: 0 !important}
/* The home page duplicated the header differently — force it to the same
   trip-page sizes so a homepage never looks small. */
.home .nav .nav-row{height: 96px !important; gap: 40px !important}
.home .nav .site-logo__icon,.home .nav .site-logo__icon img{width: 72px !important; height: 72px !important}
.home .nav .site-logo__text{display: flex !important; flex-direction: column !important; color: #fff !important; font-family: 'Helvetica Neue','Helvetica','Arial Narrow',sans-serif !important; font-size: 15px !important; font-weight: 800 !important; letter-spacing: .18em !important; line-height: 1.1 !important; text-transform: uppercase !important; justify-content: center !important; gap: 0 !important; font-stretch: condensed !important}
.home .nav .site-logo__text span{display: block !important; line-height: 1.1 !important; margin: 0 !important; padding: 0 !important}
.home .nav .site-logo{align-items: center !important; gap: 10px !important}
/* Responsive header — mirror the trip page breakpoints (so all pages
   shrink together, including the home page). */
@media(max-width:1100px){
.nav .nav-row{height: 84px !important}
.home .nav .nav-row{height: 84px !important}
}
@media(max-width:900px){
.nav .site-logo__icon,.nav .site-logo__icon img,
  .home .nav .site-logo__icon,.home .nav .site-logo__icon img{width: 56px !important; height: 56px !important}
.nav .site-logo__text,.home .nav .site-logo__text{font-size: 13px !important}
}
@media(max-width:820px){
.nav .nav-row{height: 72px !important}
.home .nav .nav-row{height: 72px !important}
}
@media(max-width:400px){
.nav .site-logo__icon,.nav .site-logo__icon img,
  .home .nav .site-logo__icon,.home .nav .site-logo__icon img{width: 48px !important; height: 48px !important}
.nav .site-logo__text,.home .nav .site-logo__text{font-size: 11px !important}
}
/* ── 3) Header always shows brand ink on first load ────────────── The nav starts transparent with a translucent wash that lets light page backgrounds show through as an off-white band. It is solid alpine ink on every page, from first paint. */
/* ═══ NAVIGATION — transparent over a dark hero, branded (readable) elsewhere ═══
   Every page now starts with a full-bleed dark hero at the very top (y=0), so the
   header can be transparent on first load and blend with it — matching the
   homepage. A top-only brand-ink scrim softens the hero behind the bone/white
   logo + links while keeping them legible. Pages whose top region isn't a dark
   hero (e.g. the light editorial top of a journal entry, search results) fall
   back to a readable branded ink panel. On scroll / menu-open / .solid it
   tightens into a frosted ink panel.
   Scoped to .nav (active) + #nav (the element still carries the id). */
.nav,#nav{position: fixed; inset: 0 0 auto; z-index: 9000; background: rgba(14,20,17,.72); backdrop-filter: blur(14px) saturate(150%); -webkit-backdrop-filter: blur(14px) saturate(150%); border-bottom: 1px solid rgba(255,255,255,.06); transition: background .5s var(--io),border-color .5s var(--io),backdrop-filter .5s var(--io),transform .3s var(--ex)}
.nav.scrolled,#nav.scrolled,
.nav.menu-open,#nav.menu-open,
.nav.solid,#nav.solid{background: rgba(14,20,17,.90); backdrop-filter: blur(18px) saturate(150%); -webkit-backdrop-filter: blur(18px) saturate(150%); border-bottom-color: rgba(255,255,255,.07)}
  /* Transparent-on-load scrim over the dark full-bleed heroes that reach the top
     of the viewport (home, page/archive/trip/single, blog essay, 404) so the
     header blends with each page's hero image. The style.css default is a solid
     dark bar; these selectors lift it to a fading scrim until the page scrolls. */
  body:has(.thg-home-hero) .nav:not(.scrolled):not(.menu-open):not(.solid),
  body:has(.bs-hero) .nav:not(.scrolled):not(.menu-open):not(.solid),
body:has(.archive-hero) .nav:not(.scrolled):not(.menu-open):not(.solid),
body:has(.phero) .nav:not(.scrolled):not(.menu-open):not(.solid),
body:has(.page-hero) .nav:not(.scrolled):not(.menu-open):not(.solid),
body:has(.phead) .nav:not(.scrolled):not(.menu-open):not(.solid),
body:has(.gtk-hero) .nav:not(.scrolled):not(.menu-open):not(.solid),
body:has(.rv-hero) .nav:not(.scrolled):not(.menu-open):not(.solid),
body:has(.hero) .nav:not(.scrolled):not(.menu-open):not(.solid),
body:has(.p404) .nav:not(.scrolled):not(.menu-open):not(.solid){background: linear-gradient(180deg, rgba(14,20,17,.55) 0%, rgba(14,20,17,0) 100%); border-bottom: 1px solid transparent; backdrop-filter: none; -webkit-backdrop-filter: none}
/* Journal essay (single) content & inquiry relocation */
/* Heading hierarchy for WordPress-editor content (h2–h6). h2/h3 already styled
   in the .bs-article block; add h4–h6 and tighten list/quote/table rhythm. */
.bs-article h4{font-family: var(--fe); font-weight: 500; font-size: 20px; line-height: 1.3; margin: 22px 0 10px; color: var(--ink)}
.bs-article h5{font-family: var(--fu); font-weight: 600; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; margin: 18px 0 8px; color: var(--ink)}
.bs-article h6{font-family: var(--fu); font-weight: 600; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; margin: 16px 0 6px; color: var(--t2l)}
.bs-article ul li::marker,.bs-article ol li::marker{color: var(--brand-orange)}
.bs-article hr{border: none; border-top: 1px solid var(--bone-3); margin: 48px 0}
.bs-article .table-wrap{overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 2em 0; border: 1px solid var(--bone-3); background: var(--paper)}
.bs-article img{max-width: 100%; height: auto}
/* Author block at end of content */
.bs-bio{max-width: 880px; margin: 80px auto 0}
.bs-bio-av{border: 2px solid var(--gold)}
.bs-bio .links a{color: var(--ember); text-decoration: none; border-bottom: 1px solid transparent; transition: border-color .25s}
  .bs-bio .links a:hover{border-color: var(--ember)}
  .bs-bio--noav{grid-template-columns: 1fr}
/* Inquiry band — relocated out of the article's side rail */
  .bs-inq{background: var(--ink); color: #fff; padding: 72px 0}
.bs-inq-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start}
.bs-inq-copy .eyebrow{color: var(--gold-lt); margin-bottom: 18px}
.bs-inq-copy h2{font-family: var(--fe); font-weight: 400; font-size: clamp(30px,3.4vw,44px); line-height: 1.15; letter-spacing: -.02em; margin-bottom: 18px}
.bs-inq-copy h2 em{font-style: italic; color: var(--gold-lt)}
.bs-inq-copy p{font-family: var(--fe); font-style: italic; color: rgba(244,239,230,.7); max-width: 40ch; line-height: 1.6}
/* the card sits on .bs-inq-form itself (.inq wrapper left the markup long ago and the form rendered bare on the band). Gold hairline frame, quiet paper tint — same hand as the newsletter letter-card. */
.bs-inq-form{background: rgba(255,255,255,.035); border: 1px solid rgba(214,185,126,.28); padding: 36px 34px 32px}
@media(max-width:760px){.bs-inq-form{padding: 24px 18px 22px}}
/* Related cards: fallback for posts without a featured image */
.rel-grid .rel-card .img--none{display: grid; place-items: center; background: var(--bone); border: 1px solid var(--bone-3)}
.rel-grid .rel-card .img--none .cat{position: static; font-family: var(--fu); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l)}
.rel-foot{margin-top: 48px; text-align: center}
@media(max-width:960px){
.bs-layout{grid-template-columns: 1fr}.toc {position: static}
.bs-inq-grid{grid-template-columns: 1fr; gap: 32px}
}

/* journal archive pagination (paginate_links output) */
.b-pag .page-numbers{font-family: var(--fu); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; padding: 12px 16px; border: 1px solid var(--bone-3); color: var(--t2l); text-decoration: none; background: transparent; cursor: pointer}
.b-pag .page-numbers:hover{color: var(--ink); border-color: var(--ink)}
.b-pag .page-numbers.current{background: var(--ink); color: #fff; border-color: var(--ink); cursor: default}
.b-pag .page-numbers.dots{background: transparent}

/* → — the newsletter as a letter-card: gold hairline frame, underline fields (same hand as the inquiry band), orange action. */
.news-form-wrap{max-width: 560px; margin-inline: auto; text-align: left; background: rgba(255,255,255,.035); border: 1px solid rgba(214,185,126,.28); padding: 34px 32px 30px}
@media(max-width:760px){.news-form-wrap{padding: 24px 18px 22px}}
.news-form-wrap .wpforms-container{margin: 0}
.news-form-wrap .wpforms-container .wpforms-field-label{font-family: var(--fu); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: rgba(244,239,230,.55); margin-bottom: 4px}
.news-form-wrap .wpforms-container .wpforms-field input[type=text],
.news-form-wrap .wpforms-container .wpforms-field input[type=email],
.news-form-wrap .wpforms-container .wpforms-field input[type=tel]{
  background: transparent; border: none; border-bottom: 1px solid rgba(255,255,255,.22); border-radius: 0;
  color: #fff; font-family: var(--fu); font-size: 15px; padding: 10px 0 12px; width: 100%;
  outline: none; transition: border-color .25s; box-shadow: none
}
.news-form-wrap .wpforms-container .wpforms-field input:focus{border-bottom-color: var(--gold-lt); outline: none}
.news-form-wrap .wpforms-container .wpforms-field input::placeholder{color: rgba(244,239,230,.35)}
.news-form-wrap .wpforms-submit-container{text-align: left; margin: 0; padding-top: 6px}
.news-form-wrap button[type=submit]{background: var(--brand-orange); color: #fff; border: none; padding: 15px 30px; font-family: var(--fu); font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; cursor: pointer; transition: background .25s; width: 100%}
.news-form-wrap button[type=submit]:hover{background: var(--brand-orange-dk)}
.news-form-wrap .wpforms-confirmation-container-full{background: transparent; border: 1px solid rgba(214,185,126,.4); padding: 20px; font-family: var(--fe); font-style: italic; font-size: 16px; color: #F4EFE6}

/* WPForms brand skin inside the journal inquiry band (scoped) */
.bs-inq-form .wpforms-container,.bs-inq-form .wpforms-container .wpforms-form{margin: 0; padding: 0}
.bs-inq-form .wpforms-field{margin: 0 0 18px; padding: 0}
.bs-inq-form .wpforms-field-label{display: block; font-family: var(--fu); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: rgba(244,239,230,.55); margin: 0 0 6px; font-weight: 500}
.bs-inq-form .wpforms-field .wpforms-required-label{color: var(--brand-orange)}
.bs-inq-form .wpforms-field input[type=text],
.bs-inq-form .wpforms-field input[type=email],
.bs-inq-form .wpforms-field input[type=tel],
.bs-inq-form .wpforms-field input[type=number],
.bs-inq-form .wpforms-field input[type=date],
.bs-inq-form .wpforms-field select,
.bs-inq-form .wpforms-field textarea{width: 100% !important; max-width: 100% !important; background: transparent !important; border: none !important; border-bottom: 1px solid rgba(255,255,255,.2) !important; border-radius: 0 !important; box-shadow: none !important; padding: 10px 0 12px !important; font-family: var(--fu) !important; font-size: 15px !important; color: #fff !important; outline: none !important; transition: border-color .25s}
.bs-inq-form .wpforms-field select option{background: #141b17; color: #fff}
.bs-inq-form .wpforms-field input:focus,.bs-inq-form .wpforms-field select:focus,.bs-inq-form .wpforms-field textarea:focus{border-bottom-color: var(--gold-lt) !important}
.bs-inq-form .wpforms-field input::placeholder,.bs-inq-form .wpforms-field textarea::placeholder{color: rgba(244,239,230,.35)}
.bs-inq-form .wpforms-field textarea{resize: vertical; min-height: 80px}
.bs-inq-form .wpforms-submit-container{padding: 0; margin-top: 16px}
.bs-inq-form button[type=submit],.bs-inq-form .wpforms-submit{background: var(--brand-orange) !important; color: #fff !important; border: none !important; border-radius: 0 !important; font-family: var(--fu) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .18em !important; text-transform: uppercase !important; padding: 16px 26px !important; transition: background .25s !important; box-shadow: none !important; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer}
.bs-inq-form button[type=submit]:hover,.bs-inq-form .wpforms-submit:hover{background: var(--brand-orange-dk) !important}
.bs-inq-form .wpforms-error{font-family: var(--fu) !important; font-size: 11px !important; color: #E2A093 !important; margin-top: 6px}
.bs-inq-form .wpforms-field.wpforms-has-error input,
.bs-inq-form .wpforms-field.wpforms-has-error textarea{border-bottom-color: var(--brand-orange) !important}
.bs-inq-form .wpforms-confirmation-container-full{background: transparent !important; border: 1px solid rgba(214,185,126,.4) !important; padding: 24px !important; font-family: var(--fe) !important; font-size: 17px !important; color: #F4EFE6 !important; font-style: italic}

  /* journal essay TOC: collapsible header + scrollable list. Distinct from the trip day-TOC (.toc-wrap .toc grid). */
  .bs-layout .toc{position: sticky; top: calc(var(--nav-h, 84px) + 26px); align-self: start; display: block; background: var(--paper); border: 1px solid var(--bone-3); margin-top: 8px; overflow: hidden}
  .toc-toggle{display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; background: transparent; border: none; border-bottom: 1px solid var(--bone-3); cursor: pointer; text-align: left}
  .toc-toggle-label{font-family: var(--fu); font-size: 10.5px; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: var(--ink)}
  .toc-caret{display: grid; place-items: center; width: 22px; height: 22px; color: var(--brand-orange); transition: transform .3s var(--ex)}
  .toc-caret i.ph{font-size: 16px; line-height: 1}
  .toc.closed .toc-caret{transform: rotate(-90deg)}
  .bs-layout .toc .toc-links{max-height: 340px; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 14px 12px 16px 18px}
  .bs-layout .toc .toc-links::-webkit-scrollbar{width: 6px}
  .bs-layout .toc .toc-links::-webkit-scrollbar-thumb{background: var(--bone-3); border-radius: 3px}
  .bs-layout .toc .toc-links::-webkit-scrollbar-track{background: var(--bone)}
  .bs-layout .toc.closed .toc-links{display: none}
  
  /* Mobile: TOC becomes a normal block above the article (still collapsible). */
  @media(max-width:960px){
  .bs-layout .toc{position: static; background: transparent; border: none; margin: 0 0 28px}
  .toc-toggle{background: var(--paper); border: 1px solid var(--bone-3); padding: 14px 16px}
  .bs-layout .toc .toc-links{max-height: none; padding: 12px 8px}
  }

/* ═══════ /100 — no stray whitespace under the footer ═══════ */
/* Sticky-footer guarantee: body is a flex column filling the full viewport
   height (html + body both 100%), the main region grows (flex:1) so the footer
   is always pinned to the bottom edge, and the footer never collapses. Clamps
   stop a light body-colour strip appearing below the footer on archive /
   taxonomy / category pages. */
html{height: 100%; min-height: 100%}
body{margin: 0; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column}
.site-main{flex: 1 0 auto; min-height: 0}
.footer{margin: 0; flex: 0 0 auto; position: relative}
.footer::after{content: ''; display: table; clear: both}

/* R106.12 — Admin-curated mega menu (Appearance → Menus)
   Panels now render from the menu tree; these rules add the
   new content shapes (2-col day-tour cards, flowing link lists,
   grouped column headings, desktop dropdown) on top of the
   existing .mega / .mega-col / .mega-list system. */

/* Column headings can link (style → archive, group → page) */
.mega-col h4 a{color:inherit;text-decoration:none;transition:color .3s var(--ex)}
.mega-col h4 a:hover{color:var(--brand-orange)}

/* "All …" affordance row inside mega columns */
.mega-list .mega-viewall{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:12px 8px;border-radius:2px;transition:background .3s var(--ex),padding .3s var(--ex)}
.mega-list .mega-viewall:hover{background:var(--bone-2);padding-left:14px}
.mega-list .mega-viewall .ico{width:32px;height:32px}
.mega-list .mega-viewall .txt{display:flex;flex-direction:column;gap:2px}
.mega-list .mega-viewall .title{font-family:var(--fu);font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ember)}
.mega-list .mega-viewall:hover .title{color:var(--brand-orange)}
.mega-list .mega-viewall .arrow{font-size:14px;color:var(--t3l);opacity:0;transform:translateX(-6px);transition:all .3s var(--ex)}
.mega-list .mega-viewall:hover .arrow{opacity:1;transform:translateX(0);color:var(--brand-orange)}
a.mega-viewall{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-family:var(--fu);font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ember)}
a.mega-viewall:hover{color:var(--brand-orange)}

/* Experiences — 2-column day-tour image cards */
.mega-col-cards{grid-column:1/-1}
.mega-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px 44px}
.mega-card{display:grid;grid-template-columns:120px 1fr auto;gap:16px;align-items:center;padding:10px 8px;border-radius:2px;transition:background .3s var(--ex),padding .3s var(--ex)}
.mega-card:hover{background:var(--bone-2);padding-left:14px}
.mega-card .thumb{width:120px;aspect-ratio:4/3;overflow:hidden;background:var(--bone-2)}
.mega-card .thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s var(--ex)}
.mega-card:hover .thumb img{transform:scale(1.05)}
.mega-card .txt{display:flex;flex-direction:column;gap:4px}
.mega-card .title{font-family:var(--fe);font-size:19px;font-weight:400;letter-spacing:-.01em;color:var(--t1l)}
.mega-card:hover .title{color:var(--ember)}
.mega-card .sub{font-size:12px;color:var(--t3l);letter-spacing:.02em}
.mega-card .arrow{font-size:14px;color:var(--t3l);opacity:0;transform:translateX(-6px);transition:all .3s var(--ex)}
.mega-card:hover .arrow{opacity:1;transform:translateX(0);color:var(--brand-orange)}

/* Links layout — wide two-column flow inside one heading */
.mega-col-span{grid-column:1/-1}
.mega-list-flow{display:grid;grid-template-columns:1fr 1fr;gap:2px 48px}

/* Desktop dropdown for simple 1–3 child items (not mega panels) */
.nav-menu-list>li.menu-item-has-children:not(.menu-item-has-mega){position:relative}
.nav-menu-list>li .sub-menu{position:absolute;top:calc(100% + 18px);left:-16px;min-width:230px;background:var(--paper);border:1px solid var(--bone-3);box-shadow:0 24px 48px -18px rgba(14,20,17,.28);padding:8px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .3s var(--ex),transform .3s var(--ex),visibility 0s linear .3s;z-index:191}
.nav-menu-list>li:hover>.sub-menu,.nav-menu-list>li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none;transition:opacity .3s var(--ex),transform .3s var(--ex),visibility 0s}
.nav-menu-list>li .sub-menu li{list-style:none}
.nav-menu-list>li .sub-menu a{display:block;padding:10px 12px !important;font-size:12px !important;letter-spacing:.1em !important;color:var(--t1l) !important;background:transparent;border-radius:2px}
.nav-menu-list>li .sub-menu a::after{display:none}
.nav-menu-list>li .sub-menu a:hover{background:var(--bone-2);color:var(--brand-orange) !important}

/* Mobile: "View all" + nested depth polish */
.mobile-nav .menu-item-viewall a{font-family:var(--fu) !important;font-size:12px !important;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-orange,#FF6701) !important}
.mobile-nav .sub-menu .sub-menu{margin:0 -20px;padding:4px 36px}
.mobile-nav .sub-menu .sub-menu a{font-size:14px !important;padding:10px 0}

/* Mega responsive: cards collapse on mid widths */
@media(max-width:1100px){
  .mega-cards{grid-template-columns:1fr}
  .mega-list-flow{grid-template-columns:1fr}
}

/* Ensure the mega anchors show the caret correctly */
.nav-link .caret{display:inline-block}

/* R106.13 — Journeys two-pane browser + all-device polish
   Left rail = style categories (click switches pane, never
   navigates). Right = that style's curated trips. First
   category shown by default. Tablet band turns the rail into
   horizontal chips; ≤820 keeps the drawer accordion. */

/* Panel scroll safety: tall trip lists stay usable, page behind stays put */
.mega{max-height:100svh;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--bone-3) transparent}
.mega::-webkit-scrollbar{width:8px}
.mega::-webkit-scrollbar-thumb{background:var(--bone-3)}

/* Split grid — rail | panes | (feature when present) */
.mega-split{grid-template-columns:minmax(240px,.95fr) 1.55fr}
.mega-split.has-feature{grid-template-columns:minmax(240px,.9fr) 1.5fr 1.3fr}
.mega-split .mega-feature{grid-column:auto}

/* Left rail */
.mega-rail-wrap{min-width:0;display:flex;flex-direction:column;gap:6px;border-right:1px solid var(--bone-3);padding-right:26px}
.mega-rail-label{font-family:var(--fu);font-size:11px;font-weight:500;letter-spacing:.32em;text-transform:uppercase;color:var(--brand-orange);padding-bottom:14px;border-bottom:1px solid var(--bone-3);margin-bottom:8px}
.mega-rail{display:flex;flex-direction:column;gap:3px}
.mega-rail-item{appearance:none;-webkit-appearance:none;background:transparent;border:0;text-align:left;display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;padding:12px 14px;min-height:48px;border-radius:2px;cursor:pointer;font-family:var(--fe);font-size:18.5px;font-weight:400;letter-spacing:-.01em;color:var(--t1l);box-shadow:inset 2px 0 0 transparent;transition:background .3s var(--ex),color .3s var(--ex),box-shadow .3s var(--ex),padding .3s var(--ex)}
.mega-rail-item:hover{background:var(--bone-2);padding-left:18px}
.mega-rail-item.is-active{background:var(--bone-2);box-shadow:inset 2px 0 0 var(--brand-orange);color:var(--ink)}
.mega-rail-item:focus-visible{outline:2px solid var(--brand-orange);outline-offset:2px}
.mega-rail-item .ri-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mega-rail-item .ri-n{font-family:var(--fd);font-size:11px;font-weight:500;color:var(--t3l);letter-spacing:.05em}
.mega-rail-item.is-active .ri-n{color:var(--ember)}

/* Right panes */
.mega-panes{min-width:0}
.mega-pane{display:none}
.mega-pane.is-active{display:block;animation:mpaneIn .45s var(--ex) both}
@keyframes mpaneIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.mega-pane[hidden]{display:none}
.mega-pane-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;padding-bottom:14px;border-bottom:1px solid var(--bone-3);margin-bottom:10px}
.mega-pane-head h4{font-family:var(--fe);font-size:24px;font-weight:400;letter-spacing:-.015em;color:var(--ink);margin:0}
.mega-pane-head a{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;font-family:var(--fu);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ember);transition:color .3s var(--ex)}
.mega-pane-head a:hover{color:var(--brand-orange)}
.mega-pane-head a i{transition:transform .3s var(--ex)}
.mega-pane-head a:hover i{transform:translateX(3px)}
.mega-pane .mega-cards{grid-template-columns:1fr;gap:4px 30px}
.mega-pane .mega-card{grid-template-columns:96px 1fr auto;padding:9px 6px;gap:16px}
.mega-pane .mega-card .thumb{width:96px}
.mega-pane .mega-card .title{font-size:17.5px}
.mega-pane .mega-card .sub{font-size:11.5px;letter-spacing:.05em;text-transform:uppercase}
.mega-pane .mega-list{gap:0}

/* Tablet band (821–1100): rail becomes horizontal chips above the pane */
@media(max-width:1100px){
  .mega-split,.mega-split.has-feature{grid-template-columns:1fr}
  .mega-rail-wrap{border-right:0;padding-right:0;border-bottom:1px solid var(--bone-3);padding-bottom:12px;gap:4px}
  .mega-rail-label{display:none}
  .mega-rail{flex-direction:row;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .mega-rail::-webkit-scrollbar{display:none}
  .mega-rail-item{white-space:nowrap;grid-template-columns:auto;padding:9px 16px;min-height:42px;font-size:15.5px;box-shadow:inset 0 -2px 0 transparent;border:1px solid var(--bone-3)}
  .mega-rail-item:hover{padding-left:16px}
  .mega-rail-item.is-active{box-shadow:inset 0 -2px 0 var(--brand-orange);border-color:var(--brand-orange)}
  .mega-split .mega-feature{grid-column:1/-1}
  .mega-split .feature-card{min-height:240px}
  .mega-pane .mega-cards{grid-template-columns:1fr 1fr}
}
@media(max-width:960px){
  .mega-pane .mega-cards{grid-template-columns:1fr}
  .mega-pane .mega-card{grid-template-columns:84px 1fr auto}
  .mega-pane .mega-card .thumb{width:84px}
}

/* Nav row breathing room on small laptops (mega stays active ≥821) */
@media(max-width:1000px) and (min-width:821px){
  .nav-menu-list{gap:18px !important}
  .nav-menu-list a{font-size:12px !important;letter-spacing:.1em !important}
  .nav-cta{padding:11px 18px !important;font-size:11px !important}
  .nav-links{gap:0}
}

/* Mobile drawer polish: smooth reveals, comfortable touch targets */
@media(max-width:820px){
  .mobile-nav .menu-item > a{min-height:52px;display:flex;align-items:center}
  .mobile-nav .menu-item-has-children.open > .sub-menu{animation:mopen .32s var(--ex) both}
  @keyframes mopen{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
  .mobile-nav .sub-menu .sub-menu{background:var(--bone-2)}
  .mobile-nav .menu-item-viewall{margin-top:4px}
}
@media(max-width:420px){
  .mega-pane-head h4{font-size:21px}
  .mega-pane .mega-card{grid-template-columns:72px 1fr auto}
  .mega-pane .mega-card .thumb{width:72px}
  .mega-pane .mega-card .title{font-size:16px}
}

/* B — menu item icons (auto by title/url, or thg-icon-<name> class) */
.nav-link > i.ph:not(.caret){font-size:14.5px;line-height:1;opacity:.9;transition:opacity .3s var(--ex),color .3s var(--ex)}
.nav-item:hover > .nav-link > i.ph:not(.caret),.nav-item.active > .nav-link > i.ph:not(.caret),.nav-item.current-menu-ancestor > .nav-link > i.ph:not(.caret){opacity:1;color:var(--brand-orange)}
.mega-rail-item .ri-title .rail-ic{margin-right:8px;vertical-align:-.08em;color:var(--brand-orange);opacity:.8;font-size:15px}
.mega-rail-item.is-active .ri-title .rail-ic,.mega-rail-item:hover .ri-title .rail-ic{opacity:1}

/* Destinations panel density + home hero breathing */
/* Regions panel: keep the two menu columns + feature side by side on mid screens by
   tightening type instead of letting the feature drop. */
@media(max-width:1560px) and (min-width:1101px){
  .mega-inner{font-size:13px}
  .mega-col h4{font-size:10px;letter-spacing:.26em;padding-bottom:11px;margin-bottom:13px}
  .mega-list a{padding:9px 6px;gap:10px}
  .mega-list .title{font-size:13.5px}
  .mega-list .sub{font-size:11px}
  .mega-feature h4{font-size:10px}
  .mega-feature .feature-body h3{font-size:19px}
  .mega-feature .feature-body .meta{font-size:12px}
  .mega-feature .feature-body .cta-line{font-size:12px}
}
/* Split browser rail tightens a touch too, so rail + pane + feature never crowd */
@media(max-width:1360px) and (min-width:1101px){
  .mega-rail-item{padding:10px 12px;font-size:16.5px;min-height:44px}
  .mega-pane-head h4{font-size:22px}
  .mega-pane .mega-card .title{font-size:16px}
}

/* Home hero: more air between the fixed header and the eyebrow on every band,
   and let the hero grow instead of clipping its end (marquee / signature card). */
.home .thg-home-hero{height:auto !important;min-height:100vh !important}
.home .thg-home-hero-body{min-height:0 !important;flex:1 1 auto !important;padding-top:186px !important;padding-bottom:26px !important}
.home .thg-home-hero-eyebrow{margin-bottom:38px !important}
.home .thg-home-hero-marquee{margin-top:30px !important}
.home .thg-home-hero-rail{padding:150px 0 128px !important}
@media(max-width:1700px){.home .thg-home-hero-body{padding-top:172px !important}}
@media(max-width:1440px){.home .thg-home-hero-body{padding-top:164px !important;padding-bottom:34px !important}}
@media(max-width:1100px){.home .thg-home-hero-body{padding-top:150px !important}.home .thg-home-hero-rail{padding:126px 0 120px !important}}
@media(max-width:760px){.home .thg-home-hero{min-height:0 !important}.home .thg-home-hero-body{padding-top:134px !important;padding-bottom:40px !important}}
@media(max-width:640px){.home .thg-home-hero-body{padding-top:126px !important;padding-bottom:34px !important}.home .thg-home-hero-eyebrow{margin-bottom:30px !important}}

/* Journal cards, footer social/credits/menu, 320px sweep */
/* Journal cards: the WHOLE card is the link (title anchor stretched over the
   card). Hover used a flat #fff fill with zero inner padding — replaced by a
   lifted paper panel with real inset spacing and a hairline gold ring. */
.thg-home-journal .journal-grid{gap:clamp(16px,2vw,32px)}
.thg-home-journal .jl-card{position:relative;background:var(--paper)}
/* hover: the image zooms, the card itself stays put (no box-shadow, no lift). */
.thg-home-journal .jl-card:hover{background:var(--paper);box-shadow:none;transform:none}
.thg-home-journal .jl-card:hover .jl-img > div{transform:scale(1.05)}
.thg-home-journal .jl-card > :not(.jl-img){padding-left:24px;padding-right:24px}
.thg-home-journal .jl-meta{padding-top:18px;padding-bottom:0}
.thg-home-journal .jl-title{padding-top:8px;padding-bottom:2px}
.thg-home-journal .jl-ex{padding-top:6px}
.thg-home-journal .jl-read{padding:14px 24px 22px}
.thg-home-journal .jl-title a::after{content:'';position:absolute;inset:0;z-index:2}
.thg-home-journal .jl-read{pointer-events:none}
@media(max-width:700px){
  .thg-home-journal .journal-grid{gap:18px}
  .thg-home-journal .jl-card > :not(.jl-img){padding-left:18px;padding-right:18px}
}

/* Footer: even rhythm inside columns (kill margin+gap doubling) */
.foot-col .foot-menu{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:13px}
.foot-col .foot-menu li{margin-bottom:0 !important}
.foot-col .foot-menu a{display:inline-block}
.foot-main{column-gap:clamp(28px,4vw,64px);row-gap:44px}

/* Social: fixed round chips, brand icon centred, warm hover */
.foot-soc{gap:12px;margin-bottom:26px}
.fsoc{width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);border-radius:50%;color:rgba(244,239,230,.72);font-size:17px;line-height:1;transition:color .25s,border-color .25s,transform .25s var(--ex);background:transparent;text-decoration:none}
.fsoc i{font-size:17px;line-height:1;display:block}
.fsoc:hover{color:#0E1411;background:var(--brand-orange,#FF6701);border-color:var(--brand-orange,#FF6701);transform:translateY(-2px)}

/* Credit logos (ACF repeater): plate-mounted, desaturated, colour on hover */
.foot-cred{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:4px}
.fcred{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:rgba(255,255,255,.035);transition:border-color .25s,background .25s;box-shadow:none}
.fcred img{height:30px;width:auto;max-width:132px;display:block;object-fit:contain;filter:none;opacity:.92;transition:opacity .3s}
.fcred:hover{background:rgba(255,255,255,.07);border-color:rgba(214,185,126,.45)}
.fcred:hover img{opacity:1}
a.fcred{cursor:pointer}

/* Footer bottom: copyright · legal · dev credit wrap with a comfortable gap */
.foot-bottom{gap:14px 30px;align-items:center}
.foot-bottom .legal{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center}
.foot-bottom .legal .legal-menu{display:contents}
.foot-madeby{margin-left:auto;font-size:11.5px;letter-spacing:.06em;color:rgba(244,239,230,.42)}
.foot-madeby a{color:rgba(244,239,230,.72);border-bottom:1px solid rgba(255,103,1,.5);padding-bottom:1px;transition:color .25s,border-color .25s}
.foot-madeby a:hover{color:#FF6701;border-color:#FF6701}
.foot-madeby strong{font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:10.5px}
@media(max-width:700px){
  .foot-bottom{flex-direction:column;text-align:center;gap:12px}
  .foot-madeby{margin-left:0}
  .fcred img{height:26px;max-width:112px}
}

/* 320px floor sweep — keep every home section inside the viewport */
@media(max-width:360px){
  html,body{overflow-x:clip}
  .container{padding-left:16px;padding-right:16px}
  .home .thg-home-hero-body{padding:104px 16px 30px !important}
  .home .thg-home-hero-title{font-size:clamp(1.85rem,8.6vw,2.3rem) !important}
  .thg-home-hero-eyebrow{font-size:9.5px !important;letter-spacing:.28em !important;gap:10px !important}
  .thg-home-hero-eyebrow::before{width:24px}
  .thg-home-hero-marquee,.home .thg-home-hero-marquee{padding-left:16px !important;padding-right:16px !important}
  .thg-home-hmq{padding:0 12px !important}
  .thg-home-hmq-n{font-size:1.9rem !important}
  .home .journal-grid,.home .journey-grid,.home .moments-grid{gap:14px !important}
  .home .jl-title{font-size:17px !important}
  .foot-main{gap:32px}
  .foot-name{font-size:19px !important}
  .fsoc{width:38px;height:38px}
  .btn{padding:12px 20px;font-size:12px}
}

/* Journal side cards hug their content; legal links styling */
/* The grid row stretched cards 2–3 to the featured card's height, leaving blank
   space under their text. Cards now take exactly the height their content needs. */
.thg-home-journal .journal-grid{align-items:start}
.thg-home-journal .jl-card:not(.feat){margin-bottom:0}
/* Footer legal links (Privacy · Terms · Booking Conditions) */
.foot-bottom .legal a{color:rgba(244,239,230,.55);transition:color .25s;border-bottom:1px solid transparent;padding-bottom:1px}
.foot-bottom .legal a:hover{color:#fff;border-bottom-color:rgba(255,103,1,.55)}

/* Mobile header fix, drawer behaviour, home hover language */
/* Mobile: the wide header CTA was squeezing the hamburger off-screen (≤820).
   The CTA now lives inside the drawer itself (same admin Header Settings CTA),
   so the header keeps only logo + toggle. */
@media(max-width:820px){
  .nav .nav-actions .nav-cta{display:none !important}
  .nav-actions{margin-left:auto !important}
  .nav-toggle{display:inline-block !important;flex:0 0 auto}
}

/* Drawer rows: text-only (auto icons are a desktop/rail feature), brand-orange
   +/× marker with a clear open state; the 'All X →' row navigates. */
.mobile-nav .menu-item-viewall a i{display:inline-block;font-size:12px;transition:transform .3s var(--ex)}
.mobile-nav .menu-item-viewall a:hover i{transform:translateX(4px)}
.mobile-nav i.ph{display:none} /* no icons inside the mobile drawer, all levels */
.mobile-nav img{display:none}  /* no images inside the mobile drawer */

/* Home cards — the design-template hover language, applied uniformly:
   gentle lift, image zoom, arrow chip flips to brand orange and rotates 45°,
   titles warm toward gold/ember. Simple, quiet, on-brand. */
.home .jcard{transition:transform .5s var(--ex),box-shadow .5s var(--ex)}
.home .jcard:hover{transform:translateY(-6px);box-shadow:0 26px 48px -26px rgba(14,20,17,.50)}
.home .jcard:hover .jcard-cta{background:var(--brand-orange,#FF6701);color:#0E1411;transform:rotate(-45deg)}
.home .jcard:hover .jcard-name{color:var(--home-gold-lt,#D6B97E)}
.home .jcard-name{transition:color .3s}
.home .moment{transition:transform .5s var(--ex),box-shadow .5s var(--ex)}
.home .moment:hover{transform:translateY(-5px);box-shadow:0 22px 40px -24px rgba(14,20,17,.28)}
.home .moment-arr{transition:all .35s var(--ex)}
.home .moment:hover .moment-arr{background:var(--brand-orange,#FF6701);border-color:var(--brand-orange,#FF6701);color:#0E1411;transform:rotate(-45deg)}
.home .region{transition:transform .5s var(--ex),box-shadow .5s var(--ex)}
.home .region:hover{transform:translateY(-5px);box-shadow:0 24px 44px -24px rgba(14,20,17,.45)}
.home .region-arr{transition:all .35s var(--ex)}
.home .region:hover .region-arr{background:var(--brand-orange,#FF6701);border-color:var(--brand-orange,#FF6701);color:#0E1411;transform:rotate(-45deg)}
/* Hero signature list rows */
.thg-home-signature .thg-home-sig-item{transition:transform .3s var(--ex)}
.thg-home-signature .thg-home-sig-item:hover{transform:translateX(5px)}
.thg-home-sig-item:hover .thg-home-sig-no{color:var(--home-gold-lt,#D6B97E)}
.thg-home-sig-no{transition:color .3s}
.thg-home-sig-arr{transition:all .35s var(--ex)}
.thg-home-sig-item:hover .thg-home-sig-arr{background:var(--brand-orange,#FF6701);border-color:var(--brand-orange,#FF6701);color:#0E1411 !important;transform:rotate(-45deg)}
/* Section 'all' links: arrow nudge (template already widens the gap) */
.home .link-arrow:hover{color:var(--brand-orange,#FF6701);border-bottom-color:var(--brand-orange,#FF6701)}
/* Buttons: arrow travels, no bounce drama */
.btn .arr,.btn i.ph-arrow-right,nav .nav-cta i{transition:transform .3s var(--ex)}
.btn:hover .arr{transform:translateX(4px)}
.btn-fill-sm:hover i{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){
  .home .jcard:hover,.home .moment:hover,.home .region:hover,.thg-home-signature .thg-home-sig-item:hover{transform:none}
  .home .jcard:hover .jcard-cta,.home .moment:hover .moment-arr,.home .region:hover .region-arr,.thg-home-sig-item:hover .thg-home-sig-arr{transform:none}
}
@media(max-width:820px){
  .home .jcard:hover,.home .moment:hover,.home .region:hover{transform:none;box-shadow:none}
}

/* Drawer brand readable + accordion spacing states */
/* Drawer head: the light panel needs the INK wordmark (the white treatment
   exists for the dark hero header) and a compact lockup. */
.mobile-menu .site-logo__text{color:var(--ink) !important;font-size:12px !important}
.mobile-menu .site-logo__icon,.mobile-menu .site-logo__icon img{width:42px !important;height:42px !important}
.mobile-menu .site-logo__text small{color:rgba(14,20,17,.55) !important}
/* Nested rows: same language, lighter scale — comfortable tap rhythm */
.mobile-nav .sub-menu .menu-item > a{padding:13px 0}
.mobile-nav .sub-menu .sub-menu .menu-item > a{padding:11px 0}
.mobile-nav .sub-menu .menu-item-has-children > a::after{font-size:16px}
.mobile-nav .sub-menu .menu-item-has-children > a{font-size:16px}
.mobile-nav .sub-menu .sub-menu .menu-item > a{font-size:14px}
/* Open parent label gets quiet emphasis (no colour storm) */
.mobile-nav .menu-item-has-children.open > a{color:var(--ink)}
/* List hygiene inside the drawer */
.mobile-menu ul{margin:0}
/* Drawer CTA keeps breathing room from the last menu row */
.mobile-menu__cta{padding-top:22px;margin-top:2px}

/* Departure price line · honest form states · ctx fields */
/* Price on departure cards/rows: gold on the dark trip-page card, ember on the
   light subpage rows. "From" prefix only when it is the trip-level fallback. */
.dep-price{color:var(--gold-lt,#D6B97E);font-weight:600;font-style:normal;white-space:nowrap}
.dep .dep-year .dep-price em{font-style:italic;opacity:.75;font-weight:400}
.dep-row .dep-price{color:var(--ember)}
section#scheduled .dep-row .dep-date .dep-price{color:var(--ember) !important;font-weight:600 !important}
/* CTA band without a connected form: contacts take the full band. */
.cta-grid.cta-grid--solo{grid-template-columns:1fr}
.cta-grid.cta-grid--solo .cta-contacts{max-width:760px}
/* WPForms context fields: hidden on the front end, intact in entries/emails. */
.wpforms-field[class*="thg-ctx-"],.wpforms-field.thg-ctx-trip-title,.wpforms-field.thg-ctx-trip-id,
.wpforms-field.thg-ctx-departure,.wpforms-field.thg-ctx-price,.wpforms-field.thg-ctx-source,
.wpforms-field.thg-ctx-intent,.wpforms-field.thg-ctx-subpage{display:none !important}
/* Honest hold panel (Cost & Dates subpage) until a form is wired. */
.private-hold{background:var(--paper);border:1px dashed rgba(14,20,17,.2);padding:30px 28px;border-radius:2px}
.private-hold h4{font-family:var(--fe);font-style:italic;font-size:22px;font-weight:400;color:var(--ink);margin:0 0 10px}
.private-hold p{font-family:var(--fu);font-size:13px;line-height:1.65;color:var(--t3l);margin:0 0 20px}
.private-hold .ph-hold-links{display:flex;flex-wrap:wrap;gap:10px}
.private-hold .ph-hold-links a{display:inline-flex;align-items:center;gap:8px;font-family:var(--fu);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;padding:12px 16px;border:1px solid rgba(14,20,17,.18);color:var(--ink);text-decoration:none;transition:all .25s var(--ex)}
.private-hold .ph-hold-links a:hover{border-color:var(--brand-orange,#FF6701);color:var(--brand-orange,#FF6701)}
@media(max-width:560px){
  .dep .dep-year .dep-price{display:block;margin-top:4px}
  .private-hold{padding:22px 18px}
}

/* Long section notes stack · tables scroll · safe heroes */
/* Long ACF descriptions fight the title across from them: >40 words flips the head to a single-column intro (title, then a readable 64ch note). Short notes keep the editorial two-column exactly as designed. */
.sec-head--intro{grid-template-columns:1fr; gap:14px; align-items:start}
.sec-head--intro .right{align-items:flex-start}
.sec-head--intro .right p{max-width:64ch; text-align:left; font-size:16px; line-height:1.7}
.sec-head .right p,.sec-h{overflow-wrap:break-word}
/* Pricing matrix on narrow screens: scroll inside its bracketed frame instead
   of blowing out the viewport. */
@media(max-width:900px){
  .matrix-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch}
  .matrix{min-width:600px}
}
/* Subnav: no squished tabs, comfortable edge, momentum scroll. */
.subnav-row{-webkit-overflow-scrolling:touch; padding-right:20px}
.subnav-row > *{flex:0 0 auto}
@media(max-width:640px){
  .season-pills button{min-height:44px}
  .glance{padding:28px 22px}
}
/* Booking/Reserve page-hero keeps brand depth when no image is configured. */

/* CTA integrity · section-head system · departure price UI ·
   inline private dep· form system (WPForms restyled, light + dark) */

/* 1 — HERO GLANCE CTAS The inline styles that do this were removed with the CTA rewrite; these are the real rules: one stacked pair, both full width.
--------------------------------------------------------------------------- */
.glance-ctas{display:flex; flex-direction:column; gap:12px; margin-top:22px}
.glance-ctas .btn{width:100%; justify-content:center; text-align:center}
.glance-ctas .btn-line-light{width:100%; justify-content:center}
@media(max-width:640px){
  .glance-ctas{margin-top:18px}
  .glance-ctas .btn{min-height:48px; padding:14px 20px}
}

/* ---------------------------------------------------------------------------
   2 — SECTION HEAD SYSTEM
   Every editorial head reads the same: serif title (em = italic accent) with
   an optional note beside it on desktop, note below on narrow screens or when
   the note runs long (thg_sec_head_mod adds .sec-head--intro past 40 words).
   The bugs this replaces: <h2> kept its UA margins while the same class on a
   <div> had none (so heads sat at different heights), em inherited the wrong
   colour on dark sections, and long notes were squeezed into a 440px column.
--------------------------------------------------------------------------- */
.sec-head{display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); gap:26px 64px; align-items:end; margin-bottom:56px; min-width:0}
.sec-head .right{display:flex; flex-direction:column; align-items:flex-start; gap:16px; min-width:0}
.sec-h{margin:0; min-width:0; max-width:26ch;
  font-family:var(--fe); font-weight:300; font-style:normal;
  font-size:clamp(2.15rem,3.8vw,3.25rem); line-height:1.06; letter-spacing:-.02em;
  color:var(--ink); text-wrap:balance; overflow-wrap:break-word; hyphens:auto;
  font-variation-settings:"opsz" 144}
.sec-h em{font-style:italic; font-weight:300; color:var(--ember); font-variation-settings:"opsz" 144}.dark .sec-h {color:#fff}.dark .sec-h em {color:var(--gold-lt)}
.sec-head .right p{font-family:var(--fe); font-style:italic; font-weight:300; font-size:16.5px; line-height:1.68; color:var(--t2l); max-width:46ch; text-align:left; margin:0; overflow-wrap:break-word}
.dark .sec-head .right p{color:var(--t2d)}
/* Long note → title first, then a comfortable reading measure. */
.sec-head--intro{grid-template-columns:minmax(0,1fr); gap:16px; align-items:start}
.sec-head--intro .sec-h{max-width:30ch}
.sec-head--intro .right p{max-width:64ch; font-size:16px; line-height:1.72}
@media(max-width:900px){
  .sec-head{grid-template-columns:minmax(0,1fr); gap:18px; align-items:start; margin-bottom:42px}
  .sec-head .right p{max-width:60ch}
}
@media(max-width:640px){
  .sec-h{font-size:clamp(1.8rem,7.6vw,2.35rem); line-height:1.1; max-width:none}
  .sec-head{margin-bottom:34px}
}
/* Subpage heads (Cost & Dates, Inclusions …) — same voice as the trip page. */
.cost-sub .cost-sec-head, section.policy .cost-sec-head{display:block !important; max-width:none !important; margin-bottom:40px !important}
.cost-sub .cost-sec-h, section.policy .cost-sec-head .cost-sec-h{
  font-family:var(--fe) !important; font-weight:300 !important;
  font-size:clamp(2.15rem,3.8vw,3.25rem) !important; line-height:1.06 !important;
  letter-spacing:-.02em !important; margin:0 0 18px 0 !important;
  text-wrap:balance; overflow-wrap:break-word; max-width:26ch !important}
.cost-sub .cost-sec-h em, section.policy .cost-sec-head .cost-sec-h em{font-style:italic !important; font-weight:300 !important}
.cost-sub .cost-sec-desc, .cost-sub .cost-sec-desc p,
.cost-sub .cost-fixed-intro, .cost-sub .cost-fixed-intro p{
  font-family:var(--fe) !important; font-style:italic !important; font-weight:300 !important;
  font-size:16.5px !important; line-height:1.7 !important; color:var(--t2l) !important;
  max-width:none !important; margin:0 0 14px 0 !important}
.cost-sub.sec.dark .cost-sec-desc, .cost-sub.sec.dark .cost-sec-desc p,
.cost-sub.sec.dark .cost-fixed-intro, .cost-sub.sec.dark .cost-fixed-intro p{color:var(--t2d) !important}
@media(max-width:640px){
  .cost-sub .cost-sec-h, section.policy .cost-sec-head .cost-sec-h{font-size:clamp(1.8rem,7.6vw,2.35rem) !important; max-width:none !important}
}

/* ---------------------------------------------------------------------------
   3 — FIXED-DEPARTURE CARD  (trip page, dark #cost)
   Price gets its own line with a label and a real "per person" unit instead of
   being tacked onto the italic year line; the CTA becomes a full-width button
   pinned to the card foot so every card in the row lines up.
--------------------------------------------------------------------------- */
#cost .deps{align-items:stretch !important}
#cost .dep{display:flex !important; flex-direction:column !important; align-items:stretch !important; height:100%; transition:transform .35s var(--ex), background .3s, border-color .3s}
#cost .dep:hover{transform:translateY(-3px)}
#cost .dep .dep-month{margin-bottom:10px !important}
#cost .dep .dep-date{font-size:30px !important; margin-bottom:6px !important; letter-spacing:-.01em !important}
#cost .dep .dep-year{margin-bottom:0 !important}
#cost .dep .dep-dur{font-style:normal !important; font-family:var(--fu) !important; font-size:11px !important; letter-spacing:.12em !important; text-transform:uppercase !important; opacity:.75}
#cost .dep .dep-price-line{display:flex !important; align-items:baseline !important; gap:9px !important; flex-wrap:wrap !important; margin-top:18px !important; padding-top:16px !important; border-top:1px solid rgba(255,255,255,.12) !important}
.dp-from{font-family:var(--fu); font-size:10px; font-weight:500; letter-spacing:.24em; text-transform:uppercase; color:rgba(244,239,230,.55)}
.dp-amt{font-family:var(--fe); font-size:27px; font-weight:400; line-height:1; color:#fff; font-variant-numeric:tabular-nums; letter-spacing:-.01em}
.dp-amt sup{font-size:.48em; top:-.72em; margin-right:1px; color:var(--gold-lt); font-style:italic}
.dp-per{font-family:var(--fu); font-size:11px; letter-spacing:.04em; color:rgba(244,239,230,.6)}
#cost .dep .dep-avail{margin:22px 0 0 0 !important; padding-top:18px !important; border-top:1px dashed rgba(255,255,255,.12) !important; flex-wrap:wrap !important}
#cost .dep .dep-cta{margin-top:auto !important; width:100% !important; justify-content:space-between !important; align-items:center !important; padding:14px 16px !important; gap:10px !important; border:1px solid rgba(184,68,42,.75) !important; border-bottom:1px solid rgba(184,68,42,.75) !important; background:rgba(184,68,42,.08) !important; color:#fff !important; letter-spacing:.2em !important}
#cost .dep .dep-cta:hover{background:var(--ember) !important; border-color:var(--ember) !important; color:#fff !important; gap:14px !important}
#cost .dep.sold .dep-cta{border-color:rgba(244,239,230,.25) !important; background:transparent !important; color:rgba(244,239,230,.7) !important}
#cost .dep.sold .dep-cta:hover{background:rgba(244,239,230,.08) !important; border-color:var(--gold-lt) !important; color:#fff !important}
#cost .dep.sold .dep-price-line{opacity:.6}
/* Empty ACF price → the line simply isn't rendered (no placeholder, no "on request"). */
@media(max-width:1000px){#cost .dep .dep-date{font-size:27px !important}}
@media(max-width:640px){
  #cost .dep .dep-date{font-size:25px !important}
  #cost .dep .dep-cta{min-height:48px !important}
  .dp-amt{font-size:25px}
}
/* Light-card variant (if a card grid is ever rendered in a light section). */
section#scheduled .dep{display:flex !important; flex-direction:column !important; height:100%}
section#scheduled .dep .dep-price-line{display:flex !important; align-items:baseline !important; gap:9px !important; flex-wrap:wrap !important; margin-top:18px !important; padding-top:16px !important; border-top:1px solid var(--bone-3) !important}
section#scheduled .dep .dp-from{color:var(--t3l)}
section#scheduled .dep .dp-amt{color:var(--ink)}
section#scheduled .dep .dp-amt sup{color:var(--ember)}
section#scheduled .dep .dp-per{color:var(--t2l)}
section#scheduled .dep .dep-cta{margin-top:auto !important; width:100% !important; justify-content:space-between !important; padding:14px 16px !important; border:1px solid rgba(184,68,42,.6) !important; background:rgba(184,68,42,.05) !important; color:var(--ember) !important}
section#scheduled .dep .dep-cta:hover{background:var(--ember) !important; color:#fff !important}

/* 4 — DEPARTURE ROW (Cost & Dates subpage, light) a 5-column grid for 4 in-flow children (the price was squeezed into the 10.5px caps meta line, so the date column collapsed and text stacked), plus a status pill positioned outside the row. Now: Dep · dates (+status) · price · availability · Reserve — five columns, five children, nothing absolute.
--------------------------------------------------------------------------- */
.dep-list{border-top:1px solid var(--bone-3)}
:is(section#scheduled,.cost-sub) .dep-row{
  display:grid !important; position:relative !important;
  grid-template-columns:76px minmax(0,1.15fr) 186px minmax(0,190px) 168px !important;
  gap:20px 30px !important; align-items:center !important;
  padding:28px 8px !important; border-bottom:1px solid var(--bone-3) !important;
  background:transparent !important;
  transition:background .25s !important; opacity:1}
:is(section#scheduled,.cost-sub) .dep-row:hover{background:rgba(184,68,42,.04) !important}
:is(section#scheduled,.cost-sub) .dep-row.sold{opacity:.62 !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-num{
  font-family:var(--fe) !important; font-style:italic !important; font-size:13px !important;
  color:var(--ember) !important; letter-spacing:.02em !important; margin:0 !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-num b{
  display:block !important; font-family:var(--fd) !important; font-style:normal !important;
  font-size:26px !important; font-weight:500 !important; color:var(--ink) !important;
  margin:2px 0 0 0 !important; letter-spacing:-.01em !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-date{
  font-family:var(--fe) !important; font-size:22px !important; font-weight:400 !important;
  color:var(--ink) !important; line-height:1.2 !important; margin:0 !important; letter-spacing:-.01em !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-date em{font-style:italic !important; color:var(--ember) !important; margin:0 .12em !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-date .dep-meta,
:is(section#scheduled,.cost-sub) .dep-row .dep-date span{
  display:flex !important; flex-wrap:wrap !important; align-items:center !important; gap:8px 12px !important;
  font-family:var(--fu) !important; font-style:normal !important; font-size:10.5px !important;
  font-weight:500 !important; letter-spacing:.2em !important; text-transform:uppercase !important;
  color:var(--t3l) !important; margin:10px 0 0 0 !important; line-height:1.5 !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-status{
  position:static !important; display:inline-flex !important; align-items:center !important;
  top:auto !important; right:auto !important; width:auto !important; font-family:var(--fu) !important;
  font-size:9.5px !important; letter-spacing:.2em !important; line-height:1.4 !important;
  padding:4px 9px !important; margin:0 !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-status.open{color:var(--moss) !important; border:1px solid var(--moss) !important; background:transparent !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-status.filling{color:var(--ember) !important; border:1px solid var(--ember) !important; background:rgba(184,68,42,.08) !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-status.sold{color:var(--t3l) !important; border:1px solid var(--bone-3) !important; background:transparent !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-price{
  display:flex !important; flex-direction:column !important; gap:4px !important;
  align-items:flex-start !important; min-width:0 !important; margin:0 !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-price .dp-from{color:var(--t3l) !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-price .dp-amt{font-size:26px !important; color:var(--ink) !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-price .dp-amt sup{font-size:.5em !important; color:var(--ember) !important; font-style:italic !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-price .dp-per{font-size:10.5px !important; letter-spacing:.16em !important; text-transform:uppercase !important; color:var(--t3l) !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-price--none{min-height:1px !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-avail{
  display:flex !important; flex-direction:column !important; align-items:flex-start !important;
  gap:8px !important; margin:0 !important; padding:0 !important; border-top:0 !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-avail .dots{display:flex !important; gap:5px !important; flex-direction:row !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-avail .d{width:9px !important; height:9px !important; background:var(--ember) !important; border-radius:50% !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-avail .d.empty{background:var(--bone-3) !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-avail .txt{
  margin:0 !important; font-family:var(--fu) !important; font-size:10.5px !important;
  letter-spacing:.16em !important; text-transform:uppercase !important; color:var(--t2l) !important; line-height:1.5 !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-cta{justify-self:end !important; display:block !important; min-width:0 !important; margin:0 !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-cta a{
  display:inline-flex !important; align-items:center !important; justify-content:space-between !important; gap:8px !important;
  width:100% !important; font-family:var(--fu) !important; font-size:11px !important; font-weight:500 !important;
  letter-spacing:.18em !important; text-transform:uppercase !important; color:var(--ember) !important;
  padding:13px 15px !important; border:1px solid rgba(184,68,42,.6) !important; background:rgba(184,68,42,.04) !important;
  text-decoration:none !important; transition:background .25s, color .25s, gap .25s !important}
:is(section#scheduled,.cost-sub) .dep-row .dep-cta a:hover{background:var(--ember) !important; color:#fff !important; border-color:var(--ember) !important; gap:12px !important}
:is(section#scheduled,.cost-sub) .dep-row.sold .dep-price,
:is(section#scheduled,.cost-sub) .dep-row.sold .dep-num{opacity:.6 !important}
:is(section#scheduled,.cost-sub) .dep-row.sold .dep-cta a{color:var(--t2l) !important; border-color:var(--bone-3) !important; background:transparent !important}
:is(section#scheduled,.cost-sub) .dep-row.sold .dep-cta a:hover{background:var(--bone) !important; color:var(--ink) !important}
@media(max-width:1180px){
  /* Three columns, every cell placed by hand — five cells, no implicit wrapping. */
  :is(section#scheduled,.cost-sub) .dep-row{grid-template-columns:68px minmax(0,1fr) 190px !important; gap:18px 24px !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-num{grid-column:1 !important; grid-row:1 / span 2 !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-date{grid-column:2 !important; grid-row:1 !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-price{grid-column:2 !important; grid-row:2 !important;
    flex-direction:row !important; flex-wrap:wrap !important; align-items:baseline !important; gap:8px !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-avail{grid-column:3 !important; grid-row:1 !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-cta{grid-column:3 !important; grid-row:2 !important; justify-self:stretch !important}
}
@media(max-width:820px){
  :is(section#scheduled,.cost-sub) .dep-row{grid-template-columns:56px minmax(0,1fr) !important; gap:14px 18px !important; padding:24px 6px !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-num{grid-column:1 !important; grid-row:1 / span 4 !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-date{grid-column:2 !important; grid-row:1 !important; font-size:20px !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-price{grid-column:2 !important; grid-row:2 !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-avail{grid-column:2 !important; grid-row:3 !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-cta{grid-column:2 !important; grid-row:4 !important; justify-self:stretch !important}
  :is(section#scheduled,.cost-sub) .dep-row .dep-cta a{justify-content:center !important; min-height:48px !important}
}
/* ---------------------------------------------------------------------------
   5 — PRIVATE DEPARTURE, INLINE  (trip page Cost → Private tab)
   Editorial column + the real form side by side. No "jump to the subpage":
   every trip page can now hold a private departure, whether or not a
   Cost & Dates subpage exists for it.
--------------------------------------------------------------------------- */
#cost .private--panel{gap:56px !important; align-items:start !important}
#cost .private--panel .private-intro{min-width:0}
#cost .private--panel .private-intro .eyebrow{color:var(--gold-lt) !important; margin-bottom:16px}
#cost .private-price{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap;
  margin-top:26px; padding-top:22px; border-top:1px solid rgba(255,255,255,.12)}
#cost .private-price .dp-from{color:rgba(244,239,230,.55)}
#cost .private-price .dp-amt{font-family:var(--fd); font-weight:500; font-size:clamp(2rem,3.4vw,2.75rem); color:#fff}
#cost .private-price .dp-amt sup{font-size:.42em; color:var(--gold-lt)}
#cost .private-price .dp-per{font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:rgba(244,239,230,.6)}
.private-form-col{min-width:0; display:flex; flex-direction:column; justify-content:flex-start}
.private-grid .right{min-width:0}
@media(max-width:1000px){
  #cost .private--panel{grid-template-columns:1fr !important; gap:36px !important}
}

/* ---------------------------------------------------------------------------
   6 — FORM SYSTEM
   One designed skin for every WPForms instance, in light and dark contexts.
   The plugin's own grey inputs and orange button never surface again, and no
   context (Reserve, Booking, contact, CTA band, inquiry dialog, post content)
   is left on the default skin.
--------------------------------------------------------------------------- */
/* 6a — shells -------------------------------------------------------------- */
.form-page{max-width:880px; margin:0 auto; padding:64px 20px 88px}
.form-page-foot{margin-top:34px; text-align:center}
.form-page-foot .link-arrow{display:inline-flex; align-items:center; gap:10px}
.thg-form-card{position:relative; background:var(--paper); border:1px solid var(--bone-3);
  padding:clamp(22px,3.4vw,44px)}
.thg-form-card::before{content:''; position:absolute; top:0; left:0; bottom:0; width:3px;
  background:linear-gradient(180deg,var(--gold),rgba(182,150,88,0))}
.thg-form-card--dark{background:rgba(14,20,17,.62); border-color:rgba(255,255,255,.1); color:var(--t1d)}
.thg-form-card--dark::before{background:linear-gradient(180deg,var(--gold-lt),rgba(214,185,126,0))}
.thg-form-head{margin-bottom:26px}
.thg-form-head .eyebrow{color:var(--gold-lt) !important; margin-bottom:12px}
.thg-form-head h4{font-family:var(--fe); font-style:italic; font-weight:400; font-size:20px; color:var(--gold-lt); margin:0; line-height:1.3}
.thg-form-h{font-family:var(--fe); font-weight:300; font-size:clamp(1.55rem,2.4vw,2rem); line-height:1.1; color:var(--ink); margin:0}
.thg-form-empty p{font-family:var(--fu); font-size:14.5px; line-height:1.75; color:var(--t2l); margin:0 0 14px}
.thg-form-card--dark .thg-form-empty p{color:var(--t2d)}
.ph-hold-links{display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:18px}
.ph-hold-links a{display:inline-flex; align-items:center; gap:8px; font-family:var(--fu); font-size:13px;
  color:var(--gold-lt); text-decoration:none; border-bottom:1px solid rgba(214,185,126,.35); padding-bottom:3px}
.ph-hold-links a:hover{color:#fff; border-color:rgba(255,255,255,.5)}

/* 6b — context bar --------------------------------------------------------- */
.thg-ctx-bar{display:flex; flex-wrap:wrap; align-items:center; gap:18px 34px;
  background:var(--bone); border:1px solid var(--bone-3); border-left:3px solid var(--gold);
  padding:18px 22px; margin-bottom:24px}
.ctx-cell{min-width:130px}
.ctx-l{font-family:var(--fu); font-size:10px; font-weight:500; letter-spacing:.22em; text-transform:uppercase;
  color:var(--t3l); margin-bottom:6px}
.ctx-v{font-family:var(--fe); font-size:19px; line-height:1.25; color:var(--ink)}
.ctx-v--date{font-variant-numeric:tabular-nums}
.ctx-v em{font-style:italic; font-size:13px; color:var(--t2l)}
.ctx-change{margin-left:auto; display:inline-flex; align-items:center; gap:8px; font-family:var(--fu);
  font-size:10.5px; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--ember);
  text-decoration:none; border-bottom:1px solid rgba(184,68,42,.4); padding-bottom:4px; transition:gap .25s}
.ctx-change:hover{gap:13px}
.thg-ctx-note{display:flex; align-items:flex-start; gap:12px; margin:-8px 0 24px;
  background:rgba(182,150,88,.12); border-left:3px solid var(--gold); padding:14px 18px;
  font-family:var(--fu); font-size:13.5px; line-height:1.65; color:var(--t2l)}
.thg-ctx-note i{color:var(--gold); font-size:17px; margin-top:1px}
@media(max-width:640px){
  .form-page{padding:40px 18px 64px}
  .thg-ctx-bar{padding:16px 18px; gap:14px 24px}
  .ctx-cell{min-width:104px}
  .ctx-v{font-size:17px}
  .ctx-change{margin-left:0; width:100%}
}

/* 6c — WPForms, LIGHT surfaces -------------------------------------------- */
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-container,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-form{
  margin:0 !important; padding:0 !important; max-width:100% !important; background:transparent !important; border:0 !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-form .wpforms-field{
  margin:0 !important; padding:0 0 20px 0 !important; max-width:100% !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-label{
  display:block !important; font-family:var(--fu) !important; font-size:10.5px !important; font-weight:600 !important;
  letter-spacing:.22em !important; text-transform:uppercase !important; color:var(--t2l) !important;
  margin:0 0 9px 0 !important; line-height:1.4 !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-required-label{color:var(--ember) !important; margin-left:3px}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-description,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-sublabel{
  font-family:var(--fe) !important; font-style:italic !important; font-size:13.5px !important; line-height:1.6 !important;
  color:var(--t2l) !important; margin:7px 0 0 0 !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=text],
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=email],
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=tel]:not(.iti__tel-input),
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=number],
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=date],
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=time],
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=url],
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=password],
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field select,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field textarea{
  width:100% !important; max-width:100% !important; min-height:52px !important; height:auto !important;
  background:#fff !important; border:1px solid var(--bone-3) !important; border-radius:0 !important;
  box-shadow:none !important; padding:14px 16px !important; margin:0 !important;
  font-family:var(--fu) !important; font-size:15.5px !important; font-weight:400 !important; line-height:1.4 !important;
  letter-spacing:0 !important; text-transform:none !important; color:var(--ink) !important;
  transition:border-color .22s, box-shadow .22s, background .22s; appearance:none}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input:hover,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field select:hover,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field textarea:hover{border-color:var(--bone-3)}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input:focus,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field select:focus,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field textarea:focus{
  outline:none !important; border-color:var(--ember) !important; box-shadow:0 0 0 3px rgba(184,68,42,.12) !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input::placeholder,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field textarea::placeholder{
  color:rgba(74,69,62,.45) !important; font-family:var(--fu) !important; opacity:1 !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field textarea{
  min-height:132px !important; line-height:1.65 !important; resize:vertical !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field select{
  padding-right:46px !important; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%234A453E' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important; background-position:right 16px center !important; background-size:14px 9px !important;
  -webkit-appearance:none !important; -moz-appearance:none !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field select option{background:#fff; color:var(--ink)}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=number]{-moz-appearance:textfield}
/* phone (smart) field — intl-tel-input v28 (the lib WPForms Pro bundles) blended into the skin. REAL v28 class set: .iti (position:relative, inline-block) > .iti__country-container (absolute, top:0 bottom:0 left:0) > button.iti__selected-country > .iti__selected-country-primary > .iti__flag + .iti__selected-dial-code + .iti__arrow | .iti__dropdown-content > .iti__search-input-wrapper + ul.iti__country-list > li.iti__country The lib OWNS the geometry: it positions the chip and sets inline `padding-left` on .iti__tel-input equal to the measured chip width. Theme rules must never re-position the chip or override that padding with !important — that is what made the country code fall outside / overlap the field (v1.55.0 targeted v24-era .iti__flag-container names which exist). */
.wpforms-field .wpforms-field-phone-input-container{position:relative; width:100%}
.wpforms-field-phone .iti{position:relative; display:block; width:100%}
/* geometry-safe skin for the tel input: everything EXCEPT padding-left gets
   !important; the lib writes padding-left inline and stays in charge. */
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-phone input.iti__tel-input{
  width:100% !important; max-width:100% !important; min-height:52px !important; height:auto !important;
  background:#fff !important; border:1px solid var(--bone-3) !important; border-radius:0 !important;
  box-shadow:none !important; margin:0 !important;
  padding-top:14px !important; padding-right:16px !important; padding-bottom:14px !important; padding-left:16px;
  font-family:var(--fu) !important; font-size:15.5px !important; font-weight:400 !important; line-height:1.4 !important;
  letter-spacing:0 !important; text-transform:none !important; color:var(--ink) !important;
  transition:border-color .22s, box-shadow .22s; appearance:none}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-phone input.iti__tel-input:focus{
  outline:none !important; border-color:var(--ember) !important; box-shadow:0 0 0 3px rgba(184,68,42,.12) !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-phone input.iti__tel-input::placeholder{
  color:rgba(74,69,62,.45) !important; font-family:var(--fu) !important; opacity:1 !important}
/* ── country chip ──────────────────────────────────────────────────────── */
.wpforms-field-phone .iti{--iti-icon-color:var(--t3l); --iti-dropdown-bg:#fff}
/* WPForms prints a static country preview block before JS init — once the
   .iti wrapper exists, that placeholder would double-render the chip. */
.wpforms-field-phone:has(.iti) .wpforms-field-phone-country-container{display:none !important}
.wpforms-field-phone .iti__country-container{z-index:2}
.wpforms-field-phone .iti__selected-country{transition:background .2s}
.wpforms-field-phone .iti__selected-country:hover{background:rgba(14,20,17,.035)}
.wpforms-field-phone .iti__selected-country:focus-visible{outline:2px solid var(--ember); outline-offset:-2px}
.wpforms-field-phone .iti__selected-country-primary{
  border-right:1px solid var(--bone-3); padding:0 12px 0 16px}
.wpforms-field-phone .iti__selected-dial-code{
  margin-left:7px; font-family:var(--fu); font-size:12.5px; letter-spacing:.02em; color:var(--t3l)}
.wpforms-field-phone:has(.iti__selected-dial-code:empty) .iti__selected-country-primary{padding-right:14px}
/* ── dropdown panel (.iti__dropdown-content is the v28 panel node) ───────
   It renders inline below the field, or detached on <body> for the mobile
   fullscreen popup — so dropdown skin rules are not scoped to the form
   wrapper. */
.iti__dropdown-content{
  background:#fff; border:1px solid var(--bone-3); border-radius:14px;
  box-shadow:0 22px 44px rgba(14,20,17,.14); overflow:hidden; z-index:60}
.wpforms-field-phone .iti:not(.iti--container) .iti__dropdown-content{left:0; right:0}
.iti__search-input-wrapper{padding:10px 12px; border-bottom:1px solid var(--bone-3)}
.iti__search-input{
  width:100%; box-sizing:border-box; border:1px solid var(--bone-3); border-radius:8px;
  background:#fff; font-family:var(--fu); font-size:13px; color:var(--ink); outline:none}
.iti__search-input:focus{border-color:var(--ember)}
.iti__search-icon{color:var(--t3l)}
.iti__country-list{max-height:248px; padding:6px 0}
.iti__country{
  display:flex; align-items:center; min-height:40px; padding:0 16px;
  font-family:var(--fu); font-size:13.5px; color:var(--t1l); transition:background .15s}
.iti__country:hover,.iti__country.iti__highlight{background:var(--bone)}
.iti__country-name{font-weight:500}
.iti__dial-code{color:var(--t3l); font-size:12px}
.iti__country-check{color:var(--ember)}
.iti__no-results{font-family:var(--fu); font-size:13px; color:var(--t3l); padding:18px 16px; text-align:center}
.iti--fullscreen-popup.iti--container{z-index:100000}
/* halves / thirds — a real two-up instead of plugin floats */
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-row{
  display:flex !important; flex-wrap:wrap; gap:20px; margin:0 !important; padding:0 !important; max-width:100% !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-row .wpforms-field-row-block{
  flex:1 1 220px; width:auto !important; max-width:100% !important; padding:0 !important; float:none !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-one-half,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-one-third,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-two-thirds,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-one-fourth{width:auto !important; max-width:100% !important; float:none !important}
/* choices — custom marks, 44px rows */
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-checkbox ul,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-radio ul,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-payment-multiple ul{
  display:flex !important; flex-wrap:wrap; gap:8px 26px; margin:0 !important; padding:0 !important; list-style:none !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-checkbox li,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-radio li,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-payment-multiple li{
  display:flex; align-items:center; gap:10px; min-height:44px; margin:0 !important; padding:0 !important; list-style:none !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=checkbox],
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=radio]{
  appearance:none; -webkit-appearance:none; width:19px !important; height:19px !important; min-height:19px !important;
  flex:0 0 19px; margin:0 !important; padding:0 !important; border:1px solid var(--bone-3) !important;
  background:#fff !important; position:relative; cursor:pointer; transition:border-color .2s, background .2s}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=radio]{border-radius:50%}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=checkbox]:checked,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=radio]:checked{
  border-color:var(--ember) !important; background:var(--ember) !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=checkbox]:checked::after{
  content:''; position:absolute; left:6px; top:2px; width:5px; height:10px;
  border-right:1.5px solid #fff; border-bottom:1.5px solid #fff; transform:rotate(40deg)}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=radio]:checked::after{
  content:''; position:absolute; inset:4.5px; border-radius:50%; background:#fff}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-checkbox li label,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-radio li label,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-label-inline{
  font-family:var(--fu) !important; font-size:14.5px !important; font-weight:400 !important; letter-spacing:0 !important;
  text-transform:none !important; color:var(--t1l) !important; margin:0 !important; line-height:1.5 !important; cursor:pointer}
/* file / signature / datepicker odds and ends */
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input[type=file]{
  font-family:var(--fu) !important; font-size:13px !important; color:var(--t2l) !important; padding:12px !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-hidden,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) input[type=hidden]{display:none !important}
/* submit */
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-submit-container{
  display:flex; flex-wrap:wrap; align-items:center; gap:16px; padding:6px 0 0 0 !important; margin:0 !important; clear:both}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-submit,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) button[type=submit]{
  display:inline-flex !important; align-items:center; justify-content:center; gap:12px;
  background:var(--brand-orange) !important; color:#fff !important; border:0 !important; border-radius:0 !important;
  min-height:56px; height:auto !important; padding:18px 34px !important; cursor:pointer;
  font-family:var(--fu) !important; font-size:12.5px !important; font-weight:600 !important;
  letter-spacing:.22em !important; text-transform:uppercase !important; text-align:center;
  transition:background .28s var(--ex), transform .28s var(--ex), box-shadow .28s}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-submit:hover,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) button[type=submit]:hover{
  background:var(--brand-orange-dk) !important; transform:translateY(-2px)}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-submit:focus-visible{
  outline:2px solid var(--ink); outline-offset:3px}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-submit-container .wpforms-submit-spinner{margin:0}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-submit-container .wpforms-error{
  flex:1 1 100%; margin:0 !important}
/* validation + confirmation */
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-error,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) em.wpforms-error{
  font-family:var(--fu) !important; font-size:12.5px !important; font-style:normal !important; line-height:1.5 !important;
  color:#A32E1B !important; margin:8px 0 0 0 !important; display:block}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field input.wpforms-error,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field select.wpforms-error,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field textarea.wpforms-error,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field.wpforms-has-error input,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field.wpforms-has-error textarea{
  border-color:#A32E1B !important; box-shadow:0 0 0 3px rgba(163,46,27,.10) !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-error-container,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-error-container ul{
  background:rgba(163,46,27,.07) !important; border:0 !important; border-left:3px solid #A32E1B !important;
  padding:16px 18px !important; margin:0 0 20px 0 !important; list-style:none !important;
  font-family:var(--fu) !important; font-size:13.5px !important; line-height:1.7 !important; color:#A32E1B !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-confirmation-container-full,
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) div.wpforms-confirmation-container-full{
  background:rgba(182,150,88,.10) !important; border:0 !important; border-left:3px solid var(--gold) !important;
  padding:24px 26px !important; margin:0 !important; font-family:var(--fe) !important; font-size:17px !important;
  line-height:1.7 !important; color:var(--t1l) !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-confirmation-container-full p{margin:0 0 12px 0 !important}
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-confirmation-container-full p:last-child{margin-bottom:0 !important}
/* honeypot / ajax spinner never show as a field */
:is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-html .wpforms-field-label{margin:0 !important}

/* 6d — WPForms, DARK surfaces (CTA band, inquiry-free dark panels) ---------- */
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-container,
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-form{margin:0 !important; padding:0 !important; max-width:100% !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field{padding:0 0 18px 0 !important; margin:0 !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-label{
  font-family:var(--fu) !important; font-size:10.5px !important; font-weight:600 !important; letter-spacing:.24em !important;
  text-transform:uppercase !important; color:rgba(244,239,230,.6) !important; margin:0 0 9px 0 !important; display:block !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-required-label{color:var(--gold-lt) !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-description{color:rgba(244,239,230,.5) !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=text],
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=email],
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=tel]:not(.iti__tel-input),
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=number],
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=date],
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field select,
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field textarea{
  width:100% !important; max-width:100% !important; min-height:50px !important; height:auto !important;
  background:rgba(255,255,255,.04) !important; border:1px solid rgba(255,255,255,.18) !important;
  border-radius:0 !important; box-shadow:none !important; color:#fff !important;
  padding:13px 15px !important; font-family:var(--fu) !important; font-size:15px !important;
  letter-spacing:0 !important; text-transform:none !important; transition:border-color .22s, box-shadow .22s, background .22s}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input:focus,
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field select:focus,
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field textarea:focus{
  outline:none !important; border-color:var(--gold-lt) !important; background:rgba(255,255,255,.06) !important;
  box-shadow:0 0 0 3px rgba(214,185,126,.14) !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input::placeholder,
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field textarea::placeholder{color:rgba(244,239,230,.38) !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field textarea{min-height:118px !important; line-height:1.65 !important; resize:vertical}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field select{
  padding-right:44px !important; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23D6B97E' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important; background-position:right 15px center !important; background-size:14px 9px !important;
  appearance:none; -webkit-appearance:none}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field select option{background:var(--ink-2); color:#fff}
/* phone (smart) field on dark surfaces — same v28 layer, dark mix.
   The dropdown panel stays a light card (readability over dark bg); only
   the inline chip and the input take the dark palette. */
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-phone input.iti__tel-input{
  width:100% !important; max-width:100% !important; min-height:50px !important; height:auto !important;
  background:rgba(255,255,255,.04) !important; border:1px solid rgba(255,255,255,.18) !important;
  border-radius:0 !important; box-shadow:none !important; margin:0 !important; color:#fff !important;
  padding-top:13px !important; padding-right:15px !important; padding-bottom:13px !important; padding-left:15px;
  font-family:var(--fu) !important; font-size:15px !important; letter-spacing:0 !important;
  text-transform:none !important; transition:border-color .22s, box-shadow .22s, background .22s}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-phone input.iti__tel-input:focus{
  outline:none !important; border-color:var(--gold-lt) !important; background:rgba(255,255,255,.06) !important;
  box-shadow:0 0 0 3px rgba(214,185,126,.14) !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-phone input.iti__tel-input::placeholder{color:rgba(244,239,230,.38) !important}
:is(.thg-cta-form,.thg-form-card--dark,.bs-inq-form) .wpforms-field-phone .iti{--iti-icon-color:rgba(244,239,230,.55)}
:is(.thg-cta-form,.thg-form-card--dark,.bs-inq-form) .wpforms-field-phone .iti__selected-country:hover{background:rgba(255,255,255,.05)}
:is(.thg-cta-form,.thg-form-card--dark,.bs-inq-form) .wpforms-field-phone .iti__selected-country:focus-visible{outline-color:var(--gold-lt)}
:is(.thg-cta-form,.thg-form-card--dark,.bs-inq-form) .wpforms-field-phone .iti__selected-country-primary{border-right-color:rgba(255,255,255,.18)}
:is(.thg-cta-form,.thg-form-card--dark,.bs-inq-form) .wpforms-field-phone .iti__selected-dial-code{color:rgba(244,239,230,.55)}
/* gaps the dark skin had over the light one — hidden fields never show,
   two-up rows are real flex (not plugin floats), file inputs are styled */
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-hidden,
:is(.thg-cta-form,.thg-form-card--dark) input[type=hidden]{display:none !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-row{display:flex !important; flex-wrap:wrap; gap:18px; margin:0 !important; padding:0 !important; max-width:100% !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-row .wpforms-field-row-block{flex:1 1 220px; width:auto !important; max-width:100% !important; padding:0 !important; float:none !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=file]{font-family:var(--fu); font-size:13px; color:rgba(244,239,230,.8); padding:12px; background:rgba(255,255,255,.04)}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=checkbox],
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=radio]{
  appearance:none; -webkit-appearance:none; width:19px !important; height:19px !important; flex:0 0 19px;
  border:1px solid rgba(255,255,255,.3) !important; background:transparent !important; position:relative; cursor:pointer}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=radio]{border-radius:50%}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=checkbox]:checked,
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=radio]:checked{
  border-color:var(--gold-lt) !important; background:rgba(214,185,126,.18) !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=checkbox]:checked::after{
  content:''; position:absolute; left:6px; top:2px; width:5px; height:10px;
  border-right:1.5px solid var(--gold-lt); border-bottom:1.5px solid var(--gold-lt); transform:rotate(40deg)}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input[type=radio]:checked::after{
  content:''; position:absolute; inset:4.5px; border-radius:50%; background:var(--gold-lt)}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-checkbox li label,
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-radio li label,
:is(.thg-cta-form,.thg-form-card--dark) label.wpforms-field-label-inline{
  font-family:var(--fu) !important; font-size:14px !important; letter-spacing:0 !important; text-transform:none !important;
  color:rgba(244,239,230,.85) !important; margin:0 !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-submit-container{display:flex; flex-wrap:wrap; align-items:center; gap:14px; padding:6px 0 0 0 !important; margin:0 !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-submit,
:is(.thg-cta-form,.thg-form-card--dark) button[type=submit]{
  display:inline-flex !important; align-items:center; justify-content:center; gap:12px; width:100%;
  background:var(--brand-orange) !important; color:#fff !important; border:0 !important; border-radius:0 !important;
  min-height:56px; padding:18px 28px !important; cursor:pointer;
  font-family:var(--fu) !important; font-size:12.5px !important; font-weight:600 !important;
  letter-spacing:.22em !important; text-transform:uppercase !important; transition:background .28s var(--ex), transform .28s}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-submit:hover,
:is(.thg-cta-form,.thg-form-card--dark) button[type=submit]:hover{background:var(--brand-orange-dk) !important; transform:translateY(-2px)}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-error{color:#F0A38B !important; font-family:var(--fu) !important; font-size:12.5px !important; font-style:normal !important; display:block; margin:8px 0 0 0 !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field input.wpforms-error,
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-field textarea.wpforms-error{border-color:#E0765A !important}
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-error-container,
:is(.thg-cta-form,.thg-form-card--dark) .wpforms-confirmation-container-full{
  background:rgba(255,255,255,.05) !important; border:0 !important; border-left:3px solid var(--gold-lt) !important;
  padding:18px 20px !important; margin:0 0 18px 0 !important; color:var(--t1d) !important;
  font-family:var(--fu) !important; font-size:13.5px !important; line-height:1.7 !important}

/* 6e — form rhythm on small screens --------------------------------------- */
@media(max-width:640px){
  :is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field,
  :is(.thg-cta-form,.thg-form-card--dark) .wpforms-field{padding-bottom:16px !important}
  :is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-field-row,
  :is(.thg-cta-form,.thg-form-card--dark) .wpforms-field-row{flex-direction:column; gap:0}
  :is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-form .wpforms-field input,
  :is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-form .wpforms-field select,
  :is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-form .wpforms-field textarea,
  :is(.thg-cta-form,.thg-form-card--dark) .wpforms-form .wpforms-field input,
  :is(.thg-cta-form,.thg-form-card--dark) .wpforms-form .wpforms-field select,
  :is(.thg-cta-form,.thg-form-card--dark) .wpforms-form .wpforms-field textarea{font-size:16px !important}
  .wpforms-field input[type=checkbox], .wpforms-field input[type=radio]{font-size:0 !important}
  :is(.thg-form-card,.co-form,.thg-modal__content,.entry-content,.bs-inq-form,.news-form-wrap,.thg-slot-form) .wpforms-submit,
  :is(.thg-cta-form,.thg-form-card--dark) .wpforms-submit{width:100%; min-height:54px; letter-spacing:.18em !important}
  .wpforms-container .wpforms-field-medium,
  .wpforms-container .wpforms-field-small{max-width:100% !important}
}

/* 6f — mobile polish that belongs with the forms/CTA work () */
@media(max-width:640px){
  .subnav-row a{min-height:44px; display:inline-flex; align-items:center}
  .subnav-row .sub-cta{min-height:44px; padding:12px 16px}
  .wpforms-container .wpforms-field-row-block{margin-bottom:16px}
}

/* 6g — · dark letter-card bands (journal newsletter + ask-a-question). The unified light skin above folds .bs-inq-form and .news-form-wrap into its white boxed-field palette, which is unreadable on the ink bands. The band design is the letter-card: underline fields, gold focus. Only the contested declarations are re-asserted here; rhythm, rows, submit button and the ≤640px field font-size bump are inherited from the unified skin. */
:is(.bs-inq-form,.news-form-wrap) .wpforms-field-label{
  color:rgba(244,239,230,.55) !important; font-size:10px !important; font-weight:500 !important;
  letter-spacing:.28em !important}
:is(.bs-inq-form,.news-form-wrap) .wpforms-required-label{color:var(--gold-lt) !important}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field-description,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field-sublabel{color:rgba(244,239,230,.5) !important}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=text],
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=email],
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=tel]:not(.iti__tel-input),
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=number],
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=date],
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=url],
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=password],
:is(.bs-inq-form,.news-form-wrap) .wpforms-field select,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field textarea{
  background-color:transparent !important; border:0 !important;
  border-bottom:1px solid rgba(255,255,255,.22) !important;
  border-radius:0 !important; box-shadow:none !important; color:#F4EFE6 !important;
  padding:10px 2px !important; min-height:48px !important; height:auto !important;
  transition:border-color .25s}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field textarea{min-height:120px !important; line-height:1.6 !important; resize:vertical !important}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input:focus,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field select:focus,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field textarea:focus{
  outline:none !important; border-bottom-color:var(--gold-lt) !important;
  box-shadow:none !important; background-color:rgba(255,255,255,.03) !important}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input::placeholder,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field textarea::placeholder{color:rgba(244,239,230,.35) !important}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field select{
  padding-right:34px !important; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23D6B97E' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important; background-position:right 4px center !important;
  background-size:12px 8px !important; appearance:none; -webkit-appearance:none}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field select option{background:var(--ink-2); color:#fff}
/* checks/radios on ink, if a band form ever grows them (same hand as the
   dark CTA card) */
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=checkbox],
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=radio]{
  appearance:none; -webkit-appearance:none; width:19px !important; height:19px !important; flex:0 0 19px;
  border:1px solid rgba(255,255,255,.3) !important; background:transparent !important;
  position:relative; cursor:pointer; border-radius:0}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=radio]{border-radius:50%}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=checkbox]:checked,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=radio]:checked{
  border-color:var(--gold-lt) !important; background:rgba(214,185,126,.18) !important}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=checkbox]:checked::after{
  content:''; position:absolute; left:6px; top:2px; width:5px; height:10px;
  border-right:1.5px solid var(--gold-lt); border-bottom:1.5px solid var(--gold-lt); transform:rotate(40deg)}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input[type=radio]:checked::after{
  content:''; position:absolute; inset:4.5px; border-radius:50%; background:var(--gold-lt)}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field-checkbox li label,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field-radio li label,
:is(.bs-inq-form,.news-form-wrap) label.wpforms-field-label-inline{
  color:rgba(244,239,230,.85) !important; font-size:14px !important;
  letter-spacing:0 !important; text-transform:none !important}
/* validation + confirmation on ink */
:is(.bs-inq-form,.news-form-wrap) .wpforms-error,
:is(.bs-inq-form,.news-form-wrap) em.wpforms-error{color:#F0A38B !important}
:is(.bs-inq-form,.news-form-wrap) .wpforms-field input.wpforms-error,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field select.wpforms-error,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field textarea.wpforms-error,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field.wpforms-has-error input,
:is(.bs-inq-form,.news-form-wrap) .wpforms-field.wpforms-has-error textarea{
  border-bottom-color:#E0765A !important; box-shadow:none !important}
:is(.bs-inq-form,.news-form-wrap) .wpforms-error-container,
:is(.bs-inq-form,.news-form-wrap) .wpforms-error-container ul{
  background:rgba(224,118,90,.08) !important; border-left-color:#E0765A !important; color:#F0A38B !important}
:is(.bs-inq-form,.news-form-wrap) .wpforms-confirmation-container-full,
:is(.bs-inq-form,.news-form-wrap) div.wpforms-confirmation-container-full{
  background:rgba(182,150,88,.10) !important; border-left:3px solid var(--gold) !important;
  color:#F4EFE6 !important; font-style:italic !important}

/* 7 — narrow-screen integrity () Two boxes that push the whole page sideways on phones: · the policy confirm-cards kept their 3-column grid below 780px because the later `section.policy .confirm` rule carried !important; · the good-to-know / day-tour info grid could not shrink because its cells had the default min-width:auto and a scroll wrapper inside them. */
@media(max-width:900px){
  section.policy .confirm{grid-template-columns:1fr !important; gap:16px !important; margin-top:44px !important}
  section.policy .confirm .ccard{padding:26px 22px !important}
}
@media(max-width:1100px){
  section.policy .confirm{grid-template-columns:repeat(2,1fr) !important}
}
@media(max-width:900px){
  section.policy .confirm{grid-template-columns:1fr !important}
}
.info-grid, .info-body, .info-toc{min-width:0}
.info-body, .info-body > *, .info-toc{max-width:100%}
.info-body .table-wrap{max-width:100%; min-width:0}
.info-body table{max-width:100%}
.info-body p, .info-body li, .info-body h3, .info-body h4{overflow-wrap:break-word}
@media(max-width:780px){
  .info-grid{grid-template-columns:1fr !important; gap:32px}
  .info-toc{position:static; top:auto}
  .info-toc a{display:inline-flex; min-height:44px; align-items:center; padding:8px 14px; border-left:1px solid var(--bone-3)}
}

@media (max-width: 760px){
  .matrix-wrap{overflow-x: visible}
  .matrix{min-width: 0}
  .matrix thead{display: none}
  .matrix tbody, .matrix tr, .matrix td{display: block; width: 100%}
  .matrix tr{padding: 14px 0 16px; border-bottom: 1px solid rgba(255,255,255,.08)}
  .matrix tr:last-child{border-bottom: 0; padding-bottom: 4px}
  .matrix td{border: 0; padding: 3px 0; text-align: right}
  .matrix td:first-child{text-align: left; padding: 0 0 8px}
  .matrix td:not(:first-child){
    display: flex; justify-content: space-between; align-items: baseline; gap: 18px;
  }
  .matrix td:not(:first-child)::before{
    content: attr(data-th);
    font-family: var(--fu);
    font-size: 10px; font-weight: 600;
    letter-spacing: .16em; text-transform: uppercase;
    text-align: left;
    color: rgba(244,239,230,.55);
  }
  /* Light subpage skin (Cost & Dates) — same layout, subpage palette */
  section#pricing.sec.alt .matrix tr{border-bottom-color: #DDD3C0}
  section#pricing.sec.alt .matrix td:not(:first-child)::before{color: #8A8074}
}

.phead h1.h1-trip, .trip-overview-head h1.h1-trip{
  font-family: var(--fu);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--gold);
  line-height: inherit; /* div inherited the head's 1.65 — keep that */
  max-width: none;
  font-variation-settings: normal;
}

.thg-bookbar{position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
  display: none; align-items: center; justify-content: space-between; gap: 16px;
  background: rgba(14,20,17,.96); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-top: 1px solid rgba(214,185,126,.35);
  padding: 12px var(--pad) calc(12px + env(safe-area-inset-bottom, 0px));
  transform: translateY(110%); transition: transform .4s cubic-bezier(.16,1,.3,1);}
@media(max-width:820px){
  .thg-bookbar{display: flex}
}
.thg-bookbar.on{transform: translateY(0)}
body.modal-open .thg-bookbar{transform: translateY(110%)}
.thg-bookbar .bb-meta{min-width: 0}
.thg-bookbar .bb-trip{display: block; font-family: var(--fu); font-size: 13px; font-weight: 500; color: #fff; letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 56vw}
.thg-bookbar .bb-price{display: block; font-family: var(--fe); font-style: italic; font-size: 12.5px; color: var(--gold-lt); margin-top: 2px}
.thg-bookbar .bb-price em{font-style: normal; font-family: var(--fu); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: rgba(244,239,230,.5)}
.thg-bookbar .bb-btn{flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px;
  background: var(--brand-orange); color: #fff; text-decoration: none;
  font-family: var(--fu); font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  padding: 13px 20px; transition: background .25s}
.thg-bookbar .bb-btn:hover{background: var(--brand-orange-dk)}
.thg-bookbar .bb-btn i{font-size: 14px}
/* Search results page */
/* ── Search page ─────────────────────────────────────────────── */
.search-form{display: flex; gap: 12px; margin: 32px 0; max-width: 600px; min-width: 0}
.search-form input[type="search"]{flex: 1 1 0; width: 0; min-width: 0; padding: 14px 18px; border: 1px solid var(--bone-3); background: var(--paper); font-family: var(--fu)}
.search-form input[type="search"]:focus{outline: none; border-color: var(--ember)}
.search-hero{position: relative; background: var(--ink); color: #fff; padding: 170px 0 100px; overflow: hidden}
.search-hero .ph-h1{margin: 18px 0 0; max-width: 22ch}
.search-hero .ph-h1 em{font-style: italic; color: var(--gold-lt)}
.search-hero .search-form{margin: 44px 0 0}
.search-hero .search-form input[type="search"]{background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.22); color: #fff}
.search-hero .search-form input[type="search"]::placeholder{color: rgba(244,239,230,.45)}
.search-hero .search-form input[type="search"]:focus{border-color: var(--ember)}
.search-results-wrap{padding: 76px 0 110px; width: 100%; min-width: 0}
.result-count{font-family: var(--fu); font-size: 11.5px; font-weight: 500; letter-spacing: .26em; text-transform: uppercase; color: var(--t3l); margin: 0 0 40px}
.result-count em{font-family: var(--fe); font-style: italic; font-size: 16px; letter-spacing: 0; text-transform: none; color: var(--t2l)}
.result-grid{display: grid; grid-template-columns: repeat(3,1fr); gap: 44px 28px}
.result-card .trip-card__placeholder{position: absolute; inset: 0; background: linear-gradient(150deg, var(--bone-2), var(--bone)); display: grid; place-items: center}
.result-card .trip-card__placeholder i{font-size: 44px; color: rgba(22,29,25,.16)}
.result-card .trip-card__meta{display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--bone-3); font-family: var(--fu); font-size: 13px; color: var(--t2l)}
.result-card .trip-card__meta i{font-size: 16px; color: var(--ember)}
.result-card .trip-card__meta .price{display: flex; align-items: baseline; gap: 6px; margin-left: auto}
.result-card .trip-card__meta .from{font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--t3l)}
.result-card .trip-card__meta .amt{font-family: var(--fd); font-size: 19px; font-weight: 500; color: var(--ink); letter-spacing: -.01em}
.result-card .trip-card__meta .amt sup{font-size: 11px; margin-right: 1px}
.search-pag{margin-top: 64px; padding-top: 32px; border-top: 1px solid rgba(22,29,25,.08); display: flex; justify-content: center}
.search-pag .pnums{justify-content: center}
.search-empty{text-align: center; max-width: 640px; margin: 8px auto 72px}
.search-empty > i{display: block; font-size: 46px; color: rgba(22,29,25,.18); margin-bottom: 22px}
.search-empty h2{font-family: var(--fe); font-weight: 400; font-size: clamp(26px,3.6vw,36px); line-height: 1.15; color: var(--ink); margin: 0 0 16px}
.search-empty p{font-family: var(--fu); font-size: 15.5px; line-height: 1.75; color: var(--t2l); margin: 0 0 30px}
.search-empty__links{display: flex; gap: 12px; justify-content: center; flex-wrap: wrap}
@media(max-width:1024px){
.result-grid{grid-template-columns: repeat(2,1fr); gap: 36px 20px}
}
@media(max-width:640px){
.search-hero{padding: 130px 0 72px}
.search-results-wrap{padding: 56px 0 80px}
.result-grid{grid-template-columns: 1fr; gap: 28px}
.search-hero .search-form{flex-direction: column; gap: 10px}
.search-hero .search-form .btn{width: 100%}
}