/* Home B — "Configurator" (light, quote-first) */
.hB{position:relative;isolation:isolate;overflow:hidden;padding-top:calc(var(--hdr-h) + clamp(28px,5vw,72px));padding-bottom:clamp(56px,8vw,120px)}
.hB::before{content:"";position:absolute;inset:0;z-index:-3;background:
  repeating-linear-gradient(0deg,transparent 0 95px,rgba(20,22,26,.05) 95px 96px),
  repeating-linear-gradient(90deg,transparent 0 95px,rgba(20,22,26,.05) 95px 96px);
  -webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.hB-slab{position:absolute;z-index:-2;inset-block:calc(var(--hdr-h) + 4px) 0;inset-inline-end:0;width:52%;background:var(--ink);clip-path:polygon(34% 0,100% 0,100% 100%,0 100%);opacity:1}
.hB-slab::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 0 40%,rgba(47,107,255,.35) 40% 41%,transparent 41%),radial-gradient(60% 50% at 70% 40%,rgba(47,107,255,.35),transparent 70%)}
.hB-k{position:absolute;z-index:-1;inset-block-end:-8%;inset-inline-start:-3%;width:clamp(220px,32vw,460px);color:#E4E9F2;--lg-ink:#E4E9F2;--lg-acc:#D5DDF0;pointer-events:none}
.hB-grid{display:grid;gap:clamp(30px,5vw,70px);align-items:center}
.hB-copy{position:relative}
.hB h1{font-size:clamp(50px,6.8vw,104px);line-height:.96;letter-spacing:-.03em;font-weight:800;margin:22px 0 clamp(18px,2vw,26px)}
.hB h1 .ln{display:block;overflow:hidden;padding-block:.05em;margin-block:-.05em}
.hB h1 .ln>span{display:block;animation:lnUp 1.1s var(--ease) both;animation-delay:calc(.2s + var(--i)*.14s)}
@keyframes lnUp{0%{transform:translateY(112%) rotate(2deg)}100%{transform:none}}
.rot{display:block;height:1.08em;overflow:hidden;color:var(--blue)}
.rot-t{display:block;animation:rot 21s var(--ease-io) 1.6s infinite}
.rot-t span{display:block;height:1.08em;white-space:nowrap}
@keyframes rot{0.00%,11.14%{transform:translateY(-0.00em)}14.29%,25.43%{transform:translateY(-1.08em)}28.57%,39.71%{transform:translateY(-2.16em)}42.86%,54.00%{transform:translateY(-3.24em)}57.14%,68.29%{transform:translateY(-4.32em)}71.43%,82.57%{transform:translateY(-5.40em)}85.71%,96.86%{transform:translateY(-6.48em)}100.00%,111.14%{transform:translateY(-7.56em)}}
.hB .lead{animation:fadeUp 1s var(--ease) .8s both}
.hB-pts{display:grid;gap:12px;margin-top:clamp(22px,3vw,34px);animation:fadeUp 1s var(--ease) 1s both}
.hB-pts li{display:flex;align-items:center;gap:14px;font-weight:600;font-size:17.5px}
.hB-pts .ic{width:30px;height:30px}
.hB-card{position:relative;isolation:isolate;animation:cardIn 1.2s var(--ease) .4s both}
@keyframes cardIn{0%{opacity:0;transform:translateY(60px)}100%{opacity:1;transform:none}}
.hB-card::before{content:"";position:absolute;inset:16px -16px -16px 16px;background:var(--blue);z-index:-1;clip-path:polygon(var(--cut) 0,100% 0,100% 100%,0 100%,0 var(--cut))}
.hB-in{background:var(--ink);color:#fff;padding:clamp(22px,3.2vw,40px);clip-path:polygon(var(--cut) 0,100% 0,100% 100%,0 100%,0 var(--cut));min-height:420px}
.hB-in .qf{min-height:380px}
@media(min-width:1000px){.hB-grid{grid-template-columns:1fr 1fr}.hB-card{margin-inline-start:clamp(0px,3vw,40px)}}
@media(max-width:999px){.hB-slab{display:none}.hB-card::before{inset:12px -10px -12px 10px}}

/* ribbon */
.rb{display:flex;gap:6px;overflow-x:auto;scroll-snap-type:x proximity;padding:4px var(--pad) 10px;scrollbar-width:none;margin-top:clamp(36px,5vw,64px)}
.rb::-webkit-scrollbar{display:none}
.rb a{flex:none;scroll-snap-align:start;display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:0 22px 0 20px;background:var(--card);font-weight:600;font-size:16.5px;box-shadow:0 1px 0 rgba(20,22,26,.06);transition:background .25s,color .25s,transform .35s var(--ease)}
.rb a .ic{width:30px;height:30px;transition:transform .4s var(--ease-b)}
.rb a:hover,.rb a:focus-visible{background:var(--ink);color:#fff;transform:translateY(-3px)}
.rb a:hover .ic{transform:scale(1.15) rotate(-5deg);--ic-d:#fff;--ic-p:var(--blue-2)}

/* sections */
.sec{padding-block:clamp(72px,10vw,150px);position:relative}
.sec-head{display:grid;gap:18px;margin-bottom:clamp(36px,5vw,68px);max-width:880px}

/* explorer */
.ex{display:grid;gap:22px}
.ex-list{display:grid;border-top:1px solid var(--line)}
.ex-i{position:relative;display:flex;align-items:center;gap:clamp(14px,2vw,26px);min-height:84px;padding:12px 6px;border-bottom:1px solid var(--line);text-align:start;width:100%;transition:padding .5s var(--ease),color .3s}
.ex-i .n{font-family:var(--f-lat);font-weight:800;font-size:14px;letter-spacing:.14em;color:#8a94a8;min-width:30px;transition:color .3s}
.ex-i .t{font-size:clamp(24px,3.4vw,44px);font-weight:800;letter-spacing:-.015em;line-height:1.1;flex:1}
.ex-i .ic{width:44px;height:44px;opacity:.5;transition:opacity .3s,transform .5s var(--ease-b)}
.ex-i::before{content:"";position:absolute;inset-inline:0;bottom:-1px;height:3px;background:var(--blue);transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease)}
.ex-i:hover,.ex-i:focus-visible,.ex-i.on{padding-inline-start:18px}
.ex-i.on::before,.ex-i:hover::before{transform:scaleX(1)}
.ex-i.on .n,.ex-i:hover .n{color:var(--blue-d)}
.ex-i.on .ic,.ex-i:hover .ic{opacity:1;transform:scale(1.1) rotate(-5deg)}
.ex-pv{display:none}
.ex-m{display:grid;gap:12px;padding:6px 6px 22px;border-bottom:1px solid var(--line)}
.ex-m p{color:var(--mut)}
@media(min-width:960px){
  .ex{grid-template-columns:1.15fr .85fr;gap:clamp(30px,5vw,80px);align-items:start}
  .ex-pv{display:block;position:sticky;top:calc(var(--hdr-h) + 24px)}
  .ex-m{display:none}
}
.pv{position:relative;display:grid;background:var(--ink);color:#fff;padding:clamp(28px,3vw,44px);min-height:460px;clip-path:polygon(var(--cut) 0,100% 0,100% 100%,0 100%,0 var(--cut));--ic-p:var(--blue-2)}
.pv-s{grid-area:1/1;display:flex;flex-direction:column;gap:18px;opacity:0;visibility:hidden;transform:translateY(24px);transition:opacity .4s,transform .6s var(--ease),visibility .4s}
.pv-s.on{opacity:1;visibility:visible;transform:none}
.pv-s .ic{width:110px;height:110px}
.pv-s h3{font-size:clamp(28px,2.6vw,38px)}
.pv-s p{color:#B9C1D0;font-size:17.5px}
.pv-s ul{display:grid;gap:10px;margin-block:4px 8px}
.pv-s li{display:flex;gap:12px;align-items:center;font-weight:500}
.pv-s li::before{content:"";width:18px;height:10px;flex:none;background:linear-gradient(var(--blue-2) 0 3px,transparent 3px 5px,#fff 5px)}
.pv-s .btn{margin-top:auto;align-self:flex-start}
.pv-s:not(.on){pointer-events:none}

/* steps */
.sp{display:grid;gap:clamp(30px,5vw,80px);align-items:start}
@media(min-width:960px){.sp{grid-template-columns:.8fr 1.2fr}.sp .sec-head{position:sticky;top:calc(var(--hdr-h) + 30px);margin:0}}
.sp .sec-head{margin-bottom:0}
.sp-l{display:grid}
.sr{position:relative;display:grid;grid-template-columns:auto 1fr;gap:6px clamp(18px,3vw,40px);padding-block:clamp(24px,3vw,38px);border-top:1px solid var(--line)}
.sr:last-child{border-bottom:1px solid var(--line)}
.sr .nn{grid-row:span 3;font-family:var(--f-lat);font-weight:800;font-size:clamp(60px,8vw,110px);line-height:.9;color:transparent;-webkit-text-stroke:1.5px rgba(20,22,26,.28);transition:color .6s,-webkit-text-stroke-color .6s}
.sr.is-in .nn{color:var(--blue);-webkit-text-stroke-color:var(--blue)}
.sr h3{font-size:clamp(24px,2.6vw,34px);align-self:end}
.sr p{color:var(--mut);max-width:40ch}
.sr .lk{width:56px;height:18px;margin:6px 0 0}
.lk{display:block;position:relative}
.lk i{position:absolute;inset-inline-start:0;height:6px;width:56px;transition:transform 1s var(--ease-io) .2s}
.lk i:first-child{top:0;background:var(--ink)}
.lk i:last-child{bottom:0;background:var(--blue);transform:translateX(20px)}
.is-in .lk i:last-child{transform:none}

/* band */
.bd{background:var(--ink);color:#fff;position:relative;overflow:hidden;isolation:isolate;--ic-p:var(--blue-2)}
.bd-k{position:absolute;inset-block-start:-20%;inset-inline-start:-6%;width:min(52vw,640px);color:#1E232C;--lg-ink:#1E232C;--lg-acc:#262D39;z-index:-1;pointer-events:none}
.bd-g{display:grid;gap:clamp(30px,5vw,80px);align-items:center}
.bd h2{font-size:clamp(40px,6.4vw,92px);font-weight:800;line-height:1}
.bd h2 em{font-style:normal;color:var(--blue-2)}
.bd-l{display:grid;gap:0}
.bd-l>div{display:grid;grid-template-columns:auto 1fr;gap:6px 22px;padding-block:24px;border-top:1px solid rgba(255,255,255,.14)}
.bd-l>div:last-child{border-bottom:1px solid rgba(255,255,255,.14)}
.bd-l .lk{grid-row:span 2;margin-top:10px;width:56px;height:18px}
.bd-l .lk i:first-child{background:#fff}
.bd-l .lk i:last-child{background:var(--blue-2)}
.bd-l h3{font-size:26px}
.bd-l p{color:#B1BAC9}
@media(min-width:960px){.bd-g{grid-template-columns:1fr 1fr}}

/* faq */
.faq-g{display:grid;gap:clamp(24px,4vw,60px);align-items:start}
@media(min-width:960px){.faq-g{grid-template-columns:.8fr 1.2fr}.faq-g .sec-head{position:sticky;top:calc(var(--hdr-h) + 30px);margin:0}}
.faq-g .sec-head{margin-bottom:0}
.fq{display:grid}
.fq details{border-bottom:1px solid var(--line)}
.fq details:first-child{border-top:1px solid var(--line)}
.fq summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:20px;justify-content:space-between;min-height:76px;padding-block:14px;font-size:clamp(19px,2.2vw,24px);font-weight:700;transition:color .25s}
.fq summary::-webkit-details-marker{display:none}
.fq summary:hover{color:var(--blue-d)}
.fq .pm{position:relative;width:30px;height:30px;flex:none}
.fq .pm::before,.fq .pm::after{content:"";position:absolute;inset-block-start:50%;inset-inline-start:50%;width:20px;height:3px;margin:-1.5px 0 0 -10px;background:currentColor;transition:transform .5s var(--ease-b)}
.fq .pm::after{background:var(--blue);transform:rotate(90deg)}
.fq details[open] .pm::after{transform:rotate(0)}
.fq details[open] .pm::before{transform:rotate(180deg)}
.fq .ans{padding:0 0 26px;color:var(--mut);max-width:62ch;animation:fadeUp .6s var(--ease) both}

/* contact card */
.cc{position:relative;overflow:hidden;background:var(--blue);color:#fff;padding:clamp(34px,6vw,84px);clip-path:polygon(var(--cut) 0,100% 0,100% 100%,0 100%,0 var(--cut));display:grid;gap:30px;align-items:center;margin-bottom:clamp(60px,9vw,120px)}
.cc h2{font-size:clamp(38px,6.4vw,92px);font-weight:800;line-height:1;letter-spacing:-.03em}
.cc p{font-size:clamp(18px,1.8vw,22px);margin-top:16px;color:rgba(255,255,255,.92);max-width:40ch}
.cc-a{display:grid;gap:10px}
.cc-k{position:absolute;inset-block-end:-30%;inset-inline-start:-4%;width:min(40vw,420px);color:var(--blue-d);--lg-ink:var(--blue-d);--lg-acc:#1A44B8;opacity:.6;pointer-events:none}
.cc>*{position:relative}
@media(min-width:900px){.cc{grid-template-columns:1.3fr .7fr}}
.cc .btn-ghost{border-color:rgba(255,255,255,.6);color:#fff;--sweep:#fff}
.cc .btn-ghost:hover{color:var(--blue-d)}
@media(max-width:959px){.hB-k,.bd-k{display:none}}

/* animated K in the dark band (own column) */
.bd-k{inset-block-start:50%;inset-inline-start:auto;inset-inline-end:auto;left:max(0px,calc(50% - 660px));translate:0 -50%;width:min(36vw,500px);color:inherit;--lg-ink:initial;--lg-acc:initial;opacity:1;z-index:0}
.bd-kh{--kh-max:500px}
@media(min-width:960px){.bd-g{padding-inline-end:min(38vw,520px);position:relative;z-index:1}}
