/* O'Vestiaire — jetons du design system (rôles neutres --alv-*).
   Valeurs relevées sur l'accueil validé « Tribune fond noir » (28/09/2026),
   avec les deux réglages de la cliente : logo plus grand, rouge adouci. */
:root {
  /* Fonds */
  --alv-bg: #0A0904;
  --alv-bg-raised: #18150E;
  --alv-surface: #16130C;
  --alv-surface-2: #1F1B13;

  /* Textes */
  --alv-ink: #F7F3EA;
  --alv-cream: #EFE4CC;
  --alv-ink-soft: rgba(247, 243, 234, .74);
  --alv-ink-faint: rgba(247, 243, 234, .5);

  /* Or — toujours en dégradé lumineux, jamais à plat */
  --alv-gold: linear-gradient(110deg, #A37C46 0%, #F7DB8E 46%, #FFEEBA 54%, #B0894E 100%);
  --alv-gold-fill: linear-gradient(120deg, #B0894E 0%, #F7DB8E 45%, #FFECB2 55%, #BE9658 100%);
  --alv-gold-sheen: linear-gradient(110deg, #A37C46 0%, #F7DB8E 30%, #FFF6DC 45%, #FFEEBA 50%, #F7DB8E 60%, #B0894E 100%);
  /* Pinceau du balayage de la carte et jauge « À suivre » : or plus soutenu et plus chaud, reflet clair étroit au centre.
     Aucun arrêt plus sombre que #A37C46 (pas de marron), pas de jaune citron. */
  --alv-gold-brush: linear-gradient(110deg, #B3853F 0%, #E2B65C 28%, #F0CD78 42%, #FBE6AE 50%, #EFC870 58%, #D2A24F 78%, #B88A45 100%);
  --alv-gold-brush-echo: linear-gradient(120deg, #B3853F 0%, #DDAE55 40%, #EDC56C 50%, #D2A24F 72%, #B88A45 100%);
  --alv-gold-solid: #F7DB8E;           /* filets et icônes uniquement */
  --alv-line: rgba(247, 219, 142, .45);
  --alv-hair: rgba(247, 219, 142, .16);

  /* Rouge adouci (était #DA121A) — boutons, macaron, un seul grand moment rouge */
  --alv-red: #C8372D;
  --alv-red-hover: #D6402F;
  --alv-red-deep: #A92B23;
  --alv-yellow: #FCDD09;               /* jaune catalan : accent rare */

  /* Typographie */
  --alv-font-display: "Bevan", "Rockwell", serif;
  --alv-font-label: "Barlow Condensed", "Arial Narrow", sans-serif;
  --alv-font-body: "Barlow", system-ui, sans-serif;

  --alv-fs-hero: clamp(38px, 10.2vw, 86px);
  --alv-fs-h2: clamp(46px, 6.3vw, 98px);
  --alv-fs-h2-sm: clamp(40px, 5vw, 76px);
  --alv-fs-h3: clamp(30px, 3.2vw, 48px);
  --alv-fs-h4: clamp(24px, 1.9vw, 30px);
  --alv-fs-body: 17px;
  --alv-fs-small: 15px;
  --alv-fs-label: 13px;
  --alv-track-display: -.045em;
  --alv-track-label: .13em;

  /* Espaces et grille */
  --alv-gutter: clamp(20px, 7vw, 101px);
  --alv-section-y: clamp(72px, 7.3vw, 112px);
  --alv-max: 1238px;
  --alv-radius-sm: 10px;
  --alv-radius: 14px;
  --alv-radius-lg: 18px;

  /* Ombres — douces, en couches */
  --alv-shadow-1: 0 1px 0 rgba(255, 238, 186, .04) inset, 0 10px 24px -14px rgba(0, 0, 0, .8);
  --alv-shadow-2: 0 1px 0 rgba(255, 238, 186, .06) inset, 0 22px 50px -18px rgba(0, 0, 0, .9), 0 8px 18px -10px rgba(0, 0, 0, .6);
  --alv-glow-gold: 0 0 0 1px rgba(247, 219, 142, .55), 0 0 32px -6px rgba(247, 219, 142, .25);
  --alv-shadow-red: 0 18px 40px -16px rgba(200, 55, 45, .55);

  /* Logo — plus grand que la version validée (58 → 88 px) */
  --alv-logo-h: 88px;
  --alv-logo-h-compact: 56px;
  --alv-logo-h-footer: 120px;
  --alv-header-h: 108px;
  --alv-header-h-compact: 76px;

  /* Mouvement */
  --alv-ease-out: cubic-bezier(.16, 1, .3, 1);
  --alv-ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --alv-ease-back: cubic-bezier(.34, 1.56, .64, 1);
  --alv-dur-xs: .18s;
  --alv-dur-s: .35s;
  --alv-dur-m: .7s;
  --alv-dur-l: 1.1s;
  --alv-dur-hover: .55s;
  --alv-dur-reveal: .8s;       /* apparition d'un bloc de texte */
  --alv-dur-title: .9s;        /* lignes de titre derrière le masque */
  --alv-dur-item: .8s;         /* cartes d'une rangée */
  --alv-dur-clip: 1s;          /* images révélées par clip-path */
  --alv-dur-brush: .7s;        /* pinceau or tracé */
  --alv-dur-pose: .9s;         /* polaroïds posés */
  --alv-dur-sheen: 1.2s;       /* reflet or du macaron */
  --alv-dur-pin: .7s;          /* repère de carte */
  --alv-dur-page-out: .35s;    /* rideau, sortie de page */
  --alv-dur-page-in: .5s;      /* rideau, entrée de page */
  --alv-reveal-y: 24px;
  --alv-item-y: 28px;
  --alv-slide-x: 60px;         /* carrousels téléphone : entrée par le côté */
  --alv-pin-y: -40px;
  --alv-pose-angle: 14;        /* degrés d'écart au repos, polaroïds */
  --alv-stagger: .07s;
  --alv-stagger-title: .06s;
  /* Le lieu : galerie et visionneuse */
  --alv-dur-filter: .6s;       /* photos qui entrent après un filtre (posées comme des polaroïds) */
  --alv-stagger-filter: .07s;
  --alv-pose-angle-gallery: 4; /* degrés d'écart au repos, photos de la galerie */
  --alv-dur-lb: .35s;          /* fond de la visionneuse : fondu à l'ouverture et à la fermeture */
  --alv-dur-lb-flip: .6s;      /* photo qui grandit depuis sa vignette */
  /* La carte : changement d'onglet (~.7 s au total : .45 s + .25 s de décalage) */
  --alv-dur-tab: .45s;         /* apparition d'un panneau, d'un plat, d'un filet */
  --alv-tab-y: 14px;           /* décalage des cartes à l'entrée d'un panneau */
  --alv-stagger-tab: .25s;     /* durée totale du décalage entre éléments */
  --alv-dur-scroll: .9s;       /* défilement vers le haut du panneau */
  /* La carte : passage d'une rubrique à l'autre au pinceau or (le pinceau est à l'écran dès la première image) */
  --alv-dur-sweep: .9s;        /* lien « À suivre » : changement de chapitre, plus ample */
  --alv-dur-sweep-tab: .7s;    /* clic d'onglet ou lien interne : le même pinceau, un peu plus vif que « À suivre » */
  --alv-ease-sweep: power1.inOut; /* courbe GSAP du trait (nom GSAP, pas une courbe CSS) */
  --alv-sweep-tilt: 12;        /* degrés d'inclinaison du pinceau */
  --alv-dur-faq: .45s;         /* Réserver : volet « Bon à savoir » qui s'ouvre, chevron */
  /* Ardoise du jour : tracé à la craie */
  --alv-dur-chalk-fade: .9s;
  --alv-dur-chalk-head: .7s;   /* titre, date, prix, pied */
  --alv-dur-chalk-rule: .6s;   /* filets */
  --alv-dur-chalk-course: .9s; /* entrée, plat, dessert */
  --alv-stagger-chalk-head: .15s;
  --alv-stagger-chalk-course: .28s;
  --alv-stagger-chalk-price: .16s;
  /* Les soirées : affiche posée, tampon « Soirée terminée » (durée : --alv-dur-pose, reflet : --alv-dur-sheen) */
  --alv-pose-angle-poster: 8;  /* degrés d'écart au repos, affiche de la fiche */
  --alv-stamp-scale: 1.5;      /* le tampon arrive plus grand, comme le macaron */
  --alv-stamp-from: -18;       /* degrés, départ du tampon */
  --alv-stamp-rest: -8;        /* degrés, tampon posé (lu aussi par le CSS) */
  --alv-stamp-at: 1.05;        /* secondes après le début du héros : l'affiche est posée */
}

/* Téléphone : mouvements plus courts et plus sobres */
@media (max-width: 640px) {
  :root {
    --alv-dur-reveal: .6s;
    --alv-dur-title: .7s;
    --alv-dur-item: .6s;
    --alv-dur-clip: .8s;
    --alv-dur-pose: .7s;
    --alv-pose-angle-poster: 4;
    --alv-reveal-y: 16px;
    --alv-item-y: 18px;
    --alv-slide-x: 40px;
    --alv-pin-y: -28px;
    --alv-stagger: .05s;
    --alv-stagger-title: .05s;
    --alv-dur-filter: .45s;
    --alv-dur-tab: .35s;
    --alv-tab-y: 10px;
    --alv-stagger-tab: .2s;
    --alv-dur-scroll: .7s;
    --alv-dur-sweep: .7s;
    --alv-dur-sweep-tab: .55s;
    --alv-dur-faq: .35s;
  }
}

@media (max-width: 760px) {
  :root {
    --alv-logo-h: 64px;
    --alv-logo-h-compact: 48px;
    --alv-header-h: 80px;
    --alv-header-h-compact: 64px;
    --alv-logo-h-footer: 96px;
    --alv-fs-body: 17px;
  }
}
