/* IceOps brand colours, type + base components. Source of truth: BRAND.md (v1, 2026-10-21).
   Colours sampled from the logo artwork; contrast checked. Change here, not per page.
   No web fonts and no external requests. */
:root{
  /* dark grounds */
  --graphite:#03080D;
  --navy:#052238;
  --line-dark:#1C2A36;
  /* accent */
  --ice:#82D6F8;        /* on dark only */
  --ice-deep:#0A6A94;   /* the accent on light */
  --steel:#B5CCDB;      /* secondary text on dark */
  /* light */
  --white:#FFFFFF;
  --frost:#E6F4FB;
  --ink:#0E1A24;
  --slate:#4A5B6A;
  --line:#D6E1E9;
  /* status (never decoration) */
  --good:#1F7A55; --warn:#96600F; --bad:#B23A44;
  /* type + shape */
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI Variable Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-display:-apple-system,BlinkMacSystemFont,"Segoe UI Variable Display","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --radius:8px;
}

.io{font-family:var(--font);color:var(--ink);background:var(--white);line-height:1.5;-webkit-font-smoothing:antialiased;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.io h1,.io h2,.io h3{font-family:var(--font-display);letter-spacing:-.015em;color:var(--navy);line-height:1.15}
.io a{color:var(--ice-deep)}

/* eyebrow label */
.io-eyebrow{display:block;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ice-deep)}

/* dark band: header / hero */
.io-band{background:var(--navy);color:var(--white)}
.io-band h1,.io-band h2,.io-band h3{color:var(--white)}
.io-band .io-eyebrow{color:var(--ice)}
.io-band .io-sub{color:var(--steel)}
.io-band .io-accent{color:var(--ice)}
.io-band--graphite{background:var(--graphite)}
.io-logo{display:block;height:auto}

/* card, callout */
.io-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:16px 20px}
.io-callout{background:var(--frost);color:var(--navy);border-radius:var(--radius);padding:14px 18px}

/* buttons */
/* "a.io-btn" selectors outrank ".io a" (link colour), which otherwise turns button text Ice Deep */
.io-btn,.io a.io-btn{display:inline-block;font-weight:650;text-decoration:none;border-radius:var(--radius);padding:11px 18px;background:var(--navy);color:var(--white);border:1px solid transparent}
.io-band .io-btn,.io .io-band a.io-btn{background:var(--ice);color:var(--graphite)}
.io-btn--ghost,.io a.io-btn--ghost{background:transparent;color:var(--navy);border:1px solid var(--line)}
.io-band .io-btn--ghost,.io .io-band a.io-btn--ghost{background:transparent;color:var(--white);border-color:var(--line-dark)}

/* "never" list: IceOps' stated limits only */
.io-never{padding-left:1.1em}
.io-never li::marker{content:"\2715  ";color:var(--bad)}

/* price */
.io-price{font-weight:800;color:var(--ink);letter-spacing:-.01em}
.io-price small{font-weight:600;color:var(--slate)}

/* draft placeholder: must be zero before anything ships */
.tbd{background:#fef3c7;color:#92400e;border:1px dashed #f59e0b;border-radius:3px;padding:0 3px}