/* ==========================================================================
   AURORA — DESIGN TOKENS
   Palette ufficiale: #1278a9 (Pantone 7690C) · #92b2b1 (Pantone 5507C)
   ========================================================================== */

:root {
  /* -------------------------------------------------------------------- */
  /* COLOR · PALETTE BRAND                                                 */
  /* -------------------------------------------------------------------- */
  --white:        #FFFFFF;
  --paper:        #FAFBFC;
  --stone-50:     #F4F6F7;
  --stone-100:    #E8EDEE;
  --stone-200:    #D4DCDD;
  --stone-300:    #B8C5C4;

  --ink-900:      #0D1A22;
  --ink-800:      #152530;
  --ink-700:      #1E3340;
  --grey-600:     #4A5C63;
  --grey-400:     #7A8E94;
  --grey-200:     #C5D0D2;

  /* Brand primario — Pantone 7690C */
  --blue-700:     #0E5F87;
  --blue-600:     #1278a9;
  --blue-500:     #1A8DBF;
  --blue-400:     #4AA8CC;
  --blue-100:     #D6EBF4;
  --blue-050:     #EDF6FA;

  /* Brand secondario — Pantone 5507C */
  --aurora-grey:  #92b2b1;
  --aurora-grey-dark: #6E9493;
  --aurora-grey-light: #B8CECD;

  --wood-500:     #8A7A68;
  --wood-300:     #B9AD9B;

  /* -------------------------------------------------------------------- */
  /* COLOR · TOKEN SEMANTICI                                               */
  /* -------------------------------------------------------------------- */
  --color-bg:               var(--paper);
  --color-bg-alt:           var(--stone-50);
  --color-bg-inverse:       var(--ink-900);
  --color-surface:          var(--white);
  --color-surface-inverse:  var(--ink-800);

  --color-border:           var(--stone-200);
  --color-border-strong:    var(--grey-200);
  --color-border-inverse:   rgba(255, 255, 255, 0.12);

  --color-text-primary:     var(--ink-800);
  --color-text-secondary:   var(--grey-600);
  --color-text-tertiary:    var(--grey-400);
  --color-text-inverse:     var(--stone-50);
  --color-text-inverse-sec: rgba(244, 246, 247, 0.68);

  --color-accent:           var(--blue-600);
  --color-accent-hover:     var(--blue-700);
  --color-accent-soft:      var(--blue-100);
  --color-accent-soft-bg:   var(--blue-050);
  --color-accent-on-dark:   var(--aurora-grey);
  --color-accent-secondary: var(--aurora-grey);

  --color-focus-ring:       var(--blue-500);

  /* -------------------------------------------------------------------- */
  /* TYPOGRAPHY                                                           */
  /* -------------------------------------------------------------------- */
  --font-display: 'Michroma', 'Helvetica Neue', Arial, sans-serif;
  --font-body:    'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;

  --tracking-tight:  -0.02em;
  --tracking-normal: 0em;
  --tracking-wide:   0.06em;
  --tracking-wider:  0.16em;

  --fs-display-xl: clamp(2.4rem, 1.8rem + 3.2vw, 5.2rem);
  --fs-display-lg: clamp(2rem, 1.6rem + 2vw, 3.5rem);
  --fs-display-md: clamp(1.6rem, 1.35rem + 1.2vw, 2.4rem);
  --fs-heading-lg: clamp(1.35rem, 1.15rem + 0.7vw, 1.75rem);
  --fs-heading:    1.2rem;
  --fs-body-lg:    1.125rem;
  --fs-body:       1rem;
  --fs-small:      0.9375rem;
  --fs-label:      0.8125rem;
  --fs-eyebrow:    0.75rem;

  --lh-tight:   1.08;
  --lh-snug:    1.25;
  --lh-normal:  1.6;
  --lh-relaxed: 1.72;

  /* -------------------------------------------------------------------- */
  /* SPACING — scala 8px                                                   */
  /* -------------------------------------------------------------------- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --space-40: 160px;

  --section-pad-y: clamp(72px, 7vw, 140px);
  --container-pad-x: clamp(20px, 5vw, 72px);
  --container-max: 1320px;
  --grid-gap: clamp(16px, 2vw, 28px);

  /* -------------------------------------------------------------------- */
  /* RADIUS                                                               */
  /* -------------------------------------------------------------------- */
  --radius-xs:   2px;
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-pill: 999px;

  /* -------------------------------------------------------------------- */
  /* SHADOW                                                               */
  /* -------------------------------------------------------------------- */
  --shadow-xs: 0 1px 2px rgba(13, 26, 34, 0.04);
  --shadow-sm: 0 4px 16px rgba(13, 26, 34, 0.06);
  --shadow-md: 0 12px 32px rgba(13, 26, 34, 0.08);

  /* -------------------------------------------------------------------- */
  /* MOTION                                                               */
  /* -------------------------------------------------------------------- */
  --ease-premium: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out:     cubic-bezier(0.16, 1, 0.3, 1);

  --duration-fast: 160ms;
  --duration-base: 280ms;
  --duration-slow: 480ms;

  --reveal-distance: 16px;
}