/* ==========================================================================
   01-variables.css - CSS Custom Properties
   ========================================================================== */

:root {
  /* Couleurs principales — cyan « Vallée du Trient » (#00b1e7) */
  --t-primary:          #00B1E7;  /* cyan signature : remplissages, boutons, accents */
  --t-primary-dark:     #0089B8;  /* cyan lisible : liens, eyebrows, texte sur fond clair */
  --t-primary-darker:   #006F96;  /* hover des liens / fort contraste */
  --t-primary-light:    #E3F6FC;  /* fond cyan très clair (icônes, tuiles) */
  --t-secondary:        #2E7D32;  /* vert montagne — couleur de soutien */
  --t-secondary-dark:   #1B5E20;
  --t-secondary-light:  #EDF7EE;
  --t-accent:           #8B6914;  /* bois / buvette — accent ponctuel */
  --t-accent-dark:      #6B4F10;
  --t-accent-light:     #FDF6E3;

  /* Neutres — alignés sur la charte VDT (#1d1d1d / #5f5f5f / gris clairs) */
  --t-bg:               #F4F6F7;
  --t-bg-alt:           #FFFFFF;
  --t-text:             #1D1D1D;
  --t-text-light:       #5F5F5F;
  --t-text-muted:       #8A8A8A;
  --t-white:            #FFFFFF;
  --t-border:           #E2E2E2;
  --t-border-light:     #EFEFEF;

  /* Sémantiques */
  --t-success:          #16A34A;
  --t-warning:          #D97706;
  --t-error:            #E2001A;  /* rouge suisse (alertes / accents VDT) */
  --t-open:             #16A34A;
  --t-closed:           #6B7280;

  /* Typographie — Open Sans (charte VDT) */
  --t-font-heading:     'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --t-font-body:        'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --t-font-size-xs:     0.75rem;   /* 12px */
  --t-font-size-sm:     0.875rem;  /* 14px */
  --t-font-size-base:   1rem;      /* 16px */
  --t-font-size-md:     1.125rem;  /* 18px */
  --t-font-size-lg:     1.375rem;  /* 22px */
  --t-font-size-xl:     1.75rem;   /* 28px */
  --t-font-size-2xl:    2.25rem;   /* 36px */
  --t-font-size-3xl:    3rem;      /* 48px */
  --t-font-size-4xl:    3.75rem;   /* 60px */
  --t-line-height:      1.65;
  --t-line-height-tight:1.2;

  /* Espacement */
  --t-space-1:  0.25rem;
  --t-space-2:  0.5rem;
  --t-space-3:  0.75rem;
  --t-space-4:  1rem;
  --t-space-5:  1.25rem;
  --t-space-6:  1.5rem;
  --t-space-8:  2rem;
  --t-space-10: 2.5rem;
  --t-space-12: 3rem;
  --t-space-16: 4rem;
  --t-space-20: 5rem;
  --t-space-24: 6rem;
  --t-space-32: 8rem;

  /* Border radius — coins discrets type VDT (4 / 8 / 12 / 16px) */
  --t-radius-sm:   4px;
  --t-radius-md:   8px;
  --t-radius-lg:   12px;
  --t-radius-xl:   16px;
  --t-radius-full: 9999px;

  /* Ombres — plus légères et aériennes (look épuré VDT) */
  --t-shadow-sm:  0 1px 2px rgba(0,0,0,.05), 0 1px 3px rgba(0,0,0,.04);
  --t-shadow-md:  0 2px 8px rgba(0,0,0,.07), 0 1px 3px rgba(0,0,0,.05);
  --t-shadow-lg:  0 6px 20px rgba(0,0,0,.08), 0 2px 8px rgba(0,0,0,.05);
  --t-shadow-xl:  0 12px 32px rgba(0,0,0,.10), 0 4px 12px rgba(0,0,0,.06);

  /* Transitions */
  --t-transition-fast:   150ms ease;
  --t-transition-base:   250ms ease;
  --t-transition-slow:   400ms ease;

  /* Layout */
  --t-max-content:  760px;
  --t-max-wide:     1340px;
  --t-max-full:     1600px;
  --t-gutter:       1.5rem;
  --t-section-gap:  var(--t-space-20);

  /* Header Astra */
  --t-header-height: 72px;
}

@media (max-width: 768px) {
  :root {
    --t-font-size-2xl: 1.75rem;
    --t-font-size-3xl: 2.25rem;
    --t-font-size-4xl: 2.75rem;
    --t-section-gap:   var(--t-space-16);
    --t-gutter:        1rem;
  }
}