/* ============================================
   SÉMANTIQUES — Thème « Créatif »
   Agences · Magazines · Design · Retail créatif
   Slab Serif + Humanist + Geometric Humanist
   ============================================ */

:root {

  /* --- Surfaces --- */
  --surface-page:             var(--beige-clair);
  --surface-primary:          var(--blanc);
  --surface-secondary:        var(--rose-doux);
  --surface-tertiary:         var(--gris-doux);
  --surface-inverse:          var(--noir-doux);
  --surface-elevated:         var(--blanc);
  --surface-sunken:           var(--beige-clair);

  /* --- Texte --- */
  --text-primary:             var(--noir-doux);
  --text-secondary:           var(--gris-tres-fonce);
  --text-tertiary:            var(--gris-charbon);
  --text-inverse:             var(--blanc);
  --text-link:                var(--rouge-vif);
  --text-link-hover:          var(--bleu-vif);

  /* --- Accent --- */
  --accent:                   var(--rouge-vif);
  --accent-hover:             var(--bleu-vif);
  --accent-active:            var(--bleu-corporate);
  --accent-subtle:            var(--rose-doux);
  --accent-text:              var(--blanc);
  --accent-secondary:         var(--bleu-vif);

  /* --- Feedback --- */
  --success:                  var(--vert-foret);
  --success-subtle:           var(--vert-pastel);
  --success-text:             var(--vert-foret);
  --warning:                  var(--orange-energique);
  --warning-subtle:           var(--beige-clair);
  --warning-text:             var(--gris-ardoise);
  --danger:                   var(--rouge-vif);
  --danger-subtle:            var(--rose-doux);
  --danger-text:              var(--rouge-vif);
  --info:                     var(--bleu-vif);
  --info-subtle:              var(--bleu-glacial);
  --info-text:                var(--bleu-vif);

  /* --- Bordures --- */
  --border-default:           var(--gris-doux);
  --border-strong:            var(--gris-charbon);
  --border-subtle:            var(--rose-doux);
  --border-accent:            var(--rouge-vif);
  --border-width:             var(--border-thin);

  /* --- Typographie --- */
  --font-heading:             var(--font-slab);
  --font-body:                var(--font-humanist);
  --font-ui:                  var(--font-geo-humanist);
  --font-code:                var(--font-mono-code);

  --size-body:                var(--text-base);
  --size-body-sm:             var(--text-sm);
  --size-body-lg:             var(--text-md);
  --size-h1:                  var(--text-5xl);
  --size-h2:                  var(--text-3xl);
  --size-h3:                  var(--text-2xl);
  --size-h4:                  var(--text-xl);
  --size-h5:                  var(--text-lg);
  --size-h6:                  var(--text-md);
  --size-small:               var(--text-sm);
  --size-caption:             var(--text-sm);

  --weight-heading:           var(--weight-bold);
  --weight-body:              var(--weight-regular);
  --weight-strong:            var(--weight-semibold);
  --weight-ui:                var(--weight-semibold);

  --leading-body:             var(--leading-loose);
  --leading-heading:          var(--leading-snug);

  --tracking-heading:         var(--tracking-normal);
  --tracking-body:            var(--tracking-none);

  /* --- Espacement --- */
  --gap-inline:               var(--space-2);
  --gap-block:                var(--space-4);
  --gap-section:              var(--space-16);
  --gap-group:                var(--space-8);

  --padding-inline:           var(--space-4);
  --padding-block:            var(--space-4);
  --padding-card:             var(--space-6);
  --padding-section:          var(--space-12);
  --padding-page:             var(--space-6);

  /* --- Composants --- */
  --card-radius:              var(--radius-lg);
  --card-shadow:              var(--shadow-sm);
  --card-shadow-hover:        var(--shadow-lg);
  --card-bg:                  var(--surface-elevated);
  --card-border:              var(--border-subtle);

  --button-radius:            var(--radius-lg);
  --button-padding-x:         var(--space-6);
  --button-padding-y:         var(--space-3);

  --input-radius:             var(--radius-md);
  --input-border:             var(--border-default);
  --input-bg:                 var(--surface-primary);
  --input-focus-border:       var(--accent);

  --badge-radius:             var(--radius-full);
  --badge-padding-x:          var(--space-3);
  --badge-padding-y:          var(--space-1);

  --nav-height:               var(--space-16);
  --nav-bg:                   var(--surface-primary);
  --nav-shadow:               var(--shadow-xs);

  --footer-bg:                var(--surface-inverse);
  --footer-text:              var(--text-inverse);

  /* --- Layout --- */
  --content-width:            var(--width-5xl);
  --content-narrow:           var(--width-3xl);
  --content-wide:             var(--width-7xl);

  /* --- Transitions --- */
  --transition-color:         color var(--duration-normal) var(--ease-default),
                              background-color var(--duration-normal) var(--ease-default);
  --transition-shadow:        box-shadow var(--duration-normal) var(--ease-default);
  --transition-transform:     transform var(--duration-normal) var(--ease-bounce);
  --transition-all:           all var(--duration-normal) var(--ease-default);
}