/* Mason research reports. Built 2026-11-09 to content/seo/DESIGN-BRIEF.md ("Research report").
   Three sources, each copied, not reinterpreted:
   1. Hero and overview: /case-studies/energy-software/ (case-layout.css, static.css).
   2. Findings sections: growth/partners/deck/deck.css, declarations verbatim, selectors scoped under .deck
      so the deck's bare h2/table/.stat rules cannot reach the site chrome or the hero.
   3. Colour: /Applications/mason-brand/tokens/tokens.css only. Deviations from the deck are listed at the end. */

@font-face{font-family:MasonEditorial;src:url('/assets/octolane-editorial.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:MasonMarist;src:url('/assets/lassie-marist.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:MasonDM;src:url('/assets/lassie-sans.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{
  --mason-paper:#f9f8f5;--mason-white:#fffdf7;--mason-ink:#292d29;--mason-heading:#28241d;--mason-body:#70685c;
  --mason-muted:#827a6d;--mason-line:#ddd9cb;--mason-sky:#c4e0f5;--mason-skyDeep:#63b0eb;--mason-pearl:#f6faf9;
  --mason-gold:#ffdf8f;--mason-sunlight:#fffbe6
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:24px}
body{margin:0;background:var(--mason-paper);color:var(--mason-ink);font:400 18px/1.6 MasonDM,Arial,sans-serif;-webkit-font-smoothing:antialiased}
main a{color:inherit;text-decoration-color:var(--mason-line);text-underline-offset:3px}
main a:hover{text-decoration-color:var(--mason-ink)}
main a:focus-visible{outline:2px solid var(--mason-ink);outline-offset:4px;border-radius:4px}
.num{font-variant-numeric:tabular-nums}

/* ===== 1. Hero and overview, from the case study ===== */
.wrap{max-width:1344px;margin-inline:auto;padding-inline:52px}
.eyebrow{display:flex;gap:13px;align-items:center;font-size:10px;letter-spacing:.1em;font-weight:400;color:var(--mason-muted);line-height:1.6;margin:0}
.case-cover{position:relative;isolation:isolate;overflow:hidden;margin:16px 16px 0;border-radius:24px;min-height:640px;display:flex;flex-direction:column;background:#e6eff4 url('/assets/case-cover-folds.png') center/cover}
.case-cover-light{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.case-cover-copy{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;flex:1;justify-content:center;padding:130px 30px 74px}
.case-cover h1{font:400 clamp(52px,5.3vw,76px)/1.065 MasonEditorial,Arial,sans-serif;letter-spacing:-.025em;max-width:22ch;color:var(--mason-ink);margin:25px 0 0;text-wrap:balance}
.cover-dek{font-size:18px;line-height:1.55;color:var(--mason-ink);max-width:46ch;margin:22px 0 0;text-wrap:balance}
.cover-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:32px}
.cover-link{display:inline-flex;gap:30px;align-items:center;text-decoration:none;font:400 13px/1.5 MasonDM;padding:11px 19px;color:var(--mason-white);background:var(--mason-heading);border:1px solid var(--mason-heading);border-radius:999px}
.cover-link:hover{background:#45423b}
.cover-link.outline{background:#fffdf7a8;color:var(--mason-heading);gap:12px}
.cover-link.outline:hover{background:var(--mason-white)}
.cover-link:focus-visible{outline:2px solid var(--mason-ink);outline-offset:3px}
.case-cover-foot{display:flex;justify-content:space-between;gap:22px;padding:0 34px 26px;color:var(--mason-body);font:400 10px/1.5 MasonDM;letter-spacing:.09em;text-transform:uppercase}

.report-top{padding-top:28px}
.post-crumbs{margin:0 0 30px;font-size:12px;color:var(--mason-body)}
.kpi-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 0 56px}
.kpi{background:var(--mason-white);border:1px solid var(--mason-line);border-radius:20px;padding:26px 26px 22px}
.kpi b{display:block;font:400 clamp(40px,4vw,56px)/1.05 MasonMarist,Georgia,serif;letter-spacing:-.03em;color:var(--mason-heading);margin:0 0 10px}
.kpi span{display:block;font-size:15px;line-height:1.45;color:var(--mason-body)}
.post-answer{max-width:760px;margin:0 auto 72px;font-size:20px;line-height:1.6;background:var(--mason-white);border:1px solid var(--mason-line);border-radius:20px;padding:26px 28px}
.case-overview{display:grid;grid-template-columns:1fr 1fr;gap:90px;padding:0 0 64px}
.case-overview .eyebrow{font-size:10px}
.case-company h2{font:400 42px/1.14 MasonMarist,Georgia,serif;letter-spacing:-.03em;color:var(--mason-heading);margin:21px 0 0}
.case-company>p:last-child{font-size:17px;line-height:1.65;color:var(--mason-body);max-width:40ch;margin:21px 0 0}
.case-brief{padding-left:42px;border-left:1px solid var(--mason-line)}
.case-brief h3{font:400 29px/1.2 MasonMarist,Georgia,serif;letter-spacing:-.025em;color:var(--mason-heading);margin:22px 0 0}
.case-brief>p:not(.eyebrow){font-size:17px;line-height:1.65;color:var(--mason-body);margin:20px 0 0;max-width:45ch}
.case-scope{display:flex;flex-wrap:wrap;gap:9px 16px;padding-top:18px;margin-top:24px;border-top:1px solid var(--mason-line);font:400 11px/1.6 MasonDM;color:var(--mason-body)}
.report-contents{border-top:1px solid var(--mason-line);padding:22px 0 64px}
.report-contents .eyebrow{margin-bottom:12px}
.report-contents ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 28px}
.report-contents a{display:flex;gap:10px;font-size:14px;line-height:1.45;color:var(--mason-ink);text-decoration:none}
.report-contents a span{font-size:10px;color:var(--mason-muted);padding-top:3px}
.report-contents a:hover{text-decoration:underline;text-underline-offset:4px}

/* ===== 2. Findings: growth/partners/deck/deck.css, scoped under .deck ===== */
.deck{
  --tint:#e3edf3;--blue-gray:#b4c7d3;--evidence-line:#d9e3e8;
  --editorial:MasonEditorial,Georgia,serif;--marist:MasonMarist,Georgia,serif;--dm:MasonDM,Arial,sans-serif;
  --cw:min(1240px,calc(100% - 96px));
  --fs-h1:clamp(46px,5.5vw,76px);--fs-h2:clamp(36px,4vw,60px);--fs-h3:26px;--fs-lead:19px;--fs-body:17px;
  --pad-top:64px;--pad-bottom:80px;--gap:48px
}
.deck h1,.deck h2,.deck h3,.deck p,.deck ul,.deck ol{margin:0}
.deck .slide{position:relative;display:flex;flex-direction:column;border-top:1px solid var(--mason-line);background:var(--mason-paper)}
.deck .frame{flex:1;width:var(--cw);margin:0 auto;padding:var(--pad-top) 0 var(--pad-bottom);display:flex;flex-direction:column;justify-content:center;gap:var(--gap)}
.deck h2{font:400 var(--fs-h2)/1.08 var(--marist);letter-spacing:-.03em;color:var(--mason-heading);max-width:18em;text-wrap:balance}
.deck h3{font:400 var(--fs-h3)/1.2 var(--marist);letter-spacing:-.02em;color:var(--mason-heading);text-wrap:balance}
.deck .lead{font-size:var(--fs-lead);line-height:1.6;color:var(--mason-body);max-width:38em;margin-top:20px;text-wrap:pretty}
.deck .lead+.lead{margin-top:16px}
.deck .eyebrow{display:flex;align-items:center;gap:12px;font:400 11px/1.5 var(--dm);letter-spacing:.1em;text-transform:uppercase;color:var(--mason-muted);margin-bottom:20px}
.deck .label{font:400 11px/1.4 var(--dm);letter-spacing:.1em;text-transform:uppercase;color:var(--mason-body)}
.deck .small{font-size:14px;line-height:1.55;color:var(--mason-muted)}
.deck .daylight{background:var(--mason-pearl) url('/assets/case-cover-folds.png') center/cover no-repeat}
.deck .thesis{background:radial-gradient(ellipse at 6% 0%,#c2dce677,transparent 55%),radial-gradient(ellipse at 100% 95%,#e9c5a577,transparent 55%),linear-gradient(135deg,#fffdf7,#f6faf9 62%,#f8eddf)}
.deck .panel{background:var(--mason-white);border:1px solid var(--mason-line);border-radius:24px;padding:32px;display:flex;flex-direction:column;gap:14px}
.deck .panel p{font-size:var(--fs-body);line-height:1.6;color:var(--mason-body)}
.deck .panel.evidence{background:linear-gradient(135deg,#fffdf7,#f6faf9);border-color:var(--evidence-line)}
.deck .panel-top{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:26px}
.deck .chip{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;background:var(--tint);color:var(--mason-ink);font:400 11px/1 var(--dm);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.deck .stat{font:400 60px/1 var(--marist);letter-spacing:-.03em;color:var(--mason-heading)}
.deck .stat.ghost{color:var(--mason-line)}
.deck .btn{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:12px 22px;border-radius:14px;background:#29251f;color:#fffdf7;text-decoration:none;font-size:15px}
.deck .plain{font-size:15px;color:var(--mason-body)}
.deck .hero-copy{max-width:900px}
.deck .hero-copy .lead{max-width:32em;margin-top:28px;color:var(--mason-ink)}
.deck .cta{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:36px}
.deck .split{display:grid;grid-template-columns:1fr 1.1fr;gap:64px;align-items:center}
.deck .rows{display:grid;gap:40px}
.deck .rows.c4{grid-template-columns:repeat(4,1fr);gap:32px}
.deck .row{border-top:1px solid var(--mason-line);padding-top:24px}
.deck .rn{font-size:13px;color:var(--mason-muted);margin-bottom:28px;font-variant-numeric:tabular-nums}
.deck .row h3{margin-bottom:12px}
.deck .row p{font-size:var(--fs-body);line-height:1.6;color:var(--mason-body)}
.deck .rows.c4 h3{font-size:23px}
.deck .rows.c1{grid-template-columns:1fr;gap:0;margin-top:28px}
.deck .rows.c1 .row{display:grid;grid-template-columns:44px 1fr;column-gap:12px;padding:18px 0 20px}
.deck .rows.c1 .rn{grid-row:1/3;margin:6px 0 0}
.deck .rows.c1 h3{font-size:22px;margin-bottom:6px}
.deck .rows.c1 p{font-size:calc(var(--fs-body) - 1px)}
.deck .ba{display:grid;grid-template-columns:1fr 1.15fr;gap:56px;align-items:start}
.deck .ba-col{display:flex;flex-direction:column;gap:14px}
.deck .ba-col .label{margin-bottom:4px}
.deck .ba-col p{font-size:var(--fs-body);line-height:1.6;color:var(--mason-body)}
.deck .ba-col.before{padding-top:33px}
.deck .ba-col.after p{color:var(--mason-ink)}
.deck .ba-col.after{background:radial-gradient(ellipse at 100% 0%,#ffdf8f45,transparent 55%),radial-gradient(ellipse at 0% 100%,#c4e0f599,transparent 60%),linear-gradient(135deg,#fffdf7,#f6faf9);border-color:var(--mason-sky)}
.deck .ba-col.after .label{color:var(--mason-ink)}
.deck p.ok{position:relative;padding-left:32px}
.deck p.ok::before{content:"";position:absolute;left:0;top:calc(.8em - 10px);width:20px;height:20px;border-radius:50%;background:var(--mason-sky)}
.deck p.ok::after{content:"";position:absolute;left:7.5px;top:calc(.8em - 6px);width:4.5px;height:9px;border:solid var(--mason-ink);border-width:0 1.6px 1.6px 0;transform:rotate(45deg)}
.deck .duo{display:grid;grid-template-columns:1fr 1px 1fr;gap:56px}
.deck .duo-rule{background:var(--mason-line)}
.deck .duo-col{display:flex;flex-direction:column;gap:16px}
.deck .duo-col h3{font-size:30px}
.deck .ticks{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px}
.deck .ticks li{position:relative;padding-left:20px;font-size:var(--fs-body);line-height:1.5;color:var(--mason-ink)}
.deck .ticks li::before{content:"";position:absolute;left:2px;top:.6em;width:5px;height:5px;border-radius:50%;background:var(--mason-muted)}
.deck .tl{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:36px}
.deck .tl::before{content:"";position:absolute;left:0;right:0;top:6px;height:1px;background:var(--mason-line)}
.deck .tl-step i{position:relative;display:block;width:13px;height:13px;border-radius:50%;background:var(--mason-paper);border:1px solid var(--blue-gray);margin-bottom:26px}
.deck .tl-step.on i{background:var(--mason-ink);border-color:var(--mason-ink)}
.deck .tl-step .label{margin-bottom:12px}
.deck .tl-step p{font:400 24px/1.3 var(--marist);letter-spacing:-.015em;color:var(--mason-heading);max-width:13em}
.deck .cap{font:400 11px/1.4 var(--dm);letter-spacing:.1em;text-transform:uppercase;color:var(--mason-muted);margin-top:8px}
.deck .quote .big{font:400 28px/1.3 var(--marist);letter-spacing:-.02em;color:var(--mason-heading)}
.deck .pair{display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:18px}
.deck .pair p{font-size:15px;margin-top:10px}
.deck .pair .stat{font-size:52px}
.deck .arrow{font-size:24px;color:var(--mason-muted);padding-top:14px}
.deck .tablecard{padding:8px 32px}
.deck table{width:100%;border-collapse:collapse;font-size:18px}
.deck th{text-align:left;font:400 11px/1.4 var(--dm);letter-spacing:.1em;text-transform:uppercase;color:var(--mason-body);padding:22px 12px 18px 0}
.deck td{padding:20px 12px 20px 0;border-top:1px solid var(--mason-line);color:var(--mason-ink)}

/* ===== 3. Adaptations for a web article (each one deliberate) ===== */
/* A page is not slides: no full-height sections. */
.deck .slide{min-height:auto}
/* Brief: no blue dots. The deck's sky check disc and blue-gray timeline node become ink and line. */
.deck p.ok::before{background:transparent;border:1px solid var(--mason-ink)}
.deck .tl-step i{border-color:var(--mason-line)}
/* Brief: chips are a quiet tint, never colour in text; tint kept as the deck's evidence highlight background. */
.deck .chip{margin-left:8px;vertical-align:2px;color:var(--mason-body)}
/* The deck's 240px data columns are for 16:9 slides; here the event column takes the room. */
.deck th:nth-child(n+2),.deck td:nth-child(n+2){width:auto}
.deck td.num,.deck th:last-child{white-space:nowrap}
.deck td.num{font-variant-numeric:tabular-nums}
.deck table{font-size:16px}
.deck td{padding:14px 16px 14px 0}
.deck .tablecard .cap{margin:20px 0 0}
.deck .studies td .small{display:block;margin-top:2px}
.deck .split.top{align-items:start}
.deck .pair{margin-top:36px;max-width:520px}
.deck .caution{margin-top:28px;max-width:44ch}
.deck .quote{max-width:820px}
.deck .quote .lead{margin-top:14px}
.deck .intro .lead{margin-top:14px}
.deck .steps ol{list-style:none;padding:0;margin-top:4px}
.deck .steps .row:first-child{border-top:0}
.deck .steps .rows.c1 .rn{grid-row:auto}
.deck .k-close .frame{min-height:520px}
/* The close repeats the deck's h1 look on an h2, so the page keeps one h1. */
.deck .close-title{font:400 var(--fs-h1)/1.06 var(--editorial);letter-spacing:-.018em;color:var(--mason-heading);max-width:13em}
.deck .k-close .lead a,.deck .k-close .plain{text-decoration-color:var(--mason-body)}

/* ===== Responsive: case study breakpoints, then the deck's ===== */
@media(min-width:1100px) and (max-height:950px){
  .deck{--fs-h2:clamp(38px,3.55vw,54px);--pad-top:40px;--pad-bottom:56px;--gap:36px}
}
@media(min-width:1101px) and (max-height:800px){
  .case-cover{min-height:540px}.case-cover-copy{padding-top:111px;padding-bottom:48px}.case-cover h1{font-size:62px;margin-top:20px}
}
@media(max-width:1100px){
  .wrap{padding-inline:36px}
  .case-cover{min-height:610px}.case-cover h1{font-size:64px}
  .case-overview{gap:45px}.case-brief{padding-left:30px}
  .report-contents ol{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1099px){
  .deck{--cw:calc(100% - 64px)}
  .deck .split,.deck .ba{grid-template-columns:1fr;gap:40px}
  .deck .rows.c4,.deck .tl{grid-template-columns:repeat(2,1fr)}
  .deck .tl::before{display:none}
  .deck .ba-col.before{padding-top:0}
  .deck .rn{margin-bottom:16px}
}
@media(max-width:760px){
  .case-cover{margin:10px 10px 0;border-radius:18px;min-height:570px}
  .case-cover-copy{padding:125px 21px 75px}
  .case-cover h1{font-size:50px}
  .cover-dek{font-size:16px}
  .case-cover-foot{padding:0 22px 22px}
  .kpi-row{grid-template-columns:1fr}
  .post-answer{font-size:18px;padding:20px}
  .case-overview{grid-template-columns:1fr;gap:33px;padding-bottom:45px}
  .case-company h2{font-size:36px}
  .case-company h2 br,.case-brief h3 br{display:none}
  .case-brief{border-left:0;border-top:1px solid var(--mason-line);padding:29px 0 0}
  .deck{--cw:calc(100% - 40px);--fs-h1:clamp(40px,10.5vw,58px);--fs-h2:clamp(34px,9.5vw,46px);--fs-h3:24px;--fs-lead:17px;--fs-body:17px;--pad-top:40px;--pad-bottom:56px;--gap:32px}
  .deck .rows.c4,.deck .tl,.deck .duo{grid-template-columns:1fr}
  .deck .duo-rule{height:1px}
  .deck .panel{padding:24px;border-radius:20px}
  .deck .stat{font-size:48px}
  .deck .pair .stat{font-size:40px}
  .deck .tablecard{padding:4px 18px}
  .deck table{font-size:15px}
  .deck th{font-size:10px;letter-spacing:.06em}
  .deck td{padding:12px 10px 12px 0}
  .deck td:first-child .chip{display:flex;width:max-content;margin:6px 0 0}
  .deck .quote .big{font-size:24px}
  .deck .tl-step p{font-size:21px}
  .deck .tl{gap:0}
  .deck .tl-step{border-left:1px solid var(--mason-line);padding:0 0 28px 22px}
  .deck .tl-step.on{border-left-color:var(--mason-ink)}
  .deck .tl-step i{display:none}
  .deck .k-close .frame{min-height:440px}
}
@media(max-width:480px){
  .wrap{padding-inline:20px}
  .case-cover{min-height:525px}
  .case-cover-copy{padding:112px 18px 57px}
  .case-cover h1{font-size:43px;line-height:1.08;letter-spacing:-.03em;max-width:16ch;margin-top:23px}
  .case-cover h1 br{display:none}
  .case-cover-copy>.case-industry-pill{max-width:none;white-space:nowrap;font-size:11px}
  .cover-link{font-size:12px;padding:11px 17px;gap:18px}
  .case-cover-foot{font-size:8px;padding-inline:20px}
  .report-contents ol{grid-template-columns:1fr}
  .deck .pair{gap:12px}
  .deck .pair .stat{font-size:34px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Grid children may shrink below their content width (phones); a table scrolls inside its panel, never the page. */
.deck .split>*,.deck .ba>*,.deck .duo>*,.deck .rows>*,.deck .tl>*{min-width:0}
.deck .tablecard{overflow-x:auto}
/* Review fixes 2026-11-09: a comparison number must stay readable; short side columns stay in view on desktop. */
.deck .stat.ghost{color:var(--mason-muted)}
@media(min-width:1100px) and (min-height:860px){.deck .split.top>.panel,#worksheet .split.top>:first-child{position:sticky;top:24px}}
.deck .slide .intro+.duo{margin-top:-24px}
/* Composition fix 2026-11-09: each stat pair sits beside its heading; the comparison table takes the full width below. */
.deck .split.head{align-items:end}
.deck .split.head .pair{margin-top:0;max-width:none}
.deck .split.head .pair .stat{font-size:64px}
.deck .split.head .caution{margin-top:24px}
.deck .tablecard.wide th:nth-child(n+2),.deck .tablecard.wide td:nth-child(n+2){width:200px}
@media(max-width:1099px){.deck .split.head .pair .stat{font-size:52px}}
@media(max-width:760px){.deck .tablecard.wide th:nth-child(n+2),.deck .tablecard.wide td:nth-child(n+2){width:auto}.deck .split.head .pair .stat{font-size:40px}}
@media(max-width:480px){.deck .split.head .pair .stat{font-size:34px}}
/* Research hub: a short daylight band (DESIGN-BRIEF: hubs and glossary use a band, not the full report hero). */
.case-cover.band{min-height:380px}
.case-cover.band .case-cover-copy{padding:120px 30px 56px}
.case-cover.band h1{font-size:clamp(46px,5vw,68px)}
.deck .rows.c3{grid-template-columns:repeat(3,1fr)}
.deck .report-card{display:grid;grid-template-columns:1.25fr 1fr;gap:48px;align-items:center;padding:40px}
.deck .report-card h3{font-size:36px;line-height:1.12;margin:10px 0 14px}
.deck .report-card h3 a{text-decoration:none}
.deck .report-card h3 a:hover{text-decoration:underline;text-decoration-color:var(--mason-line);text-underline-offset:6px}
.deck .report-card .small{margin-top:4px}
.deck .report-card .cta{margin-top:20px}
.deck .report-card-stats{margin:0;display:grid;gap:0}
.deck .report-card-stats>div{display:grid;grid-template-columns:150px 1fr;gap:18px;align-items:baseline;padding:16px 0;border-top:1px solid var(--mason-line)}
.deck .report-card-stats>div:first-child{border-top:0}
.deck .report-card-stats .stat{font-size:40px}
.deck .report-card-stats dd{margin:0;font-size:15px;line-height:1.45;color:var(--mason-body)}
@media(max-width:1099px){.deck .rows.c3{grid-template-columns:1fr}.deck .report-card{grid-template-columns:1fr;gap:28px}}
@media(max-width:760px){.case-cover.band{min-height:320px}.case-cover.band h1{font-size:44px}.deck .report-card{padding:24px}.deck .report-card h3{font-size:28px}.deck .report-card-stats>div{grid-template-columns:110px 1fr}.deck .report-card-stats .stat{font-size:32px}}
/* .panel p (17px) outranks .label/.small inside a panel; restore their sizes on the report card. */
.deck .report-card p.label{font-size:11px;line-height:1.4;color:var(--mason-body)}
.deck .report-card p.small{font-size:14px;line-height:1.55;color:var(--mason-muted)}
/* P1 context line under the stat strip; hub report cards stacked with a gap. */
.kpi-note{max-width:760px;margin:-32px auto 40px;font-size:15px;line-height:1.6;color:var(--mason-body)}
.deck .report-card+.report-card{margin-top:24px}
.deck th.wraps{white-space:normal}
/* The moves table: the example column carries the reading, so it gets the room. */
.deck .tablecard.moves th:nth-child(1),.deck .tablecard.moves td:nth-child(1){width:30%}
.deck .tablecard.moves th:nth-child(2),.deck .tablecard.moves td:nth-child(2){width:110px}
.deck .tablecard.moves th:nth-child(3),.deck .tablecard.moves td:nth-child(3){width:auto}
.deck .arrow.and{font-size:15px;padding-top:24px}
@media(max-width:760px){.deck .tablecard.moves th:nth-child(1),.deck .tablecard.moves td:nth-child(1){width:auto}.deck .tablecard.moves th:nth-child(2),.deck .tablecard.moves td:nth-child(2){width:64px}}
/* P3 records table: name, what it dates, what one run got. */
.deck .tablecard.records th:nth-child(1),.deck .tablecard.records td:nth-child(1){width:30%}
.deck .tablecard.records th:nth-child(2),.deck .tablecard.records td:nth-child(2){width:22%}
.deck .tablecard.records th:nth-child(3),.deck .tablecard.records td:nth-child(3){width:auto}
@media(max-width:760px){.deck .tablecard.records th:nth-child(n),.deck .tablecard.records td:nth-child(n){width:auto}}
/* P2 stack table: tool, a share bar, then the company count. The bar is the ad share of 293. */
.deck .tablecard.stack th:nth-child(1),.deck .tablecard.stack td:nth-child(1){width:auto}
.deck .tablecard.stack th:nth-child(2),.deck .tablecard.stack td:nth-child(2){width:46%}
.deck .tablecard.stack th:nth-child(3),.deck .tablecard.stack td:nth-child(3){width:120px}
.deck .share{display:flex;align-items:center;gap:14px}
.deck .share b{font-weight:400;min-width:52px;font-variant-numeric:tabular-nums}
.deck .share i{display:block;flex:1;height:6px;border-radius:3px;background:linear-gradient(90deg,var(--mason-ink) var(--w),var(--mason-line) var(--w))}
.deck tr.group td{color:var(--mason-muted);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding-top:22px}
@media(max-width:760px){.deck .tablecard.stack th:nth-child(2),.deck .tablecard.stack td:nth-child(2){width:34%}.deck .tablecard.stack th:nth-child(3),.deck .tablecard.stack td:nth-child(3){width:58px}.deck .tablecard.stack td{padding-right:8px}.deck .share{gap:8px}.deck .share b{min-width:30px}}
.deck .stack-note{margin:22px 0 0;font-size:15px;line-height:1.6;color:var(--mason-body);max-width:68ch}
.deck td .ex{display:block;font-size:13px;line-height:1.45;color:var(--mason-muted);margin-top:2px}
/* ===== Alignment: one page column for every block (2026-11-09) =====
   The column is the deck's --cw: min(1240px, 100% - 96px); 100% - 64px at <=1099; 100% - 40px at <=760.
   .wrap (crumbs, stat cards, answer, overview, contents) now uses the same width instead of its own
   1344px max-width and 52/36/20px padding, which sat 4px inside the deck column between 761 and 1335.
   The hero foot sits inside the cover, which is inset 16px (10px at <=760) from the page, so its
   100% is the cover width (page - 32px): the inset that puts its labels on the column is
   (100% - min(1240px, 100% - 64px)) / 2 wide, 16px at <=1099 ((page-32)-(page-64))/2, and 10px at
   <=760 ((page-20)-(page-40))/2. */
.wrap{max-width:none;width:min(1240px,calc(100% - 96px));padding-inline:0;box-sizing:border-box}
.case-cover-foot{align-items:baseline;padding-left:calc((100% - min(1240px,calc(100% - 64px)))/2);padding-right:calc((100% - min(1240px,calc(100% - 64px)))/2)}
@media(max-width:1099px){.wrap{width:calc(100% - 64px)}.case-cover-foot{padding-left:16px;padding-right:16px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.case-cover-foot{padding-left:10px;padding-right:10px}}
/* Hero pill on phones. Bug: research.css loads before site-chrome.css, so site-chrome's
   `.case-cover-copy>.case-industry-pill{max-width:30ch}` (<=760) beat our max-width:none and boxed the pill
   narrower than its nowrap text (221 to 237px of text, past the border at 360 to 430). One more class of
   specificity lets the pill use the cover's full text column: every current pill fits on one line at 360,
   and a longer one wraps to balanced, centred lines instead of overflowing. */
@media(max-width:480px){.case-cover .case-cover-copy>.case-industry-pill{white-space:normal;max-width:100%;text-align:center;text-wrap:balance}}
/* ===== Two-column splits are top-aligned (2026-11-09) =====
   deck.css centres .split (align-items:center), .split.head bottom-aligned its stat pair (end) and the hub's
   .report-card centred its two columns, so stats floated 50 to 190px below the heading they belong to.
   Now every side-by-side split starts at the top:
   - .split.head: the stat pair starts level with the h2, i.e. below the eyebrow block
     (.deck .eyebrow is 11px/1.5 with a 20px bottom margin, so the pair is pushed down 11px*1.5 + 20px).
   - .split.top: the left eyebrow's centre line matches the panel label's (panel padding 32px + 1px border,
     then a 26px panel-top row with the label centred at 13px; the eyebrow is 11px/1.5, so half of 16.5px).
   - .split.head targets the right column itself (>:last-child), which is a .pair or a wrapper around one.
   - .report-card: copy and stats both start at the card's top edge; the first stat row loses its 16px top pad.
   Offsets apply only while the columns sit side by side (>=1100px); below that they stack. */
.deck .split,.deck .split.head,.deck .report-card{align-items:start}
@media(min-width:1100px){
  .deck .split.head>:last-child{padding-top:calc(11px * 1.5 + 20px)}
  .deck .split.top>:first-child{padding-top:calc(33px + 13px - 11px * 1.5 / 2)}
}
.deck .report-card-stats>div:first-child{padding-top:0}
