:root {
  --ink: #102537;
  --muted: #536674;
  --paper: #f5f8f9;
  --line: rgba(16,37,55,.14);
  --accent: #2c7f8d;
  --accent2: #5ca6a1;
  --deep: #0a1d2c;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background:
    radial-gradient(circle at 82% 15%, rgba(92,166,161,.18), transparent 28rem),
    radial-gradient(circle at 15% 85%, rgba(44,127,141,.10), transparent 28rem),
    var(--paper);
}
a { color: var(--accent); }
.shell { min-height: calc(100vh - 74px); display: grid; place-items: center; padding: 56px 22px 34px; }
.hero { width: min(850px, 100%); }
.brand { display: inline-flex; align-items: center; gap: 14px; color: var(--ink); text-decoration: none; margin-bottom: 68px; }
.brand-mark { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px 16px 16px 5px; background: linear-gradient(145deg,var(--deep),var(--accent)); color: #fff; font-weight: 800; letter-spacing: -.05em; box-shadow: 0 14px 35px rgba(10,29,44,.14); }
.brand-name { font-weight: 750; letter-spacing: -.025em; font-size: 1.15rem; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: .76rem; letter-spacing: .18em; font-weight: 800; color: var(--accent); margin-bottom: 16px; }
.eyebrow::before { content:""; width: 32px; height: 2px; background: var(--accent2); }
h1 { font-size: clamp(2.8rem, 7vw, 5.8rem); line-height: .98; letter-spacing: -.065em; max-width: 780px; margin: 0 0 28px; font-weight: 800; }
.lead { font-size: clamp(1.18rem, 2.4vw, 1.45rem); line-height: 1.55; max-width: 720px; margin: 0 0 14px; color: #2a4354; }
.supporting { font-size: 1rem; line-height: 1.7; max-width: 680px; margin: 0 0 34px; color: var(--muted); }
.notify-form { max-width: 690px; padding: 28px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.78); box-shadow: 0 24px 70px rgba(18,40,55,.08); backdrop-filter: blur(12px); }
.notify-form > label:first-child { display: block; font-weight: 750; margin-bottom: 11px; }
.input-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
input[type=email] { width: 100%; border: 1px solid rgba(16,37,55,.20); border-radius: 12px; padding: 15px 16px; font: inherit; background: #fff; color: var(--ink); outline: none; }
input[type=email]:focus { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(44,127,141,.10); }
button { border: 0; border-radius: 12px; padding: 0 22px; min-height: 52px; background: var(--deep); color:#fff; font: inherit; font-weight: 750; cursor: pointer; }
button:hover { background:#13364b; }
.consent { margin-top: 16px; display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; color: #435765; font-size: .9rem; line-height: 1.5; }
.consent input { margin-top: .23rem; }
.privacy-note { margin: 11px 0 0 26px; font-size: .82rem; color: #687983; }
.notice { max-width: 690px; margin: 0 0 16px; padding: 13px 16px; border-radius: 12px; border: 1px solid rgba(44,127,141,.24); background: rgba(44,127,141,.08); }
.notice.success { border-color: rgba(36,130,85,.25); background: rgba(36,130,85,.08); }
.notice.error { border-color: rgba(170,57,57,.25); background: rgba(170,57,57,.08); color:#812f2f; }
.hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.divider { width: 70px; height: 1px; background: var(--line); margin: 42px 0 20px; }
.small-print { color:#71818b; font-size:.86rem; }
footer { min-height: 74px; padding: 22px; display:flex; align-items:center; justify-content:center; gap:22px; border-top:1px solid var(--line); color:#647580; font-size:.84rem; background:rgba(255,255,255,.45); }
footer a { color:#4f6674; text-decoration:none; }
.policy-shell { width:min(760px, calc(100% - 40px)); margin: 0 auto; padding: 64px 0 90px; }
.policy-shell h1 { font-size: clamp(2.2rem, 5vw, 3.8rem); margin-top: 48px; }
.policy-shell h2 { margin-top: 34px; font-size:1.1rem; }
.policy-shell p { line-height:1.75; color:#435765; }
.back { text-decoration:none; font-weight:700; }
@media (max-width: 620px) {
  .shell { padding-top: 30px; }
  .brand { margin-bottom: 46px; }
  .input-row { grid-template-columns: 1fr; }
  button { padding: 14px 20px; }
  .notify-form { padding: 20px; }
  .privacy-note { margin-left: 0; }
  footer { flex-wrap:wrap; }
}
