/* Adriqa design tokens. Source of truth: brand/BRAND-GUIDE.md.
   Layout concept: one brass thread stitches a calm Bone editorial page;
   each brand takes over the full screen in its own palette and Archivo width. */
:root {
  color-scheme: light;

  /* Master palette (Bone 55 / Ink 30 / Fold 10 / Brass 5) */
  --ink: #11151F;
  --fold: #343B4C;
  --brass: #C49A52;   /* graphics only on light grounds, never small text */
  --bone: #F2EEE6;
  --mat: color-mix(in srgb, var(--bone) 90%, var(--fold));   /* cutting mat */
  --rule: color-mix(in srgb, var(--ink) 18%, transparent);
  --rule-soft: color-mix(in srgb, var(--ink) 10%, transparent);

  /* Adriqa Perform */
  --pf-red: #E8412C;
  --pf-carbon: #16181D;
  --pf-steel: #9097A3;
  --pf-chalk: #F5F5F3;

  /* Adriqa Urban */
  --ur-acid: #C8F03C;
  --ur-asphalt: #1B1B1B;
  --ur-concrete: #B9B5AE;
  --ur-smoke: #E9E6E0;

  /* Adriqa Pro */
  --pr-cobalt: #2448D8;
  --pr-navy: #0E1A3D;
  --pr-sky: #D9E2FF;
  --pr-paper: #F7F8FB;

  /* Adriqa Flex */
  --fx-lagoon: #17907F;
  --fx-deep: #0F3B3A;
  --fx-clay: #E59A7A;
  --fx-mist: #E4F2EF;

  /* Type */
  --f-display: "Archivo", "Arial Narrow", Arial, Helvetica, sans-serif;
  --f-body: "Archivo", Arial, Helvetica, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

  --v-master: "wdth" 118, "wght" 700;
  --v-head: "wdth" 112, "wght" 800;
  --v-perform: "wdth" 125, "wght" 900;
  --v-urban: "wdth" 62, "wght" 900;
  --v-pro: "wdth" 100, "wght" 800;
  --v-flex: "wdth" 100, "wght" 800;

  --fs-label: 0.75rem;                                   /* 12px mono labels */
  --fs-small: 0.875rem;
  --fs-body: 1.0625rem;
  --fs-lead: clamp(1.0625rem, 0.9rem + 0.6vw, 1.3125rem);
  --fs-h3: clamp(1.25rem, 1rem + 0.9vw, 1.75rem);
  --fs-h2: clamp(2.125rem, 1.2rem + 3.6vw, 4.25rem);
  --fs-mega: clamp(3.75rem, 1rem + 12vw, 11.5rem);

  /* Space and layout */
  --s1: 0.25rem; --s2: 0.5rem; --s3: 0.75rem; --s4: 1rem; --s5: 1.5rem;
  --s6: 2rem; --s7: 3rem; --s8: 4.5rem; --s9: 7rem;
  --maxw: 1240px;
  --gut: clamp(16px, 4.5vw, 56px);
  --hdr: 72px;
  --ease: cubic-bezier(.7, 0, .2, 1);
  --ease-out: cubic-bezier(.2, .8, .2, 1);
}

@media (max-width: 760px) {
  :root { --hdr: 60px; }
}