/* Theme */
:root{
  --bg:#ffffff; --fg:#0f172a; --muted:#5b657a; --line:#e6e8ef; --card:#f8f9fc;
  --acc:#2457f2; --acc-2:#6ea1ff; --ok:#22c55e; --warn:#f59e0b; --shadow:0 18px 60px rgba(2,8,23,.08);
}
:root.dark{
  --bg:#0b0f1a; --fg:#eaf0ff; --muted:#a7b0c8; --line:#1c2233; --card:#0f1424; --acc:#6ea1ff; --acc-2:#93c5fd; --shadow:0 18px 60px rgba(0,0,0,.5);
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--fg)}
img{max-width:100%;display:block}
.container{max-width:1120px;margin:auto;padding:0 22px}

/* Header */
.site-header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.7);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--line)}
:root.dark .site-header{background:rgba(11,15,26,.65)}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:60px;position:relative}
.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;font-weight:700}
.logo{width:14px;height:14px;border-radius:50%;background:conic-gradient(from 210deg, var(--acc), var(--acc-2));box-shadow:0 0 24px var(--acc-2)}

/* Nav links */
.links{display:flex;align-items:center;gap:18px}
.links a{color:var(--fg);text-decoration:none;opacity:.85}
.links a:hover{opacity:1}
.icon-btn{border:1px solid var(--line);background:transparent;border-radius:10px;padding:6px 10px;cursor:pointer}
.hamburger{display:none;background:transparent;border:0;cursor:pointer;padding:8px}
.hamburger span{display:block;width:22px;height:2px;background:var(--fg);margin:4px 0;border-radius:2px}

/* Buttons */
.btn{display:inline-block;background:linear-gradient(135deg,var(--acc),var(--acc-2));color:white;border:0;padding:10px 16px;border-radius:12px;box-shadow:var(--shadow);cursor:pointer}
.btn.ghost{background:transparent;color:var(--fg);border:1px solid var(--line);box-shadow:none}
.btn.small{padding:8px 12px;border-radius:10px}

/* Hero */
.hero{position:relative;padding:72px 0 36px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center}
.hero-copy h1{font-size:clamp(28px,5vw,48px);line-height:1.08;margin:0 0 10px}
.hero-copy p{color:var(--muted);margin:0 0 16px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.trust{display:flex;gap:16px;flex-wrap:wrap;color:var(--muted);margin-top:14px}
.hero-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}
.status{display:flex;gap:12px;align-items:center;padding:6px 0}
.lamp{width:10px;height:10px;border-radius:50%;background:var(--acc)}
.lamp.ok{background:var(--ok)}
.lamp.warn{background:var(--warn)}
.bg-shape{position:absolute;inset:-30% -20% auto -20%;height:80%;z-index:0;background:radial-gradient(700px 400px at 10% 10%, color-mix(in oklab, var(--acc) 35%, transparent), transparent 60%)}

/* Sections */
.section{padding:44px 0}
.section.alt{background:var(--card)}

/* Cards, lists */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:var(--shadow);transform:translateY(12px);opacity:0;transition:.6s ease}
.card.revealed{transform:none;opacity:1}
.team img{width:100%;height:180px;object-fit:cover;border-radius:10px;margin-bottom:10px}
.bullets{line-height:1.8}
.lead{color:var(--muted)}

/* Pricing */
.pricing-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.toggle{display:flex;align-items:center;gap:10px;color:var(--muted)}
.switch{position:relative;display:inline-block;width:44px;height:24px}
.switch input{display:none}
.slider{position:absolute;cursor:pointer;inset:0;background:#c7d2fe;border-radius:12px;transition:.2s}
.slider:before{content:"";position:absolute;height:20px;width:20px;left:2px;top:2px;background:white;border-radius:50%;transition:.2s;box-shadow:var(--shadow)}
.switch input:checked + .slider{background:#93c5fd}
.switch input:checked + .slider:before{transform:translateX(20px)}
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.price-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}
.price-card.featured{outline:2px solid var(--acc)}
.price{font-size:32px;font-weight:700;margin:6px 0 10px}
.price-card ul{padding-left:18px;margin:0 0 12px;color:var(--muted)}

/* Slider */
.slider{position:relative}
.slides{display:flex;overflow:hidden;scroll-behavior:smooth}
.slide{min-width:100%;padding:14px;background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.slide blockquote{font-size:18px;margin:0 0 8px}
.slide-btn{position:absolute;top:50%;transform:translateY(-50%);background:var(--bg);border:1px solid var(--line);border-radius:12px;width:36px;height:36px;display:grid;place-items:center;cursor:pointer}
.slide-btn.prev{left:-6px}
.slide-btn.next{right:-6px}

/* Accordion */
.accordion details{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px;margin:8px 0;box-shadow:var(--shadow)}
.accordion summary{cursor:pointer;font-weight:600}

/* Forms */
.contact{display:grid;gap:12px;max-width:560px}
.contact input,.contact textarea{width:100%;padding:10px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--fg)}

/* Footer */
.site-footer{border-top:1px solid var(--line);background:var(--card)}
.foot{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px}
.foot a{text-decoration:none;color:var(--fg);opacity:.85}
.foot a:hover{opacity:1}

/* Utils */
.center{text-align:center}

/* Responsive with mobile menu fix */
@media (max-width:960px){
  .hero-grid{grid-template-columns:1fr}
  .cards, .pricing-grid{grid-template-columns:1fr}

  .links{
    display:none;
    position:absolute;
    top:100%; left:0; right:0;
    background:var(--bg);
    border-top:1px solid var(--line);
    box-shadow:var(--shadow);
    padding:12px;
    z-index:1001;
  }
  .links.open{display:flex;flex-direction:column;gap:12px}
  .hamburger{display:block}
}
