/* Современный слой: анимации, стекло, подсветка, бегущая строка, калькулятор */
#fcProgress{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#07864e,#21c879,#ffdc55);z-index:500;pointer-events:none}
.site-header{transition:box-shadow .25s,background .25s}
.site-header.scrolled{box-shadow:0 10px 30px rgba(0,0,0,.35);background:rgba(7,20,22,.97)}

/* Появление при прокрутке (классы ставит modern.js, без JS всё видно) */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0ms)}
.reveal.in{opacity:1;transform:none}

/* Градиентный акцент в заголовках героя */
.hero h1 em,.page-hero h1 em{background:linear-gradient(100deg,#21c879 0%,#8df2c0 55%,#ffdc55 110%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}

/* Карточки: подсветка под курсором и лёгкий наклон */
.card,.img-card{--mx:50%;--my:50%}
.card{position:relative;transition:transform .25s,box-shadow .25s,border-color .25s}
.card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .25s;background:radial-gradient(260px circle at var(--mx) var(--my),rgba(33,200,121,.14),transparent 70%)}
.card:hover::before{opacity:1}
.card.tilt-on{will-change:transform}
.card .ico{transition:transform .3s,background .3s,color .3s}
.card:hover .ico{transform:translateY(-3px) scale(1.08);background:var(--green);color:#fff}
.section.dark .card:hover .ico{background:var(--accent);color:#06241a}

/* Кнопки: блик */
.btn-primary,.hbtn.primary{position:relative;overflow:hidden}
.btn-primary::after,.hbtn.primary::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .6s}
.btn-primary:hover::after,.hbtn.primary:hover::after{left:130%}

/* Бегущая строка */
.marquee{background:var(--dark);color:#cfe3d8;overflow:hidden;border-block:1px solid rgba(255,255,255,.08);padding:16px 0;white-space:nowrap}
.marquee-track{display:inline-flex;gap:46px;padding-left:46px;animation:fcMarquee 38s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee span{font-size:12px;letter-spacing:2px;font-weight:800;text-transform:uppercase;display:inline-flex;align-items:center;gap:46px}
.marquee span::after{content:"◆";color:var(--accent);font-size:9px}
@keyframes fcMarquee{to{transform:translateX(-50%)}}

/* Цифры */
.stats-band{background:linear-gradient(135deg,#0d211f,#123a33);color:#fff;padding:clamp(44px,6vw,72px) 0}
.stats-band .stat{padding:18px 22px;border-left:2px solid rgba(33,200,121,.5)}
.stats-band .stat b{font-variant-numeric:tabular-nums}

/* Калькулятор */
.calc{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(18px,3vw,36px);align-items:stretch}
.calc-form{display:grid;gap:18px}
.calc-form .field label{display:flex;justify-content:space-between;gap:10px}
.calc-form output{color:var(--green);font-weight:900}
.range{width:100%;accent-color:var(--green);height:6px}
.seg{display:flex;gap:8px;flex-wrap:wrap}
.seg button{flex:1 1 130px;min-height:46px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:11px;font-weight:700;padding:8px 12px;transition:background .18s,border-color .18s,color .18s}
.seg button:hover{border-color:var(--green)}
.seg button[aria-pressed=true]{background:var(--green);border-color:var(--green);color:#fff;box-shadow:0 6px 16px rgba(7,139,82,.28)}
.calc-result{background:linear-gradient(145deg,#0d211f,#123a33);color:#fff;border-radius:20px;padding:clamp(22px,3vw,34px);display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow)}
.calc-result small{letter-spacing:1.6px;font-weight:800;font-size:11px;color:#9de9bd}
.calc-total{font-size:clamp(30px,4vw,46px);font-weight:900;letter-spacing:-.03em;color:var(--accent);line-height:1.05;font-variant-numeric:tabular-nums}
.calc-rows{display:grid;gap:8px;font-size:13px;color:#cfe3d8;margin:0;padding:0;list-style:none}
.calc-rows li{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed rgba(255,255,255,.16);padding-bottom:7px}
.calc-rows b{color:#fff;font-variant-numeric:tabular-nums}
.calc-note{font-size:12px;color:#9db3a8;margin:0}
.calc-result .btn{margin-top:auto}

/* Наверх */
#toTop{position:fixed;right:18px;bottom:18px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:linear-gradient(135deg,#07864e,#11a65e);color:#fff;font-size:20px;box-shadow:0 10px 26px rgba(0,0,0,.3);opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .25s,transform .25s;z-index:150}
#toTop.show{opacity:1;transform:none;pointer-events:auto}

/* Тёмная тема */
html[data-theme=dark] .section.alt{background:#1f3a35}
html[data-theme=dark] .seg button[aria-pressed=false]{background:var(--card)}
html[data-theme=dark] .card::before{background:radial-gradient(260px circle at var(--mx) var(--my),rgba(33,200,121,.18),transparent 70%)}

@media(max-width:900px){.calc{grid-template-columns:1fr}.stats-band .stat{padding:12px 16px}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.marquee-track{animation:none}.btn-primary::after,.hbtn.primary::after{display:none}#fcProgress{display:none}}