/*
 * ============================================================
 * INTEGRITY THEME — DESIGN TOKENS
 * Fonte: Estate Integrity Design System
 * Uso: importare come primo foglio di stile, prima di style.css
 * ============================================================
 */

:root {

  /* ----------------------------------------------------------
   * COLORI
   * ---------------------------------------------------------- */

  /* Palette principale */
  --color-primary:        #0E1C18;   /* Teal scuro — sfondi hero, CTA banner, navbar scura */
  --color-accent:         #10B981;   /* Verde smeraldo — bottoni primari, badge, link attivi */
  --color-surface:        #F8F9FF;   /* Grigio arioso — sfondo sezioni chiare */
  --color-white:          #ffffff;
  --color-text-main:      #1A1A1A;
  --color-text-muted:     #64748B;

  /* Varianti funzionali (derivate dalla palette) */
  --color-accent-hover:   #0ea271;   /* Verde più scuro per hover bottoni */
  --color-accent-light:   #d1fae5;   /* Verde pallido per badge/chip su sfondo bianco */
  --color-primary-overlay: rgba(14, 28, 24, 0.72); /* Overlay hero su immagine */
  --color-border:         #e2e8f0;   /* Bordi card, separatori */
  --color-border-dark:    rgba(255,255,255,0.12); /* Bordi su sfondo scuro */

  /* Stato / feedback */
  --color-success:        #10B981;
  --color-error:          #ef4444;


  /* ----------------------------------------------------------
   * TIPOGRAFIA
   * ---------------------------------------------------------- */

  --font-family:          'Inter', sans-serif;

  /* Scale fluida */
  --font-size-h1:         clamp(2rem, 5vw, 3.5rem);
  --font-size-h2:         clamp(1.5rem, 4vw, 2.5rem);
  --font-size-h3:         clamp(1.2rem, 3vw, 1.8rem);
  --font-size-body:       clamp(1rem, 2vw, 1.125rem);
  --font-size-small:      0.875rem;
  --font-size-label:      0.75rem;   /* Badge, overline, caption */

  /* Pesi */
  --font-weight-regular:  400;
  --font-weight-medium:   500;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;
  --font-weight-black:    900;       /* Titoli hero */

  /* Line-height */
  --line-height-tight:    1.15;      /* Titoli grandi */
  --line-height-normal:   1.5;       /* Body */
  --line-height-relaxed:  1.75;      /* Articoli blog */

  /* Letter-spacing */
  --letter-spacing-label: 0.08em;   /* Overline / badge uppercase */
  --letter-spacing-body:  0.01em;


  /* ----------------------------------------------------------
   * SPAZIATURE
   * ---------------------------------------------------------- */

  --space-1:   0.25rem;   /*  4px */
  --space-2:   0.5rem;    /*  8px */
  --space-3:   0.75rem;   /* 12px */
  --space-4:   1rem;      /* 16px */
  --space-5:   1.25rem;   /* 20px */
  --space-6:   1.5rem;    /* 24px */
  --space-8:   2rem;      /* 32px */
  --space-10:  2.5rem;    /* 40px */
  --space-12:  3rem;      /* 48px */
  --space-16:  4rem;      /* 64px */
  --space-20:  5rem;      /* 80px */
  --space-24:  6rem;      /* 96px */

  /* Spaziatura sezioni */
  --section-padding-y:    clamp(4rem, 8vw, 7rem);
  --section-padding-x:    clamp(1rem, 5vw, 2rem);


  /* ----------------------------------------------------------
   * LAYOUT
   * ---------------------------------------------------------- */

  --container-max-width:  1280px;
  --container-padding:    clamp(1rem, 4vw, 2rem);

  /* Grid gap */
  --grid-gap:             clamp(1rem, 3vw, 2rem);


  /* ----------------------------------------------------------
   * BORDI E RAGGI
   * ---------------------------------------------------------- */

  --radius-standard:      4px;
  --radius-sm:            2px;
  --radius-md:            8px;
  --radius-lg:            12px;
  --radius-pill:          999px;    /* Badge, bottoni arrotondati */


  /* ----------------------------------------------------------
   * OMBRE
   * ---------------------------------------------------------- */

  --shadow-sm:    0 1px 3px rgba(0,0,0,0.08);
  --shadow-md:    0 4px 16px rgba(0,0,0,0.10);
  --shadow-lg:    0 8px 32px rgba(0,0,0,0.13);
  --shadow-card:  0 2px 8px rgba(14,28,24,0.07);  /* Ombra card su sfondo chiaro */


  /* ----------------------------------------------------------
   * TRANSIZIONI
   * ---------------------------------------------------------- */

  --transition-smooth:    all 0.3s ease-in-out;
  --transition-fast:      all 0.15s ease;
  --transition-color:     color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;


  /* ----------------------------------------------------------
   * Z-INDEX
   * ---------------------------------------------------------- */

  --z-base:       1;
  --z-dropdown:   100;
  --z-sticky:     200;
  --z-overlay:    300;
  --z-modal:      400;

}