/* Sabit Trumov, V3: phone composition (loaded with media="(max-width:767px)", after site2.css).
   Desktop is editorial and spacious; the phone is compact and information-first.
   Hero order: name + role with a small portrait, positioning, one context line, metrics, CTA.
   Type scale: hero name 42, page title 34, section title 28, chapter title 24, body 16, meta 12-13. */

html{font-size:16px}

/* ---------- header (64px) ---------- */
.top{background:var(--bg)}
.brand{font-size:1.25rem;letter-spacing:-.015em}
.top-in{gap:12px}
.top-actions{gap:2px}
.icon-link{width:40px;height:40px}
.menu-toggle{width:42px;height:42px;margin-left:6px}
.menu{padding:4px var(--gutter) 32px}
.menu a{font-size:1.125rem;padding:12px 0}
.menu-extra{margin-top:12px}
.menu-extra a{font-size:.94rem;padding:10px 0}

/* ---------- hero ---------- */
.hero{padding:26px 0 44px}
.hero-grid{grid-template-columns:minmax(0,1fr) 124px;grid-template-areas:"eye eye" "name pic" "head pic" "lead lead" "ctx ctx" "metrics metrics" "cta cta";gap:0 16px;align-items:start}
.hero-text,.hero-side{display:contents}
.hero .eyebrow{grid-area:eye;font-size:.7rem;margin:0 0 14px}
.hero-name{grid-area:name;font-size:2.625rem;line-height:.95;letter-spacing:-.035em;margin:0 0 12px}
.hero-headline{grid-area:head;font-size:1.0625rem;line-height:1.32;margin:0;text-wrap:balance}
.hero-headline .hl-sep{display:none}
.hero-headline .hl-tail{display:block;color:var(--muted);font-weight:500}
.hero-lead{grid-area:lead;font-size:.97rem;line-height:1.58;margin:18px 0 0}
.hero-side .portrait{grid-area:pic;width:124px;max-width:124px;margin-top:4px}
.hero-side .portrait-mono{aspect-ratio:4/5;max-width:124px;padding:12px;flex-direction:column;align-items:flex-start;gap:0}
.hero-side .portrait-mono span{font-size:3rem}
.hero-side .portrait-mono figcaption{display:none}
.hero-meta{display:none}
.hero-ctx{grid-area:ctx;display:block;margin-top:20px}
.hero-ctx .ctx{margin-bottom:-3px}
.hero-ctx .ctx li{font-size:.8125rem}
.hero-text .metrics{grid-area:metrics}
.hero .cta{grid-area:cta}

/* ---------- metrics: compact 2 x 2 ---------- */
.metrics.compact{margin-top:24px}
.metrics.compact .metric{padding:14px 12px 14px 0}
.metrics.compact .metric:nth-child(2n){padding-left:14px;padding-right:0}
.metrics.compact .num{font-size:1.875rem;margin-bottom:6px}
.metrics.compact strong{font-size:.8125rem;line-height:1.3;margin-bottom:2px}
.metrics.compact .ev-link{font-size:.62rem;padding-top:6px}
.metric .num{font-size:1.875rem}
/* hero markers: one size for words and numbers; shrinks only below ~370px so LEADERSHIP stays on one line */
.metrics.markers .num{font-size:min(1.6875rem,calc(8.9vw - 6px));font-stretch:86%;letter-spacing:-.015em}
.markers .mk-line{display:none}
html:not([lang="en"]) .metrics.markers .num{font-size:min(1.6875rem,calc(8.9vw - 6px),calc((100cqw - 4px) / var(--mk-em,6)))}
html:not([lang="en"]) .page-head h1,html:not([lang="en"]) .book-in h1{font-size:min(2.125rem,8.6vw)}
html:not([lang="en"]) .hero .cta .btn:not(.cta-minor){white-space:normal;text-align:center;line-height:1.2;padding:8px 10px}

/* ---------- CTA: two buttons, then text links ---------- */
.hero .cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.hero .cta .btn:not(.cta-minor){flex:1 1 calc(50% - 5px);min-width:0;padding:0 12px;font-size:.875rem}
.hero .cta .cta-minor{flex:0 0 auto;min-height:40px;padding:0;margin-right:14px;border-color:transparent;background:none;font-size:.875rem;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line-2)}
.cta{gap:10px}
.cta .btn{font-size:.875rem}

/* ---------- page heads and sections ---------- */
.page-head{padding:30px var(--gutter) 28px}
.page-head h1,.book-in h1{font-size:2.125rem;line-height:1.06;letter-spacing:-.025em;margin-bottom:16px}
.lead{font-size:1rem;line-height:1.6}
.section{padding:40px 0}
.section.tight{padding:24px 0}
.sec-head{gap:8px;margin-bottom:24px}
.sec-head h2{font-size:1.75rem;line-height:1.14;margin-bottom:10px}
.sec-label{margin:0}
h3.sub{font-size:1.2rem;margin:40px 0 14px}
.statement{font-size:1.25rem;line-height:1.38;padding-left:16px}

/* ---------- career and experience ---------- */
.chapter{padding:28px 0}
.chapter h2{font-size:1.5rem;line-height:1.18}
.ctx li{font-size:.8125rem;padding:0 10px}
.ctx ul{margin-left:-11px}
.case-card h3{font-size:1.125rem}
.tpf{margin-top:44px;padding-top:28px}
.tpf-head h3{font-size:1.5rem}
.tpf-t{font-size:1.06rem}

/* ---------- knowledge book and articles ---------- */
.ch-big{font-size:2.5rem}
.art-chapter{font-size:.68rem;letter-spacing:.06em}
.art-chapter > *:not(:first-child)::before{margin:0 7px}
.kb-chapter{padding:24px 0}
.kb-chapter h2{font-size:1.4rem}
.book-stats dt{font-size:1.6rem}
.prose{font-size:1.0625rem;line-height:1.68}
.prose h2{font-size:1.4rem}
.prose h3{font-size:1.15rem}
.prose .tool h2.tool-h{font-size:1.25rem}

/* ---------- credentials, about, voices, profile ---------- */
.edu{padding:22px 0}
.edu h3{font-size:1.2rem}
.ref h3{font-size:1.2rem}
.tile{min-height:0}
.tile h3{font-size:1.125rem}
.langs strong{font-size:1.4rem}
.voice blockquote{font-size:1rem}
.brief-head h1{font-size:2.125rem}
.portrait.small{max-width:124px}
.foot{padding:32px 0 40px}

/* very narrow phones: the portrait moves under the role and stays small */
@media (max-width:359px){
  .hero-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"eye" "name" "head" "pic" "lead" "ctx" "metrics" "cta"}
  .hero-name{font-size:2.4rem}
  .hero-side .portrait{width:104px;max-width:104px;margin-top:16px}
  .hero .cta .btn:not(.cta-minor){flex-basis:100%}
}

/* ---------- R7.1 case intelligence: compact, information-first ---------- */
.case-row{grid-template-columns:minmax(0,1fr);gap:10px;padding:22px 0}
.cr-meta{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 12px}
.cr-side{grid-column:auto;gap:10px}
.case-row h3{font-size:1.25rem}
.cr-q{font-size:1rem}
.cs-eyebrow{margin:18px 0 12px;gap:8px 12px}
.cs-head h1{font-size:1.75rem;line-height:1.1;margin-bottom:20px}
.cs-qt{font-size:1.625rem;line-height:1.18;padding-left:14px}
.cs-q{margin-bottom:18px}
.cs-impact{padding:20px 0}
.cs-impact ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 14px}
.cs-impact li{padding-left:12px}
.cs-impact span{font-size:.875rem}
.cs-toc{display:none}
.cs-mod{padding:36px 0}
.cs-grid{gap:14px}
.cs-h{margin:0}
.cs-role{grid-template-columns:minmax(0,1fr);gap:22px}
.role-mine p{font-size:1rem}
.sig-board{grid-template-columns:minmax(0,1fr)}
.sig-board li{display:grid;grid-template-columns:38px minmax(0,1fr);column-gap:8px;row-gap:2px;padding:12px 14px}
.sig-i{grid-row:1 / 3;padding-top:3px}
.cs-stick-q{display:none}
.dp-legend{grid-template-columns:repeat(3,auto);justify-content:start;gap:6px 14px;font-size:.75rem}
.dp-legend li{gap:6px}
.swim{display:none}
.dp-body h3{font-size:1.05rem}
.dp-check{font-size:.92rem}
.dp-more summary{min-height:44px;font-size:.84rem}
.dpath-layers .dp-step{margin-left:calc(var(--i,0) * 5px)}
.cs-formula{padding:16px}
.fx{font-size:.84rem}
.judge-lead{font-size:1.375rem;line-height:1.26;padding-left:14px}
.cs-judge p:not(.judge-lead){font-size:1rem}
.fm-list{grid-template-columns:minmax(0,1fr)}
.oc-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.oc-list li{padding:12px 4px 12px 0}
.oc-code{font-size:.68rem}
.val-list{grid-template-columns:minmax(0,1fr);gap:14px}
.cs-fieldnote{padding:36px 0}
.fn-t{font-size:1.2rem}
.cs-connect{padding:36px 0}
.ci-grid{grid-template-columns:minmax(0,1fr);gap:22px;padding-top:0;padding-left:22px}
.ci-grid::before{left:5px;right:auto;top:6px;bottom:6px;width:1px;height:auto}
.ci-dot{left:-22px;top:3px}
.case-nav{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.cn-back{grid-column:1 / -1;grid-row:2;justify-self:start;margin-top:4px}
.cn-prev,.cn-next{font-size:.92rem}

/* ---------- R7.1.1 case polish on phones: everything recomposed vertically, nothing scrolls sideways ---------- */
.cs-head-grid.has-glance{grid-template-columns:minmax(0,1fr);gap:18px}
.cs-glance{padding:14px 16px 10px;margin-top:2px}
.cs-glance .cs-label{margin-bottom:12px}
.gl-list li{padding-bottom:9px}
.gl-t{font-size:.92rem}
.gl-go{min-height:44px;padding-top:4px;margin-top:8px}
.dpath-chain .dp-body{grid-template-columns:minmax(0,1fr);padding:12px 14px 6px}
.dpath-chain .dp-top,.dpath-chain .dp-body h3,.dpath-chain .dp-check,.dpath-chain .dp-more{grid-column:1;grid-row:auto}
.dpath-chain .dp-check{margin-top:4px}
.dpath-chain .dp-node{margin-top:18px}
.dpath-gates .dp-step:not(.is-outcome) .dp-body{padding:10px 12px 6px}
.dpath-timeline .dp-step{grid-template-columns:calc(var(--spine) * 2 + 6px) minmax(0,1fr)}
.dpath-timeline::before,.dpath-timeline::after{left:calc(var(--spine) - .5px)}
.dpath-timeline .dp-lane{grid-column:2;grid-row:1;margin:0 0 2px;padding:0;text-align:left}
.dpath-timeline .dp-node{grid-column:1;grid-row:1 / 3}
.dpath-timeline .dp-body{grid-column:2;grid-row:2}
.tl-strip{display:none}
.dpath-layers .dp-step{margin-left:0}
.dpath-layers .dp-body{--layer-col:39px;grid-template-columns:38px minmax(0,1fr);column-gap:12px;padding-right:14px}
.scn-row{grid-template-columns:minmax(0,1fr)}
.scn-k{padding:12px 14px 0;border-right:0}
.scn-v{padding:6px 14px 12px}
.scn-v.is-split{grid-template-columns:minmax(0,1fr);gap:10px}
.scn-v.is-split .scn-i{padding-left:12px;border-left:1px solid var(--line-2)}
.scn-row.is-decision .scn-v.is-split .scn-i{border-left-color:var(--accent)}

/* ---------- R7.2 knowledge modules and Decision Labs (phones) ---------- */
.kx-head h1{max-width:none}
.kx-meta{font-size:.66rem}
.kx-strip{grid-template-columns:1fr;margin-bottom:28px}
.kx-strip li:nth-child(n){padding:11px 0 11px 22px;border-left:0;border-top:1px solid var(--line)}
.kx-strip li:first-child{border-top:0}
.kx-strip li:nth-child(n)::before{display:none}
.kx-strip li::after{content:"";position:absolute;left:2px;top:17px;width:7px;height:7px;border:1.5px solid var(--brass-ink);transform:rotate(45deg)}
.kx-lead{font-size:1.32rem;max-width:none}
.kx-sig,.kx-fm{grid-template-columns:1fr}
.kx-mod{padding-bottom:36px}
.kx-after{gap:40px}
.lab{margin:0 calc(var(--gutter) * -1);border-left:0;border-right:0;border-radius:0}
.lab-head,.lab-step,.lab-rules,.lab-note{padding-left:var(--gutter);padding-right:var(--gutter)}
.lab-title{font-size:1.45rem}
h1.lab-title{font-size:1.8rem}
.lab-opts{display:grid;grid-template-columns:1fr}
.lab-opt span{min-height:44px}
.lab-decs{max-width:none}
.lab-go{width:100%}
.lr-pair{grid-template-columns:1fr}
.lab-rules li{padding-left:36px}
.lab .tool.is-nested .tool-out{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:14px}
.dl-n{padding-top:2px}