/* Pivelion Tech LLC - design system */
:root{
  --bg:#05060d; --bg2:#0a0c1a; --card:rgba(255,255,255,.04); --card-b:rgba(255,255,255,.09);
  --text:#e9ebf5; --muted:#9aa1bd; --dim:#6b7292;
  --a1:#7c5cff; --a2:#22d3ee; --a3:#f472b6;
  --grad:linear-gradient(120deg,#7c5cff 0%,#22d3ee 55%,#f472b6 100%);
  --r:20px; --max:1200px;
  --display:'Sora','Space Grotesk',system-ui,sans-serif; --body:'Inter',system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--body);background:var(--bg);color:var(--text);line-height:1.65;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%;display:block}
.container{width:min(var(--max),92%);margin-inline:auto}
section{padding:110px 0;position:relative}
h1,h2,h3,h4{font-family:var(--display);line-height:1.12;letter-spacing:-.02em}
h1{font-size:clamp(2.6rem,6.2vw,5rem);font-weight:700}
h2{font-size:clamp(2rem,4vw,3.2rem);font-weight:700}
h3{font-size:1.3rem;font-weight:600}
p{color:var(--muted)}
.grad{background:var(--grad);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 8s linear infinite}
@keyframes shine{to{background-position:200% center}}
.eyebrow{display:inline-flex;gap:8px;align-items:center;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--a2);font-weight:600;margin-bottom:18px}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--grad)}
.lead{font-size:1.2rem;max-width:640px}
.center{text-align:center}.center .lead,.center .sec-head p{margin-inline:auto}
.sec-head{max-width:720px;margin-bottom:60px}.sec-head.center{margin-inline:auto}
.sec-head p{margin-top:16px;font-size:1.1rem}

/* background */
.aurora{position:fixed;inset:0;z-index:-2;overflow:hidden;background:radial-gradient(ellipse at top,#10122a 0%,var(--bg) 60%)}
.aurora i{position:absolute;border-radius:50%;filter:blur(110px);opacity:.45;animation:float 22s ease-in-out infinite}
.aurora i:nth-child(1){width:560px;height:560px;background:#7c5cff;top:-160px;left:-120px}
.aurora i:nth-child(2){width:480px;height:480px;background:#22d3ee;top:30%;right:-160px;animation-delay:-8s;opacity:.28}
.aurora i:nth-child(3){width:520px;height:520px;background:#f472b6;bottom:-200px;left:30%;animation-delay:-14s;opacity:.22}
@keyframes float{50%{transform:translate(60px,-50px) scale(1.12)}}
.grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.gridbg{position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse at 50% 30%,#000 20%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000 20%,transparent 70%)}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;transition:.3s}
.nav.scrolled{background:rgba(5,6,13,.72);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--card-b)}
.nav .container{display:flex;align-items:center;justify-content:space-between;height:78px}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:1.3rem;letter-spacing:-.02em}
.logo svg{width:34px;height:34px}
.nav ul{display:flex;align-items:center;gap:34px;list-style:none;margin:0;padding:0}
.nav ul li{display:flex;align-items:center}
.nav ul a:not(.btn){display:inline-flex;align-items:center;font-size:.95rem;line-height:1.4;color:var(--muted);transition:.2s;position:relative;padding:8px 0}
.nav ul a:not(.btn):hover,.nav ul a:not(.btn).active{color:#fff}
.nav ul a:not(.btn).active::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;background:var(--grad);border-radius:2px}
.nav ul a.btn{flex-shrink:0;white-space:nowrap;line-height:1.4;color:#05060d}
.nav ul a.btn:hover{color:#05060d}
.burger{display:none;background:none;border:0;width:42px;height:42px;cursor:pointer;color:#fff}
.burger span{display:block;width:24px;height:2px;background:#fff;margin:5px auto;transition:.3s}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 28px;border-radius:999px;font-weight:600;font-size:.97rem;border:1px solid transparent;cursor:pointer;transition:.3s;font-family:var(--body)}
.btn-primary{background:var(--grad);background-size:160% auto;color:#05060d;box-shadow:0 10px 40px -10px rgba(124,92,255,.7)}
.btn-primary:hover{background-position:right center;transform:translateY(-2px);box-shadow:0 16px 50px -10px rgba(34,211,238,.6)}
.btn-ghost{background:var(--card);border-color:var(--card-b);color:#fff;backdrop-filter:blur(10px)}
.btn-ghost:hover{background:rgba(255,255,255,.09);transform:translateY(-2px)}
.btn-sm{padding:10px 22px;font-size:.9rem}

/* hero */
.hero{padding:190px 0 100px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}
.pill{display:inline-flex;gap:10px;align-items:center;padding:7px 16px;border-radius:999px;background:var(--card);border:1px solid var(--card-b);font-size:.85rem;color:var(--muted);margin-bottom:28px}
.pill b{width:8px;height:8px;border-radius:50%;background:#34d399;box-shadow:0 0 12px #34d399}
.hero h1{margin-bottom:26px}
.hero .actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:38px}
.trust{display:flex;gap:26px;flex-wrap:wrap;margin-top:44px;color:var(--dim);font-size:.88rem}
.trust span{display:flex;align-items:center;gap:8px}
.trust svg{width:18px;height:18px;color:var(--a2)}

/* mockup */
.mock{position:relative;perspective:1200px}
.window{background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.02));border:1px solid var(--card-b);border-radius:22px;padding:18px;backdrop-filter:blur(16px);box-shadow:0 40px 120px -30px rgba(124,92,255,.5);transform:rotateY(-8deg) rotateX(4deg);animation:bob 7s ease-in-out infinite}
@keyframes bob{50%{transform:rotateY(-8deg) rotateX(4deg) translateY(-14px)}}
.dots{display:flex;gap:7px;margin-bottom:16px}.dots i{width:11px;height:11px;border-radius:50%;background:#ff5f57}.dots i:nth-child(2){background:#febc2e}.dots i:nth-child(3){background:#28c840}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}
.kpi{background:rgba(255,255,255,.05);border-radius:14px;padding:12px 14px}
.kpi small{color:var(--dim);font-size:.72rem}.kpi strong{display:block;font-family:var(--display);font-size:1.25rem}
.kpi em{font-style:normal;font-size:.72rem;color:#34d399}
.chart{background:rgba(255,255,255,.04);border-radius:14px;padding:14px;height:170px}
.chart svg{width:100%;height:100%}
.chart path.line{stroke-dasharray:900;stroke-dashoffset:900;animation:draw 3s .5s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.rows{margin-top:12px;display:grid;gap:8px}
.row{display:flex;justify-content:space-between;align-items:center;background:rgba(255,255,255,.04);border-radius:12px;padding:10px 14px;font-size:.82rem}
.row span:last-child{color:#34d399}
.chip{position:absolute;background:rgba(15,17,34,.85);border:1px solid var(--card-b);backdrop-filter:blur(14px);border-radius:16px;padding:12px 16px;font-size:.82rem;display:flex;gap:10px;align-items:center;box-shadow:0 20px 50px -15px #000}
.chip.c1{left:-30px;bottom:50px;animation:bob2 6s ease-in-out infinite}
.chip.c2{right:-14px;top:-24px;animation:bob2 8s -3s ease-in-out infinite}
@keyframes bob2{50%{transform:translateY(-12px)}}
.chip svg{width:22px;height:22px;color:var(--a2)}

/* marquee */
.marquee{padding:34px 0;border-block:1px solid var(--card-b);background:rgba(255,255,255,.02);overflow:hidden}
.marquee .track{display:flex;gap:70px;width:max-content;animation:scroll 34s linear infinite}
.marquee span{font-family:var(--display);font-weight:600;color:var(--dim);font-size:1.15rem;white-space:nowrap}
@keyframes scroll{to{transform:translateX(-50%)}}

/* cards */
.grid{display:grid;gap:24px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--card);border:1px solid var(--card-b);border-radius:var(--r);padding:34px;position:relative;overflow:hidden;transition:.4s;backdrop-filter:blur(10px)}
.card::before{content:"";position:absolute;inset:0;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(124,92,255,.22),transparent 45%);opacity:0;transition:.4s;pointer-events:none}
.card:hover{transform:translateY(-6px);border-color:rgba(124,92,255,.5)}
.card:hover::before{opacity:1}
.card h3{margin:20px 0 10px}
.card p{font-size:.97rem}
.ico{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(124,92,255,.3),rgba(34,211,238,.2));border:1px solid var(--card-b)}
.ico svg{width:26px;height:26px;color:#fff}
.list{list-style:none;margin-top:18px;display:grid;gap:10px}
.list li{display:flex;gap:10px;color:var(--muted);font-size:.94rem}
.list li::before{content:"";flex:none;width:18px;height:18px;margin-top:3px;border-radius:50%;background:var(--grad);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.stat strong{font-family:var(--display);font-size:clamp(2.2rem,4vw,3.4rem);display:block}
.stat span{color:var(--muted);font-size:.95rem}

/* steps */
.steps{counter-reset:s}
.step{counter-increment:s}
.step::after{content:"0" counter(s);position:absolute;right:26px;top:18px;font-family:var(--display);font-size:3rem;font-weight:700;color:rgba(255,255,255,.05)}

/* pricing */
.toggle{display:inline-flex;background:var(--card);border:1px solid var(--card-b);border-radius:999px;padding:5px;margin-bottom:50px}
.toggle button{background:none;border:0;color:var(--muted);padding:10px 24px;border-radius:999px;cursor:pointer;font:600 .92rem var(--body);transition:.3s}
.toggle button.on{background:var(--grad);color:#05060d}
.toggle small{font-weight:700}
.price{display:flex;flex-direction:column}
.price.featured{border-color:rgba(124,92,255,.7);background:linear-gradient(180deg,rgba(124,92,255,.16),rgba(255,255,255,.03));transform:scale(1.03)}
.price.featured:hover{transform:scale(1.03) translateY(-6px)}
.badge{position:absolute;top:18px;right:18px;font-size:.72rem;font-weight:700;padding:5px 12px;border-radius:999px;background:var(--grad);color:#05060d}
.amount{font-family:var(--display);font-size:3.2rem;font-weight:700;margin:18px 0 4px}
.amount sup{font-size:1.3rem;vertical-align:top;position:relative;top:10px}
.amount small{font-size:1rem;color:var(--muted);font-weight:400}
.price .list{flex:1;margin-bottom:28px}
.note{font-size:.85rem;color:var(--dim);margin-top:26px}

/* faq */
.faq{max-width:820px;margin:auto;display:grid;gap:14px}
.faq details{background:var(--card);border:1px solid var(--card-b);border-radius:16px;padding:22px 26px;transition:border-color .3s,box-shadow .3s}
.faq details.is-open{border-color:rgba(124,92,255,.5);box-shadow:0 12px 40px -20px rgba(124,92,255,.45)}
.faq summary{cursor:pointer;font-weight:600;font-family:var(--display);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;user-select:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex-shrink:0;font-size:1.5rem;line-height:1;color:var(--a2);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.faq details.is-open summary::after{transform:rotate(45deg)}
/* Override browser rule that hides details content when not [open] */
.faq details>.faq-answer{display:block!important;max-height:0;overflow:hidden;opacity:0;transition:max-height .5s cubic-bezier(.2,.7,.2,1),opacity .35s ease}
.faq details.is-open>.faq-answer{opacity:1}
.faq .faq-answer-inner{padding-top:14px}
.faq .faq-answer-inner p{margin:0;color:var(--muted);line-height:1.65}
.faq .faq-answer-inner a{color:var(--a2)}

/* cta */
.cta{border-radius:32px;padding:80px 40px;text-align:center;background:radial-gradient(ellipse at top,rgba(124,92,255,.35),transparent 70%),var(--card);border:1px solid var(--card-b);overflow:hidden}
.cta p{margin:18px auto 34px;max-width:560px;font-size:1.1rem}

/* page header */
.page-head{padding:180px 0 70px;text-align:center}
.page-head p{max-width:680px;margin:20px auto 0;font-size:1.15rem}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:34px;align-items:stretch}
.contact-info{display:flex;flex-direction:column;justify-content:space-between;height:100%}
.info-item{display:flex;align-items:flex-start;gap:18px;padding-bottom:24px;margin-bottom:24px;border-bottom:1px solid var(--card-b)}
.info-item:last-child{padding-bottom:0;margin-bottom:0;border-bottom:0}
.info-item .ico{flex-shrink:0;margin-top:2px}
.info-body{flex:1;min-width:0}
.info-item h4{font-size:1rem;margin-bottom:8px;color:#fff}
.info-item a,.info-item p{color:var(--muted);line-height:1.65;font-size:.95rem}
.info-item a:hover{color:var(--a2)}
.hours-list{list-style:none;display:grid;gap:8px;margin:0}
.hours-list li{color:var(--muted);font-size:.94rem;line-height:1.55}
.hours-list li strong{color:#fff;font-weight:600}
.hours-list li:last-child{color:var(--dim);font-size:.88rem}
.contact-form-card{display:flex;flex-direction:column}
.form-head{margin-bottom:28px}
.form-head h3{margin:0 0 8px;font-size:1.35rem}
.form-head p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.55}
.contact-form{display:grid;gap:20px}
.contact-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-form label{font-size:.85rem;font-weight:500;color:var(--muted);display:grid;gap:10px}
.contact-form input,.contact-form textarea,.contact-form select{width:100%;background:rgba(255,255,255,.05);border:1px solid var(--card-b);border-radius:12px;padding:14px 16px;color:#fff;font:1rem var(--body);transition:border-color .3s,box-shadow .3s}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--dim)}
.contact-form select{appearance:none;-webkit-appearance:none;padding-right:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239aa1bd' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;cursor:pointer}
.contact-form select option{background:#0a0c1a;color:#fff}
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{outline:none;border-color:var(--a1);box-shadow:0 0 0 4px rgba(124,92,255,.2)}
.contact-form textarea{min-height:148px;resize:vertical;line-height:1.55}
.form-actions{display:grid;gap:12px;margin-top:4px}
.form-actions .btn{width:100%;justify-content:center;padding:15px 28px}
.form-msg{font-size:.9rem;color:#34d399;display:none;margin:0;line-height:1.5}
.form-note{font-size:.82rem;color:var(--dim);margin:0;line-height:1.5;text-align:center}
.form-note a{color:var(--a2)}

/* legal */
.legal{max-width:820px;margin:auto}
.legal h2{font-size:1.5rem;margin:44px 0 12px}
.legal p,.legal li{margin-bottom:12px;font-size:1rem}
.legal ul{padding-left:22px;color:var(--muted)}
.legal a{color:var(--a2)}
.legal .updated{color:var(--dim);font-size:.9rem}

/* footer */
footer{border-top:1px solid var(--card-b);padding:80px 0 34px;background:rgba(0,0,0,.25)}
.foot{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.3fr;gap:40px}
.foot h4{font-size:.95rem;margin-bottom:18px}
.foot ul{list-style:none;display:grid;gap:10px}
.foot a,.foot address{color:var(--muted);font-size:.93rem;font-style:normal}
.foot a:hover{color:#fff}
.foot .brand p{margin-top:16px;font-size:.93rem;max-width:300px}
.pay{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.pay span{font-size:.75rem;padding:6px 12px;border-radius:8px;border:1px solid var(--card-b);color:var(--muted);background:var(--card)}
.legalbar{margin-top:56px;padding-top:26px;border-top:1px solid var(--card-b);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:var(--dim);font-size:.85rem}

/* reveal */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}

@media(max-width:980px){
  .hero-grid,.contact-grid{grid-template-columns:1fr}
  .contact-form .form-row{grid-template-columns:1fr}
  .g3,.g4,.stats{grid-template-columns:repeat(2,1fr)}
  .foot{grid-template-columns:1fr 1fr}
  .mock{max-width:520px;margin:30px auto 0}
  .price.featured{transform:none}
  .burger{display:block}
  .nav ul{position:fixed;inset:78px 0 auto 0;flex-direction:column;gap:0;background:rgba(5,6,13,.97);backdrop-filter:blur(20px);padding:10px 6% 26px;border-bottom:1px solid var(--card-b);transform:translateY(-130%);transition:.4s;max-height:calc(100vh - 78px);overflow:auto}
  .nav ul.open{transform:none}
  .nav ul li{padding:14px 0;border-bottom:1px solid var(--card-b)}
  .nav .cta-nav{display:none}
}
@media(max-width:620px){
  section{padding:80px 0}
  .g2,.g3,.g4,.foot{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .chip{display:none}
  .hero{padding-top:140px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.chart path.line{stroke-dashoffset:0}.faq .faq-answer,.faq .faq-answer-inner{transition:none!important;transform:none!important}.faq details.is-open .faq-answer-inner{opacity:1}}
