/* Service (module) and area pages in the homepage style. Loaded after home.css / story.css / alive.css by service_pages.mjs.
   Hidden states exist only with html.sv-js (added by service.js), so without JS or with reduced motion everything is visible. */
.sv{--c:#4285f4;--cg:rgb(66 133 244/.55)}
.sv .sec{padding:92px 0}
.sv .sec-h{margin-bottom:44px}
.sv .sec-h h2{max-width:18em}
.sv .mut{color:var(--t2);font-size:15.5px;margin:0 0 14px}
.sv .note{font-size:13.5px;color:var(--t3);margin:0}
.sv .more{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14px;color:#8ab4ff;margin-top:auto}
.sv .more i{font-style:normal;transition:translate .3s var(--ease)}
a:hover>.more i,a:hover .more i{translate:4px 0}
.sv-h3{font:700 clamp(22px,2.2vw,28px)/1.15 Onest;letter-spacing:-.035em;margin:56px 0 14px}
.sv-i{display:block;flex:none}
.sv-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;background:rgb(255 255 255/.06);border:1px solid var(--line2);color:var(--c);margin-bottom:6px}
.sv-ic.bad{color:#ff8f86}
.sv-no{position:absolute;right:24px;top:24px;font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;color:var(--t3);text-transform:uppercase}
.sv-mk{display:grid;place-items:center;width:20px;height:20px}.sv-mk svg{width:100%;height:100%}
.sv-gtag{display:inline-block;align-self:flex-start;font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;background:rgb(255 255 255/.07);color:var(--t2);letter-spacing:.02em}

/* ---------- hero ---------- */
.sv-hero{overflow:hidden}
.sv-hero .sv-copy{position:relative;z-index:2}
.sv-stage{position:relative;z-index:1;perspective:1800px;padding:30px 18px 6px;animation:svrise 1.1s var(--ease) both}
@keyframes svrise{from{opacity:0;translate:0 50px}}
.sv-tilt{transform:rotateX(var(--rx,8deg)) rotateY(var(--ry,-12deg)) rotateZ(1.2deg);transform-style:preserve-3d;transition:transform .9s var(--ease)}
.sv-win{border-radius:var(--r-lg);overflow:hidden;background:#fff;box-shadow:0 60px 120px -40px rgb(0 0 0/.95),0 0 0 1px rgb(255 255 255/.14),0 0 90px -30px var(--cg)}
.sv-bar{display:flex;align-items:center;gap:7px;height:34px;padding:0 12px;background:#eef0f4;border-bottom:1px solid #dfe2e8}
.sv-bar i{flex:none;width:10px;height:10px;border-radius:50%}.sv-bar i:nth-child(1){background:#ff5f57}.sv-bar i:nth-child(2){background:#febc2e}.sv-bar i:nth-child(3){background:#28c840}
.sv-bar span{margin-left:12px;padding:4px 12px;border-radius:7px;background:#fff;font-size:12px;color:#5c6478;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.sv-scr{aspect-ratio:1700/1062;overflow:hidden;background:#f2f4f7}
.sv-scr img{width:100%;height:100%;object-fit:cover;object-position:top left}
.sv-exnote{margin:46px 0 0;font-size:12.5px;color:var(--t3);max-width:30em}
.sv-fc{position:absolute;z-index:3;display:flex;align-items:center;gap:11px;padding:12px 15px;border-radius:var(--r-lg);background:#fff;color:#0d1220;font-size:13px;font-weight:600;line-height:1.3;box-shadow:0 30px 60px -24px rgb(0 0 0/.85);animation:svpop .8s cubic-bezier(.34,1.56,.64,1) both,svbob 5s ease-in-out infinite alternate}
@keyframes svpop{from{opacity:0;scale:.6}}
@keyframes svbob{to{translate:0 -10px}}
.sv-fc .lg{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:var(--r-sm);background:#f2f4f7}
.sv-fc .lg img,.sv-fc .lg .sv-mk{width:20px;height:20px}
.sv-fc .t{display:block}.sv-fc .t small{display:block;font-weight:500;color:#5c6478;font-size:12px}
.sv-fc .t b{display:block;font:700 21px/1.1 Onest;letter-spacing:-.03em}
.sv-fc .t b.nm{font-size:14px;letter-spacing:0;color:#8a5300}
.sv-fc .ex{position:absolute;top:-10px;right:12px;background:#f2f4f7;border:1px dashed #b9c0cf;color:#4a5266;font-size:12px;line-height:1.2;padding:2px 7px}
.sv-fc .dot{flex:none;width:10px;height:10px;border-radius:50%;background:#34a853;box-shadow:0 0 0 0 rgb(52 168 83/.6);animation:ping 2s infinite}
.sv-fc .sv-lgs{display:flex;gap:6px;margin-top:6px}
.sv-lgs{display:flex;gap:6px;align-items:center}
.sv-lgs>span{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#fff;box-shadow:0 0 0 1px rgb(13 18 32/.1)}
.sv-lgs img{width:20px;height:20px}
.sv-spk{width:64px;height:24px;flex:none;overflow:visible;fill:none;margin-left:4px}
.sv-spk path{stroke:#34a853;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:svdraw 1.4s var(--ease) 1.4s forwards}
@keyframes svdraw{to{stroke-dashoffset:0}}
.sv-bars{width:44px;height:24px;flex:none;margin-left:4px}.sv-bars rect{fill:#c6dafc;transform-box:fill-box;transform-origin:bottom;animation:svgrow .7s var(--ease) 1.5s both}.sv-bars rect.hi{fill:#4285f4}
@keyframes svgrow{from{scale:1 0}}
.sv-fc.gm .th{flex:none;width:68px;border-radius:8px;overflow:hidden;box-shadow:0 0 0 1px rgb(13 18 32/.12)}.sv-fc.gm .th img{width:100%;height:auto}
.fc1{right:-1%;top:-1%;animation-delay:.7s,1.5s}
.fc2{left:-2%;bottom:15%;animation-delay:1.1s,2s}
.fc3{right:-2%;bottom:-1%;animation-delay:1.5s,2.4s}
.fc4{left:7%;top:0;animation-delay:1.9s,2.8s}
.fc3 .t small{margin-bottom:0}
@media(max-width:1300px){.fc1{right:0}.fc3{right:0}.fc2{left:0}}
@media(max-width:1000px){.sv-tile.tall{grid-row:auto}.fc3,.fc4{display:none}.sv-tilt{--rx:4deg;--ry:-6deg}.sv-stage{padding:26px 6px 0}.fc1{top:-2%}.fc2{bottom:12%}.sv-exnote{margin-top:34px}.sv-fc .t b{font-size:18px}}
@media(max-width:560px){.sv-fc{padding:9px 11px;gap:8px}.sv-fc .lg{width:26px;height:26px}.sv-fc .t b{font-size:16px}.sv-spk,.sv-bars{display:none}.sv-fc.gm .th{width:48px}}

/* ---------- page tabs ---------- */
.sv-tabs{margin:0 auto}
.sv-tabs a{display:flex;align-items:center;min-height:44px;white-space:nowrap}
.sv-tabs::-webkit-scrollbar{display:none}

/* ---------- sample proof strip ---------- */
.sv-app{border-radius:var(--r-xl);overflow:hidden;background:#fff;color:#0d1220;box-shadow:0 0 0 1px var(--line2),0 50px 100px -50px var(--cg)}
.sv-appbar{display:flex;align-items:center;gap:7px;min-height:38px;padding:6px 14px;background:#eef0f4;border-bottom:1px solid #dfe2e8;font-size:13px;font-weight:600;color:#3d4659}
.sv-appbar i{flex:none;width:10px;height:10px;border-radius:50%}.sv-appbar i:nth-child(1){background:#ff5f57}.sv-appbar i:nth-child(2){background:#febc2e}.sv-appbar i:nth-child(3){background:#28c840}
.sv-appbar span{margin-left:10px}.sv-appbar .ex{margin-left:auto;background:#fff;border:1px dashed #b9c0cf;color:#4a5266;white-space:nowrap}
.sv-rowh,.sv-row{display:grid;grid-template-columns:1.15fr .8fr 2fr .9fr;gap:18px;padding:0 24px;align-items:center}
.sv-rowh{padding-top:14px;padding-bottom:6px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#5c6478}
.sv-row{padding-top:18px;padding-bottom:18px;border-top:1px solid #e6e9f0;transition:background .3s}
.sv-row:hover{background:#f6f8fc}
.sv-lab{font-weight:600;font-size:16px}
.sv-val{font:700 clamp(24px,2.6vw,34px)/1.1 Onest;letter-spacing:-.04em;color:#0d1220}
.sv-row.nm .sv-val{font-size:18px;letter-spacing:-.01em;color:#8a5300}
.sv-src,.sv-upd{font-size:14.5px;color:#3d4659}
.sv-src small,.sv-upd small{display:none;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#5c6478;margin-bottom:2px}
.sv-rule{display:flex;align-items:center;gap:10px;margin:0;padding:14px 24px;background:#f2f6ff;border-top:1px solid #dfe6f5;font-size:13.5px;color:#27324b}
.sv-rule .live-dot{flex:none}
html.sv-js .sv-app .sv-row{opacity:0;translate:0 14px;transition:opacity .6s var(--ease),translate .7s var(--ease);transition-delay:calc(var(--i) * 90ms)}
html.sv-js .sv-app.in .sv-row{opacity:1;translate:0 0}
@media(max-width:820px){.sv-rowh{display:none}.sv-row{grid-template-columns:1fr 1fr;gap:6px 14px;padding:16px 18px}.sv-src{grid-column:1/-1}.sv-src small,.sv-upd small{display:block}.sv-upd{grid-column:1/-1}.sv-val{text-align:right}.sv-rule{padding:14px 18px}}

/* ---------- capabilities bento ---------- */
.sv-bento .tile{min-height:240px}
.sv-tile .tx{padding:28px 28px 26px;position:relative}
.sv-tile h3{margin:14px 0 8px}
.sv-tile .sv-no{right:28px;top:30px}
.sv-tile.tall{grid-row:span 2}
.sv-tile p{max-width:34em}
.sv-tile.c-b .shot.sv-cropshot{margin:6px 0 0 28px;min-height:230px;aspect-ratio:auto}
.sv-tile.tall .shot{min-height:300px}
.sv-conn{background:linear-gradient(160deg,#0d2b1b,#0f1726 62%)}
.sv-glance{background:linear-gradient(160deg,#2a1f0a,#141322 62%)}
.sv-logos{display:flex;flex-wrap:wrap;gap:8px;padding:0 28px 28px;margin-top:auto}
.sv-logos>span{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#fff}
.sv-logos img{width:26px;height:26px}
.sv-cnt{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;margin:0;padding:0 28px 28px;margin-top:auto}
.sv-cnt div{padding-top:12px;border-top:1px solid var(--line2)}
.sv-cnt dd{margin:0;font:700 38px/1 Onest;letter-spacing:-.05em;background:linear-gradient(90deg,#ffe08a,#fbbc05);-webkit-background-clip:text;background-clip:text;color:transparent}
.sv-cnt dt{order:2;font-size:12.5px;color:var(--t2);margin-top:4px}
.sv-cnt div{display:flex;flex-direction:column}

/* ---------- flow diagram ---------- */
.sv-flow{position:relative;display:grid;grid-template-columns:23.6% 1fr 23.6%;aspect-ratio:1000/420;margin-bottom:8px}
.sv-fl-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sv-ln{fill:none;stroke:rgb(138 180 255/.55);stroke-width:2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.sv-pk{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-dasharray:2.2 97.8;opacity:0;filter:drop-shadow(0 0 6px rgb(138 180 255/.9))}
.sv-flow.drawn .sv-pk{opacity:.95;animation:svpk 3.4s linear infinite;animation-delay:var(--d)}
@keyframes svpk{from{stroke-dashoffset:2.2}to{stroke-dashoffset:-100}}
.sv-fl-col{position:relative;z-index:1;display:grid;grid-template-rows:repeat(var(--n),1fr);min-width:0}
.sv-fn{align-self:center;display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:14px;background:var(--card);border:1px solid var(--line2);box-shadow:0 16px 36px -20px rgb(0 0 0/.9);min-width:0}
.sv-fn>span{min-width:0}
.sv-fn b{display:block;font-size:14px;line-height:1.25;font-weight:650}
.sv-fn small,.sv-st{display:block;font-size:12px;color:var(--t2);line-height:1.3;margin-top:2px}
.sv-st{display:inline-block;margin-top:3px;padding:1px 8px;border-radius:999px;background:rgb(255 255 255/.07);font-weight:700;color:var(--t2)}
.sv-st.built,.sv-chip em.live{background:rgb(52 168 83/.16);color:#7ee2a0}.sv-st.planned,.sv-chip em.next{background:rgb(251 188 5/.14);color:#ffd666}
.sv-fn.src>img,.sv-fn.src>.sv-mk{width:36px;height:36px;padding:6px;border-radius:10px;background:#fff;flex:none}
.sv-fn.out .sv-i{width:36px;height:36px;padding:7px;border-radius:10px;background:rgb(75 155 255/.14);color:#8ab4ff}
.sv-fl-col.l{grid-column:1}.sv-fl-col.r{grid-column:3}
.sv-fl-col.r .sv-fn{justify-self:start}
.sv-hubn{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:2;width:12.6%;min-width:110px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px}
.sv-hubi{display:grid;place-items:center;width:92px;height:92px;border-radius:26px;background:#0b0f19;border:1px solid var(--line2);box-shadow:0 0 0 10px rgb(66 133 244/.07),0 0 70px rgb(66 133 244/.4)}
.sv-hubi svg{width:52px;height:52px}
.sv-ring{position:absolute;left:50%;top:46px;width:92px;height:92px;translate:-50% -50%;border-radius:26px;border:2px solid rgb(66 133 244/.5);animation:svpulse 3s ease-out infinite;pointer-events:none}
@keyframes svpulse{to{scale:1.9;opacity:0}}
.sv-hubn b{margin-top:8px;font-size:15px}.sv-hubn small{font-size:12px;color:var(--t2);line-height:1.25}
.sv-fl-cap{margin:6px 0 0;color:var(--t2);font-size:14.5px;max-width:46em}
.sv-moves{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.sv-moves li{display:flex;flex-direction:column;gap:6px;padding:20px 20px 22px;border-radius:var(--r-lg);background:var(--card);border:1px solid var(--line);color:var(--t2);font-size:14.5px}
.sv-moves b{color:var(--t);font-size:17px;letter-spacing:-.02em}
.sv-mk2{align-self:flex-start;font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;padding:5px 9px;border-radius:7px;background:rgb(75 155 255/.14);color:#8ab4ff;text-transform:uppercase}
@media(max-width:900px){
  .sv-flow{display:flex;flex-direction:column;aspect-ratio:auto;gap:14px}
  .sv-fl-svg{display:none}
  .sv-fl-col{display:flex;flex-wrap:wrap;gap:10px}
  .sv-fl-col.r{display:grid;grid-template-columns:1fr 1fr}
  .sv-fn{align-self:auto}
  .sv-hubn{position:relative;left:auto;top:auto;translate:none;width:auto;margin:6px auto}
  .sv-hubn::before,.sv-hubn::after{content:"";display:block;width:2px;height:26px;background:linear-gradient(rgb(138 180 255/.7),rgb(138 180 255/.1))}
  .sv-hubn::before{margin-bottom:8px}.sv-hubn::after{margin-top:8px}
  .sv-ring{top:62px}
  .sv-moves{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){.sv-fl-col.r{grid-template-columns:1fr}.sv-moves{grid-template-columns:1fr}}

/* ---------- steps: sticky scroll timeline ---------- */
.sv-stwrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:start}
.sv-sticky{position:sticky;top:112px}
.sv-pan{position:relative;aspect-ratio:4/3.2;border-radius:var(--r-xl)}
.sv-pan .sv-pf{position:absolute;inset:0;opacity:0;scale:.96;translate:0 26px;transition:opacity .6s var(--ease),scale .8s var(--ease),translate .8s var(--ease);pointer-events:none}
.sv-pan .sv-pf.on{opacity:1;scale:1;translate:0 0}
.sv-pf{margin:0;position:relative;display:flex;flex-direction:column;justify-content:center}
.sv-pf.pho img{width:100%;height:100%;object-fit:cover;border-radius:var(--r-xl);box-shadow:0 0 0 1px var(--line2),0 50px 100px -50px var(--cg)}
.sv-pf.scr .sv-win img{width:100%;aspect-ratio:1700/1062;object-fit:cover;object-position:top left;height:auto}
.sv-pf figcaption{position:absolute;left:14px;bottom:14px;display:flex;align-items:center;gap:8px;max-width:calc(100% - 28px);padding:8px 12px;border-radius:12px;background:rgb(13 18 30/.88);backdrop-filter:blur(10px);border:1px solid var(--line2);font-size:13px;font-weight:600;line-height:1.3}
.sv-pf figcaption b{flex:none;color:#8ab4ff}
.sv-pf figcaption .ex{flex:none}
.sv-dots{display:flex;gap:8px;justify-content:center;margin-top:18px}
.sv-dots i{width:8px;height:8px;border-radius:99px;background:rgb(255 255 255/.2);transition:width .4s var(--ease),background .3s}
.sv-dots i.on{width:26px;background:#4b9bff}
.sv-list{list-style:none;margin:0;padding:0;position:relative;--p:1}
.sv-list::before,.sv-list::after{content:"";position:absolute;left:23px;top:26px;bottom:60px;width:2px;border-radius:2px}
.sv-list::before{background:var(--line)}
.sv-list::after{background:linear-gradient(#4b9bff,#34a853);transform-origin:top;scale:1 var(--p)}
.sv-list li{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr);gap:22px;min-height:46vh;padding-bottom:40px}
.sv-list li:last-child{min-height:0;padding-bottom:0}
.sv-sn{position:relative;z-index:1;display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:var(--bg2);border:1px solid var(--line2);font:700 18px Onest;transition:background .4s,border-color .4s,color .4s}
.sv-list li.on .sv-sn{background:#1870ec;border-color:#1870ec;color:#fff;box-shadow:0 0 0 6px rgb(24 119 242/.18)}
.sv-list h3{font:700 clamp(22px,2.4vw,30px)/1.12 Onest;letter-spacing:-.04em;margin:8px 0 10px}
.sv-list p{margin:0;color:var(--t2);font-size:16.5px;max-width:32em}
.sv-list .sv-pf.m{display:none}
html.sv-js .sv-list li{transition:opacity .5s}
html.sv-js .sv-list li:not(.on){opacity:.7}
@media(max-width:900px){
  .sv-stwrap{grid-template-columns:1fr;gap:0}
  .sv-sticky{display:none}
  .sv-list li{min-height:0;padding-bottom:44px;grid-template-columns:40px minmax(0,1fr);gap:16px}
  .sv-sn{width:40px;height:40px;border-radius:12px;font-size:16px}.sv-list::before,.sv-list::after{left:19px}
  .sv-list .sv-pf.m{display:flex;margin-top:18px;aspect-ratio:4/3}
  .sv-list .sv-pf.m.scr{aspect-ratio:auto}
  html.sv-js .sv-list li:not(.on){opacity:1}
}

/* ---------- photo band ---------- */
.sv-bandg{display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:230px 230px;gap:14px}
.sv-bandg figure{margin:0;position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--card)}
.sv-bandg .b0{grid-row:span 2}.sv-bandg .b3{grid-column:2/span 2}
.sv-bandg img{width:100%;height:100%;object-fit:cover}
.sv-bandg figcaption{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:8px;padding:7px 11px;border-radius:10px;background:#fff;color:#0d1220;font-size:12.5px;font-weight:600;box-shadow:0 14px 30px -12px rgb(0 0 0/.8)}
.sv-bandg figcaption b{font-size:12px;text-transform:uppercase;letter-spacing:.06em;padding:2px 6px;border-radius:5px;background:#f2f4f7;border:1px dashed #b9c0cf;color:#4a5266}
@media(max-width:900px){.sv-bandg{grid-template-columns:1fr 1fr;grid-template-rows:auto;grid-auto-rows:170px}.sv-bandg .b0{grid-column:span 2;grid-row:auto;height:230px}.sv-bandg .b3{grid-column:auto}}

/* ---------- mistakes and checklist ---------- */
.sv-xgrid{display:grid;grid-template-columns:1.1fr .9fr;gap:20px;align-items:start}
.sv-mist{display:grid;gap:14px}
.sv-card{position:relative;padding:24px 26px;border-radius:var(--r-lg);background:var(--card);border:1px solid var(--line)}
.sv-card .sv-no{right:24px;top:26px}
.sv-card h3{font:700 19px/1.2 Onest;letter-spacing:-.025em;margin:10px 0 6px}
.sv-card p{margin:0;color:var(--t2);font-size:15.5px}
.sv-cl{position:sticky;top:110px;padding:26px;border-radius:var(--r-lg);background:linear-gradient(160deg,#10224a,#0d1527 70%);border:1px solid rgb(66 133 244/.35)}
.sv-cl .cl{display:grid;grid-template-columns:64px 1fr;gap:18px;align-items:start}
.cl-ring{position:relative;width:64px;height:64px}.cl-ring svg{width:100%;height:100%;rotate:-90deg}
.cl-ring circle{fill:none;stroke:rgb(255 255 255/.12);stroke-width:4}
.cl-ring .cl-arc{stroke:#34a853;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .6s var(--ease)}
.cl-ring b{position:absolute;inset:0;display:grid;place-items:center;font-size:13px}
.cl-list{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.cl-list label{display:flex;gap:12px;align-items:flex-start;min-height:44px;padding:8px 0;cursor:pointer;color:var(--t2);font-size:15px}
.cl-list input{flex:none;appearance:none;width:22px;height:22px;margin:1px 0 0;border-radius:7px;border:1.5px solid var(--line2);background:rgb(255 255 255/.05);cursor:pointer;display:grid;place-items:center;transition:background .3s,border-color .3s}
.cl-list input:checked{background:#34a853 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' stroke='white' stroke-width='2.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat;border-color:#34a853}
.cl-list input:checked+span{color:var(--t);text-decoration:line-through;text-decoration-color:rgb(255 255 255/.35)}
@media(max-width:900px){.sv-xgrid{grid-template-columns:1fr}.sv-cl{position:static}.sv-cl .cl{grid-template-columns:1fr}}

/* ---------- limits, integrations, alternatives ---------- */
.sv-lgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.sv-panel{padding:28px;border-radius:var(--r-lg);background:var(--card);border:1px solid var(--line);display:flex;flex-direction:column}
.sv-panel h3{font:700 21px/1.15 Onest;letter-spacing:-.03em;margin:12px 0 12px}
.sv-panel a{color:#8ab4ff;text-decoration:underline;text-underline-offset:3px}
.sv-xl{list-style:none;margin:0;padding:0;display:grid;gap:12px;color:var(--t2);font-size:15.5px}
.sv-xl li{position:relative;padding-left:28px}
.sv-xl li::before{content:"";position:absolute;left:0;top:3px;width:18px;height:18px;border-radius:6px;background:rgb(234 67 53/.22) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 6l8 8M14 6l-8 8' stroke='%23ff8f86' stroke-width='2.4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat}
.sv-chips{display:flex;flex-wrap:wrap;gap:8px}
.sv-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px 0 10px;border-radius:12px;background:rgb(255 255 255/.06);border:1px solid var(--line);font-weight:600;font-size:14px;color:var(--t)!important;text-decoration:none!important;transition:background .3s,translate .3s var(--ease)}
.sv-chip:hover{background:rgb(255 255 255/.11);translate:0 -2px}
.sv-chip img,.sv-chip .sv-mk{width:26px;height:26px;padding:3px;border-radius:7px;background:#fff}
.sv-chip em{font-style:normal;font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px}
.sv-chips.big .sv-chip{padding:0 20px;font-size:15.5px}
@media(max-width:1000px){.sv-lgrid{grid-template-columns:1fr}}

/* ---------- related modules, area modules ---------- */
.sv-rcards,.sv-mgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.sv-rc,.sv-mc{color:inherit}
.sv-rth,.sv-mth{display:block;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.sv-rth::after,.sv-mth::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgb(16 23 39/.9))}
.sv-rth img,.sv-mth img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top left;transition:scale .8s var(--ease)}
.sv-rc:hover img,.sv-mc:hover img{scale:1.05}
.sv-rb{display:flex;flex-direction:column;gap:8px;padding:22px 24px 24px;flex:1}
.sv-rb b{font:700 21px/1.15 Onest;letter-spacing:-.03em}
.sv-rb>span:not(.sv-gtag):not(.more):not(.sv-mf){color:var(--t2);font-size:15px}
.sv-mf{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:10px}
.sv-mc:hover,.sv-rc:hover{box-shadow:0 26px 50px -26px var(--c)}
.sv-gstats{padding:0!important;margin-top:-10px}
.sv-gstats .stats-band{margin-bottom:0}
@media(max-width:1000px){.sv-rcards,.sv-mgrid{grid-template-columns:1fr}}
@media(min-width:601px) and (max-width:1000px){.sv-rcards,.sv-mgrid{grid-template-columns:1fr 1fr}}

/* ---------- guides rail ---------- */
.sv-railh{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.sv-rbtns{display:flex;gap:8px;margin-bottom:56px}
.sv-rbtns button{width:48px;height:48px;border-radius:14px;border:1px solid var(--line2);background:rgb(255 255 255/.06);color:var(--t);font-size:20px;cursor:pointer;transition:background .3s}
.sv-rbtns button:hover{background:rgb(255 255 255/.12)}
.sv-rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 18px;scrollbar-width:thin;scrollbar-color:rgb(255 255 255/.2) transparent}
.sv-gc{flex:0 0 min(360px,82vw);scroll-snap-align:start;display:flex;flex-direction:column;gap:10px;padding:26px;min-height:240px}
.sv-gc b{font:700 20px/1.2 Onest;letter-spacing:-.025em}
.sv-gc>span:not(.sv-gtag):not(.more){color:var(--t2);font-size:15px}
@media(max-width:700px){.sv-rbtns{display:none}}

/* ---------- faq, cta, area extras ---------- */
.sv-faq .faq{max-width:860px}
.faq details[open] .a{animation:svfade .45s var(--ease)}
@keyframes svfade{from{opacity:0;translate:0 -6px}}
.sv-cta-wrap{padding:20px 16px 90px}
.sv-cta-wrap .cta{margin-top:0}
.sv-quote{position:relative;margin:0;padding:38px 44px 38px 96px;border-radius:var(--r-xl);background:linear-gradient(160deg,#10224a,#0d1527 65%);border:1px solid rgb(66 133 244/.35)}
.sv-quote>span{position:absolute;left:34px;top:38px;display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:rgb(52 168 83/.2);color:#7ee2a0}
.sv-quote p{margin:0;font:600 clamp(20px,2.2vw,28px)/1.3 Onest;letter-spacing:-.03em;text-wrap:balance}
@media(max-width:700px){.sv-quote{padding:84px 22px 26px}.sv-quote>span{left:22px;top:24px}}
.sv-mc .sv-gtag{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sv-others .sv-chips{margin-top:4px}

/* ---------- focus, mobile polish, reduced motion ---------- */
.sv a:focus-visible,.sv button:focus-visible,.sv summary:focus-visible,.sv .sv-rail:focus-visible{outline:2px solid #4b9bff;outline-offset:3px}
@media(max-width:1000px){.sv-cta-wrap{padding:20px 0 70px}.sv .sec{padding:68px 0}.sv .sec-h{margin-bottom:32px}.sv-h3{margin-top:40px}}
@media(max-width:560px){.sv-tile .tx{padding:24px 22px 22px}.sv-logos,.sv-cnt{padding:0 22px 22px}.sv-tile.c-b .shot.sv-cropshot{margin-left:22px}.sv-panel{padding:22px}}
@media(prefers-reduced-motion:reduce){
  .sv-stage,.sv-fc,.sv-spk path,.sv-bars rect,.sv-ring,.sv-pk,.faq details[open] .a{animation:none!important}
  .sv-spk path{stroke-dashoffset:0}.sv-pk{display:none}
  .sv-tilt{transition:none}
  .sv-pan .sv-pf{transition:none}
}
