*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --coral:#E8321F;--aqua:#00AEEF;--bright:#00D4FF;
  --navy:#041E38;--deep:#062E52;--mid:#0A4A7A;
  --fd:'Bebas Neue',cursive;--fb:'DM Sans',sans-serif;
  --r:16px
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--fb);background:var(--navy);color:#fff;overflow-x:hidden}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}

/* SCENE */
#scene{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#sky{position:absolute;inset:0;background:linear-gradient(180deg,#3A96CC 0%,#6FC3E8 30%,#A8DCFC 65%,#DCF1FF 100%)}
#rays{position:absolute;width:300vmax;height:300vmax;left:50%;top:0;transform:translate(-50%,-50%);background:repeating-conic-gradient(from 0deg at 50% 50%,rgba(255,230,120,.07) 0deg 7deg,transparent 7deg 20deg);animation:rayspin 40s linear infinite}
@keyframes rayspin{to{transform:translate(-50%,-50%) rotate(360deg)}}
#sun{position:absolute;width:clamp(80px,22vw,140px);height:clamp(80px,22vw,140px);left:50%;top:8%;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,#FFFAE0 0%,#FFD23F 45%,rgba(255,180,0,0) 72%);box-shadow:0 0 50px 20px rgba(255,215,63,.35),0 0 120px 70px rgba(255,215,63,.1);animation:sunpulse 5s ease-in-out infinite}
@keyframes sunpulse{0%,100%{box-shadow:0 0 50px 20px rgba(255,215,63,.35),0 0 120px 70px rgba(255,215,63,.1)}50%{box-shadow:0 0 65px 28px rgba(255,215,63,.5),0 0 160px 90px rgba(255,215,63,.18)}}
#uwl{position:absolute;inset:0;opacity:0;background:linear-gradient(180deg,rgba(26,191,232,.6) 0%,rgba(10,80,130,.85) 15%,rgba(4,38,68,.96) 45%,rgba(2,18,36,1) 100%)}
#caustics{position:absolute;inset:0;opacity:0;overflow:hidden}
.ray{position:absolute;top:-5%;border-radius:4px;background:linear-gradient(180deg,rgba(0,210,255,.18),transparent 80%);transform-origin:top center;filter:blur(4px);animation:sway ease-in-out infinite alternate}
.ray:nth-child(1){left:8%;width:3px;height:55%;animation-duration:7s}
.ray:nth-child(2){left:20%;width:5px;height:70%;animation-duration:9s;animation-delay:.7s;opacity:.75}
.ray:nth-child(3){left:33%;width:3px;height:50%;animation-duration:6s;animation-delay:1.4s}
.ray:nth-child(4){left:50%;width:4px;height:65%;animation-duration:8s;animation-delay:.3s}
.ray:nth-child(5){left:65%;width:3px;height:58%;animation-duration:10s;animation-delay:1.1s}
.ray:nth-child(6){left:78%;width:5px;height:72%;animation-duration:7s;animation-delay:2s;opacity:.7}
.ray:nth-child(7){left:90%;width:3px;height:48%;animation-duration:9s;animation-delay:.5s}
@keyframes sway{from{transform:rotate(-10deg) scaleY(.88)}to{transform:rotate(10deg) scaleY(1.12)}}
#bubbles{position:absolute;inset:0;opacity:0;overflow:hidden}
.bub{position:absolute;border-radius:50%;background:radial-gradient(circle at 32% 30%,rgba(255,255,255,.9),rgba(255,255,255,.1));border:1px solid rgba(255,255,255,.35);animation:rise linear infinite}
.bub:nth-child(1){width:9px;height:9px;left:9%;bottom:-8%;animation-duration:9s}
.bub:nth-child(2){width:5px;height:5px;left:21%;bottom:-8%;animation-duration:12s;animation-delay:1.5s}
.bub:nth-child(3){width:11px;height:11px;left:36%;bottom:-8%;animation-duration:8s;animation-delay:3s}
.bub:nth-child(4){width:6px;height:6px;left:52%;bottom:-8%;animation-duration:14s;animation-delay:.8s}
.bub:nth-child(5){width:4px;height:4px;left:65%;bottom:-8%;animation-duration:7s;animation-delay:4s}
.bub:nth-child(6){width:8px;height:8px;left:78%;bottom:-8%;animation-duration:11s;animation-delay:2.2s}
.bub:nth-child(7){width:5px;height:5px;left:90%;bottom:-8%;animation-duration:10s;animation-delay:5.5s}
@keyframes rise{0%{opacity:0;transform:translateY(0)}5%{opacity:.9}90%{opacity:.6}100%{opacity:0;transform:translateY(-108vh) translateX(12px)}}
#fog{position:absolute;bottom:0;left:0;right:0;height:35%;background:linear-gradient(to top,rgba(2,12,26,.75),transparent);opacity:0}
#wsurf{position:absolute;left:-5%;width:110%;z-index:3;pointer-events:none;top:calc(100vh - 30px)}
#wsurf svg{display:block;width:100%;filter:drop-shadow(0 -6px 14px rgba(0,180,230,.55))}

/* NAV */
#nav{position:fixed;top:0;left:0;right:0;z-index:200;height:90px;padding:0 1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
#nav.scrolled{background:rgba(3,18,38,.93);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:rgba(0,174,239,.2)}
.nav-logo img{height:80px;width:auto;flex-shrink:0}
.btn-call{background:var(--coral);color:#fff;padding:.4rem .75rem;border-radius:100px;font-size:.72rem;font-weight:700;display:flex;align-items:center;gap:.25rem;white-space:nowrap;box-shadow:0 3px 14px rgba(232,50,31,.4);text-decoration:none;flex-shrink:0}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border-radius:100px;font-family:var(--fb);font-weight:700;cursor:pointer;text-decoration:none;transition:transform .15s,box-shadow .15s;-webkit-tap-highlight-color:transparent}
.btn:active{transform:scale(.96)}
.btn-primary{background:var(--coral);color:#fff;border:none;box-shadow:0 4px 20px rgba(232,50,31,.4);font-size:1.05rem;padding:1rem 2rem;width:100%}
.btn-ghost{background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.35);font-size:1rem;padding:.85rem 1.75rem;width:100%;backdrop-filter:blur(4px)}
.btn-white{background:#fff;color:var(--coral);font-size:1rem;padding:.9rem 2rem;box-shadow:0 4px 20px rgba(0,0,0,.2)}

/* CONTENT */
#content{position:relative;z-index:10}

/* HERO */
.hero{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;padding:0 1.25rem 80px;position:relative}
.hero-inner{display:flex;flex-direction:column;align-items:center;padding-top:160px;width:100%}
.trust-badge{display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.45);border-radius:100px;padding:.35rem .9rem;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--deep);margin-bottom:1.25rem;backdrop-filter:blur(6px)}
.trust-dot{width:7px;height:7px;border-radius:50%;background:#16a34a;animation:pdot 2s ease-in-out infinite;flex-shrink:0}
@keyframes pdot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.6)}}
.hero h1{font-family:var(--fd);font-size:clamp(3.2rem,13vw,5.5rem);line-height:.9;letter-spacing:.02em;color:var(--deep);text-shadow:0 2px 20px rgba(255,255,255,.6);margin-bottom:1rem}
.hero h1 em{color:#1ABFE8;display:block;font-style:normal}
.hero h1 strong{color:var(--coral);display:block;font-weight:900}
.hero-area{font-size:.8rem;font-weight:700;color:var(--mid);text-transform:uppercase;letter-spacing:.08em;margin-bottom:2rem;display:flex;align-items:center;justify-content:center;gap:.4rem;flex-wrap:wrap}
.hero-area::before{content:'📍';font-size:.9rem}
.hero-btns{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:340px;margin-bottom:2rem}

/* COMBINED TRUST GRID — replaces both stat tiles and proof strip */
.trust-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;width:100%;max-width:400px;margin-bottom:1.5rem}
.trust-tile{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);border-radius:14px;padding:.75rem .5rem;display:flex;align-items:center;gap:.6rem;backdrop-filter:blur(4px);cursor:pointer;transition:background .2s,border-color .2s,transform .15s;-webkit-tap-highlight-color:transparent}
.trust-tile:active{transform:scale(.96)}
.trust-tile.tapped{background:rgba(0,174,239,.4);border-color:var(--aqua);box-shadow:0 0 0 2px rgba(0,174,239,.35)}
.trust-tile-icon{font-size:1.4rem;flex-shrink:0;width:36px;text-align:center}
.trust-tile-text{text-align:left}
.trust-tile-val{font-family:var(--fd);font-size:1.5rem;color:var(--deep);line-height:1;transition:color .2s}
.trust-tile.tapped .trust-tile-val{color:#fff}
.trust-tile-label{font-size:.6rem;color:var(--mid);text-transform:uppercase;letter-spacing:.07em;line-height:1.2;transition:color .2s}
.trust-tile.tapped .trust-tile-label{color:rgba(255,255,255,.8)}

.scroll-cue{margin-top:.5rem;display:flex;flex-direction:column;align-items:center;gap:.3rem;font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(4,30,56,.45)}
.scroll-arr{width:24px;height:24px;border:2px solid rgba(4,30,56,.3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;animation:bob 1.8s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.hero-inner>*{animation:fadeUp .5s ease both}
.hero-inner .trust-badge{animation-delay:0s}
.hero-inner h1{animation-delay:.08s}
.hero-inner .hero-area{animation-delay:.14s}
.hero-inner .hero-btns{animation-delay:.2s}
.hero-inner .trust-grid{animation-delay:.28s}
.hero-inner .scroll-cue{animation-delay:.36s}

/* SECTIONS */
.sec{padding:3.5rem 1.25rem;position:relative;color:#fff}
.sec-inner{max-width:600px;margin:0 auto}
.eyebrow{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--bright);margin-bottom:.6rem}
.sec-title{font-family:var(--fd);font-size:clamp(2rem,8vw,3rem);line-height:.95;letter-spacing:.02em;margin-bottom:.9rem}
.sec-title span{color:var(--bright)}
.sec-body{font-size:.95rem;line-height:1.7;color:rgba(255,255,255,.65);margin-bottom:2rem}

/* STEPS */
.steps{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}
.step{display:flex;align-items:flex-start;gap:1rem;background:rgba(255,255,255,.05);border:1px solid rgba(0,174,239,.18);border-radius:var(--r);padding:1.1rem}
.step-num{width:36px;height:36px;flex-shrink:0;background:var(--aqua);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:1.1rem;color:#fff}
.step h4{font-size:.95rem;font-weight:700;margin-bottom:.2rem}
.step p{font-size:.82rem;color:rgba(255,255,255,.58);line-height:1.5}

/* SERVICES */
.svc-list{display:flex;flex-direction:column;gap:.75rem;margin-bottom:2rem}
.svc-item{display:flex;align-items:center;gap:1rem;background:rgba(255,255,255,.05);border:1px solid rgba(0,174,239,.15);border-radius:var(--r);padding:1rem 1.1rem}
.svc-icon{width:44px;height:44px;flex-shrink:0;background:rgba(0,174,239,.12);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.3rem}
.svc-item h3{font-size:.95rem;font-weight:700;margin-bottom:.15rem}
.svc-item p{font-size:.78rem;color:rgba(255,255,255,.52);line-height:1.4}
.tag{display:inline-block;margin-top:.3rem;padding:.15rem .6rem;border-radius:100px;font-size:.62rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(0,174,239,.16);color:var(--bright)}
.tag.urgent{background:rgba(232,50,31,.16);color:#ff6b5a}
.tag.free{background:rgba(22,163,74,.16);color:#4ade80}

/* WHY */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:2rem}
.why-card{background:rgba(255,255,255,.05);border:1px solid rgba(0,212,255,.12);border-radius:var(--r);padding:1.1rem;text-align:center}
.why-icon{font-size:1.6rem;margin-bottom:.5rem}
.why-card h4{font-size:.88rem;font-weight:700;margin-bottom:.25rem}
.why-card p{font-size:.75rem;color:rgba(255,255,255,.5);line-height:1.45}

/* PRICING */
.price-card{background:linear-gradient(135deg,rgba(0,60,110,.8),rgba(0,174,239,.25));border:1px solid rgba(0,174,239,.3);border-radius:20px;padding:1.75rem 1.5rem;text-align:center;margin-bottom:1.5rem;position:relative;overflow:hidden}
.price-card::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,rgba(0,174,239,.18),transparent 60%)}
.price-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.5);margin-bottom:.4rem;position:relative}
.price-from{font-family:var(--fd);font-size:3.5rem;color:#fff;line-height:1;position:relative}
.price-from sup{font-size:1.5rem;vertical-align:top;margin-top:.5rem}
.price-from span{font-size:1rem;font-family:var(--fb);font-weight:400;color:rgba(255,255,255,.5)}
.price-note{font-size:.78rem;color:rgba(255,255,255,.55);margin-top:.5rem;position:relative}
.price-includes{list-style:none;margin:1.25rem 0;text-align:left;display:flex;flex-direction:column;gap:.5rem;position:relative}
.price-includes li{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:rgba(255,255,255,.8)}
.price-includes li::before{content:'✓';color:#4ade80;font-weight:700;flex-shrink:0}

/* CTA BAND */
.cta-band{background:var(--coral);padding:3rem 1.25rem;text-align:center;position:relative;overflow:hidden}
.cta-band::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% -10%,rgba(255,140,60,.5),transparent 55%)}
.cta-band h2{font-family:var(--fd);font-size:clamp(1.8rem,7vw,3rem);color:#fff;margin-bottom:.5rem;position:relative}
.cta-band p{color:rgba(255,255,255,.85);margin-bottom:1.5rem;font-size:.95rem;position:relative}
.cta-band .btn-white{position:relative;width:100%;max-width:320px;font-size:1rem;padding:1rem;display:inline-flex}

/* REVIEWS */
.reviews{display:flex;flex-direction:column;gap:.9rem;margin-bottom:2rem}
.review-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);padding:1.1rem}
.review-stars{color:#FFD23F;font-size:.9rem;margin-bottom:.4rem}
.review-text{font-size:.85rem;line-height:1.6;color:rgba(255,255,255,.8);margin-bottom:.6rem;font-style:italic}
.review-author{font-size:.75rem;font-weight:700;color:rgba(255,255,255,.45)}

/* AREA PILLS */
.area-pills{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 2rem}
.pill{background:rgba(0,174,239,.12);border:1px solid rgba(0,174,239,.25);border-radius:100px;padding:.3rem .85rem;font-size:.78rem;color:rgba(255,255,255,.75)}

/* FAQ */
.faq{display:flex;flex-direction:column;gap:.6rem;margin-bottom:2rem}
.faq-item{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);overflow:hidden}
.faq-q{width:100%;text-align:left;background:none;border:none;color:#fff;font-family:var(--fb);font-size:.9rem;font-weight:700;padding:1rem 1.1rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:.75rem;-webkit-tap-highlight-color:transparent}
.faq-q .arrow{font-size:.7rem;transition:transform .25s;flex-shrink:0;color:var(--bright)}
.faq-item.open .arrow{transform:rotate(180deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease;font-size:.85rem;color:rgba(255,255,255,.62);line-height:1.65;padding:0 1.1rem}
.faq-item.open .faq-a{max-height:200px;padding:.25rem 1.1rem 1rem}

/* FRANCHISE */
.frx-card{background:linear-gradient(135deg,rgba(0,60,110,.8),rgba(0,174,239,.2));border:1px solid rgba(0,174,239,.28);border-radius:20px;padding:2rem 1.5rem;text-align:center}
.frx-card h3{font-family:var(--fd);font-size:2.2rem;margin-bottom:.5rem}
.frx-card p{font-size:.9rem;color:rgba(255,255,255,.65);margin-bottom:1.5rem;line-height:1.6}
.frx-pills{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;margin-bottom:1.5rem}
.frx-pill{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:100px;padding:.3rem .8rem;font-size:.73rem;color:rgba(255,255,255,.7)}

/* FOOTER */
footer{background:rgba(2,8,20,1);padding:2rem 1.25rem;border-top:1px solid rgba(0,174,239,.12);text-align:center;position:relative;z-index:10}
.foot-logo{font-family:var(--fd);font-size:1.5rem;color:#fff;margin-bottom:.3rem}
.foot-logo span{color:var(--aqua)}
footer p{font-size:.75rem;color:rgba(255,255,255,.3);line-height:1.6}
footer a{color:rgba(255,255,255,.4);margin:0 .5rem;font-size:.75rem}
.foot-links{margin-top:.75rem}

/* STICKY BAR */
#sticky-bar{position:fixed;bottom:0;left:0;right:0;z-index:300;background:rgba(3,12,28,.97);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid rgba(0,174,239,.2);padding:.75rem 1rem;display:flex;gap:.6rem;align-items:center;box-shadow:0 -4px 24px rgba(0,0,0,.35)}
#sticky-bar .btn{flex:1;padding:.85rem .5rem;font-size:.9rem;white-space:nowrap}
#sticky-bar .btn-s-call{background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.25);color:#fff}
#sticky-bar .btn-s-sms{background:var(--coral);color:#fff;border:none;box-shadow:0 4px 18px rgba(232,50,31,.4)}

/* REVEAL */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .55s ease,transform .55s ease}
.reveal.visible{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.18s}.d3{transition-delay:.26s}.d4{transition-delay:.34s}

/* DESKTOP */
@media(min-width:640px){
  .hero-btns{flex-direction:row;max-width:420px}
  .hero-btns .btn{width:auto;flex:1}
  .trust-grid{grid-template-columns:repeat(4,1fr)}
  .why-grid{grid-template-columns:repeat(4,1fr)}
  #sticky-bar{display:none}
  body{padding-bottom:0}
  .hero{justify-content:center}
  .hero-inner{padding-top:120px}
}
@media(min-width:900px){
  .sec-inner{max-width:760px}
  .svc-list{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
  .steps{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
}
