/* ==========================================================================
   DigitallyByAlvin — Design Tokens
   Every token below maps 1:1 onto a WordPress theme.json entry.
   See README.md § "Porting to WordPress" for the mapping table.
   ========================================================================== */

:root {

  /* --- Colour ------------------------------------------------------------
     theme.json → settings.color.palette
     Near-black with a faint blue-violet cast, per the approved reference. */
  --dba-ink:            #0A0A0E;   /* base            */
  --dba-ink-soft:       #0E0E14;   /* alternating band */
  --dba-charcoal:       #15151C;   /* cards, surfaces  */
  --dba-charcoal-lift:  #1D1D26;   /* hover surface    */
  --dba-ash:            #B4B4BD;   /* body copy — 9.60:1 on ink, AAA          */
  --dba-ash-dim:        #A0A0AA;   /* eyebrows, captions, meta — 7.63:1, AAA  */
  --dba-ash-mute:       #75757F;   /* DECORATIVE ONLY — rules, marks, lines.
                                      4.34:1. Never put text in this colour.  */
  --dba-bone:           #F5F4F1;   /* headings, primary button */
  --dba-brass:          #B99A6B;   /* single restrained accent */

  /* Derived — not palette entries, kept here so nothing is hardcoded. */
  --dba-hairline:       rgba(245, 244, 241, 0.12);
  --dba-hairline-soft:  rgba(245, 244, 241, 0.06);
  --dba-brass-soft:     rgba(185, 154, 107, 0.35);
  --dba-scrim-h:        linear-gradient(90deg, rgba(10,10,14,.15) 0%, rgba(10,10,14,.55) 45%, rgba(10,10,14,.88) 100%);
  --dba-scrim-v:        linear-gradient(180deg, rgba(10,10,14,.72) 0%, rgba(10,10,14,0) 28%, rgba(10,10,14,0) 62%, rgba(10,10,14,.9) 100%);

  /* --- Type --------------------------------------------------------------
     theme.json → settings.typography.fontFamilies */
  --dba-font-display: "Cormorant Garamond", "Times New Roman", Georgia, serif;
  --dba-font-ui:      "Jost", "Helvetica Neue", Helvetica, Arial, sans-serif;

  /* theme.json → settings.typography.fontSizes (fluid) */
  --dba-size-display: clamp(3.4rem, 8.2vw, 8.6rem);
  --dba-size-h1:      clamp(2.6rem, 5.4vw, 5rem);
  --dba-size-h2:      clamp(2rem, 3.6vw, 3.4rem);
  --dba-size-h3:      clamp(1.35rem, 1.9vw, 1.75rem);
  --dba-size-lead:    clamp(1.02rem, 1.25vw, 1.2rem);
  --dba-size-body:    clamp(0.95rem, 1.02vw, 1.03rem);
  --dba-size-small:   0.82rem;
  --dba-size-micro:   0.7rem;

  /* Letter-spacing — the wide tracking is the signature of this identity. */
  --dba-track-logo:    0.38em;
  --dba-track-nav:     0.22em;
  --dba-track-eyebrow: 0.34em;
  --dba-track-button:  0.2em;
  --dba-track-display: 0.02em;

  --dba-leading-tight: 1.02;
  --dba-leading-snug:  1.25;
  --dba-leading-body:  1.75;

  /* --- Space -------------------------------------------------------------
     theme.json → settings.spacing.spacingSizes */
  --dba-space-2xs: 6px;
  --dba-space-xs:  12px;
  --dba-space-s:   20px;
  --dba-space-m:   36px;
  --dba-space-l:   64px;
  --dba-space-xl:  96px;
  --dba-space-section: clamp(88px, 12vw, 168px);

  /* --- Layout ------------------------------------------------------------
     theme.json → settings.layout */
  --dba-gutter:     clamp(20px, 5vw, 72px);
  --dba-content:    1180px;   /* contentSize */
  --dba-wide:       1560px;   /* wideSize    */
  --dba-measure:    58ch;     /* readable prose width */

  /* --- Motion ------------------------------------------------------------
     Slow and subtle. Nothing bounces on this site. */
  --dba-ease:        cubic-bezier(0.22, 0.61, 0.36, 1);
  --dba-ease-image:  cubic-bezier(0.16, 0.84, 0.44, 1);
  --dba-dur-fast:    280ms;
  --dba-dur:         620ms;
  --dba-dur-slow:    1100ms;

  /* --- Borders -----------------------------------------------------------
     Hairlines only. No radii, no shadows anywhere in this system. */
  --dba-radius: 0;
  --dba-border: 1px solid var(--dba-hairline);
}

/* Respect the reader. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dba-dur-fast: 1ms;
    --dba-dur:      1ms;
    --dba-dur-slow: 1ms;
  }
}