/* Harbor Mutual — brand tokens
   Edit these to rebrand the template. See README.md → "Rebrand in 5 minutes". */
:root{
  /* ── core palette ── */
  --paper:#f6fafc;          /* sky-tinted page background */
  --card:#ffffff;           /* card / surface */
  --ink:#0b2942;            /* harbor navy — primary text & dark bands */
  --ink-2:#4a6076;          /* muted slate — 5.6:1 on paper */
  --sky:#1b6fa8;            /* accent — 5.0:1 on white, AA small text */
  --sky-soft:#e3f0f8;       /* accent tint — chips, icon wells */
  --sand:#f0e2cd;           /* warm sand — secondary accent */
  --sand-deep:#e2cba6;      /* deeper sand — hovers, dividers */
  --line:#dbe6ee;           /* hairline borders */

  /* ── type ── */
  --f-display:'Fraunces',Georgia,serif;   /* headings */
  --f-body:'Inter',system-ui,sans-serif;  /* body & UI */

  /* one scale — 13 sizes */
  --t-xs:12px; --t-sm:13px; --t-base:16px; --t-md:17px; --t-lg:19px;
  --t-xl:22px; --t-2xl:26px; --t-3xl:31px; --t-4xl:38px; --t-5xl:46px;
  --t-6xl:56px; --t-7xl:66px;

  /* ── layout ── */
  --gutter:60px;
  --maxw:1200px;
  --r:16px;      /* rounded-but-corporate cards */
  --r-sm:10px;   /* inputs, small chips */
  --shadow:0 2px 4px rgba(11,41,66,.04),0 12px 28px -12px rgba(11,41,66,.14);
}
@media (max-width:1000px){ :root{ --gutter:28px } }
@media (max-width:560px){ :root{ --gutter:18px } }