/* ===========================================================
   ABCO GLAZING — THEME LAYER  (tentative: "Midnight Editorial · Carbon")
   Swap the whole look later by editing ONLY this file.
   Every value here is consumed by site.css via var(--name).
   =========================================================== */
:root{
  /* Surfaces / backgrounds */
  --bg:#0b1016;            /* page background */
  --bg-2:#11202b;          /* gradient stop */
  --bg-3:#0a0f15;          /* gradient stop */
  --surface:#101a24;       /* cards / panels */
  --surface-2:#0e1620;     /* alt panel */

  /* Text */
  --ink:#f1f6f8;           /* headings / strong text on dark */
  --body:#c4d3da;          /* body text on dark */
  --muted:#90a6b0;         /* secondary text */
  --ink-on-accent:#04222a; /* text on accent fills */

  /* Accent (glass cyan) */
  --accent:#36c5d6;
  --accent-2:#48d6e6;
  --accent-deep:#1f8fb0;
  --accent-soft:rgba(54,197,214,.14);

  /* Lines / borders */
  --line:rgba(255,255,255,.12);
  --line-strong:rgba(255,255,255,.22);

  /* Hero / banner background (with the angled-glass + carbon feel) */
  --hero-bg:
    repeating-linear-gradient(45deg,rgba(255,255,255,.025) 0,rgba(255,255,255,.025) 1px,transparent 1px,transparent 9px),
    radial-gradient(120% 90% at 85% 4%,rgba(54,197,214,.22),transparent 55%),
    linear-gradient(160deg,#0b1016,#11202b 72%,#0a0f15);

  /* Homepage hero photo + readability overlay */
  --hero-photo:url("../images/hero.jpg");
  --hero-overlay:linear-gradient(100deg,rgba(8,13,18,.92),rgba(10,15,21,.72) 48%,rgba(10,15,21,.32));

  /* Gradient used for primary buttons / pills */
  --accent-grad:linear-gradient(135deg,#36c5d6,#1f8fb0);

  /* Typography */
  --font-head:'Cormorant Garamond',Georgia,serif;
  --font-body:'Inter',-apple-system,Segoe UI,Roboto,sans-serif;
  --h-weight:600;          /* heading weight */
  --eyebrow-color:#48d6e6;

  /* Shape */
  --radius:0;
  --radius-lg:0;
  --btn-radius:0;          /* square buttons */
  --shadow:0 18px 50px rgba(0,0,0,.45);

  /* Logo: which file shows on dark vs light headers */
  --logo-on-dark:url("../images/logo-white-text.png");   /* blue frame + white text — for dark backgrounds */
  --logo-on-light:url("../images/logo-color.png");        /* blue frame + dark text — for light backgrounds */

  /* Layout */
  --maxw:1180px;

  /* Mode flag for any per-mode tweaks in site.css */
  --is-dark:1;
}