/* ============================================================
   League of Cooking — Limoncella-style design tokens.
   Every value below was MEASURED from https://demos.restored316.com/limoncella/
   via computed styles (2026-07-19), not estimated. See
   ../../reference-screenshots and HANDOFF.md for the audit record.
   ============================================================ */
:root {
	/* Colors — SAGE / CLAY / CREAM.
	   CORRECTION 2026-07-22: this is now the AUTHENTIC Limoncella "palette-three"
	   colour scheme, copied exactly from the real theme's own source (the
	   `body.palette-three` rule in the demo homepage's inline CSS — Limoncella
	   ships several official schemes and the demo's *default* happens to be the
	   coral+yellow-on-blue one). The earlier note here claiming sage/cream was
	   "not authentic" was wrong: it IS one of the theme's shipped schemes, so
	   we now match it value-for-value instead of mixing it with the default
	   scheme's coral accent and yellow announcement bar.
	     palette1 #8E4A6B  palette2 #F7E4E8  palette3 #333333  palette4 #555555
	     palette5 #7FA88F  palette6 #BFD8C8  palette7 #EAF3ED  palette8 #FAF8F4 */
	/* BRIGHT PASS 2026-08-31 (owner: "le branding est un peu dark, je le veux
	   plus lumineux, shiny white, more white"). The scheme's HUES are unchanged
	   — clay stays the accent, sage stays the secondary — but every large
	   SURFACE moves up in value: the warm cream body goes pure white, and the
	   tinted bands that used to sit on cream now use --lim-surface-alt so the
	   banding still reads against a white page instead of disappearing. */
	--lim-bg:            #FBF7F0; /* body background — pure white (was cream #FAF8F4) */
	--lim-ink:           #4A3B32; /* palette4 — body text */
	--lim-ink-dark:      #352820; /* palette3 — nav links, headings */
	--lim-surface:       #FFFDF9; /* palette9 — header bg, footer bg, card bg */
	/* PRO-WHITE PASS 2026-08-31 (owner: "essaye d'avoir un style pro white").
	   Second step after the bright pass: the surfaces were light but still
	   SAGE-TINTED, which reads as a soft/blog green cast rather than an
	   editorial white. Every neutral surface, hairline and shadow is now a
	   true neutral — the colour is carried ONLY by the clay accent and by the
	   photography, which is what makes a white layout read as professional.
	   Banded/inset sections (newsletter, about card, archive hero, sidebar). */
	--lim-surface-alt:   #F4ECE1; /* neutral near-white band (was sage-tinted #F4F9F6) */
	--lim-ink-muted:     #6F5F54; /* neutral muted type — legal links, pill labels (~5.7:1 on #FAFAFA) */
	--lim-accent:        #8E4A6B; /* palette1 — clay/terracotta, primary buttons + links */
	--lim-accent-hover:  #733A56; /* darkened clay for hover */
	--lim-blush:         #F7E4E8; /* palette2 — highlight-alt (text-link underline swipe) */
	--lim-periwinkle:    #BFD8C8; /* palette6 — mint, secondary button bg */
	--lim-steel-blue:    #7FA88F; /* palette5 — sage: category badge bg + input borders */
	/* Announcement bar. History: default scheme = bright yellow; 2026-07-22 =
	   solid sage #7FA88F + white text. BRIGHT PASS 2026-08-31 inverts it — the
	   solid sage band was the single darkest thing above the fold and set the
	   whole page's "dark" impression. Now a pale sage wash with deep-sage type:
	   same brand band, ~10x lighter, and text contrast goes UP (white-on-sage
	   measured only ~2.9:1, deep-sage-on-wash is ~6:1).
	   PRO-WHITE PASS 2026-08-31: the pale sage wash goes white too. The bar is
	   now separated from the header by a hairline and by its own type size,
	   not by a fill — the standard editorial treatment for a utility strip. */
	--lim-announcement-bg: #FFFDF9; /* white utility strip */
	--lim-announcement-ink: #4A3B32; /* neutral grey type (~9:1 on white) */
	--lim-border:        #E9DED2; /* neutral hairline (was sage #E2EFE6) */
	--lim-shadow:        rgba(0, 0, 0, 0.05); /* neutral, very soft */

	/* Fonts — measured: Figtree (body), Work Sans (headings/labels) */
	--lim-font-body:    'DM Sans', system-ui, sans-serif;
	--lim-font-heading: 'Playfair Display', Georgia, serif;
	--lim-font-script:  'Dancing Script', cursive;
	--lim-sage:         #87917B;

	/* Type scale — measured */
	--lim-body-size: 18px;
	--lim-body-line-height: 1.8; /* 32.4px / 18px measured ratio */
	--lim-nav-primary-size: 18px;
	--lim-nav-primary-weight: 600;
	--lim-nav-secondary-size: 15px;
	--lim-nav-secondary-weight: 400;
	--lim-badge-size: 14.4px;
	--lim-badge-weight: 600;
	--lim-badge-letter-spacing: 1px;

	/* Spacing scale (Kadence-compatible progression) */
	--lim-space-1: 4px;  --lim-space-2: 8px;  --lim-space-3: 12px;
	--lim-space-4: 16px; --lim-space-6: 24px; --lim-space-8: 32px;
	--lim-space-12: 48px; --lim-space-16: 64px; --lim-space-20: 80px;

	/* Radii — measured: buttons 5px, category badge top-only 5px, social icon 3px,
	   circular category icons 200px (fully round) */
	--lim-radius-small: 3px;
	--lim-radius-button: 5px;
	--lim-radius-circle: 200px;

	--lim-container-wide: 1290px; /* Kadence default content width, verify exact value once measured directly */
}

/* Map onto Kadence's global palette so native Kadence components re-theme too.
   These are now the EXACT values from Limoncella's own `body.palette-three`
   rule, so native Kadence archive/single/comment/pagination markup renders in
   the same scheme as the .lim-* sections with no hue drift. */
:root {
	--global-palette1: #8E4A6B; /* accent (clay) */
	--global-palette2: #F7E4E8; /* highlight-alt (blush) */
	--global-palette3: #352820; /* headings / dark text */
	--global-palette4: #4A3B32; /* body text */
	--global-palette5: #7FA88F; /* sage — borders, input borders */
	--global-palette6: #BFD8C8; /* mint */
	--global-palette7: #F4ECE1; /* neutral band bg (pro-white pass; was pale green) */
	--global-palette8: #FBF7F0; /* body bg — white (was cream #FAF8F4, bright pass) */
	--global-palette9: #FFFDF9; /* white */

	--global-palette-highlight: var(--global-palette1);
	--global-palette-highlight-alt: var(--global-palette2);

	--global-heading-font-family: var(--lim-font-heading);
	--global-body-font-family: var(--lim-font-body);
}

body {
	font-family: var(--lim-font-body);
	font-size: var(--lim-body-size);
	line-height: var(--lim-body-line-height);
	color: var(--lim-ink);
	background: var(--lim-bg);
}
h1, h2, h3, h4, h5, h6 {
	font-family: var(--lim-font-heading);
	color: var(--lim-ink-dark);
}
a { color: var(--lim-ink-dark); }
a:hover { color: var(--lim-accent); }