/* =============================================================
   DAXTON FAMILY — the immutable root shared by every Daxton brand.

   Rule of thumb: if you can imagine a future Daxton company that
   would NOT want this rule, it does not belong in family. Family
   is the black canvas, ceremonial gold, the endorsement lockup,
   the base primitives, and the motion baseline. Nothing else.

   No brand-specific colors here. Sapphire lives in digital.css.
   Warm cream lives in studios.css. Whatever Holdings picks lives
   in holdings.css.
   ============================================================= */

/* ---------- 1. FAMILY PALETTE — the only two colors here ---------- */
:root {
  /* The black canvas every Daxton site sits on. */
  --daxton-black:    #080B0C;

  /* Ceremonial gold — Holdings' seal, endorsement lockup, moments
     of dedication. Every brand may use it, but only ceremonially,
     never as UI. Two values: bright for the mark, quiet for the
     rule under it. */
  --heritage-gold:   #D4A437;
  --gold-quiet:      #8E6E22;
}

/* ---------- 2. SPACE — 8px base, no off-scale values ---------- */
:root {
  --s-1:  0.25rem;  --s-2:  0.5rem;   --s-3: 0.75rem;
  --s-4:  1rem;     --s-5:  1.5rem;   --s-6: 2rem;
  --s-7:  3rem;     --s-8:  4rem;     --s-9: 6rem;
  --s-10: 8rem;     --s-11: 10rem;

  --section-y:       clamp(var(--s-9), 11vw, var(--s-11));
  --section-y-tight: clamp(var(--s-8), 7vw, var(--s-9));

  --measure:   62ch;
  --gutter:    clamp(1.5rem, 4vw, 3rem);
  --page:      1200px;
  --page-wide: 1360px;
}

/* ---------- 3. MOTION ---------- */
:root {
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur:  .45s;
}

/* ---------- 4. RESET / BASE ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
}

img, svg { display: block; max-width: 100%; }
a        { color: inherit; text-decoration: none; }

/* ---------- 5. LAYOUT PRIMITIVES — no color, only rhythm ---------- */
.wrap      { width: 100%; max-width: var(--page);      margin-inline: auto; padding-inline: var(--gutter); }
.wrap-wide { width: 100%; max-width: var(--page-wide); margin-inline: auto; padding-inline: var(--gutter); }

.section       { padding-block: var(--section-y); }
.section-tight { padding-block: var(--section-y-tight); }

/* ---------- 6. SKIP LINK (a11y baseline) ---------- */
.skip {
  position: absolute; left: -9999px;
  padding: var(--s-3) var(--s-5); z-index: 200;
}
.skip:focus { left: var(--s-4); top: var(--s-4); }

/* ---------- 7. REVEAL — the one motion primitive family owns ---------- */
.reveal            { opacity: 0; transform: translateY(18px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.is-in      { opacity: 1; transform: none; }
.reveal[data-delay="1"] { transition-delay: .08s; }
.reveal[data-delay="2"] { transition-delay: .16s; }
.reveal[data-delay="3"] { transition-delay: .24s; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .reveal { opacity: 1; transform: none; }
}
