@import url("/brand/fonts.css");
@import url("/brand/components.css");

/* html { overflow-x: clip; } and a:focus-visible { outline: 3px solid var(--cn-color-amber); } are authored in brand/components.css. */

.hero, .lab { padding: var(--cn-space-16) 0 var(--cn-space-12); position: relative; }

.hero-motif {
  color: var(--cn-color-leaf);
  display: none;
  opacity: 0.06;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: var(--cn-space-8);
  width: min(36vw, 30rem);
}

.eyebrow {
  color: var(--cn-color-link);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1.25;
  margin: 0 0 var(--cn-space-4);
}

h1 {
  font-family: var(--cn-font-display);
  font-size: clamp(3rem, 7vw, 6rem);
  font-weight: 600;
  line-height: 0.96;
  margin: 0 0 var(--cn-space-6);
  max-width: 14ch;
}
.hero h1 { font-size: clamp(2.125rem, 4.6vw, 3.375rem); line-height: 1.16; max-width: 22ch; }
.lab h1 { font-size: clamp(2.5rem, 5vw, 4.5rem); line-height: 1; }

.lede { font-size: 1.25rem; line-height: 1.55; margin: 0 0 var(--cn-space-8); max-width: 60ch; }

.start, .contact {
  border-top: 1px solid var(--cn-color-line);
  padding: var(--cn-space-12) 0;
}

h2 {
  font-family: var(--cn-font-display);
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.1;
  margin: 0 0 var(--cn-space-4);
}

.section-intro { color: var(--cn-color-muted); margin: 0 0 var(--cn-space-8); max-width: 60ch; }

.model-list {
  display: grid;
  gap: var(--cn-space-6);
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  list-style: none;
  margin: 0 0 var(--cn-space-8);
  max-width: var(--cn-figure-max);
  padding: 0;
}

.model-item {
  background: var(--cn-color-panel);
  border: 1px solid var(--cn-color-line);
  border-radius: var(--cn-radius-control);
  padding: var(--cn-space-6);
}

.item-label {
  color: var(--cn-color-muted);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1.25;
  margin: 0 0 var(--cn-space-2);
}

.item-heading { font-size: 1.25rem; font-weight: 600; line-height: 1.25; margin: 0; }
.item-heading a { text-decoration: none; }
.item-heading a:hover { text-decoration: underline; }

.status-line { color: var(--cn-color-muted); margin: var(--cn-space-4) 0 0; max-width: 60ch; }
.results-page { max-width: var(--cn-figure-max); }
.results-intro, .results-section > p { max-width: var(--cn-reading-max); }
.method-note { border-left: 0.25rem solid var(--cn-color-leaf); color: var(--cn-color-muted); margin: var(--cn-space-8) 0 0; padding-left: var(--cn-space-4); }
.results-section { border-top: 1px solid var(--cn-color-line); margin-top: var(--cn-space-12); max-width: var(--cn-figure-max); padding-top: var(--cn-space-8); }
.check-block { background: var(--cn-color-panel); border: 1px solid var(--cn-color-line); border-radius: var(--cn-radius-control); font: 0.8125rem/1.6 var(--cn-font-mono); margin: var(--cn-space-6) 0; max-width: var(--cn-figure-max); overflow-x: auto; padding: var(--cn-space-4); }
.check-block-wrap { overflow-wrap: anywhere; white-space: pre-wrap; }
.method-note code { overflow-wrap: anywhere; }
.table-wrap { overflow-x: auto; }
.table-scroll-hint { color: var(--cn-color-muted); font-size: 0.75rem; font-weight: 600; margin: 0 0 var(--cn-space-3); }
.table-wrap:focus-visible { outline: 3px solid var(--cn-color-amber); outline-offset: 3px; }
@container page (min-width: 60.0625rem) { .product-output-card .table-scroll-hint { display: none; } }
table { border-collapse: collapse; min-width: 38rem; width: 100%; }
th, td { border-bottom: 1px solid var(--cn-color-line); padding: var(--cn-space-3) var(--cn-space-4); text-align: left; }
thead th, .figure-source, .figure-limit { color: var(--cn-color-muted); font-size: 0.875rem; font-weight: 600; }
tbody th, td, .chart-bar { font-variant-numeric: tabular-nums; }

.quant-chart { background: var(--cn-color-panel); border: 1px solid var(--cn-color-line); border-radius: var(--cn-radius-rule); margin: var(--cn-space-8) 0 0; padding: var(--cn-space-6); }
.quant-chart h3 { font-family: var(--cn-font-body); font-size: 1.125rem; font-weight: 600; line-height: 1.25; margin: 0; }
.quant-chart figcaption > p, .figure-source, .figure-limit { margin: var(--cn-space-3) 0 0; }
.figure-source code { overflow-wrap: anywhere; }
.chart { margin-top: var(--cn-space-6); }
.chart-legend { color: var(--cn-color-ink); display: flex; flex-wrap: wrap; gap: var(--cn-space-4); }
.chart-legend > span, .chart-category { align-items: center; color: var(--cn-color-ink); font-family: var(--cn-font-body); font-size: 0.75rem; font-weight: 500; line-height: 1.25; }
.chart-legend > span { display: inline-flex; gap: var(--cn-space-2); }
.chart-swatch { display: inline-block; height: 0.75rem; width: 0.75rem; }
.chart-plot { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); margin-top: var(--cn-space-6); }
.chart-axis { color: var(--cn-color-ink); font-family: var(--cn-font-mono); font-size: 0.75rem; line-height: 1.25; position: relative; }
.chart-axis span { position: absolute; right: var(--cn-space-2); transform: translateY(50%); }
.chart-scale50 { top: 0; transform: translateY(-50%) !important; }
.chart-scale25 { top: 50%; }
.chart-scale0 { bottom: 0; }
.chart-area { border-bottom: 2px solid var(--cn-color-ink); height: 15rem; position: relative; }
.chart-gridline { background: var(--cn-color-line); height: 1px; left: 0; position: absolute; right: 0; }
.chart-gridline-50 { top: 0; }
.chart-gridline-25 { top: 50%; }
.chart-gridline-0 { bottom: 0; }
.chart-groups { align-items: end; bottom: 0; display: grid; gap: var(--cn-space-3); grid-template-columns: repeat(4, minmax(0, 1fr)); left: 0; position: absolute; right: 0; top: 0; }
.chart-group { height: 100%; min-width: 0; }
.chart-bar-pair { align-items: end; display: flex; gap: var(--cn-space-2); height: 100%; justify-content: center; width: 100%; }
.chart-series { align-items: stretch; display: flex; flex: 0 1 3rem; height: 100%; justify-content: end; min-width: 0; position: relative; }
.chart-value { color: var(--cn-color-ink); font-family: var(--cn-font-mono); font-size: 0.75rem; font-weight: 400; line-height: 1.25; position: absolute; text-align: center; width: 100%; }
.chart-bar { bottom: 0; display: block; min-height: 0; position: absolute; width: 100%; }
.chart-bar-leaf { background: var(--cn-color-leaf); }
.chart-bar-amber { background: var(--cn-color-amber); }
.chart-series.chart-48 .chart-bar { height: 96%; }
.chart-series.chart-46 .chart-bar { height: 92%; }
.chart-series.chart-44 .chart-bar { height: 88%; }
.chart-series.chart-48 .chart-value { bottom: calc(96% + var(--cn-space-1)); }
.chart-series.chart-46 .chart-value { bottom: calc(92% + var(--cn-space-1)); }
.chart-series.chart-44 .chart-value { bottom: calc(88% + var(--cn-space-1)); }
.chart-categories { display: grid; gap: var(--cn-space-3); grid-column: 2; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.chart-category { margin: var(--cn-space-2) 0 0; overflow-wrap: anywhere; text-align: center; }
.results-actions { align-items: flex-start; display: flex; flex-wrap: wrap; gap: var(--cn-space-4); margin-top: var(--cn-space-12); }

.contact-line { margin: 0; max-width: 60ch; }

.project-section { border-top: 1px solid var(--cn-color-line); margin-top: var(--cn-space-12); padding-top: var(--cn-space-8); }
.project-section:first-of-type { margin-top: var(--cn-space-8); }
.project-list { list-style: none; margin: 0; max-width: var(--cn-reading-max); padding: 0; }
.project-item { border-bottom: 1px solid var(--cn-color-line); padding: var(--cn-space-6) 0; }
.project-item:first-child { padding-top: 0; }
.project-item p { margin: var(--cn-space-2) 0 0; max-width: var(--cn-reading-max); }
.project-item .item-heading { margin-top: var(--cn-space-2); }

/* Redirect replacement guide — an instruction sheet, not a dashboard. */
.redirect-guide { max-width: var(--cn-figure-max); }
.redirect-guide .results-intro { max-width: var(--cn-reading-max); }
.redirect-guide h1 { max-width: 13ch; }
.redirect-guide .guide-kicker { color: var(--cn-color-muted); font-family: var(--cn-font-mono); font-size: .875rem; margin: 0 0 var(--cn-space-4); }
.redirect-sheet { background: var(--cn-color-panel); border: var(--cn-stroke) solid var(--cn-color-ink); box-shadow: none; margin: var(--cn-space-8) 0 0; padding: clamp(1rem, 3vw, 2rem); }
.redirect-sheet > header { border-bottom: var(--cn-stroke) solid var(--cn-color-ink); display: flex; flex-wrap: wrap; gap: var(--cn-space-3) var(--cn-space-6); justify-content: space-between; padding-bottom: var(--cn-space-4); }
/* A figure title, not a section title: the results-page h2 rule would otherwise set it in Fraunces at title size. */
.redirect-sheet h2, article.results-page .redirect-sheet h2 { font: 600 var(--wp-text-h3)/1.25 var(--cn-font-body); letter-spacing: 0; margin: 0; max-width: none; word-spacing: normal; }
.synthetic-label { background: var(--cn-color-mint); border: var(--cn-stroke-small) solid var(--cn-color-ink); border-radius: var(--cn-radius-rule); color: var(--cn-color-ink); font-family: var(--cn-font-mono); font-size: var(--wp-text-body); font-weight: 600; line-height: 1.25; margin: 0; padding: .25rem .5rem; }
.redirect-rows { list-style: none; margin: 0; padding: 0; }
.redirect-row { border-bottom: var(--cn-stroke-small) solid var(--cn-color-ink); display: grid; gap: var(--cn-space-4); grid-template-columns: minmax(7rem, .6fr) minmax(0, 1fr) minmax(0, 1fr); padding: var(--cn-space-6) 0; }
.redirect-row:last-child { border-bottom: 0; padding-bottom: 0; }
.redirect-status { align-items: start; display: flex; flex-direction: column; gap: var(--cn-space-2); }
.redirect-status strong { font-family: var(--cn-font-mono); font-size: .875rem; line-height: 1.25; }
.redirect-status .symbol { align-items: center; border: var(--cn-stroke-small) solid var(--cn-color-ink); display: inline-flex; font-family: var(--cn-font-mono); font-size: 1rem; font-weight: 600; height: 1.75rem; justify-content: center; width: 1.75rem; }
.redirect-row.kept .symbol { background: var(--cn-color-mint); }
.redirect-row.changed .symbol { background: var(--cn-color-amber); color: var(--cn-color-panel); }
.redirect-row.missing .symbol { background: var(--cn-color-ink); color: var(--cn-color-panel); }
.redirect-cell { min-width: 0; }
.redirect-cell-label { color: var(--cn-color-muted); display: block; font-family: var(--cn-font-mono); font-size: .75rem; font-weight: 600; letter-spacing: .04em; margin-bottom: var(--cn-space-2); text-transform: uppercase; }
.redirect-pair { background: var(--cn-color-canvas); border: var(--cn-stroke-small) solid var(--cn-color-ink); display: block; font-family: var(--cn-font-mono); font-size: clamp(.875rem, 2vw, 1rem); overflow-wrap: anywhere; padding: var(--cn-space-3); }
.redirect-pair .arrow { padding: 0 .25rem; }
.redirect-pair.omitted { background: transparent; border-style: dashed; color: var(--cn-color-muted); min-height: 3rem; }
.redirect-sheet figcaption { border-top: var(--cn-stroke-small) solid var(--cn-color-ink); color: var(--cn-color-muted); font-size: .875rem; margin-top: var(--cn-space-6); padding-top: var(--cn-space-4); }
.guide-callout { background: var(--cn-color-mint); border-left: var(--cn-stroke) solid var(--cn-color-ink); margin: var(--cn-space-8) 0 0; max-width: var(--cn-reading-max); padding: var(--cn-space-6); }
.guide-callout p { margin: 0; }
.guide-callout p + p { margin-top: var(--cn-space-3); }
.guide-cta { background: var(--cn-color-leaf-strong); color: var(--cn-color-panel); margin-top: var(--cn-space-12); padding: clamp(1.5rem, 4vw, 3rem); }
.guide-cta h2 { font-size: clamp(2rem, 4vw, 3.5rem); max-width: 12ch; }
.guide-cta p { max-width: 60ch; }
/* On the cobalt band the action turns cream with cobalt text, as on the field (components.css). */
.guide-cta .button { background: var(--wp-on-bio); border-color: var(--wp-on-bio); color: var(--wp-cobalt); margin-top: var(--cn-space-3); }
.guide-cta .button:hover { background: #fff; border-color: #fff; color: var(--wp-cobalt); }
.guide-cta a:not(.button), .guide-cta a:not(.button):visited { color: var(--cn-color-panel); text-decoration-color: var(--cn-color-amber); }
.guide-cta a:not(.button):hover { color: var(--cn-color-panel); text-decoration-color: var(--cn-color-panel); }
.guide-cta :focus-visible { outline-color: var(--cn-color-panel); }
article.results-page .guide-cta .item-label { color: var(--cn-color-panel); }
article.results-page .guide-cta .via { color: var(--wp-deep-label); font-size: 1rem; line-height: 1.5; margin-top: var(--cn-space-4); }
article.results-page .guide-cta .via a { font-weight: 400; }
.email-fallback { border-top: var(--cn-stroke-small) solid var(--cn-color-panel); font-size: .9375rem; margin-top: var(--cn-space-6); padding-top: var(--cn-space-4); }
#email-fallback-label { font-size: var(--wp-text-body); }
.email-fallback-copy { background: var(--cn-color-panel); border: 0; border-radius: 0; color: var(--cn-color-ink); display: block; font: .875rem/1.4 var(--cn-font-mono); margin-top: var(--cn-space-2); max-width: 100%; min-height: 8rem; overflow-wrap: anywhere; padding: .25rem .5rem; resize: vertical; width: 100%; }
/* This page's action and shell controls meet the 48px touch-target brief. */
.redirect-guide-page .brand, .redirect-guide-page .site-header nav a, .redirect-guide-page .site-footer nav a, .redirect-guide-page .guide-cta .button { min-height: 3rem; }
.redirect-guide-page .site-header nav a { min-width: 3rem; }
@container page (max-width: 34rem) {
  .redirect-row { grid-template-columns: 1fr; gap: var(--cn-space-3); }
  .redirect-status { align-items: center; flex-direction: row; }
  .redirect-sheet { box-shadow: none; }
}

@container page (min-width: 60rem) {
  .hero, .lab { padding: var(--cn-space-24) 0 var(--cn-space-16); }
  .start, .contact { padding: var(--cn-space-16) 0; }
  .hero-motif { display: block; }
}

/* Inked site surface: outlines, hard offsets, and flat fills. */
a { font-weight: 500; text-decoration-thickness: 2px; }
.breach-clock .search-panel input:focus-visible { outline: 3px solid var(--cn-color-amber); outline-offset: 3px; }
.hero-motif { display: none; }
h1 { text-wrap: balance; }
.hero h1 .machine { background: var(--cn-color-ink); border-radius: 0.1em; box-decoration-break: clone; color: var(--cn-color-canvas); padding: 0.06em 0.22em; -webkit-box-decoration-break: clone; }
.start, .contact, .results-section, .scope-note, .eligibility-note, .project-section { border-top: var(--cn-stroke) solid var(--cn-color-ink); }
.model-item, .quant-chart, .breach-clock .search-panel, .breach-clock .offer { background: var(--cn-color-panel); border: var(--cn-stroke) solid var(--cn-color-ink); box-shadow: var(--cn-offset) var(--cn-offset) 0 var(--cn-color-ink); }
.model-item:nth-child(even), .breach-clock .offer:nth-child(even) { box-shadow: var(--cn-offset) var(--cn-offset) 0 var(--cn-color-leaf-strong); }
.eyebrow, .item-label { background: var(--cn-color-leaf); border: var(--cn-stroke-small) solid var(--cn-color-ink); border-radius: var(--cn-radius-rule); color: var(--cn-color-ink); display: inline-block; font-family: var(--cn-font-mono); padding: 0.125rem 0.4375rem; }
.item-heading a { color: var(--cn-color-ink); text-decoration-color: var(--cn-color-amber); }
table { border: var(--cn-stroke) solid var(--cn-color-ink); }
th, td { border-bottom: 2px solid var(--cn-color-ink); }
.quant-chart { border-radius: var(--cn-radius-control); }
.chart-area { border-bottom-width: var(--cn-stroke); }
.chart-gridline { background: var(--cn-color-line); opacity: 1; }
.chart-bar { border: 2px solid var(--cn-color-ink); }
.chart-swatch { border: 1.5px solid var(--cn-color-ink); }
.breach-clock .search-panel input { border: var(--cn-stroke) solid var(--cn-color-ink); border-radius: var(--cn-radius-control); }
.project-item { border-bottom: 2px solid var(--cn-color-ink); }
/* Working Proof — brand kit v1.4.0 Inked composition. */
.wrap { margin: 0 auto; max-width: var(--cn-page-max); padding-left: var(--cn-space-8); padding-right: var(--cn-space-8); }
.hero { display: grid; gap: var(--cn-space-16); grid-template-columns: 1fr; padding-bottom: 6rem; padding-top: 5.5rem; position: relative; }
.hero::after { background: var(--cn-color-ink); bottom: 0; content: ""; height: var(--cn-stroke); left: var(--cn-space-8); position: absolute; right: var(--cn-space-8); }
.hero-copy { align-self: end; }
.hero h1 { font-size: clamp(3.8rem, 6.5vw, 6rem); letter-spacing: -.035em; line-height: .94; max-width: 11ch; text-wrap: balance; }
.hero-lede { font-size: 1.25rem; line-height: 1.5; margin: var(--cn-space-8) 0 var(--cn-space-8); max-width: 55ch; }
.hero .actions { gap: var(--cn-space-4); }
.hero .button { padding: var(--cn-space-3) var(--cn-space-6); }
.identity { border-left: var(--cn-stroke) solid var(--cn-color-ink); color: var(--cn-color-muted); font-size: .875rem; margin: var(--cn-space-8) 0 0; max-width: 55ch; padding-left: var(--cn-space-4); }
.section { padding-bottom: 5.5rem; padding-top: 5.5rem; }
.section-head { align-items: end; display: grid; gap: var(--cn-space-8); grid-template-columns: 1fr 1fr; margin-bottom: 2.75rem; }
.section-head h2 { font-size: clamp(2.5rem, 4vw, 4.25rem); letter-spacing: -.025em; line-height: .98; max-width: 12ch; }
.section-head p { color: var(--cn-color-muted); margin: 0; max-width: 52ch; }
.section-head p.section-head-cta { color: var(--cn-color-ink); }
.work-grid { display: grid; gap: var(--cn-space-6); grid-template-columns: 1.35fr .65fr; }
.work-card { background: var(--cn-color-panel); border: var(--cn-stroke) solid var(--cn-color-ink); border-radius: var(--cn-radius-control); box-shadow: var(--cn-offset) var(--cn-offset) 0 var(--cn-color-ink); color: var(--cn-color-ink); display: grid; min-height: 16.25rem; overflow: hidden; padding: var(--cn-space-8); position: relative; text-decoration: none; }
.work-card:hover h3 { text-decoration: underline; text-decoration-color: var(--cn-color-amber); text-decoration-thickness: 4px; }
.work-card.primary { background: var(--cn-color-leaf-strong); box-shadow: var(--cn-offset-figure) var(--cn-offset-figure) 0 var(--cn-color-amber); color: var(--cn-color-panel); grid-row: span 2; min-height: 34rem; }
.work-card.primary .meta { color: var(--cn-color-mint); }
.work-card.primary h3 { font-size: clamp(3rem, 5vw, 5rem); max-width: 8ch; }
.work-card.game-card { background: linear-gradient(145deg, var(--cn-color-ink), var(--cn-color-leaf-strong)); box-shadow: var(--cn-offset) var(--cn-offset) 0 var(--cn-color-amber); color: var(--cn-color-panel); }
.work-card.game-card::before { background: var(--cn-color-amber); content: ''; height: 2px; left: -12%; opacity: .9; position: absolute; top: 48%; transform: rotate(-17deg); width: 124%; }
.work-card.game-card .meta { color: var(--cn-color-mint); }
.work-card.game-card .index-no { color: var(--cn-color-amber); }
.work-card.game-card h3 { font-size: clamp(2.75rem, 4.5vw, 4.5rem); max-width: 8ch; }
.work-card h3 { align-self: end; font-size: 2.125rem; line-height: 1.04; max-width: 11ch; }
.meta { color: var(--cn-color-muted); font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.work-card p { align-self: end; margin: var(--cn-space-4) 0 0; max-width: 44ch; }
.index-no { color: var(--cn-color-leaf); font-family: var(--cn-font-display); font-size: 5rem; line-height: .8; position: absolute; right: var(--cn-space-6); top: var(--cn-space-6); }
.work-card:not(.primary) .index-no { color: var(--cn-color-leaf-strong); }
.field-strip { border-bottom: var(--cn-stroke) solid var(--cn-color-ink); border-top: var(--cn-stroke) solid var(--cn-color-ink); }
.field-strip .wrap { display: grid; grid-template-columns: repeat(2, 1fr); padding-bottom: 0; padding-top: 0; }
.field-item { min-height: 11.875rem; padding: var(--cn-space-8); }
.field-item + .field-item { border-left: var(--cn-stroke) solid var(--cn-color-ink); }
.field-item h3 { font-family: var(--cn-font-body); font-size: 1.1875rem; }
.field-item p { color: var(--cn-color-muted); margin: var(--cn-space-3) 0 var(--cn-space-4); }
.field-item a { color: var(--cn-color-link); font-weight: 600; position: relative; }
/* The card action is a 20px-tall inline link, under the 24px WCAG 2.5.8 floor and the kit's 2.75rem
   target. Grow the pointer target to 2.75rem without moving a visible pixel; it is the last child of
   its card, so the overlay reaches into padding and never covers another interactive element. */
.field-item a::after { content: ''; inset: -0.75rem -0.5rem; position: absolute; }
.closing { align-items: end; display: grid; gap: var(--cn-space-16); grid-template-columns: 1.2fr .8fr; padding-bottom: 6rem; padding-top: 6rem; }
.closing h2 { font-size: clamp(3rem, 5vw, 5.5rem); line-height: .94; max-width: 10ch; }
.closing p { margin: 0 0 var(--cn-space-6); }
@container page (max-width: 60rem) {
  .hero { gap: var(--cn-space-12); grid-template-columns: 1fr; }
}
@container page (max-width: 34rem) {
  .wrap { padding-left: 1.25rem; padding-right: 1.25rem; }
  .hero { gap: var(--cn-space-12); padding-bottom: 4.125rem; padding-top: 3.625rem; }
  .hero::after { left: 1.25rem; right: 1.25rem; }
  .hero h1 { font-size: clamp(3.1rem, 16vw, 4.2rem); }
  .hero-lede { font-size: 1.125rem; }
  .hero .actions { align-items: stretch; flex-direction: column; }
  .hero .button { text-align: center; }
  .section { padding-bottom: 4.125rem; padding-top: 4.125rem; }
  .section-head { grid-template-columns: 1fr; margin-bottom: var(--cn-space-8); }
  .work-grid { grid-template-columns: 1fr; }
  .work-card.primary { grid-row: auto; min-height: 30rem; }
  .work-card { min-height: 16.875rem; }
  .field-strip .wrap { grid-template-columns: 1fr; }
  .field-item { min-height: auto; padding: var(--cn-space-6) 0; }
  .field-item + .field-item { border-left: 0; border-top: var(--cn-stroke) solid var(--cn-color-ink); }
  .closing { align-items: start; grid-template-columns: 1fr; padding-bottom: 4.5rem; padding-top: 4.5rem; }
}
.breach-clock { max-width: var(--cn-figure-max); padding-bottom: var(--cn-space-16); }
.breach-clock h1 { font-size: clamp(2.5rem, 5vw, 4.5rem); }
.search-panel { background: var(--cn-color-panel); border: 1px solid var(--cn-color-line); border-radius: var(--cn-radius-control); margin-top: var(--cn-space-8); padding: var(--cn-space-6); }
.search-panel label { display: block; font-size: 0.875rem; font-weight: 600; margin-bottom: var(--cn-space-2); }
.search-panel input { background: var(--cn-color-panel); border: 1px solid var(--cn-color-leaf); border-radius: var(--cn-radius-rule); color: var(--cn-color-ink); font: inherit; min-height: 3rem; padding: var(--cn-space-3) var(--cn-space-4); width: 100%; }
.search-panel input:focus-visible { outline: 3px solid var(--cn-color-amber); outline-offset: 3px; }
.privacy-line { color: var(--cn-color-muted); font-size: 0.875rem; font-weight: 500; margin: var(--cn-space-3) 0 0; }
.coverage-line { color: var(--cn-color-muted); margin: var(--cn-space-6) 0 0; max-width: var(--cn-reading-max); }
.offer-results { display: grid; gap: var(--cn-space-4); list-style: none; margin: var(--cn-space-8) 0 0; padding: 0; }
.offer { background: var(--cn-color-panel); border: 1px solid var(--cn-color-line); border-radius: var(--cn-radius-control); padding: var(--cn-space-6); }
.offer h2 { font-family: var(--cn-font-body); font-size: 1.25rem; line-height: 1.25; margin-bottom: var(--cn-space-3); word-spacing: normal; }
.offer p { margin: var(--cn-space-2) 0 0; }
.offer .status-open { color: var(--cn-color-link); font-weight: 600; }
.offer .status-expired { color: var(--cn-color-danger); font-weight: 600; }
.offer .status-unknown { color: var(--cn-color-muted); font-weight: 600; }
.empty-result { color: var(--cn-color-muted); margin: var(--cn-space-8) 0 0; max-width: var(--cn-reading-max); }
.scope-note, .eligibility-note { border-top: 1px solid var(--cn-color-line); margin: var(--cn-space-12) 0 0; max-width: var(--cn-reading-max); padding-top: var(--cn-space-6); }
.source-footer { color: var(--cn-color-muted); font-size: 0.875rem; font-weight: 500; margin: var(--cn-space-12) 0 0; }
@container page (max-width: 34rem) { .breach-clock { padding-bottom: var(--cn-space-12); } }

/* Documents to CSV — Stripe-level product clarity on the shared apex grid. */
.product-page { padding-bottom: var(--cn-space-16); }
.product-hero { align-items: start; border-bottom: var(--cn-stroke) solid var(--cn-color-ink); display: grid; gap: var(--cn-space-16); grid-template-columns: minmax(0, 1.25fr) minmax(18rem, .75fr); padding-bottom: var(--cn-space-12); padding-top: 5.5rem; }
.product-hero-copy h1 { font-size: clamp(3.25rem, 6.5vw, 6rem); letter-spacing: -.035em; line-height: .94; max-width: 9ch; text-wrap: balance; }
.product-hero-copy .lede { max-width: 56ch; }
.product-summary { align-self: end; display: grid; gap: var(--cn-space-6); }
.offer-tier { min-width: 0; }
.offer-tier + .offer-tier { border-top: var(--cn-stroke-small) solid var(--cn-color-ink); padding-top: var(--cn-space-5); }
.tier-label { color: var(--cn-color-muted); font-family: var(--cn-font-mono); font-size: .75rem; font-weight: 600; letter-spacing: .04em; margin: 0; text-transform: uppercase; }
.tier-price { font-family: var(--cn-font-display); font-size: clamp(2.75rem, 6vw, 4.5rem); letter-spacing: -.05em; line-height: .85; margin: var(--cn-space-2) 0 0; }
.tier-note { color: var(--cn-color-muted); font-size: .875rem; margin: var(--cn-space-2) 0 var(--cn-space-4); }
.summary-price { font-family: var(--cn-font-display); font-size: clamp(4rem, 8vw, 7rem); letter-spacing: -.05em; line-height: .8; margin: 0; }
.summary-label { font-size: 1.125rem; font-weight: 600; margin: var(--cn-space-2) 0 var(--cn-space-4); }
.product-facts { border-top: var(--cn-stroke-small) solid var(--cn-color-ink); list-style: none; margin: 0; padding: 0; }
.product-facts li { align-items: baseline; border-bottom: 1px solid var(--cn-color-line); display: flex; gap: var(--cn-space-3); justify-content: space-between; padding: var(--cn-space-3) 0; }
.product-facts strong { font-size: 1.125rem; }
.product-facts span { color: var(--cn-color-muted); font-size: .875rem; text-align: right; }
.summary-rejection { border-left: .35rem solid var(--cn-color-leaf); margin: var(--cn-space-3) 0 0; padding-left: var(--cn-space-3); }
.product-section { border-bottom: 1px solid var(--cn-color-line); padding-bottom: 5.5rem; padding-top: 5.5rem; }
.limitation-card { border-left: .35rem solid var(--cn-color-amber); }
.limitation-card h2 { font-size: 1.75rem; line-height: 1.2; margin: var(--cn-space-2) 0 var(--cn-space-4); }
.limitation-card p { margin: 0 0 var(--cn-space-3); max-width: 68ch; }
.limitation-card p:last-child { margin-bottom: 0; }
.limitation-card code, .lede code, .starter-buy-note code, .summary-rejection code, .output-caption code, .product-section-head code, .free-proof-copy code { font-size: .9em; white-space: nowrap; }
.row-empty td { color: var(--cn-color-muted); font-variant-numeric: normal; }
.product-section-head { margin-bottom: 2.75rem; }
.product-output-grid, .deliverable-grid { align-items: start; display: grid; gap: var(--cn-space-6); }
.product-output-grid { grid-template-columns: minmax(0, 1fr); }
.deliverable-grid { grid-template-columns: minmax(0, 1.35fr) minmax(18rem, .65fr); }
.product-output-card, .flagged-output, .sample-downloads { min-width: 0; }
.product-output-card h3, .flagged-output h3, .sample-downloads h3, .delivery-notes h3 { font-family: var(--cn-font-body); font-size: 1.25rem; line-height: 1.25; margin: 0; }
.output-caption { color: var(--cn-color-muted); margin: var(--cn-space-3) 0 0; max-width: 60ch; }
.product-output-card .table-wrap { margin-top: var(--cn-space-6); }
.product-output-card table { min-width: 0; }
.reference-job-table { min-width: 0; }
.reference-job-table th:not(:first-child),
.reference-job-table td { white-space: nowrap; }
#reference-job .limitation-card .item-heading { margin-bottom: var(--cn-space-3); }
@container page (max-width: 34rem) {
  .reference-job-table { font-size: .875rem; }
  .reference-job-table th,
  .reference-job-table td { padding-left: var(--cn-space-2); padding-right: var(--cn-space-2); }
}
.product-output-side { align-content: start; display: grid; gap: var(--cn-space-6); grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; }
.flagged-output p:not(.item-label) { margin: var(--cn-space-3) 0 0; }
.flagged-output table { display: block; font-size: .875rem; margin-top: var(--cn-space-5); min-width: 0; table-layout: fixed; width: 100%; }
.flagged-output th, .flagged-output td { overflow-wrap: normal; vertical-align: top; word-break: normal; }
.flagged-output th:first-child, .flagged-output td:first-child { width: 40%; }
.sample-downloads ul { list-style: none; margin: var(--cn-space-4) 0 0; padding: 0; }
.sample-sources-label { margin: var(--cn-space-5) 0 0; }
.sample-downloads li { border-top: 1px solid var(--cn-color-line); padding: var(--cn-space-2) 0; }
.sample-downloads a { font-weight: 600; }
.sample-downloads a.button { color: var(--cn-color-link); width: 100%; }
.deliverables-list { counter-reset: deliverable; list-style: none; margin: 0; padding: 0; }
.deliverables-list li { align-items: baseline; border-top: 1px solid var(--cn-color-line); counter-increment: deliverable; display: flex; gap: var(--cn-space-4); justify-content: space-between; padding: var(--cn-space-3) 0; }
.deliverables-list li:first-child { border-top: 0; padding-top: 0; }
.deliverables-list li::before { color: var(--cn-color-muted); content: counter(deliverable, decimal-leading-zero); font-family: var(--cn-font-mono); font-size: .75rem; }
.deliverables-list strong { flex: 1 1 auto; font-family: var(--cn-font-mono); }
.deliverables-list span { color: var(--cn-color-muted); font-size: .875rem; text-align: right; }
.delivery-notes p:not(.item-label) { margin-top: var(--cn-space-4); }
.hero-free-note { color: var(--cn-color-muted); font-size: 1rem; margin: var(--cn-space-4) 0 0; max-width: 56ch; }
.hero-free-note a { color: var(--cn-color-link); }
.starter-buy { width: 100%; }
.starter-buy-note { color: var(--cn-color-muted); font-size: 1rem; margin: var(--cn-space-3) 0 0; }
.free-proof-card { align-items: center; display: grid; gap: var(--cn-space-8); grid-template-columns: minmax(0, 1.15fr) minmax(13rem, .5fr) auto; }
.free-proof-copy h2 { font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.1; margin: var(--cn-space-3) 0 0; max-width: 22ch; }
.free-proof-copy p:not(.item-label) { margin: var(--cn-space-4) 0 0; max-width: 60ch; }
.free-proof-copy .muted { font-size: 1rem; }
.free-proof-facts { border-top: var(--cn-stroke-small) solid var(--cn-color-ink); list-style: none; margin: 0; padding: 0; }
.free-proof-facts li { align-items: baseline; border-bottom: 1px solid var(--cn-color-line); display: flex; gap: var(--cn-space-3); justify-content: space-between; padding: var(--cn-space-3) 0; }
.free-proof-facts strong { font-size: 1.125rem; }
.free-proof-facts span { color: var(--cn-color-muted); font-size: .875rem; text-align: right; }
.free-proof-actions { display: grid; gap: var(--cn-space-3); }
.bottom-cta-free { font-size: 1rem; margin: var(--cn-space-4) 0 0; }
.bottom-cta-free a { color: inherit; }
.closed-offer { border-bottom: 0; padding-bottom: var(--cn-space-8); padding-top: var(--cn-space-8); }
.closed-offer h2 { font-family: var(--cn-font-body); font-size: 1.125rem; line-height: 1.35; margin: var(--cn-space-3) 0 0; max-width: 60ch; word-spacing: normal; }
.closed-offer > p:not(.item-label) { color: var(--cn-color-muted); font-size: 1rem; margin: var(--cn-space-2) 0 0; max-width: 60ch; }
.product-bottom-cta { align-items: end; background: var(--cn-color-leaf-strong); color: var(--cn-color-panel); display: flex; gap: var(--cn-space-8); justify-content: space-between; margin-top: var(--cn-space-12); }
.product-bottom-cta .item-label { background: var(--cn-color-mint); }
.product-bottom-cta h2 { font-size: clamp(2rem, 4vw, 3.5rem); margin: 0; max-width: 12ch; }
.product-bottom-cta .button { background: var(--cn-color-panel); flex: 0 0 auto; }
/* PDF accessibility remediation — the free-check service page reads as a plain
   worked list: each item names one thing the check or the fix covers. */
.service-list { display: grid; gap: var(--cn-space-4); list-style: none; margin: 0; max-width: 68ch; padding: 0; }
.service-list li { border-left: .35rem solid var(--cn-color-leaf); padding-left: var(--cn-space-4); }
.service-steps { display: grid; gap: var(--cn-space-4); margin: 0; max-width: 68ch; padding-left: var(--cn-space-6); }
.service-steps li { padding-left: var(--cn-space-2); }
@container page (max-width: 60rem) {
  .product-hero { gap: var(--cn-space-12); grid-template-columns: minmax(0, 1fr) minmax(16rem, .7fr); }
  .deliverable-grid { grid-template-columns: 1fr; }
  .product-output-card table { min-width: 54rem; }
  .free-proof-card { align-items: start; grid-template-columns: minmax(0, 1fr) minmax(12rem, .6fr); }
  .free-proof-actions { grid-column: 1 / -1; justify-self: start; }
}
@container page (max-width: 34rem) {
  .product-page { padding-bottom: var(--cn-space-12); }
  .product-hero { align-items: start; gap: var(--cn-space-8); grid-template-columns: 1fr; padding-bottom: var(--cn-space-12); padding-top: 3.625rem; }
  .product-hero-copy h1 { font-size: clamp(3.1rem, 16vw, 4.2rem); }
  .product-hero-copy .actions { align-items: stretch; flex-direction: column; }
  .product-hero-copy .button { text-align: center; }
  .product-section { padding-bottom: 4.125rem; padding-top: 4.125rem; }
  .closed-offer { padding-bottom: var(--cn-space-8); padding-top: var(--cn-space-8); }
  .product-section-head { margin-bottom: var(--cn-space-8); }
  .product-section-head h2 { font-size: clamp(2.5rem, 12vw, 3.5rem); }
  .product-output-card, .flagged-output, .sample-downloads, .deliverable-grid .card { padding: var(--cn-space-4); }
  .product-output-side { grid-template-columns: 1fr; }
  .deliverables-list li { align-items: start; flex-wrap: wrap; gap: var(--cn-space-2) var(--cn-space-3); }
  .deliverables-list strong { flex: 1 1 calc(100% - 2rem); }
  .deliverables-list span { flex-basis: 100%; padding-left: 2rem; text-align: left; }
  .product-bottom-cta { align-items: stretch; flex-direction: column; margin-top: var(--cn-space-8); }
  .product-bottom-cta .button { width: 100%; }
  .free-proof-card { gap: var(--cn-space-6); grid-template-columns: 1fr; padding: var(--cn-space-4); }
  .free-proof-actions { width: 100%; }
  .free-proof-actions .button { text-align: center; width: 100%; }
}

/* Who pays for this (scripts/value-capture.mjs): reader support, planned Team checks and the sponsor
 * line, after a page's content and never before it. A quiet ledger: the status leads each row in
 * mono, so "planned, not built" and "none yet" read as plainly as the offer itself. */
.vc { border-top: var(--wp-rule-strong) solid var(--wp-ink); display: grid; margin-top: var(--wp-16); max-width: 60rem; padding-top: var(--wp-6); }
.vc h2 { font-size: 1.75rem; line-height: 1.1; margin: 0 0 var(--wp-2); }
.vc-row { border-top: var(--wp-rule) solid var(--wp-hair); column-gap: var(--wp-8); display: grid; grid-template-columns: 13rem minmax(0, 1fr); padding: var(--wp-4) 0 var(--wp-6); }
.vc h2 + .vc-row { border-top: 0; }
.vc-status { color: var(--wp-muted); font: 500 var(--wp-text-cite)/1.4 var(--wp-font-mono); letter-spacing: .06em; margin: .3em 0 0; text-transform: uppercase; }
.vc-copy { display: grid; gap: var(--wp-3); max-width: var(--wp-measure); }
.vc-copy h3 { font: 700 1.25rem/1.2 var(--wp-font-display); margin: 0; }
.vc-copy p { line-height: 1.55; margin: 0; }
.vc-copy a[href^="mailto:"] { overflow-wrap: anywhere; }
.vc-line { line-height: 1.55; margin: var(--wp-6) 0 0; max-width: 40em; }
.vc-nb { white-space: nowrap; }
/* Narrower than 20rem happens only with enlarged text (at 100% the page is at least 320px): there a name wider than the line wraps inside its own box instead of crossing the screen. */
@container page (max-width: 19.99rem) { .vc-nb { display: inline-block; max-width: 100%; overflow-wrap: anywhere; text-decoration: inherit; white-space: normal; } }
@container page (max-width: 37.5rem) {
  .vc { margin-top: var(--wp-12); }
  .vc-row { grid-template-columns: minmax(0, 1fr); row-gap: var(--wp-2); }
}