/* ============================================================================
 * TrendLife Shop — Design Tokens
 * ----------------------------------------------------------------------------
 * Single source of truth for shop colours, type stack, radii and layout vars.
 * Loaded before kaleida.css on every shop / product page. Retheme here.
 * Aligned with the Kaleida reference mockups + BRAND_BRIEF.md (Geist primary).
 * ==========================================================================*/
:root {
  /* Brand / accent */
  --red:#D71920; --coral:#FF3C42; --espresso:#2A1D15; --dark-teal:#0F6272;
  /* AI / Kaleida gradients — per marketing-harness brand guideline
     (brand_tokens.json "ai_headline_treatment"): AI/Kaleida treatments use a
     gradient, not a flat colour. Warm = logo-red -> lilac, Cool = teal -> light-teal. */
  --grad-ai-warm:linear-gradient(90deg,#D71920 0%,#9B8FFF 100%);
  --grad-ai-cool:linear-gradient(90deg,#0F6272 0%,#A2D4DF 100%);
  --lilac:#9B8FFF; --light-teal:#A2D4DF;
  /* Surfaces & borders */
  --cream:#F6EFE8; --bkg-warm:#FBF5ED; --border-sub:#EEE7E1; --border-str:#E1D2C4;
  /* Neutrals */
  --gray-90:#222222; --gray-60:#555555; --gray-50:#8E8E8E; --gray-26:#DCDCDC; --white:#FFFFFF;
  /* Type */
  --font:"Geist",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  /* Layout — content container width matches the nav (--nav-max-w) so the hero,
     sections and footer align edge-to-edge with the navigation. */
  --max-w:1280px; --r-xl:24px; --r-md:12px;
  /* Navigation — matched to corporate trendlife.com/en-us
     (Tailwind: max-w-7xl · px-6 / lg:px-12 · py-5 · 175x32 logo)
     Height is NOT fixed on corporate: it = inner content + vertical padding.
     Measured total = 86px (content ~46px + py-5 20px top/bottom). */
  --nav-max-w:1280px;        /* max-w-7xl */
  --nav-min-h:86px;          /* measured corporate height (content + py-5) */
  --nav-pad-y:20px;          /* py-5 */
  --nav-pad-x:48px;          /* lg:px-12 */
  --nav-pad-x-mobile:24px;   /* px-6 */
  --nav-logo-h:32px;         /* 175x32 logo */
}