/* ============================================================
   /destinations/us/ — "Open Country"
   Near-black indigo gallery. Image-dominant, text-light editorial
   layout: split-frame hero, overlaid statement plate, numbered
   comparison sheet, staggered contact-sheet service mosaic, and a
   UK-led destination band. Ivory inserts break the dark.

   Built from scratch on brand colours + Plus Jakarta Sans only —
   this page does not use the shared component classes from
   theme.css (.hero, .section-head, .passage, .related-grid …).
   The build wraps every body in <main id="main">, so #main is the
   root: at (1,1,0) every `.usb-` rule beats theme.css's
   element-qualified resets without needing !important.

   Static-only: no JS, no transitions, no pointer- or keyboard-state
   styling, no sticky/parallax, no disclosure elements.
   ============================================================ */

#main{
  --night:#05042A;
  --night-2:#0A0842;
  --indigo:#120F64;
  --gold:#CEA800;
  --yellow:#FFE100;
  --paper:#FDFBF2;
  --line-d:rgba(255,255,255,.16);
  --line-l:#E0D7BE;
  --dim:rgba(255,255,255,.74);
  --dim-2:rgba(255,255,255,.54);
  background:var(--night);
  color:var(--dim);
  font-family:var(--font-body);
  display:block;
  overflow-x:clip;
  font-size:16px;
  line-height:1.66;
}
#main *{box-sizing:border-box}
#main img{display:block;max-width:100%;border-radius:0}
#main h1,#main h2,#main h3,#main h4{font-family:var(--font-display);color:#FFFFFF;font-weight:800;letter-spacing:-.042em;line-height:1.02}
#main p{margin:0}
#main a{color:inherit;text-decoration:none}
#main ul,#main ol{list-style:none;margin:0;padding:0}

/* ── rhythm ───────────────────────────────────────────── */
#main .usb-wrap{max-width:1360px;margin:0 auto;padding:0 clamp(22px,5vw,72px)}
#main .usb-full{position:relative;width:100vw;left:50%;transform:translateX(-50%)}
#main .usb-sec{padding-block:clamp(70px,9vw,142px)}
#main .usb-kick{
  font-family:var(--font-ui);font-size:.66rem;font-weight:800;letter-spacing:.36em;
  text-transform:uppercase;color:var(--yellow);display:inline-flex;align-items:center;
  gap:14px;line-height:1;
}
#main .usb-kick::before{content:"";width:30px;height:1px;background:var(--gold);display:inline-block;flex:none}
#main .usb-em{font-style:italic;color:var(--yellow);font-weight:800;margin-right:.1em}
#main .usb-lede{font-size:clamp(1.05rem,1.4vw,1.28rem);line-height:1.54;color:rgba(255,255,255,.9);font-weight:500;letter-spacing:-.008em}
#main .usb-body{font-size:1rem;line-height:1.74;color:var(--dim)}

/* ivory inserts flip the palette */
#main .usb-ivory{background:var(--paper);color:#4A4668}
#main .usb-ivory h1,#main .usb-ivory h2,#main .usb-ivory h3,#main .usb-ivory h4{color:var(--indigo)}
#main .usb-ivory .usb-lede{color:var(--indigo)}
#main .usb-ivory .usb-body{color:#4A4668}
#main .usb-ivory .usb-kick{color:var(--gold)}

/* ── buttons (no state changes) ───────────────────────── */
#main .usb-btns{display:flex;flex-wrap:wrap;gap:12px}
#main .usb-btn--gold{background:var(--yellow);color:var(--night);border-color:var(--yellow)}
#main .usb-btn--ghost{background:transparent;color:#FFFFFF;border-color:rgba(255,255,255,.4)}

/* ══ 1 · SPLIT HERO ═══════════════════════════════════ */
#main .usb-hero{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);background:var(--night)}
#main .usb-hero-txt{
  padding:clamp(56px,7vw,120px) clamp(26px,4.6vw,84px) clamp(40px,4vw,64px);
  display:flex;flex-direction:column;justify-content:center;
}
#main .usb-hero h1{font-size:clamp(2.8rem,5.4vw,5rem);line-height:.94;letter-spacing:-.052em;margin-top:26px}
#main .usb-hero .usb-lede{margin-top:26px;max-width:42ch}
#main .usb-hero .usb-btns{margin-top:34px}
#main .usb-hero-media{position:relative;min-height:clamp(340px,52vw,700px);background:var(--night-2)}
#main .usb-hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 44%}
#main .usb-hero-stamp{
  position:absolute;left:0;bottom:0;background:var(--yellow);color:var(--night);
  font-family:var(--font-ui);font-size:.63rem;font-weight:800;letter-spacing:.26em;
  text-transform:uppercase;padding:15px 22px;
}
/* fact strip under the hero */
#main .usb-strip{background:var(--night-2);border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d)}
#main .usb-strip-in{display:grid;grid-template-columns:repeat(4,1fr)}
#main .usb-strip-in > div{padding:30px clamp(16px,2.2vw,34px);border-left:1px solid var(--line-d)}
#main .usb-strip-in > div:first-child{border-left:0;padding-left:0}
#main .usb-strip .n{display:block;font-family:var(--font-display);font-size:clamp(1.7rem,2.7vw,2.4rem);font-weight:800;color:var(--yellow);letter-spacing:-.05em;line-height:1}
#main .usb-strip .l{display:block;font-family:var(--font-ui);font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--dim-2);margin-top:12px;line-height:1.55}

/* ══ 2 · STATEMENT PLATE ══════════════════════════════ */
#main .usb-plate{position:relative;background:var(--night-2)}
#main .usb-plate-bg{
  position:absolute;inset:0;
  background-image:linear-gradient(180deg,rgba(5,4,42,.72) 0%,rgba(5,4,42,.58) 42%,rgba(5,4,42,.9) 100%),url("/media/destinations/us/campus-brick-breezeway-silhouettes.jpg?v=ff5332d1d5");
  background-size:cover;background-position:center 40%;
}
#main .usb-plate-in{position:relative;padding-block:clamp(80px,11vw,180px);text-align:center}
#main .usb-plate h2{font-size:clamp(2.2rem,5.4vw,4.4rem);line-height:1;max-width:20ch;margin:26px auto 0}
#main .usb-plate .usb-lede{margin:26px auto 0;max-width:56ch}
/* three ivory fact cards, zero gutter */
#main .usb-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-l)}
#main .usb-case{background:var(--paper);padding:clamp(34px,3.6vw,54px) clamp(26px,2.8vw,40px)}
#main .usb-case .t{display:block;font-family:var(--font-ui);font-size:.63rem;font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
#main .usb-case h3{color:var(--indigo);font-size:clamp(1.2rem,1.8vw,1.5rem);letter-spacing:-.034em;line-height:1.14;margin-top:18px}
#main .usb-case p{color:#4A4668;font-size:.97rem;line-height:1.7;margin-top:14px}

/* ══ 3 · COMPARISON SHEET ═════════════════════════════ */
#main .usb-cmp-grid{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(32px,5vw,86px);align-items:start}
#main .usb-cmp-media{position:relative}
#main .usb-cmp-media img{width:100%;aspect-ratio:4/5.1;object-fit:cover;object-position:center 36%}
#main .usb-cmp-media .cap{
  display:block;font-family:var(--font-ui);font-size:.66rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--dim-2);margin-top:16px;line-height:1.6;
}
#main .usb-pull{border-top:1px solid var(--gold);margin-top:clamp(34px,3.6vw,52px);padding-top:clamp(24px,2.6vw,34px)}
#main .usb-pull .q{
  color:#FFFFFF;font-family:var(--font-display);font-weight:800;letter-spacing:-.034em;
  font-size:clamp(1.24rem,1.9vw,1.62rem);line-height:1.22;
}
#main .usb-pull .c{
  display:block;font-family:var(--font-ui);font-size:.64rem;font-weight:800;letter-spacing:.28em;
  text-transform:uppercase;color:var(--gold);margin-top:20px;
}
#main .usb-cmp h2{font-size:clamp(2rem,4.2vw,3.5rem);margin-top:22px}
#main .usb-cmp .usb-lede{margin-top:22px;max-width:52ch}
#main .usb-cmp ol{margin-top:40px}
#main .usb-cmp li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,2.4vw,38px);padding:26px 0;border-top:1px solid var(--line-d)}
#main .usb-cmp li .ix{
  font-family:var(--font-display);font-size:clamp(1.7rem,2.6vw,2.4rem);font-weight:800;
  letter-spacing:-.06em;line-height:.86;color:transparent;-webkit-text-stroke:1.3px var(--gold);
}
#main .usb-cmp li h3{font-size:clamp(1.08rem,1.5vw,1.3rem);letter-spacing:-.032em;line-height:1.16}
#main .usb-cmp li .usb-body{margin-top:10px;font-size:.96rem;line-height:1.68}

/* ══ 4 · CONTACT-SHEET SERVICE MOSAIC ═════════════════ */
#main .usb-svc-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.64fr);gap:clamp(24px,4vw,64px);align-items:end;padding-bottom:clamp(38px,4.4vw,60px)}
#main .usb-svc-head h2{font-size:clamp(2.1rem,4.4vw,3.7rem);margin-top:22px}
#main .usb-svc-head .usb-body{padding-bottom:6px}
#main .usb-sheet{display:grid;grid-template-columns:repeat(12,1fr);gap:1px;background:var(--line-d)}
#main .usb-frame{position:relative;display:block;background:var(--night-2);overflow:hidden}
#main .usb-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#main .usb-frame-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,4,42,.16) 0%,rgba(5,4,42,.5) 44%,rgba(5,4,42,.95) 100%)}
#main .usb-frame-pad{position:relative;display:flex;flex-direction:column;justify-content:flex-end;height:100%;padding:clamp(22px,2.1vw,32px)}
#main .usb-frame .n{font-family:var(--font-ui);font-size:.6rem;font-weight:800;letter-spacing:.3em;text-transform:uppercase;color:var(--yellow);display:block}
#main .usb-frame h3{font-size:clamp(1.1rem,1.5vw,1.4rem);letter-spacing:-.034em;line-height:1.12;margin-top:12px}
#main .usb-frame .usb-body{font-size:.92rem;line-height:1.6;margin-top:11px;color:rgba(255,255,255,.78)}
#main .usb-frame .cue{
  display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-family:var(--font-ui);
  font-size:.71rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow);
}
/* staggered spans — the contact-sheet rhythm */
#main .usb-frame--a{grid-column:span 5;min-height:clamp(300px,30vw,412px)}
#main .usb-frame--b{grid-column:span 4;min-height:clamp(300px,30vw,412px)}
#main .usb-frame--c{grid-column:span 3;min-height:clamp(300px,30vw,412px)}
#main .usb-frame--d{grid-column:span 3;min-height:clamp(280px,27vw,368px)}
#main .usb-frame--e{grid-column:span 5;min-height:clamp(280px,27vw,368px)}
#main .usb-frame--f{grid-column:span 4;min-height:clamp(280px,27vw,368px)}
#main .usb-frame--g{grid-column:span 7;min-height:clamp(280px,26vw,352px)}
#main .usb-frame--h{grid-column:span 5;min-height:clamp(280px,26vw,352px)}
#main .usb-svc-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding-top:clamp(30px,3.4vw,46px)}
#main .usb-svc-foot .usb-body{max-width:52ch}

/* ══ 5 · FAMILY / ROUTE (ivory) ═══════════════════════ */
#main .usb-route-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:clamp(32px,5vw,86px);align-items:start}
#main .usb-route h2{font-size:clamp(2rem,4.1vw,3.4rem);margin-top:22px}
#main .usb-route .usb-lede{margin-top:22px}
#main .usb-route .usb-body{margin-top:18px}
#main .usb-route-steps{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line-l);border:1px solid var(--line-l)}
#main .usb-step{background:var(--paper);padding:clamp(26px,2.7vw,38px)}
#main .usb-step .ix{
  display:block;font-family:var(--font-display);font-size:clamp(2rem,3vw,2.7rem);font-weight:800;
  letter-spacing:-.06em;line-height:.86;color:transparent;-webkit-text-stroke:1.4px var(--gold);
}
#main .usb-step h3{color:var(--indigo);font-size:1.08rem;letter-spacing:-.03em;margin-top:20px;line-height:1.18}
#main .usb-step p{color:#4A4668;font-size:.94rem;line-height:1.66;margin-top:11px}

/* ══ 6 · DESTINATIONS — UK-led band ═══════════════════ */
#main .usb-dest-wrap{padding-bottom:clamp(34px,4vw,54px)}
#main .usb-dest-head{max-width:70ch}
#main .usb-dest-head h2{font-size:clamp(2rem,4.2vw,3.5rem);margin-top:22px}
#main .usb-dest-head .usb-body{margin-top:20px}
#main .usb-lead{position:relative;display:block;min-height:clamp(400px,42vw,580px);background:var(--night-2);overflow:hidden}
#main .usb-lead img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 52%}
#main .usb-lead-scrim{position:absolute;inset:0;background:linear-gradient(94deg,rgba(5,4,42,.9) 0%,rgba(5,4,42,.72) 38%,rgba(5,4,42,.22) 100%)}
#main .usb-lead-pad{position:relative;display:flex;flex-direction:column;justify-content:flex-end;height:100%;padding:clamp(34px,4vw,64px);min-height:inherit}
#main .usb-lead .fl{font-family:var(--font-ui);font-size:.63rem;font-weight:800;letter-spacing:.3em;text-transform:uppercase;color:var(--yellow);display:block}
#main .usb-lead h3{font-size:clamp(2.2rem,4.6vw,3.8rem);letter-spacing:-.048em;line-height:.98;margin-top:14px}
#main .usb-lead .usb-body{max-width:46ch;margin-top:18px;color:rgba(255,255,255,.86);font-size:1.04rem}
#main .usb-lead .cue{
  display:inline-flex;align-items:center;gap:9px;margin-top:22px;font-family:var(--font-ui);
  font-size:.74rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow);
}
#main .usb-lead-badge{
  position:absolute;left:clamp(34px,4vw,64px);top:clamp(30px,3.4vw,52px);background:var(--yellow);
  color:var(--night);font-family:var(--font-ui);font-size:.6rem;font-weight:800;letter-spacing:.26em;
  text-transform:uppercase;padding:11px 17px;
}
/* narrow destination filmstrip */
#main .usb-strip-dest{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--line-d);border-top:1px solid var(--line-d)}
#main .usb-dtile{position:relative;display:block;background:var(--night-2);min-height:clamp(190px,17vw,244px);overflow:hidden}
#main .usb-dtile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#main .usb-dtile-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,4,42,.18) 0%,rgba(5,4,42,.46) 46%,rgba(5,4,42,.92) 100%)}
#main .usb-dtile-pad{position:relative;display:flex;height:100%;align-items:flex-end;padding:clamp(16px,1.5vw,22px)}
#main .usb-dtile h3{font-size:clamp(.94rem,1.1vw,1.08rem);letter-spacing:-.03em;line-height:1.14}
#main .usb-dtile--more{background:var(--indigo)}
#main .usb-dtile--more h3{color:var(--yellow)}

/* ══ 7 · AFTER THE OFFER (ivory split) ════════════════ */
#main .usb-after{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);background:var(--paper)}
#main .usb-after-body{padding:clamp(48px,6vw,104px) clamp(26px,5vw,84px)}
#main .usb-after h2{color:var(--indigo);font-size:clamp(1.9rem,3.5vw,3rem);margin-top:20px}
#main .usb-after h2 .usb-em{color:var(--gold)}
#main .usb-after .usb-lede{color:var(--indigo);margin-top:20px;max-width:48ch}
#main .usb-after ul{margin-top:34px}
#main .usb-after li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;padding:22px 0;border-top:1px solid var(--line-l)}
#main .usb-after li .k{font-family:var(--font-ui);font-size:.65rem;font-weight:800;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);padding-top:5px}
#main .usb-after li h3{color:var(--indigo);font-size:1.06rem;letter-spacing:-.028em}
#main .usb-after li p{color:#4A4668;font-size:.94rem;margin-top:7px;line-height:1.64}
#main .usb-after-media{position:relative;min-height:clamp(340px,40vw,600px)}
#main .usb-after-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%}

/* ══ 8 · QUESTIONS ════════════════════════════════════ */
#main .usb-q-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.66fr);gap:clamp(24px,4vw,64px);align-items:end;margin-bottom:clamp(38px,4.4vw,58px)}
#main .usb-q-head h2{font-size:clamp(2rem,4.2vw,3.5rem);margin-top:22px}
#main .usb-q-head .usb-body{padding-bottom:6px}
#main .usb-q-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line-d);border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d)}
#main .usb-q{background:var(--night);display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,2.2vw,34px);padding:clamp(26px,2.8vw,40px) clamp(24px,2.6vw,38px)}
#main .usb-q .ix{
  font-family:var(--font-display);font-size:clamp(2rem,3vw,2.8rem);font-weight:800;
  letter-spacing:-.06em;line-height:.84;color:transparent;-webkit-text-stroke:1.4px rgba(255,255,255,.34);
}
#main .usb-q p{color:#FFFFFF;font-size:clamp(1rem,1.2vw,1.1rem);font-weight:600;line-height:1.48;letter-spacing:-.02em}

/* ══ 9 · CLOSE ════════════════════════════════════════ */
#main .usb-close{position:relative;background:var(--night-2)}
#main .usb-close-bg{
  position:absolute;inset:0;
  background-image:linear-gradient(180deg,rgba(5,4,42,.8) 0%,rgba(5,4,42,.62) 40%,rgba(5,4,42,.93) 100%),url("/media/destinations/us/graduate-fist-raised-sunset.jpg?v=aa5d830175");
  background-size:cover;background-position:center 46%;
}
#main .usb-close-in{position:relative;padding-block:clamp(84px,11vw,176px);text-align:center}
#main .usb-close h2{font-size:clamp(2.3rem,5.6vw,4.6rem);line-height:.98;max-width:18ch;margin:26px auto 0}
#main .usb-close .usb-lede{margin:26px auto 0;max-width:54ch}
#main .usb-close .usb-btns{justify-content:center;margin-top:36px}
#main .usb-close-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-d);margin-top:clamp(48px,5vw,80px);border-top:1px solid var(--line-d)}
#main .usb-close-facts div{background:rgba(5,4,42,.72);padding:24px 20px;text-align:left}
#main .usb-close-facts span:first-child{display:block;font-family:var(--font-ui);font-size:.62rem;font-weight:800;letter-spacing:.26em;text-transform:uppercase;color:var(--dim-2)}
#main .usb-close-facts span:last-child{display:block;font-size:.98rem;font-weight:700;color:#FFFFFF;letter-spacing:-.02em;margin-top:10px;line-height:1.4}

/* ══ RESPONSIVE ═══════════════════════════════════════ */
@media (max-width:1080px){
  #main .usb-frame--a,#main .usb-frame--b,#main .usb-frame--e,#main .usb-frame--g{grid-column:span 6}
  #main .usb-frame--c,#main .usb-frame--d,#main .usb-frame--f,#main .usb-frame--h{grid-column:span 6}
  #main .usb-strip-dest{grid-template-columns:repeat(4,1fr)}
  #main .usb-cases{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:900px){
  #main .usb-hero{grid-template-columns:minmax(0,1fr)}
  #main .usb-hero-media{min-height:320px;order:-1}
  #main .usb-strip-in{grid-template-columns:repeat(2,1fr)}
  #main .usb-strip-in > div{border-left:0;border-top:1px solid var(--line-d);padding-left:0;padding-right:20px}
  #main .usb-strip-in > div:nth-child(-n+2){border-top:0}
  #main .usb-cmp-grid{grid-template-columns:minmax(0,1fr)}
  #main .usb-cmp-media img{aspect-ratio:16/10}
  #main .usb-route-grid{grid-template-columns:minmax(0,1fr)}
  #main .usb-svc-head,#main .usb-q-head{grid-template-columns:minmax(0,1fr);align-items:start}
  #main .usb-after{grid-template-columns:minmax(0,1fr)}
  #main .usb-after-media{min-height:300px}
  #main .usb-q-grid{grid-template-columns:minmax(0,1fr)}
  #main .usb-close-facts{grid-template-columns:repeat(2,1fr)}
  /* narrow viewports: the lead card's side-lit scrim stops working — go vertical */
  #main .usb-lead-scrim{background:linear-gradient(180deg,rgba(5,4,42,.46) 0%,rgba(5,4,42,.66) 42%,rgba(5,4,42,.95) 100%)}
  #main .usb-lead{min-height:clamp(460px,80vw,600px)}
}
@media (max-width:620px){
  #main .usb-frame--a,#main .usb-frame--b,#main .usb-frame--c,#main .usb-frame--d,
  #main .usb-frame--e,#main .usb-frame--f,#main .usb-frame--g,#main .usb-frame--h{grid-column:span 12;min-height:300px}
  #main .usb-strip-dest{grid-template-columns:repeat(2,1fr)}
  #main .usb-route-steps{grid-template-columns:minmax(0,1fr)}
  #main .usb-q{grid-template-columns:minmax(0,1fr);gap:12px}
  #main .usb-cmp li{grid-template-columns:minmax(0,1fr);gap:10px}
  #main .usb-after li{grid-template-columns:minmax(0,1fr);gap:8px}
  #main .usb-close-facts{grid-template-columns:minmax(0,1fr)}
}