/* The PUBLIC site's shared furniture — header, footer, hero, sections, cards,
   buttons — for the marketing pages a logged-out visitor (or a carrier
   compliance reviewer) reaches: /home, /advisors, /about, /contact, and the
   header on /sms. One file, because four pages carrying hand-copied nav markup
   styles is how the same-rule-per-page drift starts (CLAUDE.md names that
   pattern as the cause of the two worst bugs here).

   NOT base.css, on purpose: base.css is tokens only, by its own header rules.
   This is component CSS for one family of pages, scoped under .pub- classes so
   linking it can never restyle a page's own body/h1/p — sms.html links it for
   the header alone and keeps its card exactly as the carriers were shown it.

   Colour and contrast follow the measured rules in assets/base.css: white text
   only on #268183 (the button teal the whole site uses), never on --gold or the
   raw brand teal; --muted-ink only on white or paper; yellow/blush appear only
   inside the gradient band and never carry text. */

:root{
  /* Not in base.css by design (deliberately per-page there); the public pages
     share one radius the way they share everything else. */
  --pub-radius:16px;
}

/* Skip link (N271): invisible until keyboard focus, then a clear pill at the
   top-left — the first tab stop on every public page. */
.pub-skip{position:absolute;left:-9999px;top:0;z-index:60;background:var(--ink);color:#fff;
  font-size:13px;font-weight:700;padding:10px 16px;border-radius:0 0 10px 0;text-decoration:none}
.pub-skip:focus{left:0}

/* ---- header ------------------------------------------------------------- */
/* Sticky (N271): pure CSS, same surface color, a hairline below — the nav
   stays reachable on the longer pages without any script. */
.pub-header{background:var(--card);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:50}
.pub-header-in{max-width:var(--container);margin:0 auto;padding:14px var(--gutter);
  display:flex;align-items:center;flex-wrap:wrap;gap:10px 22px}
.pub-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.pub-brand img{width:34px;height:auto;display:block}
.pub-brand b{font-family:'Big Caslon','Fraunces',Georgia,serif;font-weight:500;
  font-size:20px;letter-spacing:.01em;white-space:nowrap}
.pub-nav{display:flex;align-items:center;flex-wrap:wrap;gap:4px 20px;margin-left:auto}
.pub-nav a{font-size:13px;font-weight:600;color:var(--ink);text-decoration:none;
  padding:6px 0;white-space:nowrap}
.pub-nav a:hover{color:var(--copper-text)}
.pub-nav a[aria-current="page"]{color:var(--copper-text)}
.pub-nav .pub-cta{background:#268183;color:#ffffff;border-radius:999px;
  padding:9px 16px;box-shadow:0 6px 18px rgba(41,54,74,.16)}
.pub-nav .pub-cta:hover{background:#1f6b6d;color:#ffffff}
@media (max-width:720px){
  .pub-header-in{gap:8px 14px}
  .pub-nav{gap:2px 14px;margin-left:0}
}

/* The brand's four colours in the one place all four are allowed together —
   the same signature bar the signed-in trip card wears. Decoration only:
   yellow (1.2:1) and blush (1.4:1) never carry text. */
.pub-band{height:4px;background:linear-gradient(90deg,
  var(--brand-teal) 0%,var(--brand-steel) 42%,var(--brand-blush) 74%,var(--brand-yellow) 100%)}

/* ---- hero ---------------------------------------------------------------- */
.pub-hero{background:var(--card);border-bottom:1px solid var(--line);
  text-align:center;padding:clamp(56px,9vh,96px) var(--gutter) clamp(44px,7vh,76px)}
.pub-hero .pub-eyebrow{margin-bottom:16px}
.pub-h1{font-family:'Big Caslon','Fraunces',Georgia,serif;font-weight:500;
  font-size:clamp(34px,5.6vw,58px);line-height:1.12;margin:0 auto 18px;max-width:820px;
  overflow-wrap:break-word}
.pub-lede{font-size:16.5px;line-height:1.65;color:var(--muted-ink);max-width:600px;margin:0 auto 26px}
.pub-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px}

.pub-eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--copper-text)}

/* ---- buttons ------------------------------------------------------------- */
.pub-btn{display:inline-block;padding:12px 22px;border-radius:999px;border:1px solid transparent;
  font-family:inherit;font-size:13.5px;font-weight:700;text-decoration:none;cursor:pointer;
  background:#268183;color:#ffffff;box-shadow:0 6px 18px rgba(41,54,74,.16)}
.pub-btn:hover{background:#1f6b6d;color:#ffffff}
.pub-btn.outline{background:transparent;border-color:var(--line);color:var(--ink);box-shadow:none}
.pub-btn.outline:hover{border-color:#78ccce;color:#297678}

/* ---- sections ------------------------------------------------------------ */
.pub-section{max-width:var(--container);margin:0 auto;padding:56px var(--gutter)}
.pub-section + .pub-section{padding-top:8px}
.pub-section-title{font-family:'Big Caslon','Fraunces',Georgia,serif;font-weight:500;
  font-size:clamp(26px,3.4vw,34px);line-height:1.2;margin:8px 0 12px}
.pub-section .pub-lede{margin:0 0 26px;max-width:720px}

/* narrower measure for prose-led pages (about, advisors, contact) */
.pub-prose{max-width:var(--container-read);margin:0 auto;padding:48px var(--gutter) 64px}
.pub-prose h2{font-family:'Big Caslon','Fraunces',Georgia,serif;font-weight:500;
  font-size:23px;line-height:1.25;margin:34px 0 10px}
.pub-prose p,.pub-prose li{font-size:15px;line-height:1.7;color:#3d4b5c;margin:0 0 14px}
.pub-prose ul{padding-left:20px;margin:0 0 14px}
.pub-prose a{color:var(--copper-text);font-weight:600}

/* ---- cards --------------------------------------------------------------- */
.pub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.pub-card{background:var(--card);border:1px solid var(--line);border-radius:var(--pub-radius);
  box-shadow:0 14px 34px rgba(18,22,28,.08);padding:24px 22px}
.pub-card h3{font-family:'Big Caslon','Fraunces',Georgia,serif;font-weight:500;
  font-size:19px;margin:14px 0 8px}
.pub-card p{font-size:14px;line-height:1.65;color:#3d4b5c;margin:0}
.pub-tile{width:46px;height:46px;border-radius:13px;display:flex;align-items:center;
  justify-content:center;background:rgba(120,205,206,.15)}
.pub-tile .ti{font-size:22px;color:var(--copper-text)}

/* the pale-teal notice panel the app uses for "worth knowing" copy */
.pub-note{background:#e2f2f2;border-left:4px solid var(--copper);border-radius:12px;
  padding:16px 18px;margin:22px 0}
.pub-note p{font-size:14px;line-height:1.65;color:#1f5f61;margin:0}
.pub-note b{color:var(--ink)}

/* ---- FAQ (N271) — native details/summary, no script ----------------------- */
.pub-faq{max-width:720px}
.pub-faq details{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:0 18px;margin:0 0 10px}
.pub-faq summary{cursor:pointer;font-weight:600;font-size:15px;color:var(--ink);
  padding:14px 0;list-style-position:inside}
.pub-faq summary:hover{color:var(--copper-text)}
.pub-faq details[open] summary{border-bottom:1px solid var(--line)}
.pub-faq details p{font-size:14px;line-height:1.65;color:#3d4b5c;margin:12px 0 16px}
.pub-faq details a{color:var(--copper-text);font-weight:600}

/* ---- footer -------------------------------------------------------------- */
.pub-footer{background:var(--card);border-top:1px solid var(--line);margin-top:40px}
.pub-footer-in{max-width:var(--container);margin:0 auto;padding:34px var(--gutter) 40px;
  text-align:center}
.pub-footer-brand{font-family:'Big Caslon','Fraunces',Georgia,serif;font-weight:500;
  font-size:18px;color:var(--ink);margin:0 0 4px}
.pub-footer-tag{font-size:13px;color:var(--muted-ink);margin:0 0 16px}
.pub-footer-links{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 18px;margin:0 0 18px}
.pub-footer-links a{font-size:12.5px;font-weight:600;color:var(--copper-text);text-decoration:none}
.pub-footer-links a:hover{text-decoration:underline}
.pub-footer-legal{font-size:12px;line-height:1.7;color:var(--muted-ink)}
.pub-footer-legal a{color:var(--copper-text);font-weight:600}