/* 04.11.2026: the reading layout approved on SEE MO, shared by STADION, Admin Kostaff,
   DIRFT and «Надёжный подрядчик» (owner). Generated from case-see-mo.css; SEE MO keeps
   its own file. Grid: chapter title left (sticky), story right; wider chapter list;
   «Как была выстроена работа» as the FLOW ladder; «Что взял в решение» card;
   moodboard strip; result composition. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-outcome-composition .case-results strong{font-size:var(--reading-h2);line-height:var(--reading-h2-line);font-weight:500;text-wrap:balance}
/* 03.11.2026 v27: the outcome ends with its composition (no media after it), so the
   chapter keeps STADION's 63 px bottom padding without the composition's 56 px gap. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) #outcome>.case-outcome-composition:last-child{margin-bottom:0}
/* Body copy fills the right column; balancing is kept for headings only. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-reading-content :is(p,figcaption,dd){text-wrap-style:pretty}
/* 04.11.2026: more air between the content and the vertical rails (owner). */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation{--reading-inset:64px}
@media(min-width:1600px){.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation{--reading-inset:80px}}
@media(max-width:1199.98px){.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation{--reading-inset:40px}}
@media(max-width:809.98px){.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation{--reading-inset:16px}}
/* 04.11.2026 v34 — one reading line (Magwai «Клиника Фомина» / Eated):
   left column = chapter title only (sticky, two lines), right column = the whole
   story in order: lead → text → subsections → panels. One 5/7 split for openings,
   text+screen features, UI kit and gallery headings; wider chapter navigation. */
@media(min-width:1100px){
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation{--reading-side:216px}
/* The chapter list sits centred in its column: equal air left and right. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .case-reading-sidebar{padding-inline:0}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-toc nav{width:max-content;margin-inline:auto}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-toc a{padding-left:0;font-size:15px;line-height:22px;min-height:36px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-toc a[aria-current=location]::before{left:-14px;top:7px;height:22px}
}
@media(min-width:810px){
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) :is(.case-context-spread,.case-research-opening,.case-architecture-opening,.case-interface-opening,.case-process){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--reading-gap);row-gap:32px;align-items:start}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) :is(.case-context-origin,.case-research-introduction,.case-research-opening .case-chapter-heading,.case-architecture-opening .case-chapter-heading,.case-interface-opening .case-chapter-heading,.case-process-heading){display:contents}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) :is(.case-context-spread,.case-research-opening,.case-architecture-opening,.case-interface-opening,.case-process)>*{grid-column:2}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) :is(.case-context-origin>h2,.case-research-opening h2,.case-architecture-opening h2,.case-interface-opening h2,.case-process-heading>h3){grid-column:1;grid-row:1 / span 3;align-self:start;position:sticky;top:calc(var(--case-header-height) + 32px);margin:0;max-width:9.5em;text-wrap:balance}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) :is(.case-context-origin>.case-copy-body,.case-research-opening .case-chapter-heading>p,.case-architecture-opening .case-chapter-heading>p,.case-interface-opening .case-chapter-heading>p,.case-process-heading>p){grid-column:2;grid-row:1;margin:0;max-width:none}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) :is(.case-context-aside,.case-research-narrative,.case-architecture-opening>.case-compact-stack,.case-interface-opening>.case-copy,.case-process ol){grid-column:2;grid-row:2;max-width:none;margin:0}
/* Lead: the first sentence of every chapter, dark and slightly larger. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation :is(.case-context-origin>.case-copy-body>p:first-child,.case-research-opening .case-chapter-heading>p,.case-architecture-opening .case-chapter-heading>p,.case-interface-opening .case-chapter-heading>p,.case-process-heading>p){font:500 20px/30px var(--font-body);color:var(--color-text);text-wrap:pretty}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .case-context-origin>.case-copy-body>p:first-child{margin-bottom:16px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-process.case-process ol{grid-column:1 / -1;grid-row:2;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:24px}
/* One body size in the right column, below the lead. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation :is(.case-context-origin>.case-copy-body>p+p,.case-context-aside .case-copy-body p,.case-research-narrative p,.case-architecture-opening .case-copy-body p,.case-interface-opening .case-copy-body p){font-size:16px;line-height:26px}
/* The same split for every other two-column block. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation :is(.case-feature:not(.case-feature--wide),.case-system-layout){grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation :is(.case-feature--wide .case-copy,.case-reading-block>.case-copy,.case-reel-heading){grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:var(--reading-gap)}
}
/* 04.11.2026 v35: one half/half grid for all text, pairs and competitor cards
   (same gap), so right-column text starts on the right image's edge.
   Text + screen features and the UI kit keep the wider screen (5/7). */
@media(min-width:810px){
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation :is(.case-media-pair,.case-competitors){column-gap:var(--reading-gap)}
}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-competitor-card header p{text-wrap-style:pretty}
/* 04.11.2026 v36 — «Как была выстроена работа»: лестница этапов по образцу FLOW.
   Заголовок слева, лид справа по нижнему краю заголовка; строка «Процесс / Срок»;
   колонки с тонкими линиями, каждая следующая ниже на шаг; проценты и оранжевая
   полоса стоят на своей ступени независимо от длины текста. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--reading-gap)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-head{display:contents}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .fl-head>h3{grid-column:1;margin:0;max-width:9.5em;font:500 var(--reading-h2)/var(--reading-h2-line) var(--font-display);letter-spacing:-.02em;text-transform:uppercase;text-wrap:balance}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .fl-head>p{grid-column:2;align-self:end;margin:0;max-width:30em;font:400 16px/24px var(--font-body);color:inherit;text-wrap:pretty}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-meta{grid-column:1/-1;display:flex;justify-content:space-between;gap:16px;margin-top:72px;padding-bottom:12px;font:400 13px/18px var(--font-body);color:var(--color-muted)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-meta b{font-weight:600;color:var(--color-text,currentColor)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-cols{--fl-step:64px;grid-column:1/-1;list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));border-left:1px solid var(--reading-card-border)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-cols li{position:relative;display:flex;flex-direction:column;box-sizing:border-box;min-height:calc(284px + (var(--n) - 1) * var(--fl-step));padding:calc(24px + var(--k) * var(--fl-step)) 18px 56px;border-right:1px solid var(--reading-card-border)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .fl-cols h4{margin:0;font:600 24px/28px var(--font-display);text-transform:uppercase;letter-spacing:-.01em}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .fl-cols p{margin:10px 0 0;font:400 14px/20px var(--font-body);color:var(--color-muted);text-wrap:pretty}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-pct{position:absolute;left:18px;top:calc(24px + var(--k) * var(--fl-step) + 170px);font:500 12px/16px var(--font-body)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-bar{position:absolute;left:18px;right:18px;top:calc(24px + var(--k) * var(--fl-step) + 194px);height:5px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-bar>span{display:block;height:100%;border-radius:3px;background:var(--color-accent)}
@media(max-width:1099.98px){
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-cols{--fl-step:48px}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .fl-cols h4{font-size:20px;line-height:24px}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-cols li{padding-inline:14px}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-pct{left:14px}.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-bar{left:14px;right:14px}
}
@media(max-width:809.98px){
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl{grid-template-columns:minmax(0,1fr);row-gap:12px}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .fl-head>p{grid-column:1}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-cols{margin-top:24px}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-cols{grid-template-columns:minmax(0,1fr);border-left:0;border-top:1px solid var(--reading-card-border)}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-cols li{min-height:0;padding:20px 0 24px;border-right:0;border-bottom:1px solid var(--reading-card-border)}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-pct,.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-bar{position:static}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-pct{margin-top:16px}.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-bar{margin-top:8px}
}

/* v36 motion: when the block enters the viewport, columns appear one by one,
   the orange bar grows and the percent counts up (case-unified.js). Without JS
   or with reduced motion the final state is shown. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl.is-armed .fl-cols li>*{opacity:0;transform:translateY(14px)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl.is-armed .fl-bar>span{transform:scaleX(0);transform-origin:left}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl.is-armed .fl-cols li.is-in>*{opacity:1;transform:none;transition:opacity .5s ease,transform .5s ease}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl.is-armed .fl-cols li.is-in .fl-bar{transform:none}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl.is-armed .fl-cols li.is-in .fl-bar>span{transform:scaleX(1);transition:transform .9s cubic-bezier(.2,.7,.2,1) .25s}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl.is-armed .fl-cols li.is-in>p{transition-delay:.08s}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl.is-armed .fl-cols li.is-in>.fl-pct{transition-delay:.2s}
@media(prefers-reduced-motion:reduce){.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl.is-armed .fl-cols li>*,.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl.is-armed .fl-bar>span{opacity:1;transform:none;transition:none}}
/* 04.11.2026: «Что взял в решение» in the case's own style — the two-column grid,
   subheading weight 500 26/32 like other blocks, muted meta on the right column,
   hairline rows, no grey pill and no inner offset. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--reading-gap);align-items:center;width:100%;padding:28px 0;box-sizing:border-box;text-align:left;cursor:pointer;border-top:1px solid var(--reading-card-border);border-bottom:0}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-company{grid-column:1;font:500 var(--reading-h3)/var(--reading-h3-line) var(--font-display);letter-spacing:-.01em;transition:color .2s}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-meta{grid-column:2;grid-row:1;justify-self:start}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-plus{grid-column:2;grid-row:1;justify-self:end;position:relative;inset:auto;transform:none}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger:is(:hover,:focus-visible) .career-company{color:var(--color-accent)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger:is(:hover,:focus-visible) .career-plus{border-color:#ff6a00;background:#ff6a00;color:#fff}
/* Meta as an outlined button (grey hairline), as the owner asked. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-meta{background:transparent;box-shadow:inset 0 0 0 1px var(--reading-card-border);transition:color .18s ease,box-shadow .18s ease}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger:is(:hover,:focus-visible) .career-meta{color:#ff6a00;box-shadow:inset 0 0 0 1px #ff6a00}
@media(max-width:809.98px){
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger{grid-template-columns:minmax(0,1fr) auto;row-gap:6px;padding:22px 0}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-company{grid-column:1;grid-row:1}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-meta{grid-column:1;grid-row:2;justify-self:start}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-plus{grid-column:2;grid-row:1 / span 2;align-self:center}
}
/* 04.11.2026: «Что взял в решение» as a grey card like the competitor cards;
   the meta pill and the plus sit on white (paper) inside it. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger{background:var(--case-soft);border:1px solid var(--case-line);border-radius:20px;padding:16px 16px 16px 24px;min-height:0;margin-top:24px!important}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-meta{background:var(--case-bg);box-shadow:none;justify-self:end;margin:0 56px 0 0}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-plus{background:var(--case-bg)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger:is(:hover,:focus-visible) .career-meta{box-shadow:none}
@media(max-width:809.98px){.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger{padding:16px 16px 16px 20px;margin-top:16px!important}}
/* 04.11.2026 variant B (owner): one white button «4 вывода для продукта +» on the right. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger{grid-template-columns:minmax(0,1fr) auto}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-plus{display:none}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-meta{grid-column:2;grid-row:1;justify-self:end;margin:0;display:inline-flex;align-items:center;gap:12px;padding:10px 10px 10px 18px;border-radius:999px;font:500 14px/20px var(--font-body);color:var(--color-text,inherit)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-meta{transition:background-color .18s ease,color .18s ease}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-meta::after{content:'';flex:none;width:28px;height:28px;border-radius:50%;color:#fff;background:linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,linear-gradient(currentColor,currentColor) center/2px 12px no-repeat,#ff6a00}
/* Hover: title orange, button orange with white text, white circle with orange plus. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger:is(:hover,:focus-visible) .career-company{color:#ff6a00}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger:is(:hover,:focus-visible) .career-meta{background:#ff6a00;color:#fff}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger:is(:hover,:focus-visible) .career-meta::after{color:#ff6a00;background:linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,linear-gradient(currentColor,currentColor) center/2px 12px no-repeat,#fff}
/* Dialog as the homepage «Опыт» panel: orange label, 600 titles, no rules, orange cross. */
body:has(.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"])) .case-analysis-dialog .career-dialog-close{width:40px;height:40px;color:#ff6a00}
body:has(.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"])) .case-analysis-dialog .career-scrollbar-thumb{border:0}

@media(max-width:809.98px){
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger{grid-template-columns:minmax(0,1fr);row-gap:12px}
 .case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-analysis-trigger .career-meta{grid-column:1;grid-row:2;justify-self:start}
}

/* Analysis dialog = homepage «Опыт» panel: label, title, intro, then one section
   «Выводы» with orange-marker items (dark lead word group + muted explanation). */
body:has(.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"])) .case-analysis-dialog .career-dialog-intro{font-size:clamp(15px,1.1vw,18px);line-height:1.6}
body:has(.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"])) .case-analysis-dialog .career-dialog-list{padding-top:0;border-top:0;margin-top:36px}
body:has(.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"])) .case-analysis-dialog .career-dialog-list h3{margin:0 0 20px;font-size:28px;font-weight:600;line-height:1.2}
body:has(.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"])) .case-analysis-dialog .career-dialog-list li{margin-bottom:20px}
body:has(.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"])) .case-analysis-dialog .career-dialog-list li strong{display:block;margin-bottom:4px;font-weight:600;color:var(--color-text,#000)}
/* 04.11.2026 variant C: «Визуальный поиск» — moodboard references as a slowly running strip. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-strip{position:relative;overflow:hidden;border-radius:24px;background:var(--case-soft);padding:32px 0}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-track{display:flex;width:max-content;animation:ref-run 60s linear infinite}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-dup{display:flex}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-card{flex:none;width:400px;aspect-ratio:16/10.5;margin-right:16px;overflow:hidden;border-radius:10px;background:#000}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-card img{display:block;width:100%;height:100%;object-fit:cover}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-strip:hover .ref-track{animation-play-state:paused}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-zoom{position:absolute;right:16px;bottom:16px;width:auto;height:auto;background:none}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-zoom .case-zoom{position:static}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .ref-caption{padding:12px 0 0;font-size:13px;line-height:18px;color:var(--color-muted)}
@keyframes ref-run{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-track{animation:none}}
@media(max-width:809.98px){.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-card{width:260px}.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-strip{padding:20px 0;border-radius:18px}}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-media:has(.ref-strip){background:none;border:0;box-shadow:none;overflow:visible}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-media .ref-caption{padding:12px 0 0;margin:0;background:none;border:0}
/* 04.11.2026: the strip shows whole moodboard pages, each in its own tall window;
   hovering a card scrolls that page from top to bottom. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-card{width:300px;aspect-ratio:auto;height:500px;background:#fff;box-shadow:0 0 0 1px #0000000d}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-card img{object-fit:cover;object-position:50% 0;transition:object-position 6s ease-in-out}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-card:hover img{object-position:50% 100%}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-track{animation-duration:90s}
@media(max-width:809.98px){.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-card{width:200px;height:340px}}
@media(prefers-reduced-motion:reduce){.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .ref-card img{transition:none}}
/* 04.11.2026: result — title, then three equal paragraphs 16px apart, title set off by 28px; product results live in the orange card. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .case-outcome-composition>.case-chapter-heading{gap:28px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-outcome-composition>.case-chapter-heading>p{font-size:16px;line-height:26px;max-width:none;text-wrap:pretty}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .case-outcome-composition{row-gap:16px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .case-outcome-story .case-copy-body{gap:16px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-outcome-story p{font-size:16px;line-height:26px;margin:0}

/* A research proof inside the opening (STADION) spans both columns. */
@media(min-width:810px){
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .case-research-opening>.case-research-proof{grid-column:1/-1;grid-row:3;margin-top:24px}
}

/* 03.11.2026: Scenario diagrams are separated as in SEE MO. Reuse the shared
   scene separator (rule line + stars to the rails) that the reading grid applies
   to #context/#research/#interface; STADION's scenarios have no separators. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .case-reading-content #architecture .case-section-divider{
 position:relative;margin:var(--case-scene-before) calc(-1 * var(--reading-inset)) 0;
 padding:calc(var(--case-scene-after) - 1px) var(--reading-inset) 0;border-top:1px solid var(--color-rule);
}
/* In SEE MO the competitor groups are the direct evidence of the research
   opening ("Что сравнивалось"), so they follow it at the intro→proof gap. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) #research>.case-blocks>.case-competitors:first-child{margin-top:var(--case-sp-proof)}
/* 04.11.2026: dark theme — item titles in the findings dialog were black on black. */
html[toggle-theme="dark"] body:has(.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"])) .case-analysis-dialog .career-dialog-list li strong{color:#fff}
/* 04.11.2026: passport icons drawn by the generator (Admin Kostaff), same as SEE MO. */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) [data-case-passport] .case-passport-icon{display:block;width:24px;height:24px;flex:none;color:var(--case-ink)}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) [data-case-passport] .case-passport-icon svg{display:block}

/* 04.11.2026: on laptops (1100–1439 px) the ladder columns are narrow; slightly smaller
   side padding and titles so no word touches the column line (same in every case). */
@media(min-width:1100px) and (max-width:1439.98px){
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-cols li{padding-inline:12px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-pct{left:12px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]) .fl-bar{left:12px;right:12px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation .fl-cols h4{font-size:21px;line-height:25px}
}
/* 05.11.2026: one «Результат» standard in every case — the page's own rhythm and type:
   title → text 12px, paragraphs 8px, all body text 16/26 (cards included). */
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation #outcome .case-outcome-composition>.case-chapter-heading{gap:12px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation #outcome .case-outcome-composition{row-gap:8px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation #outcome .case-outcome-story .case-copy-body{gap:8px}
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation #outcome .case-outcome-composition>.case-chapter-heading>p,
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation #outcome .case-outcome-story p,
.case-page:is([data-case="stadion"],[data-case="kostaff"],[data-case="dirft"],[data-case="contractor"]).case-reading-presentation #outcome .case-results p{font-size:16px;line-height:26px}