/* Homepage depth story. Local v2026.09.06-01. Other sections and article/case styles are untouched. */
.depth--scroll{--depth-gap:clamp(28px,4vw,58px);--depth-accent:var(--color-teal);padding-block:clamp(64px,7vw,112px);background:radial-gradient(ellipse at 8% 12%,var(--tint-teal-15),transparent 36%),radial-gradient(ellipse at 80% 70%,var(--tint-purple-10),transparent 44%),var(--color-bg)}
.depth--scroll>.container{max-width:1320px}
.depth--scroll{--depth-ink:var(--color-teal);--depth-team-ink:var(--color-purple-light);--depth-on-ink:#fff}
[data-theme="dark"] .depth--scroll{--depth-ink:#65c6d1;--depth-team-ink:#bca6f2;--depth-on-ink:#12262a}
.depth--scroll .dpanel__badge,.depth--scroll .dpanel__cols h4,.depth--scroll .dpanel__cta,.depth--scroll .dstage.is-active .dstage__lvl{color:var(--depth-ink)}
.depth--scroll .dpanel__meta,.depth--scroll .dstage__lvl{color:var(--color-text-60)}
.depth--scroll .depth__head{max-width:none;margin-bottom:clamp(36px,5vw,64px)}
.depth--scroll .depth__intro{max-width:42rem}
.depth--scroll .depth__scene{position:relative;display:grid;gap:32px;align-items:start;overflow-anchor:none}
.depth--scroll .depth__navigator{min-width:0}
.depth--scroll .depth__route-head{display:none}
.depth--scroll .depth__scroll-hint{display:none}
.depth--scroll .depth__rail{margin:0}
.depth--scroll .dstage{text-decoration:none}
.depth--scroll .dstage:hover{transform:none}
.depth--scroll .dstage__dot{display:grid;place-items:center;font:500 10px/1 var(--font-display)}
.depth--scroll .depth__panels{display:grid;gap:28px;min-width:0}
.depth--scroll .dpanel{position:relative;display:flex;flex-direction:column;min-width:0;margin:0;animation:none;scroll-margin-top:24px}
.depth--scroll .dpanel__mode{font-size:10px;line-height:1.5;letter-spacing:.1em;text-transform:uppercase;color:var(--color-text-60)}
.depth--scroll .dpanel__head{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:16px 12px}
.depth--scroll .dpanel__mode{justify-self:end;text-align:right}
.depth--scroll .dpanel__title{grid-column:1/-1}
.depth--scroll .dpanel__foot{margin-top:28px}
.depth--scroll .dpanel__team{padding:18px 20px;margin-top:24px;border:1px solid var(--color-border-md);border-left:3px solid var(--color-purple-light);border-radius:0 12px 12px 0;background:var(--tint-purple-10)}
.depth--scroll .dpanel__team h4{font:500 13px/1.4 var(--font-display);letter-spacing:.04em;text-transform:uppercase;color:var(--depth-team-ink);margin:0 0 8px}
.depth--scroll .dpanel__team p{font-size:14px;line-height:1.65;color:var(--color-text-80);margin:0}
.depth--scroll .dstage:focus-visible,.depth--scroll .dpanel__cta:focus-visible{outline:2px solid var(--color-teal);outline-offset:5px}
.depth--scroll .dpanel:focus{outline:none}
.depth--scroll .dpanel:focus-visible{outline:2px solid var(--color-teal);outline-offset:4px}
/* A compact selector stays available on smaller screens. Without JS every description is readable. */
.depth--scroll[data-depth-mode="compact"] .dpanel:not(.is-active){display:none}
.depth--scroll[data-depth-mode="compact"] .dpanel.is-active{display:flex;animation:none}
@media(min-width:1000px) and (min-height:560px){
 .depth--scroll .depth__head{display:grid;grid-template-columns:1.1fr 1fr;column-gap:var(--depth-gap);align-items:end}
 .depth--scroll .depth__head>.sec-kicker{grid-column:1/-1}
 .depth--scroll .depth__intro{margin:0 0 4px;font-size:17px;max-width:33rem}
 .depth--scroll .depth__scene{grid-template-columns:minmax(280px,.72fr) minmax(0,1.55fr);gap:var(--depth-gap)}
 .depth--scroll .depth__navigator{position:sticky;top:calc(var(--header-h) + 24px);padding:24px 0 18px;align-self:start;border-top:1px solid var(--color-border-strong);border-bottom:1px solid var(--color-border-md)}
 .depth--scroll .depth__route-head{display:block;padding-inline:8px;margin-bottom:20px}
 .depth--scroll .depth__route-kicker{font:500 10px/1.4 var(--font-display);text-transform:uppercase;letter-spacing:.14em;color:var(--depth-ink);margin:0 0 14px}
 .depth--scroll .depth__route-caption{display:flex;align-items:center;justify-content:space-between;gap:12px}
 .depth--scroll .depth__route-caption>p{font-size:13px;line-height:1.65;color:var(--color-text-60);margin:0}
 .depth--scroll .depth__count{white-space:nowrap;font:400 14px/1 var(--font-display);color:var(--color-text-60)}
 .depth--scroll .depth__count b{font-size:34px;font-weight:500;color:var(--depth-ink);font-variant-numeric:tabular-nums}
 .depth--scroll .depth__stages{display:grid;grid-template-columns:1fr;gap:0;padding:0;border:0}
 .depth--scroll .dstage{--node-x:24px;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:4px;min-height:68px;height:clamp(68px,9.5vh,90px);margin:0;padding:10px 10px 10px 108px;text-align:left;border-radius:14px;transition:background 240ms ease,color 240ms ease}
 .depth--scroll .dstage:nth-child(2){--node-x:58px}
 .depth--scroll .dstage:nth-child(3){--node-x:30px}
 .depth--scroll .dstage:nth-child(4){--node-x:66px}
 .depth--scroll .dstage:nth-child(5){--node-x:40px}
 .depth--scroll .dstage__dot{position:absolute;left:var(--node-x);top:50%;width:28px;height:28px;margin:0;transform:translateY(-50%);border-width:1px;color:var(--color-text-60);background:var(--color-bg);font-size:11px;z-index:2}
 .depth--scroll .dstage__lvl{font-size:9px;line-height:1.3;letter-spacing:.12em;order:0;width:auto;transition:color 240ms ease}
 .depth--scroll .dstage__name{font-size:clamp(17px,1.45vw,21px);line-height:1.18;max-width:19ch;font-weight:500}
 .depth--scroll .dstage__hint{font-size:11px;line-height:1.5;color:var(--color-text-60)}
 .depth--scroll .dstage:hover{background:var(--color-hover-tint)}
 .depth--scroll .dstage.is-active{background:linear-gradient(90deg,transparent 18%,var(--tint-teal-15))}
 .depth--scroll .dstage.is-active .dstage__dot{transform:translateY(-50%) scale(1.08);background:var(--depth-ink);border-color:var(--depth-ink);color:var(--depth-on-ink);box-shadow:0 0 0 5px var(--tint-teal-15),0 0 26px var(--tint-teal-15)}
 .depth--scroll .dstage.is-past .dstage__dot{border-color:var(--depth-ink);color:var(--depth-ink);background:var(--color-bg)}
 .depth--scroll .depth__line{display:block}
 .depth--scroll .depth__line-bg{stroke-width:1.4;stroke-dasharray:3 5}
 .depth--scroll .depth__line-fg{stroke-width:2.4;transition:stroke-dashoffset 650ms cubic-bezier(.22,.68,0,1.1)}
 .depth--scroll .depth__scroll-hint{display:flex;align-items:center;gap:12px;margin:18px 0 0;padding:16px 8px 0;border-top:1px solid var(--color-border);color:var(--color-text-60);font-size:11px;line-height:1.6}
 .depth--scroll .depth__scroll-hint>span:first-child{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--color-border-md);border-radius:50%;font-size:17px;color:var(--color-teal);flex:none}
 .depth--scroll .depth__panels{gap:36px;padding-bottom:0}
 .depth--scroll .dpanel{--panel-accent:var(--color-teal);min-height:var(--depth-card-height,0px);padding:clamp(28px,2.6vw,40px);border-radius:24px;border:1px solid var(--color-border-md);box-shadow:0 16px 48px #00000008;background:var(--color-bg-card);isolation:isolate;transition:transform 600ms cubic-bezier(.16,1,.3,1),box-shadow 500ms ease,border-color 500ms ease}
 .depth--scroll[data-depth-ready] .dpanel{transform:translateX(14px)}
 .depth--scroll[data-depth-ready] .dpanel.is-active{transform:translateX(0);border-color:var(--panel-accent);box-shadow:0 20px 65px #00000012}
 .depth--scroll .dpanel::before{content:"";position:absolute;left:-1px;top:40px;width:3px;height:58px;background:var(--panel-accent);border-radius:0 2px 2px 0;opacity:.45;transition:opacity 400ms ease}
 .depth--scroll .dpanel.is-active::before{opacity:1}
 .depth--scroll .dpanel::after{content:"0" attr(data-panel);position:absolute;right:24px;bottom:104px;z-index:-1;pointer-events:none;font:500 112px/1 var(--font-display);color:var(--color-heading);opacity:.025;letter-spacing:-.04em}
 .depth--scroll .dpanel__head{margin:0 0 24px;gap:20px 16px}
 .depth--scroll .dpanel__badge{padding:5px 10px;font-size:10px;justify-self:start;border:1px solid var(--color-border-md)}
 .depth--scroll .dpanel__mode{font-size:10px;max-width:23ch}
 .depth--scroll .dpanel__title{font-weight:500;font-size:clamp(30px,2.85vw,42px);line-height:1.12;letter-spacing:-.02em;max-width:26ch;text-wrap:balance}
 .depth--scroll .dpanel__lead{font-size:16px;line-height:1.75;margin-bottom:26px;max-width:none}
 .depth--scroll .dpanel__cols{gap:22px;margin-bottom:26px}
 .depth--scroll .dpanel__cols h4{font:500 12px/1.4 var(--font-display);letter-spacing:.08em;margin-bottom:14px}
 .depth--scroll .dpanel__cols ul{gap:10px}
 .depth--scroll .dpanel__cols li{font-size:14px;line-height:1.65}
 .depth--scroll .dpanel__steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:26px}
 .depth--scroll .dpanel__steps li{font-size:12px;line-height:1.55;padding:12px 12px 12px 34px;border-radius:10px;background:var(--color-surface-glass);min-width:0}
 .depth--scroll .dpanel__steps li::before{left:12px;top:12px;font-size:13px}
 .depth--scroll .dpanel__steps li:last-child{grid-column:1/-1}
 .depth--scroll .dpanel__foot{margin-top:auto;padding-top:22px;min-height:56px;align-items:center}
 .depth--scroll .dpanel__cta{font-size:14px;min-height:44px;max-width:100%}
 .depth--scroll .dpanel__meta{font-size:12px}
 .depth--scroll .dpanel--team{--panel-accent:var(--color-purple-light)}
 .depth--scroll .dpanel--team .dpanel__badge{color:var(--depth-team-ink);background:var(--tint-purple-10)}
 .depth--scroll .dpanel--team .dpanel__mode{color:var(--depth-team-ink)}
 .depth--scroll .dpanel__team{margin:0 0 24px}
}
@media(min-width:1000px) and (max-height:700px){
 .depth--scroll .depth__navigator{top:calc(var(--header-h) + 14px);padding-block:16px 10px}
 .depth--scroll .depth__route-head{margin-bottom:8px}
 .depth--scroll .depth__route-kicker{margin-bottom:8px}
 .depth--scroll .depth__route-caption>p{font-size:12px;line-height:1.5}
 .depth--scroll .dstage{height:68px;padding-block:6px;gap:3px}
 .depth--scroll .dstage__name{font-size:17px}
 .depth--scroll .dstage__hint{display:none}
 .depth--scroll .depth__scroll-hint{margin-top:8px;padding-top:10px}
}
@media(max-width:999px), (max-height:559px){
 .depth--scroll .depth__scene{grid-template-columns:1fr}
 .depth--scroll .depth__navigator{position:static}
 .depth--scroll .depth__line{display:none}
 .depth--scroll .depth__stages{grid-template-columns:1fr;gap:0;padding-left:24px;border-left:1px dashed var(--color-border-strong)}
 .depth--scroll .dstage{flex-direction:row;align-items:center;flex-wrap:wrap;gap:8px 12px;margin:0;padding:12px 8px;text-align:left;min-height:60px}
 .depth--scroll .dstage__dot{width:24px;height:24px;font-size:9px;flex:none;margin:0 0 0 -36px}
 .depth--scroll .dstage__name{font-size:18px;max-width:calc(100% - 24px)}
 .depth--scroll .dstage__lvl{order:3;width:100%;font-size:10px}
 .depth--scroll .dstage__hint{font-size:11px}
 .depth--scroll .dpanel__head{gap:16px 10px}
 .depth--scroll .dpanel__title{font-size:28px;font-weight:500;line-height:1.2}
 .depth--scroll .dpanel__cols,.depth--scroll .dpanel__cols--3{grid-template-columns:1fr}
 .depth--scroll .dpanel__cta{min-height:44px}
 .depth--scroll .dpanel{padding:24px;min-height:0!important}
}
@media(prefers-reduced-motion:reduce){
 .depth--scroll .dpanel,.depth--scroll .dstage,.depth--scroll .dstage__dot,.depth--scroll .depth__line-fg{transition:none!important;animation:none!important}
 .depth--scroll[data-depth-ready] .dpanel{transform:none}
}