/* ═══════════════════════════════════════════════════════════════════════
   Miles to Paradise — Points Library components
   ───────────────────────────────────────────────────────────────────────
   Loaded AFTER style.css on blog.html, every bank hub page, and every
   article page. Holds only the components those pages share, so a new
   article page is content plus a nav and footer — nothing else to copy.

   Uses the v2 design tokens from style.css (--navy, --lagoon, --coral…).
   Nothing here overrides an existing style.css rule.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Breadcrumb + review stamp (on the dark hero) ───────────────────── */
.crumbs { font-size:12.5px; color:rgba(255,255,255,.6); margin-bottom:18px; letter-spacing:.3px; }
.crumbs a { color:rgba(255,255,255,.82); border-bottom:1px solid rgba(255,255,255,.22); text-decoration:none; }
.crumbs a:hover { color:#fff; }
.crumbs span { margin:0 8px; opacity:.5; }
.stamp {
  display:inline-flex; align-items:center; gap:9px; margin-top:24px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14);
  border-radius:999px; padding:8px 16px; font-size:12.5px; color:rgba(255,255,255,.8);
}
.stamp svg { width:14px; height:14px; color:var(--champagne); flex-shrink:0; }
.countdown {
  display:inline-flex; align-items:center; gap:9px; margin-top:24px; margin-left:10px;
  background:var(--coral-deep); border-radius:999px; padding:8px 16px;
  font-size:12.5px; font-weight:600; color:#fff; letter-spacing:.3px;
}

/* ── Bank rail ──────────────────────────────────────────────────────── */
.rail-head { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:28px; }
.rail-head h2 { font-family:var(--font-display); font-size:clamp(24px,3.2vw,34px); font-weight:600; color:var(--navy); line-height:1.2; }
.rail-head h2 em { font-style:italic; font-weight:400; color:var(--lagoon); }
.rail-head p { font-size:14.5px; color:var(--muted); font-weight:300; max-width:440px; line-height:1.75; }

.bank-rail { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.bank-card {
  display:flex; flex-direction:column; text-decoration:none; background:#fff; border:1px solid var(--line);
  border-radius:var(--r-md); overflow:hidden; box-shadow:var(--shadow-sm);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease); position:relative;
}
.bank-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-md); }
.bank-card.soon { opacity:.82; }
.bank-card.soon:hover { transform:none; box-shadow:var(--shadow-sm); }
.bank-card.current { border-color:var(--lagoon); box-shadow:0 0 0 2px rgba(14,155,181,.16), var(--shadow-sm); }
.bank-head { padding:24px 24px 20px; color:#fff; position:relative; overflow:hidden; }
.bank-head::after {
  content:''; position:absolute; right:-44px; top:-44px; width:150px; height:150px;
  border-radius:50%; border:24px solid rgba(255,255,255,.08);
}
.bank-head.bk-chase  { background:linear-gradient(135deg, var(--navy) 0%, #0C6E85 100%); }
.bank-head.bk-amex   { background:linear-gradient(135deg, #123E63 0%, var(--lagoon) 100%); }
.bank-head.bk-capone { background:linear-gradient(135deg, #9A3C22 0%, var(--coral) 100%); }
.bank-head.bk-citi   { background:linear-gradient(135deg, #8A6B22 0%, var(--gold) 100%); }
.bank-head .bk-name { font-family:var(--font-body); font-size:11.5px; letter-spacing:1.6px; text-transform:uppercase; color:rgba(255,255,255,.72); margin-bottom:6px; display:block; position:relative; z-index:2; }
.bank-head .bk-prog { font-family:var(--font-display); font-size:21px; font-weight:600; line-height:1.25; position:relative; z-index:2; display:block; }
.bank-body { padding:20px 24px 24px; display:flex; flex-direction:column; flex:1; }
.bank-body p { font-size:13.5px; color:var(--muted); line-height:1.75; font-weight:300; flex:1; margin-bottom:18px; }
.bank-go { display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; color:var(--lagoon); }
.bank-go svg { width:15px; height:15px; transition:transform .3s var(--ease); }
.bank-card:hover .bank-go svg { transform:translateX(4px); }
.bank-count { font-size:12px; color:var(--muted); letter-spacing:.4px; margin-bottom:14px; }
.bank-here { font-size:12px; font-weight:600; letter-spacing:.8px; text-transform:uppercase; color:var(--lagoon); }
.bank-soon-pill {
  display:inline-flex; align-items:center; gap:6px; align-self:flex-start;
  background:var(--sand); color:#8A6B22; font-size:11.5px; font-weight:600;
  letter-spacing:.6px; text-transform:uppercase; padding:6px 12px; border-radius:999px;
}

/* ── Points desk ────────────────────────────────────────────────────── */
.desk {
  border-radius:var(--r-lg); padding:52px 48px; position:relative; overflow:hidden;
  background:
    radial-gradient(700px 340px at 88% 0%, rgba(14,155,181,.3) 0%, transparent 62%),
    linear-gradient(140deg, var(--deep), var(--navy));
  box-shadow:var(--shadow-lg);
}
.desk::after {
  content:''; position:absolute; left:-90px; bottom:-120px; width:300px; height:300px;
  border-radius:50%; border:40px solid rgba(255,255,255,.04);
}
.desk-top { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:30px; position:relative; z-index:2; }
.desk h2 { font-family:var(--font-display); font-size:clamp(23px,3vw,31px); font-weight:600; color:#fff; }
.desk h2 em { font-style:italic; font-weight:400; color:var(--champagne); }
.desk-stamp { font-size:12px; letter-spacing:1px; text-transform:uppercase; color:rgba(255,255,255,.5); }
.desk-list { display:grid; gap:14px; position:relative; z-index:2; }
.desk-item {
  display:flex; gap:18px; align-items:flex-start; text-decoration:none; background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.09); border-radius:var(--r-md); padding:20px 24px;
  transition:background .3s var(--ease);
}
a.desk-item:hover { background:rgba(255,255,255,.1); }
.desk-when {
  flex-shrink:0; font-size:11.5px; font-weight:600; letter-spacing:.8px; text-transform:uppercase;
  padding:5px 11px; border-radius:999px; margin-top:2px;
  background:rgba(111,211,232,.16); color:var(--aqua);
}
.desk-when.hot { background:rgba(244,132,95,.2); color:#FFBFA6; }
.desk-item h3 { font-family:var(--font-display); font-size:17px; font-weight:600; color:#fff; line-height:1.4; margin-bottom:5px; }
.desk-item p { font-size:13.5px; color:rgba(255,255,255,.62); line-height:1.7; font-weight:300; }
.desk-item p .more { color:var(--aqua); font-weight:500; white-space:nowrap; }

/* ── Library controls ───────────────────────────────────────────────── */
.lib-controls { margin-bottom:38px; }
.lib-row { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-bottom:16px; }
.lib-label { font-size:11.5px; letter-spacing:1.2px; text-transform:uppercase; color:var(--muted); font-weight:600; width:76px; flex-shrink:0; }
.bchip {
  font-family:var(--font-body); cursor:pointer; border-radius:999px; transition:all .25s var(--ease);
  background:#fff; border:1px solid var(--line); color:var(--navy);
  font-size:13px; font-weight:500; padding:9px 17px;
}
.bchip:hover { border-color:var(--lagoon); color:var(--lagoon); }
.bchip.active { background:var(--lagoon); border-color:var(--lagoon); color:#fff; }
.bchip:focus-visible { outline:2px solid var(--lagoon); outline-offset:2px; }
.bsearch { position:relative; flex:1; min-width:220px; }
.bsearch svg { position:absolute; left:16px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:var(--muted); pointer-events:none; }
.bsearch input {
  width:100%; font-family:var(--font-body); font-size:14px; color:var(--text);
  padding:12px 18px 12px 42px; border:1px solid var(--line); border-radius:999px;
  background:#fff; transition:border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.bsearch input:focus { outline:none; border-color:var(--lagoon); box-shadow:0 0 0 3px rgba(14,155,181,.14); }
.lib-count { font-size:13px; color:var(--muted); font-weight:300; }

/* ── Post cards (extends .bcard in style.css) ───────────────────────── */
.bcard-cover.t-guide    { background:linear-gradient(140deg, var(--lagoon), var(--navy-soft)); }
.bcard-cover.t-news     { background:linear-gradient(140deg, var(--coral), var(--coral-deep)); }
.bcard-cover.t-booking  { background:linear-gradient(140deg, var(--gold), #A5802F); }
.bcard-cover.t-trip     { background:linear-gradient(140deg, var(--navy), var(--deep)); }
.bcard-cover.t-strategy { background:linear-gradient(140deg, var(--navy-soft), #0C6E85); }
.bcat.t-guide    { background:var(--aqua-pale); color:var(--lagoon); }
.bcat.t-news     { background:var(--coral-pale); color:var(--coral-deep); }
.bcat.t-booking  { background:#F8F0DC; color:#A5802F; }
.bcat.t-trip     { background:#E8EEF5; color:var(--navy); }
.bcat.t-strategy { background:#E4EDF4; color:var(--navy-soft); }
.bcard-tags { display:flex; flex-wrap:wrap; gap:7px; align-items:center; margin-bottom:12px; }
.btag { font-size:10.5px; font-weight:600; letter-spacing:.7px; text-transform:uppercase; color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:4px 9px; }
.bflag {
  position:absolute; top:14px; left:14px; z-index:3;
  font-size:10.5px; font-weight:700; letter-spacing:.9px; text-transform:uppercase;
  padding:5px 11px; border-radius:999px;
}
.bflag.new { background:rgba(255,255,255,.92); color:var(--navy); }
.bflag.urgent { background:var(--coral-deep); color:#fff; }
.bempty {
  grid-column:1 / -1; text-align:center; background:var(--ivory); border:1px dashed var(--line);
  border-radius:var(--r-lg); padding:60px 32px;
}
.bempty h3 { font-family:var(--font-display); font-size:24px; font-weight:600; color:var(--navy); margin-bottom:10px; }
.bempty h3 em { font-style:italic; font-weight:400; color:var(--lagoon); }
.bempty p { font-size:14.5px; color:var(--muted); font-weight:300; max-width:420px; margin:0 auto 24px; line-height:1.75; }

/* ── Long-form body ─────────────────────────────────────────────────── */
.body-wrap { max-width:860px; }
.body-wrap h2 {
  font-family:var(--font-display); font-size:clamp(25px,3.4vw,34px); font-weight:600;
  color:var(--navy); line-height:1.25; margin:72px 0 20px; scroll-margin-top:100px;
}
.body-wrap h2:first-of-type { margin-top:0; }
.body-wrap h2 em { font-style:italic; font-weight:400; color:var(--lagoon); }
.body-wrap h3 { font-family:var(--font-display); font-size:20px; font-weight:600; color:var(--navy); margin:38px 0 12px; }
.body-wrap p { font-size:16px; line-height:1.85; color:var(--text); font-weight:300; margin-bottom:20px; }
.body-wrap p strong { font-weight:600; color:var(--navy); }
.body-wrap ul { list-style:none; margin:0 0 24px; display:grid; gap:12px; }
.body-wrap ul li { position:relative; padding-left:28px; font-size:15.5px; line-height:1.8; color:var(--text); font-weight:300; }
.body-wrap ul li::before { content:''; position:absolute; left:4px; top:11px; width:7px; height:7px; border-radius:50%; background:var(--lagoon); }
.body-wrap a.inline { color:var(--lagoon); border-bottom:1px solid rgba(14,155,181,.34); font-weight:500; text-decoration:none; }
.body-wrap a.inline:hover { border-bottom-color:var(--lagoon); }

.answer {
  border-left:3px solid var(--lagoon); background:var(--aqua-pale);
  padding:22px 26px; border-radius:0 var(--r-md) var(--r-md) 0;
  font-size:16px; line-height:1.8; color:var(--navy); font-weight:400;
  max-width:820px; margin:0 0 30px;
}
.answer strong { font-weight:600; }

.alertbox {
  border-left:3px solid var(--coral-deep); background:var(--coral-pale);
  padding:22px 26px; border-radius:0 var(--r-md) var(--r-md) 0; margin:0 0 30px;
}
.alertbox h3 { font-family:var(--font-display); font-size:18px; font-weight:600; color:var(--coral-deep); margin:0 0 8px; }
.alertbox p { font-size:15px; line-height:1.8; color:var(--navy); font-weight:300; margin:0; }
.alertbox a { color:var(--coral-deep); font-weight:600; border-bottom:1px solid rgba(229,100,60,.4); text-decoration:none; }

.credential {
  display:flex; gap:16px; align-items:flex-start; max-width:860px;
  background:var(--ivory); border:1px solid var(--line); border-left:3px solid var(--gold);
  border-radius:0 var(--r-md) var(--r-md) 0; padding:22px 26px; margin:36px 0;
}
.credential svg { width:20px; height:20px; color:var(--gold); flex-shrink:0; margin-top:3px; }
.credential p { font-size:13.5px; color:var(--muted); line-height:1.8; margin:0; font-weight:300; }
.credential strong { color:var(--navy); font-weight:600; }

/* ── Table of contents (list version of style.css .toc) ─────────────── */
.toc-grid { list-style:none; margin:0; display:grid; grid-template-columns:repeat(2,1fr); gap:10px 28px; counter-reset:toc; }
.toc-grid li { counter-increment:toc; font-size:14.5px; margin:0; }
.toc-grid a { display:flex; gap:12px; color:var(--navy); line-height:1.6; padding:4px 0; text-decoration:none; }
.toc-grid a::before { content:counter(toc,decimal-leading-zero); font-family:var(--font-display); color:var(--lagoon); font-weight:600; font-size:13px; flex-shrink:0; }
.toc-grid a:hover { color:var(--lagoon); }

/* ── Tables ─────────────────────────────────────────────────────────── */
.cmp-wrap { overflow-x:auto; border-radius:var(--r-md); box-shadow:var(--shadow-md); border:1px solid var(--line); margin-bottom:16px; }
.cmp { width:100%; border-collapse:collapse; background:#fff; min-width:600px; }
.cmp th, .cmp td { padding:15px 20px; text-align:center; font-size:14px; border-bottom:1px solid var(--line); }
.cmp thead th { background:var(--navy); color:#fff; font-family:var(--font-display); font-weight:600; font-size:15px; }
.cmp thead th small { display:block; font-family:var(--font-body); font-weight:500; font-size:11.5px; color:var(--champagne); letter-spacing:.6px; margin-top:4px; }
.cmp th:first-child, .cmp td:first-child { text-align:left; font-weight:500; color:var(--navy); }
.cmp thead th:first-child { color:#fff; }
.cmp .hl { background:var(--aqua-pale); }
.cmp tbody tr:last-child td { border-bottom:none; }
.cmp .bad { color:var(--coral-deep); font-weight:600; }
.cmp .good { color:#0B7A56; font-weight:600; }
.cmp .sub { display:block; font-size:12px; color:var(--muted); font-weight:400; margin-top:3px; }
.tbl-note { font-size:12.5px; color:var(--muted); margin-bottom:30px; line-height:1.75; font-weight:300; }

/* ── Card offer rail ────────────────────────────────────────────────── */
.cardgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin:34px 0 10px; }
.cardgrid.two { grid-template-columns:repeat(2,1fr); }
.ccard {
  background:#fff; border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--shadow-sm); overflow:hidden; display:flex; flex-direction:column;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.ccard:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.ccard-head { padding:20px 22px; background:linear-gradient(135deg, var(--navy) 0%, #0C6E85 100%); color:#fff; }
.ccard-head.biz { background:linear-gradient(135deg, #123E63 0%, var(--lagoon) 100%); }
.ccard-head.free { background:linear-gradient(135deg, #8A6B22 0%, var(--gold) 100%); }
.ccard-head.warm { background:linear-gradient(135deg, #9A3C22 0%, var(--coral) 100%); }
.ccard-head h3, .ccard-head h4 { font-family:var(--font-display); font-size:18px; font-weight:600; line-height:1.3; margin:0 0 5px; color:#fff; }
.ccard-head .af { font-size:12px; color:rgba(255,255,255,.75); letter-spacing:.4px; }
.ccard-body { padding:20px 22px 22px; display:flex; flex-direction:column; flex:1; }
.ccard-body > p { font-size:13.5px; color:var(--muted); line-height:1.75; font-weight:300; flex:1; margin-bottom:16px; }
.ccard-body ul { list-style:none; margin:0 0 16px; display:grid; gap:8px; flex:1; }
.ccard-body ul li { position:relative; padding-left:20px; font-size:13.5px; line-height:1.65; color:var(--muted); font-weight:300; }
.ccard-body ul li::before { content:''; position:absolute; left:2px; top:8px; width:6px; height:6px; border-radius:50%; background:var(--lagoon); }
.ccard-body ul li strong { color:var(--navy); font-weight:600; }
.xfer-yes, .xfer-no {
  align-self:flex-start; font-size:10.5px; font-weight:700; letter-spacing:.8px; text-transform:uppercase;
  padding:5px 10px; border-radius:999px; margin-bottom:14px;
}
.xfer-yes { background:var(--aqua-pale); color:var(--lagoon); }
.xfer-no { background:#F0F1F3; color:var(--muted); }
a.apply {
  display:block; text-align:center; background:var(--coral); color:#fff; font-weight:600;
  font-size:14px; padding:13px 18px; border-radius:999px; text-decoration:none;
  transition:background .25s var(--ease), transform .25s var(--ease);
}
a.apply:hover { background:var(--coral-deep); transform:translateY(-2px); }
.aff-note { font-size:11px; line-height:1.6; margin-top:9px; text-align:center; }
.aff-note.referral { color:var(--lagoon); }
.aff-note.direct { color:var(--muted); }

/* Pointer to cards.html — replaces card offers on the program guides */
.offers-note {
  background:var(--ivory); border:1px solid var(--line); border-left:3px solid var(--lagoon);
  border-radius:0 var(--r-lg) var(--r-lg) 0; padding:30px 34px; margin:40px 0;
  display:flex; gap:28px; align-items:center; justify-content:space-between; flex-wrap:wrap;
}
.offers-note h3 { font-family:var(--font-display); font-size:20px; font-weight:600; color:var(--navy); margin:0 0 8px; }
.offers-note p { font-size:14px; color:var(--muted); line-height:1.75; font-weight:300; margin:0; max-width:520px; }
.offers-note .btn { flex-shrink:0; }

.inline-cards {
  background:var(--ivory); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:32px 34px; margin:44px 0;
}
.inline-cards h3 { font-family:var(--font-display); font-size:20px; font-weight:600; color:var(--navy); margin:0 0 6px; }
.inline-cards > p { font-size:14.5px; color:var(--muted); font-weight:300; line-height:1.75; margin-bottom:24px; }
.inline-cards .cardgrid { margin:0; }

/* ── Numbered checklist ─────────────────────────────────────────────── */
.checklist { counter-reset:ck; display:grid; gap:14px; margin:28px 0 30px; }
.ck {
  counter-increment:ck; display:flex; gap:18px; background:#fff; border:1px solid var(--line);
  border-radius:var(--r-md); padding:22px 26px; box-shadow:var(--shadow-sm);
}
.ck::before {
  content:counter(ck); font-family:var(--font-display); font-size:20px; font-weight:600;
  color:#fff; background:var(--lagoon); width:34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.ck h3 { font-family:var(--font-display); font-size:17.5px; font-weight:600; color:var(--navy); margin:4px 0 6px; }
.ck p { font-size:14.5px; line-height:1.8; color:var(--muted); font-weight:300; margin:0; }

/* ── Steps (Start here) ─────────────────────────────────────────────── */
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:34px; }
.step { background:#fff; border:1px solid var(--line); border-radius:var(--r-md); padding:30px 28px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; }
.step-n { font-family:var(--font-display); font-size:34px; font-weight:600; line-height:1; color:var(--lagoon); margin-bottom:14px; display:block; }
.step h3 { font-family:var(--font-display); font-size:19px; font-weight:600; color:var(--navy); margin-bottom:8px; }
.step p { font-size:14px; color:var(--muted); line-height:1.75; font-weight:300; flex:1; margin-bottom:16px; }
.step > a { font-size:13.5px; font-weight:600; color:var(--lagoon); display:inline-flex; align-items:center; gap:7px; text-decoration:none; }
.step > a svg { width:15px; height:15px; }

/* ── FAQ ────────────────────────────────────────────────────────────── */
.faq { max-width:860px; margin-top:8px; }
.faq details { background:#fff; border:1px solid var(--line); border-radius:var(--r-md); margin-bottom:12px; overflow:hidden; box-shadow:var(--shadow-sm); }
.faq summary {
  cursor:pointer; list-style:none; padding:20px 26px; font-family:var(--font-display);
  font-size:17px; font-weight:600; color:var(--navy); display:flex; justify-content:space-between;
  align-items:center; gap:18px;
}
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after {
  content:''; width:10px; height:10px; border-right:2px solid var(--lagoon);
  border-bottom:2px solid var(--lagoon); transform:rotate(45deg); flex-shrink:0;
  transition:transform .3s var(--ease); margin-top:-4px;
}
.faq details[open] summary::after { transform:rotate(-135deg); margin-top:3px; }
.faq summary:focus-visible { outline:2px solid var(--lagoon); outline-offset:-2px; }
.faq .fa { padding:0 26px 22px; font-size:15px; line-height:1.85; color:var(--text); font-weight:300; }
.faq .fa p + p { margin-top:14px; }

/* ── Sources ────────────────────────────────────────────────────────── */
.sources { background:#fff; border:1px solid var(--line); border-radius:var(--r-md); padding:26px 30px; margin:44px 0 0; }
.sources h3 { font-family:var(--font-body); font-size:11.5px; letter-spacing:1.4px; text-transform:uppercase; color:var(--muted); font-weight:600; margin-bottom:14px; }
.sources ul { list-style:none; display:grid; gap:9px; margin:0; }
.sources li { font-size:13.5px; line-height:1.7; color:var(--muted); font-weight:300; padding-left:0; }
.sources li::before { display:none; }
.sources a { color:var(--lagoon); border-bottom:1px solid rgba(14,155,181,.3); text-decoration:none; }

/* ── CTA strip + section head ───────────────────────────────────────── */
.cta-strip {
  border-radius:var(--r-lg); text-align:center; padding:72px 40px; position:relative; overflow:hidden;
  background:
    radial-gradient(600px 300px at 80% 0%, rgba(14,155,181,.28) 0%, transparent 60%),
    linear-gradient(140deg, var(--deep), var(--navy));
  box-shadow:var(--shadow-lg);
}
.cta-strip::after { content:''; position:absolute; left:-80px; bottom:-140px; width:300px; height:300px; border-radius:50%; border:40px solid rgba(255,255,255,.045); }
.cta-strip h3 { font-family:var(--font-display); font-size:clamp(26px,3.6vw,40px); font-weight:600; color:#fff; margin-bottom:12px; position:relative; z-index:2; }
.cta-strip h3 em { font-style:italic; font-weight:400; color:var(--champagne); }
.cta-strip p { color:rgba(255,255,255,.62); margin:0 auto 34px; font-weight:300; max-width:560px; position:relative; z-index:2; }
.cta-strip .btn { position:relative; z-index:2; }

.sec-head { margin-bottom:26px; }
.sec-head h2 { font-family:var(--font-display); font-size:clamp(24px,3.2vw,32px); font-weight:600; color:var(--navy); line-height:1.25; }
.sec-head h2 em { font-style:italic; font-weight:400; color:var(--lagoon); }

/* ── Responsive ─────────────────────────────────────────────────────── */
@media (max-width:1080px) { .bank-rail { grid-template-columns:repeat(2,1fr); } }
@media (max-width:900px)  { .cardgrid, .cardgrid.two { grid-template-columns:1fr; } .toc-grid { grid-template-columns:1fr; } }
@media (max-width:880px) {
  .steps { grid-template-columns:1fr; }
  .desk { padding:36px 26px; }
  .desk-item { flex-direction:column; gap:10px; padding:18px 20px; }
  .lib-label { width:100%; }
  .countdown { margin-left:0; }
  .inline-cards { padding:26px 22px; }
}
@media (max-width:560px) { .bank-rail { grid-template-columns:1fr; } }