/* Moon Says: night navy, bone paper, one serif for headlines (Gloock), Albert Sans for everything else. */
@font-face { font-family: "Albert Sans"; src: url("fonts/albert-sans-var-latin.woff2") format("woff2"); font-weight: 400 700; font-display: swap; }
@font-face { font-family: "Gloock"; src: url("fonts/gloock-latin.woff2") format("woff2"); font-weight: 400; font-display: swap; }
:root {
  --brand: #1f2d5c;          /* the action colour: buttons, links, one band */
  --night: #141d3d;          /* deep ink band (rare) */
  --night-2: #1d2850;        /* cards on night */
  --star: #e8c77a;           /* planets on the chart wheel only (data, not decoration) */
  --paper: #f6f6f3;          /* page ground: cool bone, not cream */
  --card: #ffffff;
  --ink: #15192b;            /* text */
  --ink-2: #474d63;          /* secondary text, still AA on paper */
  --line: rgb(21 25 43 / 0.10);
  --on-night: #f3f1ea;
  --on-night-2: #c3c8dc;
  --radius: 22px; --radius-s: 14px; --pill: 999px;
  --shadow: 0 1px 2px rgb(20 29 61 / .06), 0 8px 24px rgb(20 29 61 / .08);
  --step-0: clamp(1.0625rem, 1.038rem + 0.109vw, 1.125rem);
  --step-1: clamp(1.25rem, 1.201rem + 0.217vw, 1.375rem);
  --step-2: clamp(1.5rem, 1.353rem + 0.652vw, 1.875rem);
  --step-3: clamp(1.875rem, 1.630rem + 1.087vw, 2.5rem);
  --step-4: clamp(2.375rem, 1.761rem + 2.6vw, 4rem);
  /* names the ad picture maker reads (lib/adcreative.ts): page, band, ink, accent */
  --oat: #f6f6f3; --oat-2: #eceef4; --green: #1f2d5c;
  --kit-accent: #1f2d5c; --kit-line: rgb(21 25 43 / .14); --kit-radius: 14px;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 var(--step-0)/1.55 "Albert Sans", system-ui, sans-serif; }
h1, h2, h3 { font-family: "Gloock", Georgia, serif; font-weight: 400; margin: 0 0 .4em; text-wrap: balance; }
h1 { font-size: var(--step-4); line-height: 1.04; letter-spacing: -0.02em; }
h2 { font-size: var(--step-3); line-height: 1.1; letter-spacing: -0.015em; }
h3 { font-size: var(--step-2); line-height: 1.2; }
p { margin: 0 0 1em; text-wrap: pretty; }
a { color: var(--brand); text-underline-offset: 3px; }
img { max-width: 100%; display: block; }
.ms-wrap { width: min(1120px, 100% - 40px); margin: 0 auto; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 56px; padding: 0 28px; border: 0; border-radius: var(--pill);
  background: var(--brand); color: #fff; font: 600 var(--step-0)/1 "Albert Sans", sans-serif; text-decoration: none; cursor: pointer; transition: transform .12s ease-out, background .15s; }
.btn:hover { background: #283a74; }
.btn:active { transform: scale(.97); }
.btn:focus-visible { outline: 3px solid var(--star); outline-offset: 3px; }
.btn.light { background: var(--on-night); color: var(--night); }
.btn.light:hover { background: #fff; color: var(--night); }
.btn.ghost { background: transparent; color: inherit; box-shadow: inset 0 0 0 1.5px currentColor; }
.btn.ghost:hover { background: rgb(255 255 255 / .08); color: inherit; }
.btn[disabled] { opacity: .55; cursor: default; }
.btn.wide { width: 100%; }
/* header */
.ms-top { background: var(--paper); border-bottom: 1px solid var(--line); }
.ms-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; }
.ms-logo img { height: 30px; width: auto; }
.ms-top-cta { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: var(--pill); background: var(--brand); color: #fff; font-weight: 600; text-decoration: none; }
.ms-top-cta:hover { background: #283a74; color: #fff; }
/* footer */
.ms-foot { background: var(--paper); border-top: 1px solid var(--line); padding: 36px 0 44px; color: var(--ink-2); }
.ms-foot p { margin: 0 0 10px; }
.ms-foot-links { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 14px 0; }
.ms-foot-links a { color: var(--ink); min-height: 44px; display: inline-flex; align-items: center; }
.ms-legal { font-size: 15px; }
/* shared page pieces (brand pages) */
.ms-page { padding: 48px 0 64px; }
.ms-page .ms-wrap { max-width: 720px; }
.ms-card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 24px; }