/* ==========================================================================
   Variables — charte graphique HomeSweetBlog (septembre 2026)
   Valeurs alignées sur la maquette HomeSweetBlog.dc.html (source de vérité).
   Toute valeur de la charte se modifie ici, et seulement ici.
   ========================================================================== */

:root {
	/* Identité */
	--hsb-turquoise:       #17B3A3; /* hero, libellés de rubrique, survol de carte, focus */
	--hsb-turquoise-dark:  #0E7A6F; /* liens, chiffres clés, texte sur fond menthe */
	--hsb-green-deep:      #0B3B36; /* texte principal, newsletter, filtre actif, bouton secondaire */
	--hsb-yellow:          #FFC93C; /* boutons d'action, badge hero, pied de page, avatars */
	--hsb-yellow-hover:    #FFD866;

	/* Texte */
	--hsb-text:            var(--hsb-green-deep);
	--hsb-text-muted:      #5C7A76; /* chapôs, métadonnées, légendes */
	--hsb-text-on-yellow:  #3A2E10;
	--hsb-text-on-dark:    #F2FBFA; /* texte des boutons et blocs vert profond */
	--hsb-text-on-dark-muted: #CDEAE6;

	/* Fonds et surfaces */
	--hsb-bg-page:         #F2FBFA;
	--hsb-bg-section:      #EAF7F4;
	--hsb-bg-card:         #FFFFFF;
	--hsb-bg-mint:         #E1F5EE; /* citation, filtre inactif, fond de repli des images */
	--hsb-border:          #CDEAE6;
	--hsb-border-soft:     #E4F4F1; /* séparateurs internes : lignes de liste, tableaux */

	/* Affiliation */
	--hsb-affiliate-bg:     #FFF6DE;
	--hsb-affiliate-border: #F3DFA4;
	--hsb-affiliate-text:   #8A6A0F;

	/* Accents de rubrique */
	--hsb-accent-peach:     #FFE1CF;
	--hsb-accent-coral:     #FF8C69;
	--hsb-rubric-voyage:    var(--hsb-turquoise);
	--hsb-rubric-lectures:  var(--hsb-affiliate-bg);
	--hsb-rubric-restos:    var(--hsb-accent-peach);

	/* Typographie */
	--hsb-font-script: "Dancing Script", cursive;          /* titres uniquement */
	--hsb-font-sans:   "Quicksand", system-ui, sans-serif; /* texte et interface */

	--hsb-lh-ui:       1.6;
	--hsb-lh-article:  1.78;
	--hsb-ls-label:    0.1em;

	--hsb-fs-article:  16.5px;
	--hsb-fs-meta:     12px;

	/* Rayons */
	--hsb-radius-xs:    9px;   /* vignettes produit, carré de marque */
	--hsb-radius-md:    12px;  /* cartes, lignes de liste, tableaux */
	--hsb-radius-lg:    16px;  /* image d'article, encart affilié, newsletter */
	--hsb-radius-pill:  24px;  /* boutons, filtres, tags, badges */
	--hsb-radius-round: 50%;   /* avatars, badges circulaires */

	/* Mise en page */
	--hsb-content-width:  1140px;
	--hsb-gutter:         24px;
	--hsb-reading-width:  68ch;
	--hsb-gap-cards:      20px;
	--hsb-gap-featured:   32px;
	--hsb-card-padding:   16px 18px;
	--hsb-sticky-offset:  88px;

	/* Hero */
	--hsb-hero-height:      440px;
	--hsb-hero-wave-rise:   96px;

	--hsb-transition: 0.15s ease;
}