/* THE RUNTIME AUTHORITY for this theme's design tokens: theme.json only mirrors what is declared here, no var() in this theme carries a fallback (a fallback is a second copy a rebrand cannot see), and every value below is a PLACEHOLDER whose NAME is the contract. */
/* @token-contract 1 — every name in the @contract-tokens region below is a role a block reads, and the token gate refuses the theme while one is unfilled. */
:root {
  /* brand / brand-dark / brand-light are the three the client can pick in the editor; theme.json projects them under exactly those slugs. */
  --brand:             #97444F;
  --brand-rgb:         151, 68, 79;
  --brand-dark:        #873B48;
  --brand-dark-rgb:    135, 59, 72;
  --brand-light:       #A34D56;
  --brand-light-rgb:   163, 77, 86;

  /* Brand the site paints with but the client never picks: kept out of the palette, because a picker that can overwrite a seeded axis is a defect. --brand-accent is the rose every heading, eyebrow and nav link is set in; --brand-support the gold of the drawn rules. */
  --brand-accent:      #873B56;
  --brand-accent-rgb:  135, 59, 86;
  --brand-support:     #D9B98B;
  --brand-support-rgb: 217, 185, 139;

  --ink:               #493C40;
  --ink-rgb:           73, 60, 64;
  --neutral-dark:      #66565C;
  --neutral-dark-rgb:  102, 86, 92;
  --neutral-light:     #E8CCD0;
  --neutral-light-rgb: 232, 204, 208;
  --surface:           #FCEDF0;
  --surface-rgb:       252, 237, 240;
  --border:            #E8CCD0;
  --bg:                #FFF7F8;
  --bg-rgb:            255, 247, 248;
  --white:             #FFFDFB;
  --white-rgb:         255, 253, 251;
  --black:             #000000;
  --black-rgb:         0, 0, 0;
  /* The pale blush ground some sections sit on, a step lighter than --surface. */
  --paper:             #FFF7F8;
  --paper-rgb:         255, 247, 248;
  /* The home page's two warmer blush bands: the Signature Weekend and the portfolio preview. */
  --blush:             #F8E6EB;
  --blush-rgb:         248, 230, 235;
  --rose:              #FBE5EC;
  --rose-rgb:          251, 229, 236;
  /* The grey hint inside a form field. */
  --placeholder:       #757575;

  /* The source site's own names for the same colours: its section CSS reads them, so they stay as aliases of the semantic tokens rather than second values. */
  --primary:           var(--brand);
  --accent:            var(--brand-light);
  --topic-pink:        var(--brand-accent);
  --muted:             var(--neutral-dark);
  --line:              var(--border);
  --cream:             var(--surface);

  /* --sans and --heading are projected into theme.json for the client to pick from; --display and --serif are the theme's own. */
  /* @webfont: none */
  /* The only place that URL is written down: functions.php reads this line rather than holding a copy, exactly one such directive is allowed, and deleting the line ships no webfont at all. */
  --sans:    Arial, Helvetica, sans-serif;
  --heading: Georgia, 'Times New Roman', serif;
  --display: 'Palatino Linotype', 'Book Antiqua', Palatino, Georgia, serif;
  --serif:   'Palatino Linotype', 'Book Antiqua', Palatino, Georgia, serif;

  /* Declared here rather than left as var() fallbacks inside forms.css — a fallback is a colour a rebrand cannot find. */
  --form-border:                #cbd5e1;
  --form-bg:                    var(--white);
  --form-inline-bg:             var(--surface);
  --form-text:                  var(--ink);
  --form-focus:                 rgba(var(--brand-rgb), 0.2);
  --form-focus-border:          var(--brand);
  --form-error:                 #b91c1c;

  --eyebrow-color:              var(--brand-accent);

  --button-bg:                  var(--brand);
  --button-bg-hover:            var(--brand-dark);
  --button-text:                var(--white);
  --button-outline-color:       var(--ink);
  --button-outline-hover-bg:    var(--ink);
  --button-outline-hover-color: var(--white);
  --button-radius:              0;

  /* --container-content is the RUNTIME AUTHORITY for the page width. It must not live in base.css, which loads after this file and would shadow it; base.css delegates. --container-wide is the .container-lg measure theme.json's wideSize mirrors. */
  --container-content: 113.75rem;
  --container-wide:    120rem;

  /* The resting height of the fixed header, reserved as body padding by header.css. Three breakpoints, all required. These are the pre-JS fallbacks: header-compact.js measures the real bar and overrides --header-h after load. */
  --header-h: 431px;
}

/* @contract-tokens v1 — the type roles and space steps, written from the design (.site/tokens/scale.json): a text is set with its role's --type-* tokens, a section's padding and a block's gaps with the --space-* steps. Change the design, not these lines. */
:root {
  --type-display-font: var(--heading); --type-display-size: clamp(2.8125rem, 2.2526rem + 2.297vw, 4.32rem); --type-display-weight: 600; --type-display-lh: 1.08; --type-display-tracking: normal; --type-display-case: none;
  --type-numeral-font: var(--display); --type-numeral-size: clamp(1.75rem, 1.5179rem + 0.952vw, 2.375rem); --type-numeral-weight: 400; --type-numeral-lh: 1.9; --type-numeral-tracking: -0.035em; --type-numeral-case: none;
  --type-h1-font: var(--heading); --type-h1-size: clamp(2.75rem, 2.2003rem + 2.255vw, 4.23rem); --type-h1-weight: 600; --type-h1-lh: 1.22; --type-h1-tracking: normal; --type-h1-case: none;
  --type-h2-font: var(--heading); --type-h2-size: clamp(2.125rem, 1.8rem + 1.333vw, 3rem); --type-h2-weight: 600; --type-h2-lh: 1.22; --type-h2-tracking: normal; --type-h2-case: none;
  --type-h3-font: var(--heading); --type-h3-size: clamp(1.9375rem, 1.6543rem + 1.162vw, 2.7rem); --type-h3-weight: 400; --type-h3-lh: 1.25; --type-h3-tracking: normal; --type-h3-case: none;
  --type-h4-font: var(--heading); --type-h4-size: clamp(1.625rem, 1.4393rem + 0.762vw, 2.125rem); --type-h4-weight: 600; --type-h4-lh: 1.2; --type-h4-tracking: normal; --type-h4-case: none;
  --type-h5-font: var(--heading); --type-h5-size: clamp(1.4375rem, 1.2982rem + 0.571vw, 1.8125rem); --type-h5-weight: 600; --type-h5-lh: 1.22; --type-h5-tracking: normal; --type-h5-case: none;
  --type-h6-font: var(--heading); --type-h6-size: clamp(1.375rem, 1.2821rem + 0.381vw, 1.625rem); --type-h6-weight: 600; --type-h6-lh: 1.18; --type-h6-tracking: -0.035em; --type-h6-case: none;
  --type-eyebrow-font: var(--sans); --type-eyebrow-size: 0.875rem; --type-eyebrow-weight: 600; --type-eyebrow-lh: 1.6; --type-eyebrow-tracking: 0.15em; --type-eyebrow-case: uppercase;
  --type-lede-font: var(--display); --type-lede-size: clamp(1.1875rem, 1.1179rem + 0.286vw, 1.375rem); --type-lede-weight: 400; --type-lede-lh: 1.75; --type-lede-tracking: normal; --type-lede-case: none;
  --type-body-font: var(--sans); --type-body-size: 0.9375rem; --type-body-weight: 400; --type-body-lh: 1.75; --type-body-tracking: normal; --type-body-case: none;
  --type-body-strong-font: var(--sans); --type-body-strong-size: 0.9375rem; --type-body-strong-weight: 700; --type-body-strong-lh: 1.75; --type-body-strong-tracking: normal; --type-body-strong-case: none;
  --type-small-font: var(--type-body-font); --type-small-size: var(--type-body-size); --type-small-weight: var(--type-body-weight); --type-small-lh: var(--type-body-lh); --type-small-tracking: var(--type-body-tracking); --type-small-case: var(--type-body-case);
  --type-button-font: var(--sans); --type-button-size: 0.875rem; --type-button-weight: 500; --type-button-lh: 1.75; --type-button-tracking: normal; --type-button-case: none;

  --space-section-tight: 1.875rem;
  --space-section-compact: clamp(2.5rem, 5vw, 4.5rem);
  --space-section: clamp(2.5rem, 5.42vw, 4.875rem);
  --space-section-roomy: clamp(3.25rem, 7.22vw, 6.5rem);
  --space-inline: clamp(3.125rem, 7vw, 6.2998rem);
  --space-1: 0.625rem;
  --space-2: 0.9375rem;
  --space-3: 1.125rem;
  --space-4: 1.25rem;
  --space-5: 1.375rem;
  --space-6: 1.5625rem;
  --space-7: 1.875rem;
  --space-8: clamp(1.5rem, 2.99vw, 2.6875rem);
  --space-9: clamp(1.875rem, 4.17vw, 3.75rem);
}
/* @end-contract-tokens */

@media (max-width: 1199px) {
  :root {
    --header-h: 88px;
  }
}

/* The 991 breakpoint literal lives in header.css; it is echoed here only as a height. */
@media (max-width: 991px) {
  :root {
    --header-h: 80px;
  }
}
