/* ============================================================
   ILX TOKENS: v3 "Coastal Estate"
   Single source of truth for the Infinity visual system.
   Loaded first, before chrome and page component CSS.

   Direction: quiet coastal luxury. Near-black forest ink,
   warm ivory paper, burnished bronze accent used sparingly,
   antique gold hairlines on dark surfaces, Fraunces display
   serif for headlines, Plus Jakarta Sans for UI.
   ============================================================ */

/* ---- Self-hosted UI family (variable, 300-800) ---- */
@font-face{
  font-family:"Plus Jakarta Sans";
  src:url("../fonts/plus-jakarta-sans-normal-300-800-latin.woff2") format("woff2");
  font-weight:300 800;
  font-style:normal;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face{
  font-family:"Fraunces";
  src:url("../fonts/fraunces-normal-300-700-latin.woff2") format("woff2");
  font-weight:300 700;
  font-style:normal;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face{
  font-family:"Fraunces";
  src:url("../fonts/fraunces-italic-300-700-latin.woff2") format("woff2");
  font-weight:300 700;
  font-style:italic;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root{
  /* ---- Forest inks ---- */
  --ilx-forest-deep:#0b1f14;
  --ilx-forest:#143020;
  --ilx-forest-mid:#2e6b4c;
  --ilx-forest-light:#5b8f72;
  --ilx-forest-ghost:#edf3ec;
  --ilx-leaf:#6e9b3d;
  --ilx-leaf-soft:#eaf1dc;
  --ilx-sage:#a8bca4;

  /* ---- Icon chip color pairs (normal + hover): single source of truth so
     every .ic icon (inline-SVG or file-based via .ic-img) matches across
     light and dark (body.lx-night) skins. Dark-mode values are re-pointed
     in ilx-lighting.css, scoped to .ilx-main so chrome (header/drawer)
     never inherits page-only theming. ---- */
  --ilx-icon-bg:var(--ilx-forest-ghost);
  --ilx-icon-fg:var(--ilx-forest-mid);
  --ilx-icon-bg-hover:var(--ilx-forest-deep);
  --ilx-icon-fg-hover:var(--ilx-gold);

  /* ---- Burnished bronze (action accent: use sparingly) ---- */
  /* Deepened from #a8652a to pass WCAG AA (4.5:1) as small text on
     paper (5.03) and cream (4.57); white-on-bronze buttons now 5.29. */
  --ilx-orange:#9a5d26;
  --ilx-orange-deep:#8c5322;
  --ilx-orange-mid:#c58850;
  --ilx-orange-soft:#f7efe3;
  --ilx-orange-tint:#ebd9c2;

  /* ---- Antique gold (hairlines + eyebrows on dark) ---- */
  --ilx-gold:#c9b27e;
  --ilx-gold-dim:rgba(201,178,126,.45);

  /* ---- Surfaces & text ---- */
  --ilx-paper:#fbf9f4;
  --ilx-cream:#f3eee3;
  --ilx-white:#fff;
  --ilx-line:#e6e0d2;
  --ilx-line-dark:rgba(255,255,255,.13);
  --ilx-gray-50:#f5f2ea;
  --ilx-muted:#656c5d; /* deepened from #6b7263 for AA on cream (4.71) + paper (5.18) */
  --ilx-ink:#1f2a1e;
  --ilx-charcoal:#131711;

  /* ---- Type ---- */
  --ilx-sans:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --ilx-serif:"Fraunces",Georgia,serif;
  --ilx-display:"Fraunces",Georgia,serif;

  /* ---- Fluid type scale ---- */
  --ilx-fs-xs:.75rem;
  --ilx-fs-sm:.875rem;
  --ilx-fs-base:clamp(1rem,.96rem + .2vw,1.0625rem);
  --ilx-fs-lead:clamp(1.0625rem,1rem + .35vw,1.1875rem);
  --ilx-fs-h4:clamp(1.1rem,1.05rem + .3vw,1.25rem);
  --ilx-fs-h3:clamp(1.25rem,1.1rem + .7vw,1.5rem);
  --ilx-fs-h2:clamp(1.9rem,1.4rem + 2.2vw,2.9rem);
  --ilx-fs-h1:clamp(2.5rem,1.8rem + 3.8vw,4.4rem);
  --ilx-fs-mega:clamp(2.8rem,2rem + 4.6vw,5.2rem);

  /* ---- Radius ---- */
  --ilx-r-xs:4px;
  --ilx-r-sm:8px;
  --ilx-r-md:14px;
  --ilx-r-lg:22px;
  --ilx-pill:999px;

  /* ---- Shadows: long, warm, soft ---- */
  --ilx-shadow-sm:0 1px 2px rgba(19,26,16,.04),0 4px 14px rgba(19,26,16,.05);
  --ilx-shadow-md:0 2px 6px rgba(19,26,16,.05),0 10px 28px rgba(19,26,16,.08);
  --ilx-shadow:0 6px 18px rgba(19,26,16,.07),0 24px 56px rgba(19,26,16,.12);
  --ilx-shadow-lg:0 12px 28px rgba(19,26,16,.10),0 40px 90px rgba(19,26,16,.18);
  --ilx-shadow-bronze:0 10px 30px rgba(168,101,42,.28);

  /* ---- Motion ---- */
  --ilx-ease:cubic-bezier(.22,.61,.21,1);
  --ilx-ease-out:cubic-bezier(.16,1,.3,1);
  --ilx-dur:.7s;
  --ilx-dur-fast:.32s;

  /* ---- Layout ---- */
  --ilx-wide:1240px;
  --ilx-gutter:clamp(20px,4vw,40px);
  --ilx-section-y:clamp(80px,7vw + 40px,150px);
  --ilx-header-h:78px;
}

/* Cross-document view transitions: gentle fade between pages
   (progressive enhancement: ignored by older browsers). */
@view-transition{ navigation:auto; }
@media (prefers-reduced-motion:reduce){
  @view-transition{ navigation:none; }
}
::view-transition-old(root),
::view-transition-new(root){ animation-duration:.28s; }
