.sv{position:relative;margin-top:clamp(36px,5vw,72px);padding-left:clamp(36px,6vw,96px)}
.sv-rail{position:absolute;left:clamp(10px,2.2vw,32px);top:0;bottom:0;width:1px;background:rgba(214,219,225,.14)}
.sv-rail i{position:absolute;inset:0;background:linear-gradient(180deg,rgba(246,248,250,.2),#f6f8fa 40%,#9aa1a8);transform-origin:top;transform:scaleY(var(--p,1))}
.sv-it{position:relative;display:grid;grid-template-columns:clamp(96px,12vw,180px) minmax(0,1fr) auto;align-items:center;gap:clamp(20px,4vw,64px);min-height:clamp(240px,44vh,420px);padding:clamp(28px,4vw,56px) 0;border-top:1px solid rgba(214,219,225,.08);transition:opacity .6s}
.sv-it:last-child{border-bottom:1px solid rgba(214,219,225,.08)}
.sv-it::before{content:"";position:absolute;top:50%;left:calc(clamp(10px,2.2vw,32px) - clamp(36px,6vw,96px) - 5px);width:11px;height:11px;border-radius:50%;border:1px solid rgba(214,219,225,.6);background:#141619;transform:translateY(-50%) scale(.7);transition:transform .5s,background .5s,box-shadow .5s}
.sv-it::after{content:"";position:absolute;inset:0 -6vw 0 -2vw;background:radial-gradient(55% 75% at 30% 50%,rgba(238,241,244,.07),transparent 70%);opacity:0;transition:opacity .8s;pointer-events:none}
.sv-it.on::before{background:#f6f8fa;transform:translateY(-50%) scale(1);box-shadow:0 0 0 6px rgba(238,241,244,.08),0 0 18px rgba(238,241,244,.55)}
.sv-it.on::after{opacity:1}
.sv.act .sv-it:not(.on){opacity:.42}
.sv-n{font-size:clamp(64px,9vw,140px);font-weight:600;line-height:.9;letter-spacing:-.02em;color:transparent;-webkit-text-stroke:1px rgba(214,219,225,.4);background:linear-gradient(100deg,#f6f8fa 0 45%,rgba(246,248,250,0) 55%) 100% 0/260% 100% no-repeat;-webkit-background-clip:text;background-clip:text;transition:background-position 1.3s cubic-bezier(.2,.7,.2,1)}
.sv-it.on .sv-n{background-position:0 0}
.sv-ico,.sg-ico{display:block;position:relative}
.sv-ico svg{display:block;width:clamp(64px,7vw,104px);height:clamp(64px,7vw,104px)}
.sv-ico svg,.sg-ico svg{fill:none;stroke:#e9edf1;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;transition:filter .6s}
.sv-it.on .sv-ico svg,.sg-it:hover .sg-ico svg{filter:drop-shadow(0 0 10px rgba(238,241,244,.4))}
.sv-tx{position:relative;z-index:1}
.sv-tx h3{font-size:clamp(24px,2.6vw,36px);font-weight:600;line-height:1.15}
.sv-tx p{font-size:clamp(17px,1.4vw,20px);color:var(--mist);max-width:44ch;margin-top:12px}
.sv-ln{display:block;height:1px;width:min(220px,60%);margin-top:24px;background:linear-gradient(90deg,#f6f8fa,rgba(246,248,250,0));transform-origin:left;transform:scaleX(0)}
.sv-it.in .sv-ln{transform:none;transition:transform 1.2s .6s cubic-bezier(.2,.7,.2,1)}
html.svj .sv-n,html.svj .sv-ico,html.svj .sv-tx h3,html.svj .sv-tx p{opacity:0;transform:translateY(30px);transition:opacity .9s,transform 1.1s cubic-bezier(.2,.7,.2,1),background-position 1.3s cubic-bezier(.2,.7,.2,1)}
html.svj .sv-ico{transition-delay:.1s}
html.svj .sv-tx h3{transition-delay:.2s}
html.svj .sv-tx p{transition-delay:.35s}
html.svj .sv-it.in .sv-n,html.svj .sv-it.in .sv-ico,html.svj .sv-it.in .sv-tx h3,html.svj .sv-it.in .sv-tx p{opacity:1;transform:none}
html.svj .sv-ico svg *,html.svj .sg-ico svg *{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s cubic-bezier(.6,.1,.2,1) .35s}
html.svj .sv-it.in .sv-ico svg *,html.svj .sg-it.in .sg-ico svg *{stroke-dashoffset:0}
.sg{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(214,219,225,.1);border:1px solid rgba(214,219,225,.1);margin-top:clamp(36px,4vw,60px)}
.sg-it{position:relative;display:flex;flex-direction:column;gap:12px;padding:clamp(28px,3vw,44px);min-height:clamp(260px,21vw,320px);background:radial-gradient(110% 60% at 100% 0%,rgba(238,241,244,.07),transparent 62%),linear-gradient(180deg,#1a1c20,#141619);color:inherit;text-decoration:none;overflow:hidden;transition:background .5s}
.sg-it::before{content:"";position:absolute;inset:-1px;background:linear-gradient(115deg,transparent 35%,rgba(238,241,244,.09) 50%,transparent 65%);transform:translateX(-110%);pointer-events:none}
.sg-it.in::before{transform:translateX(110%);transition:transform 1.6s cubic-bezier(.4,.1,.2,1) calc(var(--d) + .5s)}
.sg-it:hover{background:radial-gradient(110% 60% at 100% 0%,rgba(238,241,244,.12),transparent 62%),linear-gradient(180deg,#1e2125,#16181b)}
.sg-ico svg{display:block;width:52px;height:52px}
.sg-it small{position:absolute;top:clamp(32px,3.2vw,48px);right:clamp(28px,3vw,44px);font-size:13px;letter-spacing:.18em;color:rgba(214,219,225,.5)}
.sg-it h3{font-size:clamp(20px,1.7vw,24px);font-weight:600;margin-top:18px}
.sg-it p{color:var(--mist);font-size:16px}
.sg-go{margin-top:auto;padding-top:8px;font-size:14px;font-weight:600;color:var(--silver);display:inline-flex;gap:8px;align-items:center}
.sg-go .arr{transition:transform .3s}
.sg-it:hover .sg-go .arr{transform:translateX(5px)}
html.svj .sg-it{opacity:0;transform:translateY(34px);transition:opacity .9s var(--d),transform 1.1s cubic-bezier(.2,.7,.2,1) var(--d),background .5s}
html.svj .sg-it.in{opacity:1;transform:none}
@media (max-width:900px){.sg{grid-template-columns:1fr 1fr}}
@media (max-width:720px){
.sv-it{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"n ico" "tx tx";gap:18px 20px;min-height:0;padding:34px 0}
.sv-n{grid-area:n;font-size:64px}.sv-ico{grid-area:ico;justify-self:end}.sv-tx{grid-area:tx}
.sv-ico svg{width:60px;height:60px}
.sg{grid-template-columns:1fr}.sg-it{min-height:0}
}
