/* Bailey Photographie — design tokens (issus de maquette/Main.dc.html)
   Palette « Ivoire & encre ». */

:root {
  /* Couleurs — palette « Ivoire & encre » */
  --bg: #FAF6EF;        /* fond */
  --bg-alt: #F2EADD;    /* sections alternées, encadrés */
  --sand: #E4D7C3;      /* repères, numéros décoratifs */
  --line: #D8CAB4;      /* filets, bordures de champs */
  --accent: #6E5E50;    /* script, liens, sous-titres — 5,8:1 sur --bg */
  --ink-soft: #463E37;  /* textes courants */
  --ink: #1E1A17;       /* titres, boutons — 16:1 sur --bg */
  --dark: #2B2520;      /* bloc contact, bandeaux d'appel à l'action */
  --on-dark: #FAF6EF;   /* texte sur --dark — 14:1 */
  --ph: #E4D7C3;        /* fond des images pendant le chargement */
  --ph-dark: #3A322B;
  --error: #A3261B;
  --error-bg: #F7E3DF;

  /* Typographies */
  --font-display: 'Abril Fatface', Georgia, serif;
  --font-script: 'Parisienne', cursive;
  --font-body: 'Cormorant Garamond', Georgia, serif; /* → 'TT Ramillas' dès que la licence web est fournie */
  --font-ui: 'Poppins', Arial, sans-serif;

  /* Échelle (ordinateur → smartphone via clamp) */
  --fs-hero: clamp(72px, 12.2vw, 176px);   /* nom dans le hero, interligne 0.9 */
  --fs-h1: clamp(32px, 3.6vw, 52px);       /* interligne 1.1 */
  --fs-h2: clamp(28px, 3vw, 44px);         /* interligne 1.1 */
  --fs-h3: clamp(22px, 1.9vw, 28px);       /* interligne 1.2 */
  --fs-script: clamp(30px, 3.1vw, 44px);   /* interligne 1.2 */
  --fs-body: clamp(19px, 1.5vw, 21px);     /* interligne 1.6 */
  --fs-lead: clamp(21px, 1.8vw, 25px);
  --fs-ui: 12px;                            /* menu, boutons : 500, majuscules, letter-spacing .18em */
  --fs-eyebrow: 12px;                       /* sous-titres : 500, majuscules, letter-spacing .24em */
  --fs-small: 12px;

  /* Espacements */
  --space-1: 8px; --space-2: 16px; --space-3: 24px; --space-4: 32px;
  --space-5: 48px; --space-6: 64px; --space-7: 96px;
  --section: clamp(80px, 11vw, 160px);     /* 160 / 112 / 80 */
  --gutter: clamp(20px, 5.6vw, 80px);      /* 80 / 40 / 20 */

  /* Conteneurs */
  --wide: 1280px; --text: 760px; --narrow: 560px;

  /* Formes */
  --radius: 0; --radius-avatar: 50%;
  --shadow-float: 0 12px 40px rgba(30, 26, 23, .14);
  --tap: 44px;

  /* Mouvement */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --t-hover: .3s; --t-slide: .6s; --t-reveal: .8s; --reveal-shift: 24px;
  --t-intro-in: 1.1s; --t-intro-out: .7s; /* total ≈ 2,5 s */
}

/* Points de rupture de la maquette :
   ≤ 1100px : menu principal → burger
   ≤ 900px  : grilles en 1 colonne (ou 2 pour les grilles de cartes), piles verticales
   ≤ 600px  : grilles de cartes en 1 colonne, vignettes en 2 colonnes */

@media (prefers-reduced-motion: reduce) {
  :root { --t-hover: 0s; --t-slide: 0s; --t-reveal: 0s; --reveal-shift: 0px; }
}

/* Kit conformité (mu-plugin) : bandeau cookies aux couleurs du site.
   html:root l'emporte sur les valeurs par défaut du kit, chargé avant. */
html:root {
  --kit-fond: var(--bg);
  --kit-texte: var(--ink);
  --kit-texte-doux: var(--ink-soft);
  --kit-accent: var(--ink);
  --kit-accent-texte: var(--bg);
  --kit-bordure: var(--line);
  --kit-police: var(--font-ui);
  --kit-rayon: var(--radius);
  --kit-focus: var(--accent);
}
/* Bandeau cookies (plugin Fair Consent Banner) aux couleurs du site. */
html:root {
  --faircb-bg: var(--bg);
  --faircb-text: var(--ink);
  --faircb-muted: var(--ink-soft);
  --faircb-accent: var(--ink);
  --faircb-accent-text: var(--bg);
  --faircb-border: var(--line);
  --faircb-soft: var(--bg-alt);
  --faircb-font: var(--font-ui);
  --faircb-radius: var(--radius);
  --faircb-focus: var(--accent);
}
/* Panneau « Préférences d'affichage » (plugin Reading Comfort Panel) aux couleurs du site. */
html:root {
  --rcpanel-bg: var(--bg);
  --rcpanel-text: var(--ink);
  --rcpanel-muted: var(--ink-soft);
  --rcpanel-accent: var(--ink);
  --rcpanel-accent-text: var(--bg);
  --rcpanel-border: var(--line);
  --rcpanel-font: var(--font-ui);
  --rcpanel-radius: var(--radius);
  --rcpanel-focus: var(--accent);
}
/* Préférence « Contraste renforcé » : textes secondaires, script et filets au plus foncé. */
html.rcpanel-contrast:root {
  --ink-soft: var(--ink);
  --accent: var(--ink);
  --line: var(--ink);
}
/* Préférence « Réduire les animations » : mêmes réglages que prefers-reduced-motion. */
html.rcpanel-reduce-motion:root { --t-hover: 0s; --t-slide: 0s; --t-reveal: 0s; --reveal-shift: 0px; }