/* Primato shell: generated by build.py from tokens.css, fonts.css and shell-base.css. Edit those. */
/* Primato · design tokens
   Single source of truth for colour, type, space, radius, depth and motion.
   Brand colours and typefaces come from David's kit (ricerca/marchio-primato/david). */
:root {
  /* Brand */
  --p-yellow: #FFDA24;          /* Primato yellow: 13.8:1 on --p-black */
  --p-yellow-deep: #F2C200;     /* pressed / hover on yellow */
  --p-yellow-glow: rgba(255, 218, 36, .55);
  --p-black: #111;              /* brand near-black */
  --p-ivory: #F4F1E8;           /* brand light ground */
  --p-white: #FFFDF7;

  /* Warm greys: a drop of the ivory's warmth in every step */
  --p-g-990: #0A0A09;
  --p-g-950: #151412;
  --p-g-900: #1B1A17;
  --p-g-850: #23211E;
  --p-g-800: #2C2A26;
  --p-g-700: #3B3833;
  --p-g-600: #57534C;
  --p-g-500: #7A756C;           /* 4.6:1 on ivory */
  --p-g-400: #A29D93;           /* 7.4:1 on black */
  --p-g-300: #C3BEB3;
  --p-g-200: #DCD8CD;
  --p-g-100: #EBE8DF;

  /* Data colours: training zones, used as material in charts and particles */
  --p-z1: #8C8A84;
  --p-z2: #4C8DFF;
  --p-z3: #2FC98E;
  --p-z4: #FFDA24;
  --p-z5: #FF8F1F;
  --p-z6: #FF4636;
  --p-z7: #B566FF;
  --p-wind: #7FD4FF;
  --p-ok: #39D98A;

  /* Type */
  --p-font-display: "Barlow Semi Condensed", "Arial Narrow", "Roboto Condensed", system-ui, sans-serif;
  --p-font-text: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --p-fs-xs: .8125rem;   /* 13 */
  --p-fs-sm: .9375rem;   /* 15 */
  --p-fs-md: 1.0625rem;  /* 17 */
  --p-fs-lg: clamp(1.1875rem, 1.05rem + .45vw, 1.375rem);
  --p-fs-xl: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  --p-fs-2xl: clamp(2rem, 1.4rem + 2.2vw, 3.25rem);
  --p-fs-3xl: clamp(2.75rem, 1.6rem + 4.4vw, 5.5rem);
  --p-fs-4xl: clamp(3.5rem, 1.4rem + 8.4vw, 9.5rem);
  --p-fs-mega: clamp(4.25rem, 1rem + 13vw, 15rem);
  --p-lh-tight: .9;
  --p-lh-snug: 1.12;
  --p-lh-text: 1.55;
  --p-track-display: -.012em;
  --p-measure: 62ch;

  /* The logo's italic: the name is sheared by 0.205, i.e. 11.6 degrees */
  --p-slant: -11.6deg;
  --p-shear: .205;

  /* Space (4 px grid) */
  --p-s-1: .25rem;
  --p-s-2: .5rem;
  --p-s-3: .75rem;
  --p-s-4: 1rem;
  --p-s-5: 1.5rem;
  --p-s-6: 2rem;
  --p-s-7: 3rem;
  --p-s-8: 4rem;
  --p-s-9: 6rem;
  --p-s-10: 8rem;
  --p-s-11: 12rem;
  --p-section: clamp(5rem, 3rem + 9vw, 11rem);
  --p-gutter: clamp(1.25rem, .6rem + 3vw, 3.5rem);
  --p-max: 88rem;

  /* Radius: small for controls, larger as objects get bigger */
  --p-r-xs: 4px;
  --p-r-sm: 8px;
  --p-r-md: 14px;
  --p-r-lg: 22px;
  --p-r-xl: 34px;
  --p-r-pill: 999px;

  /* Depth: warm, low and wide */
  --p-shadow-1: 0 1px 2px rgba(10, 9, 6, .28), 0 2px 8px rgba(10, 9, 6, .18);
  --p-shadow-2: 0 10px 30px -12px rgba(10, 9, 6, .55), 0 2px 6px rgba(10, 9, 6, .25);
  --p-shadow-3: 0 40px 80px -30px rgba(10, 9, 6, .75), 0 12px 24px -12px rgba(10, 9, 6, .4);
  --p-ring: 0 0 0 2px var(--p-black), 0 0 0 4px var(--p-yellow);

  /* Motion */
  --p-dur-1: 120ms;
  --p-dur-2: 220ms;
  --p-dur-3: 420ms;
  --p-dur-4: 800ms;
  --p-dur-5: 1400ms;
  --p-ease-out: cubic-bezier(.16, 1, .3, 1);       /* expo out: arrivals */
  --p-ease-in-out: cubic-bezier(.65, 0, .35, 1);   /* scene changes */
  --p-ease-in: cubic-bezier(.7, 0, .84, 0);        /* exits */
  --p-ease-spring: cubic-bezier(.34, 1.56, .64, 1);/* small confirmations */

  /* Layers */
  --p-z-header: 900;
  --p-z-sheet: 950;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --p-dur-1: 0ms;
    --p-dur-2: 0ms;
    --p-dur-3: 0ms;
    --p-dur-4: 0ms;
    --p-dur-5: 0ms;
  }
}

/* Primato · local fonts (SIL OFL 1.1, see /assets/fonts/LICENSES-fonts.txt) */
@font-face { font-family: "Barlow Semi Condensed"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/barlow-sc-500.woff2") format("woff2"); }
@font-face { font-family: "Barlow Semi Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/barlow-sc-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow Semi Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/barlow-sc-700.woff2") format("woff2"); }
@font-face { font-family: "Barlow Semi Condensed"; font-style: italic; font-weight: 800; font-display: swap; src: url("../fonts/barlow-sc-800i.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/inter-400.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/inter-500.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/inter-600.woff2") format("woff2"); }

/* Primato · document-level rules for <primato-header> and <primato-footer> */
:root { --primato-header-h: 80px; }
@media (max-width: 859px) { :root { --primato-header-h: 68px; } }
primato-header { display: block; position: fixed; inset: 0 0 auto 0; z-index: var(--p-z-header); height: 0; }
primato-header:not(:defined) > * { display: none; }
primato-footer { display: block; background: var(--p-black); color: var(--p-ivory); }
primato-footer:not(:defined) { min-height: 32rem; }
primato-footer:not(:defined) > * { display: none; }
html.primato-sheet-open { overflow: hidden; }
