/* Married Today — Color tokens
   Brand re-key from the official logo: burgundy (#4F1F1F) + crimson (#D6204E)
   on a warm ivory foundation. Crimson is the primary accent/CTA; burgundy is the
   deep brand color for dark surfaces (footer, CTA bands, certificate fields).
   Note: token NAMES are kept stable (--accent-* = crimson/rose, --brand-* = burgundy/wine)
   so existing kits reskin instantly; rename pass to follow once direction is approved. */

:root {
  /* ---- Warm neutrals (paper → sand) — warm ivory to flatter crimson/burgundy ---- */
  --paper:      #FFFDFB; /* cards, raised surfaces */
  --bg:         #FAF6F1; /* default page background */
  --paper-2:   #F1E9E0;
  --paper-3:   #E7DBD0; /* warm card / soft fill */
  --paper-4:   #D7C7BA;
  --line:       #EADFD5; /* hairline borders */
  --line-strong:#D5C5B8;

  /* ---- Ink (warm charcoal, faint wine undertone) ---- */
  --ink-900:    #221619; /* headlines, strong text */
  --ink-700:    #443439; /* body text */
  --ink-500:    #6E5E63; /* muted / secondary */
  --ink-400:    #998A90; /* placeholder, captions */

  /* ---- Crimson (primary accent) — from logo #D6204E ----
     Strong values only: deep red marks (buttons, links, icons). Tints are
     deliberately warm NEUTRAL cream, never pink — no pale-pink fills anywhere. */
  --accent-700:   #8E1233; /* pressed — deep oxblood-red */
  --accent-600:   #B0193E; /* hover */
  --accent-500:   #CE1E47; /* base accent — crimson, nudged deeper than logo to read red not pink */
  --accent-200:   #E2D2CA; /* warm taupe tint border (no pink) */
  --accent-100:   #F2E7E0; /* warm cream tint fill (no pink) */
  --accent-50:    #FAF4EF; /* faint warm-cream wash (no pink) */

  /* ---- Burgundy / wine (deep brand, dark surfaces) — from logo #4F1F1F ---- */
  --brand-900:  #3A1517; /* dark footer, CTA band, certificate field */
  --brand-700:  #4F1F1F; /* logo burgundy */
  --brand-500:  #6E2E30;
  --brand-100:  #E8D6D5;
  --brand-50:   #F5EAE9;

  /* ---- Semantic (muted, warm-tuned) ---- */
  --success:    #2E7D5B; /* kept green: reads as verified / legally valid */
  --success-bg: #E6F1EA;
  --warning:    #B5831F;
  --warning-bg: #F5EAD2;
  --error:      #B23A2F; /* brick — distinct from crimson brand accent */
  --error-bg:   #F6E3DF;
  --info:       #3E6680;
  --info-bg:    #E2EAF0;

  /* ---- Semantic aliases ---- */
  --text-strong:    var(--ink-900);
  --text-body:      var(--ink-700);
  --text-muted:     var(--ink-500);
  --text-faint:     var(--ink-400);
  --text-on-accent: #FFFDFB;
  --text-on-dark:   #F4E9E8;

  --surface-page:   var(--bg);
  --surface-card:   var(--paper);
  --surface-soft:   var(--paper-2);
  --surface-fill:   var(--paper-3);
  --surface-dark:   var(--brand-900);

  --border-subtle:  var(--line);
  --border-strong:  var(--line-strong);

  --accent:         var(--accent-500);
  --accent-hover:   var(--accent-600);
  --accent-press:   var(--accent-700);
  --accent-tint:    var(--accent-100);
  --accent-wash:    var(--accent-50);

  --focus-ring:     var(--accent-500);
  --selection-bg:   var(--accent-100);
}
/* Married Today — Typography tokens
   Display/headlines: Newsreader (editorial serif, warm, optical sizing).
   UI/body: Hanken Grotesk (humanist sans, friendly + legible).
   Labels/specimens: JetBrains Mono. */

:root {
  /* ---- Type roles (role slot → typeface). Swap the family here to restyle a role
     everywhere; e.g. --font-display could become a script without renaming. ---- */
  --font-display: "Newsreader", Georgia, "Times New Roman", serif;
  --font-body:  "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-label:  "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* ---- Weights ---- */
  --w-regular:  400;
  --w-medium:   500;
  --w-semibold: 600;
  --w-bold:     700;

  /* ---- Type scale (px) ---- */
  --fs-display:   64px;  /* hero serif */
  --fs-h1:        46px;
  --fs-h2:        34px;
  --fs-h3:        25px;
  --fs-h4:        20px;
  --fs-body-lg:   18px;
  --fs-body:      16px;
  --fs-body-sm:   14px;
  --fs-caption:   13px;
  --fs-micro:     12px;  /* mono labels / overline */

  /* ---- Line heights ---- */
  --lh-tight:   1.05;  /* display serif */
  --lh-snug:    1.18;  /* headings */
  --lh-normal:  1.5;   /* body */
  --lh-relaxed: 1.65;  /* long-form */

  /* ---- Letter spacing ---- */
  --ls-tight:   -0.02em; /* large serif */
  --ls-normal:  0;
  --ls-wide:    0.04em;
  --ls-overline:0.14em;  /* mono overlines, uppercase */

  /* ---- Semantic text styles (compose family+size+lh) ---- */
  --text-display: var(--w-medium) var(--fs-display)/var(--lh-tight) var(--font-display);
  --text-h1:      var(--w-medium) var(--fs-h1)/var(--lh-snug) var(--font-display);
  --text-h2:      var(--w-medium) var(--fs-h2)/var(--lh-snug) var(--font-display);
  --text-h3:      var(--w-semibold) var(--fs-h3)/var(--lh-snug) var(--font-body);
  --text-h4:      var(--w-semibold) var(--fs-h4)/var(--lh-snug) var(--font-body);
  --text-body:    var(--w-regular) var(--fs-body)/var(--lh-normal) var(--font-body);
  --text-overline:var(--w-medium) var(--fs-micro)/1 var(--font-label);
}
/* Married Today — Spacing & layout tokens (4px base grid) */

:root {
  --sp-0:   0;
  --sp-1:   4px;
  --sp-2:   8px;
  --sp-3:   12px;
  --sp-4:   16px;
  --sp-5:   20px;
  --sp-6:   24px;
  --sp-8:   32px;
  --sp-10:  40px;
  --sp-12:  48px;
  --sp-16:  64px;
  --sp-20:  80px;
  --sp-24:  96px;
  --sp-32:  128px;

  /* Layout */
  --container:     1180px;  /* marketing max width */
  --container-narrow: 720px; /* long-form / forms */
  --gutter:        24px;
  --section-y:     96px;     /* vertical rhythm between sections */
}
/* Married Today — Radius tokens
   Editorial-soft: generous but never pill-y on structural elements. */

:root {
  --r-xs:   4px;
  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   16px;  /* default card */
  --r-xl:   24px;  /* feature panels, image frames */
  --r-2xl:  32px;
  --r-pill: 999px; /* tags, avatars, segmented controls */
}
/* Married Today — Elevation tokens
   Soft, warm-tinted shadows. Low spread, generous blur. Avoid hard black. */

:root {
  --shadow-xs: 0 1px 2px rgba(33, 31, 28, 0.05);
  --shadow-sm: 0 2px 6px -1px rgba(33, 31, 28, 0.07);
  --shadow-md: 0 8px 24px -8px rgba(33, 31, 28, 0.12);
  --shadow-lg: 0 18px 48px -14px rgba(33, 31, 28, 0.16);
  --shadow-xl: 0 32px 70px -20px rgba(33, 31, 28, 0.22);

  /* Hairline ring used in place of borders on raised cards */
  --ring-subtle: inset 0 0 0 1px var(--line);

  /* Focus halo (clay) */
  --shadow-focus: 0 0 0 3px rgba(176, 101, 79, 0.25);
}
/* Married Today — Motion tokens
   Calm and reassuring. Gentle ease-out, soft fades + small rises.
   No bounce, no spring overshoot. */

:root {
  --dur-fast:   120ms;
  --dur-base:   200ms;
  --dur-slow:   320ms;
  --dur-slower: 480ms;

  /* Decelerating ease — confident entrances */
  --ease-out:  cubic-bezier(0.22, 1, 0.36, 1);
  /* Standard in/out for hovers + state changes */
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);

  --transition-colors: color var(--dur-fast) var(--ease-soft),
                       background-color var(--dur-fast) var(--ease-soft),
                       border-color var(--dur-fast) var(--ease-soft),
                       box-shadow var(--dur-fast) var(--ease-soft);
}

/* -------------------------------------------------------------------------
 * Twenty Twenty-Five preset restore.
 *
 * Our custom palette REPLACES the parent theme's palette, which drops TT5's own
 * colour slots (--wp--preset--color--base / contrast / accent-1..6). Any inherited
 * TT5 core-block style that references those slots would otherwise resolve to
 * nothing and fall back to unstyled browser defaults (e.g. lost hover/focus).
 * Re-define the slots here — mapped to OUR brand tokens, not TT5's yellow/pink/
 * purple — so core blocks keep coherent, on-brand styling. Defined in CSS (not the
 * palette) on purpose: restores the variables without adding off-brand swatches to
 * the block editor's colour picker, and reskins with each variant automatically.
 * ------------------------------------------------------------------------- */
:root {
  --wp--preset--color--base:     var(--paper);
  --wp--preset--color--contrast: var(--ink-900);
  --wp--preset--color--accent-1: var(--accent-500);
  --wp--preset--color--accent-2: var(--paper-2);
  --wp--preset--color--accent-3: var(--brand-700);
  --wp--preset--color--accent-4: var(--ink-500);
  --wp--preset--color--accent-5: var(--bg);
  --wp--preset--color--accent-6: color-mix(in srgb, currentColor 20%, transparent);
}
