:root{
  --bg:#091221;
  --bg-2:#0d1b31;
  --surface:#ffffff;
  --surface-2:#f5f8ff;
  --surface-3:#edf3ff;
  --ink:#0f1b2f;
  --muted:#5a6884;
  --line:#dbe6f6;
  --primary:#1967ff;
  --primary-2:#0e49c7;
  --accent:#13b89a;
  --warning:#ffb84d;
  --dark-card:#10213e;
  --radius:26px;
  --radius-sm:18px;
  --shadow:0 26px 70px rgba(8,20,52,.12);
  --shadow-soft:0 10px 30px rgba(9,22,55,.08);
  --container:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:
    radial-gradient(circle at top left, rgba(25,103,255,.11), transparent 30%),
    radial-gradient(circle at top right, rgba(19,184,154,.09), transparent 24%),
    linear-gradient(180deg,#f8fbff 0%,#fff 28%,#f8fbff 100%);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.65;
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit}
.container{width:min(var(--container),calc(100% - 2rem));margin:0 auto}
.narrow{max-width:820px}
.section{padding:5.5rem 0}
.section-tight{padding:4rem 0}
.section-tint{background:var(--surface-2)}
.section-dark{
  background:
    radial-gradient(circle at top right, rgba(25,103,255,.2), transparent 28%),
    linear-gradient(135deg,var(--bg) 0%,#0f2442 100%);
  color:#fff;
}
.section-dark p,.section-dark li{color:#d7e4ff}
.eyebrow{
  margin:0 0 1rem;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.8rem;
  font-weight:800;
  color:var(--primary);
}
h1,h2,h3,h4{margin:0 0 1rem;line-height:1.08;letter-spacing:-.02em}
h1{font-size:clamp(2.6rem,5vw,5rem)}
h2{font-size:clamp(1.9rem,3vw,3.35rem)}
h3{font-size:1.28rem}
h4{font-size:1rem}
p{margin:0 0 1rem;color:var(--muted)}
.lead{font-size:1.14rem;max-width:760px}
ul,ol{margin:0;padding-left:1.25rem}
li{color:var(--muted)}
.small{font-size:.92rem}
.site-header{
  position:sticky;top:0;z-index:999;
  backdrop-filter:blur(16px);
  background:rgba(255,255,255,.86);
  border-bottom:1px solid rgba(219,230,246,.88);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;min-height:84px;
}
.brand{
  display:inline-flex;align-items:center;gap:.9rem;font-weight:900;font-size:1.08rem;color:var(--ink)
}
.brand img{width:44px;height:44px;object-fit:contain}
.site-nav{display:flex;align-items:center;gap:1.15rem}
.site-nav > a,.nav-dropdown-button{
  padding:.45rem .12rem;border:0;background:none;cursor:pointer;font-weight:700;color:#233454
}
.site-nav > a.active,.nav-dropdown-button.active{color:var(--primary)}
.nav-dropdown{position:relative}
.nav-dropdown-menu{
  position:absolute;left:0;top:calc(100% + .85rem);
  min-width:320px;padding:.75rem;background:#fff;border:1px solid var(--line);
  border-radius:22px;box-shadow:var(--shadow);display:none
}
.nav-dropdown.open .nav-dropdown-menu{display:grid;gap:.2rem}
.nav-dropdown-menu a{
  padding:.8rem .9rem;border-radius:14px;color:#22314c;font-weight:600
}
.nav-dropdown-menu a:hover{background:#eff5ff}
.nav-toggle{display:none;border:0;background:none;padding:.25rem}
.nav-toggle span{display:block;width:26px;height:2px;background:#24324e;margin:6px 0}
.button{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  min-height:50px;padding:0 1.2rem;border-radius:999px;border:0;
  background:linear-gradient(135deg,var(--primary),#3181ff);color:#fff;
  font-weight:800;box-shadow:0 16px 35px rgba(25,103,255,.22)
}
.button:hover{background:linear-gradient(135deg,var(--primary-2),var(--primary))}
.button.secondary{
  background:#edf3ff;color:var(--primary);box-shadow:none
}
.button.ghost{
  background:transparent;color:#fff;border:1px solid rgba(255,255,255,.3);box-shadow:none
}
.button.dark{
  background:#112247;color:#fff;box-shadow:none
}
.button-sm{min-height:42px;padding:0 1rem}
.hero{
  position:relative;padding:6rem 0 4.5rem;
  background:
    radial-gradient(circle at 80% 0%, rgba(19,184,154,.16), transparent 24%),
    linear-gradient(180deg, rgba(25,103,255,.08) 0%, rgba(255,255,255,0) 68%);
}
.page-hero{padding:4.8rem 0 2.2rem}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:2rem;align-items:center}
.hero-actions{display:flex;flex-wrap:wrap;gap:.9rem;margin:1.6rem 0}
.hero-points{list-style:none;padding:0;display:grid;gap:.7rem;margin:1.35rem 0 0}
.hero-points li{position:relative;padding-left:1.5rem}
.hero-points li::before{
  content:"";position:absolute;left:0;top:.53rem;width:.68rem;height:.68rem;border-radius:50%;
  background:linear-gradient(135deg,var(--accent),#5ad0bc)
}
.card{
  background:rgba(255,255,255,.96);border:1px solid rgba(219,230,246,.9);
  border-radius:var(--radius);box-shadow:var(--shadow-soft);padding:1.45rem
}
.glass{
  background:rgba(255,255,255,.82);backdrop-filter:blur(12px);border:1px solid rgba(219,230,246,.85);
  border-radius:var(--radius);box-shadow:var(--shadow)
}
.hero-panel{padding:1.8rem}
.pill-row,.chip-row{display:flex;flex-wrap:wrap;gap:.6rem}
.pill,.chip{
  display:inline-flex;align-items:center;gap:.45rem;padding:.58rem .85rem;border-radius:999px;
  background:#eff5ff;color:#274163;font-weight:700
}
.chip{background:#fff;border:1px solid var(--line);font-weight:600}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.85rem;margin-top:1.3rem}
.stat{
  background:#0f1d37;border-radius:20px;padding:1rem;color:#fff
}
.stat strong{display:block;font-size:1.7rem;line-height:1}
.stat span{display:block;margin-top:.45rem;color:#c8d7fb;font-size:.92rem}
.metric-band{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:2rem
}
.metric-band .card{padding:1.2rem}
.metric-band strong{display:block;font-size:1.8rem;color:var(--primary)}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}
.section-heading p{max-width:700px}
.grid{display:grid;gap:1.25rem}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.value-card,.service-card,.package-card,.step-card,.faq-item,.feature-card,.testimonial,.contact-card,.tool-card{
  height:100%
}
.service-card img,.feature-card img,.showcase-card img{
  width:100%;height:220px;object-fit:cover;border-radius:18px;margin-bottom:1rem
}
.service-card h3,.package-card h3,.value-card h3,.feature-card h3{margin-bottom:.65rem}
.service-card .text-link,.inline-link,.footer-links a,.nav-dropdown-menu a:hover{
  color:var(--primary)
}
.text-link{font-weight:800}
.split{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;align-items:center}
.stack{display:grid;gap:1rem}
.check-list{display:grid;gap:.8rem;margin-top:1rem}
.check-item{
  display:flex;gap:.8rem;align-items:flex-start;padding:1rem 1rem;border:1px solid var(--line);
  border-radius:18px;background:#fff
}
.check-item strong{display:block;margin-bottom:.15rem}
.check-badge{
  flex:0 0 34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--accent),#5ad0bc);color:#fff;font-weight:900
}
.highlight-panel{
  position:relative;overflow:hidden;padding:1.7rem;background:linear-gradient(135deg,#fff,#f3f8ff)
}
.highlight-panel::after{
  content:"";position:absolute;inset:auto -70px -70px auto;width:190px;height:190px;border-radius:50%;
  background:radial-gradient(circle, rgba(25,103,255,.14), transparent 72%)
}
.kicker-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:1.25rem}
.image-pair{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.image-pair img{width:100%;height:250px;object-fit:cover;border-radius:22px;box-shadow:var(--shadow-soft)}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.timeline .card{padding:1.2rem}
.price{
  font-size:2rem;font-weight:900;color:var(--ink)
}
.price span{font-size:1rem;font-weight:700;color:var(--muted)}
.package-card{
  display:flex;flex-direction:column;gap:.6rem;padding:1.5rem
}
.package-card .button{margin-top:auto}
.package-card.featured{
  border:1px solid rgba(25,103,255,.32);
  box-shadow:0 22px 60px rgba(25,103,255,.16)
}
.badge{
  display:inline-flex;align-items:center;gap:.45rem;padding:.42rem .72rem;border-radius:999px;
  background:#eaf2ff;color:var(--primary);font-size:.82rem;font-weight:800
}
.logo-wall{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem}
.logo-wall img{
  background:#fff;border:1px solid var(--line);border-radius:18px;padding:1rem;height:90px;width:100%;
  object-fit:contain;box-shadow:var(--shadow-soft)
}
.showcase-card{padding:1.35rem}
.quote{
  padding:1.4rem;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft)
}
.quote p{color:#2c3c5b}
.quote-footer{display:flex;justify-content:space-between;gap:1rem;margin-top:1rem}
.faq-grid{display:grid;gap:1rem}
.faq-item{
  border:1px solid var(--line);border-radius:20px;background:#fff;padding:1rem 1.15rem
}
.faq-item summary{
  list-style:none;cursor:pointer;font-weight:800;color:#163155;display:flex;align-items:center;justify-content:space-between;gap:1rem
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:1.3rem;color:var(--primary)}
.faq-item[open] summary::after{content:"−"}
.faq-item p,.faq-item li{margin-top:.8rem}
.cta-shell{
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem
}
.cta-shell h2{max-width:780px}
.contact-layout{display:grid;grid-template-columns:1.08fr .92fr;gap:1.4rem;align-items:start}
.contact-form{display:grid;gap:1rem}
.contact-form label{display:grid;gap:.45rem;font-weight:700;color:#233454}
.contact-form input,.contact-form select,.contact-form textarea{
  width:100%;padding:.95rem 1rem;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--ink)
}
.contact-form textarea{min-height:160px;resize:vertical}
.kpi-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.kpi{padding:1rem;border-radius:18px;background:#fff;border:1px solid var(--line)}
.kpi strong{display:block;font-size:1.7rem;color:var(--primary)}
.footer{
  background:#091121;color:#dce7ff
}
.footer-grid{
  display:grid;grid-template-columns:1.3fr .9fr .9fr 1fr;gap:1.5rem;padding:3.4rem 0 1.2rem
}
.footer h3{color:#fff;font-size:1rem}
.footer p,.footer li,.footer a{color:#dce7ff}
.footer ul{list-style:none;padding:0;margin:0;display:grid;gap:.7rem}
.footer-bottom{padding:1rem 0 2rem;border-top:1px solid rgba(220,231,255,.12)}
.social-row{display:flex;flex-wrap:wrap;gap:.8rem}
.list-clean{list-style:none;padding:0;margin:0;display:grid;gap:.65rem}
.list-check{list-style:none;padding:0;display:grid;gap:.8rem}
.list-check li{position:relative;padding-left:1.55rem}
.list-check li::before{
  content:"✓";position:absolute;left:0;top:0;color:var(--accent);font-weight:900
}
.table-like{display:grid;gap:.85rem}
.table-row{
  display:grid;grid-template-columns:1fr 1.8fr;gap:1rem;padding:1rem;border:1px solid var(--line);
  border-radius:16px;background:#fff
}
.notice{
  padding:1rem 1.1rem;border-radius:18px;background:#fff7e9;border:1px solid #ffe0a8;color:#7e5c16
}
hr.soft{border:0;height:1px;background:var(--line);margin:1.5rem 0}
.page-nav{
  display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1rem
}
.page-nav a{padding:.55rem .85rem;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:700}
.page-nav a.active{background:#eaf2ff;border-color:#bcd4ff;color:var(--primary)}
@media (max-width:1100px){
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .logo-wall{grid-template-columns:repeat(4,1fr)}
  .timeline{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .nav-toggle{display:block}
  .site-nav{
    position:absolute;left:1rem;right:1rem;top:84px;display:none;flex-direction:column;align-items:stretch;
    background:#fff;border:1px solid var(--line);border-radius:24px;padding:1rem;box-shadow:var(--shadow)
  }
  .site-nav.open{display:flex}
  .nav-dropdown-menu{position:static;box-shadow:none;border:0;padding:.5rem 0 0;min-width:0}
  .hero-grid,.split,.cta-shell,.contact-layout,.kicker-grid{grid-template-columns:1fr;display:grid}
}
@media (max-width:720px){
  .grid-2,.grid-3,.grid-4,.logo-wall,.footer-grid,.timeline,.image-pair,.metric-band,.stat-grid,.kpi-grid,.table-row{grid-template-columns:1fr}
  .section{padding:4rem 0}
  h1{font-size:2.6rem}
}


/* Premium v3 additions */
:root{
  --hero-glow: rgba(25,103,255,.11);
}
[data-theme="dark"]{
  --surface:#0f1828;
  --surface-2:#0b1320;
  --surface-3:#121d31;
  --ink:#eef4ff;
  --muted:#b8c5de;
  --line:#223251;
  --shadow:0 26px 70px rgba(0,0,0,.28);
  --shadow-soft:0 10px 30px rgba(0,0,0,.22);
}
[data-theme="dark"] body{
  background:
    radial-gradient(circle at top left, rgba(25,103,255,.18), transparent 32%),
    radial-gradient(circle at top right, rgba(19,184,154,.12), transparent 26%),
    linear-gradient(180deg,#07111d 0%,#091221 28%,#07111d 100%);
}
[data-theme="dark"] .site-header{background:rgba(9,18,33,.86); border-bottom-color:rgba(40,58,94,.88)}
[data-theme="dark"] .card,
[data-theme="dark"] .glass,
[data-theme="dark"] .check-item,
[data-theme="dark"] .quote,
[data-theme="dark"] .faq-item,
[data-theme="dark"] .chip,
[data-theme="dark"] .site-nav,
[data-theme="dark"] .nav-dropdown-menu,
[data-theme="dark"] .kpi{background:rgba(15,24,40,.94); color:var(--ink); border-color:var(--line)}
[data-theme="dark"] .button.secondary{background:#15243b;color:#cfe0ff}
[data-theme="dark"] .pill{background:#12233d;color:#dbe8ff}
[data-theme="dark"] .section-tint{background:#0b1320}
[data-theme="dark"] .footer{background:#050b14}
.theme-toggle{
  width:44px;height:44px;border-radius:999px;border:1px solid var(--line);
  background:var(--surface); color:var(--ink); cursor:pointer; font-size:1rem;
  box-shadow:var(--shadow-soft); display:inline-grid; place-items:center;
}
.theme-toggle:hover{transform:translateY(-1px)}
.hero-premium-cards,
.testimonial-grid,
.pricing-grid,
.booking-grid,
.process-grid{display:grid;gap:1rem}
.hero-premium-cards{grid-template-columns:repeat(3,1fr);margin-top:1.4rem}
.premium-card{
  padding:1.15rem;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft)
}
.premium-card strong{display:block;font-size:1.15rem;margin-bottom:.35rem}
.testimonial-grid{grid-template-columns:repeat(3,1fr)}
.pricing-grid{grid-template-columns:repeat(3,1fr)}
.pricing-card{
  position:relative;padding:1.6rem;border-radius:26px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow-soft)
}
.pricing-card.featured{
  border-color:rgba(25,103,255,.35);
  box-shadow:0 24px 70px rgba(25,103,255,.16)
}
.pricing-card ul{list-style:none;padding:0;display:grid;gap:.75rem;margin:1rem 0 1.3rem}
.pricing-card li{position:relative;padding-left:1.45rem}
.pricing-card li::before{content:"✓";position:absolute;left:0;top:0;color:var(--accent);font-weight:900}
.pricing-note{margin-top:1rem;font-size:.95rem}
.pricing-mini{font-size:.95rem;color:var(--muted)}
.quote-mark{
  font-size:3rem;line-height:1;color:var(--primary);opacity:.2;font-weight:900;margin-bottom:.5rem
}
.booking-embed{
  border:1px dashed var(--line);border-radius:24px;padding:1.2rem;background:linear-gradient(180deg,#fff,#f7fbff)
}
[data-theme="dark"] .booking-embed{background:linear-gradient(180deg,#101b2d,#0d1626)}
.code-box{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#0c1730;color:#e6efff;
  border-radius:18px;padding:1rem;overflow:auto
}
.inline-stat{
  display:inline-flex;align-items:center;gap:.55rem;padding:.55rem .8rem;border-radius:999px;background:#eaf2ff;color:var(--primary);font-weight:800
}
.process-grid{grid-template-columns:repeat(4,1fr)}
.process-step{padding:1.2rem;border-radius:22px;border:1px solid var(--line);background:#fff}
.process-step strong{display:block;margin-bottom:.5rem}
.netlify-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.calendar-links{display:flex;flex-wrap:wrap;gap:.8rem}
@media (max-width:1100px){
  .testimonial-grid,.pricing-grid,.hero-premium-cards{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .process-grid,.netlify-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .testimonial-grid,.pricing-grid,.hero-premium-cards,.process-grid,.netlify-grid,.booking-grid{grid-template-columns:1fr}
}