:root{
  --bg:#0e0f12;
  --panel:#15171c;
  --text:#e9eef5;
  --muted:#9aa6b2;
  --primary:#1ea7ff;
  --primary-700:#118bd4;
  --accent:#00f5a0;
  --danger:#ff4d4f;
  --border:#232730;
  --card:#111318;
  --shadow:0 10px 30px rgba(0,0,0,.35);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:'Montserrat',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  background:radial-gradient(1200px 600px at 120% -10%, rgba(30,167,255,.12), transparent 60%),
            radial-gradient(800px 400px at -10% 10%, rgba(0,245,160,.08), transparent 60%),
            var(--bg);
  line-height:1.6;
}

/* Global link styles */
a{color:#fff;text-decoration:none}
a:hover{color:var(--primary)}
a:visited{color:#fff}
a:visited:hover{color:var(--primary)}

.container{width:min(1200px,92%);margin:0 auto}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(14,15,18,.8);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--border);padding:0 20px}
.header-inner{width:100%;display:flex;align-items:center;justify-content:space-between;padding:14px 0;max-width:1200px;margin:0 auto}
.logo{display:inline-flex;align-items:center;gap:8px;color:var(--text);text-decoration:none;font-weight:800;letter-spacing:.5px;outline-offset:2px;text-transform:uppercase}
.logo:focus{outline:2px solid var(--primary)}
.logo .logo-mark{display:inline-grid;place-items:center;width:28px;height:28px;background:linear-gradient(135deg,var(--primary),var(--accent));color:#000;border-radius:6px;font-weight:900}
.main-nav ul{display:flex;gap:18px;list-style:none;margin:0;padding:0;transition:all .3s ease}
.main-nav a{color:var(--muted);text-decoration:none;font-weight:600;outline-offset:2px;transition:color .2s ease}
.main-nav a:focus{outline:2px solid var(--primary)}
.main-nav a[aria-current="page"], .main-nav a:hover{color:var(--text)}
.nav-toggle{display:none;background:transparent;border:1px solid var(--border);color:var(--text);border-radius:8px;padding:8px 10px;cursor:pointer;outline-offset:2px;transition:background .2s ease}
.nav-toggle:focus{outline:2px solid var(--primary)}
.nav-toggle:hover{background:var(--panel)}
.header-phone{color:var(--text);text-decoration:none;font-weight:700;outline-offset:2px;transition:color .2s ease}
.header-phone:focus{outline:2px solid var(--primary)}
.header-phone:hover{color:var(--primary)}

/* Hero */
.hero{padding:56px 0 28px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,rgba(17,19,24,.4),transparent)}
.hero-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center}
.hero h1{margin:0 0 12px;font-size:40px;line-height:1.2}
.hero p{margin:0 0 18px;color:var(--muted)}
.hero-cta{display:flex;gap:12px;margin-top:6px}
.hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 0;padding:0;list-style:none}
.hero-badges li{border:1px solid var(--border);padding:6px 10px;border-radius:20px;color:var(--muted)}
.hero-media{height:320px;border-radius:16px;border:1px solid var(--border);overflow:hidden;box-shadow:var(--shadow)}
.hero-video{width:100%;height:100%;object-fit:cover;display:block}

/* Showcase */
.showcase{padding:36px 0}
.showcase h2{margin:0 0 16px;font-size:28px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;height:100%}
.card-media{height:160px;background:linear-gradient(135deg,#1b1e25,#0f1116);flex-shrink:0;overflow:hidden}
.card-media img{width:100%;height:100%;object-fit:cover;object-position:center}
.placeholder-img{background-image:linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,.02),rgba(255,255,255,.06));background-size:200% 100%;animation:shimmer 3s infinite}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.card-body{padding:14px;display:flex;flex-direction:column;flex:1}
.card h3{margin:0 0 8px;font-size:18px;flex-shrink:0}
.card p{margin:0 0 12px;color:var(--muted);flex:1}
.card-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;flex-shrink:0}
.price{font-weight:800;color:#fff;white-space:nowrap}

/* CTA wide */
.cta-wide{padding:28px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:linear-gradient(180deg,transparent,rgba(0,245,160,.05))}
.inline-form{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.inline-form input[type="text"],
.inline-form input[type="tel"],
textarea,
input:not([type="checkbox"]),
select{
  background:#0c0e12;border:1px solid var(--border);color:var(--text);
  padding:12px;border-radius:10px;outline-offset:2px;min-width:220px;transition:border .2s ease;font-size:16px
}
input:not([type="checkbox"]):focus,
textarea:focus,
select:focus{
  outline:2px solid var(--primary);
  border-color:var(--primary)
}
input[type="checkbox"]{
  appearance:none;width:18px;height:18px;border:1px solid var(--border);border-radius:4px;background:#0c0e12;cursor:pointer;outline-offset:2px;transition:all .2s ease;flex-shrink:0;margin-top:2px
}
input[type="checkbox"]:checked{
  background:var(--primary);border-color:var(--primary);
}
input[type="checkbox"]:focus{
  outline:2px solid var(--primary)
}
.inline-form .consent{display:flex;align-items:flex-start;gap:8px;color:var(--muted);font-size:12px}
.inline-form .consent a{color:var(--primary)}

/* Benefits */
.benefits{padding:28px 0}
.benefits-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.benefits-grid li{border:1px solid var(--border);background:var(--panel);border-radius:12px;padding:14px}
.benefits-grid h3{margin:0 0 8px}
.benefits-grid p{margin:0;color:var(--muted)}

/* Split CTA */
.cta-split{padding:28px 0}
.split{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.split-item{border:1px solid var(--border);border-radius:14px;background:var(--panel);padding:16px}

/* Footer */
.site-footer{border-top:1px solid var(--border);margin-top:28px;background:#0b0d11}
.footer-grid{display:grid;grid-template-columns:2fr 2fr;gap:16px;padding:18px 0}
.footer-nav{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.footer-phone{color:#fff;text-decoration:none}
.legal-bottom{padding:10px 0;border-top:1px solid var(--border);color:var(--muted)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:12px;padding:10px 14px;font-weight:700;border:1px solid transparent;cursor:pointer;text-decoration:none;outline-offset:2px;transition:all .2s ease}
.btn:focus{outline:2px solid var(--primary)}
.btn-primary{background:linear-gradient(135deg,var(--primary),#52d3ff);color:#001014}
.btn-primary:hover{filter:brightness(1.05)}
.btn-primary:active{transform:scale(.98)}
.btn-secondary{background:#0f1217;border-color:var(--border);color:#fff}
.btn-secondary:hover{background:#131721;border-color:var(--primary)}
.btn-secondary:active{transform:scale(.98)}
.btn-outline{background:transparent;border-color:var(--border);color:#fff}
.btn-outline:hover{border-color:var(--primary);color:var(--primary)}
.btn-outline:active{transform:scale(.98)}

/* Cookie banner */
.cookie-banner{position:sticky;top:0;background:#0b0d11;border-bottom:1px solid var(--border);}
.cookie-content{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 0}
.cookie-content p{margin:0;color:var(--muted)}
.cookie-content a{color:var(--primary)}

/* Forms & notices */
.form{display:grid;gap:12px}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form label{display:flex;flex-direction:column}
.form .consent{display:flex;align-items:flex-start;gap:8px;color:var(--muted);font-size:12px}
.form .notice{color:var(--muted);font-size:12px}
.error{color:var(--danger);font-size:12px}

/* Sections */
main section+section{scroll-margin-top:80px}
.delivery-section{margin-bottom:24px}
.delivery-section:last-child{margin-bottom:0}
h1,h2,h3,h4{line-height:1.25}
.micro{font-size:12px;color:var(--muted)}

/* Page-specific styles */
.about-content,.delivery-main,.privacy-main,.contacts-main{padding:24px 0}
.about-content{display:grid}
.about-requisites{padding-bottom:24px}
.delivery-section{margin-top:16px}
.contacts-split{margin-top:12px}
.yandex-map{height:300px;border:1px solid var(--border);border-radius:12px;background:#0f1217;margin-top:12px;overflow:hidden}
.benefits-grid-2col{grid-template-columns:1fr 1fr!important}

/* Responsive */
@media (max-width: 960px){
  .hero-inner{grid-template-columns:1fr}
  .hero h1{font-size:32px}
  .grid{grid-template-columns:repeat(2,1fr)}
  .benefits-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .inline-form{flex-direction:column;align-items:flex-start}
  .inline-form input[type="text"],
  .inline-form input[type="tel"]{width:100%;min-width:unset}
  .inline-form .btn{align-self:flex-start}
  .card-meta{flex-direction:column;align-items:stretch}
  .card-meta .price{text-align:center;margin-bottom:8px}
  .card-meta .btn{width:100%}
  .site-header{padding:0 16px}
}
/* Accessibility: Respect motion preferences */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}
}

@media (max-width: 640px){
  .yandex-map{height:250px}
  .main-nav ul{display:none}
  .main-nav ul.active{display:flex!important;position:absolute;right:0;top:100%;left:0;background:#0b0d11;border:1px solid var(--border);border-top:none;padding:12px;border-radius:0 0 10px 10px;flex-direction:column;gap:10px;z-index:51;width:100%}
  .main-nav a{display:block;padding:8px 0}
  .nav-toggle{display:inline-flex;margin-left:auto}
  .header-phone{font-size:14px}
  .grid{grid-template-columns:1fr}
  .form .row{grid-template-columns:1fr}
  .hero{padding:40px 0 20px}
  .hero h1{font-size:24px}
  .hero p{font-size:14px}
  .hero-cta{flex-direction:column}
  .hero-cta .btn{width:100%}
  .hero-badges{flex-direction:column;gap:8px}
  .hero-badges li{width:100%;text-align:center}
  .hero-media{height:240px}
  .inline-form{flex-direction:column;gap:8px}
  .inline-form input[type="text"],
  .inline-form input[type="tel"],
  .inline-form .consent{width:100%}
  .inline-form .btn{width:100%}
  .split{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .card{min-height:auto}
  .card h3{font-size:16px}
  .card p{font-size:13px}
  .benefits-grid,.benefits-grid-2col{grid-template-columns:1fr!important}
  .cta-split{padding:20px 0}
  .showcase{padding:24px 0}
  .benefits{padding:20px 0}
  h1{font-size:24px!important}
  h2{font-size:20px!important}
  .container{padding:0 16px}
}