/* KVA puncture features v1 — remove the <link> to revert */
:root{--tread:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='16' viewBox='0 0 28 16'%3E%3Cpath d='M0 2 L7 8 L0 14 M14 2 L21 8 L14 14' fill='none' stroke='%2300344f' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
/* 1 tyre hero */
.kva-tyrebox{display:flex;align-items:center;gap:14px;height:104px;margin:-6px 0 6px}
.kva-tyre{width:104px;height:104px;flex:none;overflow:visible}
.kva-tyre .spin{transform-origin:60px 60px}
.kva-psst{font:800 15px/1 Poppins,Inter,sans-serif;color:#ffd08a;letter-spacing:.06em;background:rgba(255,255,255,.08);border:1px solid rgba(255,208,138,.35);padding:8px 12px;border-radius:999px}
.kva-psst b{color:#fff}
.kva-pz-go .kva-tyre-roll{animation:kvaRoll 1.1s cubic-bezier(.2,.75,.25,1) both}
.kva-pz-go .kva-tyre .spin{animation:kvaSpin 1.1s cubic-bezier(.2,.75,.25,1) both}
.kva-pz-go .kva-tyre .nail{animation:kvaNail 1.1s 1.1s both}
.kva-pz-go .kva-tyre .plug{animation:kvaPop .35s 1.95s both}
.kva-pz-go .kva-tyre .puff circle{animation:kvaPuff .8s 1.95s both}
.kva-pz-go .kva-tyre .spark{animation:kvaSpark .6s 1.95s both}
.kva-pz-go .kva-psst{animation:kvaPsst 1.6s 1.95s both}
.kva-pz-go .hero-copy h1,.kva-pz-go .hero-copy>p{animation:kvaRise .7s 2.35s both}
.kva-pz-go .hero-copy .cta{animation:kvaRise .7s 2.55s both}
@keyframes kvaRoll{from{transform:translateX(-180px);opacity:0}25%{opacity:1}to{transform:none}}
@keyframes kvaSpin{from{transform:rotate(-400deg)}to{transform:none}}
@keyframes kvaNail{0%{transform:translateY(-46px);opacity:0}20%{opacity:1}40%{transform:none}75%{transform:none;opacity:1}100%{transform:translateY(-30px) rotate(25deg);opacity:0}}
@keyframes kvaPop{from{transform:scale(0);opacity:0}to{transform:none;opacity:1}}
@keyframes kvaPuff{0%{opacity:0;transform:scale(.3)}10%{opacity:.9;transform:scale(.5)}100%{opacity:0;transform:scale(2.4) translateY(-8px)}}
@keyframes kvaSpark{0%{opacity:0;transform:scale(.2) rotate(0)}40%{opacity:1;transform:scale(1.25) rotate(40deg)}100%{opacity:0;transform:scale(.6) rotate(90deg)}}
@keyframes kvaPsst{0%{opacity:0;transform:translateX(-10px)}20%,100%{opacity:1;transform:none}}
@keyframes kvaRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.kva-tyre .plug,.kva-tyre .puff circle,.kva-tyre .spark{transform-box:fill-box;transform-origin:center}
/* 2 kit finder */
.kva-finder{max-width:1180px;margin:34px auto 6px;padding:0 24px}
.kva-finder .fh{display:flex;align-items:end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.kva-finder h2{margin:0;font-size:30px;letter-spacing:-.6px;color:#0f1b24}.kva-finder .fh p{margin:4px 0 0;color:#5c6b77}
.kva-veh{display:flex;gap:10px;flex-wrap:wrap}
.kva-veh button{display:flex;align-items:center;gap:8px;height:50px;padding:0 18px;border-radius:14px;border:1.5px solid #d5e0e7;background:#fff;color:#00344f;font:800 15px Inter,sans-serif;cursor:pointer;transition:.2s}
.kva-veh button svg{width:30px;height:20px}
.kva-veh button[aria-pressed=true]{background:#00344f;color:#fff;border-color:#00344f;box-shadow:0 10px 22px rgba(0,52,79,.22)}
.kva-kit{position:relative;display:grid;grid-template-columns:260px 1fr;gap:26px;align-items:center;background:#fff;border-radius:24px;padding:18px 26px 18px 18px;box-shadow:0 18px 40px rgba(15,27,36,.08);overflow:hidden}
.kva-kit::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:var(--tread) repeat-x 0 50%/22px 12px;opacity:.18}
.kva-kit img{width:100%;height:220px;object-fit:contain;background:#f6f8fb;border-radius:18px;cursor:pointer}
.kva-kit .tag{display:inline-block;background:#fff3e6;color:#c96400;font:800 12px Inter,sans-serif;letter-spacing:.08em;padding:6px 10px;border-radius:999px}
.kva-kit h3{margin:10px 0 4px;font-size:26px;letter-spacing:-.5px}.kva-kit .why{color:#5c6b77;margin:0 0 10px;line-height:1.5}
.kva-kit .pr{font:800 26px Poppins,sans-serif;color:#00344f}.kva-kit .pr s{font:600 15px Inter,sans-serif;color:#94a3ae;margin-left:8px}
.kva-kit .acts{max-width:420px}
.kva-kit.swap{animation:kvaRise .45s both}
/* 3 tread dividers */
.kva-tread{height:18px;max-width:1180px;margin:22px auto;background:var(--tread) repeat-x 0 50%/28px 16px;opacity:.13;-webkit-mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent)}
#grid .p{position:relative;overflow:hidden}
#grid .p::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:var(--tread) repeat-x 0 50%/18px 10px;opacity:.1;pointer-events:none;transition:opacity .25s}
#grid .p:hover::after{opacity:.35}
/* 4 timeline */
#how.kva-howgrid{display:grid;grid-template-columns:400px 1fr;gap:20px 48px;align-items:start;max-width:1180px;margin-left:auto;margin-right:auto}
#how.kva-howgrid .howvid{grid-row:1/span 3;margin:0;width:100%}
#how.kva-howgrid>.head,#how.kva-howgrid>.kva-tl{grid-column:2}
#how.kva-howgrid .steps{display:none}
.kva-tl{position:relative}
.kva-gaugebar{display:flex;align-items:center;gap:14px;margin:6px 0 22px}
.kva-gaugebar .tube{position:relative;flex:1;height:26px;border-radius:999px;background:#e8eef2;overflow:hidden;box-shadow:inset 0 2px 5px rgba(0,0,0,.08)}
.kva-gaugebar .fill{position:absolute;inset:0;width:0;border-radius:999px;background:linear-gradient(90deg,#00344f,#0a6fa6 55%,#F4840F);transition:width 2.4s cubic-bezier(.3,.7,.2,1)}
.kva-gaugebar .fill::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='16' viewBox='0 0 28 16'%3E%3Cpath d='M0 2 L7 8 L0 14 M14 2 L21 8 L14 14' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") repeat-x 0 50%/22px 13px;opacity:.28}
.kva-gaugebar .psi{font:800 18px Poppins,sans-serif;color:#00344f;min-width:86px;text-align:right}.kva-gaugebar .psi small{font:600 12px Inter,sans-serif;color:#5c6b77}
.kva-steps4{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.kva-steps4 li{position:relative;background:#fff;border-radius:20px;padding:18px 18px 18px 78px;box-shadow:0 10px 26px rgba(15,27,36,.06);border:1.5px solid transparent;opacity:.45;transform:translateY(8px);transition:opacity .45s,transform .45s,border-color .45s,box-shadow .45s}
.kva-steps4 li.on{opacity:1;transform:none;border-color:#ffd9b0;box-shadow:0 14px 30px rgba(244,132,15,.12)}
.kva-steps4 .ic{position:absolute;left:16px;top:18px;width:48px;height:48px;border-radius:14px;background:#00344f;display:grid;place-items:center}
.kva-steps4 li.on .ic{background:#F4840F}
.kva-steps4 .ic svg{width:28px;height:28px}
.kva-steps4 .t{font:800 12px Inter,sans-serif;letter-spacing:.08em;color:#c96400}
.kva-steps4 h3{margin:2px 0 4px;font-size:18px}.kva-steps4 p{margin:0;color:#5c6b77;font-size:14px;line-height:1.45}
/* 5 gauges */
.stats.kva-dials>div{display:flex;flex-direction:column;align-items:flex-start}
.kva-dial{width:78px;height:46px;display:block;margin-bottom:4px;overflow:visible}
.kva-dial .val{stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset 1.6s cubic-bezier(.3,.7,.2,1)}
.kva-dial .ndl{transform-origin:40px 40px;transform:rotate(-90deg);transition:transform 1.6s cubic-bezier(.3,.7,.2,1)}
/* 6 puncture now */
.btn.kva-sos{background:#fff;color:#c0262d;border:0;display:inline-flex;align-items:center;gap:8px}
.btn.kva-sos::before{content:"";width:9px;height:9px;border-radius:50%;background:#e23b3b;box-shadow:0 0 0 0 rgba(226,59,59,.6);animation:kvaPing 1.6s infinite}
@keyframes kvaPing{70%{box-shadow:0 0 0 10px rgba(226,59,59,0)}100%{box-shadow:0 0 0 0 rgba(226,59,59,0)}}
.kva-sosfab{display:none}
.kva-sheet{position:fixed;inset:0;z-index:90;display:flex;align-items:flex-end;justify-content:center;background:rgba(6,20,30,.5);opacity:0;pointer-events:none;transition:opacity .25s}
.kva-sheet.open{opacity:1;pointer-events:auto}
.kva-sheet .bx{width:min(100%,460px);background:#fff;border-radius:26px 26px 0 0;padding:12px 20px calc(18px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .3s cubic-bezier(.2,.8,.2,1);box-shadow:0 -20px 50px rgba(0,0,0,.2)}
.kva-sheet.open .bx{transform:none}
.kva-sheet .grab{width:44px;height:5px;border-radius:9px;background:#d5e0e7;margin:0 auto 14px}
.kva-sheet h3{margin:0 0 4px;font-size:22px}.kva-sheet p{margin:0 0 16px;color:#5c6b77}
.kva-sheet a,.kva-sheet button.go{display:flex;align-items:center;gap:12px;width:100%;box-sizing:border-box;min-height:58px;padding:0 18px;border-radius:16px;border:0;margin-bottom:10px;font:800 16px Inter,sans-serif;text-decoration:none;cursor:pointer}
.kva-sheet .wa2{background:#25D366;color:#fff}.kva-sheet .fk{background:#00344f;color:#fff}
.kva-sheet .kva-x{position:static;width:auto;height:auto;display:block;margin:4px auto 0;background:none;border:0;color:#5c6b77;font:700 14px Inter,sans-serif;cursor:pointer;padding:8px}
@media(min-width:801px){.kva-sheet{align-items:center}.kva-sheet .bx{border-radius:26px;transform:translateY(30px)}}
@media(max-width:800px){
 .kva-tyrebox{height:76px;gap:10px}.kva-tyre{width:76px;height:76px}.kva-psst{font-size:13px}
 .kva-finder{padding:0 16px;margin-top:24px}.kva-finder h2{font-size:24px}
 .kva-veh{width:100%;display:grid;grid-template-columns:repeat(3,1fr)}.kva-veh button{flex-direction:column;justify-content:center;gap:2px;height:66px;padding:0 6px;font-size:13px}
 .kva-kit{grid-template-columns:1fr;padding:14px;gap:12px}.kva-kit img{height:200px}.kva-kit h3{font-size:22px}
 #how.kva-howgrid{grid-template-columns:1fr}#how.kva-howgrid .howvid{grid-row:auto;max-width:420px;margin:0 auto}#how.kva-howgrid>.head,#how.kva-howgrid>.kva-tl{grid-column:1}
 #how.kva-howgrid .howvid{order:3}
 .kva-steps4{grid-template-columns:1fr}
 .kva-dial{width:64px;height:38px}
 .hero .cta .kva-sos{display:none}
 .kva-sosfab{display:flex;align-items:center;gap:8px;position:fixed;left:14px;bottom:16px;z-index:44;height:52px;padding:0 18px 0 14px;border-radius:999px;border:0;background:#e23b3b;color:#fff;font:800 15px Inter,sans-serif;box-shadow:0 12px 28px rgba(226,59,59,.38);cursor:pointer}
 .kva-sosfab::before{content:"";width:9px;height:9px;border-radius:50%;background:#fff;animation:kvaPing 1.6s infinite}
}
@media(prefers-reduced-motion:reduce){
 .kva-pz-go .kva-tyre-roll,.kva-pz-go .kva-tyre *,.kva-pz-go .kva-psst,.kva-pz-go .hero-copy *{animation:none!important}
 .kva-steps4 li{opacity:1;transform:none;transition:none}.kva-gaugebar .fill,.kva-dial .val,.kva-dial .ndl{transition:none}
 .btn.kva-sos::before,.kva-sosfab::before{animation:none}
}
.kva-tyre .nail,.kva-tyre .puff circle,.kva-tyre .spark{opacity:0}
.kva-steps4 h3{color:#0f1b24}
.how .kva-gaugebar .psi{color:#fff}.how .kva-gaugebar .psi small{color:#a9c4d4}
.how .kva-gaugebar .tube{background:rgba(255,255,255,.1);box-shadow:inset 0 2px 6px rgba(0,0,0,.25)}
.hero .cta{flex-wrap:wrap}.hero .cta .btn{white-space:nowrap}
.kva-kit img{width:220px;height:220px;justify-self:center}
@media(max-width:800px){.kva-kit img{width:100%;height:200px}}
