/* ============================================================
   CKMS Travel — shared stylesheet
   Brand: "Midnight & Gilt"
   Type:  Marcellus (display) · Cormorant Garamond (editorial)
          · Jost (UI / body)
   ============================================================ */

:root{
  /* palette */
  --navy:#112A47;
  --navy-deep:#0C1F36;
  --navy-grad-from:#16324F;
  --gold:#C0964A;
  --gold-light:#D8B877;
  --gold-dark:#B8883C;
  --gold-soft:rgba(216,184,119,.7);
  --ivory:#F4EEE1;
  --cream:#FBF9F4;
  --ink:#2A2620;
  --ink-soft:#3A352C;
  --slate:#3A4453;
  --text:#6A6458;
  --text-mid:#5C5648;
  --text-soft:#9A9082;
  --label:#A39B8C;
  --line:#ECE6DB;
  --line-soft:#F0ECE3;
  --line-mid:#DAD4C8;
  --line-warm:#E6DFD2;

  /* type */
  --serif:'Marcellus', Georgia, serif;
  --editorial:'Cormorant Garamond', Georgia, serif;
  --sans:'Jost', 'Helvetica Neue', Arial, sans-serif;

  /* layout */
  --gutter:80px;
}

*{ box-sizing:border-box; }
[hidden]{ display:none !important; }
html,body{ margin:0; padding:0; }
body{
  background:#fff;
  color:var(--ink);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ display:block; max-width:100%; }
a{ color:inherit; }

/* ---------- shared text helpers ---------- */
.eyebrow{
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:4px;
  text-transform:uppercase;
  color:var(--gold);
}
.eyebrow--dark{ color:var(--gold-light); }
.eyebrow--sm{ font-size:10px; letter-spacing:3px; }

.lede{
  font-family:var(--editorial);
  font-style:italic;
  font-weight:500;
  font-size:21px;
  color:var(--text);
  margin:18px 0 0;
}
.lede--light{ color:rgba(244,238,225,.82); }

/* ---------- buttons ---------- */
.btn{
  display:inline-block;
  font-family:var(--sans);
  font-weight:500;
  font-size:12px;
  letter-spacing:2px;
  text-transform:uppercase;
  text-align:center;
  text-decoration:none;
  padding:16px 40px;
  cursor:pointer;
  transition:opacity .2s ease, background .2s ease, color .2s ease;
}
.btn--solid{ color:var(--ivory); background:var(--navy); border:1px solid var(--navy); }
.btn--solid:hover{ background:#173354; }
.btn--outline{ color:var(--navy); border:1px solid var(--gold); background:transparent; }
.btn--outline:hover{ background:var(--gold); color:#fff; }
.btn--block{ display:block; padding:16px; }

/* ============================================================
   EMBLEM (framed logo with tagline breaking the lower wall)
   ============================================================ */
.emblem{
  position:relative;
  display:inline-block;
  border:1px solid var(--navy);
  border-bottom:none;
  padding:8px 22px 11px;
  flex-shrink:0;
  text-decoration:none;
}
.emblem__name{
  font-family:var(--serif);
  font-size:17px;
  letter-spacing:3px;
  color:var(--navy);
  line-height:1;
  padding-left:3px;
  text-align:center;
}
.emblem__sub{
  font-family:var(--sans);
  font-weight:500;
  font-size:5px;
  letter-spacing:2.5px;
  text-transform:uppercase;
  color:var(--navy);
  margin-top:3px;
  padding-left:2px;
  text-align:center;
}
.emblem__wall{
  position:absolute;
  left:0; right:0; bottom:0;
  transform:translateY(50%);
  display:flex;
  align-items:center;
}
.emblem__wall::before,
.emblem__wall::after{
  content:"";
  flex:1;
  height:1px;
  background:var(--navy);
}
.emblem__tag{
  font-family:var(--sans);
  font-weight:500;
  font-size:4px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:var(--gold-dark);
  white-space:nowrap;
  padding:0 4px;
}

/* gold / on-dark variant */
.emblem--gold{ border-color:var(--gold-soft); }
.emblem--gold .emblem__name,
.emblem--gold .emblem__sub{ color:var(--ivory); }
.emblem--gold .emblem__wall::before,
.emblem--gold .emblem__wall::after{ background:var(--gold-soft); }
.emblem--gold .emblem__tag{ color:var(--gold-light); }

/* footer size */
.emblem--footer{ padding:12px 22px 15px; }
.emblem--footer .emblem__name{ font-size:20px; letter-spacing:5px; padding-left:5px; }
.emblem--footer .emblem__sub{ font-size:5.5px; letter-spacing:4px; margin-top:5px; padding-left:3px; }
.emblem--footer .emblem__tag{ font-size:5px; letter-spacing:.8px; padding:0 6px; }

/* large contact-panel size */
.emblem--lg{ padding:14px 26px 17px; }
.emblem--lg .emblem__name{ font-size:22px; letter-spacing:5px; padding-left:5px; }
.emblem--lg .emblem__sub{ font-size:6px; letter-spacing:4px; margin-top:5px; padding-left:3px; }
.emblem--lg .emblem__tag{ font-size:5.5px; letter-spacing:.9px; padding:0 7px; }

/* ============================================================
   NAV
   ============================================================ */
.site-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  padding:20px 48px;
  border-bottom:1px solid var(--line-soft);
  background:#fff;
}
.site-nav__links{
  display:flex;
  align-items:center;
  gap:30px;
  font-family:var(--sans);
  font-weight:400;
  font-size:12px;
  letter-spacing:1.3px;
  text-transform:uppercase;
  color:var(--slate);
  white-space:nowrap;
}
.site-nav__links a{ color:inherit; text-decoration:none; padding-bottom:3px; }
.site-nav__links a:hover{ color:var(--navy); }
.site-nav__links a.is-active{
  color:var(--navy);
  border-bottom:1px solid var(--gold);
}
.site-nav__cta{
  font-family:var(--sans);
  font-weight:500;
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--navy);
  border:1px solid var(--gold);
  padding:11px 18px;
  white-space:nowrap;
  flex-shrink:0;
  text-decoration:none;
  transition:background .2s ease, color .2s ease;
}
.site-nav__cta:hover{ background:var(--gold); color:#fff; }
.site-nav__cta--solid{ color:var(--ivory); background:var(--navy); }
.site-nav__cta--solid:hover{ background:#173354; color:var(--ivory); }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{
  background:var(--navy-deep);
  padding:48px var(--gutter);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.site-footer__legal{
  font-family:var(--sans);
  font-size:12px;
  color:rgba(244,238,225,.6);
  letter-spacing:.5px;
}

/* ============================================================
   PAGE HEADER BANDS
   ============================================================ */
.page-head{
  position:relative;
  padding:70px var(--gutter) 64px;
  overflow:hidden;
}
.page-head--right{ background:radial-gradient(120% 140% at 80% 0%, var(--navy-grad-from) 0%, var(--navy-deep) 70%); }
.page-head--left{ background:radial-gradient(120% 140% at 20% 0%, var(--navy-grad-from) 0%, var(--navy-deep) 70%); }
.page-head__title{
  font-family:var(--serif);
  font-weight:400;
  font-size:46px;
  line-height:1.1;
  color:var(--ivory);
  margin:18px 0 0;
  max-width:680px;
}

/* ============================================================
   DESTINATIONS INDEX
   ============================================================ */
.filters{
  padding:26px var(--gutter);
  background:#fff;
  border-bottom:1px solid var(--line-soft);
}
.filters__sets{ display:flex; flex-direction:column; gap:13px; }
.filters__set{ display:flex; align-items:baseline; gap:18px; flex-wrap:wrap; }
.filters__legend{ font-family:var(--sans); font-weight:500; font-size:10px; letter-spacing:2.5px; text-transform:uppercase; color:var(--gold-dark); width:52px; flex-shrink:0; }
.filters__chips{ display:flex; gap:10px; flex-wrap:wrap; }
.filters__bar{ display:flex; align-items:center; justify-content:space-between; margin-top:18px; padding-top:16px; border-top:1px solid var(--line-soft); }
.filters__count{ font-family:var(--sans); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--text-soft); }
.chip{
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--text-mid);
  border:1px solid var(--line-mid);
  padding:9px 18px;
  cursor:pointer;
}
.chip--active{ color:var(--ivory); background:var(--navy); border-color:var(--navy); }
.filters__sort{ font-family:var(--sans); font-size:12px; color:var(--text-soft); }

.dest-grid{
  padding:48px var(--gutter) 72px;
  background:var(--cream);
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.dest-card{
  background:#fff;
  border:1px solid var(--line);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  text-decoration:none;
  color:inherit;
  transition:box-shadow .25s ease, transform .25s ease;
}
.dest-card:hover{ box-shadow:0 24px 48px -28px rgba(17,42,71,.55); transform:translateY(-2px); }
.dest-card__media{ position:relative; height:200px; }
.dest-card__media img{ width:100%; height:100%; object-fit:cover; }
.dest-card__badge{
  position:absolute; top:14px; left:14px;
  background:rgba(12,31,54,.82);
  color:var(--ivory);
  font-family:var(--sans);
  font-size:9px; letter-spacing:2px; text-transform:uppercase;
  padding:6px 11px;
}
.dest-card__body{ padding:22px; display:flex; flex-direction:column; flex:1; }
.dest-card__region{
  font-family:var(--sans);
  font-size:9px; letter-spacing:3px; text-transform:uppercase;
  color:var(--gold); margin-bottom:9px;
}
.dest-card__title{
  font-family:var(--serif); font-weight:400; font-size:20px;
  color:var(--navy); margin:0 0 10px;
}
.dest-card__desc{
  font-family:var(--sans); font-weight:300; font-size:12.5px; line-height:1.7;
  color:var(--text); margin:0 0 18px;
}
.dest-card__meta{
  margin-top:auto;
  display:flex; align-items:center; justify-content:space-between;
  padding-top:15px; border-top:1px solid var(--line-soft);
}
.dest-card__tag{ font-family:var(--sans); font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--text-soft); }
.dest-card__view{ font-family:var(--sans); font-weight:500; font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:var(--navy); }
.dest-card__tags{ display:flex; flex-wrap:wrap; gap:6px; margin:0 0 6px; }
.dest-card__ftag{ font-family:var(--sans); font-weight:500; font-size:9px; letter-spacing:1.2px; text-transform:uppercase; color:var(--text-mid); border:1px solid var(--line-mid); padding:4px 9px; }
.dest-card__ftag--style{ color:var(--gold-dark); border-color:var(--gold-soft); }

/* ============================================================
   CONTACT FORM — honeypot + confirmation modal
   ============================================================ */
.hp-field{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.modal{ position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; padding:24px; }
.modal[hidden]{ display:none; }
.modal__backdrop{ position:absolute; inset:0; background:rgba(8,18,30,.55); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); animation:ckmsFade .28s cubic-bezier(.2,.6,.2,1) both; }
.modal__panel{
  position:relative; z-index:1; width:100%; max-width:480px;
  background:var(--cream); border:1px solid var(--line);
  box-shadow:0 50px 100px -40px rgba(8,18,30,.7);
  padding:48px 44px 42px; text-align:center;
  animation:ckmsRise .3s cubic-bezier(.2,.6,.2,1) both;
}
.modal__close{ position:absolute; top:12px; right:16px; background:none; border:none; font-size:26px; line-height:1; color:var(--text-soft); cursor:pointer; padding:6px; transition:color .2s ease; }
.modal__close:hover{ color:var(--navy); }
.modal__emblem{ margin:0 auto 22px; }
.modal__eyebrow{ font-family:var(--sans); font-size:11px; letter-spacing:4px; text-transform:uppercase; color:var(--gold); margin-bottom:14px; }
.modal__title{ font-family:var(--serif); font-weight:400; font-size:29px; line-height:1.2; color:var(--navy); margin:0 0 16px; }
.modal__body{ font-family:var(--editorial); font-weight:500; font-size:18px; line-height:1.6; color:var(--ink-soft); margin:0 0 28px; }
.modal__body a{ color:var(--navy); }
.modal--error .modal__eyebrow{ color:#A6603A; }
@keyframes ckmsFade{ from{ opacity:0; } to{ opacity:1; } }
body.modal-open{ overflow:hidden; }

/* ============================================================
   LEGAL PAGES (Privacy / Terms)
   ============================================================ */
.legal{ max-width:760px; margin:0 auto; padding:64px var(--gutter) 88px; }
.legal__updated{ font-family:var(--sans); font-size:12px; letter-spacing:1px; text-transform:uppercase; color:var(--text-soft); margin-bottom:36px; }
.legal__note{ font-family:var(--sans); font-weight:300; font-size:13px; line-height:1.7; color:var(--text); background:var(--cream); border:1px solid var(--line); padding:16px 18px; margin-bottom:40px; }
.legal h2{ font-family:var(--serif); font-weight:400; font-size:24px; color:var(--navy); margin:38px 0 12px; }
.legal p{ font-family:var(--sans); font-weight:300; font-size:14.5px; line-height:1.9; color:var(--text-mid); margin:0 0 14px; }
.legal a{ color:var(--navy); }

/* ============================================================
   ITINERARY DETAIL
   ============================================================ */
.itin-hero{ position:relative; height:440px; overflow:hidden; }
.itin-hero img{ width:100%; height:100%; object-fit:cover; }
.itin-hero__scrim{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,18,30,.32) 0%, rgba(8,18,30,.12) 40%, rgba(8,18,30,.7) 100%);
}
.itin-hero__caption{ position:absolute; left:0; right:0; bottom:42px; padding:0 var(--gutter); }
.itin-hero__eyebrow{
  font-family:var(--sans); font-size:11px; letter-spacing:4px; text-transform:uppercase;
  color:#E7C77E; margin-bottom:14px;
}
.itin-hero__title{
  font-family:var(--serif); font-weight:400; font-size:52px; line-height:1.06;
  color:#fff; margin:0; max-width:680px;
}
.itin-hero__tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.itin-tag{ font-family:var(--sans); font-weight:500; font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:#fff; text-decoration:none; padding:8px 14px; border:1px solid rgba(255,255,255,.42); background:rgba(255,255,255,.08); transition:background .2s ease, border-color .2s ease, color .2s ease; }
.itin-tag:hover{ background:var(--gold); border-color:var(--gold); color:var(--navy); }

.itin-body{
  display:grid; grid-template-columns:1.6fr 1fr; gap:56px;
  padding:64px var(--gutter); background:#fff; align-items:start;
}
.itin-intro{
  font-family:var(--editorial); font-weight:500; font-size:24px; line-height:1.55;
  color:var(--ink-soft); margin:0 0 14px;
}
.itin-note{
  font-family:var(--sans); font-weight:300; font-size:14.5px; line-height:1.9;
  color:var(--text); margin:0 0 44px;
}
.section-label{
  font-family:var(--sans); font-size:11px; letter-spacing:4px; text-transform:uppercase;
  color:var(--gold); margin-bottom:28px;
}

/* timeline */
.timeline{ display:flex; flex-direction:column; }
.timeline__item{
  display:flex; gap:28px;
  padding:0 0 32px;
  border-left:1px solid var(--line);
  margin-left:6px; padding-left:34px;
  position:relative;
}
.timeline__item:last-child{ border-left-color:transparent; padding-bottom:0; }
.timeline__item::before{
  content:""; position:absolute; left:-5px; top:2px;
  width:9px; height:9px; background:var(--gold); transform:rotate(45deg);
}
.timeline__when{ flex-shrink:0; font-family:var(--serif); font-size:15px; color:var(--gold); width:64px; }
.timeline__head{ font-family:var(--serif); font-weight:400; font-size:22px; color:var(--navy); margin:0 0 8px; }
.timeline__text{ font-family:var(--sans); font-weight:300; font-size:13.5px; line-height:1.8; color:var(--text); margin:0; }

/* sidebar */
.itin-side{ border:1px solid var(--line); padding:30px; background:var(--cream); }
.itin-side__kicker{ font-family:var(--sans); font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }
.itin-side__title{ font-family:var(--serif); font-size:24px; color:var(--navy); margin-bottom:22px; }
.itin-side__list{ display:flex; flex-direction:column; gap:13px; padding-bottom:22px; border-bottom:1px solid var(--line-warm); list-style:none; margin:0; }
.itin-side__list li{ display:flex; align-items:center; gap:11px; font-family:var(--sans); font-size:13px; color:#4A4640; }
.itin-side__list li::before{ content:""; width:5px; height:5px; background:var(--gold); transform:rotate(45deg); flex-shrink:0; }
.itin-side__price{ font-family:var(--editorial); font-style:italic; font-size:17px; color:var(--text); margin:24px 0 22px; letter-spacing:.2px; }
.journey-aside .btn--solid{ background:var(--navy); border:1px solid var(--navy); color:#fff; transition:all 180ms ease-out; }
.journey-aside .btn--solid:hover{ background:var(--gold); border-color:var(--gold); color:var(--navy); box-shadow:0 4px 12px rgba(192,150,74,.25); }
.itin-side__contact{ margin-top:24px; padding-top:22px; border-top:1px solid var(--line-warm); font-family:var(--sans); font-size:12.5px; line-height:1.7; color:var(--text); }
.itin-side__contact a{ color:var(--navy); text-decoration:none; }
.itin-side__contact a:hover{ text-decoration:underline; }

/* ---- itinerary journey: day-by-day stops + sticky route map ---- */
.itin-journey{ padding:64px var(--gutter); background:#fff; }
.itin-journey__intro{ max-width:760px; margin:0 0 50px; }
.itin-journey__intro .itin-intro,
.itin-journey__intro .itin-note{ margin-bottom:14px; }
.itin-journey__intro .itin-note{ margin-bottom:0; }
.itin-journey__grid{
  display:grid; grid-template-columns:1.35fr 1fr; gap:60px; align-items:start;
}

.journey-stops .section-label{ margin-bottom:30px; }
.journey-list{ list-style:none; margin:0; padding:0; }
.journey-stop{ display:flex; gap:24px; padding:0 0 38px; position:relative; }
.journey-stop:last-child{ padding-bottom:0; }
/* connector threading the numbered markers */
.journey-stop:not(:last-child)::before{
  content:""; position:absolute; left:18px; top:42px; bottom:-4px; width:1px;
  background:linear-gradient(var(--gold-soft, var(--line)), transparent);
}
.journey-stop__marker{
  flex-shrink:0; width:37px; height:37px; border-radius:50%;
  border:1px solid var(--gold); background:var(--cream); color:var(--gold);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--serif); font-size:18px; line-height:1; position:relative; z-index:1;
}
.journey-stop__body{ padding-top:2px; }
.journey-stop__when{
  font-family:var(--sans); font-size:10.5px; letter-spacing:2.5px; text-transform:uppercase;
  color:var(--gold); margin-bottom:6px;
}
.journey-stop__head{ font-family:var(--serif); font-weight:400; font-size:24px; color:var(--navy); margin:0 0 10px; line-height:1.3; }
.journey-stop__text{ font-family:var(--sans); font-weight:300; font-size:13.5px; line-height:1.8; color:var(--text); margin:0; letter-spacing:.3px; }

.journey-aside{ position:sticky; top:96px; display:flex; flex-direction:column; gap:24px; }
.journey-map{ margin:0 0 28px; border:1px solid var(--line); background:var(--cream); padding:1px; box-shadow:0 4px 12px rgba(17,42,71,.08); }
.journey-map__canvas{
  width:100%; height:430px; background:var(--cream);
  position:relative; overflow:hidden; display:block;
}
/* numbered waypoint pins (navy disc, gold ring) — echoes Audley's .waypoint */
/* shown only until a Mapbox token is set (or if the map fails to load) */
.journey-map__canvas--unset{ display:flex; align-items:center; justify-content:center; }
.journey-map__canvas--unset::after{
  content:"Interactive route map"; font-family:var(--sans); font-size:11px;
  letter-spacing:2px; text-transform:uppercase; color:var(--gold);
}
/* directional arrows along the route — gold, prominent, flow-indicating */
.tour-arrow{
  width:10px; height:9px;
  background:var(--gold);
  clip-path:polygon(50% 0%, 0% 100%, 100% 100%);
  opacity:.85; pointer-events:none;
  filter:drop-shadow(0 1px 2px rgba(17,42,71,.25));
}
/* numbered waypoint pins — navy base, gold accent, hover lift */
.tour-pin{
  width:32px; height:32px; border-radius:50%;
  background:var(--navy); color:#fff; border:2px solid var(--gold);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--serif); font-size:15px; font-weight:500; line-height:1;
  box-shadow:0 3px 10px rgba(17,42,71,.3); cursor:pointer;
  transition:all 200ms cubic-bezier(.4, 0, .2, 1);
}
.tour-pin:hover{
  background:var(--gold); color:var(--navy); border-color:var(--gold);
  box-shadow:0 6px 18px rgba(17,42,71,.25);
  transform:scale(1.12);
}
.mapboxgl-popup-content{
  font-family:var(--sans); font-size:12px; color:var(--navy);
  padding:7px 12px; border-radius:2px;
}
.mapboxgl-popup-content strong{ font-weight:500; }
.mapboxgl-ctrl-group{ border-radius:2px; }
.journey-map__cap{
  display:flex; justify-content:space-between; align-items:baseline; gap:12px;
  margin-top:12px; padding-top:13px; border-top:1px solid var(--line-warm);
}
.journey-map__region{ font-family:var(--serif); font-size:16px; color:var(--navy); }
.journey-map__tag{ font-family:var(--sans); font-size:9.5px; letter-spacing:2.5px; text-transform:uppercase; color:var(--gold); }
/* the summary card sits flush inside the sticky rail */
/* Summary card in journey aside — elevated, warm background, clear hierarchy */
.journey-aside .itin-side{
  margin:0; border:1px solid var(--line); background:var(--cream);
  box-shadow:0 2px 8px rgba(17,42,71,.07); border-radius:0;
}

/* gallery */
.gallery{ display:grid; grid-template-columns:repeat(3,1fr); gap:4px; background:#fff; }
.gallery div{ height:240px; overflow:hidden; }
.gallery img{ width:100%; height:100%; object-fit:cover; }

/* ============================================================
   STORIES
   ============================================================ */
.stories-head{ text-align:center; padding:64px var(--gutter) 48px; background:var(--cream); }
.stories-head h1{ font-family:var(--serif); font-weight:400; font-size:46px; color:var(--navy); margin:16px 0 14px; }
.stories-head .lede{ margin:0 auto; max-width:540px; }

.feature-wrap{ padding:0 var(--gutter) 28px; background:var(--cream); }
.feature{
  display:grid; grid-template-columns:1.3fr 1fr;
  border:1px solid var(--line); background:#fff;
}
.feature__media{ height:360px; overflow:hidden; }
.feature__media img{ width:100%; height:100%; object-fit:cover; }
.feature__body{ padding:48px 44px; display:flex; flex-direction:column; justify-content:center; }
.feature__title{ font-family:var(--serif); font-weight:400; font-size:32px; line-height:1.18; color:var(--navy); margin:0 0 16px; }
.feature__text{ font-family:var(--sans); font-weight:300; font-size:14px; line-height:1.85; color:var(--text); margin:0 0 24px; }
.byline{ display:flex; align-items:center; gap:14px; font-family:var(--sans); font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--text-soft); }
.byline span.dot{ width:4px; height:4px; background:var(--gold); transform:rotate(45deg); }

.stories-grid{
  padding:28px var(--gutter) 72px; background:var(--cream);
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
}
.story-card{ background:#fff; border:1px solid var(--line); overflow:hidden; text-decoration:none; color:inherit; transition:box-shadow .25s ease, transform .25s ease; }
.story-card:hover{ box-shadow:0 24px 48px -28px rgba(17,42,71,.55); transform:translateY(-2px); }
.story-card__media{ height:200px; overflow:hidden; }
.story-card__media img{ width:100%; height:100%; object-fit:cover; }
.story-card__body{ padding:24px; }
.story-card__region{ font-family:var(--sans); font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:11px; }
.story-card__title{ font-family:var(--serif); font-weight:400; font-size:20px; line-height:1.25; color:var(--navy); margin:0 0 10px; }
.story-card__text{ font-family:var(--sans); font-weight:300; font-size:12.5px; line-height:1.7; color:var(--text); margin:0 0 18px; }
.story-card__meta{ font-family:var(--sans); font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--text-soft); }

/* ============================================================
   THE EXPERIENCE
   ============================================================ */
.steps{ padding:24px var(--gutter) 36px; background:#fff; }
.step{
  display:grid; grid-template-columns:120px 1fr; gap:40px;
  padding:40px 0; border-bottom:1px solid var(--line-soft); align-items:start;
}
.step:last-child{ border-bottom:none; }
.step__num{ font-family:var(--serif); font-size:40px; color:var(--gold); }
.step__body{ max-width:680px; }
.step__title{ font-family:var(--serif); font-weight:400; font-size:26px; color:var(--navy); margin:0 0 12px; }
.step__text{ font-family:var(--sans); font-weight:300; font-size:14.5px; line-height:1.9; color:var(--text); margin:0; }

.value-band{ padding:72px var(--gutter); background:radial-gradient(120% 130% at 50% 0%, var(--navy-grad-from) 0%, var(--navy-deep) 70%); text-align:center; }
.value-band p{ font-family:var(--editorial); font-weight:500; font-style:italic; font-size:30px; line-height:1.5; color:var(--ivory); margin:0 auto; max-width:760px; }
.rule-divider{ display:flex; align-items:center; justify-content:center; gap:14px; margin-top:28px; }
.rule-divider span.line{ width:40px; height:1px; background:var(--gold-soft); }
.rule-divider span.dia{ width:5px; height:5px; background:var(--gold-light); transform:rotate(45deg); }

.cta-band{ padding:76px var(--gutter); background:var(--ivory); text-align:center; }
.cta-band h2{ font-family:var(--serif); font-weight:400; font-size:36px; color:var(--navy); margin:0 0 14px; }
.cta-band p{ font-family:var(--editorial); font-style:italic; font-size:21px; color:var(--text); margin:0 0 30px; }

/* ============================================================
   ABOUT
   ============================================================ */
.about-split{ display:grid; grid-template-columns:1fr 1fr; background:#fff; }
.about-split__media{ position:relative; min-height:520px; overflow:hidden; }
.about-split__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.about-split__body{ padding:72px; display:flex; flex-direction:column; justify-content:center; }
.about-split__title{ font-family:var(--serif); font-weight:400; font-size:38px; line-height:1.14; color:var(--navy); margin:0 0 22px; }
.about-split__intro{ font-family:var(--editorial); font-weight:500; font-size:21px; line-height:1.6; color:var(--ink-soft); margin:0 0 16px; }
.about-split__text{ font-family:var(--sans); font-weight:300; font-size:14px; line-height:1.9; color:var(--text); margin:0; }

.stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.stat{ background:var(--cream); padding:46px; text-align:center; }
.stat__num{ font-family:var(--serif); font-size:42px; color:var(--navy); }
.stat__label{ font-family:var(--sans); font-size:11px; letter-spacing:2.5px; text-transform:uppercase; color:var(--text-soft); margin-top:8px; }

.ethos{ padding:76px var(--gutter); background:#fff; text-align:center; }
.ethos p{ font-family:var(--editorial); font-style:italic; font-weight:500; font-size:27px; line-height:1.55; color:var(--ink-soft); margin:0 auto; max-width:720px; }
.ethos .eyebrow{ display:block; margin-top:22px; }

/* ============================================================
   CONTACT
   ============================================================ */
.contact-split{ display:grid; grid-template-columns:1fr 1fr; }
.contact-form{ padding:64px 64px 64px var(--gutter); background:#fff; }
.contact-form h1{ font-family:var(--serif); font-weight:400; font-size:40px; line-height:1.1; color:var(--navy); margin:14px 0 14px; }
.contact-form__intro{ font-family:var(--sans); font-weight:300; font-size:14px; line-height:1.85; color:var(--text); margin:0 0 34px; max-width:440px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:18px; }
.field{ margin-bottom:18px; }
.field__label{ display:block; font-family:var(--sans); font-size:9px; letter-spacing:1.5px; text-transform:uppercase; color:var(--label); margin-bottom:8px; }
.field__input{
  width:100%;
  border:1px solid var(--line-mid);
  padding:13px 14px;
  font-family:var(--sans); font-size:13px; color:var(--ink);
  background:#fff;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.field__input::placeholder{ color:var(--text-soft); }
.field__input:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(192,150,74,.16); }
textarea.field__input{ min-height:96px; resize:vertical; }
.field-row .field{ margin-bottom:0; }

.contact-details{
  position:relative;
  padding:64px var(--gutter) 64px 64px;
  background:radial-gradient(120% 130% at 80% 0%, var(--navy-grad-from) 0%, var(--navy-deep) 72%);
}
.contact-details__emblem{ margin-bottom:40px; }
.contact-details__rows{ display:flex; flex-direction:column; gap:28px; }
.contact-details__kicker{ font-family:var(--sans); font-size:10px; letter-spacing:2.5px; text-transform:uppercase; color:var(--gold); margin-bottom:9px; }
.contact-details__email{ font-family:var(--serif); font-size:24px; color:var(--ivory); text-decoration:none; }
.contact-details__email:hover{ text-decoration:underline; }
.contact-details__hours{ font-family:var(--sans); font-weight:300; font-size:15px; line-height:1.7; color:rgba(244,238,225,.85); }
.contact-details__accred{ margin-top:40px; padding-top:28px; border-top:1px solid rgba(255,255,255,.14); font-family:var(--sans); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:rgba(244,238,225,.6); }

/* ============================================================
   HOME — HERO
   ============================================================ */
.hero{ position:relative; height:620px; overflow:hidden; background:var(--navy-deep); }
.hero img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero__scrim{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,18,30,.46) 0%, rgba(8,18,30,.30) 40%, rgba(8,18,30,.62) 100%); pointer-events:none; }
.hero__inner{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:0 40px; }
.hero__title{ font-family:var(--serif); font-weight:400; font-size:46px; line-height:1.18; letter-spacing:.5px; color:#fff; margin:0; max-width:880px; text-wrap:balance; }
.hero__lede{ font-family:var(--editorial); font-style:italic; font-weight:500; font-size:21px; color:rgba(255,255,255,.9); margin:20px 0 0; max-width:600px; }
.hero__actions{ display:flex; gap:16px; margin-top:36px; flex-wrap:wrap; justify-content:center; }

/* hero / extra buttons */
.btn--gold{ color:var(--navy); background:var(--gold); border:1px solid var(--gold); }
.btn--gold:hover{ background:#cda55b; color:var(--navy); }
.btn--ghost{ color:#fff; border:1px solid rgba(255,255,255,.6); background:transparent; }
.btn--ghost:hover{ background:rgba(255,255,255,.12); color:#fff; }
.btn--sm{ font-size:12px; letter-spacing:2.5px; padding:15px 30px; }
.btn--compact{ padding:14px 28px; }

/* hero emblem (large, white) */
.emblem--white{ border-color:rgba(255,255,255,.9); }
.emblem--white .emblem__name,
.emblem--white .emblem__sub{ color:#fff; }
.emblem--white .emblem__wall::before,
.emblem--white .emblem__wall::after{ background:rgba(255,255,255,.9); }
.emblem--white .emblem__tag{ color:#E7C77E; }
.emblem--hero{ padding:26px 56px 32px; margin-bottom:42px; }
.emblem--hero .emblem__name{ font-size:40px; letter-spacing:9px; padding-left:9px; }
.emblem--hero .emblem__sub{ font-size:10px; letter-spacing:7px; margin-top:8px; padding-left:6px; }
.emblem--hero .emblem__tag{ font-size:9px; letter-spacing:2.2px; padding:0 12px; }

/* ============================================================
   HOME — BOOKING ENGINE
   ============================================================ */

/* ============================================================
   HOME — INTRO SPLIT
   ============================================================ */
.intro-split{ padding:88px var(--gutter); display:grid; grid-template-columns:.9fr 1.1fr; gap:64px; align-items:start; background:var(--cream); }
.intro-split h2{ font-family:var(--serif); font-weight:400; font-size:38px; line-height:1.16; color:var(--navy); margin:0; }
.intro-split__lead{ font-family:var(--editorial); font-weight:500; font-size:22px; line-height:1.6; color:var(--ink-soft); margin:0 0 18px; }
.intro-split__text{ font-family:var(--sans); font-weight:300; font-size:14.5px; line-height:1.9; color:var(--text); margin:0; }

/* ============================================================
   HOME — THE CKMS DIFFERENCE
   ============================================================ */
.section-head{ text-align:center; margin-bottom:56px; }
.section-head h2{ font-family:var(--serif); font-weight:400; font-size:34px; color:var(--navy); margin:0; }
.difference{ padding:84px var(--gutter); background:#fff; }
.difference__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.difference__cell{ background:#fff; padding:44px 36px; }
.difference__num{ font-family:var(--serif); font-size:26px; color:var(--gold); margin-bottom:18px; }
.difference__cell h3{ font-family:var(--serif); font-weight:400; font-size:21px; color:var(--navy); margin:0 0 12px; }
.difference__cell p{ font-family:var(--sans); font-weight:300; font-size:13.5px; line-height:1.85; color:var(--text); margin:0; }

/* ============================================================
   HOME — SAMPLE ITINERARIES
   ============================================================ */
.home-itin{ padding:84px var(--gutter); background:var(--cream); }
.home-itin__head{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:42px; gap:20px; }
.home-itin__head h2{ font-family:var(--serif); font-weight:400; font-size:34px; color:var(--navy); margin:0; }
.home-itin__viewall{ font-family:var(--sans); font-weight:500; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--navy); border-bottom:1px solid var(--gold); padding-bottom:4px; text-decoration:none; white-space:nowrap; }
.home-itin__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }

/* ============================================================
   HOME — SIGNATURE COLLECTIONS (Cruises & Disney)
   ============================================================ */
.signature{ padding:84px var(--gutter); background:#fff; }
.section-head__lede{ font-family:var(--editorial); font-weight:500; font-style:italic; font-size:20px; line-height:1.5; color:var(--text); margin:14px auto 0; max-width:560px; }

.sig-feature{ display:grid; grid-template-columns:.95fr 1.05fr; gap:54px; align-items:center; margin-bottom:80px; }
.sig-feature--reverse{ grid-template-columns:1.05fr .95fr; margin-bottom:0; }
.sig-feature__media{ position:relative; height:420px; background:var(--navy-deep); overflow:hidden; }
.sig-feature__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.sig-badge{ position:absolute; top:16px; left:16px; background:rgba(12,31,54,.82); color:var(--ivory); font-family:var(--sans); font-size:9px; letter-spacing:2.5px; text-transform:uppercase; padding:7px 13px; }
.sig-feature__body h3{ font-family:var(--serif); font-weight:400; font-size:30px; line-height:1.2; color:var(--navy); margin:0 0 16px; }
.sig-feature__text{ font-family:var(--sans); font-weight:300; font-size:14px; line-height:1.9; color:var(--text); margin:0 0 26px; }

.sig-list{ border-top:1px solid var(--line); }
.sig-list__row{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 0; border-bottom:1px solid var(--line); text-decoration:none; color:inherit; transition:transform .2s ease; }
.sig-list__row:hover{ transform:translateX(8px); }
.sig-list__title{ font-family:var(--serif); font-size:18px; color:var(--navy); }
.sig-list__sub{ font-family:var(--sans); font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--text-soft); margin-top:4px; }
.sig-list__view{ font-family:var(--sans); font-weight:500; font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:var(--navy); white-space:nowrap; }

.sig-disney-world{ margin-top:54px; }
.sig-divider{ display:flex; align-items:center; gap:16px; margin-bottom:28px; }
.sig-divider__label{ font-family:var(--sans); font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--text-soft); white-space:nowrap; }
.sig-divider__line{ flex:1; height:1px; background:var(--line); }
.sig-park-grid{
  display:flex; gap:16px; overflow-x:auto; padding-bottom:16px;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  scrollbar-width:thin; scrollbar-color:var(--gold) var(--line);
}
.sig-park-grid::-webkit-scrollbar{ height:6px; }
.sig-park-grid::-webkit-scrollbar-track{ background:var(--line); }
.sig-park-grid::-webkit-scrollbar-thumb{ background:var(--gold); border-radius:3px; }
.sig-park{ position:relative; flex:0 0 280px; height:300px; overflow:hidden; background:var(--navy-deep); scroll-snap-align:start; text-decoration:none; color:inherit; display:block; }
.sig-park img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.sig-park__scrim{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,18,30,.15) 30%, rgba(8,18,30,.82) 100%); }
.sig-park__body{ position:absolute; left:0; right:0; bottom:0; padding:22px 20px; }
.sig-park__region{ font-family:var(--sans); font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--gold-light); margin-bottom:8px; }
.sig-park__title{ font-family:var(--serif); font-weight:400; font-size:21px; line-height:1.15; color:#fff; margin:0 0 8px; }
.sig-park__desc{ font-family:var(--sans); font-weight:300; font-size:11.5px; line-height:1.6; color:rgba(255,255,255,.82); margin:0; }

/* ============================================================
   HOME — QUOTE BAND
   ============================================================ */
.quote-band{ position:relative; padding:96px var(--gutter); background:radial-gradient(120% 130% at 50% 0%, var(--navy-grad-from) 0%, var(--navy-deep) 70%); text-align:center; overflow:hidden; }
.quote-band__mark{ font-family:var(--serif); font-size:120px; color:rgba(216,184,119,.16); line-height:.6; height:54px; }
.quote-band p{ font-family:var(--editorial); font-weight:500; font-style:italic; font-size:34px; line-height:1.45; color:var(--ivory); margin:0 auto; max-width:860px; }

/* ============================================================
   HOME — PROMO SPLIT ("Time is your most valuable resource")
   ============================================================ */
.promo-split{ display:grid; grid-template-columns:1fr 1fr; background:#fff; }
.promo-split__media{ position:relative; min-height:480px; background:var(--navy-deep); }
.promo-split__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.promo-split__body{ padding:84px 72px; display:flex; flex-direction:column; justify-content:center; }
.promo-split__body h2{ font-family:var(--serif); font-weight:400; font-size:36px; line-height:1.18; color:var(--navy); margin:0 0 22px; }
.promo-split__lead{ font-family:var(--editorial); font-weight:500; font-size:21px; line-height:1.6; color:var(--ink-soft); margin:0 0 16px; }
.promo-split__text{ font-family:var(--sans); font-weight:300; font-size:14px; line-height:1.9; color:var(--text); margin:0 0 32px; }
.promo-split .btn{ align-self:flex-start; }

/* ============================================================
   HOME — FULL FOOTER
   ============================================================ */
.home-footer{ background:var(--navy-deep); padding:60px var(--gutter) 36px; }
.home-footer__cols{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,.12); }
.home-footer__tagline{ font-family:var(--editorial); font-style:italic; font-size:16px; color:rgba(244,238,225,.6); margin:24px 0 0; max-width:240px; }
.home-footer__col-title{ font-family:var(--sans); font-size:10px; letter-spacing:2.5px; text-transform:uppercase; color:var(--gold); margin-bottom:18px; }
.home-footer__links{ display:flex; flex-direction:column; gap:11px; font-family:var(--sans); font-weight:300; font-size:13px; color:rgba(244,238,225,.75); }
.home-footer__links a{ color:inherit; text-decoration:none; }
.home-footer__links a:hover{ color:var(--ivory); }
.home-footer__bottom{ display:flex; justify-content:space-between; align-items:center; padding-top:24px; font-family:var(--sans); font-size:11px; color:rgba(244,238,225,.45); letter-spacing:.5px; gap:16px; flex-wrap:wrap; }
.home-footer__bottom .legal-links{ display:flex; gap:24px; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  :root{ --gutter:40px; }
  .intro-split{ grid-template-columns:1fr; gap:32px; }
  .promo-split{ grid-template-columns:1fr; }
  .promo-split__media{ min-height:320px; }
  .sig-feature, .sig-feature--reverse{ grid-template-columns:1fr; gap:32px; }
  .sig-feature__media{ height:340px; }
  .home-footer__cols{ grid-template-columns:1fr 1fr; gap:32px; }
  .itin-body{ grid-template-columns:1fr; gap:40px; }
  .itin-journey__grid{ grid-template-columns:1fr; gap:48px; }
  .journey-aside{ position:static; top:auto; }
  .journey-map{ max-width:100%; margin:0 0 32px; }
  .journey-map__canvas{ height:380px; }
  .feature{ grid-template-columns:1fr; }
  .about-split{ grid-template-columns:1fr; }
  .about-split__media{ min-height:340px; }
  .contact-split{ grid-template-columns:1fr; }
}
@media (max-width:860px){
  .site-nav{ flex-wrap:wrap; gap:16px; padding:16px 24px; }
  .site-nav__links{ order:3; width:100%; gap:18px; flex-wrap:wrap; justify-content:center; }
  .dest-grid, .stories-grid, .home-itin__grid{ grid-template-columns:1fr 1fr; }
  .stats{ grid-template-columns:1fr; }
  .step{ grid-template-columns:64px 1fr; gap:24px; }
  .gallery{ grid-template-columns:1fr; }
  .page-head__title{ font-size:34px; }
  .itin-hero__title{ font-size:36px; }
  .site-footer{ flex-direction:column; gap:18px; text-align:center; }
  .difference__grid{ grid-template-columns:1fr; }
  .hero__title{ font-size:32px; }
}
@media (max-width:560px){
  .dest-grid, .stories-grid, .home-itin__grid{ grid-template-columns:1fr; }
  .field-row{ grid-template-columns:1fr; }
  .about-split__body{ padding:48px 28px; }
  .contact-form{ padding:48px 28px; }
  .contact-details{ padding:48px 28px; }
  .home-footer__cols{ grid-template-columns:1fr; }
  .home-itin__head{ flex-direction:column; align-items:flex-start; gap:16px; }
  .promo-split__body{ padding:48px 28px; }
  .intro-split{ padding:56px 28px; }
  .signature{ padding:56px 28px; }
}

/* ============================================================
   AESTHETIC REFINEMENTS — motion, depth & micro-interactions
   (on-brand luxury/editorial; progressive, accessible)
   ============================================================ */

html{ scroll-behavior:smooth; }
body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
::selection{ background:var(--gold); color:#fff; }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

/* --- Sticky nav with elevation on scroll --- */
.site-nav{ position:sticky; top:0; z-index:50; transition:box-shadow .35s ease; }
.site-nav--scrolled{ box-shadow:0 12px 30px -20px rgba(17,42,71,.5); }

/* --- Animated gold underline on nav links --- */
.site-nav__links a{ position:relative; }
.site-nav__links a.is-active{ border-bottom:none; }
.site-nav__links a::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px;
  background:var(--gold); transform:scaleX(0); transform-origin:left center;
  transition:transform .35s cubic-bezier(.2,.6,.2,1);
}
.site-nav__links a:hover::after,
.site-nav__links a.is-active::after{ transform:scaleX(1); }

/* --- Buttons & CTA: subtle lift --- */
.btn{ transition:opacity .2s ease, background .2s ease, color .2s ease, transform .25s ease, box-shadow .25s ease; }
.btn:hover{ transform:translateY(-2px); box-shadow:0 16px 32px -18px rgba(17,42,71,.55); }
.btn:active{ transform:translateY(0) scale(.98); box-shadow:0 6px 16px -12px rgba(17,42,71,.5); }
.site-nav__cta{ transition:background .2s ease, color .2s ease, transform .2s ease; }
.site-nav__cta:hover{ transform:translateY(-1px); }

/* --- Card imagery: slow zoom on hover --- */
.dest-card__media, .story-card__media, .feature__media{ overflow:hidden; }
.dest-card__media img, .story-card__media img, .sig-park img,
.feature__media img, .gallery div img,
.promo-split__media img, .about-split__media img{
  transition:transform .5s cubic-bezier(.2,.6,.2,1);
}
@media (hover:hover) and (pointer:fine){
  .dest-card:hover .dest-card__media img,
  .story-card:hover .story-card__media img,
  .sig-park:hover img,
  .feature:hover .feature__media img,
  .gallery div:hover img{ transform:scale(1.06); }
  .promo-split:hover .promo-split__media img,
  .about-split:hover .about-split__media img{ transform:scale(1.04); }
}

/* --- Sig-list rows: refined hover --- */
.sig-list__row .sig-list__view{ transition:transform .25s ease; }
.sig-list__row:hover .sig-list__view{ transform:translateX(4px); }

/* --- Orchestrated hero reveal + slow Ken Burns --- */
@keyframes ckmsRise{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }
@keyframes ckmsKen{ from{ transform:scale(1.0); } to{ transform:scale(1.09); } }
.hero__inner{ z-index:2; }
.hero__inner > *{ opacity:0; animation:ckmsRise .9s cubic-bezier(.2,.6,.2,1) both; }
.hero__inner > *:nth-child(1){ animation-delay:.15s; }
.hero__inner > *:nth-child(2){ animation-delay:.30s; }
.hero__inner > *:nth-child(3){ animation-delay:.45s; }
.hero__inner > *:nth-child(4){ animation-delay:.60s; }
.hero img{ animation:ckmsKen 18s ease-out both; }
.itin-hero img{ animation:ckmsKen 18s ease-out both; }
.itin-hero__caption{ animation:ckmsRise 1s cubic-bezier(.2,.6,.2,1) both; animation-delay:.2s; }
.page-head .eyebrow{ animation:ckmsRise .8s cubic-bezier(.2,.6,.2,1) both; animation-delay:.1s; }
.page-head__title{ animation:ckmsRise .9s cubic-bezier(.2,.6,.2,1) both; animation-delay:.22s; }

/* --- Depth: hero vignette + faint grain on dark sections --- */
.hero::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(120% 95% at 50% 28%, transparent 55%, rgba(8,18,30,.40) 100%);
}
.quote-band::after, .page-head::after, .home-footer::after{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:140px 140px;
}
.home-footer{ position:relative; }
.quote-band > *, .page-head > *, .home-footer > *{ position:relative; z-index:1; }

/* --- Scroll reveal (activated by site.js; content always visible without JS) --- */
.reveal-ready [data-reveal]{
  opacity:0; transform:translateY(24px);
  transition:opacity .6s ease, transform .6s cubic-bezier(.2,.6,.2,1);
  will-change:opacity, transform;
}
.reveal-ready [data-reveal].in{ opacity:1; transform:none; will-change:auto; }

/* --- Respect reduced-motion --- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
  .reveal-ready [data-reveal]{ opacity:1 !important; transform:none !important; }
  .hero__inner > *, .hero img, .itin-hero img, .itin-hero__caption,
  .page-head .eyebrow, .page-head__title{ animation:none !important; opacity:1 !important; transform:none !important; }
}

/* ============================================================
   STORY ARTICLES (editorial long-form)
   ============================================================ */
.article{ max-width:720px; margin:0 auto; padding:64px var(--gutter) 84px; }
.article__byline{ font-family:var(--sans); font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--text-soft); margin-bottom:32px; }
.article__lead{ font-family:var(--editorial); font-style:italic; font-weight:500; font-size:23px; line-height:1.55; color:var(--ink-soft); margin:0 0 26px; }
.article p{ font-family:var(--editorial); font-weight:500; font-size:19px; line-height:1.75; color:var(--ink-soft); margin:0 0 20px; }
.article h2{ font-family:var(--serif); font-weight:400; font-size:24px; color:var(--navy); margin:40px 0 14px; }
.article__quote{ margin:36px 0; padding:4px 0 4px 26px; border-left:2px solid var(--gold); font-family:var(--editorial); font-style:italic; font-weight:500; font-size:25px; line-height:1.4; color:var(--navy); }
.article__back{ margin-top:52px; padding-top:24px; border-top:1px solid var(--line); }
.article__back a{ font-family:var(--sans); font-weight:500; font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:var(--navy); text-decoration:none; transition:color .2s ease; }
.article__back a:hover{ color:var(--gold-dark); }

/* ============================================================
   ENQUIRY WIZARD (multi-step, branched)
   ============================================================ */
.wizard__progress{ margin:4px 0 30px; }
.wizard__bar{ height:2px; background:var(--line); position:relative; overflow:hidden; }
.wizard__bar span{ display:block; height:100%; width:20%; background:var(--gold); transition:width .45s cubic-bezier(.2,.6,.2,1); }
.wizard__count{ font-family:var(--sans); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--text-soft); margin-top:10px; }
.wizard__count b{ color:var(--navy); font-weight:500; }

.wiz-step{ border:0; margin:0; padding:0; min-inline-size:0; }
.wiz-step:not(.is-active){ display:none; }
.wiz-step__q{ font-family:var(--serif); font-weight:400; font-size:25px; line-height:1.25; color:var(--navy); margin:0 0 22px; padding:0; }

.wiz-choices{ display:grid; gap:12px; }
.wiz-choice{ position:relative; display:block; border:1px solid var(--line-mid); padding:16px 18px; cursor:pointer; transition:border-color .2s ease, box-shadow .2s ease, background .2s ease; }
.wiz-choice:hover{ border-color:var(--gold); }
.wiz-choice input{ position:absolute; opacity:0; inset:0; width:100%; height:100%; cursor:pointer; }
.wiz-choice:has(input:checked){ border-color:var(--gold); background:#fff; box-shadow:inset 0 0 0 1px var(--gold); }
.wiz-choice__t{ display:block; font-family:var(--serif); font-size:18px; color:var(--navy); }
.wiz-choice__d{ display:block; font-family:var(--sans); font-weight:300; font-size:13px; line-height:1.5; color:var(--text); margin-top:3px; }

.field__opt{ text-transform:none; letter-spacing:0; color:var(--text-soft); font-weight:300; }

/* Itinerary-aware context banner (shown when the wizard is opened from a set itinerary) */
.wiz-context{ display:flex; flex-wrap:wrap; align-items:baseline; gap:5px 12px; margin:0 0 28px; padding:15px 20px; background:var(--cream); border:1px solid var(--line); border-left:3px solid var(--gold); animation:ckmsRise .5s cubic-bezier(.2,.6,.2,1) both; }
.wiz-context__eyebrow{ font-family:var(--sans); font-size:10px; letter-spacing:2.5px; text-transform:uppercase; color:var(--gold); }
.wiz-context__name{ font-family:var(--serif); font-size:19px; line-height:1.2; color:var(--navy); }
.wiz-context__note{ flex-basis:100%; font-family:var(--sans); font-size:12px; line-height:1.5; color:var(--text-soft); }
select.field__input{ background:#fff; cursor:pointer; }

.wizard__nav{ display:flex; align-items:center; gap:12px; margin-top:30px; }
#wizNext, #wizSend{ margin-left:auto; }

/* ============================================================
   CINEMATIC VIDEO MEDIA (autoplay loops — Audley-style)
   Plays via site.js only; degrades to the poster image with no
   JS or under prefers-reduced-motion.
   ============================================================ */
.hero__media{ position:absolute; inset:0; }
.hero video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1.2s ease-in-out; }
.hero__media video.is-active{ opacity:1; }
.sig-feature__media video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.dest-card__media video{ display:block; width:100%; height:100%; object-fit:cover; }
.dest-card__media video, .sig-feature__media video{ transition:transform .5s cubic-bezier(.2,.6,.2,1); }
@media (hover:hover) and (pointer:fine){
  .dest-card:hover .dest-card__media video{ transform:scale(1.06); }
}

/* ============================================================
   MOBILE NAV — hamburger toggle + full-screen overlay
   JS (site.js) injects the toggle button and the overlay;
   CSS here only declares their appearance.
   ============================================================ */
.nav-toggle{
  display:none; background:none; border:none; cursor:pointer;
  padding:8px 4px; flex-direction:column; gap:5px;
  align-items:center; justify-content:center; flex-shrink:0;
}
.nav-toggle__bar{
  display:block; width:22px; height:1.5px; background:var(--navy);
  transition:transform .3s ease, opacity .2s ease;
}
.nav-overlay{
  position:fixed; inset:0; z-index:100; background:var(--cream);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:80px 40px 56px;
  opacity:0; pointer-events:none;
  transition:opacity .28s cubic-bezier(.2,.6,.2,1);
  overflow-y:auto;
}
.nav-overlay.is-open{ opacity:1; pointer-events:all; }
.nav-overlay__close{
  position:absolute; top:16px; right:20px;
  background:none; border:none; cursor:pointer;
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  color:var(--navy); font-size:26px; line-height:1;
  font-family:var(--sans); font-weight:300; padding:0;
}
.nav-overlay__links{
  display:flex; flex-direction:column; align-items:center;
  width:100%; max-width:300px;
  border-top:1px solid var(--line-warm);
}
.nav-overlay__links a{
  display:flex; align-items:center; justify-content:center;
  min-height:62px; width:100%;
  font-family:var(--serif); font-size:24px; font-weight:400; line-height:1;
  color:var(--navy); text-decoration:none;
  border-bottom:1px solid var(--line-warm);
  transition:color .2s ease;
}
.nav-overlay__links a:hover,
.nav-overlay__links a.is-active{ color:var(--gold-dark); }
.nav-overlay__cta{ margin-top:36px; min-width:200px; text-align:center; }

/* ---- activate hamburger at ≤ 768px ---- */
@media (max-width:768px){
  .nav-toggle{ display:flex; }
  .nav-js .site-nav__links,
  .nav-js .site-nav__cta{ display:none; }
  .site-nav{ padding:14px 20px; flex-wrap:nowrap; gap:0; justify-content:space-between; }
}

/* ============================================================
   BREAKPOINT 560px — mobile typography & spacing
   (adds to the earlier 560px block above)
   ============================================================ */
@media (max-width:560px){
  :root{ --gutter:20px; }

  /* Hero heights */
  .hero{ height:500px; }
  .itin-hero{ height:320px; }
  .itin-hero__caption{ bottom:28px; }
  /* Keep the hero eyebrow to one line so it never crowds the title */
  .itin-hero__eyebrow{ font-size:10px; letter-spacing:2px; line-height:1.5; margin-bottom:10px; }

  /* Scale headline type */
  .hero__title{ font-size:28px; }
  .hero__lede{ font-size:17px; margin-top:14px; }
  .hero__actions{ margin-top:24px; gap:12px; }
  .itin-hero__title{ font-size:26px; }
  .page-head__title{ font-size:26px; }
  .stories-head h1{ font-size:28px; }
  .itin-intro{ font-size:19px; }
  .quote-band p{ font-size:21px; }
  .value-band p{ font-size:19px; }
  .cta-band h2{ font-size:24px; }
  .cta-band p{ font-size:17px; }

  /* Trim excessive vertical padding */
  .difference{ padding:52px var(--gutter); }
  .difference__cell{ padding:26px 18px; }
  .home-itin{ padding:52px var(--gutter); }
  .quote-band{ padding:58px var(--gutter); }
  .quote-band__mark{ font-size:80px; height:36px; }
  .value-band{ padding:52px var(--gutter); }
  .cta-band{ padding:52px var(--gutter); }
  .ethos{ padding:52px var(--gutter); }
  .itin-journey{ padding:44px var(--gutter); }
  .itin-body{ padding:44px var(--gutter); }
  .steps{ padding:16px var(--gutter) 28px; }
  .stat{ padding:28px 16px; }
  .page-head{ padding:52px var(--gutter) 44px; }

  /* Map */
  .journey-map__canvas{ height:290px; }

  /* Sig-feature media shorter on mobile */
  .sig-feature__media{ height:260px; }

  /* Hero emblem: hidden on mobile — the CKMS logo already sits in the nav,
     and the decorative box's tag + border corners don't hold up at phone
     widths. The hero title carries the brand here instead. */
  .emblem--hero{ display:none; }

  /* Filters bar: stack chips + sort vertically */
  .filters{ flex-direction:column; gap:10px; align-items:flex-start; }

  /* Touch targets for filter chips (min 44px) */
  .chip{ min-height:44px; display:inline-flex; align-items:center; }

  /* Nav CTA touch target */
  .site-nav__cta{ padding:13px 16px; }
}

/* ============================================================
   SPECIALISTS PAGE
   ============================================================ */
.specialists-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:2px; }
.specialist-card{ background:var(--cream); padding:60px 56px; }
.specialist-card--navy{ background:var(--navy); }
.specialist-card__top{ display:flex; align-items:center; gap:24px; margin-bottom:32px; }
.specialist-card__portrait{ width:92px; height:92px; border-radius:50%; overflow:hidden; border:2.5px solid var(--gold); flex-shrink:0; }
.specialist-card__portrait img{ width:100%; height:100%; object-fit:cover; }
.specialist-card__meta{ flex:1; }
.specialist-card__name{ font-family:var(--serif); font-size:26px; font-weight:400; color:var(--navy); margin:0 0 4px; line-height:1.1; }
.specialist-card--navy .specialist-card__name{ color:var(--ivory); }
.specialist-card__role{ font-family:var(--sans); font-size:10.5px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); }
.specialist-card__tags{ display:flex; flex-wrap:wrap; gap:7px; margin-bottom:24px; }
.specialist-card__tag{ font-family:var(--sans); font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:var(--text-soft); background:var(--ivory); border:1px solid var(--line); padding:4px 10px; }
.specialist-card--navy .specialist-card__tag{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.14); color:rgba(244,238,225,.55); }
.specialist-card__quote{ font-family:var(--editorial); font-style:italic; font-weight:500; font-size:20px; line-height:1.55; color:var(--ink-soft); margin:0 0 18px; padding-left:18px; border-left:2px solid var(--gold); }
.specialist-card--navy .specialist-card__quote{ color:rgba(244,238,225,.88); }
.specialist-card__bio{ font-family:var(--sans); font-weight:300; font-size:14px; line-height:1.75; color:var(--text); margin:0; }
.specialist-card--navy .specialist-card__bio{ color:rgba(244,238,225,.62); }

/* ============================================================
   SPECIALISTS GALLERY CAROUSEL (specialists.html)
   ============================================================ */
.specpix{ padding:80px var(--gutter); background:var(--ivory); }
.specpix__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:28px; margin-bottom:36px; }
.specpix__head-text{ max-width:620px; }
.specpix__head .eyebrow{ display:block; margin-bottom:14px; }
.specpix__head h2{ font-family:var(--serif); font-weight:400; font-size:32px; color:var(--navy); margin:0 0 14px; }
.specpix__sub{ font-family:var(--sans); font-weight:300; font-size:14px; line-height:1.7; color:var(--text); margin:0; }
.specpix__nav{ display:flex; gap:10px; flex-shrink:0; }
.specpix__arrow{ width:48px; height:48px; border-radius:50%; border:1px solid var(--line-mid); background:transparent; color:var(--navy); font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s ease, color .2s ease, border-color .2s ease; }
.specpix__arrow:hover{ background:var(--navy); color:var(--gold); border-color:var(--navy); }
.specpix__arrow:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
.specpix__viewport{ position:relative; }
.specpix__track{ --specpix-w:min(460px,80vw); display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; -webkit-overflow-scrolling:touch; padding:8px calc(50% - (var(--specpix-w) / 2)) 10px; scrollbar-width:none; }
.specpix__track::-webkit-scrollbar{ display:none; }
.specpix__slide{ flex:0 0 auto; width:var(--specpix-w); margin:0; scroll-snap-align:center; }
.specpix__img{ position:relative; aspect-ratio:3/2; overflow:hidden; background:var(--cream); }
.specpix__img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s cubic-bezier(.2,.6,.2,1); }
.specpix__cap{ font-family:var(--editorial); font-style:italic; font-weight:500; font-size:16px; line-height:1.5; color:var(--ink-soft); margin:14px 0 0; padding-left:14px; border-left:2px solid var(--gold); }
/* Center-focus highlight — applied only once JS enhances the carousel,
   so no-JS users still see every photo full-size. */
.specpix.is-enhanced .specpix__slide{ transform:scale(.8); opacity:.45; transition:transform .5s cubic-bezier(.2,.6,.2,1), opacity .5s ease; transform-origin:center center; }
.specpix.is-enhanced .specpix__slide.is-active{ transform:none; opacity:1; }
.specpix.is-enhanced .specpix__slide.is-active .specpix__img{ box-shadow:0 20px 46px rgba(12,31,54,.22); }
.specpix.is-enhanced .specpix__cap{ transition:opacity .5s ease; }
@media(hover:hover) and (pointer:fine){ .specpix__slide.is-active:hover .specpix__img img{ transform:scale(1.05); } }
@media (prefers-reduced-motion: reduce){
  .specpix__track{ scroll-behavior:auto; }
  .specpix.is-enhanced .specpix__slide{ transition:none; }
}
@media (max-width:560px){
  .specpix__head{ flex-direction:column; align-items:flex-start; gap:18px; }
}

/* ============================================================
   SPECIALISTS PREVIEW (about.html)
   ============================================================ */
.specialists-preview{ padding:80px var(--gutter); background:var(--cream); }
.specialists-preview__head{ display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:40px; gap:24px; }
.specialists-preview__head h2{ font-family:var(--serif); font-weight:400; font-size:32px; color:var(--navy); margin:10px 0 0; }
.specialists-preview__link{ font-family:var(--sans); font-weight:500; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--navy); border-bottom:1px solid var(--gold); padding-bottom:3px; text-decoration:none; white-space:nowrap; transition:color .2s ease; }
.specialists-preview__link:hover{ color:var(--gold-dark); }
.specialists-preview__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:2px; }
.specialist-mini{ background:#fff; border:1px solid var(--line); padding:40px 36px; display:flex; flex-direction:column; gap:20px; }
.specialist-mini--navy{ background:var(--navy); border-color:var(--navy); }
.specialist-mini__top{ display:flex; align-items:center; gap:18px; }
.specialist-mini__portrait{ width:72px; height:72px; border-radius:50%; overflow:hidden; border:2px solid var(--gold); flex-shrink:0; }
.specialist-mini__portrait img{ width:100%; height:100%; object-fit:cover; }
.specialist-mini__name{ font-family:var(--serif); font-size:22px; color:var(--navy); margin:0 0 3px; font-weight:400; }
.specialist-mini--navy .specialist-mini__name{ color:var(--ivory); }
.specialist-mini__role{ font-family:var(--sans); font-size:10px; letter-spacing:2.5px; text-transform:uppercase; color:var(--gold); }
.specialist-mini__quote{ font-family:var(--editorial); font-style:italic; font-weight:500; font-size:17px; line-height:1.5; color:var(--ink-soft); margin:0; padding-left:14px; border-left:2px solid var(--gold); }
.specialist-mini--navy .specialist-mini__quote{ color:rgba(244,238,225,.82); }

/* ============================================================
   REVIEWS / TESTIMONIALS
   ============================================================ */
.reviews{ padding:80px var(--gutter); background:var(--ivory); }
.reviews__head{ text-align:center; margin-bottom:52px; }
.reviews__head .eyebrow{ display:block; margin-bottom:14px; }
.reviews__head h2{ font-family:var(--serif); font-weight:400; font-size:34px; color:var(--navy); margin:0; }
.reviews-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.review-card{ background:#fff; padding:36px 30px; border:1px solid var(--line); display:flex; flex-direction:column; }
.review-card__stars{ display:flex; gap:3px; margin-bottom:18px; }
.review-card__star{ color:var(--gold); font-size:14px; }
.review-card__text{ font-family:var(--editorial); font-style:italic; font-weight:500; font-size:17px; line-height:1.65; color:var(--ink-soft); flex:1; margin:0 0 22px; }
.review-card__rule{ height:1px; background:var(--line-soft); margin-bottom:16px; }
.review-card__name{ font-family:var(--sans); font-weight:500; font-size:12.5px; color:var(--navy); }
.review-card__trip{ font-family:var(--sans); font-weight:300; font-size:11.5px; color:var(--text-soft); margin-top:3px; }

/* ============================================================
   IN-TRIP CONCIERGE BAND (experience page)
   ============================================================ */
.concierge-band{ display:grid; grid-template-columns:1fr 1fr; }
.concierge-band__media{ position:relative; min-height:500px; }
.concierge-band__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.concierge-band__body{ background:var(--navy); padding:72px 64px; display:flex; flex-direction:column; justify-content:center; }
.concierge-band__body h2{ font-family:var(--serif); font-weight:400; font-size:32px; color:var(--ivory); margin:18px 0 18px; line-height:1.2; }
.concierge-band__body > p{ font-family:var(--sans); font-weight:300; font-size:14.5px; line-height:1.75; color:rgba(244,238,225,.75); margin:0 0 36px; }
.concierge-items{ display:flex; flex-direction:column; gap:26px; margin-bottom:44px; }
.concierge-item{ display:flex; gap:18px; align-items:flex-start; }
.concierge-item__num{ font-family:var(--serif); font-size:22px; color:var(--gold); flex-shrink:0; width:28px; line-height:1; padding-top:2px; }
.concierge-item__text h4{ font-family:var(--serif); font-size:18px; color:var(--ivory); margin:0 0 5px; font-weight:400; }
.concierge-item__text p{ font-family:var(--sans); font-weight:300; font-size:13px; line-height:1.7; color:rgba(244,238,225,.58); margin:0; }
.concierge-band__body .btn{ align-self:flex-start; }

/* ============================================================
   LOOKBOOK BAND (contact page)
   ============================================================ */
.lookbook-band{ padding:52px var(--gutter); background:var(--cream); border-top:1px solid var(--line); }
.lookbook-inner{ display:grid; grid-template-columns:1fr auto; gap:40px; align-items:center; }
.lookbook-inner__body .eyebrow{ display:block; margin-bottom:12px; }
.lookbook-inner__title{ font-family:var(--serif); font-weight:400; font-size:24px; color:var(--navy); margin:0 0 10px; }
.lookbook-inner__text{ font-family:var(--sans); font-weight:300; font-size:14px; line-height:1.65; color:var(--text); margin:0 0 22px; max-width:480px; }
.lookbook-inner__form{ display:flex; gap:0; max-width:460px; }
.lookbook-inner__form input[type="email"]{ flex:1; font-family:var(--sans); font-size:13px; border:1px solid var(--line-mid); border-right:none; padding:13px 16px; background:#fff; color:var(--ink); outline:none; transition:border-color .2s ease; }
.lookbook-inner__form input[type="email"]:focus{ border-color:var(--gold); border-right:1px solid var(--gold); }
.lookbook-inner__form button{ font-family:var(--sans); font-weight:500; font-size:10px; letter-spacing:2px; text-transform:uppercase; padding:13px 24px; background:var(--navy); color:var(--ivory); border:1px solid var(--navy); cursor:pointer; white-space:nowrap; transition:background .2s ease; flex-shrink:0; }
.lookbook-inner__form button:hover{ background:#173354; }
.lookbook-inner__note{ font-family:var(--sans); font-size:11px; color:var(--text-soft); margin-top:10px; }
.lookbook-visual{ display:flex; flex-direction:column; align-items:center; gap:0; }
.lookbook-visual__book{ width:100px; height:136px; background:var(--navy); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:18px 14px; box-shadow:4px 4px 0 var(--gold-soft); }
.lookbook-visual__name{ font-family:var(--serif); font-size:16px; letter-spacing:4px; color:var(--ivory); }
.lookbook-visual__sub{ font-family:var(--sans); font-size:5px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); }
.lookbook-visual__rule{ width:36px; height:1px; background:var(--gold-soft); margin:4px 0; }
.lookbook-visual__tag{ font-family:var(--sans); font-size:4px; letter-spacing:1px; text-transform:uppercase; color:rgba(216,184,119,.65); }

/* ============================================================
   WHEN TO GO PAGE
   ============================================================ */
.when-head{ padding:72px var(--gutter) 52px; }
.when-head h1{ font-family:var(--serif); font-weight:400; font-size:40px; color:var(--navy); margin:18px 0 20px; }
.when-head p{ font-family:var(--editorial); font-style:italic; font-weight:500; font-size:20px; line-height:1.6; color:var(--text); max-width:580px; margin:0; }
.month-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; }
.month-card{ padding:38px 30px; background:var(--cream); border:1px solid var(--line-soft); }
.month-card__num{ font-family:var(--sans); font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }
.month-card__name{ font-family:var(--serif); font-weight:400; font-size:26px; color:var(--mc-name,var(--navy)); margin:0 0 18px; }
.month-card__picks{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.month-card__pick{ font-family:var(--sans); font-weight:300; font-size:13px; line-height:1.55; color:var(--mc-pick,var(--text)); padding-left:16px; position:relative; }
.month-card__pick::before{ content:'—'; position:absolute; left:0; color:var(--gold); font-size:11px; top:1px; }
.month-card__note{ font-family:var(--sans); font-weight:300; font-size:11.5px; color:var(--mc-note,var(--text-soft)); margin-top:14px; font-style:italic; }
/* The dark "feature" months form a balanced checkerboard at every column
   count — the nth-child set flips per breakpoint so the navy cards never
   clump into a stripe or diagonal. Colours swap via custom properties. */
@media (min-width:1025px){ /* 4 columns */
  .month-card:nth-child(8n+2),.month-card:nth-child(8n+4),.month-card:nth-child(8n+5),.month-card:nth-child(8n+7){ background:var(--navy); border-color:var(--navy); --mc-name:var(--ivory); --mc-pick:rgba(244,238,225,.7); --mc-note:rgba(244,238,225,.42); }
}
@media (min-width:561px) and (max-width:1024px){ /* 3 columns */
  .month-card:nth-child(even){ background:var(--navy); border-color:var(--navy); --mc-name:var(--ivory); --mc-pick:rgba(244,238,225,.7); --mc-note:rgba(244,238,225,.42); }
}
@media (max-width:560px){ /* 2 columns */
  .month-card:nth-child(4n+2),.month-card:nth-child(4n+3){ background:var(--navy); border-color:var(--navy); --mc-name:var(--ivory); --mc-pick:rgba(244,238,225,.7); --mc-note:rgba(244,238,225,.42); }
}

/* === Responsive for new sections === */
@media (max-width:1024px){
  .specialists-grid{ grid-template-columns:1fr; }
  .specialist-card{ padding:44px 36px; }
  .specialists-preview__grid{ grid-template-columns:1fr; }
  .reviews-grid{ grid-template-columns:repeat(2,1fr); }
  .concierge-band{ grid-template-columns:1fr; }
  .concierge-band__media{ min-height:300px; position:relative; }
  .concierge-band__body{ padding:52px 40px; }
  .month-grid{ grid-template-columns:repeat(3,1fr); }
  .lookbook-inner{ grid-template-columns:1fr; }
  .lookbook-visual{ display:none; }
}
@media (max-width:560px){
  .specialist-card{ padding:36px 20px; }
  .specialist-card__top{ flex-direction:column; align-items:flex-start; }
  .reviews-grid{ grid-template-columns:1fr; }
  .filters__set{ flex-direction:column; align-items:flex-start; gap:9px; }
  .filters__legend{ width:auto; }
  .month-grid{ grid-template-columns:repeat(2,1fr); }
  .month-card{ padding:28px 20px; }
  .concierge-band__body{ padding:44px var(--gutter); }
  .lookbook-inner__form{ flex-direction:column; }
  .lookbook-inner__form input[type="email"]{ border-right:1px solid var(--line-mid); border-bottom:none; }
  .specialists-preview__grid{ grid-template-columns:1fr; }
  .specialists-preview__head{ flex-direction:column; align-items:flex-start; gap:12px; }
  .reviews{ padding:56px var(--gutter); }
  .lookbook-band{ padding:44px var(--gutter); }
  .when-head{ padding:52px var(--gutter) 36px; }
  .when-head h1{ font-size:30px; }
}
