/* Text Display Standard v1.0 — Vanity or Vice (+ Claire surfaces) */

:root {
  --tds-ui: 1rem;
  --tds-meta: 0.875rem;
  --tds-body: 1.125rem;
}

html { font-size: 100%; }
body {
  font-size: var(--tds-body);
  line-height: 1.65;
}

/* High-specificity size floors to beat component !important */
html body nav a,
html body header a,
html body .vv-nav a,
html body .vv-btn,
html body a.vv-btn,
html body .vv-btn--primary,
html body .vv-btn--ghost,
html body .vv-btn--ink,
html body .vv-btn--outline,
html body button:not(.components-button),
html body .wp-element-button {
  font-size: 1rem !important;
  line-height: 1.3 !important;
  opacity: 1 !important;
}
html body .vv-btn {
  min-height: 48px !important;
}

html body .vv-verdict-tag,
html body span.vv-verdict-tag,
html body .vv-verdict-tag--worth,
html body .vv-verdict-tag--stop,
html body .vv-verdict-tag--insuff,
html body .vv-kicker,
html body span.vv-kicker,
html body [class*="vv-kicker"],
html body [class*="eyebrow"],
html body [class*="verdict-tag"] {
  font-size: 0.875rem !important;
  letter-spacing: 0.1em !important;
  line-height: 1.35 !important;
  opacity: 1 !important;
}

a.vv-skip:focus,
a.vv-skip:focus-visible {
  clip: auto !important;
  width: auto !important;
  height: auto !important;
  position: fixed !important;
  z-index: 99999;
  font-size: 1rem !important;
}

html body .entry-content p,
html body .article-content p,
html body main p {
  /* House layout contract: fluid prose scale, and no 68ch measure cap —
     the column stays at 90% and the type grows with the viewport instead. */
  font-size: var(--bleed-prose-size, clamp(1.0625rem, 0.92rem + 0.42vw, 1.5rem)) !important;
  line-height: var(--bleed-prose-lh, clamp(1.5em, 1.42em + 0.35vw, 1.72em)) !important;
  max-width: none;
  opacity: 1 !important;
}

html body .cew-site nav a,
html body .cew-site .btn,
html body .claire-nav a {
  font-size: 1rem !important;
  opacity: 1 !important;
}

html body h1 { font-size: clamp(2.25rem, 4.5vw, 3.65rem) !important; line-height: 1.08 !important; }
html body h2 { font-size: clamp(1.75rem, 3vw, 2.85rem) !important; line-height: 1.15 !important; }
html body h3 { font-size: clamp(1.25rem, 1.8vw, 1.65rem) !important; line-height: 1.25 !important; }

body :where(h1, h2, h3, h4, p, a, button, li) {
  overflow-wrap: break-word;
}
img, video, svg { max-width: 100%; height: auto; }