/**
 * perfectionist-craft-v20260512a.css — micro-craft fixes applied sitewide.
 *
 * Touches 9 audit dimensions:
 *   D1  Widow/orphan control (text-wrap balance/pretty)
 *   D2  Hanging punctuation on pull-quotes + blockquotes
 *   D3  Tabular numerals on prices, scores, timers, percentages
 *   D4  Optical kerning + optimizeLegibility on serif headlines
 *   D5  Common + contextual ligatures on body; small-caps off
 *   D10 Custom :focus-visible rings on every interactive element
 *   D11 Default easing: cubic-bezier(0.16, 1, 0.3, 1) for any unset transition
 *   D13 prefers-reduced-motion fallback covers everything new
 *   D20 Skip-to-content visible only on focus
 *
 * Loads last so it wins specificity ties.
 */

/* ── D1: widow/orphan control on headings + paragraphs ─────────────── */
h1, h2, h3, h4,
.hero-cine-h1, .pillar h1, .pillar-section h2, .brand-reveal h1,
.bd-h1, .ab-h1, .pc-h1, .cm-h1, .cl-h1, .fr-h1, .md-h1, .me-h1, .te-h1, .ss-h1, .fk-h1, .cb-h1, .nb-h1, .pr-h1, .pi-h1, .st-h1, .dg-h1, .td-h1, .hp-h1, .bl-h1 {
  text-wrap: balance;
  -webkit-hyphens: auto;
  hyphens: auto;
}
p, .lede, .pillar-section p, .pillar-tldr p {
  text-wrap: pretty;
  /* Pretty is opt-in; browsers that don't support it fall back to normal,
     which is fine. */
}

/* ── D2: hanging punctuation on pull-quotes + blockquotes ────────── */
blockquote, .pull-quote, .proof-quote {
  hanging-punctuation: first allow-end last;
}

/* ── D3: tabular numerals where they should be tabular ───────────── */
.price, .stat, .stat strong, .te-timer, .cap-timer, .nb-grid .nb-cell,
.dr-banner-price, .cm-card .count, .fr-num,
[data-tabular], time, .fineprint .price, .live-fineprint, .sup-tip-amount,
.dlr-amount, .me-row, .pr-stat .v {
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum';
}

/* ── D4 + D5: serif headline polish ──────────────────────────────── */
h1, h2, h3, h4, h5, h6,
.hero-cine-h1, .pillar h1, .pillar-section h2, .brand-reveal h1 {
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: 'kern' 1, 'liga' 1, 'clig' 1, 'calt' 1;
}
body {
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: 'kern' 1, 'liga' 1, 'clig' 1, 'calt' 1;
  text-rendering: optimizeLegibility;
}

/* ── D10: visible focus rings on every interactive element ──────── */
:focus-visible {
  outline: 2px solid var(--ds-accent, #C9613F) !important;
  outline-offset: 2px;
  border-radius: 3px;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--ds-accent, #C9613F) !important;
  outline-offset: 2px;
}
/* Skip browser default; we render our own */
button:focus:not(:focus-visible),
a:focus:not(:focus-visible) {
  outline: none;
}
/* Skip-to-content visible only on focus (D20) */
.skip-to-content {
  position: absolute !important;
  left: -9999px;
  top: 0;
}
.skip-to-content:focus,
.skip-to-content:focus-visible {
  position: fixed !important;
  left: 14px;
  top: 14px;
  background: var(--ds-ink, #1A1814);
  color: var(--ds-bg, #FAF7F2);
  padding: 10px 14px;
  border-radius: 4px;
  z-index: 200;
  text-decoration: none;
  font-weight: 600;
}

/* ── D11: standard easing on every transition that didn't specify ── */
* {
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ── D13: reduced-motion blanket ─────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ── D29: text-overflow ellipsis on long card titles (clamp to 2 lines) */
.product-card h3, .product-card h2,
.cm-card h2,
.bl-entry h2,
.dg-item h2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Italic correction so italic spans don't break underline (D6) ─── */
em, i {
  font-style: italic;
  font-feature-settings: 'kern' 1, 'liga' 1;
}
a em, a i {
  text-decoration-skip-ink: auto;
}
