/* SSC&Safety Alarm — Design tokens
   Portati 1:1 dal design system (_ds/.../tokens/{colors,typography,spacing}.css).
   I webfont Geist/Geist Mono sono caricati separatamente via wp_enqueue (Google Fonts). */

:root {
  /* ============================== COLORS ============================== */
  /* Base: ink & paper */
  --ink:          #0A0A0A;
  --ink-deep:     #070708;
  --paper:        #ECEEEF;

  /* Base: dark surfaces */
  --surface-1:    #0E0E0F;
  --surface-2:    #0E0F10;
  --surface-3:    #16181B;
  --well:         #0B0C0D;

  /* Base: accent (rosso brand SSC&Safety Alarm) */
  --lime:         #FC0102;
  --lime-soft:    rgba(252,1,2,.14);
  --lime-line:    rgba(252,1,2,.42);
  --lime-hover:   rgba(252,1,2,.78);

  /* Base: text ramp */
  --white:        #F2F3F4;
  --grey-100:     #E7E9EB;
  --grey-200:     #D2D5D9;
  --grey-300:     #B6B9BD;
  --grey-400:     #9A9DA2;
  --grey-500:     #86888C;
  --grey-600:     #7A7D80;
  --grey-700:     #6C7075;
  --grey-800:     #5A5C5F;

  /* Base: hairlines */
  --line-1:       rgba(255,255,255,.08);
  --line-card:    rgba(255,255,255,.09);
  --line-2:       rgba(255,255,255,.12);
  --line-3:       rgba(255,255,255,.14);
  --line-strong:  rgba(255,255,255,.22);
  --line-stronger:rgba(255,255,255,.24);
  --cross:        rgba(255,255,255,.28);
  --hatch:        rgba(255,255,255,.035);
  --hatch-card:   rgba(255,255,255,.04);

  /* Semantic aliases */
  --bg-page:        var(--ink);
  --bg-deep:        var(--ink-deep);
  --surface-card:   var(--surface-2);
  --surface-raised: var(--surface-1);
  --surface-chip:   var(--surface-3);
  --surface-well:   var(--well);
  --surface-paper:  var(--paper);

  --accent:         var(--lime);
  --accent-fill:    var(--lime-soft);
  --accent-line:    var(--lime-line);
  --accent-hover:   var(--lime-hover);
  --on-accent:      var(--white);

  --text-heading:   var(--white);
  --text-body:      var(--grey-400);
  --text-bright:    var(--grey-100);
  --text-data:      var(--grey-200);
  --text-label:     var(--grey-300);
  --text-caption:   var(--grey-500);
  --text-mono:      var(--grey-600);
  --text-faint:     var(--grey-700);

  --border-grid:    var(--line-1);
  --border-card:    var(--line-card);
  --border-hover:   var(--line-2);
  --border-control: var(--line-strong);
  --border-cta:     var(--line-stronger);
  --register:       var(--cross);

  /* ============================ TYPOGRAPHY ============================ */
  --font-sans: 'Geist', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --w-light:    300;
  --w-regular:  400;
  --w-medium:   500;
  --w-semibold: 600;

  --fs-hero:    52px;
  --fs-display: 44px;
  --fs-h1:      40px;
  --fs-stat:    42px;
  --fs-h2:      22px;
  --fs-h3:      17px;
  --fs-lg:      15px;
  --fs-body:    14px;
  --fs-sm:      13px;
  --fs-xs:      12px;
  --fs-mono:    11px;
  --fs-mono-sm: 10px;
  --fs-mono-xs: 9px;

  --lh-tight:   1.0;
  --lh-head:    1.05;
  --lh-snug:    1.3;
  --lh-body:    1.62;

  --ls-display: -.03em;
  --ls-head:    -.025em;
  --ls-tight:   -.015em;
  --ls-flat:    -.01em;
  --ls-mono:    .03em;
  --ls-label:   .06em;

  /* ============================== SPACING ============================= */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  22px;
  --sp-6:  26px;
  --sp-7:  30px;
  --sp-8:  34px;
  --sp-9:  40px;
  --sp-10: 52px;

  --r-xs:   3px;
  --r-sm:   5px;
  --r:      6px;
  --r-md:   8px;
  --r-pill: 99px;

  --col-max:    1180px;
  --content-pad: var(--sp-7);

  /* Ritmo verticale delle sezioni (più "aria" tra i blocchi) */
  --pad-sec:    112px;  /* sezioni standard */
  --pad-sec-lg: 152px;  /* sezioni ampie: split, moduli prodotto, hero-split */

  --bp-hatch: repeating-linear-gradient(135deg,
              var(--hatch) 0, var(--hatch) 1px,
              transparent 1px, transparent 16px);
  --bp-hatch-tight: repeating-linear-gradient(135deg,
              var(--hatch-card) 0, var(--hatch-card) 1px,
              transparent 1px, transparent 12px);

  --ease:        cubic-bezier(.22,.61,.36,1);
  --dur-fast:    .15s;
  --dur:         .22s;
  --dur-slow:    .4s;
}