/* ============================================================
   Destinations hub — "Dispatches"
   Editorial lookbook: split cover, alternating full-bleed
   destination spreads, an edge-to-edge index strip, an
   outline-numeral ledger and tall cinematic service cards.
   Built from scratch — only theme.css colour + font tokens
   are borrowed. Static only: no JS, no transitions, no
   hover state changes.
   ============================================================ */
.disp{
  --ink:#120F64;         /* indigo — plates, headings */
  --ink-2:#0d0a2e;       /* deeper indigo for image scrims */
  --body:#3d3d48;        /* paragraph */
  --muted:#6f6f7a;       /* meta */
  --gold:#a8880a;        /* readable gold — kickers on light */
  --gold-b:#cea800;      /* brand gold — numerals, rules */
  --yellow:#FFE100;      /* logo yellow — accent on dark */
  --canvas:#FEFDF6;      /* warm-white canvas */
  --sand:#EFEAD3;        /* parchment band */
  --sand-2:#E6E1C1;
  --line:#e3ddc6;        /* warm hairline */
  --scrim:9,7,26;        /* deep indigo scrim rgb */
  background:var(--canvas);
  color:var(--body);
  font-family:var(--font-body);
  display:block;
}
.disp img{border-radius:0;display:block}
.disp h1,.disp h2,.disp h3,.disp h4{font-family:var(--font-display)}
.disp em{font-style:italic}
.dp-wrap{max-width:1320px;margin:0 auto;padding:0 clamp(22px,5vw,68px)}
.dp-kicker{font-size:.72rem;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);display:inline-block}

/* ---------- buttons ---------- */
.dp-btns{display:flex;gap:14px;flex-wrap:wrap}
.dp-btn--solid{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}
.dp-btn--dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.dp-btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.dp-btn--line{background:transparent;color:var(--ink);border-color:var(--ink)}

/* outline display numeral (fashion-editorial) */
.dp-outnum{font-family:var(--font-display);font-weight:800;letter-spacing:-.04em;line-height:.8;
  color:transparent;-webkit-text-stroke:2px var(--gold-b);display:block}

/* ---------- HERO (split) ---------- */
.dp-hero{display:grid;grid-template-columns:1fr 1.05fr;min-height:clamp(600px,90vh,900px)}
.dp-hero-plate{background:var(--ink);color:#fff;display:flex;flex-direction:column;justify-content:center;
  padding:clamp(40px,6vw,88px) clamp(24px,5vw,80px)}
.dp-hero-plate .dp-kicker{color:var(--yellow);margin-bottom:24px}
.dp-hero-plate h1{font-size:clamp(2.6rem,5.2vw,4.9rem);line-height:.98;letter-spacing:-.038em;font-weight:800;color:#fff;margin:0 0 26px;max-width:15ch}
.dp-hero-plate h1 em{color:var(--yellow)}
.dp-hero-plate .lead{font-size:clamp(1.05rem,1.5vw,1.32rem);line-height:1.58;color:rgba(255,255,255,.86);max-width:46ch;margin:0 0 34px}
.dp-hero-ticker{display:flex;gap:clamp(20px,3vw,44px);flex-wrap:wrap;margin-top:clamp(34px,4vw,54px);
  border-top:1px solid rgba(255,255,255,.24);padding-top:22px}
.dp-hero-ticker div{display:flex;flex-direction:column;gap:3px}
.dp-hero-ticker .n{font-family:var(--font-display);font-size:1.5rem;font-weight:800;color:#fff;line-height:1}
.dp-hero-ticker .l{font-family:var(--font-ui);font-size:.62rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--yellow)}
.dp-hero-img{background-color:var(--ink-2);
  background-image:url("/media/destinations/hero-students-walking-lobby-sunlight.jpg?v=5f61229ea5");
  background-position:center;background-size:cover;background-repeat:no-repeat}

/* ---------- FEATURE SPREADS (alternating full-bleed) ---------- */
.dp-spreads{display:block}
.dp-spread{display:grid;grid-template-columns:1.08fr .92fr;min-height:clamp(480px,62vh,760px);text-decoration:none;color:var(--body)}
.dp-spread-img{position:relative;background:var(--ink-2);min-height:340px}
.dp-spread-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dp-spread-txt{display:flex;flex-direction:column;justify-content:center;gap:16px;
  padding:clamp(40px,6vw,96px) clamp(24px,5vw,88px);background:var(--canvas)}
.dp-spread:nth-child(even) .dp-spread-txt{background:var(--sand)}
.dp-spread-top{display:flex;align-items:center;gap:20px}
.dp-spread .dp-outnum{font-size:clamp(3.4rem,6vw,6rem)}
.dp-spread-flag{font-family:var(--font-ui);font-size:.68rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.dp-spread h2{font-size:clamp(2.1rem,4.2vw,3.5rem);line-height:1.02;letter-spacing:-.034em;color:var(--ink);font-weight:800;margin:4px 0 0}
.dp-spread h2 em{color:var(--gold-b)}
.dp-spread p{font-size:1.08rem;line-height:1.62;color:var(--body);max-width:46ch;margin:0}
.dp-spread .go{font-family:var(--font-ui);font-size:.74rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink);border-bottom:2px solid var(--gold-b);padding-bottom:6px;align-self:flex-start;text-decoration:none;margin-top:6px}
/* flip: image on the right */
.dp-spread--flip .dp-spread-img{order:2}
.dp-spread--flip .dp-spread-txt{order:1}

/* ---------- INDEX STRIP (edge-to-edge) ---------- */
.dp-strip-head{max-width:1320px;margin:0 auto;padding:clamp(64px,8vw,110px) clamp(22px,5vw,68px) clamp(26px,3.2vw,42px);
  display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.dp-strip-head h2{font-size:clamp(1.9rem,4vw,3rem);line-height:1.04;letter-spacing:-.03em;color:var(--ink);font-weight:800;margin:12px 0 0}
.dp-strip-head h2 em{color:var(--gold-b)}
.dp-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:2px;background:var(--line)}
a.dp-strip-tile{position:relative;display:block;aspect-ratio:3/4.4;overflow:hidden;text-decoration:none;color:#fff;background:var(--ink)}
.dp-strip-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dp-strip-tile::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(var(--scrim),.92) 0%,rgba(var(--scrim),.32) 48%,rgba(var(--scrim),0) 80%)}
.dp-strip-cap{position:absolute;inset:auto 0 0 0;z-index:2;padding:clamp(16px,1.4vw,22px);display:flex;flex-direction:column;gap:6px}
.dp-strip-cap .idx{font-family:var(--font-ui);font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--yellow)}
.dp-strip-cap .name{font-family:var(--font-display);font-size:clamp(1.15rem,1.4vw,1.4rem);font-weight:800;letter-spacing:-.015em;line-height:1.02;color:#fff}
.dp-strip-cap .hook{font-size:.82rem;line-height:1.36;color:rgba(255,255,255,.82)}

/* ---------- COMPARE (outline-numeral ledger) ---------- */
.dp-compare{padding:clamp(74px,10vw,132px) 0}
.dp-compare .dp-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(34px,6vw,90px);align-items:start}
.dp-compare h2{font-size:clamp(2rem,4.4vw,3.3rem);line-height:1.04;letter-spacing:-.032em;color:var(--ink);font-weight:800;margin:14px 0 18px}
.dp-compare h2 em{color:var(--gold-b)}
.dp-compare-intro{font-size:1.04rem;line-height:1.64;color:var(--body);max-width:38ch}
.dp-ledger{display:flex;flex-direction:column}
.dp-row{display:grid;grid-template-columns:auto 1fr;gap:clamp(22px,3vw,44px);align-items:start;
  padding:clamp(24px,2.8vw,34px) 0;border-top:1px solid var(--line)}
.dp-row:last-child{border-bottom:1px solid var(--line)}
.dp-row .dp-outnum{font-size:clamp(2.4rem,3.4vw,3.4rem)}
.dp-row h3{font-size:clamp(1.2rem,1.7vw,1.5rem);color:var(--ink);font-weight:800;letter-spacing:-.015em;margin:0 0 7px}
.dp-row p{font-size:1rem;line-height:1.6;color:var(--body);margin:0;max-width:56ch}

/* ---------- SERVICES (tall cards on indigo) ---------- */
.dp-svc{background:var(--ink);color:#fff;padding:clamp(74px,10vw,132px) 0}
.dp-svc-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(30px,3.6vw,50px)}
.dp-svc .dp-kicker{color:var(--yellow)}
.dp-svc-head h2{font-size:clamp(2rem,4.2vw,3.2rem);line-height:1.04;letter-spacing:-.03em;color:#fff;font-weight:800;margin:12px 0 0;max-width:16ch}
.dp-svc-head h2 em{color:var(--yellow)}
.dp-svc-head p{font-size:1.02rem;line-height:1.6;color:rgba(255,255,255,.8);max-width:38ch;margin:0}
.dp-svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,1.8vw,24px)}
a.dp-svc-card{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;text-decoration:none;color:#fff;background:var(--ink-2)}
.dp-svc-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dp-svc-card::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(var(--scrim),.94) 0%,rgba(var(--scrim),.46) 48%,rgba(var(--scrim),.06) 82%)}
.dp-svc-cap{position:absolute;inset:auto 0 0 0;z-index:2;padding:clamp(22px,2.2vw,30px);display:flex;flex-direction:column;gap:9px}
.dp-svc-cap .cat{font-family:var(--font-ui);font-size:.64rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--yellow)}
.dp-svc-cap h3{font-size:clamp(1.35rem,1.9vw,1.7rem);line-height:1.1;letter-spacing:-.02em;color:#fff;font-weight:800;margin:0}
.dp-svc-cap p{font-size:.95rem;line-height:1.5;color:rgba(255,255,255,.85);margin:0;max-width:34ch}
.dp-svc-cap .go{font-family:var(--font-ui);font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#fff;border-bottom:2px solid var(--yellow);padding-bottom:5px;align-self:flex-start;margin-top:3px}
.dp-svc-foot{margin-top:clamp(28px,3vw,42px)}

/* ---------- MORE (careers, testimonials, events — light band) ---------- */
.dp-more{background:var(--sand);padding:clamp(74px,10vw,132px) 0}
.dp-more-head{display:flex;justify-content:space-between;align-items:flex-end;gap:clamp(24px,4vw,56px);
  flex-wrap:wrap;margin-bottom:clamp(30px,3.6vw,50px)}
.dp-more-head h2{font-size:clamp(2rem,4.2vw,3.2rem);line-height:1.04;letter-spacing:-.03em;color:var(--ink);font-weight:800;margin:12px 0 0;max-width:16ch}
.dp-more-head h2 em{color:var(--gold-b)}
.dp-more-head p{font-size:1.02rem;line-height:1.6;color:var(--body);max-width:38ch;margin:0}

/* ---------- CLOSING (split plate + image) ---------- */
.dp-close{display:grid;grid-template-columns:1.05fr .95fr;min-height:clamp(460px,60vh,640px)}
.dp-close-img{background-color:var(--ink-2);
  background-image:url("/media/destinations/students-studying-stairs.jpg?v=ea2667c2de");
  background-position:center;background-size:cover;background-repeat:no-repeat}
.dp-close-plate{background:var(--sand);display:flex;flex-direction:column;justify-content:center;
  padding:clamp(44px,6vw,92px) clamp(24px,5vw,80px)}
.dp-close-plate .dp-kicker{color:var(--gold);margin-bottom:18px}
.dp-close-plate h2{font-size:clamp(2.2rem,4.4vw,3.7rem);line-height:1.02;letter-spacing:-.034em;color:var(--ink);font-weight:800;margin:0 0 20px;max-width:15ch}
.dp-close-plate h2 em{color:var(--gold-b)}
.dp-close-plate .lead{font-size:1.08rem;line-height:1.62;color:var(--body);max-width:46ch;margin:0 0 30px}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1040px){
  .dp-hero{grid-template-columns:1fr;min-height:0}
  .dp-hero-img{min-height:clamp(320px,50vw,460px)}
  .dp-spread{grid-template-columns:1fr}
  .dp-spread-img{min-height:clamp(300px,50vw,440px)}
  .dp-spread--flip .dp-spread-img{order:0}
  .dp-spread--flip .dp-spread-txt{order:0}
  .dp-strip{grid-template-columns:repeat(3,1fr)}
  .dp-compare .dp-wrap{grid-template-columns:1fr;gap:32px}
  .dp-svc-grid{grid-template-columns:1fr 1fr}
  .dp-close{grid-template-columns:1fr}
  .dp-close-img{min-height:clamp(300px,50vw,420px);order:2}
  .dp-close-plate{order:1}
}
@media (max-width:600px){
  .dp-strip{grid-template-columns:1fr 1fr}
  .dp-svc-grid{grid-template-columns:1fr;max-width:420px}
  .dp-hero-plate h1{font-size:clamp(2.3rem,10vw,3rem)}
}
