*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,Arial,sans-serif;background:#f8fbff;color:#111827}
a{text-decoration:none;color:inherit}
.topbar{height:86px;background:#050b1e;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 8%;border-bottom:1px solid rgba(255,255,255,.1);position:sticky;top:0;z-index:100}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:45px;height:45px;border-radius:14px;background:linear-gradient(135deg,#2563eb,#8b5cf6);display:grid;place-items:center;font-size:26px;font-weight:900}
.brand strong{display:block;font-size:25px}
.brand small{display:block;color:#cbd5e1;font-size:12px}
.nav{display:flex;align-items:center;gap:32px;font-weight:800}
.nav a{position:relative}
.nav a.active:after,.nav a:hover:after{content:"";position:absolute;left:0;right:0;bottom:-18px;height:4px;border-radius:5px;background:#7c3aed}
.start-btn,.logout-btn{padding:15px 28px;border-radius:10px;background:linear-gradient(135deg,#7c3aed,#2563eb);font-weight:900;color:white;border:0;cursor:pointer}
.menu{display:none;background:rgba(255,255,255,.1);border:0;color:white;font-size:26px;padding:8px 12px;border-radius:10px}

.hero{min-height:560px;background:radial-gradient(circle at 65% 40%,rgba(37,99,235,.35),transparent 30%),linear-gradient(135deg,#040817,#06153a);color:white;display:grid;grid-template-columns:1fr 1.05fr;gap:50px;padding:70px 9%;overflow:hidden}
.pill,.section-label{display:inline-flex;letter-spacing:2px;text-transform:uppercase;font-weight:900;font-size:13px;color:#8b5cf6;background:rgba(124,58,237,.15);padding:9px 16px;border-radius:999px;margin-bottom:20px}
.hero h1{font-size:clamp(44px,6vw,76px);line-height:1.05;letter-spacing:-3px;margin-bottom:22px}
.hero h1 span,.pricing-intro h2 span{background:linear-gradient(135deg,#8b5cf6,#0ea5e9);-webkit-background-clip:text;color:transparent}
.hero-desc{font-size:19px;line-height:1.7;color:#cbd5e1;max-width:650px}
.feature-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:30px 0}
.feature-row div{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);padding:12px;border-radius:10px}
.feature-row b{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:rgba(124,58,237,.35);font-size:20px}
.feature-row span{font-weight:800;color:#e5e7eb}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 30px;border-radius:10px;font-weight:900;transition:.25s}
.btn:hover,.buy:hover{transform:translateY(-4px)}
.primary{background:linear-gradient(135deg,#7c3aed,#2563eb);color:white;box-shadow:0 15px 35px rgba(37,99,235,.35)}
.outline{border:1px solid rgba(255,255,255,.28);color:white;margin-left:14px}

.hero-right{position:relative;min-height:430px}
.laptop{position:absolute;right:90px;top:80px;width:450px;transform:perspective(900px) rotateY(-8deg)}
.laptop-screen{height:245px;background:#101827;border:6px solid #2c3448;border-radius:14px;padding:16px;box-shadow:0 35px 70px rgba(0,0,0,.55)}
.dots{display:flex;gap:5px;margin-bottom:12px}.dots i{width:8px;height:8px;border-radius:50%;background:#ef4444}.dots i:nth-child(2){background:#f59e0b}.dots i:nth-child(3){background:#22c55e}
pre{color:#67e8f9;font-size:13px;line-height:1.7;white-space:pre-wrap}
.laptop-base{height:28px;background:linear-gradient(#7b8496,#2c3448);border-radius:0 0 30px 30px}
.phone{position:absolute;right:30px;top:170px;width:120px;height:230px;background:#111827;border:5px solid #334155;border-radius:28px;padding:15px;color:white;box-shadow:0 25px 60px rgba(0,0,0,.5)}
.phone-top{width:40px;height:5px;background:#475569;border-radius:99px;margin:0 auto 12px}
.app-title{font-weight:900;font-size:13px;margin-bottom:12px}
.app-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.app-grid span{height:34px;border-radius:8px;background:linear-gradient(135deg,#2563eb,#8b5cf6)}
.chart{height:48px;margin-top:16px;border-radius:12px;background:linear-gradient(135deg,#93c5fd,#7c3aed)}
.report-card,.bug-card{position:absolute;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(14px);border-radius:14px;padding:18px;color:white;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.top-report{left:20px;top:45px;width:180px}.check{width:45px;height:45px;border-radius:50%;background:#86efac;color:#052e16;display:grid;place-items:center;font-size:28px;font-weight:900;margin:14px 0}
.bug-card{right:0;top:45px;width:190px}.bug-card p,.report-card p{color:#dbeafe;font-size:13px;margin-top:8px}
.plant{position:absolute;right:-20px;bottom:55px;font-size:90px}

.pricing-intro{text-align:center;padding:35px 20px 20px;background:white}
.pricing-intro h2{font-size:42px;letter-spacing:-1.5px;margin-bottom:12px}
.pricing-intro p{color:#475569}
.price-wrap{display:grid;grid-template-columns:repeat(5,1fr);gap:22px;padding:15px 8% 60px;background:white}
.price-card{background:white;border:1px solid #e5e7eb;border-radius:12px;padding:18px;position:relative;box-shadow:0 15px 35px rgba(15,23,42,.08);transition:.25s}
.price-card:hover{transform:translateY(-10px)}
.price-card.purple{border-color:#ddd6fe}.price-card.blue{border-color:#bfdbfe}.price-card.green{border-color:#bbf7d0}.price-card.orange{border-color:#fed7aa}.price-card.red{border-color:#fecaca}
.art{height:165px;border-radius:12px;margin-bottom:16px;background:#f5f3ff;display:grid;place-items:center;overflow:hidden;position:relative}
.browser-img{width:140px;height:95px;border-radius:10px;background:linear-gradient(135deg,#f5f3ff,#ddd6fe);border-top:18px solid #7c3aed;display:grid;place-items:center;font-size:42px;box-shadow:0 15px 25px rgba(124,58,237,.18)}
.server-art{background:#eff6ff}.server{width:110px;height:90px;border-radius:12px;background:linear-gradient(#2563eb,#1e40af);box-shadow:25px 20px 0 #bfdbfe}.database{position:absolute;right:45px;bottom:42px;width:70px;height:80px;border-radius:50% 50% 12px 12px;background:#64748b}
.app-art{background:#f0fdf4}.mobile-art{width:85px;height:130px;border-radius:18px;background:#111827;color:#22c55e;font-size:50px;display:grid;place-items:center}.android{font-size:58px;margin-left:15px}
.test-art{background:#fff7ed}.magnify{font-size:82px}.checklist{font-size:35px;background:white;padding:12px 24px;border-radius:12px;color:#16a34a}
.patch-art{background:#fff1f2}.shield,.gear{font-size:72px}
.mini-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#7c3aed;color:white;font-weight:900;margin-top:-38px;position:relative}
.price-card h3{font-size:22px;margin-top:14px}.price-card p{font-size:15px;line-height:1.5;color:#334155;margin:8px 0 14px}
.price-card ul{list-style:none;display:grid;gap:8px;font-size:13px;color:#111827}.price-card li:before{content:"✓";margin-right:8px;color:#2563eb;font-weight:900}
.price{font-size:36px;font-weight:900;margin:28px 0 12px}.purple .price{color:#7c3aed}.blue .price{color:#2563eb}.green .price{color:#16a34a}.orange .price{color:#f97316}.red .price{color:#f43f5e}
.buy{height:42px;border-radius:8px;color:white;display:flex;align-items:center;justify-content:center;font-weight:900}.purple-btn{background:#7c3aed}.blue-btn{background:#2563eb}.green-btn{background:#16a34a}.orange-btn{background:#f97316}.red-btn{background:#f43f5e}

.stats{margin:0 8% 60px;background:#050b1e;color:white;border-radius:12px;display:grid;grid-template-columns:repeat(4,1fr);padding:26px;box-shadow:0 25px 50px rgba(15,23,42,.2)}
.stats div{display:flex;flex-direction:column;align-items:center;border-right:1px solid rgba(255,255,255,.2)}.stats div:last-child{border-right:0}.stats b{font-size:28px}.stats span{color:#cbd5e1}
.contact{text-align:center;padding:65px 8%;background:linear-gradient(135deg,#050b1e,#111b46);color:white}.contact h2{font-size:42px}.contact p{color:#cbd5e1;margin:14px 0 25px}
footer{background:#050b1e;color:white;padding:25px 8%;text-align:center}.copyright{color:#94a3b8;font-size:13px}

.auth-body{background:linear-gradient(135deg,#050b1e,#111b46);min-height:100vh}
.auth-page{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr}
.auth-visual{padding:55px 8%;color:white;position:relative;overflow:hidden;background:radial-gradient(circle at 70% 30%,rgba(124,58,237,.35),transparent 35%)}
.auth-text{margin-top:120px;max-width:620px}
.auth-text h1{font-size:clamp(42px,6vw,72px);line-height:1.02;letter-spacing:-3px;margin-bottom:20px}
.auth-text p{font-size:19px;color:#cbd5e1;line-height:1.7}
.auth-card-glow{position:absolute;right:70px;bottom:80px;width:230px;padding:28px;border-radius:24px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);box-shadow:0 30px 80px rgba(0,0,0,.25);backdrop-filter:blur(14px);display:grid;gap:8px}
.lock-icon{width:60px;height:60px;border-radius:18px;background:linear-gradient(135deg,#7c3aed,#2563eb);display:grid;place-items:center;font-size:28px}
.auth-card-glow span{color:#cbd5e1}
.auth-box{background:white;margin:auto;width:min(480px,calc(100% - 32px));border-radius:28px;padding:36px;box-shadow:0 30px 90px rgba(0,0,0,.28)}
.back-link{display:inline-block;color:#2563eb;font-weight:800;margin-bottom:24px}
.auth-box h2{font-size:34px;margin-bottom:8px}
.muted{color:#64748b;line-height:1.6;margin-bottom:24px}
.auth-form{display:grid;gap:12px}
.auth-form label{font-weight:800;color:#111827}
.auth-form input{height:54px;border:1px solid #dbe4f0;border-radius:14px;padding:0 16px;font-size:16px;outline:none}
.auth-form input:focus{border-color:#2563eb;box-shadow:0 0 0 4px rgba(37,99,235,.12)}
.auth-form button,.resend-form button{height:54px;border:0;border-radius:14px;background:linear-gradient(135deg,#7c3aed,#2563eb);color:white;font-weight:900;font-size:16px;cursor:pointer;margin-top:8px}
.otp-input{text-align:center;letter-spacing:10px;font-size:26px!important;font-weight:900}
.resend-form button{background:#f1f5f9;color:#0f172a;width:100%;margin-top:14px}
.alert{padding:14px;border-radius:14px;margin-bottom:18px;font-weight:700}
.alert.error{background:#fee2e2;color:#991b1b}
.alert.success{background:#dcfce7;color:#166534}

.dashboard{min-height:calc(100vh - 86px);background:linear-gradient(135deg,#050b1e,#111b46);padding:70px 8%;color:white}
.dashboard-card{max-width:980px;margin:auto;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:30px;padding:50px;box-shadow:0 30px 90px rgba(0,0,0,.25)}
.dashboard-card h1{font-size:54px;margin-bottom:12px}
.dashboard-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:15px;margin-top:35px}
.dashboard-grid div{background:white;color:#0f172a;border-radius:18px;padding:22px;text-align:center}
.dashboard-grid b{font-size:30px;display:block;color:#2563eb}
.dashboard-grid span{color:#475569;font-weight:800}

.reveal{opacity:0;transform:translateY(28px);transition:.7s ease}.reveal.active{opacity:1;transform:translateY(0)}.delay{transition-delay:.15s}

@media(max-width:1100px){.hero,.auth-page{grid-template-columns:1fr}.hero-right{min-height:460px}.price-wrap{grid-template-columns:repeat(2,1fr)}.feature-row,.stats,.dashboard-grid{grid-template-columns:repeat(2,1fr)}.auth-visual{min-height:520px}.auth-box{margin:30px auto}}
@media(max-width:780px){.topbar{padding:0 18px}.menu{display:block}.start-btn{display:none}.nav{display:none;position:absolute;top:86px;left:0;right:0;background:#050b1e;flex-direction:column;padding:20px}.nav.open{display:flex}.hero{padding:45px 22px}.feature-row,.price-wrap,.stats,.dashboard-grid{grid-template-columns:1fr}.price-wrap{padding:15px 20px 50px}.laptop{position:relative;left:auto;right:auto;top:auto;width:100%}.phone,.bug-card,.top-report,.plant{display:none}.outline{margin-left:0;margin-top:12px}.stats{margin:0 20px 45px}.stats div{border-right:0;border-bottom:1px solid rgba(255,255,255,.15);padding:14px}.stats div:last-child{border-bottom:0}.auth-visual{padding:35px 22px}.auth-text{margin-top:60px}.auth-card-glow{display:none}.auth-box{padding:26px}.dashboard{padding:35px 20px}.dashboard-card{padding:28px}.dashboard-card h1{font-size:38px}}


/* Premium BugPilot Dashboard */
.premium-dashboard-body{
  min-height:100vh;
  background:
    radial-gradient(circle at 75% 5%, rgba(68,56,255,.22), transparent 32%),
    radial-gradient(circle at 20% 35%, rgba(124,58,237,.17), transparent 28%),
    #030816;
  color:#eef4ff;
  display:flex;
  overflow-x:hidden;
}
.dashboard-sidebar{
  width:285px;
  min-height:100vh;
  padding:32px 20px;
  background:linear-gradient(180deg,rgba(3,8,22,.98),rgba(5,11,30,.94));
  border-right:1px solid rgba(148,163,184,.14);
  position:fixed;
  inset:0 auto 0 0;
  display:flex;
  flex-direction:column;
  gap:28px;
}
.dash-brand{display:flex;align-items:center;gap:14px;color:white}
.dash-logo{
  width:54px;height:54px;border-radius:14px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,#7c3aed,#2563eb);
  font-size:31px;font-weight:900;
  box-shadow:0 12px 40px rgba(124,58,237,.35);
}
.dash-brand strong{display:block;font-size:27px;line-height:1}
.dash-brand small{display:block;color:#aeb8cc;margin-top:6px}
.side-nav{display:grid;gap:12px;margin-top:10px}
.side-nav a{
  display:flex;align-items:center;gap:14px;
  padding:15px 17px;border-radius:10px;
  color:#b9c3d7;font-weight:700;
  transition:.25s;
}
.side-nav a.active,.side-nav a:hover{
  color:white;
  background:linear-gradient(135deg,#7c3aed,#2563eb);
  box-shadow:0 14px 36px rgba(37,99,235,.23);
}
.support-card{
  margin-top:auto;
  padding:24px 22px;
  border-radius:14px;
  background:linear-gradient(180deg,rgba(15,23,42,.9),rgba(15,23,42,.55));
  border:1px solid rgba(148,163,184,.12);
}
.support-card h3{color:#a78bfa;margin-bottom:12px}
.support-card p{color:#cbd5e1;line-height:1.55;margin-bottom:18px}
.support-card button{
  width:100%;border:0;border-radius:8px;
  padding:13px;color:white;font-weight:800;
  background:linear-gradient(135deg,#7c3aed,#2563eb);
  cursor:pointer;
}
.copyright{color:#8b97ad;line-height:1.7;font-size:14px}
.dashboard-shell{margin-left:285px;width:calc(100% - 285px);padding:0 36px 60px}
.dashboard-topbar{
  height:84px;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid rgba(148,163,184,.13);
}
.icon-btn,.bell,.logout-premium{
  border:1px solid rgba(148,163,184,.16);
  background:rgba(15,23,42,.68);
  color:white;border-radius:10px;cursor:pointer;
}
.icon-btn{font-size:25px;padding:10px 15px}
.top-actions{display:flex;align-items:center;gap:14px}
.bell{width:48px;height:48px;position:relative;font-size:18px}
.bell span{
  position:absolute;right:-7px;top:-9px;
  background:#7c3aed;border-radius:999px;
  padding:3px 8px;font-size:12px;font-weight:900;
}
.logout-premium{padding:14px 21px;font-weight:800}
.dashboard-welcome{padding:26px 0 18px}
.muted-white{color:#b7c0d5;font-size:18px;margin-bottom:8px}
.dashboard-welcome h2{font-size:19px}
.verified-dot{
  display:inline-grid;place-items:center;width:22px;height:22px;
  background:#3b82f6;border-radius:50%;font-size:13px;margin-left:8px;
}
.premium-hero-card{
  padding:30px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(30,41,59,.78),rgba(15,23,42,.58));
  border:1px solid rgba(148,163,184,.16);
  box-shadow:0 30px 80px rgba(0,0,0,.24);
}
.premium-hero-card h1{font-size:42px;margin-bottom:12px}
.premium-hero-card>p:not(.pill){color:#d9e2f3;font-size:17px}
.stats-row{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:16px;margin-top:30px;max-width:820px}
.stat-card{
  min-height:116px;padding:20px;border-radius:14px;
  border:1px solid rgba(148,163,184,.13);
  background:rgba(15,23,42,.72);
  display:grid;grid-template-columns:58px 1fr;column-gap:16px;align-items:center;
}
.stat-card i{
  grid-row:1/4;width:58px;height:58px;border-radius:50%;
  display:grid;place-items:center;font-style:normal;font-size:24px;
}
.stat-card span,.stat-card small{color:#cbd5e1}
.stat-card b{font-size:27px}
.stat-card.purple i,.service-card.purple .service-icon{background:linear-gradient(135deg,#7c3aed,#a855f7)}
.stat-card.green i,.service-card.green .service-icon{background:linear-gradient(135deg,#059669,#10b981)}
.stat-card.orange i,.service-card.orange .service-icon{background:linear-gradient(135deg,#f97316,#f59e0b)}
.services-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(230px,1fr));
  gap:18px;
  padding-top:24px;
  max-width:960px;
}
.service-card{
  padding:25px 22px;
  min-height:270px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(15,23,42,.82),rgba(10,17,36,.82));
  border:1px solid rgba(148,163,184,.14);
  box-shadow:0 24px 54px rgba(0,0,0,.20);
  transition:.25s;
}
.service-card:hover{transform:translateY(-6px);border-color:rgba(124,58,237,.65)}
.service-icon{
  width:58px;height:58px;border-radius:50%;
  display:grid;place-items:center;font-size:24px;margin-bottom:17px;
}
.service-card h3{font-size:21px;margin-bottom:18px}
.service-card strong{display:block;font-size:31px;margin-bottom:8px}
.service-card p{color:#cbd5e1;line-height:1.55;min-height:52px;margin-bottom:22px}
.service-card button{
  width:100%;height:49px;border-radius:10px;
  background:transparent;font-weight:900;cursor:pointer;
}
.service-card.purple strong,.service-card.purple button{color:#a855f7;border:1px solid #a855f7}
.service-card.green strong,.service-card.green button{color:#10b981;border:1px solid #10b981}
.service-card.orange strong,.service-card.orange button{color:#f59e0b;border:1px solid #f59e0b}
.service-card.blue .service-icon{background:linear-gradient(135deg,#2563eb,#38bdf8)}
.service-card.blue strong,.service-card.blue button{color:#3b82f6;border:1px solid #3b82f6}
.service-card.pink .service-icon{background:linear-gradient(135deg,#ec4899,#f43f5e)}
.service-card.pink strong,.service-card.pink button{color:#f43f5e;border:1px solid #f43f5e}
.panel-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.42);
  opacity:0;pointer-events:none;transition:.25s;z-index:190;
}
.panel-overlay.open{opacity:1;pointer-events:auto}
.request-panel{
  position:fixed;right:28px;top:96px;bottom:28px;
  width:min(720px,calc(100vw - 56px));
  padding:30px 32px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(15,23,42,.98),rgba(8,16,36,.98));
  border:1px solid rgba(148,163,184,.28);
  box-shadow:0 30px 90px rgba(0,0,0,.55);
  z-index:200;
  overflow:auto;
  transform:translateX(115%);
  transition:.35s ease;
}
.request-panel.open{transform:translateX(0)}
.close-panel{
  position:absolute;right:25px;top:20px;
  border:0;background:transparent;color:#94a3b8;
  font-size:32px;cursor:pointer;
}
.request-panel h2{font-size:28px;margin-bottom:8px}
.request-panel>p{color:#d1d8e8;margin-bottom:26px}
.request-form label{display:block;color:#eef4ff;font-weight:800;margin-bottom:17px}
.request-form input,.request-form select,.request-form textarea{
  width:100%;margin-top:10px;
  color:white;background:rgba(15,23,42,.7);
  border:1px solid rgba(148,163,184,.22);
  border-radius:8px;padding:14px 15px;
  outline:none;font:inherit;
}
.request-form input:focus,.request-form select:focus,.request-form textarea:focus{
  border-color:#7c3aed;box-shadow:0 0 0 3px rgba(124,58,237,.16);
}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.upload-box{
  position:relative;margin-top:10px;
  border:1px dashed rgba(148,163,184,.45);
  border-radius:12px;min-height:118px;
  display:grid;place-items:center;text-align:center;
  padding:22px;color:#dbe6ff;
}
.upload-box input{position:absolute;inset:0;opacity:0;cursor:pointer}
.upload-box strong{display:block;color:white;margin-bottom:6px}
.upload-box small{color:#aab6cb}
.panel-actions{display:grid;grid-template-columns:1fr 1.15fr;gap:18px;margin-top:18px}
.cancel-btn,.send-btn{
  border-radius:9px;padding:15px;border:1px solid rgba(148,163,184,.25);
  color:white;font-weight:900;cursor:pointer;font-size:16px;
}
.cancel-btn{background:rgba(15,23,42,.62)}
.send-btn{border:0;background:linear-gradient(135deg,#2563eb,#9333ea)}
.safe-note{margin-top:20px;color:#aeb8cc!important;font-size:14px}

.projects-panel{
  margin-top:24px;
  max-width:960px;
  padding:24px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(15,23,42,.82),rgba(10,17,36,.72));
  border:1px solid rgba(148,163,184,.14);
  box-shadow:0 24px 54px rgba(0,0,0,.18);
}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}
.section-head h2{font-size:27px;line-height:1.2}
.mini-label{letter-spacing:1.8px;text-transform:uppercase;font-size:12px;font-weight:900;color:#a78bfa;margin-bottom:7px}
.section-head button{border:0;border-radius:9px;padding:12px 17px;background:linear-gradient(135deg,#2563eb,#9333ea);color:white;font-weight:900;cursor:pointer}
.projects-list{display:grid;gap:14px}
.project-card{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:18px;border-radius:14px;background:rgba(15,23,42,.72);border:1px solid rgba(148,163,184,.14)}
.project-main{min-width:0;display:grid;gap:10px}
.project-id{width:max-content;border-radius:999px;background:rgba(59,130,246,.16);color:#93c5fd;padding:6px 10px;font-size:12px;font-weight:900;letter-spacing:.6px}
.project-card h3{font-size:20px;line-height:1.3}
.project-card p{color:#cbd5e1;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.project-meta{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px;margin-top:4px}
.project-meta span{display:grid;gap:4px;border-radius:10px;background:rgba(2,6,23,.35);border:1px solid rgba(148,163,184,.1);padding:10px;color:#e5edff;font-size:13px}
.project-meta b{color:#94a3b8;font-size:11px;text-transform:uppercase;letter-spacing:.8px}
.status-pill{flex:0 0 auto;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.8px}
.status-pill.pending{background:rgba(249,115,22,.15);color:#fdba74;border:1px solid rgba(249,115,22,.25)}
.status-pill.done{background:rgba(16,185,129,.15);color:#86efac;border:1px solid rgba(16,185,129,.25)}
.project-files{display:flex;flex-wrap:wrap;gap:9px;margin-top:2px}
.project-files a{border-radius:999px;background:rgba(124,58,237,.16);border:1px solid rgba(167,139,250,.22);color:#ddd6fe;padding:8px 11px;font-size:13px;font-weight:800}
.empty-projects{padding:28px;border-radius:14px;background:rgba(15,23,42,.72);border:1px dashed rgba(148,163,184,.24);text-align:center}
.empty-projects h3{font-size:20px;margin-bottom:8px}
.empty-projects p{color:#cbd5e1;line-height:1.6}
@media(max-width:1100px){
  .dashboard-sidebar{position:relative;width:100%;min-height:auto}
  .premium-dashboard-body{display:block}
  .dashboard-shell{margin-left:0;width:100%}
  .services-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:720px){
  .dashboard-shell{padding:0 18px 40px}
  .services-grid,.stats-row,.form-grid,.project-meta{grid-template-columns:1fr}
  .section-head,.project-card{flex-direction:column}
  .section-head{align-items:flex-start}
  .premium-hero-card h1{font-size:32px}
  .request-panel{right:10px;left:10px;width:auto;top:70px;bottom:10px;padding:24px 18px}
}

/* BugPilot trust and contact updates */
.hero-contact-strip{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.hero-contact-strip a{display:inline-flex;align-items:center;min-height:42px;padding:0 14px;border-radius:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);color:#e5e7eb;font-weight:800}
.about-section,.portfolio-section,.how-section,.testimonials-section,.faq-section,.blog-section{padding:70px 8%;background:white}
.about-section{display:grid;grid-template-columns:220px 1fr;gap:36px;align-items:center;border-top:1px solid #e5e7eb}
.about-photo{width:190px;height:190px;border-radius:24px;background:linear-gradient(135deg,#0f172a,#2563eb);color:white;display:grid;place-items:center;font-size:54px;font-weight:900;box-shadow:0 24px 60px rgba(15,23,42,.22)}
.about-section h2,.portfolio-section h2,.how-section h2,.testimonials-section h2,.faq-section h2,.blog-section h2{font-size:38px;letter-spacing:-1px;margin-bottom:14px;color:#0f172a}
.about-section p,.portfolio-section>p:not(.section-label),.testimonials-section p{color:#475569;line-height:1.7;font-size:17px;max-width:850px}
.skill-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.skill-tags span{padding:10px 13px;border-radius:8px;background:#eef2ff;color:#3730a3;font-weight:800;font-size:13px}
.portfolio-section{background:#f8fbff;text-align:center}
.portfolio-grid,.steps-grid,.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:28px;text-align:left}
.portfolio-card,.steps-grid div,.blog-grid article{background:white;border:1px solid #e5e7eb;border-radius:12px;padding:20px;box-shadow:0 18px 40px rgba(15,23,42,.07)}
.portfolio-shot{height:190px;border-radius:10px;margin-bottom:18px;display:grid;place-items:center;color:white;font-weight:900;font-size:24px;overflow:hidden;position:relative}
.portfolio-shot:before{content:"";position:absolute;inset:18px;border:1px solid rgba(255,255,255,.35);border-radius:8px}
.portfolio-shot span{position:relative;z-index:1}
.commerce-shot{background:linear-gradient(135deg,#0369a1,#22c55e)}
.dashboard-shot{background:linear-gradient(135deg,#312e81,#7c3aed)}
.qa-shot{background:linear-gradient(135deg,#0f172a,#f97316)}
.portfolio-card h3,.steps-grid h3,.blog-grid h3{font-size:21px;margin-bottom:10px;color:#111827}
.portfolio-card p,.steps-grid p{color:#475569;line-height:1.6}
.how-section{background:white;text-align:center}
.steps-grid div{text-align:center;min-height:210px}
.steps-grid b{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:#2563eb;color:white;font-size:24px;margin:0 auto 18px}
.testimonials-section{background:#f8fbff;text-align:center;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb}
.testimonials-section p{margin:0 auto}
.faq-section{background:white;text-align:center}
.faq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px;text-align:left}
details{border:1px solid #e5e7eb;border-radius:12px;background:#f8fafc;padding:18px}
summary{cursor:pointer;font-weight:900;color:#0f172a}
details p{color:#475569;line-height:1.6;margin-top:12px}
.blog-section{background:#f8fbff;text-align:center}
.blog-grid article span{display:inline-block;color:#2563eb;font-size:13px;font-weight:900;text-transform:uppercase;margin-bottom:12px;letter-spacing:1px}
.contact-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.footer-grid{display:flex;justify-content:space-between;gap:20px;align-items:center}
.footer-links{display:flex;gap:18px;flex-wrap:wrap;color:#cbd5e1;font-weight:800;font-size:13px}
.whatsapp-float{position:fixed;right:22px;bottom:22px;z-index:160;background:#16a34a;color:white;border-radius:999px;padding:15px 20px;font-weight:900;box-shadow:0 18px 45px rgba(22,163,74,.35)}

@media(max-width:1100px){.about-section,.portfolio-grid,.steps-grid,.faq-grid,.blog-grid{grid-template-columns:1fr 1fr}.about-section{grid-template-columns:180px 1fr}.about-photo{width:160px;height:160px}}
@media(max-width:780px){.hero-contact-strip{flex-direction:column}.hero-contact-strip a{justify-content:center}.about-section,.portfolio-section,.how-section,.testimonials-section,.faq-section,.blog-section{padding:48px 20px}.about-section,.portfolio-grid,.steps-grid,.faq-grid,.blog-grid{grid-template-columns:1fr}.about-photo{margin:auto}.about-section h2,.portfolio-section h2,.how-section h2,.testimonials-section h2,.faq-section h2,.blog-section h2{font-size:30px}.contact-actions{display:grid}.footer-grid{display:grid;text-align:center}.footer-links{justify-content:center}.whatsapp-float{left:18px;right:18px;text-align:center}}


/* Offer banner and launch offer update */
.offer-banner{
  width:100%;
  background:linear-gradient(90deg,#7c3aed,#2563eb,#0ea5e9);
  color:#fff;
  padding:10px 16px;
  display:flex;
  justify-content:center;
  align-items:center;
  position:relative;
  z-index:999;
  box-shadow:0 10px 30px rgba(37,99,235,.25);
}
.offer-banner-inner{
  width:min(1180px,100%);
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  font-weight:900;
  font-size:16px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.offer-text{display:inline-flex;align-items:center;min-width:0;overflow:hidden;text-overflow:ellipsis}
.offer-timer-wrap{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto}
.js-countdown{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:92px;
  padding:6px 10px;
  border-radius:9px;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.24);
  color:#fff;
  font-variant-numeric:tabular-nums;
}
.launch-offer-section{padding:64px 8%;background:#fff;text-align:center;border-bottom:1px solid #e5e7eb}
.launch-offer-section h2,.bottom-offer-cta h2{font-size:42px;letter-spacing:-1px;margin-bottom:12px;color:#0f172a}
.launch-offer-section h2 span{background:linear-gradient(135deg,#8b5cf6,#0ea5e9);-webkit-background-clip:text;color:transparent}
.launch-subtitle{color:#475569;font-size:17px;line-height:1.7;margin:0 auto 28px;max-width:720px}
.free-services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;text-align:left;margin-top:24px}
.free-service-card{position:relative;background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:24px;box-shadow:0 20px 45px rgba(15,23,42,.08);overflow:hidden}
.free-service-card.featured{border-color:#c4b5fd;background:linear-gradient(180deg,#ffffff,#f5f3ff)}
.free-service-card.blue-offer{border-color:#bfdbfe;background:linear-gradient(180deg,#ffffff,#eff6ff)}
.free-service-card.paid-range{border-color:#bbf7d0;background:linear-gradient(180deg,#ffffff,#f0fdf4)}
.free-badge{display:inline-flex;padding:7px 10px;border-radius:999px;background:#16a34a;color:white;font-size:12px;font-weight:900;letter-spacing:1px;margin-bottom:16px}
.free-badge.paid{background:#2563eb}
.free-service-card h3{font-size:24px;margin-bottom:10px;color:#0f172a}
.free-service-card p{color:#475569;line-height:1.6;min-height:54px;margin-bottom:18px}
.offer-price{display:flex;align-items:end;gap:12px;margin-bottom:18px}
.offer-price span{color:#64748b;text-decoration:line-through;font-weight:800}
.offer-price strong{font-size:34px;line-height:1;color:#111827}
.bottom-offer-cta{margin:0;padding:64px 8%;text-align:center;background:linear-gradient(135deg,#050b1e,#111b46);color:white}
.bottom-offer-cta h2{color:white}.bottom-offer-cta p{color:#cbd5e1;margin:0 auto 24px;max-width:680px;line-height:1.7}
.bottom-offer-cta .js-countdown{font-size:32px;vertical-align:middle;background:rgba(255,255,255,.12);min-width:150px}
@media(max-width:1100px){.free-services-grid{grid-template-columns:1fr 1fr}.free-service-card.paid-range{grid-column:1/-1}}
@media(max-width:780px){.offer-banner{padding:9px 10px}.offer-banner-inner{font-size:13px;gap:8px}.js-countdown{min-width:78px;padding:5px 8px}.launch-offer-section,.bottom-offer-cta{padding:48px 20px}.launch-offer-section h2,.bottom-offer-cta h2{font-size:30px}.free-services-grid{grid-template-columns:1fr}.free-service-card.paid-range{grid-column:auto}.bottom-offer-cta .js-countdown{font-size:24px;min-width:130px}}

/* Full fix: free offer prices */
.price{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.old-price{text-decoration:line-through;opacity:.55;font-size:18px;font-weight:700;color:#64748b}
.new-price{color:#16a34a;font-size:42px;font-weight:900;line-height:1}
.price-card .price .new-price{letter-spacing:-1px}


/* Static Page UI/UX animated showcase */
.static-showcase{
  display:grid;
  grid-template-columns:minmax(280px,.9fr) minmax(320px,1.1fr);
  gap:44px;
  align-items:center;
  padding:72px 8%;
  background:
    radial-gradient(circle at 15% 20%,rgba(124,58,237,.12),transparent 30%),
    radial-gradient(circle at 85% 25%,rgba(37,99,235,.14),transparent 32%),
    #f8fbff;
  overflow:hidden;
}
.static-copy h2{
  font-size:clamp(34px,4vw,54px);
  line-height:1.06;
  letter-spacing:-2px;
  margin-bottom:18px;
  color:#071027;
}
.static-copy h2::after{
  content:"";
  display:block;
  width:92px;
  height:5px;
  border-radius:99px;
  margin-top:18px;
  background:linear-gradient(90deg,#7c3aed,#0ea5e9);
}
.static-copy p{
  color:#475569;
  font-size:18px;
  line-height:1.75;
  max-width:620px;
  margin-bottom:22px;
}
.uiux-points{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:24px 0 28px;
}
.uiux-points span{
  padding:11px 14px;
  border-radius:999px;
  background:white;
  border:1px solid #e5e7eb;
  color:#0f172a;
  font-weight:900;
  box-shadow:0 12px 28px rgba(15,23,42,.07);
}
.static-preview{
  position:relative;
  min-height:430px;
  display:grid;
  place-items:center;
  perspective:1100px;
}
.preview-glow{
  position:absolute;
  width:260px;
  height:260px;
  border-radius:50%;
  filter:blur(40px);
  opacity:.48;
  animation:floatGlow 6s ease-in-out infinite;
}
.preview-glow.one{left:5%;top:8%;background:#8b5cf6}
.preview-glow.two{right:5%;bottom:8%;background:#0ea5e9;animation-delay:-2s}
.browser-frame{
  position:relative;
  z-index:1;
  width:min(100%,620px);
  min-height:390px;
  border-radius:24px;
  overflow:hidden;
  background:white;
  border:1px solid rgba(148,163,184,.28);
  box-shadow:0 35px 90px rgba(15,23,42,.2);
  transform:rotateY(-8deg) rotateX(4deg);
  animation:previewFloat 5s ease-in-out infinite;
}
.browser-top{
  height:52px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 18px;
  background:#071027;
  color:#cbd5e1;
  font-size:13px;
  font-weight:800;
}
.browser-top i{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#ef4444;
}
.browser-top i:nth-child(2){background:#f59e0b}
.browser-top i:nth-child(3){background:#22c55e}
.browser-top span{margin-left:10px;opacity:.85}
.preview-hero{
  padding:36px;
  background:linear-gradient(135deg,#0b1227,#172554 55%,#312e81);
}
.preview-pill{
  width:150px;
  height:18px;
  border-radius:999px;
  background:linear-gradient(90deg,#a78bfa,#38bdf8);
  opacity:.9;
  animation:shimmer 2.4s linear infinite;
}
.preview-line{
  height:18px;
  border-radius:999px;
  margin-top:16px;
  background:rgba(255,255,255,.9);
}
.preview-line.big{width:78%;height:34px;margin-top:24px}
.preview-line.medium{width:58%}
.preview-line.small{width:42%;opacity:.72}
.preview-buttons{display:flex;gap:12px;margin-top:24px}
.preview-buttons b{
  width:132px;
  height:42px;
  border-radius:12px;
  background:linear-gradient(135deg,#7c3aed,#2563eb);
  box-shadow:0 14px 34px rgba(37,99,235,.28);
}
.preview-buttons b:nth-child(2){background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28)}
.preview-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  padding:22px;
  background:#fff;
}
.preview-cards article{
  min-height:112px;
  border-radius:18px;
  background:#f8fafc;
  border:1px solid #e5e7eb;
  padding:16px;
  transform:translateY(14px);
  opacity:0;
  animation:cardRise 4.5s ease-in-out infinite;
}
.preview-cards article:nth-child(2){animation-delay:.2s}
.preview-cards article:nth-child(3){animation-delay:.4s}
.preview-cards em{
  display:block;
  width:38px;
  height:38px;
  border-radius:12px;
  background:linear-gradient(135deg,#7c3aed,#0ea5e9);
  margin-bottom:12px;
}
.preview-cards strong,.preview-cards p{
  display:block;
  height:12px;
  border-radius:999px;
  background:#cbd5e1;
}
.preview-cards strong{width:80%}
.preview-cards p{width:62%;margin-top:10px;opacity:.7}
@keyframes previewFloat{
  0%,100%{transform:rotateY(-8deg) rotateX(4deg) translateY(0)}
  50%{transform:rotateY(-4deg) rotateX(2deg) translateY(-16px)}
}
@keyframes floatGlow{
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(18px,-18px) scale(1.08)}
}
@keyframes shimmer{
  0%{filter:hue-rotate(0deg);transform:translateX(0)}
  50%{filter:hue-rotate(45deg);transform:translateX(8px)}
  100%{filter:hue-rotate(0deg);transform:translateX(0)}
}
@keyframes cardRise{
  0%,18%{opacity:0;transform:translateY(14px)}
  35%,80%{opacity:1;transform:translateY(0)}
  100%{opacity:0;transform:translateY(14px)}
}
@media(max-width:980px){
  .static-showcase{grid-template-columns:1fr;padding:58px 22px}
  .browser-frame{transform:none}
}
@media(max-width:620px){
  .preview-cards{grid-template-columns:1fr}
  .static-preview{min-height:560px}
  .preview-buttons{flex-direction:column}
  .preview-buttons b{width:100%}
}

/* 2026 update: full page motion, closed-offer price switch, footer cleanup */
body{
  overflow-x:hidden;
}
.topbar{
  animation:topbarDrop .65s ease both;
}
.offer-banner{
  animation:offerGlow 4s ease-in-out infinite;
}
.logo,.start-btn,.whatsapp-float,.btn.primary{
  animation:softPulse 2.6s ease-in-out infinite;
}
.hero-left .pill{animation:slideFadeUp .75s ease both .1s}
.hero-left h1{animation:slideFadeUp .8s ease both .2s}
.hero-desc{animation:slideFadeUp .8s ease both .3s}
.hero-contact-strip{animation:slideFadeUp .8s ease both .4s}
.feature-row div{animation:slideFadeUp .8s ease both}
.feature-row div:nth-child(1){animation-delay:.45s}
.feature-row div:nth-child(2){animation-delay:.55s}
.feature-row div:nth-child(3){animation-delay:.65s}
.feature-row div:nth-child(4){animation-delay:.75s}
.laptop{animation:laptopFloat 5s ease-in-out infinite}
.phone{animation:phoneFloat 4s ease-in-out infinite}
.report-card{animation:badgeFloat 4.8s ease-in-out infinite}
.bug-card{animation:badgeFloat 5.3s ease-in-out infinite reverse}
.price-card,.free-service-card,.portfolio-card,.steps-grid div,.faq-grid details,.blog-grid article{
  will-change:transform,box-shadow;
}
.price-card:hover,.free-service-card:hover,.portfolio-card:hover,.steps-grid div:hover,.faq-grid details:hover,.blog-grid article:hover{
  transform:translateY(-10px) scale(1.015);
  box-shadow:0 28px 70px rgba(15,23,42,.16);
}
.art::after,.browser-frame::after{
  content:"";
  position:absolute;
  inset:-70% auto auto -70%;
  width:70%;
  height:220%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);
  transform:rotate(25deg);
  animation:shineSweep 4.2s ease-in-out infinite;
}
.price-card:nth-child(2) .art::after{animation-delay:.25s}
.price-card:nth-child(3) .art::after{animation-delay:.5s}
.price-card:nth-child(4) .art::after{animation-delay:.75s}
.price-card:nth-child(5) .art::after{animation-delay:1s}
.buy,.btn{
  position:relative;
  overflow:hidden;
}
.buy::after,.btn::after{
  content:"";
  position:absolute;
  top:0;
  left:-110%;
  width:55%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);
  transform:skewX(-18deg);
  transition:.55s;
}
.buy:hover::after,.btn:hover::after{left:130%}
.regular-price,.regular-value{display:none}
.offer-ended .old-price,
.offer-ended .new-price,
.offer-ended .free-value{display:none!important}
.offer-ended .regular-price,
.offer-ended .regular-value{display:inline-flex!important}
.offer-ended .price{color:#111827!important}
.offer-ended .offer-banner{background:linear-gradient(90deg,#0f172a,#334155)}
.offer-ended .offer-timer-wrap{opacity:.8}
.offer-ended .free-service-card.featured{border-color:#cbd5e1;background:linear-gradient(180deg,#fff,#f8fafc)}
.offer-ended .free-badge{background:#0f172a;color:#fff}
.footer-links{display:flex;align-items:center;justify-content:flex-end;gap:18px;font-weight:800;color:#cbd5e1}
.footer-links a:hover{color:#fff}

@keyframes topbarDrop{
  from{opacity:0;transform:translateY(-18px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes slideFadeUp{
  from{opacity:0;transform:translateY(26px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes softPulse{
  0%,100%{box-shadow:0 12px 30px rgba(37,99,235,.18)}
  50%{box-shadow:0 18px 42px rgba(124,58,237,.38)}
}
@keyframes offerGlow{
  0%,100%{filter:saturate(1)}
  50%{filter:saturate(1.35) brightness(1.06)}
}
@keyframes laptopFloat{
  0%,100%{transform:perspective(900px) rotateY(-8deg) translateY(0)}
  50%{transform:perspective(900px) rotateY(-4deg) translateY(-14px)}
}
@keyframes phoneFloat{
  0%,100%{transform:translateY(0) rotate(0)}
  50%{transform:translateY(-12px) rotate(1deg)}
}
@keyframes badgeFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-12px)}
}
@keyframes shineSweep{
  0%,45%{left:-80%;opacity:0}
  55%{opacity:1}
  100%{left:135%;opacity:0}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
@media(max-width:780px){
  .footer-links{justify-content:center;margin-top:14px}
}

/* Contact form modal update */
.contact-open-btn{border:0;cursor:pointer;font-family:inherit;font-size:16px}
.contact-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:22px}
.contact-modal.open{display:flex}
.contact-modal-backdrop{position:absolute;inset:0;background:rgba(3,8,22,.78);backdrop-filter:blur(10px)}
.contact-modal-card{position:relative;width:min(760px,100%);max-height:92vh;overflow:auto;background:linear-gradient(145deg,#ffffff,#f7faff);color:#0f172a;border-radius:26px;padding:34px;box-shadow:0 30px 100px rgba(0,0,0,.45);border:1px solid rgba(124,58,237,.18);animation:modalPop .28s ease both}
.contact-modal-card h2{font-size:34px;margin:0 0 8px;color:#081225}
.contact-form-subtitle{color:#475569;margin-bottom:22px}
.contact-modal-close{position:absolute;top:18px;right:18px;width:42px;height:42px;border:0;border-radius:50%;background:#eef2ff;color:#111827;font-size:28px;line-height:1;cursor:pointer;font-weight:800}
.contact-form{display:grid;gap:16px;text-align:left}
.form-grid-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-form label{display:grid;gap:8px;font-weight:800;color:#111827}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid #dbe4f0;border-radius:14px;padding:14px 15px;font:inherit;color:#0f172a;background:white;outline:none}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#7c3aed;box-shadow:0 0 0 4px rgba(124,58,237,.12)}
.contact-submit-btn{border:0;cursor:pointer;justify-content:center;text-align:center;margin-top:6px}
body.contact-modal-active{overflow:hidden}
@keyframes modalPop{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:700px){.form-grid-two{grid-template-columns:1fr}.contact-modal-card{padding:26px 20px}.contact-modal-card h2{font-size:28px}}

/* Premium contact form UI/UX update */
.premium-contact-modal{perspective:1200px}
.premium-contact-modal.open .contact-modal-backdrop{animation:premiumBackdropIn .35s ease both}
.premium-contact-card{isolation:isolate;overflow:hidden!important;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(244,248,255,.98))!important;border:1px solid rgba(124,58,237,.28)!important;box-shadow:0 32px 120px rgba(3,8,22,.55),0 0 0 1px rgba(255,255,255,.42) inset!important;transform-origin:center;animation:premiumModalIn .48s cubic-bezier(.2,.9,.2,1) both!important}
.premium-contact-card:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0%,rgba(124,58,237,.08) 35%,rgba(37,99,235,.08) 55%,transparent 78%);transform:translateX(-100%);animation:premiumSweep 4s ease-in-out infinite;z-index:-1}
.modal-glow{position:absolute;width:210px;height:210px;border-radius:50%;filter:blur(30px);opacity:.38;pointer-events:none;z-index:-2;animation:floatGlow 7s ease-in-out infinite}
.modal-glow-one{top:-80px;right:70px;background:#7c3aed}
.modal-glow-two{bottom:-100px;left:-50px;background:#2563eb;animation-delay:-2s}
.premium-contact-head{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:start;margin-bottom:18px}
.premium-contact-head h2{letter-spacing:-.04em;line-height:1.02;background:linear-gradient(90deg,#081225,#4338ca,#2563eb);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.premium-contact-head .section-label{box-shadow:0 12px 30px rgba(124,58,237,.16)}
.contact-mini-card{min-width:168px;padding:16px;border-radius:20px;background:linear-gradient(145deg,#111827,#172554);color:#fff;border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 46px rgba(15,23,42,.25);display:grid;gap:4px;animation:slideFadeUp .7s ease both .18s}
.contact-mini-card small{color:#cbd5e1;font-size:12px}.pulse-dot{width:12px;height:12px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.58);animation:pulseRing 1.7s infinite}
.contact-progress{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 20px}.contact-progress span{padding:10px 12px;border-radius:999px;background:#eef2ff;color:#475569;font-weight:900;font-size:13px;text-align:center;border:1px solid rgba(124,58,237,.12)}.contact-progress span.active{background:linear-gradient(90deg,#7c3aed,#2563eb);color:white;box-shadow:0 12px 30px rgba(37,99,235,.22)}
.premium-form{gap:18px!important}.premium-form label{gap:9px!important}.premium-form label>span{font-size:14px;letter-spacing:.01em}.input-shell{display:flex;align-items:center;gap:10px;width:100%;background:rgba(255,255,255,.86);border:1px solid #dbe4f0;border-radius:18px;padding:0 14px;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease,background .25s ease}.input-shell i{width:24px;text-align:center;font-style:normal;filter:saturate(1.2)}.input-shell:focus-within{transform:translateY(-2px);background:#fff;border-color:#7c3aed;box-shadow:0 14px 34px rgba(37,99,235,.14),0 0 0 4px rgba(124,58,237,.1)}.premium-form input,.premium-form select,.premium-form textarea{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;padding:15px 0!important}.premium-form textarea{min-height:116px;resize:vertical}.textarea-shell{align-items:flex-start;padding-top:3px}.textarea-shell i{margin-top:15px}.premium-submit{position:relative;min-height:56px;border-radius:18px!important;overflow:hidden;box-shadow:0 18px 46px rgba(37,99,235,.28)!important;transition:transform .25s ease,box-shadow .25s ease}.premium-submit:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);transform:translateX(-120%);transition:transform .6s ease}.premium-submit:hover{transform:translateY(-3px);box-shadow:0 24px 60px rgba(37,99,235,.36)!important}.premium-submit:hover:before{transform:translateX(120%)}.premium-submit span,.premium-submit b{position:relative;z-index:1}.premium-submit b{font-size:22px;margin-left:8px}.contact-modal-close{transition:transform .25s ease,background .25s ease!important}.contact-modal-close:hover{transform:rotate(90deg) scale(1.06);background:#e0e7ff!important}
@keyframes premiumModalIn{0%{opacity:0;transform:translateY(38px) scale(.94) rotateX(8deg)}100%{opacity:1;transform:translateY(0) scale(1) rotateX(0)}}
@keyframes premiumBackdropIn{0%{opacity:0;backdrop-filter:blur(0)}100%{opacity:1;backdrop-filter:blur(12px)}}
@keyframes premiumSweep{0%,45%{transform:translateX(-110%)}70%,100%{transform:translateX(110%)}}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(34,197,94,.58)}70%{box-shadow:0 0 0 12px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
@keyframes floatGlow{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(18px,-12px,0) scale(1.08)}}
@media(max-width:760px){.premium-contact-head{grid-template-columns:1fr}.contact-mini-card{min-width:0}.contact-progress{grid-template-columns:1fr}.premium-contact-card{border-radius:22px!important}}

/* Reference static page example links */
.example-sites-section{position:relative;padding:78px 8%;background:radial-gradient(circle at 18% 12%,rgba(124,58,237,.12),transparent 28%),radial-gradient(circle at 82% 18%,rgba(37,99,235,.12),transparent 30%),#f8fbff;overflow:hidden}
.example-sites-section:before{content:"";position:absolute;inset:22px 8%;border:1px solid rgba(124,58,237,.12);border-radius:34px;pointer-events:none;opacity:.7}
.example-sites-head{text-align:center;max-width:760px;margin:0 auto 34px;position:relative;z-index:1}.example-sites-head h2{font-size:clamp(30px,4vw,48px);line-height:1.05;color:#071226;letter-spacing:-.04em;margin:10px 0}.example-sites-head p:not(.section-label){color:#475569;font-size:17px;line-height:1.7}.example-sites-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;max-width:1040px;margin:0 auto;position:relative;z-index:1}.example-site-card{position:relative;display:grid;gap:16px;text-decoration:none;color:#0f172a;padding:26px;border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(239,246,255,.88));border:1px solid rgba(37,99,235,.16);box-shadow:0 24px 70px rgba(15,23,42,.09);overflow:hidden;transform:translateY(0);transition:transform .32s ease,box-shadow .32s ease,border-color .32s ease}.example-site-card:before{content:"";position:absolute;inset:-45%;background:conic-gradient(from 120deg,transparent,rgba(124,58,237,.16),transparent,rgba(37,99,235,.16),transparent);animation:exampleSpin 7s linear infinite;opacity:0;transition:opacity .3s ease}.example-site-card:after{content:"";position:absolute;inset:1px;border-radius:27px;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(248,250,252,.9));z-index:0}.example-site-card>*{position:relative;z-index:1}.example-site-card:hover{transform:translateY(-8px);border-color:rgba(124,58,237,.38);box-shadow:0 34px 90px rgba(37,99,235,.17)}.example-site-card:hover:before{opacity:1}.example-site-card.accent{background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(255,241,242,.9));border-color:rgba(244,63,94,.18)}.example-chip{justify-self:start;padding:9px 13px;border-radius:999px;background:#ede9fe;color:#6d28d9;font-weight:900;font-size:13px;text-transform:uppercase;letter-spacing:.08em}.example-site-card.accent .example-chip{background:#ffe4e6;color:#be123c}.example-browser{min-height:180px;border-radius:22px;background:linear-gradient(135deg,#0f172a,#1d4ed8 55%,#8b5cf6);padding:20px;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);display:flex;align-items:flex-end;position:relative;overflow:hidden}.example-browser:before{content:"";position:absolute;left:24px;top:58px;width:56%;height:14px;border-radius:999px;background:rgba(255,255,255,.86);box-shadow:0 32px 0 rgba(255,255,255,.55),0 64px 0 rgba(255,255,255,.3);animation:exampleFloat 3.6s ease-in-out infinite}.example-browser:after{content:"";position:absolute;right:24px;bottom:24px;width:120px;height:74px;border-radius:18px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.2);animation:exampleFloat 4.2s ease-in-out infinite reverse}.example-browser i{position:absolute;top:18px;width:10px;height:10px;border-radius:50%;background:#fb7185}.example-browser i:nth-child(2){left:38px;background:#facc15}.example-browser i:nth-child(3){left:56px;background:#22c55e}.example-browser i:first-child{left:20px}.example-browser strong{font-size:25px;letter-spacing:-.02em;text-shadow:0 10px 30px rgba(0,0,0,.25)}.signup-preview{background:linear-gradient(135deg,#111827,#e11d48 56%,#f97316)}.example-site-card h3{font-size:25px;letter-spacing:-.03em;margin:0}.example-site-card p{color:#475569;line-height:1.65;margin:0}.example-site-card b{color:#2563eb;font-size:16px}.example-site-card.accent b{color:#e11d48}@keyframes exampleSpin{to{transform:rotate(360deg)}}@keyframes exampleFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@media(max-width:850px){.example-sites-grid{grid-template-columns:1fr}.example-sites-section:before{inset:14px}}