/* Solutions rebuild (card 28G-C09): band modes, players, comparison. Loaded after solutions.css. Colours from the tokens in site.css.
   Modes: Paper, Stone, Sand, Deep, Ember (PLAN 3.2). Diagram lines are blue only, no orange in any drawing (Gate 1, D7). */
:root{--m-stone:#EAEEF7;--m-sand:#F5EFE3;--m-deep:#0C1844;--m-ember:#FBE6CB;--m-ember-text:#0C1844;
  --sk-top:#DCE4F8;--sk-front:#2A4BB0;--sk-side:#1B3280;--sk-acct:#0C1844;--sk-line:#2A4BB0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--m-stone:#101946;--m-sand:#151B3F;--m-deep:#060A22;--m-ember:#241C24;--m-ember-text:#EEF1FA;
  --sk-top:#3A4F96;--sk-front:#2A3F8A;--sk-side:#1C2C66;--sk-acct:#4B63B8;--sk-line:#8FA6EE}}
:root[data-theme="dark"]{--m-stone:#101946;--m-sand:#151B3F;--m-deep:#060A22;--m-ember:#241C24;--m-ember-text:#EEF1FA;
  --sk-top:#3A4F96;--sk-front:#2A3F8A;--sk-side:#1C2C66;--sk-acct:#4B63B8;--sk-line:#8FA6EE}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* hero pause (C4, WCAG 2.2.2) */
.hero-pause{position:absolute;right:max(16px,calc((100vw - 1200px)/2));bottom:24px;z-index:3;width:44px;height:44px;border-radius:50%;border:2px solid rgba(255,255,255,.7);background:rgba(8,13,38,.62);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
.hero-pause svg,.pbtn-main svg{width:20px;height:20px}
.hero-pause svg path,.pbtn-main svg path,.ring-play svg path{fill:currentColor;stroke:none}
.hero-pause[aria-pressed="false"] .i-play,.hero-pause[aria-pressed="true"] .i-pause{display:none}
.pbtn-main[aria-pressed="true"] .i-play,.pbtn-main[aria-pressed="false"] .i-pause{display:none}

/* bands */
.sol .band{position:relative;padding-block:clamp(56px,8vw,112px);background:var(--bg)}
.sol .band .wrap{position:relative}
.sol .band.m-stone{background:var(--m-stone)}
.sol .band.m-sand{background:var(--m-sand)}
.sol .band a:not(.btn){color:var(--accent-text);font-weight:700;text-decoration:underline;text-decoration-color:currentColor;text-underline-offset:3px}
.sol .band .sl-head.ctr{max-width:none;text-align:center}
.sol .band.m-deep{background:var(--m-deep);color:#fff;overflow:hidden}
.sol .band.m-deep::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(to right,rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.045) 1px,transparent 1px);background-size:48px 48px}
.sol .band.m-deep a:not(.btn){color:#BFD0FF}
.sol .sl-head.on-deep h2{color:#fff;font-size:clamp(36px,5vw,60px);line-height:1.05;letter-spacing:-.015em}
.sol .sl-head.on-deep .lead{color:#fff;max-width:36ch}
.sol .sl-head.on-deep .body-lg{color:#C9D3EE;margin-top:20px}

/* pause / step controls */
.pbtn{appearance:none;width:44px;height:44px;border-radius:50%;border:2px solid var(--line);background:transparent;color:var(--text);display:grid;place-items:center;cursor:pointer;padding:0;flex:0 0 auto}
.pbtn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pbtn:disabled{opacity:.35;cursor:default}
.pbtn-main{border-color:var(--accent);background:var(--accent);color:#fff}
.m-deep .pbtn{border-color:rgba(255,255,255,.45);color:#fff}
.m-deep .pbtn-main{background:#fff;color:#0C1844;border-color:#fff}
.pl-ctrl{display:flex;align-items:center;gap:12px;margin-top:20px}
.pl-bar{flex:1;height:4px;border-radius:2px;background:var(--line);overflow:hidden;margin-left:8px}
.m-deep .pl-bar{background:rgba(255,255,255,.18)}
.pl-bar i{display:block;height:100%;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:0 50%}
.m-deep .pl-bar i{background:#8FA6EE}

/* step list shared by both players */
.stp{appearance:none;background:transparent;border:0;border-left:3px solid transparent;font:inherit;text-align:left;color:inherit;cursor:pointer;display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:12px;align-items:start;width:100%;padding:14px 12px 14px 14px;min-height:56px}
.stp-n{font-size:40px;line-height:1;font-weight:700;font-variant-numeric:tabular-nums;color:var(--accent-text)}
.m-deep .stp-n{color:#8FA6EE}
.stp-t h3{font-size:22px;line-height:1.25;margin:4px 0 6px;color:var(--text)}
.m-deep .stp-t h3{color:#fff}
.stp-t p{font-size:17px;line-height:1.5;color:var(--muted);margin:0}
.m-deep .stp-t p{color:#C9D3EE}
[data-step].is-current .stp{border-left-color:var(--accent)}
.m-deep [data-step].is-current .stp{border-left-color:#fff;background:rgba(255,255,255,.06)}
.dev-list,.fk-list{list-style:none;margin:0;padding:0}
/* inactive steps on a light band: dim the number only, so the step text keeps full contrast */
[data-player] .fk-list [data-step]:not(.is-current){opacity:1}
.fk-list [data-step]:not(.is-current) .stp-n{opacity:.7}
.devplayer,.forkplayer{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:56px;align-items:start;margin-top:56px}

/* development scene */
.dev-fig{margin:0;border:1px solid var(--stage-line);border-radius:16px;padding:20px;background:rgba(255,255,255,.035)}
.dev-svg{width:100%;height:auto}
.dev-svg .d-s{fill:none;stroke:#8FA6EE;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.dev-svg .d-f{fill:rgba(143,166,238,.09)}
.dev-svg .d-b{fill:#8FA6EE}
.dev-svg .d-w2{fill:rgba(238,241,250,.22)}
.dev-svg .d-dot{fill:rgba(143,166,238,.4)}
.dev-svg .d-grid{opacity:.7}
.dev-svg .d-tick{fill:none;stroke:#D5E0FF;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.dev-svg .d-conn path{fill:none;stroke:#8FA6EE;stroke-width:2;stroke-dasharray:6 8;stroke-linecap:round}
.dev-svg .is-now .d-s{stroke:#fff;stroke-width:3}
.dev-svg .is-now .d-w2{fill:rgba(255,255,255,.6)}
.dev-svg .is-now .d-f{fill:rgba(255,255,255,.14)}

/* operation ring */
.op-block{margin-top:clamp(64px,9vw,120px);padding-top:clamp(40px,6vw,72px);border-top:1px solid var(--stage-line)}
.dev-col .op-block{margin-top:36px;padding-top:32px}
.dev-col .op-block .sl-head h2{font-size:clamp(28px,3vw,36px)}
.ring{position:relative;height:640px;margin-top:40px}
.ring-track{position:absolute;left:14%;right:14%;top:12%;bottom:20%;border:2px dashed rgba(143,166,238,.5);border-radius:50%}
.ring-list{list-style:none;margin:0;padding:0}
.ring-list li{position:absolute;left:var(--x);top:var(--y);width:230px;transform:translate(-50%,-26px);display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px}
.rg-n{width:52px;height:52px;border-radius:50%;background:var(--m-deep);border:3px solid #8FA6EE;display:grid;place-items:center;font-size:20px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums}
.ring-list h3{font-size:22px;line-height:1.2;margin:0 0 4px;color:#fff}
.ring-list p{font-size:17px;line-height:1.45;color:#C9D3EE;margin:0}
.ring-play{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:64px;height:64px;background:#fff;color:#0C1844;border-color:#fff}
.ring-play svg{width:26px;height:26px}
.m-deep .ring-play{color:#0C1844}
.stack .holder text{font-size:22px}

/* TKY-1 */
.tk1{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);column-gap:72px;align-items:center}
.tk1-copy h2{font-size:clamp(38px,5vw,56px);line-height:1.08;letter-spacing:-.015em;margin:0;max-width:14ch}
.tk1-copy .lead{font-size:22px;line-height:1.45;font-weight:700;color:var(--text);margin:24px 0 0;max-width:40ch}
/* 28G-C42: the photo slot is gone, so the copy fills the row in two columns */
.tk1{grid-template-columns:minmax(0,1fr)}
.tk1-copy{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);column-gap:72px;align-content:start}
.tk1-copy > :not(.tk1-side){grid-column:1}
.tk1-copy > .tk1-side{grid-column:2;grid-row:1/span 3;align-self:center;margin-top:0}
@media (max-width:900px){.tk1-copy{grid-template-columns:minmax(0,1fr)}.tk1-copy > .tk1-side{grid-column:1;grid-row:auto;margin-top:28px}}
.tk1-side{margin-top:28px}
.tk1 + .gl-h{margin-top:48px}
.tk1-side p{font-size:19px;line-height:1.6;color:var(--muted);margin:0 0 14px;max-width:46ch}
.gl-h{margin:72px 0 24px}

/* image and diagram slots (marked: to be replaced by the G Team photos and G Builder-02 diagrams) */
.slot{margin:0;width:100%;min-width:0;aspect-ratio:var(--r);min-height:140px;border:2px dashed var(--accent);border-radius:14px;display:grid;place-items:center;padding:20px;text-align:center;color:var(--accent-text);background:
  repeating-linear-gradient(135deg,rgba(42,75,176,.07) 0 14px,transparent 14px 28px)}
.slot-tag{font-size:15px;line-height:1.4;font-weight:700;max-width:46ch}
.slot.strip{margin-bottom:clamp(40px,6vw,72px)}
.tabs-side + .panels .slot,.panels .slot{margin:0 0 32px}

/* TKY-2 */
.host2{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:72px;align-items:center}
.stackfig{margin:0}
.stack{width:100%;height:auto;overflow:visible}
.stack text{font-family:var(--font);font-size:22px;font-weight:700;fill:#fff}
.stack .l-top{fill:var(--sk-top);stroke:var(--sk-line);stroke-width:1.5}
.stack .l-front{fill:var(--sk-front)}
.stack .l-side{fill:var(--sk-side)}
.stack .sl-l{transition:transform 360ms var(--ease-out,cubic-bezier(.2,.7,.2,1))}
.stack .acct .l-front{fill:var(--sk-acct)}
.stack .acct-b{fill:none;stroke:var(--sk-line);stroke-width:2.5;stroke-dasharray:7 7;stroke-linecap:round}
.stack .h-tag{fill:var(--sk-line)}
.stack .holder text{fill:#fff;font-size:20px}
:root[data-theme="dark"] .stack .holder text{fill:#0C1844}
.host2[data-mode="a"] .h-b,.host2[data-mode="b"] .h-a{display:none}
.host2[data-mode="b"] .sl-l.acct{transform:translateX(-22px)}
.host2[data-mode="b"] .acct-line{transform:translateX(-22px)}
.acct-line{transition:transform 360ms var(--ease-out,ease)}
.hostgrid-in{display:grid;grid-template-columns:170px minmax(0,1fr);column-gap:28px}
.hostgrid-in .lab{display:none}
.hostgrid-in .h-head{grid-column:1 / -1;padding-bottom:20px;border-top:3px solid var(--accent-text);padding-top:20px}
.hostgrid-in .h-head h3{font-size:28px;line-height:1.2;margin:0 0 10px}
.hostgrid-in .h-head p{font-size:18px;line-height:1.55;color:var(--muted)}
.hostgrid-in .cell{border-top:1px solid var(--line);padding-block:20px;font-size:19px;line-height:1.5;color:var(--text);font-weight:700}
.hostgrid-in .cell.rl{font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-top:24px}
.host2[data-mode="a"] .col-b,.host2[data-mode="b"] .col-a{display:none}

/* CON-1 ledger */
.con1{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:72px;align-items:start}
.con1-main h2{font-size:clamp(36px,4.5vw,52px);line-height:1.08;letter-spacing:-.015em;margin:0;max-width:15ch}
.con1-main .lead-in{margin-top:24px}
.con1-main .body-lg{margin-top:20px}
.con1-help .help > li{padding-bottom:36px}

/* CON-2 fork */
.fk-fig{margin:0;border:1px solid var(--line);border-radius:16px;padding:20px;background:var(--bg)}
.fk-svg{width:100%;height:auto}
.fk-svg .f-s{fill:none;stroke:var(--accent);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.fk-svg .f-t{fill:var(--surface)}
.fk-svg .f-b{fill:var(--accent)}
.fk-svg .f-dim{opacity:.4}
.fk-svg .f-hi{fill:rgba(42,75,176,.2)}
.fk-svg .f-dash{stroke-dasharray:9 7}
.fk-svg .f-n{font:700 26px var(--font);fill:var(--accent-text)}
.fk-svg .f-conn path{fill:none;stroke:var(--accent);stroke-width:2.4;stroke-dasharray:6 8;stroke-linecap:round}
.fk-svg .is-now .f-s{stroke-width:3.6}
.fk-svg .is-now .f-t{fill:rgba(42,75,176,.12)}
.fk-outs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;margin-top:8px}
.fk-outs li{text-align:center;padding-block:10px;font-size:24px;line-height:1.25;font-weight:700;color:var(--text)}
.fk-outs li:not(.is-pending){color:var(--text)}
.fk-outs a{display:inline-flex;align-items:center;min-height:44px}

/* SOL-5 comparison and picker */
.pick{margin-top:40px}
.pick-l{font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#C9D3EE;margin:0 0 14px}
.chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.chip{appearance:none;font:inherit;font-size:17px;font-weight:700;line-height:1.35;text-align:left;color:#fff;background:transparent;border:2px solid rgba(255,255,255,.35);border-radius:10px;padding:12px 16px;min-height:56px;cursor:pointer}
.chip[aria-pressed="true"]{background:#fff;color:#0C1844;border-color:#fff}
.cm{margin-top:44px}
.cm-head,.cm-row{display:grid;grid-template-columns:minmax(0,2.4fr) repeat(3,minmax(0,1fr));column-gap:24px;align-items:center}
.cm-head{font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#C9D3EE;padding-bottom:14px}
.cm-list{list-style:none;margin:0;padding:0}
.cm-row{padding-block:26px;border-top:1px solid var(--stage-line);transition:opacity 280ms var(--ease-out,ease)}
.cm-list li:last-child{border-bottom:1px solid var(--stage-line)}
.cm-name h3{font-size:24px;line-height:1.25;margin:0 0 6px;color:#fff}
.cm-name p{font-size:17px;line-height:1.5;color:#C9D3EE;max-width:46ch}
.cm-c{font-size:18px;font-weight:700;color:#fff;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mk{width:16px;height:16px;border-radius:50%;flex:0 0 auto}
.mk-g{background:#8FA6EE}
.mk-y{border:3px solid #fff}
.mk-none{width:14px;height:2px;background:rgba(255,255,255,.4)}
.cm.has-pick .cm-row:not(.is-pick){opacity:.35}
.cm-row.is-pick{background:rgba(255,255,255,.07);box-shadow:inset 4px 0 0 #fff}
.writ{margin-top:64px;max-width:70ch}
.writ h3{font-size:28px;color:#fff;margin:0 0 12px}
.writ p{color:#C9D3EE;font-size:18px}
.writ .wlist{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 32px}
.writ .wlist li{position:relative;padding-left:26px;color:#C9D3EE;font-size:18px;line-height:1.5}
.writ .wlist li::before{content:"";position:absolute;left:0;top:.5em;width:12px;height:12px;border:2px solid #8FA6EE;border-radius:3px}
.m-deep .cta{margin-top:48px}

/* 29A-19: overview cards, compact sub-page hero, strip of links to the sibling pages. Blue lines, no orange. */
.sol .band.ov-cards{padding-block:clamp(48px,6vw,88px)}
.ov-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.ov-card{display:flex;flex-direction:column;min-width:0;padding-right:clamp(32px,4vw,72px)}
.ov-card + .ov-card{padding-right:0;padding-left:clamp(32px,4vw,72px);border-left:1px solid var(--line)}
.ov-card h2{font-size:clamp(30px,3.2vw,42px);line-height:1.1;letter-spacing:-.01em;margin:0;max-width:16ch}
.ov-card .ov-lead{font-size:20px;line-height:1.45;font-weight:700;color:var(--text);margin:20px 0 0;max-width:42ch}
.ov-card .glance{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:24px;column-gap:28px;margin:32px 0 36px}
.ov-card .glance dd{font-size:19px}
.sol .band a.ov-go{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:12px;min-height:48px;font-size:22px;line-height:1.2;text-decoration:none;border-bottom:2px solid currentColor}
.ov-go svg,.xlinks svg{width:24px;height:24px;flex:0 0 auto;transition:transform .2s ease}
@media (hover:hover) and (pointer:fine){.ov-go:hover svg,.xlinks a:hover svg{transform:translateX(4px)}}
.sol .band.sub-hero{padding-block:clamp(40px,5vw,72px)}
.tk1-copy h1{font-size:clamp(38px,5vw,56px);line-height:1.08;letter-spacing:-.015em;margin:0;max-width:20ch}
.con1-main h1{font-size:clamp(36px,4.5vw,52px);line-height:1.08;letter-spacing:-.015em;margin:0;max-width:15ch}
.sub-hero .tk1-side{margin-top:0}
/* 29A-28: the heading moved into the hero, so the opener's text runs as one column from the left edge, about 760 px wide, no empty half */
.sub-hero .tk1-copy{grid-template-columns:minmax(0,1fr)}
.sub-hero .tk1-copy > .tk1-side{grid-column:1;grid-row:auto;align-self:start;max-width:760px}
.sub-hero .tk1-side p{max-width:none}
.sub-hero .gl-h{margin:40px 0 16px}
.sub-hero .glance.col{margin-top:32px}
.sol .band.xstrip{padding-block:clamp(40px,5vw,72px)}
.xlinks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:32px}
.sol .band .xlinks a:not(.btn){display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:88px;padding:20px 0;border-top:3px solid var(--text);font-size:clamp(22px,2.2vw,28px);line-height:1.2;color:var(--text);text-decoration:none}
.xlinks svg{color:var(--accent-text)}
/* 30A-05: four cards: two by two on desktop so each title stays on one line */
.xlinks.xlinks-4{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (hover:hover) and (pointer:fine){.sol .band .xlinks a:hover{color:var(--accent-text)}}
/* overview: Ways to Work made compact (every word stays) */
.sol-ov .band.m-deep{padding-block:clamp(40px,5vw,64px)}
.sol-ov .sl-head.on-deep h2{font-size:clamp(34px,4vw,48px)}
.sol-ov .pick{margin-top:24px}
.sol-ov .chips{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.sol-ov .chip{min-height:48px;padding:8px 14px;font-size:16px}
/* 29A-23 part 3: the Solutions hero is the same navy panel with text beside the persona photo as Home, Application and AI */
.home-hero.sp .lead{color:#fff;margin:0 0 16px;max-width:34ch}
.home-hero.sp .hero-caption{margin:16px 0 0;font-size:15px;color:var(--on-navy-muted);max-width:none}
.sol-ov .band.m-deep{padding-block:clamp(40px,4vw,48px)}
.sol-ov .cm{margin-top:20px}
.sol-ov .cm-row{padding-block:10px;grid-template-columns:minmax(0,3.2fr) repeat(3,minmax(0,1fr))}
.ov-card .glance{margin:24px 0 28px}
.sol .band.ov-cards{padding-block:clamp(40px,3.5vw,48px)}
.sol-ov .cm-name p{max-width:none}
.sol-ov .cm-name h3{font-size:22px}
.sol .band.ov-cards{padding-block:clamp(40px,4.5vw,64px)}
.ov-card h2{max-width:none;font-size:clamp(28px,2.8vw,38px)}
.sol-ov .writ{margin-top:32px;max-width:none}
.sol-ov .writ .wlist{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:16px}
.sol-ov .m-deep .cta{margin-top:28px}
@media (max-width:1000px){.sol-ov .cm-row{row-gap:8px}.sol-ov .writ .wlist{grid-template-columns:1fr}}
/* phone: each way is a short list (label left, value right) instead of three narrow columns */
@media (max-width:760px){
  .sol-ov .cm-row{grid-template-columns:minmax(0,1fr);row-gap:2px;padding-block:14px}
  .sol-ov .cm-name{margin-bottom:6px}
  .sol-ov .cm-c{flex-wrap:wrap;gap:0 10px;min-height:34px}
  .sol-ov .cm-c::before{flex:0 0 150px;width:auto}
}
@media (max-width:960px){
  .ov-grid{grid-template-columns:1fr}
  .ov-card,.ov-card + .ov-card{padding-inline:0}
  .ov-card + .ov-card{border-left:0;border-top:1px solid var(--line);margin-top:40px;padding-top:40px}
  .xlinks,.xlinks.xlinks-4{grid-template-columns:1fr}
}

/* closing */
.band.m-ember{background:var(--m-ember);color:var(--m-ember-text)}
.band.sol-close{padding-block:clamp(56px,7vw,88px)}
.sol-close .wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--s3)}
.sol-close h2{font-size:clamp(36px,5vw,60px);line-height:1.08;letter-spacing:-.015em;max-width:20ch;color:inherit}
.sol-close .acts{display:flex;flex-wrap:wrap;gap:8px 32px;align-items:center;margin-top:32px}
.sol-close a.txt-link{color:inherit;font-weight:700;text-decoration:underline;display:inline-flex;align-items:center;min-height:44px}
.sol-reader .band{padding-block:0}

@media (max-width:1000px){
  .devplayer,.forkplayer,.host2,.tk1,.con1{grid-template-columns:1fr;row-gap:40px}
  .cm-head{display:none}
  .cm-row{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:14px}
  .cm-name{grid-column:1 / -1}
  .cm-c::before{content:attr(data-l);display:block;width:100%;font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#C9D3EE}
  .cm-c{flex-direction:row;align-items:center}
  .ring{height:auto}
  .ring-track{display:none}
  .ring-list{position:relative;padding-left:0}
  .ring-list li{position:relative;left:auto;top:auto;width:auto;transform:none;flex-direction:row;align-items:flex-start;text-align:left;padding-bottom:28px}
  .ring-list li:not(:last-child)::after{content:"";position:absolute;left:25px;top:56px;bottom:4px;border-left:2px dashed rgba(143,166,238,.5)}
  .ring-list li div{padding-top:2px}
  .ring-play{position:static;transform:none;margin-top:12px}
}
@media (max-width:760px){
  .hero-pause{right:12px;top:12px;bottom:auto}
  .fk-outs{grid-template-columns:1fr;row-gap:0}
  .fk-outs li{text-align:left;border-top:1px solid var(--line)}
  .hostgrid-in{grid-template-columns:1fr}
  .stp{grid-template-columns:40px minmax(0,1fr)}
  .stp-n{font-size:32px}
  .slot.strip{aspect-ratio:auto;min-height:120px}
  .writ .wlist{grid-template-columns:1fr;gap:12px}
}
@media (prefers-reduced-motion:reduce){.stack .sl-l,.acct-line{transition:none}}
/* 29A-26: the Turnkey and Consulting sub-pages open with the same navy hero; their own eyebrow, heading and lead sit beside the photo */
.home-hero.sp-sub .eyebrow{font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--on-navy-muted);margin:0 0 12px;max-width:34ch}
.home-hero.sp-sub h1{font-size:clamp(34px,3.9vw,52px);line-height:1.08;letter-spacing:-.015em;margin:0 0 16px;max-width:18ch}
@media (max-width:760px){.home-hero.sp-sub h1{font-size:34px}}