:root{
  --ink:#0A0A0B;
  --paper:#FFFFFF;
  --soft:#F6F6F4;
  --volt:#C8F135;
  --line:rgba(0,0,0,.08);
  --muted:rgba(10,10,11,.58);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ font-size:17px; overflow-x:hidden; width:100%; -webkit-text-size-adjust:100%; }
body{
  font-family:'Inter',system-ui,sans-serif;
  font-size:1rem; line-height:1.65;
  color:var(--ink); background:var(--paper);
  overflow-x:hidden; width:100%;
  -webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:transparent;
}
img,iframe,video,svg,canvas{ max-width:100%; }
img,video{ height:auto; }
p,h1,h2,h3,h4,h5,h6,a,span,li,td,th{ overflow-wrap:break-word; word-wrap:break-word; }

.mono{ font-family:'JetBrains Mono',monospace; }

section[id]{ scroll-margin-top:92px; }

a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible{
  outline:2px solid var(--volt);
  outline-offset:3px;
  border-radius:8px;
}

/* ================= NAV ================= */
#nav{
  position:fixed; top:0; left:0; right:0; z-index:60;
  transition:background .35s ease, box-shadow .35s ease, border-color .35s ease, backdrop-filter .35s ease;
  border-bottom:1px solid transparent;
  background:rgba(7,7,10,.55);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
}
#nav .nav-link{ color:rgba(255,255,255,.78); transition:color .2s ease; position:relative; }
#nav .nav-link:hover{ color:#fff; }
#nav .nav-link::after{
  content:''; position:absolute; left:0; right:0; bottom:-4px; height:1px;
  background:currentColor; transform:scaleX(0); transform-origin:right;
  transition:transform .35s cubic-bezier(.2,.8,.2,1);
}
#nav .nav-link:hover::after{ transform:scaleX(1); transform-origin:left; }
#nav .logo-black{ display:none; }
#nav .logo-white{ display:block; }
#nav .nav-cta{ background:#fff; color:#0A0A0B; transition:background .3s ease,color .3s ease,transform .2s ease; }
#nav .nav-cta:hover{ transform:translateY(-1px); }
#nav .nav-burger{ border-color:rgba(255,255,255,.25); color:#fff; transition:all .3s ease; }

#nav.scrolled{
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom-color:var(--line);
  box-shadow:0 6px 24px -14px rgba(0,0,0,.2);
}
#nav.scrolled .nav-link{ color:rgba(10,10,11,.7); }
#nav.scrolled .nav-link:hover{ color:#0A0A0B; }
#nav.scrolled .logo-white{ display:none; }
#nav.scrolled .logo-black{ display:block; }
#nav.scrolled .nav-cta{ background:#0A0A0B; color:#fff; }
#nav.scrolled .nav-burger{ border-color:rgba(10,10,11,.15); color:#0A0A0B; }

/* ================= HERO ================= */
.hero{
  position:relative;
  display:flex; align-items:center; overflow:hidden;
  background:#07070a;
  padding:140px 0 120px;
  min-height:640px;
}
@media (min-width:1024px){
  .hero{ padding:170px 0 140px; min-height:720px; }
}

.hero-video{
  position:absolute; inset:0; z-index:0;
  width:100%; height:100%;
  object-fit:cover;
  opacity:.42;
  pointer-events:none;
  filter:saturate(1.05) contrast(1.05);
}
.hero-video-overlay{
  position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(900px 700px at 20% 25%, rgba(200,241,53,.18) 0%, transparent 55%),
    radial-gradient(800px 600px at 80% 30%, rgba(90,140,255,.14) 0%, transparent 55%),
    linear-gradient(180deg, rgba(7,7,10,.45) 0%, rgba(7,7,10,.78) 55%, #07070a 100%);
  pointer-events:none;
}
.hero-grid{
  position:absolute; inset:0; z-index:2; opacity:.14;
  background-image:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 65% 60% at 40% 50%, #000 20%, transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse 65% 60% at 40% 50%, #000 20%, transparent 72%);
  pointer-events:none;
}

.hero-eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  padding:8px 16px 8px 12px; border-radius:999px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  color:rgba(255,255,255,.85); font-size:.8125rem; font-weight:600;
}
.pulse-dot{
  width:8px;height:8px;border-radius:50%;background:var(--volt);
  box-shadow:0 0 0 0 rgba(200,241,53,.7); animation:pulse 2s infinite;
  flex:0 0 auto;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(200,241,53,.55); }
  70%{ box-shadow:0 0 0 12px rgba(200,241,53,0); }
  100%{ box-shadow:0 0 0 0 rgba(200,241,53,0); }
}

.hero-title{
  font-size:clamp(2.25rem, 7vw, 5rem);
  line-height:1.02; letter-spacing:-.045em;
  font-weight:800; color:#fff;
}
.hero-title em{ font-style:normal; color:var(--volt); }

.split-line{ display:block; overflow:hidden; padding-bottom:.08em; }
.split-line > span{
  display:inline-block; transform:translateY(110%) rotate(3deg);
  transition:transform 1s cubic-bezier(.2,.8,.2,1), opacity .85s ease;
  opacity:0;
}
.split-line.in > span{ transform:translateY(0) rotate(0deg); opacity:1; }

.scroll-hint{
  position:absolute; left:50%; bottom:24px; transform:translateX(-50%);
  color:rgba(255,255,255,.4); font-size:.6875rem;
  letter-spacing:.24em; text-transform:uppercase;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  z-index:3;
}
.scroll-hint .line{
  width:1px;height:38px;
  background:linear-gradient(to bottom, rgba(255,255,255,.5), transparent);
  animation:drop 2.2s ease-in-out infinite;
}
@keyframes drop{
  0%,100%{ transform:scaleY(.4); transform-origin:top; opacity:.4; }
  50%{ transform:scaleY(1); transform-origin:top; opacity:1; }
}

/* ================= MARQUEE ================= */
.marquee-wrap{
  position:relative; overflow:hidden; width:100%;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
          mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
.marquee{ display:flex; width:max-content; animation:marquee 40s linear infinite; }
.marquee-wrap:hover .marquee{ animation-play-state:paused; }
.marquee-item{ flex:0 0 auto; padding:0 22px; display:flex; align-items:center; justify-content:center; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.logo-tile{
  width:190px; height:88px; display:flex; align-items:center; justify-content:center;
  border-radius:16px; border:1px solid var(--line); background:#fff;
  transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.logo-tile:hover{
  transform:translateY(-4px); border-color:rgba(10,10,11,.22);
  box-shadow:0 18px 34px -20px rgba(0,0,0,.35);
}
.logo-tile img{
  max-width:120px; max-height:48px; width:auto;height:auto;
  object-fit:contain; filter:grayscale(1); opacity:.55;
  transition:filter .3s ease, opacity .3s ease;
}
.logo-tile:hover img{ filter:grayscale(0); opacity:1; }

/* ================= REVEAL ================= */
.reveal{
  opacity:0; transform:translateY(24px);
  transition:opacity .8s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1);
  will-change:opacity,transform;
}
.reveal.in{ opacity:1; transform:none; will-change:auto; }
.reveal[data-d="1"]{ transition-delay:.08s; }
.reveal[data-d="2"]{ transition-delay:.16s; }
.reveal[data-d="3"]{ transition-delay:.24s; }
.reveal[data-d="4"]{ transition-delay:.32s; }
.reveal[data-d="5"]{ transition-delay:.40s; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto !important; }
  .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
  .split-line > span{ transform:none !important; opacity:1 !important; }
  .marquee{ animation:none !important; }
  .hero-video{ display:none; }
  *{ transition-duration:.01ms !important; animation-duration:.01ms !important; }
}

body.menu-open{ overflow:hidden; }
#mobileMenu{ max-height:calc(100dvh - 68px); overflow-y:auto; -webkit-overflow-scrolling:touch; }

/* ================= CARDS ================= */
.card{
  background:#fff; border:1px solid var(--line); border-radius:20px;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, border-color .35s ease;
  position:relative; overflow:hidden;
}
.card:hover{
  transform:translateY(-5px); border-color:rgba(10,10,11,.16);
  box-shadow:0 24px 44px -28px rgba(0,0,0,.35);
}

.icon-badge{
  width:52px;height:52px; border-radius:15px;
  display:flex; align-items:center; justify-content:center;
  font-size:24px; background:var(--soft); border:1px solid var(--line);
  transition:transform .45s cubic-bezier(.2,.8,.2,1), background .3s ease, border-color .3s ease;
}
.card:hover .icon-badge{
  transform:rotate(-8deg) scale(1.08);
  background:var(--volt); border-color:transparent;
}

/* ================= FEATURE LISTS ================= */
.flist{ list-style:none; padding:0; margin:0; font-size:.875rem; line-height:1.5; }
.flist li{ display:flex; align-items:flex-start; gap:8px; padding:3px 0; }
.flist li::before{
  content:""; flex:0 0 auto; width:14px;height:14px; margin-top:3px;
  border-radius:50%; background-color:rgba(200,241,53,.28);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A0A0B' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size:9px 9px; background-position:center; background-repeat:no-repeat;
}
.flist.on-dark li::before{
  background-color:rgba(200,241,53,.22);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C8F135' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}

.feat-divider{
  display:flex; align-items:center; gap:10px;
  font-family:'JetBrains Mono',monospace; font-size:.625rem;
  font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  margin-top:14px; margin-bottom:6px; color:rgba(10,10,11,.4);
}
.feat-divider::after{ content:""; flex:1; height:1px; background:currentColor; opacity:.28; }
.feat-divider.volt{ color:#5f7a06; }
.on-dark .feat-divider{ color:rgba(255,255,255,.4); }
.on-dark .feat-divider.volt{ color:var(--volt); }

/* ================= FAQ ================= */
.faq-list{ max-width:820px; margin:0 auto; }
.faq-list details{
  background:#fff; border:1px solid var(--line); border-radius:14px;
  padding:16px 20px; margin-bottom:10px;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.faq-list details:hover{ border-color:rgba(10,10,11,.16); }
.faq-list details[open]{ border-color:rgba(10,10,11,.18); box-shadow:0 10px 24px -18px rgba(0,0,0,.3); }
.faq-list summary::-webkit-details-marker{ display:none; }
.faq-list summary{ list-style:none; cursor:pointer; }
.faq-list details[open] .chev{ transform:rotate(180deg); }
.chev{ transition:transform .25s ease; flex-shrink:0; }

/* ================= FORM ================= */
.fld{
  width:100%; padding:14px 16px; border-radius:12px;
  border:1px solid var(--line); background:#fff;
  font-size:.95rem; font-family:inherit; color:var(--ink);
  transition:border-color .2s ease, box-shadow .2s ease;
}
.fld::placeholder{ color:rgba(10,10,11,.32); }
.fld:focus{ outline:none; border-color:var(--ink); box-shadow:0 0 0 4px rgba(200,241,53,.35); }
.flabel{ font-size:.8125rem; font-weight:700; margin-bottom:7px; display:block; color:rgba(10,10,11,.72); }

/* ================= EYEBROW ================= */
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:'JetBrains Mono',monospace; font-size:.75rem; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:rgba(10,10,11,.42);
}
.eyebrow::before{ content:"";width:6px;height:6px;border-radius:50%;background:var(--volt); flex:0 0 auto; }
.on-dark .eyebrow{ color:rgba(255,255,255,.45); }

/* ================= BUTTONS ================= */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border-radius:999px; font-weight:700; font-size:.9375rem;
  padding:15px 30px; white-space:nowrap;
  transition:transform .2s ease, opacity .2s ease, background .25s ease, color .25s ease, box-shadow .3s ease;
  cursor:pointer; border:0;
  position:relative; overflow:hidden;
  text-align:center;
}
.btn:active{ transform:scale(.97); }
.btn:disabled{ opacity:.6; cursor:not-allowed; transform:none; }
.btn-dark{ background:var(--ink); color:#fff; }
.btn-dark:hover{ opacity:.88; box-shadow:0 12px 24px -12px rgba(10,10,11,.5); }
.btn-light{ background:#fff; color:var(--ink); }
.btn-light:hover{ opacity:.9; }
.btn-volt{ background:var(--volt); color:var(--ink); }
.btn-volt:hover{ filter:brightness(1.06); box-shadow:0 14px 30px -10px rgba(200,241,53,.5); }
.btn-ghost{ border:1px solid var(--line); color:var(--ink); background:transparent; }
.btn-ghost:hover{ background:rgba(10,10,11,.04); }
.btn-ghost-dark{ border:1px solid rgba(255,255,255,.22); color:#fff; background:transparent; }
.btn-ghost-dark:hover{ background:rgba(255,255,255,.08); }

/* ================= CURRENCY TOGGLE ================= */
.cur-switch{
  display:inline-flex; align-items:center; gap:2px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px; padding:4px;
}
.cur-btn{
  padding:8px 16px; border-radius:999px; border:0; background:transparent;
  font-family:'JetBrains Mono',monospace;
  font-size:12px; font-weight:700; letter-spacing:.05em;
  color:rgba(255,255,255,.65); cursor:pointer;
  transition:all .2s ease; line-height:1;
}
.cur-btn:hover{ color:#fff; }
.cur-btn.active{ background:#fff; color:#0A0A0B; }

/* ================= METRIC BAR ================= */
.metric-bar{
  height:5px; border-radius:999px; background:rgba(255,255,255,.1); overflow:hidden;
}
.metric-bar > span{
  display:block; height:100%; border-radius:999px;
  background:linear-gradient(90deg, var(--volt), #9fe019);
  transform-origin:left; transform:scaleX(0);
  transition:transform 1.4s cubic-bezier(.2,.8,.2,1) .3s;
}
.reveal.in .metric-bar > span{ transform:scaleX(var(--val, .8)); }

.step-card{
  position:relative;
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.step-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 44px -28px rgba(0,0,0,.3);
}

.answer-first{
  border-left:3px solid var(--volt);
  padding:14px 18px;
  background:rgba(200,241,53,.06);
  border-radius:0 12px 12px 0;
  font-size:.9375rem;
  line-height:1.65;
}
.on-dark .answer-first{
  background:rgba(200,241,53,.08);
  color:rgba(255,255,255,.85);
}

/* ================= PRICING CARD COMPACT ================= */
.price-card{ padding:26px 24px; }
.price-card .p-top{ font-size:2.25rem; }
.price-total{
  font-size:.8125rem;
  padding:10px 14px;
  border-radius:14px;
  line-height:1.4;
}
.price-guarantee{
  font-size:.75rem;
  padding:8px 12px;
  border-radius:12px;
  line-height:1.4;
}

/* ================= FOOTER ================= */
.footer-pulse{
  width:6px; height:6px; border-radius:50%; background:var(--volt);
  box-shadow:0 0 0 0 rgba(200,241,53,.7);
  animation:pulse 2s infinite;
  display:inline-block;
  flex:0 0 auto;
}
.foot-glow{
  position:absolute; border-radius:50%; pointer-events:none;
  filter:blur(0px);
}
.foot-ico{
  transition:background .3s ease, border-color .3s ease, transform .3s cubic-bezier(.2,.8,.2,1);
}

/* Compact contact rows */
.foot-line{
  border-bottom:1px solid rgba(255,255,255,.06);
  transition:padding-left .25s ease;
}
.foot-line:last-child{ border-bottom:0; }
.foot-line:hover{ padding-left:4px; }
.foot-line:hover .foot-ico{
  background:rgba(200,241,53,.14);
  border-color:rgba(200,241,53,.32);
}

/* ================= RESPONSIVE ================= */
@media (max-width:767px){
  .hero-video{ display:none; }
}

@media (max-width:640px){
  html{ font-size:16px; }
  .logo-tile{ width:150px; height:78px; }
  .logo-tile img{ max-width:100px; max-height:40px; }
  .marquee-item{ padding:0 14px; }
  .cur-btn{ padding:7px 12px; font-size:11px; }
  .hero-eyebrow{ font-size:.75rem; padding:7px 14px 7px 10px; }
}

@media (max-width:400px){
  .btn{ white-space:normal; padding-left:22px; padding-right:22px; }
}

@media (min-width:768px) and (max-width:1023px){
  .price-card{ padding:22px 18px; }
  .price-card .p-top{ font-size:1.875rem; }
  .price-total{ font-size:.75rem; padding:9px 12px; }
  .price-guarantee{ font-size:.6875rem; padding:7px 10px; }
}

@media (hover:none){
  .card:hover{ transform:none; box-shadow:none; border-color:var(--line); }
  .card:hover .icon-badge{ transform:none; background:var(--soft); border-color:var(--line); }
  .logo-tile:hover{ transform:none; box-shadow:none; border-color:var(--line); }
  .logo-tile:hover img{ filter:grayscale(1); opacity:.55; }
  .step-card:hover{ transform:none; box-shadow:none; }
  .faq-list details:hover{ border-color:var(--line); }
  #nav .nav-cta:hover{ transform:none; }
  .foot-line:hover{ padding-left:0; }
  .foot-line:hover .foot-ico{ background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.1); }
}