*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0}

:root{
  --paper:#f4f4f1; --surface:#ffffff; --surface-2:#fbfbf9;
  --ink:#0c0d10; --muted:#6c7077; --line:#e6e6e1;
  --accent:#2540ff; --accent-soft:rgba(37,64,255,.08); --accent-ink:#ffffff;
  --lime:#cdf522; --lime-ink:#0c0d10; --panel:#101218; --err:#e5484d;
  --fd:'Space Grotesk',system-ui,sans-serif;
  --fb:'Manrope',system-ui,sans-serif;
  --fm:'Space Mono',ui-monospace,monospace;
}
:root[data-theme="dark"]{
  --paper:#0a0b0d; --surface:#121317; --surface-2:#15171c;
  --ink:#f2f2ef; --muted:#9a9ea7; --line:#23262d;
  --accent:#5570ff; --accent-soft:rgba(85,112,255,.16); --accent-ink:#0a0b0d; --err:#ff6369;
}

@keyframes vfloat{0%,100%{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-16px) rotate(-1.2deg)}}
@keyframes vfloat2{0%,100%{transform:translateY(0) rotate(2.5deg)}50%{transform:translateY(14px) rotate(2.5deg)}}
@keyframes vspin{to{transform:rotate(360deg)}}
@keyframes vmarq{to{transform:translateX(-50%)}}
@keyframes vblob{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(30px,-20px) scale(1.1)}66%{transform:translate(-20px,20px) scale(.95)}}
@keyframes vgrad{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes vpulse{0%{box-shadow:0 0 0 0 var(--accent-soft)}70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
@keyframes vpulseL{0%{box-shadow:0 0 0 0 rgba(205,245,34,.5)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
@keyframes procflow{0%{background-position:-45% 0}100%{background-position:145% 0}}
@keyframes vbounce{0%{transform:translateY(0)}18%{transform:translateY(-44%)}38%{transform:translateY(0)}56%{transform:translateY(-21%)}72%{transform:translateY(0)}86%{transform:translateY(-8%)}100%{transform:translateY(0)}}
@keyframes fmarq{to{transform:translateX(-50%)}}
@keyframes n4float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-14px) rotate(-3deg)}}
@keyframes n4spin{to{transform:rotate(360deg)}}

.vgrad{background:linear-gradient(90deg,var(--accent),#7c5cff,#b06bff,#7c5cff,var(--accent));background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:vgrad 6s linear infinite}
.is-hidden{display:none!important}

.vhero{position:relative;overflow:hidden}
.vhero>*:not(.vdeco){position:relative;z-index:1}
.vblobdeco{position:absolute;border-radius:50%;pointer-events:none;z-index:0;background:radial-gradient(circle at 40% 40%,var(--accent-soft),transparent 70%);filter:blur(8px);animation:vblob 16s ease-in-out infinite}
.vpill{display:inline-flex;align-items:center;gap:9px;padding:7px 15px 7px 12px;border-radius:40px;background:var(--surface);border:1px solid var(--line);font-family:var(--fm);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:22px}
.vdot{width:7px;height:7px;border-radius:50%;background:var(--accent);animation:vpulse 2.4s ease-out infinite;flex:none}

@media (prefers-reduced-motion: no-preference){
  [data-reveal]{opacity:0;transform:translateY(32px);transition:opacity .85s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1)}
  [data-reveal].in{opacity:1;transform:none}
}

.vblueprint{background-color:transparent;background-image:
  linear-gradient(rgba(37,64,255,.05) 1px,transparent 1px),
  linear-gradient(90deg,rgba(37,64,255,.05) 1px,transparent 1px),
  linear-gradient(rgba(37,64,255,.085) 1px,transparent 1px),
  linear-gradient(90deg,rgba(37,64,255,.085) 1px,transparent 1px);
  background-size:34px 34px,34px 34px,170px 170px,170px 170px;background-position:center}
:root[data-theme="dark"] .vblueprint{display:none}

#vintro{display:none}
:root[data-intro="on"] #vintro{display:flex}

.scard{transition:transform .3s ease,border-color .3s ease}
.scard:hover{transform:translateY(-6px);border-color:var(--ink)}
.scard:hover .sarrow{transform:translate(4px,-4px)}
.sarrow{transition:transform .3s ease}

.ccard{transition:transform .35s ease}
.ccard:hover{transform:translateY(-6px)}
.ccard:hover .cthumb{transform:scale(1.05)}
.ccard:hover .ctitle{color:var(--accent)}
.cthumb{transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.ctitle{transition:color .25s ease}

.ccard.ccard-bordered:hover{transform:translateY(-5px);border-color:var(--ink)}
.ccard.ccard-bordered{transition:transform .3s ease,border-color .3s ease}

.bigcta:hover{transform:translateY(-2px)}
.bigcta{transition:transform .2s ease}

.vdotlime{width:7px;height:7px;border-radius:50%;background:var(--lime);animation:vpulseL 2.4s ease-out infinite;flex:none}
.procflow{position:absolute;top:0;left:0;height:100%;width:100%;background:linear-gradient(90deg,transparent 0%,rgba(85,112,255,.95) 42%,#cdf522 58%,transparent 100%);background-size:40% 100%;background-repeat:no-repeat;animation:procflow 3.2s linear infinite}
.procstep{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.procstep:hover{transform:translateY(-8px)}
.procnode{width:46px;height:46px;border-radius:50%;background:var(--panel);border:1px solid rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;font-family:var(--fm);font-size:14px;color:var(--lime);margin-bottom:22px;transition:transform .35s ease,background .35s ease,box-shadow .35s ease,color .35s ease,border-color .35s ease}
.procstep:hover .procnode{transform:scale(1.12);border-color:transparent;background:linear-gradient(135deg,var(--accent),#b06bff);color:#fff;box-shadow:0 0 0 6px var(--accent-soft)}
.procttl{transition:color .25s ease}
.procstep:hover .procttl{color:var(--lime)}

.vlink{position:relative}
.vlink::after{content:"";position:absolute;left:0;bottom:-4px;height:2px;width:0;background:var(--accent);transition:width .3s ease}
.vlink:hover::after{width:100%}
.vlink.is-active::after{width:100%}
.themetoggle[aria-pressed="true"]{border-color:var(--accent)!important}
.themetoggle[aria-pressed="true"] .themeknob{transform:translateX(26px)!important}
.themeknob .ic-moon{display:none}
.themetoggle[aria-pressed="true"] .ic-sun{display:none}
.themetoggle[aria-pressed="true"] .ic-moon{display:block}
.nav-cta:hover{transform:translateY(-2px)}
.menubtn{display:none}
.mobilemenu{display:none}
@media(max-width:880px){
  .navlinks{display:none!important}
  .menubtn{display:inline-flex!important}
  .nav-cta-desktop{display:none!important}
  .mobilemenu[data-open="true"]{display:flex!important}
}

.flink{transition:color .2s ease}
.flink:hover{color:var(--accent)!important}
.fmarq{display:flex;width:max-content;animation:fmarq 30s linear infinite}

.fbtn[aria-pressed="true"]{background:var(--ink)!important;color:var(--paper)!important;border-color:var(--ink)!important}

.tmember:hover .tphoto{transform:scale(1.04)}
.tphoto{transition:transform .4s ease}

.vinput{width:100%;font-family:var(--fb);font-size:16px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:15px 16px;outline:none;transition:border-color .2s ease}
.vinput::placeholder{color:var(--muted)}
.vinput:focus{border-color:var(--accent)}
.vinput.bad{border-color:var(--err)}
textarea.vinput{resize:vertical;min-height:120px;line-height:1.5}
select.vinput{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%236c7077' stroke-width='1.6'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.chiprow{transition:border-color .2s,background .2s}
.chip[aria-pressed="true"]{border-color:var(--accent)!important;background:var(--accent-soft)!important;color:var(--accent)!important}
.submitbtn:hover{transform:translateY(-2px)}
.submitbtn{transition:transform .2s ease}
.consentbox{position:relative;flex:none;transition:all .2s}
.consent[aria-pressed="true"] .consentbox,
.consent input:checked + .consentbox{background:var(--accent)!important;border-color:var(--accent)!important}
.consent[aria-pressed="true"] .consentbox::after,
.consent input:checked + .consentbox::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}

.codeinput{flex:1;font-family:var(--fm);font-size:16px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:16px 18px;outline:none;transition:border-color .2s}
.codeinput:focus{border-color:var(--accent)}
.codeinput::placeholder{color:var(--muted);letter-spacing:.12em}

.typecard{cursor:pointer;text-align:left;transition:border-color .2s ease,background .2s ease,transform .2s ease}
.typecard:hover{transform:translateY(-3px)}
.typecard[aria-pressed="true"]{border-color:var(--accent)!important;background:var(--accent-soft)!important}
.typecard[aria-pressed="true"] .tcicon{background:var(--accent)!important}
.typecard[aria-pressed="true"] .tcicon svg{stroke:var(--accent-ink)!important}
.seg[aria-pressed="true"]{background:var(--ink)!important;color:var(--paper)!important}
.optrow{cursor:pointer;transition:border-color .2s ease,background .2s ease}
.optrow:hover{border-color:var(--muted)}
.optrow[aria-pressed="true"]{border-color:var(--accent)!important;background:var(--accent-soft)!important}
.optbox{position:relative;flex:none}
.optrow[aria-pressed="true"] .optbox{background:var(--accent)!important;border-color:var(--accent)!important}
.optrow[aria-pressed="true"] .optbox::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid var(--accent-ink);border-width:0 2px 2px 0;transform:rotate(45deg)}
.pkgcard{transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.pkgcard:hover{transform:translateY(-6px);border-color:var(--ink)}
.pkgcard[aria-pressed="true"]{border-color:var(--accent)!important;box-shadow:0 22px 60px -26px var(--accent)}
.supcard{transition:transform .25s ease,border-color .25s ease}
.supcard:hover{transform:translateY(-5px);border-color:var(--ink)}
.faqitem summary{cursor:pointer;list-style:none}
.faqitem summary::-webkit-details-marker{display:none}
.faqitem[open] .faqplus{transform:rotate(45deg)}
.faqplus{transition:transform .25s ease}

@media(max-width:880px){
  [data-calc-grid]{grid-template-columns:1fr!important}
  #calc-result{position:static!important;top:auto!important}
}

.legal p{font-size:16px;line-height:1.65;color:var(--muted);margin:0 0 14px}
.legal h2{font-family:var(--fd);font-weight:600;font-size:22px;letter-spacing:-.01em;color:var(--ink);margin:38px 0 14px}
.legal ul{margin:0 0 14px;padding-left:20px;color:var(--muted);font-size:16px;line-height:1.65}
.legal li{margin-bottom:7px}

.n4link{transition:transform .2s ease}
.n4link:hover{transform:translateY(-2px)}

.fi-success{display:flex;align-items:center;gap:12px;background:var(--accent-soft);border:1px solid var(--accent);border-radius:16px;padding:16px 18px;color:var(--ink);font-size:15px;line-height:1.5;margin-bottom:20px}
.fi-success:empty{display:none}
.fi-error{background:color-mix(in srgb,var(--err) 12%,transparent);border:1px solid var(--err);border-radius:13px;padding:12px 15px;color:var(--err);font-size:13.5px;line-height:1.45;margin-bottom:4px}
.fi-error:empty{display:none}
.fi-err{color:var(--err);font-size:12.5px;margin-top:6px}
.fi-err:empty{display:none}
#quote-summary{display:none;gap:10px;background:var(--accent-soft);border:1px solid var(--accent);border-radius:13px;padding:13px 15px;font-size:13.5px;line-height:1.45;color:var(--ink)}
#quote-summary.show{display:flex}
