/* Maalish design tokens. Generated by brand/src/tokens.py; edit there, not here. */
:root {
  --mc-ghee: #F6EFE2; /* Crème ghee / Ghee cream: Main light background */
  --mc-linen: #FBF8F2; /* Lin / Linen: Cards and raised surfaces on ghee */
  --mc-parchment: #EDE2CC; /* Parchemin / Parchment: Alternate section background, borders on dark */
  --mc-clove: #7A3B12; /* Clou de girofle / Clove: Primary brand colour: logo, headings, buttons */
  --mc-clove-deep: #5C2B0B; /* Girofle profond / Deep clove: Button hover and pressed states */
  --mc-kohl: #2B1A0E; /* Khôl / Kohl: Body text on light; dark backgrounds */
  --mc-night: #1D120A; /* Nuit d'hiver / Winter night: Deepest dark background (dark mode page) */
  --mc-walnut: #6B5440; /* Noyer / Walnut: Secondary text, captions on light */
  --mc-mustard: #C08A3E; /* Or moutarde / Mustard gold: Accent: rules, the drop in the mark, icons. Not for text on light */
  --mc-mustard-light: #E3B062; /* Fleur de moutarde / Mustard flower: Accent and links on dark backgrounds */
  --mc-amber: #A4521A; /* Ambre / Amber glass: Illustration only: the bottle */
  --mc-sage: #6E7A58; /* Ajowan / Ajwain sage: Rare secondary accent: success states, leaf details */

  /* Semantic roles, light theme */
  --mc-bg: var(--mc-ghee);
  --mc-surface: var(--mc-linen);
  --mc-surface-alt: var(--mc-parchment);
  --mc-text: var(--mc-kohl);
  --mc-text-muted: var(--mc-walnut);
  --mc-heading: var(--mc-clove);
  --mc-link: var(--mc-clove);
  --mc-accent: var(--mc-mustard);
  --mc-rule: color-mix(in srgb, var(--mc-mustard) 55%, transparent);
  --mc-button-bg: var(--mc-clove);
  --mc-button-bg-hover: var(--mc-clove-deep);
  --mc-button-text: var(--mc-ghee);
  --mc-focus: var(--mc-mustard);

  --mc-font-display: 'Cormorant Garamond', 'Cormorant', Garamond, 'Times New Roman', serif;
  --mc-font-sans: 'Jost', 'Futura', 'Avenir Next', 'Segoe UI', system-ui, sans-serif;

  --mc-size-display: clamp(2.75rem, 1.967rem + 3.478vw, 4.75rem);
  --mc-size-h1: clamp(2.25rem, 1.761rem + 2.174vw, 3.5rem);
  --mc-size-h2: clamp(1.75rem, 1.457rem + 1.304vw, 2.5rem);
  --mc-size-h3: clamp(1.375rem, 1.228rem + 0.6522vw, 1.75rem);
  --mc-size-lead: clamp(1.188rem, 1.114rem + 0.3261vw, 1.375rem);
  --mc-size-body: clamp(1rem, 0.9511rem + 0.2174vw, 1.125rem);
  --mc-size-small: clamp(0.875rem, 0.8505rem + 0.1087vw, 0.9375rem);
  --mc-size-eyebrow: clamp(0.75rem, 0.7255rem + 0.1087vw, 0.8125rem);
  --mc-size-button: clamp(0.9375rem, 0.913rem + 0.1087vw, 1rem);

  --mc-space-1: 0.25rem;
  --mc-space-2: 0.5rem;
  --mc-space-3: 0.75rem;
  --mc-space-4: 1rem;
  --mc-space-5: 1.5rem;
  --mc-space-6: 2rem;
  --mc-space-7: 3rem;
  --mc-space-8: 4rem;
  --mc-space-9: 6rem;
  --mc-space-10: 8rem;
  --mc-radius-sm: 4px;
  --mc-radius-md: 10px;
  --mc-radius-lg: 18px;
  --mc-radius-pill: 999px;
  --mc-shadow: 0 1px 2px rgb(43 26 14 / 6%), 0 8px 24px rgb(43 26 14 / 8%);
  --mc-measure: 66ch;
}

/* Dark theme: opt in with [data-theme=dark] or follow the OS. */
:root[data-theme='dark'] {
  --mc-bg: var(--mc-night); --mc-surface: var(--mc-kohl); --mc-surface-alt: #352213;
  --mc-text: var(--mc-parchment); --mc-text-muted: #C9B79C; --mc-heading: var(--mc-ghee);
  --mc-link: var(--mc-mustard-light); --mc-accent: var(--mc-mustard-light);
  --mc-button-bg: var(--mc-mustard-light); --mc-button-bg-hover: #EEC27C; --mc-button-text: var(--mc-night);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --mc-bg: var(--mc-night); --mc-surface: var(--mc-kohl); --mc-surface-alt: #352213;
    --mc-text: var(--mc-parchment); --mc-text-muted: #C9B79C; --mc-heading: var(--mc-ghee);
    --mc-link: var(--mc-mustard-light); --mc-accent: var(--mc-mustard-light);
    --mc-button-bg: var(--mc-mustard-light); --mc-button-bg-hover: #EEC27C; --mc-button-text: var(--mc-night);
  }
}

/* Type roles */
.mc-display { font-family: var(--mc-font-display); font-size: var(--mc-size-display); font-weight: 500; line-height: 1.05; letter-spacing: -0.005em; }
.mc-h1 { font-family: var(--mc-font-display); font-size: var(--mc-size-h1); font-weight: 500; line-height: 1.1; letter-spacing: 0; }
.mc-h2 { font-family: var(--mc-font-display); font-size: var(--mc-size-h2); font-weight: 500; line-height: 1.15; letter-spacing: 0; }
.mc-h3 { font-family: var(--mc-font-display); font-size: var(--mc-size-h3); font-weight: 600; line-height: 1.25; letter-spacing: 0; }
.mc-lead { font-family: var(--mc-font-display); font-size: var(--mc-size-lead); font-weight: 500; line-height: 1.45; letter-spacing: 0; }
.mc-body { font-family: var(--mc-font-sans); font-size: var(--mc-size-body); font-weight: 400; line-height: 1.65; letter-spacing: 0; }
.mc-small { font-family: var(--mc-font-sans); font-size: var(--mc-size-small); font-weight: 400; line-height: 1.55; letter-spacing: 0; }
.mc-eyebrow { font-family: var(--mc-font-sans); font-size: var(--mc-size-eyebrow); font-weight: 500; line-height: 1.3; letter-spacing: 0.22em; text-transform: uppercase; }
.mc-button { font-family: var(--mc-font-sans); font-size: var(--mc-size-button); font-weight: 500; line-height: 1; letter-spacing: 0.06em; }
.mc-en { font-style: italic; } /* English line under a French line, as on the label */