@import url("../../design-system/tokens/surface-colors.css?v=20260909-2");
@import url("../../design-system/tokens/materials.css?v=20260909-1");

/* Explicit cascade order prevents selector-specificity regressions. */
@layer base, presentation;
@layer presentation {
/* Shared material and geometry layer for the case atlas and product landing.
   One surface per component; nested content stays on the same material. */

body::after {
  content: ""; position: fixed; inset: 0; z-index: 80; pointer-events: none;
  background: var(--lh-paper-grain) repeat; background-size: 560px;
  opacity: .24; mix-blend-mode: multiply;
}
/* Shells and controls share geometry, including the previously square menu. */
:is(.site-header, .pl-header) { border-bottom: 0; border-radius: 0; }
:is(.language-switch, .pl-language) { padding: 4px; border-radius: var(--lh-radius-inner); }
:is(.language-switch a, .pl-language a, .map-button, .pl-case-link, .drawer-head button,
  .case-overview-actions a, .next-status, .pl-skip, .skip-link, .pl-button,
  .path-switch button, .evidence-filters button) { border-radius: var(--lh-radius-control); }
:is(.language-switch, .pl-language) a[aria-current="page"] {
  background: var(--lh-product-selected); color: var(--lh-product-selected-ink);
}
.map-button, .drawer-head button { background: var(--lh-product-sage); color: var(--lh-product-stage); }
.project-drawer { inset: 12px 12px 12px auto; width: min(456px, calc(100% - 24px)); border-radius: var(--lh-radius-surface); background: var(--lh-product-stage); }
.chapter-list li > * { border-radius: var(--lh-radius-control); }
.chapter-list a { background: var(--lh-product-stage-raised); }
.chapter-list .is-current > a { background: var(--lh-product-selected); color: var(--lh-product-selected-ink); }
.chapter-list .is-current span { color: inherit; }
/* One product identity on the landing and throughout the case. */
.tandraft-mark { display: block; flex: 0 0 32px; width: 32px; height: 32px; }
.tandraft-wordmark { font: 700 23px/1.05 var(--lh-font-sans); letter-spacing: -.03em; }
/* Caption belongs to the whole identity, never to the wordmark alone. */
.brand { display: grid; justify-items: start; align-content: center; gap: 4px; min-width: 0; max-width: 100%; padding-block: 8px; }
.tandraft-identity { display: inline-flex; align-items: center; gap: 6px; }
.tandraft-identity .tandraft-mark { width: 24px; height: 24px; flex-basis: 24px; }
.tandraft-identity strong { font: 700 20px/1.05 var(--lh-font-sans); letter-spacing: -.03em; }
.tandraft-caption { font: 500 12px/1.4 var(--lh-font-mono); letter-spacing: .025em; color: var(--ink-soft); }
.pl-logo .tandraft-wordmark { display: inline; }
.pl-hero-copy .product-concept-note { margin: 0 0 20px; font-size: 13px; line-height: 1.5; color: var(--pl-soft); }
@media (max-width: 480px) {
  .pl-logo { gap: 6px; }
  .tandraft-mark { width: 26px; height: 26px; flex-basis: 26px; }
  .tandraft-wordmark { font-size: 20px; }
  .tandraft-identity .tandraft-mark { width: 22px; height: 22px; flex-basis: 22px; }
  .tandraft-identity strong { font-size: 18px; }
  .site-header { grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; }
  .tandraft-caption { max-width: 100%; overflow-wrap: normal; }
  .header-actions, .pl-actions { gap: 6px; }
}
.review-actions span::before { border-radius: 50%; }
.pl-progress, .reading-progress, .pl-progress > span, .reading-progress > span { border-radius: 8px; }

/* Reusable outer frames. The list is deliberate: it never rounds text or SVG paths. */
:is(.hero, .chapter-hero, .hero-evidence, .chapter-sample,
 .case-overview-grid article, .foundation-goal > *, .gtm-brief-grid article,
 .audience-panel, .audience-tabs button, .conversion-steps button, .conversion-panel,
 .measurement-strip > div, .tension-comparison article, .comparison-bridge,
 .method-track li, .source-strip a, .project-stage, .anatomy-tabs button, .layer-panel,
 .path-canvas, .evidence-row, .sample-ledger > div, .research-card, .process-stack li,
 .strategy-matrix, .strategy-matrix-row, .stage-pagination a, .next-status,
 .signal-board, .comparison-board [role="cell"], .comparison-board [role="columnheader"],
 .comparison-board [role="rowheader"], .message-specimen p) { border-radius: var(--lh-radius-surface); }
:is(.stage-state, .status, .pill, .evidence-tag, .logic-line > span, .template-preview,
 .sequence-route, .tab-list, .sequence-head, .review-status) { border-radius: var(--lh-radius-control); }
.signal-track, .signal-track span { border-radius: 8px; }
.accordion-steps li { border-radius: var(--lh-radius-surface); }
/* Edge-to-edge page bands are not floating cards. */
.claims-section, .pl-section { border-radius: 0; }
.tension-tool { border-radius: var(--lh-radius-surface); }
mark { border-radius: 4px; }
.project-stage summary { border-radius: var(--lh-radius-surface); }
.project-stage { overflow: clip; }
.project-stage:has(:focus-visible) { overflow: visible; }

/* Reading rhythm is shared by stages 00–10, not recreated page by page. */
body:not(:has(.pl-hero)) { background-color: var(--lh-product-paper); }
body:not(:has(.pl-hero)) { --section-gap: clamp(56px, 6vw, 88px); --content-max: 1360px; }
.section-heading { gap: 40px; padding-bottom: 28px; }
.section-heading h2 { max-width: 22ch; font-size: clamp(32px, 4vw, 56px); line-height: 1.1; }
.section-heading > p { font-size: 16px; line-height: 1.6; }
.section :is(.research-card, .sample-ledger > div, .process-stack li, .case-overview-grid article) { box-shadow: none; background: #fff; }
.research-grid, .research-grid.is-compact, .sample-ledger, .case-overview-grid, .project-stages { gap: 16px; }
.research-card, .case-overview-grid article { min-height: 0; padding: 28px; }
.research-card h3, .case-overview-grid h3 { margin-top: 24px; font-size: clamp(24px, 2.4vw, 32px); line-height: 1.15; }
.research-card > span { font: 500 12px/1.5 var(--lh-font-sans); letter-spacing: 0; text-transform: none; }
.research-card > span::before { border-radius: 50%; }
.sample-ledger > div { min-height: 0; padding: 24px; }
.sample-ledger dd { margin-top: 24px; }
.sample-ledger dt { font: 500 12px/1.5 var(--lh-font-sans); text-transform: none; }
.case-overview-grid article:first-child, .case-overview-grid article:last-child { background: #fff; color: var(--ink); }
.case-overview-grid article:first-child p, .case-overview-grid article:last-child p { color: var(--ink-soft); }
.case-overview-grid article > span { color: var(--cobalt); font: 500 12px/1.5 var(--lh-font-sans); letter-spacing: 0; text-transform: none; }
.stage-pagination a { min-height: 100px; padding: 24px; background: var(--lh-product-sage); }
.stage-pagination a:last-child { background: var(--lh-product-stage); color: #fff; }
.stage-pagination a:last-child span { color: var(--lh-product-selected); }
.stage-pagination a strong { margin-top: 16px; }
.stage-pagination-single { grid-template-columns: minmax(0, 1fr); }
.stage-pagination-single a:last-child { text-align: left; }
.stage-navigation-section .stage-pagination { margin-top: 0; }
/* Keep the final navigation card clear of the footer rule on every case page. */
.site-footer { margin-block-start: var(--lh-space-10); }
.signals-section, .stage-blue-section { padding-bottom: var(--section-gap); border-radius: 0; margin-top: var(--section-gap); background: var(--lh-product-stage); }
.signals-section .method-note, .stage-blue-section .method-note { color: var(--lh-product-stage-muted); }

/* Compact, open stage covers: copy and generative illustration share the space. */
.chapter-hero {
  grid-template-columns: minmax(0, 1.3fr) minmax(260px, .7fr);
  gap: 28px 56px; min-height: 0; margin: 20px var(--page-pad) 0;
  padding: clamp(28px, 4vw, 56px); background-image: none;
  background-color: var(--lh-product-stage);
}
.chapter-hero .hero-index { grid-column: 1 / -1; flex-direction: row; align-items: baseline; padding: 0; gap: 12px; margin: 0; color: var(--lh-product-stage-muted); }
.chapter-hero .hero-index::before { display: none; }
.chapter-hero .hero-index > * { white-space: normal; }
.chapter-hero .hero-index strong { font-size: 14px; color: var(--lh-product-selected); }
html[lang] .chapter-hero h1 { max-width: 16ch; font-size: clamp(38px, 4.6vw, 64px); line-height: 1.06; }
.chapter-hero .hero-lead { font-size: 17px; margin-top: 24px; color: var(--lh-product-stage-muted); }
.chapter-sample { grid-column: auto; align-self: center; padding: 0; background: transparent; color: #fff; }
.chapter-sample > span, .chapter-sample p { color: var(--lh-product-stage-muted); }
.chapter-sample strong { margin: 12px 0; font-size: clamp(32px, 4vw, 52px); }
.chapter-sample .process-art { margin: 0 0 16px; }
.chapter-hero .text-link { margin-top: 16px; }

/* The overview keeps its content, but loses the floating-card collage. */
:is(.foundation-hero, .product-hero) {
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, .6fr); gap: 24px 56px;
  width: calc(100% - var(--page-pad) * 2); margin: 20px auto 0; min-height: 0;
  padding: clamp(28px, 4vw, 56px); background: var(--lh-product-stage);
}
:is(.foundation-hero, .product-hero) .hero-index { grid-column: 1 / -1; padding: 0; margin: 0; flex-direction: row; align-items: baseline; gap: 12px; }
:is(.foundation-hero, .product-hero) .hero-index::before { display: none; }
:is(.foundation-hero, .product-hero) .hero-index strong { font-size: 14px; color: var(--lh-product-selected); }
html[lang] :is(.foundation-hero, .product-hero) .hero-copy h1 { max-width: 16ch; font-size: clamp(40px, 5vw, 68px); line-height: 1.06; }
:is(.foundation-hero, .product-hero) .hero-lead { margin: 24px 0 16px; color: var(--lh-product-stage-muted); }
:is(.foundation-hero, .product-hero) .hero-map { display: block; padding: 0; border: 0; }
:is(.foundation-hero, .product-hero) .hero-map > p, :is(.foundation-hero, .product-hero) .hero-map li { color: var(--lh-product-stage-muted); }
:is(.foundation-hero, .product-hero) .hero-evidence { position: static; transform: none; grid-column: 1 / -1; width: auto; margin: 8px 0 0; padding: 0; background: transparent; color: var(--lh-product-stage-muted); box-shadow: none; }
:is(.foundation-hero, .product-hero) .hero-evidence span { color: var(--lh-product-selected); }
:is(.foundation-hero, .product-hero) .hero-evidence p { max-width: 80ch; font: 400 13px/1.6 var(--lh-font-sans); margin-top: 8px; }
/* Stage 00: a brief, a worked example and a measurement plan. */
.foundation-route h2 { margin: 20px 0 16px; font: 500 18px/1.3 var(--lh-font-sans); }
.foundation-route ol { display: grid; gap: 16px; }
.foundation-route .process-art { margin: 0 0 16px; }
.foundation-route .process-art > svg { height: 112px; }
.foundation-hero .hero-copy { align-self: center; }
.foundation-route li { display: grid; grid-template-columns: 24px minmax(0,1fr); gap: 12px; padding: 0; }
.foundation-route li strong { color: #fff; font-size: 15px; }
.foundation-route li p { margin: 4px 0 0; font: 400 13px/1.5 var(--lh-font-sans); }
.brief-ledger { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px 48px; margin: 0; }
.brief-ledger dt, .example-reasons dt { font: 500 12px/1.5 var(--lh-font-mono); color: var(--lh-case-ink-soft); }
.brief-ledger dd { margin: 8px 0 0; max-width: 40ch; font-size: clamp(20px,2vw,26px); line-height: 1.4; }
.example-context { display: flex; align-items: start; gap: 16px; max-width: 76ch; margin-bottom: 28px; }
.example-context > svg { width: 24px; height: 24px; flex: 0 0 24px; color: var(--lh-case-cobalt); }
.example-context h3 { font-size: 16px; margin: 0 0 8px; }
.example-context p { margin: 0; line-height: 1.6; }
.example-comparison { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.example-comparison article { padding: 32px; border-radius: var(--lh-radius-surface); background: var(--lh-color-white); color: var(--lh-product-ink); }
.example-comparison article:last-child { background: var(--lh-product-selected); color: var(--lh-product-selected-ink); }
.example-comparison h3 { margin: 0 0 24px; font-size: 16px; font-weight: 500; }
.example-comparison blockquote { margin: 0; font-size: clamp(22px,2.1vw,30px); line-height: 1.4; letter-spacing: -.02em; }
.example-comparison p { margin: 24px 0 0; font-size: 14px; line-height: 1.6; }
.example-reason-title { margin: 32px 0 20px; font-size: 22px; }
.example-reasons { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin: 0 0 28px; }
.example-reasons dd { margin: 8px 0 0; font-size: 15px; line-height: 1.6; }
.foundation-example .project-stage summary { grid-template-columns: 24px minmax(0,1fr) 20px; }
.foundation-example .stage-body { display: block; padding: 0 24px 24px; }
.foundation-example .stage-body p { margin: 0; max-width: 75ch; line-height: 1.6; }
.foundation-scenario { margin-top: 16px; }
.measurement-plan { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.measurement-plan li { display: grid; grid-template-columns: 32px minmax(0,1fr) minmax(0,1fr); gap: 24px; padding: 24px; border-radius: var(--lh-radius-surface); background: var(--lh-color-white); color: var(--lh-product-ink); }
.measurement-step { font: 500 12px/1.5 var(--lh-font-mono); color: var(--lh-case-ink-soft); }
.measurement-plan h3 { margin: 0 0 8px; font-size: 20px; }
.measurement-plan p { margin: 0; font-size: 15px; line-height: 1.6; }
.measurement-plan li > p { color: var(--lh-case-ink-soft); }
@media (max-width: 900px) {
  body[data-stage="00"] .foundation-hero .hero-map { display: block; }
  .brief-ledger, .example-comparison, .example-reasons { grid-template-columns: 1fr; gap: 24px; }
  .example-comparison article { padding: 24px; }
  .measurement-plan li { grid-template-columns: 24px minmax(0,1fr); gap: 12px; padding: 20px; }
  .measurement-plan li > p { grid-column: 2; }
}
.foundation-goal { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 24px; margin: 8px 0 0; padding: 24px 0 0; background: transparent; color: #fff; }
.foundation-goal > * { background: transparent; padding: 0; grid-template-columns: 24px 1fr; gap: 8px 12px; }
.foundation-goal span { color: var(--lh-product-stage-muted); font: 400 12px/1.5 var(--lh-font-sans); text-transform: none; letter-spacing: 0; }
.foundation-goal svg { color: var(--lh-product-selected); }
.foundation-goal strong { font-size: 15px; margin: 0; }
.gtm-brief-grid .gtm-primary { min-height: 0; padding: 32px; background: var(--lh-product-stage); }
.gtm-brief-grid .gtm-primary > svg { margin-bottom: 32px; }
.gtm-brief-grid .gtm-primary :is(p, span) { color: var(--lh-product-stage-muted); }
.gtm-brief-grid h3, .gtm-brief-grid article:not(.gtm-primary) h3 { margin-top: 16px; }
.conversion-panel { min-height: 0; padding: 32px; }
.conversion-panel h3, .layer-panel h3 { margin-top: 32px; font-size: clamp(28px, 3vw, 44px); }
.audience-panel > svg { margin-top: 24px; }
.audience-panel, .layer-panel { padding: 32px; }
.anatomy-layout { min-height: 0; }

/* One disclosure = one frame. Evidence and key/value pairs are unboxed. */
.project-stage { background: var(--lh-color-white); color: var(--lh-product-ink); }
/* Closed disclosures own both surface and ink, even inside dark sections. */
.project-stage:not([open]) :is(.stage-name small, .stage-number) { color: var(--lh-case-ink-soft); }
.project-stage:not([open]) .stage-state { background: transparent; color: var(--lh-case-ink-soft); }
.project-stage:not([open]) .stage-state.is-complete { color: var(--lh-case-mint); }
.project-stage:not([open]) .stage-state.is-next { color: var(--lh-case-coral); }
.project-stage[open], .accordion-paper .project-stage[open], .accordion-dark .project-stage[open] { background: var(--lh-product-sage); color: var(--lh-product-ink); }
.project-stage[open] :is(.stage-name small, .stage-body p, .stage-body dt) { color: #415951; }
.project-stage[open] .stage-state { background: transparent; color: #345c50; padding: 0; }
.stage-body { gap: 32px; padding: 8px 24px 28px; }
.stage-body h3 { max-width: 24ch; font-size: clamp(26px, 2.8vw, 36px); line-height: 1.15; }
.stage-body dl { gap: 20px; }
.stage-body dl div { padding: 0; background: transparent; }
.project-stage[open] .stage-body dd { color: var(--lh-product-ink); }
.project-stage .quote-evidence, .accordion-paper .project-stage[open] .quote-evidence, .accordion-dark .project-stage[open] .quote-evidence { padding: 0; background: transparent; color: var(--lh-product-ink); }
.stage-body .quote-evidence p { color: #415951; }
.accordion-inverse .project-stage[open] { background: var(--lh-product-sage); color: var(--lh-product-ink); }
.project-stage[open] .accordion-steps li { background: transparent; padding-inline: 0; border-radius: var(--lh-radius-inner); }
.project-stage[open] .stage-body > div > p { color: #415951; }
.accordion-dark .project-stage[open] .stage-state, .accordion-inverse .project-stage[open] .stage-state { background: transparent; color: #345c50; }
.audience-tabs button[aria-selected="true"]:hover, .conversion-steps button[aria-selected="true"]:hover { background: var(--lh-product-selected); color: var(--lh-product-selected-ink); }
.stage-body blockquote { font-size: 22px; }
.conversion-check, .audience-panel dl div { padding-inline: 0; background: transparent; }
.message-specimen { gap: 24px; }
.message-specimen p { padding: 0; background: transparent; min-height: 0; }
.strategy-matrix { background: transparent; gap: 8px; }
.strategy-matrix-head > *, .strategy-matrix-row > * { background: transparent; }
.strategy-matrix-head { background: var(--lh-product-sage); border-radius: var(--lh-radius-inner); }
.strategy-matrix-row { background: #fff; gap: 0; }
.audience-tabs button[aria-selected="true"], .conversion-steps button[aria-selected="true"],
.anatomy-tabs button[aria-selected="true"], .path-switch button.is-active, .evidence-filters button.is-active {
  background: var(--lh-product-selected); color: var(--lh-product-selected-ink); border-color: transparent;
}
.audience-tabs button[aria-selected="true"] span { color: var(--lh-product-selected-ink); }
.decision-section, .foundation-result, .audience-section, .paths-section, .method-section { border-radius: 0; }
.decision-grid h2, .foundation-result-grid h2 { font-size: clamp(34px, 4.5vw, 60px); line-height: 1.08; }

/* Product previews: remove the third and fourth nested frame. */
.mode-panel { padding: 0; background: transparent; gap: 40px; align-items: start; }
.sequence-card { padding: 24px; background: var(--lh-product-paper); border-radius: var(--lh-radius-surface); }
.sequence-head { padding: 0; font: 500 12px/1.5 var(--lh-font-sans); text-transform: none; letter-spacing: 0; }
.sequence-route { padding: 12px 0 20px; margin: 0; background: transparent; }
.sequence-row { background: transparent; padding: 14px 0; border-radius: var(--lh-radius-control); }
.sequence-row + .sequence-row { margin: 0; }
.review-list { background: transparent; padding: 0; }
.review-item { padding: 16px 0; background: transparent; }
.context-copy { background: transparent; padding: 0 24px 0 0; }
.logic-stack { background: var(--lh-product-paper); border-radius: var(--lh-radius-surface); padding: 24px; }
.logic-line, .logic-line.is-fallback { background: transparent; padding: 12px 0; }
.pl-hero::before { background-image: var(--lh-paper-grain); background-size: 560px; opacity: .32; }
.pl-hero, .review-section, .final-cta, .pl-footer { border-radius: 0; }
.template-preview { overflow: hidden; }
.pl-header, .site-header { backdrop-filter: none; background: var(--lh-product-paper); }

/* Procedural diagrams share one motion language. They are illustrations, not metrics. */
.process-art { --art-ink: #338183; --art-soft: #7ab5ae; margin: 24px 0 0; color: var(--art-ink); min-width: 0; }
.process-art svg { display: block; width: 100%; height: 164px; stroke: none; overflow: hidden; }
.process-art .art-route { fill: none; stroke: var(--art-ink); stroke-width: 1; opacity: .38; vector-effect: non-scaling-stroke; }
.process-art .art-signal { fill: none; stroke: var(--art-ink); stroke-width: 2; stroke-dasharray: 3 97; animation: art-transit 7s linear infinite; vector-effect: non-scaling-stroke; }
.process-art .art-node { fill: var(--art-soft); }
.process-art figcaption { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 12px; font: 400 12px/1.5 var(--lh-font-sans); color: inherit; }
.process-art button { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; border: 0; border-radius: var(--lh-radius-control); background: transparent; color: inherit; cursor: pointer; }
.process-art button svg { width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.8; }
.process-art.is-paused .art-signal, .process-art.is-idle .art-signal, html[data-art-hidden] .art-signal { animation-play-state: paused; }
.chapter-sample .process-art, :is(.foundation-hero, .product-hero) .process-art, .message-lab .process-art { --art-ink: #b0ddcf; --art-soft: #a1d6ce; }
.message-lab .process-art { margin: 0 0 20px; }
.message-lab .process-art svg { height: 96px; }
.message-lab .process-art button svg { height: 18px; }
.message-lab .process-art figcaption { display: flex; margin: 0; }
.message-lab .process-art figcaption > span { font-size: 11px; }
.review-summary .process-art, .final-cta .process-art { --art-ink: #376b5e; --art-soft: #77a99a; }
.final-cta .process-art { margin-top: 0; }
@keyframes art-transit { from { stroke-dashoffset: 100; } to { stroke-dashoffset: 0; } }

@media (max-width: 1080px) {
  :is(.foundation-hero, .product-hero) { gap: 24px 32px; }
  :is(.foundation-hero, .product-hero) .hero-map { display: block; }
  .chapter-hero { gap: 24px 32px; }
}
@media (max-width: 900px) {
  .section-heading { grid-template-columns: 1fr; gap: 16px; }
  .section-heading h2 { max-width: 24ch; font-size: 36px; }
  .chapter-hero, :is(.foundation-hero, .product-hero) { display: grid; grid-template-columns: 1fr; padding: 28px; margin-top: 12px; }
  .chapter-sample { grid-column: 1; }
  .chapter-sample .process-art svg { height: 150px; }
  :is(.foundation-hero, .product-hero) .hero-map { display: none; }
  .foundation-goal { grid-template-columns: 1fr; gap: 20px; padding-top: 16px; margin: 0; }
  :is(.foundation-hero, .product-hero) .hero-evidence { margin: 0; }
  :is(.foundation-hero, .product-hero) .hero-copy h1, html[lang] .chapter-hero h1 { font-size: 46px; }
  .mode-panel { gap: 28px; }
  .stage-body { grid-template-columns: 1fr; }
  .stage-body dl div { grid-template-columns: 108px 1fr; }
  .context-copy { padding: 0; }
}
@media (max-width: 560px) {
  .chapter-hero, :is(.foundation-hero, .product-hero) { padding: 24px; }
  html[lang] :is(.foundation-hero, .product-hero) .hero-copy h1, html[lang] .chapter-hero h1 { font-size: 34px; line-height: 1.12; overflow-wrap: anywhere; }
  .chapter-hero .hero-lead { font-size: 16px; }
  .chapter-hero .hero-index { flex-wrap: wrap; font-size: 10px; }
  .section-heading h2 { font-size: 30px; }
  .research-card, .sample-ledger > div, .case-overview-grid article { padding: 20px; }
  .research-grid, .sample-ledger, .case-overview-grid { gap: 12px; }
  .stage-body { padding: 8px 20px 24px; gap: 24px; }
  .stage-body dl div { grid-template-columns: 1fr; gap: 6px; }
  .project-stage summary { padding: 20px; }
  .sequence-card { padding: 20px; }
  .sequence-row { grid-template-columns: 36px minmax(0,1fr); padding: 12px 0; gap: 8px 12px; }
  .sequence-row small { grid-column: 2; }
  .sequence-route { padding-inline: 0; }
  .logic-stack { padding: 20px; }
  .process-art svg { height: 140px; }
  .gtm-brief-grid .gtm-primary, .audience-panel, .layer-panel, .conversion-panel { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .process-art .art-signal { animation: none; stroke-dashoffset: 35; }
  .process-art button { display: none; }
}
}