/*
 * brand-identity.css — TVVA
 *
 * No Figma variables in the file (2026-11-03): tokens are hand-authored
 * from "TVVA - Style Sheet - 2" and the fills measured across the ten
 * frames (build notes → Tokens). Loads after the parent stylesheet.
 */

/* ==== GENERATED, converter output replaces everything in this section ==== */
/* (none: no DTCG export) */

/* ==== OVERRIDES, hand written ==== */

:root {
	/* Primitives */
	--white: #FFFFFF;

	--neutral-100: #F3EBD9; /* sand band */
	--neutral-200: #CCC7BF; /* lines, input borders */
	--neutral-300: #4B524E; /* body copy */
	--neutral-400: #1C2B26; /* deep green: footer, hearing strip, ink */

	--primary-100: #E7EAE4; /* body copy on green */
	--primary-200: #8BA888; /* sage */
	--primary-300: #1F4A3D; /* TVVA green */
	--primary-400: #1C2B26;

	--secondary-100: #EADBBE; /* sand (anniversary strip, mission card ground) */
	--secondary-200: #E3DBD8; /* hairlines on cream */
	--secondary-300: #3A6688; /* blue: date badges, "see all" links */
	--secondary-400: #2B4E69;

	--accent-100: #F6E9C9;
	--accent-200: #E3B04B; /* gold */
	--accent-300: #E3B04B;
	--accent-400: #9A6B12; /* dark gold: eyebrows, icons on light */

	--tv-cream: #FFFDF1;

	/* Semantics, light */
	--surface-page: var(--tv-cream);
	--surface-card: var(--tv-cream);
	--surface-subtle: var(--neutral-100);
	--surface-overlay: var(--neutral-100);

	--text-primary: var(--neutral-400);
	--text-secondary: var(--neutral-300);
	--text-on-brand: var(--tv-cream);
	--text-accent: var(--accent-400);

	--brand-tint: var(--primary-100);
	--brand-subtle: var(--primary-200);
	--brand-default: var(--primary-300);
	--brand-strong: var(--primary-400);

	/* Gold buttons with deep green ink (Style Sheet 2 "Take Action"). */
	--lp-accent-fill: var(--accent-300);
	--lp-accent-ink: var(--neutral-400);
	--cta-hover: #D9A23A;

	--accent-default: var(--accent-400);
	--accent-strong: var(--accent-400);
	--accent-link: var(--primary-300);

	--border-default: var(--secondary-200);
	--border-strong: var(--neutral-200);
	--border-brand: var(--primary-300);
	--border-focus: var(--accent-400);

	--color-heading: var(--primary-300);

	/* Type */
	--font-family-heading: "Merriweather", Georgia, serif;
	--font-family-body: "Public Sans", "Helvetica Neue", Arial, sans-serif;
	--font-family-button: "Public Sans", "Helvetica Neue", Arial, sans-serif;

	--font-size-h1: clamp(36px, 4.4vw, 56px);
	--font-size-h2: clamp(30px, 3.4vw, 42px);
	--font-size-h3: clamp(24px, 2.4vw, 28px);
	--font-size-h4: clamp(20px, 2vw, 24px);
	--font-size-h5: 22px;
	--font-size-h6: 20px;
	--font-size-hero: var(--font-size-h1);
	--font-size-section-header: var(--font-size-h2);
	--font-weight-section-header: 400;
	--font-size-section-sub-header: var(--font-size-h4);
	--font-size-body: 18px;
	--font-size-small: 16px;
	--line-height-heading: 1.3;
	--line-height-body: 1.56; /* 18/28 */

	/* Cards: cream, hairline, 8px corners, no shadow (the frames' cards) */
	--card-radius: 8px;
	--card-shadow: none;
	--card-border: 1px solid var(--secondary-200);
	--card-hover-transform: none;
	--card-hover-shadow: none;

	/* Buttons: 60 tall, 6px corners, Public Sans 500 16 */
	--btn-radius: 6px;
	--btn-padding-y: 20px;
	--btn-padding-x: 28px;

	/* Layout: a 1290 column (x=315 to 1605 on the 1920 frames) */
	--content-max-width: 1290px;
	--content-width-normal: 1290px;
	--content-width-wide: 1290px;
	--side-margin: 24px;
	--bleed-media-max-width: 960px;

	/* Section rhythm (frames: 96 top and bottom on most bands) */
	--tv-space-section: clamp(56px, 5vw, 96px);
	--tv-space-stack: 48px; /* intro → items */
	--tv-space-heading: 16px; /* eyebrow → heading */
	--margin-vertical-normal: var(--tv-space-section);
	--margin-vertical-wide: var(--tv-space-section);
	--margin-vertical-wider: var(--tv-space-section);

	--header-height: 141px;

	--tint-color: #1C2B26;
}

.is-dark {
	--surface-page: var(--primary-300);
	--surface-card: var(--primary-400);
	--surface-subtle: var(--primary-400);
	--text-primary: var(--tv-cream);
	--text-secondary: var(--primary-100);
	--text-accent: var(--accent-300);
	--accent-default: var(--accent-300);
	--accent-link: var(--accent-300);
	--border-default: rgb(255 253 241 / 0.15);
	--border-strong: rgb(255 253 241 / 0.35);
	--color-heading: var(--tv-cream);
}