/* ==========================================================================
   business.css — page-scoped corrections for business.html

   business.html shares css/pages/company.css with about.html, careers.html
   and contact.html. Anything that belongs to all four stays there; this file
   holds only what is specific to the "For business" page, so the shared sheet
   keeps one voice.

   Every value resolves to a token from css/tokens.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Contrast patch — --text-subtle
   The shared token resolves to #7c8598, which is 3.71:1 on --surface in light
   and 4.43:1 on --surface-2 in dark: under the 4.5:1 floor in both themes. On
   this page it carries the field hints, the "Optional" markers on the enquiry
   form and the footer note, so it is corrected here until css/tokens.css is
   fixed centrally. The high-contrast theme already ships its own, darker
   values — leave those be.
   -------------------------------------------------------------------------- */
:root:not([data-contrast="high"]) { --text-subtle: #626c85; }
:root[data-theme="dark"]:not([data-contrast="high"]) { --text-subtle: #838b9f; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-contrast="high"]) { --text-subtle: #838b9f; }
}

/* Placeholders are the one role that should NOT follow the darker token: a
   placeholder that reads as strongly as a value is a worse form, not a better
   one. Hold them at the old weight by mixing the corrected token back toward
   the field's own ground, so it stays right in both themes. */
:root:not([data-contrast="high"]) .input::placeholder {
  color: color-mix(in srgb, var(--text-subtle) 82%, var(--surface));
}

/* --------------------------------------------------------------------------
   Enquiry form
   -------------------------------------------------------------------------- */

/* The character counter sits in the label row opposite the question, so it
   needs the tabular figures every other number on the site gets — otherwise
   the label reflows a pixel at a time as you type. */
.co-enquiry-card [data-count] { font-variant-numeric: tabular-nums; }

/* The status region is written after a submit. When it appears it must clear
   the buttons above it rather than sit against them. */
#business-status:not(:empty) { margin-top: var(--space-5); }