/* ============================================================
   ЭнергияКитай — «Солнечный космос» v3
   Принципиально новый дизайн: асимметрия, слои, стеклянные
   панели, космическая атмосфера. Светлая база.
   ============================================================ */

:root {
  --bg:        #EAF1F6;
  --bg-2:      rgba(255,255,255,.68);
  --bg-warm:   #E8F0F6;
  --bg-deep:   #2F4050;
  --accent:    #E36B1E;
  --accent-2:  #C75A14;
  --gold:      #E36B1E;
  --steel:     #6B7C8F;
  --blue:      #3F74A0;
  --text:      #152433;
  --muted:     #546778;
  --light:     #8494A4;
  --border:    #CDD8E3;
  --sky:       #2F4050;
  --err:       #B45309;
  --glass:     rgba(255,255,255,.72);
  --glass-2:   rgba(255,255,255,.88);
  --glow:      rgba(227,107,30,.16);
  --radius:    16px;
  --radius-sm: 10px;
  --header-h:  118px;
  --font:      'Outfit', system-ui, sans-serif;
  --font-display: 'Unbounded', 'Outfit', system-ui, sans-serif;
  --t:         .3s cubic-bezier(.4,0,.2,1);
  --dn:        0.28;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 20px); }
body {
  font-family:var(--font); color:var(--text);
  line-height:1.6; font-size:16px; -webkit-font-smoothing:antialiased;
  overflow-x:hidden; position:relative;
  background:
    linear-gradient(180deg,
      rgba(186,214,235, calc(1 - var(--dn))) 0%,
      rgba(232,238,244, calc(0.85 - var(--dn) * .55)) 38%,
      rgba(18,28,42, calc(var(--dn) * .92)) 100%),
    radial-gradient(ellipse 80% 50% at 70% 0%,
      rgba(255,210,120, calc((1 - var(--dn)) * .35)), transparent 60%),
    #1A2838;
  transition:color .6s ease;
}
body.is-night {
  --text: #E8EEF4;
  --muted: #A8B6C4;
  --border: rgba(255,255,255,.14);
  --bg: #152433;
  --bg-2: #182636;
  --glass: rgba(16,26,40,.62);
  --glass-2: rgba(18,28,42,.78);
  --bg-warm: #1C2C3E;
}
body.is-night .header {
  background:linear-gradient(180deg, rgba(14,24,38,.92), rgba(18,30,46,.88));
  border-bottom-color:rgba(255,255,255,.08);
}
body.is-night .section__title,
body.is-night .bento__title { color:#F2F6FA; }

/* Светлые «бумажные» блоки: ночью тёмный фон, иначе текст засвечивается */
body.is-night .how__step,
body.is-night .runtime-card,
body.is-night .safety-card,
body.is-night .product-card,
body.is-night .filters,
body.is-night .form-card,
body.is-night .contact-manager,
body.is-night .cat-banner,
body.is-night .modal {
  background:#182636;
  border-color:rgba(255,255,255,.12);
}
body.is-night .how__step h3,
body.is-night .runtime-card h3,
body.is-night .safety-card h3,
body.is-night .cat-banner h2,
body.is-night .calc-banner h3,
body.is-night .product-card__name,
body.is-night .product-card__price { color:#F2F6FA; }
body.is-night .how__step p,
body.is-night .runtime-card p,
body.is-night .safety-card p,
body.is-night .calc-banner p,
body.is-night .cat-banner p,
body.is-night .product-card__specs,
body.is-night .footer__brand p { color:#C9D4E0; }
body.is-night .calc-banner {
  background:linear-gradient(120deg, #182636 0%, #243044 52%, #2E2618 100%);
  border-color:rgba(255,255,255,.12);
  color:#F2F6FA;
}
body.is-night .footer {
  background:#121C28;
  color:#E8EEF4;
  border-top-color:rgba(255,255,255,.1);
}
body.is-night .footer a { color:#D5DEE8; }
body.is-night .footer a:hover { color:#FFD089; }
body.is-night .runtime-card__hours {
  background:#F4F7FB;
  color:#152433;
}
body.is-night .bento__tile--dark,
body.is-night .bento__tile--light {
  background:#243044;
  color:#F2F6FA;
}
body.is-night .bento__tile--dark .bento__text,
body.is-night .bento__tile--light .bento__text { color:#C9D4E0; }
body.is-night .bento__tile--light .bento__arrow {
  background:rgba(255,255,255,.12); color:#F2F6FA;
}
body.is-night .cookie-bar {
  color:#E8EEF4;
  background:rgba(18,28,42,.94);
}
body.is-night .form-group input,
body.is-night .form-group textarea,
body.is-night .search-input {
  background:#121C28;
  color:#F2F6FA;
}
body.is-night .btn--outline {
  background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.22); color:#F2F6FA;
}
main, .header, .footer { position:relative; z-index:1; }
img,svg { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
ul,ol { list-style:none; }
.container { max-width:1240px; margin:0 auto; padding:0 24px; }

/* ---------- Global natural sky (behind every page) ---------- */
.sky-ambient {
  position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden;
}
/* Sun — arcs down and fades as night falls */
.sky-ambient__sun {
  position:absolute; top:6%; right:12%;
  width:min(30vw,320px); height:min(30vw,320px); border-radius:50%;
  background:radial-gradient(circle at 50% 50%,
    rgba(255,248,218,.95) 0%, rgba(255,216,132,.72) 26%,
    rgba(255,182,92,.32) 48%, transparent 70%);
  opacity:calc(1 - var(--dn) * 1.25);
  transform:translateY(calc(var(--dn) * 46vh)) scale(calc(1 - var(--dn) * .18));
  animation:sunBreathe 9s ease-in-out infinite alternate;
}
/* Moon — rises as day fades */
.sky-ambient__moon {
  position:absolute; top:9%; left:13%;
  width:min(11vw,116px); height:min(11vw,116px); border-radius:50%;
  opacity:calc((var(--dn) - .45) * 2.4);
  transform:translateY(calc((1 - var(--dn)) * -32vh));
  background:radial-gradient(circle at 38% 34%, #FDFCF5 0%, #E7ECF5 44%, #B9C6D8 80%);
  box-shadow:0 0 46px rgba(210,225,255,.4), inset -14px -8px 0 rgba(160,180,210,.32);
}
.sky-ambient__moon span {
  position:absolute; inset:0; border-radius:50%;
  background:
    radial-gradient(circle at 62% 60%, rgba(150,170,200,.35) 0 6%, transparent 7%),
    radial-gradient(circle at 40% 70%, rgba(150,170,200,.3) 0 5%, transparent 6%),
    radial-gradient(circle at 56% 38%, rgba(150,170,200,.25) 0 4%, transparent 5%);
}
.sky-ambient__glow {
  position:absolute; top:-8%; right:4%; width:min(46vw,460px); height:min(46vw,460px);
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,214,140,.24) 0%, rgba(227,107,30,.08) 35%, transparent 70%);
  opacity:calc(1 - var(--dn) * .75);
  animation:skyGlow 12s ease-in-out infinite alternate;
}
.sky-ambient__rays {
  position:absolute; top:-20%; right:-14%; width:min(72vw,820px); height:min(72vw,820px);
  background:conic-gradient(from 210deg at 50% 50%,
    transparent 0deg, rgba(255,210,120,.05) 18deg, transparent 36deg,
    rgba(255,196,90,.08) 54deg, transparent 72deg, rgba(255,230,160,.05) 90deg,
    transparent 110deg, rgba(255,200,100,.06) 130deg, transparent 150deg,
    rgba(255,220,140,.04) 170deg, transparent 200deg);
  filter:blur(8px); mix-blend-mode:screen;
  opacity:calc((1 - var(--dn)) * .75);
  animation:skyRays 54s linear infinite;
}
.sky-ambient__aurora {
  position:absolute; inset:0;
  opacity:calc(var(--dn) * (1 - var(--dn)) * 3.2);
  background:
    radial-gradient(ellipse 60% 30% at 28% 16%, rgba(120,180,255,.24), transparent 62%),
    radial-gradient(ellipse 52% 26% at 74% 24%, rgba(176,140,255,.2), transparent 60%);
  filter:blur(16px); mix-blend-mode:screen;
  animation:auroraDrift 16s ease-in-out infinite alternate;
}
.sky-ambient__clouds { position:absolute; inset:0; opacity:calc(1 - var(--dn) * .92); }
.sky-cloud {
  position:absolute; left:-32%;
  width:calc(230px * var(--cs,1)); height:calc(66px * var(--cs,1));
  background:radial-gradient(closest-side, rgba(255,255,255,.92), rgba(255,255,255,.5) 68%, transparent);
  border-radius:50%; filter:blur(6px);
  animation-name:cloudDrift; animation-timing-function:linear; animation-iteration-count:infinite;
}
.sky-cloud::before, .sky-cloud::after { content:''; position:absolute; border-radius:50%; background:inherit; }
.sky-cloud::before { width:62%; height:150%; left:12%; top:-52%; }
.sky-cloud::after  { width:48%; height:120%; right:10%; top:-32%; }
.sky-ambient__stars { position:absolute; inset:0; opacity:calc(var(--dn) * var(--dn) * 1.25); }
.sky-star {
  position:absolute; border-radius:50%;
  background:rgba(255,255,255,.95); box-shadow:0 0 6px rgba(255,236,180,.55);
  animation:skyTwinkle ease-in-out infinite;
}
.sky-ambient__motes { position:absolute; inset:0; opacity:calc(.45 + var(--dn) * .3); }
.sky-mote {
  position:absolute; width:3px; height:3px; border-radius:50%;
  background:rgba(255,235,170,.8); box-shadow:0 0 8px rgba(255,205,110,.6);
  animation:skyMote linear infinite;
}
body.is-night .sky-mote { background:rgba(190,220,255,.82); box-shadow:0 0 8px rgba(150,190,255,.6); }
/* Soft distant horizon — hazy rolling land */
.sky-ambient__hills { position:absolute; left:0; right:0; bottom:0; height:34vh; }
.sky-hill { position:absolute; left:-8%; right:-8%; bottom:0; filter:blur(3px); }
.sky-hill--far {
  height:26vh; border-radius:50% 50% 0 0 / 100% 100% 0 0; transform:scaleX(1.35);
  background:linear-gradient(180deg, rgba(120,152,150, calc(.3 - var(--dn) * .12)), rgba(72,104,112,.22));
  filter:blur(4px) brightness(calc(1 - var(--dn) * .5));
}
.sky-hill--near {
  height:17vh; left:-12%; right:-12%; border-radius:52% 48% 0 0 / 100% 100% 0 0;
  background:linear-gradient(180deg, rgba(58,88,80, calc(.42 - var(--dn) * .06)), rgba(26,44,50,.42));
  filter:blur(2px) brightness(calc(1 - var(--dn) * .55));
}
@keyframes skyRays { to { transform:rotate(360deg); } }
@keyframes skyGlow { from { transform:scale(1); } to { transform:scale(1.08); } }
@keyframes sunBreathe { from { filter:blur(1px); } to { filter:blur(6px); } }
@keyframes auroraDrift { from { transform:translateX(-3%); } to { transform:translateX(3%); } }
@keyframes cloudDrift { from { transform:translateX(0); } to { transform:translateX(170vw); } }
@keyframes skyTwinkle { 0%,100% { opacity:.28; transform:scale(.82); } 50% { opacity:1; transform:scale(1.2); } }
@keyframes skyMote {
  0% { transform:translate3d(0,0,0) scale(.6); opacity:0; }
  15% { opacity:.85; }
  100% { transform:translate3d(var(--mx), var(--my), 0) scale(1.05); opacity:0; }
}

/* ---------- Sun/Moon cycle toggle (hero) ---------- */
.suncycle {
  display:inline-flex; align-items:center; gap:14px;
  margin:6px 0 26px; padding:8px 16px 8px 8px;
  border:1px solid rgba(255,255,255, calc(.4 - var(--dn) * .22));
  border-radius:999px; background:rgba(12,24,40, calc(.1 + var(--dn) * .24));
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  cursor:pointer; transition:transform .2s ease, background .5s ease, border-color .5s ease;
}
.suncycle:hover { transform:translateY(-1px); }
.suncycle:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.suncycle__track {
  position:relative; width:66px; height:30px; border-radius:999px; flex-shrink:0;
  background:linear-gradient(90deg, #7EC8FF, #FDE9A9 46%, #24406B);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.3), inset 0 2px 6px rgba(0,0,0,.2);
  overflow:hidden;
}
.suncycle__track::after {
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at 82% 40%, rgba(255,255,255,.5), transparent 32%);
  opacity:var(--dn);
}
.suncycle__orb {
  position:absolute; top:3px; left:3px; width:24px; height:24px; border-radius:50%;
  background:radial-gradient(circle at 35% 35%, #FFF6C8, #F6A73C 60%, #E36B1E);
  box-shadow:0 2px 8px rgba(0,0,0,.35);
  transform:translateX(calc(var(--dn) * 36px));
}
body.is-night .suncycle__orb {
  background:radial-gradient(circle at 38% 34%, #F1F5FF, #C3D0E6 58%, #8FA3C4);
  box-shadow:0 2px 8px rgba(0,0,0,.4), inset -3px -2px 0 rgba(120,140,175,.5);
}
.suncycle__txt { display:flex; flex-direction:column; line-height:1.2; text-align:left; }
.suncycle__txt b { font-size:13px; font-weight:750; }
.suncycle__txt i { font-style:normal; font-size:11px; opacity:.72; }

.sky-ambient { z-index:0; }
main, #site-footer { position:relative; z-index:1; }
#site-header { position:relative; z-index:100; }
#site-modals, .calc-fab, .dock, .cookie-bar, .loader { z-index:200; }
.mobile-nav { z-index:150; }

/* ---------- Loader ---------- */
.loader {
  position:fixed; inset:0; z-index:900; background:#EAF1F6;
  display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:16px; transition:opacity .5s, visibility .5s;
}
.loader.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.loader .nature-mill { width:72px; height:100px; }
.loader .nature-mill line { stroke:#F59E0B; }
.loader__txt { color:var(--muted); font-size:13px; letter-spacing:.1em; text-transform:uppercase; }

/* ---------- Header ---------- */
.header {
  position:sticky; top:0; z-index:100;
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(244,249,252,.9));
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(205,216,227,.9);
  box-shadow:0 10px 30px rgba(21,36,51,.05);
}
.header__top {
  background:linear-gradient(90deg, #2F4050 0%, #3A5163 55%, #35586E 100%);
  color:rgba(255,255,255,.88);
}
.header__top-inner {
  min-height:42px;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding-top:8px; padding-bottom:8px;
  overflow:hidden;
}
.header__phones {
  display:flex; align-items:center; flex-wrap:nowrap; gap:6px 0;
  min-width:0; flex:1 1 auto; overflow:hidden;
}
.header__phones-ico {
  width:28px; height:28px; border-radius:8px;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.12); margin-right:8px; flex-shrink:0;
}
.header__phones-ico svg { width:14px; height:14px; color:#FFD089; }
.header__phone {
  font-size:13px; font-weight:650; letter-spacing:.01em;
  color:#fff; white-space:nowrap; padding:2px 2px;
  transition:color var(--t);
}
.header__phone:hover { color:#FFD089; }
.header__phone-sep {
  width:4px; height:4px; border-radius:50%;
  background:rgba(255,255,255,.35); margin:0 10px; flex-shrink:0;
}
.header__address {
  display:flex; align-items:center; gap:8px;
  font-size:13px; color:rgba(255,255,255,.78);
  white-space:nowrap; min-width:0; flex:0 1 220px; overflow:hidden;
}
.header__address svg { width:15px; height:15px; color:#FFD089; flex-shrink:0; }
.header__address span { overflow:hidden; text-overflow:ellipsis; }

.header__main-inner {
  display:flex; align-items:center; gap:28px;
  min-height:76px; padding-top:10px; padding-bottom:10px;
}
.header__logo {
  display:flex; align-items:center; gap:12px;
  flex-shrink:0; max-width:280px;
}
.header__logo svg {
  width:34px; height:34px; color:var(--accent); flex-shrink:0;
  filter:drop-shadow(0 4px 10px rgba(227,107,30,.28));
}
.header__logo-text {
  display:flex; flex-direction:column; gap:2px; line-height:1.15; min-width:0;
}
.header__logo-text strong {
  font-family:var(--font-display);
  font-size:14px; font-weight:600; letter-spacing:-.01em;
  color:var(--text); white-space:nowrap;
}
.header__logo-text em {
  font-style:normal; font-size:11px; font-weight:500;
  color:var(--muted); letter-spacing:.02em;
}

.header__nav {
  display:flex; align-items:center; gap:8px;
  flex:1 1 auto; justify-content:center;
}
.header__nav a {
  position:relative;
  font-size:14px; font-weight:700; letter-spacing:.01em;
  color:#1E3A52;
  padding:9px 16px; border-radius:12px;
  background:linear-gradient(180deg, #F7FBFE, #E4F0F8);
  border:1px solid #C5D7E8;
  box-shadow:0 1px 2px rgba(32,74,110,.08);
  transition:color var(--t), background var(--t), border-color var(--t), box-shadow var(--t);
}
.header__nav a:hover {
  color:var(--accent-2);
  border-color:rgba(227,107,30,.45);
  background:linear-gradient(180deg, #fff, #F3F8FC);
  box-shadow:0 4px 12px rgba(227,107,30,.14);
}
.header__nav a.active {
  color:#fff;
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  border-color:transparent;
  box-shadow:0 6px 16px rgba(227,107,30,.28);
}
body.is-night .header__nav a {
  color:#F4F7FB;
  background:rgba(255,255,255,.1);
  border-color:rgba(255,255,255,.2);
  box-shadow:none;
}
body.is-night .header__nav a:hover {
  color:#fff;
  background:rgba(255,255,255,.16);
  border-color:rgba(255,210,137,.45);
}
body.is-night .header__nav a.active {
  color:#fff;
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  border-color:transparent;
  box-shadow:0 6px 16px rgba(227,107,30,.35);
}
body.is-night .header__cart {
  background:rgba(255,255,255,.1);
  border-color:rgba(255,255,255,.2);
  color:#F4F7FB;
}
body.is-night .burger {
  background:rgba(255,255,255,.1);
  border-color:rgba(255,255,255,.2);
}
body.is-night .mobile-nav {
  background:linear-gradient(180deg, #142032, #0E1826);
}

.header__actions {
  display:flex; align-items:center; gap:10px; flex-shrink:0; margin-left:auto;
}
.header__cart {
  position:relative; width:46px; height:46px;
  display:flex; align-items:center; justify-content:center;
  border-radius:14px; background:var(--bg-warm); border:1px solid var(--border);
  transition:var(--t);
}
.header__cart:hover { background:var(--accent); color:#fff; border-color:var(--accent); }
.header__cart svg { width:20px; height:20px; }
.header__cart-count {
  position:absolute; top:-5px; right:-5px;
  min-width:18px; height:18px; padding:0 4px;
  background:var(--accent-2); color:#fff;
  font-size:11px; font-weight:700; border-radius:9px;
  display:none; align-items:center; justify-content:center; border:2px solid #fff;
}
.header__cart-count.visible { display:flex; }
.burger {
  display:none; flex-direction:column; gap:5px; width:46px; height:46px;
  align-items:center; justify-content:center;
  border-radius:14px; border:1px solid var(--border); background:#fff;
}
.burger span { display:block; width:18px; height:2px; background:var(--text); transition:var(--t); border-radius:2px; }
.burger.open span:nth-child(1) { transform:rotate(45deg) translate(4px,5px); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:rotate(-45deg) translate(4px,-5px); }

.mobile-nav {
  display:none; position:fixed; inset:var(--header-h) 0 0 0;
  background:linear-gradient(180deg, #fff, #F3F7FB);
  z-index:99; padding:20px 24px 32px;
  flex-direction:column; gap:4px;
  transform:translateY(-12px); opacity:0; visibility:hidden; transition:var(--t);
  overflow:auto;
}
.mobile-nav.open { transform:translateY(0); opacity:1; visibility:visible; }
.mobile-nav__contacts {
  padding:14px 0 18px; margin-bottom:8px;
  border-bottom:1px solid var(--border);
}
.mobile-nav__contacts .header__phones {
  flex-direction:column; align-items:flex-start; gap:8px; margin-bottom:12px;
}
.mobile-nav__contacts .header__phone { color:var(--text); font-size:16px; }
.mobile-nav__contacts .header__phone-sep { display:none; }
.mobile-nav__contacts .header__address { color:var(--muted); white-space:normal; }
.mobile-nav__contacts .header__address svg { color:var(--accent); }
.mobile-nav a {
  padding:14px 4px; font-size:17px; font-weight:650;
  border-bottom:1px solid var(--border); color:var(--text);
}

/* ---------- Buttons ---------- */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:46px; padding:0 28px;
  font-size:15px; font-weight:700; border-radius:40px;
  transition:all var(--t); white-space:nowrap; position:relative; overflow:hidden;
}
.btn--primary { background:var(--accent); color:#fff; }
.btn--primary:hover { background:var(--accent-2); }
.btn--outline { background:transparent; color:var(--sky); border:2px solid var(--border); }
.btn--outline:hover { border-color:var(--accent); color:var(--accent); }
.btn--ghost { background:var(--bg-warm); color:var(--muted); }
.btn--ghost:hover { color:var(--text); }
.btn--sm { min-height:38px; padding:0 18px; font-size:13px; }
.btn--lg { min-height:54px; padding:0 36px; font-size:16px; }
.btn--full { width:100%; }

/* ---------- HERO: day/night theme ---------- */
.hero--theme {
  position:relative; min-height:calc(100vh - var(--header-h));
  display:flex; align-items:flex-end; overflow:hidden;
  background:#0E1A28;
}
.theme-sky { position:absolute; inset:0; overflow:hidden; }
.theme-sky__layer {
  position:absolute; inset:-3%;
  background-size:cover; background-position:center 42%;
  transform:scale(1.06);
  will-change:opacity, filter;
}
.theme-sky__layer--day {
  opacity:calc(1 - var(--dn));
  filter:brightness(calc(1.05 - var(--dn) * .35)) saturate(calc(1.1 - var(--dn) * .4));
}
.theme-sky__layer--night {
  opacity:var(--dn);
  filter:brightness(calc(.75 + var(--dn) * .35)) contrast(1.05);
}
.theme-sky__wash {
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(8,16,28, calc(.55 + var(--dn) * .25)) 0%, rgba(8,16,28,.12) 55%, transparent 78%),
    linear-gradient(180deg, transparent 40%, rgba(8,16,28, calc(.35 + var(--dn) * .4)) 100%);
}
.theme-sky__rays {
  position:absolute; inset:-30%; z-index:3; pointer-events:none;
  opacity:calc((1 - var(--dn)) * .7);
  background:conic-gradient(from 200deg at 78% 18%,
    transparent 0deg, rgba(255,230,160,.16) 14deg, transparent 32deg,
    transparent 50deg, rgba(255,200,100,.1) 68deg, transparent 95deg, transparent 360deg);
  mix-blend-mode:screen;
  animation:themeRays 40s linear infinite;
}
.theme-sky__beams {
  position:absolute; inset:0; z-index:3; pointer-events:none;
  opacity:calc((1 - var(--dn)) * .55);
  background:
    linear-gradient(118deg, transparent 42%, rgba(255,236,180,.14) 48%, transparent 54%),
    linear-gradient(128deg, transparent 50%, rgba(255,210,120,.1) 56%, transparent 62%);
  mix-blend-mode:screen;
  animation:themeBeams 14s ease-in-out infinite alternate;
}
.theme-sky__aurora {
  position:absolute; inset:0; z-index:3; pointer-events:none;
  opacity:calc(var(--dn) * (1 - var(--dn)) * 3.2);
  background:
    radial-gradient(ellipse 70% 40% at 30% 70%, rgba(255,140,80,.22), transparent 60%),
    radial-gradient(ellipse 50% 35% at 75% 40%, rgba(120,160,255,.18), transparent 55%);
  mix-blend-mode:screen;
  filter:blur(8px);
  animation:themeAurora 10s ease-in-out infinite alternate;
}
.theme-sky__motes {
  position:absolute; inset:0; z-index:4; pointer-events:none;
  opacity:calc((1 - var(--dn)) * .85);
}
.theme-mote {
  position:absolute; width:3px; height:3px; border-radius:50%;
  background:rgba(255,230,160,.85);
  box-shadow:0 0 8px rgba(255,200,100,.7);
  animation:themeMote linear infinite;
}
.theme-sky__haze {
  position:absolute; inset:0; z-index:2; pointer-events:none;
  opacity:calc((1 - var(--dn)) * .45);
  background:
    radial-gradient(ellipse 55% 35% at 70% 18%, rgba(255,236,190,.35), transparent 70%),
    radial-gradient(ellipse 40% 30% at 20% 80%, rgba(180,210,240,.2), transparent 65%);
  mix-blend-mode:soft-light;
  animation:themeHaze 18s ease-in-out infinite alternate;
}
.theme-sky__glow {
  position:absolute; inset:0; z-index:3; pointer-events:none;
  opacity:calc(var(--dn) * .65);
  background:radial-gradient(ellipse 60% 45% at 50% 100%, rgba(255,150,60,.18), transparent 55%);
  mix-blend-mode:screen;
}
.theme-sky__stars {
  position:absolute; inset:0; z-index:3; pointer-events:none;
  opacity:calc(var(--dn) * var(--dn) * 1.05);
}
.theme-star {
  position:absolute; border-radius:50%; background:#fff;
  box-shadow:0 0 6px rgba(255,236,200,.7);
  animation:themeTwinkle ease-in-out infinite;
}
.theme-sky__fireflies {
  position:absolute; inset:0; z-index:4; pointer-events:none;
  opacity:calc(var(--dn) * .95);
}
.theme-fly {
  position:absolute; width:4px; height:4px; border-radius:50%;
  background:#FDE68A;
  box-shadow:0 0 10px #FBBF24, 0 0 18px rgba(251,191,36,.6);
  animation:themeFly ease-in-out infinite;
}
.theme-sky__spark {
  position:absolute; inset:0; z-index:3; pointer-events:none;
  background:
    radial-gradient(circle at 72% 28%, rgba(255,210,130, calc((1 - var(--dn)) * .28)), transparent 28%),
    radial-gradient(circle at 58% 52%, rgba(255,170,80, calc(var(--dn) * .22)), transparent 22%);
  mix-blend-mode:screen;
}
@keyframes themeRays { to { transform:rotate(360deg); } }
@keyframes themeBeams {
  from { transform:translateX(-2%) scale(1); opacity:.4; }
  to { transform:translateX(2%) scale(1.04); opacity:.7; }
}
@keyframes themeAurora {
  from { transform:translateY(2%) scale(1); }
  to { transform:translateY(-2%) scale(1.05); }
}
@keyframes themeTwinkle {
  0%, 100% { opacity:.25; transform:scale(.85); }
  50% { opacity:1; transform:scale(1.15); }
}
@keyframes themeMote {
  0% { transform:translate3d(0,0,0) scale(.6); opacity:0; }
  15% { opacity:.9; }
  100% { transform:translate3d(var(--mx), var(--my), 0) scale(1.1); opacity:0; }
}
@keyframes themeFly {
  0%, 100% { transform:translate(0,0) scale(.7); opacity:.25; }
  40% { transform:translate(18px,-22px) scale(1.1); opacity:1; }
  70% { transform:translate(-12px,-10px) scale(.9); opacity:.55; }
}
@keyframes themeHaze {
  from { transform:translateX(-1.5%) scale(1); }
  to { transform:translateX(1.5%) scale(1.03); }
}

.hero__content--theme {
  position:relative; z-index:5;
  width:min(640px, 92%);
  margin:0 0 7vh 4vw;
  padding:36px 36px 32px;
  border-radius:22px;
  background:linear-gradient(145deg, rgba(255,255,255, calc(.82 - var(--dn) * .5)), rgba(255,255,255, calc(.58 - var(--dn) * .38)));
  border:1px solid rgba(255,255,255, calc(.45 - var(--dn) * .25));
  box-shadow:0 24px 60px rgba(8,16,28,.28);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
}
body.is-night .hero__content--theme {
  background:linear-gradient(145deg, rgba(14,24,38,.78), rgba(20,34,52,.7));
  border-color:rgba(255,255,255,.12);
  color:#F2F6FA;
}
body.is-night .hero__content--theme .hero__subtitle { color:#B7C4D2; }
body.is-night .hero__content--theme .hero__label {
  background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.14); color:#FFC98A;
}

.hero__label {
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; font-weight:700; letter-spacing:.04em;
  color:var(--accent-2); margin-bottom:18px; max-width:42em;
  background:var(--glass-2); padding:8px 16px; border-radius:8px;
  border:1px solid var(--border); text-transform:none;
}
.hero__label::before { content:''; width:8px; height:8px; flex-shrink:0; border-radius:50%; background:var(--accent); }
.hero__title {
  font-family:var(--font-display);
  font-size:clamp(30px, 4.8vw, 54px);
  font-weight:600; line-height:1.12; margin-bottom:16px;
  max-width:16ch; letter-spacing:-.02em;
}
.hero__subtitle { font-size:clamp(15px, 1.4vw, 18px); color:var(--muted); margin-bottom:8px; max-width:38em; }
.hero__cta { display:flex; gap:12px; flex-wrap:wrap; }

@media (max-width:768px) {
  .hero--theme { min-height:78vh; }
  .hero__content--theme { margin:0 16px 24px; padding:24px 20px 22px; width:auto; }
}
/* ---------- Sections ---------- */
.section { padding:88px 0; }
.section--alt {
  background:linear-gradient(180deg, rgba(255,255,255,.5) 0%, rgba(228,238,247,.32) 100%);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.section--sun { background:linear-gradient(180deg, rgba(232,238,244,.42) 0%, rgba(255,255,255,.24) 100%); }
body.is-night .section--alt {
  background:linear-gradient(180deg, rgba(20,32,48,.5) 0%, rgba(16,26,40,.34) 100%);
}
body.is-night .section--sun {
  background:linear-gradient(180deg, rgba(22,34,50,.4) 0%, rgba(16,26,40,.24) 100%);
}
.section--deep { background:var(--bg-deep); color:#D4CEC0; }
.section--deep .section__title { color:#fff; }
.section--deep .section__desc { color:rgba(212,206,192,.6); }
.section__head { margin-bottom:48px; }
.section__head--center { text-align:center; max-width:620px; margin:0 auto 56px; }
.section__eyebrow {
  font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent); margin-bottom:12px;
}
.section__title { font-family:var(--font-display); font-size:clamp(26px,4.2vw,40px); font-weight:600; line-height:1.15; margin-bottom:14px; letter-spacing:-.02em; }
.section__title span { color:var(--blue); }
.section__desc { color:var(--muted); font-size:17px; }

/* ---------- Stats bar ---------- */
.stats { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; }
.stat { text-align:center; }
.stat__num {
  font-size:clamp(30px,4vw,46px); font-weight:800; line-height:1; margin-bottom:10px;
  color:var(--blue);
}
.stat__label { font-size:13px; color:var(--muted); line-height:1.4; }

/* ---------- Category tiles (bento grid) ---------- */
.bento { display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:180px; gap:14px; }
.bento__tile {
  position:relative; border-radius:var(--radius); overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:22px; color:#fff; transition:all var(--t);
  border:1px solid var(--border); background:var(--bg-2);
  min-height:0;
}
.bento__tile:hover { transform:translateY(-4px); box-shadow:0 16px 48px rgba(15,27,45,.12); }
.bento__tile--lg { grid-column:span 3; grid-row:span 2; }
.bento__tile--md { grid-column:span 3; }
.bento__tile--sm { grid-column:span 2; }
.bento__tile--dark { background:#DCE6EF; color:var(--text); }
.bento__tile--warm { background:var(--accent); color:#fff; }
.bento__tile--light { background:var(--bg-warm); color:var(--text); }
.bento__tile--photo { color:#fff; border-color:transparent; }
.bento__tile--photo::after {
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(12,24,40,.15) 0%, rgba(12,24,40,.78) 100%);
}
.bento__img {
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
}
.bento__tile--light .bento__img { inset:0 0 42% 0; padding:16px; }
.bento__img img, .bento__img svg { width:100%; height:100%; object-fit:cover; transition:transform .55s ease; }
.bento__tile--light .bento__img img { object-fit:contain; }
.bento__tile:hover .bento__img img { transform:scale(1.06); }
.bento__body { position:relative; z-index:2; }
.bento__title { font-size:17px; font-weight:700; margin-bottom:4px; }
.bento__text { font-size:13px; opacity:.85; line-height:1.4; max-width:34ch; }
.bento__tile--dark .bento__text { color:var(--muted); }
.bento__tile--warm .bento__text { color:rgba(255,255,255,.85); }
.bento__arrow {
  position:absolute; top:16px; right:16px; width:32px; height:32px; border-radius:50%;
  background:rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center;
  font-size:16px; transition:var(--t); z-index:3; color:#fff;
}
.bento__tile:hover .bento__arrow { background:rgba(255,255,255,.32); transform:rotate(-45deg); }
.bento__tile--light .bento__arrow { background:rgba(15,27,45,.08); color:var(--text); }

/* Audience / solve strips */
.audience {
  display:grid; grid-template-columns:repeat(3,1fr); gap:14px;
}
.audience__card {
  position:relative; display:block; min-height:240px; border-radius:var(--radius);
  overflow:hidden; color:#fff; isolation:isolate;
}
.audience__card img {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .55s ease;
}
.audience__card::after {
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(12,24,40,.12), rgba(12,24,40,.82));
}
.audience__card:hover img { transform:scale(1.05); }
.audience__body {
  position:relative; z-index:2; height:100%; min-height:240px;
  display:flex; flex-direction:column; justify-content:flex-end; padding:22px;
}
.audience__body h3 { font-size:20px; font-weight:800; margin-bottom:8px; }
.audience__body p { font-size:14px; line-height:1.45; opacity:.9; max-width:32ch; }

.solve-strip {
  display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin-bottom:22px;
}
.solve-card {
  position:relative; display:block; aspect-ratio:4/5; border-radius:var(--radius-sm);
  overflow:hidden; color:#fff; isolation:isolate;
}
.solve-card img {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .5s ease;
}
.solve-card::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 35%, rgba(12,24,40,.85));
}
.solve-card:hover img { transform:scale(1.06); }
.solve-card span {
  position:absolute; left:12px; right:12px; bottom:12px; z-index:1;
  font-size:13px; font-weight:700; line-height:1.3;
}

.calc-banner {
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:28px 32px; border-radius:var(--radius);
  background:linear-gradient(120deg, #E8EEF4 0%, #FFF4E8 55%, #FFE8D2 100%);
  border:1px solid var(--border);
}
.calc-banner h3 { font-size:22px; font-weight:800; margin-bottom:6px; }
.calc-banner p { color:var(--muted); font-size:14px; max-width:52ch; }

.section--tight { padding-top:56px; padding-bottom:56px; }

/* ---------- Energy flow ---------- */
.flow {
  position:relative; height:360px; max-width:960px; margin:0 auto;
  border-radius:var(--radius); overflow:hidden;
  background:linear-gradient(180deg,#D8EAF8 0%, #FFF3D6 50%, #E2D9C6 100%);
}
.flow__sky { position:absolute; inset:0 0 40% 0; }
.flow__star {
  position:absolute; width:3px; height:3px; border-radius:50%;
  background:rgba(255,255,255,.9); animation:twinkle ease-in-out infinite;
}
@keyframes twinkle { 0%,100% { opacity:.2; transform:scale(1); } 50% { opacity:1; transform:scale(1.5); } }
.flow__node {
  position:absolute; text-align:center; font-size:11px; font-weight:600; color:var(--muted);
  transition:transform .3s; cursor:default; z-index:3;
}
.flow__node svg { width:72px; height:72px; margin:0 auto 6px; transition:filter .3s; }
.flow__node:hover { transform:scale(1.12); }
.flow__node:hover svg { filter:drop-shadow(0 0 12px var(--glow)); }
.flow__node--sun { left:6%; top:14%; }
.flow__node--wind { right:6%; top:12%; }
.flow__node--station { left:42%; top:40%; }
.flow__node--home { right:20%; bottom:16%; }
.flow__beams { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:1; }
.flow__beam { opacity:0; transition:opacity .4s; }
.flow__beam.visible { opacity:.7; animation:beamFlow 1.2s linear infinite; }
@keyframes beamFlow { to { stroke-dashoffset:-28; } }

/* ---------- Sun widget (glass card) ---------- */
.glass-card {
  background:var(--glass);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.5);
  border-radius:var(--radius); padding:40px;
  position:relative; overflow:hidden;
}
.glass-card::before {
  content:''; position:absolute; top:-60px; right:-60px;
  width:160px; height:160px; border-radius:50%;
  background:radial-gradient(circle, var(--glow), transparent 70%);
}
.sun-widget__title { font-size:20px; font-weight:700; margin-bottom:12px; text-align:center; position:relative; }
.sun-widget__slider { width:100%; accent-color:var(--accent); margin-bottom:8px; }
.sun-widget__labels { display:flex; justify-content:space-between; font-size:12px; color:var(--light); margin-bottom:24px; }
.sun-widget__output { text-align:center; padding:28px; background:var(--bg-warm); border-radius:var(--radius-sm); position:relative; }
.sun-widget__power { font-size:44px; font-weight:800; color:var(--accent); }
.sun-widget__power span { font-size:16px; color:var(--muted); }

/* ---------- Catalog ---------- */
.catalog-layout { display:grid; grid-template-columns:280px 1fr; gap:32px; align-items:start; }
.filters {
  background:var(--bg-2); border:1px solid var(--border);
  border-radius:var(--radius); padding:28px;
  position:sticky; top:calc(var(--header-h) + 16px);
}
.filters__title { font-size:15px; font-weight:800; margin-bottom:20px; display:flex; align-items:center; gap:8px; }
.filters__title::before { content:''; width:4px; height:18px; background:linear-gradient(180deg, var(--accent), var(--accent-2)); border-radius:2px; }
.filters__group { margin-bottom:24px; }
.filters__label { font-size:12px; font-weight:700; color:var(--muted); margin-bottom:12px; display:block; text-transform:uppercase; letter-spacing:.05em; }
.filters__range { width:100%; accent-color:var(--accent); }
.filters__range-val { font-size:13px; color:var(--muted); margin-top:6px; }
.check { display:flex; align-items:center; gap:10px; margin-bottom:10px; cursor:pointer; font-size:14px; transition:color var(--t); }
.check:hover { color:var(--accent); }
.check input { display:none; }
.check__box {
  width:20px; height:20px; border:2px solid var(--border);
  border-radius:6px; flex-shrink:0; position:relative; transition:var(--t);
}
.check input:checked + .check__box { background:var(--accent); border-color:transparent; }
.check input:checked + .check__box::after {
  content:''; position:absolute; left:6px; top:2px; width:5px; height:10px;
  border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg);
}
.catalog-toolbar { display:flex; gap:16px; margin-bottom:28px; flex-wrap:wrap; }
.search-input {
  flex:1; min-width:200px; min-height:48px;
  padding:0 18px 0 48px; border:1px solid var(--border);
  border-radius:40px; font-family:inherit; font-size:15px; background:var(--bg-2);
  outline:none; transition:var(--t);
}
.search-input:focus { border-color:var(--accent); box-shadow:0 0 0 4px var(--glow); }
.search-wrap { position:relative; flex:1; }
.search-wrap::before {
  content:''; position:absolute; top:50%; left:18px; transform:translateY(-50%);
  width:20px; height:20px; background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" stroke="%2394A3B8" stroke-width="2"><circle cx="9" cy="9" r="6"/><path d="M14 14l4 4"/></svg>') center/contain no-repeat;
  pointer-events:none; z-index:1;
}
.search-wrap .search-input { padding-left:48px; }

/* ---------- Product cards (horizontal feel) ---------- */
.products-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; }
.product-card {
  background:var(--bg-2); border:1px solid var(--border);
  border-radius:var(--radius); overflow:hidden;
  display:flex; flex-direction:column; transition:all var(--t); position:relative;
}
.product-card:hover { box-shadow:0 16px 48px rgba(15,27,45,.1); transform:translateY(-4px); }
.product-card__img-wrap { position:relative; height:220px; background:var(--bg-warm); overflow:hidden; }
.product-card__img-wrap::before {
  content:''; position:absolute; inset:0; z-index:1;
  background:radial-gradient(circle at 70% 15%, rgba(255,200,80,.15), transparent 55%);
  opacity:0; transition:opacity .4s;
}
.product-card:hover .product-card__img-wrap::before { opacity:1; }
.product-card__img-wrap img, .product-card__img-wrap svg {
  width:100%; height:100%; object-fit:contain; padding:20px; transition:transform .5s;
}
.product-card__glare {
  position:absolute; inset:0; pointer-events:none; z-index:2;
  background:linear-gradient(105deg, transparent 35%, rgba(255,255,255,.6) 50%, transparent 65%);
  transform:translateX(-100%); transition:transform .7s;
}
.product-card:hover .product-card__glare { transform:translateX(100%); }
.product-card:hover .product-card__img-wrap img { transform:scale(1.06); }
.product-card__body { padding:24px; flex:1; display:flex; flex-direction:column; }
.product-card__name { font-size:17px; font-weight:700; margin-bottom:8px; line-height:1.3; }
.product-card__specs { font-size:13px; color:var(--muted); margin-bottom:16px; flex:1; }
.product-card__price-row { display:flex; align-items:baseline; gap:10px; margin-bottom:4px; }
.product-card__price { font-size:24px; font-weight:800; color:var(--text); }
.product-card__opt-price { font-size:13px; font-weight:600; color:var(--accent); }
.product-card__opt { font-size:12px; color:var(--light); margin-bottom:16px; }
.product-card__actions { display:flex; gap:8px; flex-wrap:wrap; }

/* ---------- Product page ---------- */
.product-page { display:grid; grid-template-columns:1fr 1fr; gap:56px; padding:48px 0 80px; }
.product-gallery__main {
  aspect-ratio:1; background:var(--bg-warm); border:1px solid var(--border);
  border-radius:var(--radius); display:flex; align-items:center; justify-content:center;
  overflow:hidden; cursor:grab; user-select:none; position:relative;
}
.product-gallery__main::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at 60% 20%, rgba(255,200,80,.12), transparent 55%);
  pointer-events:none;
}
.product-gallery__main:active { cursor:grabbing; }
.product-gallery__main img { max-height:90%; object-fit:contain; position:relative; z-index:1; }
.product-gallery__hint { font-size:12px; color:var(--light); text-align:center; margin-top:10px; }
.product-info__price { font-size:38px; font-weight:800; margin:20px 0 28px; color:var(--text); }
.product-info__opt { display:block; font-size:15px; font-weight:600; color:var(--accent); margin-top:8px; }
.product-info__desc { color:var(--muted); margin-bottom:28px; line-height:1.7; font-size:16px; }
.product-info__actions { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:36px; }
.power-scale { margin-bottom:36px; }
.power-scale__label { font-size:14px; font-weight:600; margin-bottom:14px; }
.power-scale__bar { height:12px; background:var(--border); border-radius:6px; overflow:hidden; position:relative; }
.power-scale__fill {
  height:100%; background:linear-gradient(90deg, var(--gold), var(--accent), var(--accent-2)); border-radius:6px;
  transition:width .6s; position:relative;
}
.power-scale__fill::after {
  content:''; position:absolute; right:0; top:50%; transform:translateY(-50%);
  width:16px; height:16px; border-radius:50%; background:#fff;
  border:3px solid var(--accent); box-shadow:0 0 10px var(--glow);
}
.specs-table { width:100%; border-collapse:collapse; font-size:14px; }
.specs-table tr { border-bottom:1px solid var(--border); transition:background var(--t); }
.specs-table tr:hover { background:var(--bg-warm); }
.specs-table td { padding:14px 0; }
.specs-table td:first-child { color:var(--muted); width:45%; }

/* ---------- Contacts ---------- */
.contacts-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; }
.delivery-list { margin:28px 0; }
.delivery-list li { padding:16px 0; border-bottom:1px solid var(--border); font-size:15px; transition:padding-left var(--t); }
.delivery-list li:hover { padding-left:10px; }
.delivery-list strong { display:block; margin-bottom:4px; color:var(--text); }
.map-block { border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; height:400px; background:var(--bg-warm); }
.map-block > div { width:100%; height:100%; }
.contact-manager {
  display:flex; gap:16px; align-items:flex-start; margin-top:32px;
  padding:28px; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius);
  position:relative; overflow:hidden;
}
.contact-manager::before {
  content:''; position:absolute; top:-40px; right:-40px;
  width:120px; height:120px; border-radius:50%;
  background:radial-gradient(circle, var(--glow), transparent 70%);
}
.contact-manager__avatar {
  width:56px; height:56px; border-radius:50%; background:linear-gradient(135deg, var(--accent), var(--gold)); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:24px; flex-shrink:0;
  box-shadow:0 6px 16px var(--glow); position:relative;
}
.contact-manager p { font-size:14px; color:var(--muted); margin-top:6px; line-height:1.5; }

/* ---------- Forms ---------- */
.form-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); padding:36px; position:relative; overflow:hidden; }
.form-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg, var(--accent), var(--accent-2), var(--gold));
}
.form-group { margin-bottom:22px; }
.form-group label { display:block; font-size:13px; font-weight:600; color:var(--muted); margin-bottom:8px; }
.form-group input, .form-group textarea {
  width:100%; min-height:48px; padding:0 16px;
  border:1px solid var(--border); border-radius:var(--radius-sm);
  font-family:inherit; font-size:15px; background:var(--bg);
  outline:none; transition:var(--t);
}
.form-group textarea { min-height:110px; padding:14px 16px; resize:vertical; }
.form-group input:focus, .form-group textarea:focus { border-color:var(--accent); box-shadow:0 0 0 4px var(--glow); }
.form-checkbox { display:flex; align-items:flex-start; gap:10px; font-size:13px; color:var(--muted); cursor:pointer; margin-bottom:22px; }
.form-checkbox input { display:none; }
.form-checkbox__box {
  width:20px; height:20px; min-width:20px; margin-top:2px;
  border:2px solid var(--border); border-radius:6px; position:relative; transition:var(--t);
}
.form-checkbox input:checked + .form-checkbox__box { background:var(--accent); border-color:transparent; }
.form-checkbox input:checked + .form-checkbox__box::after {
  content:''; position:absolute; left:6px; top:2px; width:5px; height:10px;
  border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg);
}

/* ---------- Footer ---------- */
.footer { background:#E8EEF4; color:var(--text); padding:56px 0 28px; position:relative; overflow:hidden; border-top:1px solid var(--border); }
.footer::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--accent), var(--gold), var(--accent), transparent);
}
.footer a { color:var(--sky); }
.footer a:hover { color:var(--accent-2); }
.footer__grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:48px; margin-bottom:48px; }
.footer__brand p { font-size:14px; color:var(--muted); margin:14px 0 18px; max-width:300px; }
.footer .header__logo span {
  font-family:var(--font-display); font-size:14px; font-weight:600; letter-spacing:-.01em;
}
.footer__title { font-size:14px; font-weight:700; margin-bottom:18px; color:var(--text); }
.footer__links li { margin-bottom:12px; font-size:14px; }
.footer__map { border-radius:var(--radius); overflow:hidden; height:200px; margin-top:20px; border:1px solid var(--border); }
.footer__bottom {
  padding-top:28px; border-top:1px solid var(--border);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:13px; color:var(--muted);
}

/* ---------- Modals ---------- */
.modal[hidden] { display:none !important; }
.modal-overlay {
  position:fixed; inset:0; z-index:500;
  background:rgba(11,26,43,.55); backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center; padding:20px;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .25s, visibility .25s;
}
.modal-overlay.open { opacity:1; visibility:visible; pointer-events:auto; z-index:10001; }
.modal {
  background:var(--bg-2); border-radius:var(--radius);
  width:100%; max-width:500px; max-height:90vh; overflow-y:auto; position:relative;
  transform:translateY(24px) scale(.96); transition:transform .35s; box-shadow:0 24px 72px rgba(11,26,43,.25);
}
.modal--wide { max-width:680px; }
.modal--cart { max-width:540px; }
.modal-overlay.open .modal { transform:translateY(0) scale(1); }
.modal__close {
  position:absolute; top:16px; right:16px; width:38px; height:38px; border-radius:50%;
  background:var(--bg); border:1px solid var(--border); font-size:22px; line-height:1; z-index:2;
  transition:var(--t);
}
.modal__close:hover { border-color:var(--accent); background:var(--bg-warm); transform:rotate(90deg); }
.modal__head { padding:28px 28px 0; }
.modal__title { font-size:24px; font-weight:800; padding-right:44px; }
.modal__body { padding:28px; }
.modal__thanks { text-align:center; padding:56px 28px; }
.modal__thanks-title { font-size:28px; font-weight:800; margin-bottom:10px; background:linear-gradient(135deg, var(--accent), var(--accent-2)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.modal__thanks-text { color:var(--muted); }

/* Cart */
.cart-item { display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--border); }
.cart-item__img { width:76px; height:76px; background:var(--bg-warm); border-radius:var(--radius-sm); flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.cart-item__img img { max-width:90%; max-height:90%; object-fit:contain; }
.cart-item__info { flex:1; }
.cart-item__name { font-weight:700; font-size:14px; margin-bottom:4px; }
.cart-item__price { font-size:14px; color:var(--muted); }
.cart-item__qty { display:flex; align-items:center; gap:8px; margin-top:10px; }
.cart-item__qty button { width:30px; height:30px; border:1px solid var(--border); border-radius:8px; font-size:16px; transition:var(--t); }
.cart-item__qty button:hover { border-color:var(--accent); background:var(--bg-warm); }
.cart-item__remove { color:var(--err); font-size:13px; margin-top:6px; }
.cart-total { display:flex; justify-content:space-between; align-items:center; padding:24px 0; font-size:22px; font-weight:800; }
.cart-total span:last-child { background:linear-gradient(135deg, var(--accent), var(--accent-2)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.cart-empty { text-align:center; padding:40px; color:var(--muted); }

/* Quick view */
.quick-view { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.quick-view__img { background:var(--bg-warm); border-radius:var(--radius-sm); padding:20px; display:flex; align-items:center; justify-content:center; }
.quick-view__img img { max-height:220px; object-fit:contain; }

/* Floating dock: cart + calculator */
.dock {
  position:fixed; right:18px; bottom:22px; z-index:190;
  display:flex; flex-direction:column; align-items:center; gap:12px;
}
body:has(.cookie-bar.show) .dock { bottom:92px; }
.dock__btn {
  position:relative;
  display:flex; align-items:center; justify-content:center;
  width:58px; height:58px; color:inherit;
}
.dock__icon {
  width:58px; height:58px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 24px rgba(21,36,51,.18);
  transition:transform .2s ease, box-shadow .2s ease;
}
.dock__icon svg { width:26px; height:26px; display:block; }
.dock__btn:hover .dock__icon { transform:translateY(-3px) scale(1.06); }
.dock__btn:focus-visible .dock__icon { outline:2px solid var(--accent); outline-offset:3px; }
.dock__btn--cart .dock__icon {
  background:#fff; color:#1A2838; border:1px solid #CDD8E3;
}
.dock__btn--calc .dock__icon {
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  color:#fff; box-shadow:0 8px 28px var(--glow);
}
.dock__btn::after {
  content:attr(data-tip);
  position:absolute; right:calc(100% + 12px); top:50%;
  transform:translateY(-50%);
  padding:7px 12px; border-radius:10px;
  background:#152433; color:#fff;
  font-size:12px; font-weight:700; letter-spacing:.01em;
  white-space:nowrap; opacity:0; pointer-events:none;
  transition:opacity .18s ease;
  box-shadow:0 8px 20px rgba(12,20,32,.28);
}
.dock__btn:hover::after,
.dock__btn:focus-visible::after { opacity:1; }
.dock__label { display:none; }
.dock__count {
  top:-4px; right:-4px;
  border-color:#fff;
}
body.is-night .dock__btn--cart .dock__icon {
  background:#F4F7FB; color:#152433; border-color:#E4EBF2;
  box-shadow:0 8px 24px rgba(0,0,0,.35);
}
body.is-night .dock__btn::after {
  background:#F4F7FB; color:#152433;
}
.calc-fab { display:none; }
.modal--calc { max-width:820px; }
.calc-vip__block { margin-bottom:22px; }
.calc-vip__h { font-size:16px; font-weight:800; margin-bottom:6px; }
.calc-vip__hint { font-size:13px; color:var(--muted); margin-bottom:14px; line-height:1.45; }
.calc-hours {
  display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px;
}
.calc-hours__btn {
  cursor:pointer;
  min-height:44px; padding:0 16px; border-radius:999px; font-weight:700; font-size:14px;
  border:1px solid var(--border); background:var(--bg-2); color:var(--text);
  transition:transform .2s, background .2s, border-color .2s, box-shadow .2s;
}
.calc-hours__btn:hover { transform:translateY(-2px); }
.calc-hours__btn.is-on {
  background:linear-gradient(135deg, var(--accent), var(--accent-2)); color:#fff; border-color:transparent;
  box-shadow:0 8px 20px rgba(227,107,30,.28);
}
.calc-hours__custom {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  font-size:13px; color:var(--muted); font-weight:600;
}
.calc-hours__field {
  display:inline-flex; align-items:center; gap:6px;
  border:1px solid var(--border); border-radius:12px; padding:0 12px; background:var(--bg-2);
}
.calc-hours__field input {
  width:72px; border:0; background:transparent; padding:10px 0; font:inherit; font-weight:800; color:var(--text); outline:none;
}
.calc-hours__field em { font-style:normal; color:var(--muted); }
.calc-chips { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.calc-chip {
  position:relative; overflow:hidden; cursor:pointer;
  display:inline-flex; align-items:center; gap:8px;
  min-height:42px; padding:0 14px; border-radius:12px;
  border:1px solid var(--border); background:var(--bg-2); font-weight:700; font-size:13px;
  transition:transform .2s, box-shadow .2s, border-color .2s, background .2s;
}
.calc-chip i {
  width:8px; height:8px; border-radius:50%; background:#CBD5E1;
  box-shadow:0 0 0 0 rgba(245,158,11,0); transition:.25s;
}
.calc-chip.is-on {
  border-color:rgba(227,107,30,.45); background:#FFF7F0; color:var(--accent-2);
  box-shadow:0 0 0 1px rgba(227,107,30,.12), 0 8px 18px rgba(227,107,30,.12);
}
.calc-chip.is-on i {
  background:#F59E0B;
  box-shadow:0 0 12px rgba(245,158,11,.85);
  animation:calcPulse 1.2s ease-in-out infinite;
}
@keyframes calcPulse {
  0%,100% { transform:scale(1); }
  50% { transform:scale(1.35); }
}
.calc-table-wrap { overflow:auto; max-height:36vh; border:1px solid var(--border); border-radius:14px; }
.calc-table { width:100%; border-collapse:collapse; font-size:14px; }
.calc-table th {
  position:sticky; top:0; background:var(--bg-warm); text-align:left;
  padding:12px 14px; font-size:12px; color:var(--muted); font-weight:700;
}
.calc-table td { padding:10px 14px; border-top:1px solid var(--border); vertical-align:middle; }
.calc-table input {
  width:100%; min-width:84px; border:1px solid var(--border); border-radius:10px;
  padding:10px 12px; font:inherit; font-weight:700; background:var(--bg-2); color:var(--text); outline:none;
}
.calc-table__rm {
  width:28px; height:28px; border-radius:8px; margin-right:6px;
  background:rgba(180,83,9,.1); color:var(--err); font-size:16px; line-height:1;
}
.calc-result { padding:22px; background:var(--bg-warm); border-radius:var(--radius-sm); margin-top:8px; position:relative; overflow:hidden; }
.calc-result--vip .calc-result__grid { grid-template-columns:repeat(4,1fr); }
.calc-result__grid {
  display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; text-align:center;
}
.calc-result__grid span { display:block; font-size:12px; color:var(--muted); margin-bottom:4px; }
.calc-result__grid strong { font-size:20px; color:var(--text); }
.calc-result__rec { text-align:center; font-size:14px; color:var(--muted); }
.calc-result__rec strong {
  display:block; font-size:clamp(18px, 3vw, 28px); margin-top:6px;
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.calc-result__hint { margin-top:12px; font-size:13px; color:var(--muted); text-align:center; line-height:1.45; }
.calc-spark { position:absolute; left:50%; bottom:18px; width:0; height:0; pointer-events:none; }
.calc-spark__dot {
  position:absolute; width:6px; height:6px; border-radius:50%;
  background:#FBBF24; box-shadow:0 0 10px #F59E0B;
  animation:calcSpark .85s ease-out forwards;
}
@keyframes calcSpark {
  to { transform:translate(var(--sx), var(--sy)); opacity:0; }
}
@media (max-width:700px) {
  .calc-result--vip .calc-result__grid { grid-template-columns:1fr 1fr; }
  .calc-table th:nth-child(3), .calc-table td:nth-child(3) { min-width:110px; }
}

/* Cookie */
.cookie-bar {
  position:fixed; bottom:0; left:0; right:0; z-index:200;
  background:var(--glass-2); backdrop-filter:blur(10px);
  border-top:1px solid var(--border);
  padding:14px 24px; display:flex; align-items:center; justify-content:center; gap:20px; flex-wrap:wrap;
  transform:translateY(100%); transition:transform .3s; font-size:14px; color:var(--muted);
}
.cookie-bar.show { transform:translateY(0); }

/* ---------- Nature: mills, dust, clouds, landscape ---------- */
.nature-mill { display:block; overflow:visible; }
.nature-mill__rotor { transform-origin:32px 40px; animation:millSpin 7s linear infinite; }
@keyframes millSpin { to { transform:rotate(360deg); } }

.nature-dust-layer { position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:4; }
.nature-dust {
  position:absolute; bottom:-8px; border-radius:50%;
  background:rgba(255,220,140,.55); animation:dustRise linear infinite;
}
@keyframes dustRise {
  0% { transform:translate3d(0,0,0) scale(.4); opacity:0; }
  12% { opacity:.7; }
  100% { transform:translate3d(40px,-110vh,0) scale(1); opacity:0; }
}

.nature-clouds { position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:2; }
.nature-cloud {
  position:absolute; height:28px; background:#fff; border-radius:28px; opacity:.45;
  animation:cloudDrift linear infinite;
}
.nature-cloud::before, .nature-cloud::after {
  content:''; position:absolute; background:#fff; border-radius:50%;
}
.nature-cloud::before { width:36px; height:36px; top:-16px; left:18px; }
.nature-cloud::after { width:24px; height:24px; top:-10px; left:48px; }
.nature-cloud--1 { width:90px; top:12%; left:-20%; animation-duration:42s; }
.nature-cloud--2 { width:70px; top:22%; left:-30%; animation-duration:56s; animation-delay:-20s; opacity:.3; }
.nature-cloud--3 { width:110px; top:8%; left:-10%; animation-duration:70s; animation-delay:-8s; opacity:.25; }
@keyframes cloudDrift { to { transform:translateX(140vw); } }

.hero__landscape {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  z-index:1; pointer-events:none;
}
.hero__mills {
  position:absolute; right:8%; bottom:18%; z-index:3; display:flex; gap:8px; align-items:flex-end;
  opacity:.85; pointer-events:none;
}
.hero__rays {
  position:absolute; top:50%; left:50%; width:420px; height:420px; margin:-210px 0 0 -210px;
  background:repeating-conic-gradient(from 0deg, rgba(255,200,80,.18) 0 8deg, transparent 8deg 22deg);
  border-radius:50%; animation:raySpin 48s linear infinite; z-index:0; pointer-events:none;
}
@keyframes raySpin { to { transform:rotate(360deg); } }

.page-nature {
  position:relative; overflow:hidden;
  background:linear-gradient(180deg, #FFE9B8 0%, var(--bg) 70%);
  padding:48px 0 24px;
}
.page-nature .nature-mills-inline { display:flex; gap:6px; justify-content:flex-end; opacity:.5; }

.charge-scene {
  --sun-level: .7;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  min-height:240px; padding:28px 24px 22px;
  border-radius:var(--radius); overflow:hidden; perspective:900px;
  background:
    radial-gradient(ellipse 60% 50% at 18% 30%, rgba(255,210,120, calc(.08 + var(--sun-level) * .35)), transparent 60%),
    linear-gradient(160deg, #1A2838 0%, #2A3F55 42%, #3D4E3A 100%);
  border:1px solid rgba(255,255,255,.08); margin-top:28px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 18px 40px rgba(15,27,45,.18);
}
.charge-scene__node {
  display:flex; flex-direction:column; align-items:center; gap:10px; flex:0 0 auto;
  font-size:12px; font-weight:700; color:rgba(255,255,255,.78);
  transform-style:preserve-3d;
}
.charge-scene__photo {
  position:relative; width:108px; height:108px; border-radius:22px; overflow:hidden;
  transform:rotateY(-12deg) rotateX(8deg);
  box-shadow:0 18px 36px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.12);
  transition:transform .45s ease, box-shadow .45s ease, filter .35s ease;
  animation:chargeFloat 5.5s ease-in-out infinite;
}
.charge-scene__photo img {
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.08); transition:filter .35s ease, transform .6s ease;
}
.charge-scene__node:hover .charge-scene__photo {
  transform:rotateY(0deg) rotateX(0deg) translateY(-6px) scale(1.04);
  box-shadow:0 26px 48px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.18);
}
.charge-scene__photo--sun {
  filter:brightness(calc(.55 + var(--sun-level) * .7)) saturate(calc(.7 + var(--sun-level) * .5));
  animation-delay:0s;
}
.charge-scene__photo--panel { animation-delay:.4s; }
.charge-scene__photo--station { animation-delay:.8s; }
.charge-scene__bloom {
  position:absolute; inset:-20%; pointer-events:none;
  background:radial-gradient(circle, rgba(255,220,140, calc(.15 + var(--sun-level) * .55)), transparent 62%);
  mix-blend-mode:screen;
}
.charge-scene__meter {
  position:absolute; left:12px; right:12px; bottom:12px; height:10px;
  border-radius:999px; background:rgba(0,0,0,.45); overflow:hidden;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.4);
}
.charge-scene__meter i {
  display:block; width:100%; height:55%;
  background:linear-gradient(90deg, #F59E0B, #FBBF24, #FFE08A);
  border-radius:inherit; transition:height .35s ease;
  box-shadow:0 0 12px rgba(251,191,36,.55);
}
.charge-scene__flow {
  flex:1; height:4px; position:relative; overflow:hidden; min-width:28px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
}
.charge-scene__flow span {
  position:absolute; top:50%; width:10px; height:10px; margin-top:-5px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, #FFE9A8, #F59E0B);
  box-shadow:0 0 14px rgba(251,191,36, calc(.25 + var(--sun-level) * .55));
  animation:chargeDot calc(1.8s - var(--sun-level) * .9s) linear infinite;
  opacity:calc(.25 + var(--sun-level) * .75);
}
.charge-scene__flow span:nth-child(2) { animation-delay:.35s; }
.charge-scene__flow span:nth-child(3) { animation-delay:.7s; }
@keyframes chargeDot { 0% { left:-12px; } 100% { left:108%; } }
@keyframes chargeFloat {
  0%, 100% { transform:rotateY(-12deg) rotateX(8deg) translateY(0); }
  50% { transform:rotateY(-12deg) rotateX(8deg) translateY(-7px); }
}
.charge-scene__photo--station {
  animation-name:chargeFloatStation;
}
@keyframes chargeFloatStation {
  0%, 100% { transform:rotateY(12deg) rotateX(8deg) translateY(0); }
  50% { transform:rotateY(12deg) rotateX(8deg) translateY(-7px); }
}

.how {
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
  list-style:none; counter-reset:none; perspective:1200px;
}
.how__step {
  background:#fff; border:1px solid var(--border); border-radius:var(--radius);
  padding:0 0 24px; text-align:center; position:relative;
  transition:transform .45s ease, box-shadow .45s ease;
  transform-style:preserve-3d;
}
.how__step:hover {
  transform:translateY(-8px) rotateX(2deg);
  box-shadow:0 22px 48px rgba(15,27,45,.14);
}
.how__media {
  height:190px; margin-bottom:16px; position:relative; overflow:hidden;
  border-radius:var(--radius) var(--radius) 0 0;
  isolation:isolate;
}
.how__media img {
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.08);
  transition:transform .7s ease;
  animation:howKen 12s ease-in-out infinite;
}
.how__step:nth-child(2) .how__media img { animation-delay:-4s; }
.how__step:nth-child(3) .how__media img { animation-delay:-8s; }
.how__step:hover .how__media img { transform:scale(1.14); }
.how__shine {
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,.28) 48%, transparent 62%);
  transform:translateX(-120%);
  animation:howShine 5.5s ease-in-out infinite;
}
.how__step:nth-child(2) .how__shine { animation-delay:1.2s; }
.how__step:nth-child(3) .how__shine { animation-delay:2.4s; }
.how__media::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 55%, rgba(12,24,40,.28));
  pointer-events:none;
}
@keyframes howKen {
  0%, 100% { transform:scale(1.08) translate3d(0,0,0); }
  50% { transform:scale(1.14) translate3d(-1.5%, 1%, 0); }
}
@keyframes howShine {
  0%, 55% { transform:translateX(-120%); }
  75% { transform:translateX(120%); }
  100% { transform:translateX(120%); }
}
.how__n {
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:50%; margin-bottom:8px;
  background:var(--accent); color:#fff; font-size:13px; font-weight:800;
  box-shadow:0 8px 18px rgba(234,88,12,.28);
}
.how__step h3 { font-size:17px; margin:0 20px 8px; }
.how__step p { font-size:14px; color:var(--muted); margin:0 20px; }

.socials {
  display:flex; gap:8px; align-items:center; flex-wrap:wrap;
  max-width:100%; min-width:0;
}
.socials__btn {
  width:36px; height:36px; border-radius:11px; flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center;
  color:#fff; transition:transform .2s ease, filter .2s ease, box-shadow .2s ease;
  box-shadow:0 6px 14px rgba(15,27,45,.16);
}
.socials__btn svg { width:17px; height:17px; display:block; flex-shrink:0; }
.socials__btn:hover { transform:translateY(-2px) scale(1.04); filter:brightness(1.06); }
.socials__btn--tg { background:#2AABEE; box-shadow:0 6px 14px rgba(42,171,238,.35); }
.socials__btn--wa { background:#25D366; box-shadow:0 6px 14px rgba(37,211,102,.32); }
.socials__btn--ig { background:linear-gradient(135deg, #F58529, #DD2A7B 52%, #8134AF); box-shadow:0 6px 14px rgba(221,42,123,.3); }
.socials__btn--vk { background:#0077FF; box-shadow:0 6px 14px rgba(0,119,255,.32); }
.socials__btn--max { background:linear-gradient(135deg, #471AFF 0%, #6E1AFF 48%, #9500FF 100%); box-shadow:0 6px 14px rgba(71,26,255,.35); }

.socials--labeled {
  gap:8px;
}
.socials--labeled .socials__btn {
  width:auto; min-width:36px; min-height:40px; max-width:100%;
  padding:0 12px; gap:7px; font-size:12.5px; font-weight:700;
  white-space:nowrap;
}
.socials--labeled .socials__btn span {
  overflow:hidden; text-overflow:ellipsis;
}
.socials--labeled .socials__btn svg { width:16px; height:16px; }

.header__top .socials {
  flex:0 0 auto; flex-wrap:nowrap; gap:6px; max-width:none;
}
.header__top .socials__btn {
  width:30px; height:30px; border-radius:9px;
  box-shadow:0 3px 8px rgba(0,0,0,.18);
}
.header__top .socials__btn svg { width:15px; height:15px; }
.header__top .socials__btn--tg { background:#2AABEE; }
.header__top .socials__btn--ig { background:linear-gradient(135deg, #F58529, #DD2A7B 52%, #8134AF); }
.header__top .socials__btn--vk { background:#0077FF; }
.header__top .socials__btn--max { background:linear-gradient(135deg, #471AFF, #9500FF); }
.header__top .socials__btn:hover { filter:brightness(1.1); }

.footer__brand .socials {
  margin:4px 0 18px; gap:8px;
}
.footer__brand .socials--labeled .socials__btn {
  min-height:38px; padding:0 11px; font-size:12px;
}
.mobile-nav .socials { margin:16px 0; }
.mobile-nav .socials--labeled .socials__btn { max-width:100%; }

.geo-find { margin:48px 0 8px; }
.geo-find__head { text-align:center; margin-bottom:28px; }
.geo-find__icon {
  width:52px; height:52px; border-radius:50%; margin:0 auto 12px;
  display:flex; align-items:center; justify-content:center;
  background:#E8EEF4; color:var(--accent);
}
.geo-find__icon svg { width:26px; height:26px; }
.geo-find__head h1, .geo-find__head h2 { font-size:28px; font-weight:800; margin-bottom:8px; }
.geo-find__addr { font-size:18px; font-weight:600; }
.geo-find__park {
  display:inline-flex; align-items:center; gap:8px;
  margin-top:8px; color:var(--muted); font-size:14px;
}
.geo-find__park svg { width:16px; height:16px; color:var(--accent); flex-shrink:0; }
.geo-find__cols {
  display:grid; grid-template-columns:1fr 1fr; gap:20px;
}
.geo-find__map, .geo-find__route {
  border-radius:16px; overflow:hidden; border:1px solid var(--border);
  min-height:420px; background:#EEF3F8;
}
.geo-find__map iframe, .geo-find__route img {
  width:100%; height:100%; min-height:420px; object-fit:cover; display:block; border:0;
}
.geo-find__link { margin-top:12px; font-size:14px; color:var(--blue); }

.route-steps { margin:0 0 28px; padding:0; list-style:none; }
.route-steps li {
  display:grid; grid-template-columns:36px 1fr; gap:14px; margin-bottom:16px; align-items:start;
}
.route-steps strong { display:block; margin-bottom:2px; }
.route-steps span { color:var(--muted); font-size:14px; }
.route-n {
  width:36px; height:36px; border-radius:50%; background:var(--accent); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:14px;
}

.runtime-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.runtime-card {
  background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius);
  padding:0 0 18px; text-align:center; overflow:hidden;
  transition:transform .4s ease, box-shadow .4s ease;
}
.runtime-card:hover {
  transform:translateY(-6px);
  box-shadow:0 18px 40px rgba(15,27,45,.12);
}
.runtime-card__media {
  position:relative; height:168px; overflow:hidden; margin-bottom:14px;
}
.runtime-card__media img {
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.06);
  transition:transform .55s ease;
  animation:runtimeDrift 10s ease-in-out infinite;
}
.runtime-card:nth-child(2) .runtime-card__media img { animation-delay:-2.5s; }
.runtime-card:nth-child(3) .runtime-card__media img { animation-delay:-5s; }
.runtime-card:nth-child(4) .runtime-card__media img { animation-delay:-7.5s; }
.runtime-card:hover .runtime-card__media img { transform:scale(1.12); }
.runtime-card__media::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 40%, rgba(12,24,40,.55));
}
.runtime-card__hours {
  position:absolute; left:12px; bottom:12px; z-index:1;
  padding:8px 12px; border-radius:999px;
  background:rgba(255,255,255,.92); color:#152433;
  font-size:13px; font-weight:800;
  box-shadow:0 8px 20px rgba(0,0,0,.16);
  backdrop-filter:blur(6px);
}
@keyframes runtimeDrift {
  0%, 100% { transform:scale(1.06) translate3d(0,0,0); }
  50% { transform:scale(1.12) translate3d(1.5%, -1%, 0); }
}
.runtime-card h3 { font-size:15px; margin:0 14px 6px; }
.runtime-card p { font-size:12px; color:var(--muted); margin:0 14px; }

.safety-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.safety-card {
  background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius);
  padding:24px; position:relative; overflow:hidden;
}
.safety-card::after {
  content:''; position:absolute; top:-30px; right:-30px; width:90px; height:90px; border-radius:50%;
  background:radial-gradient(circle, var(--glow), transparent 70%);
}
.safety-card h3 { font-size:16px; margin-bottom:8px; }
.safety-card p { font-size:14px; color:var(--muted); }

.catalog-opt-hint { font-size:13px; color:var(--muted); white-space:nowrap; }
.product-info__meta { font-size:14px; color:var(--muted); margin:8px 0 16px; }

.video-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.video-slot {
  aspect-ratio:16/10; border-radius:var(--radius); background:var(--bg-warm);
  border:1px dashed var(--border); display:flex; align-items:center; justify-content:center;
  text-align:center; color:var(--muted); font-size:14px; padding:0; overflow:hidden; width:100%; object-fit:cover;
}

.cat-banner {
  background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius);
  padding:20px 24px; margin-bottom:24px;
}
.cat-banner h2 { font-size:20px; margin-bottom:6px; }
.cat-banner p { color:var(--muted); font-size:14px; }
.catalog-group { margin-bottom:48px; }
.catalog-group__title {
  font-family:var(--font-display); font-size:clamp(20px,2.4vw,28px);
  font-weight:600; margin-bottom:20px; letter-spacing:-.02em;
  display:flex; align-items:baseline; gap:12px;
}
.catalog-group__title span {
  font-family:var(--font); font-size:14px; font-weight:600;
  color:var(--muted); background:rgba(63,116,160,.1);
  padding:4px 10px; border-radius:999px;
}

@media (max-width:1200px) {
  .header__address { max-width:140px; }
}
@media (max-width:1100px) {
  .header__address { display:none; }
  .header__nav { gap:6px; }
  .header__nav a { padding:8px 12px; font-size:13px; }
  .header__top .socials__btn { width:28px; height:28px; }
  .header__top .socials__btn svg { width:14px; height:14px; }
}
@media (max-width:1024px) {
  .hero { grid-template-columns:1fr; min-height:auto; }
  .hero__visual { min-height:42vh; }
  .hero__content { padding:40px 24px 28px; }
  .hero__title { font-size:clamp(28px, 7.5vw, 44px); max-width:none; }
  .catalog-layout { grid-template-columns:1fr; }
  .filters { position:static; }
  .product-page { grid-template-columns:1fr; }
  .contacts-grid { grid-template-columns:1fr; }
  .footer__grid { grid-template-columns:1fr 1fr; }
  .how { grid-template-columns:1fr; }
  .geo-find__cols { grid-template-columns:1fr; }
  .geo-find__map, .geo-find__route, .geo-find__map iframe, .geo-find__route img { min-height:280px; }
  .bento { grid-template-columns:repeat(4,1fr); }
  .bento__tile--lg { grid-column:span 4; }
  .bento__tile--md { grid-column:span 4; }
  .bento__tile--sm { grid-column:span 2; }
  .audience { grid-template-columns:1fr 1fr; }
  .solve-strip { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:900px) {
  :root { --header-h: 70px; }
  .header__top { display:none; }
  .header__nav { display:none; }
  .header__callback { display:none; }
  .burger { display:flex; }
  .dock { right:12px; bottom:16px; }
  .dock__btn, .dock__icon { width:52px; height:52px; }
  .mobile-nav { display:flex; }
  .header__main-inner { min-height:70px; gap:14px; }
  .header__logo-text strong { font-size:13px; white-space:normal; }
}
@media (max-width:768px) {
  .bento { grid-template-columns:1fr 1fr; grid-auto-rows:140px; }
  .bento__tile--lg, .bento__tile--md, .bento__tile--sm { grid-column:span 2; grid-row:span 1; }
  .bento__tile--lg { grid-row:span 2; }
  .stats { grid-template-columns:1fr 1fr; gap:24px; }
  .hero__content { padding:32px 20px 20px; }
  .hero__visual { min-height:38vh; }
  .quick-view { grid-template-columns:1fr; }
  .footer__grid { grid-template-columns:1fr; }
  .runtime-grid { grid-template-columns:1fr 1fr; }
  .safety-grid { grid-template-columns:1fr; }
  .video-grid { grid-template-columns:1fr; }
  .audience { grid-template-columns:1fr; }
  .audience__card, .audience__body { min-height:200px; }
  .solve-strip { grid-template-columns:1fr 1fr; }
  .calc-banner { flex-direction:column; align-items:flex-start; padding:22px; }
  .calc-row__fields, .calc-result__grid { grid-template-columns:1fr; }
  .sky-ambient { opacity:.75; }
  .charge-scene { flex-wrap:wrap; justify-content:center; gap:16px; }
  .charge-scene__flow { display:none; }
  .charge-scene__photo,
  .charge-scene__photo--station,
  .charge-scene__node:hover .charge-scene__photo {
    transform:none; animation:chargeFloatMobile 5.5s ease-in-out infinite;
  }
}
@keyframes chargeFloatMobile {
  0%, 100% { transform:translateY(0); }
  50% { transform:translateY(-6px); }
}
@media (max-width:375px) {
  .product-card__actions { flex-direction:column; }
  .product-card__actions .btn { width:100%; }
}

@media (prefers-reduced-motion: reduce) {
  .sky-ambient__rays,
  .sky-ambient__glow,
  .sky-star { animation:none !important; opacity:.25; }
}
