:root{
  --bg:#0f2a1f;
  --bg-strong:#0d241b;
  --primary:#214b34;
  --accent:#F9F295;
  --cta:#25D366;
  --muted: rgba(255,255,255,0.72);
  --maxw:1200px;
  --radius:16px;
  --font-sans: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

html, body { height: 100%; }
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--font-sans);
  background: var(--bg); /* сплошной тёмно‑зелёный */
  color: #fff;
  line-height: 1.5;
}

/* Utility */
.container { max-width: var(--maxw); margin: 0 auto; padding: 20px; }
.section { padding: 64px 20px; background: var(--bg); position: relative; z-index: 1; }
.section + .section { border-top: 1px solid rgba(255,255,255,0.06); }
.heading { max-width: 920px; margin: 0 auto 20px; text-align: center; }
h1,h2,h3 { margin: 0 0 10px; }
h1 { font-size: clamp(26px, 6vw, 48px); color: var(--accent); line-height: 1.08; }
h2 { font-size: clamp(22px, 4vw, 34px); color: var(--accent); }
.subtitle { color: var(--muted); }

/* AOS: скрывать элементы до анимации */
[data-aos] { opacity: 0; transform: translateY(14px); transition-property: opacity, transform; }
[data-aos].aos-animate { opacity: 1; transform: none; }

/* NAV */
nav { position: sticky; top: 0; z-index: 50; background: var(--bg-strong); border-bottom: 1px solid rgba(255,255,255,0.06); }
.navbar { display:flex; align-items:center; gap: 12px; padding: 12px 20px; }
.logo { font-weight: 800; color: var(--accent); letter-spacing: .5px; }
.spacer { flex: 1; }
.nav-links a { color: #fff; text-decoration: none; padding: 8px 10px; border-radius: 10px; }
.nav-links { display: none; }
.whatsapp { background: linear-gradient(90deg,var(--cta),#128C7E); color:#052a1b; padding:10px 14px; border-radius: 999px; font-weight:800; text-decoration:none;}

/* HERO (без видео, сплошной фон) */
.hero { padding: 72px 20px 36px; background: var(--bg-strong); border-bottom: 1px solid rgba(255,255,255,0.07); }
.lead { color: var(--muted); margin-bottom: 16px; }
.hero-ctas { display:flex; gap:10px; flex-wrap: wrap; justify-content:center; }
.btn { display:inline-flex; align-items:center; gap:10px; padding: 12px 18px; border-radius: 999px; text-decoration:none; font-weight:800; border: none; cursor: pointer; }
.btn-primary { background: linear-gradient(90deg,var(--cta),#128C7E); color:#052a1b; }
.btn-ghost { background: transparent; border: 2px solid rgba(255,255,255,0.08); color: var(--accent); }

/* GRID + CARDS */
.grid { display:grid; gap:16px; }
.services-grid { grid-template-columns: 1fr; }
.card { background: #113726; border: 1px solid rgba(255,255,255,0.06); border-radius: 16px; padding: 16px; box-shadow: 0 8px 26px rgba(0,0,0,0.35); }
.card h3 { color: var(--accent); }
.card p { color: var(--muted); }

/* HOW-IT-WORKS */
.hiw-grid { grid-template-columns: 1fr; }
.hiw-step { display:flex; gap:12px; align-items:flex-start; }
.hiw-num { width:36px; height:36px; border-radius:10px; background:#165239; display:grid; place-items:center; font-weight:800; color:var(--accent); }

/* CALCULATOR */
.calc-wrap { display:grid; grid-template-columns: 1fr; gap: 16px; }
.input { background:#0f2f22; color:#fff; border:1px solid rgba(255,255,255,0.06); border-radius:12px; padding:12px; width:100%; }
.result { background:#132f23; border:1px solid rgba(255,255,255,0.06); border-radius:12px; padding:14px; font-weight:700; color:#e6f2ed; }

/* IDEA */
#ideaResult { background:#0f2f22; border:1px solid rgba(255,255,255,0.06); border-radius:12px; padding:12px; }

/* CHAT */
.chat-card { position: fixed; right: 12px; bottom: 12px; width: min(92vw, 360px); border-radius: 16px; background:#0f2f22; border:1px solid rgba(255,255,255,0.08); z-index: 60; box-shadow:0 18px 50px rgba(0,0,0,0.45); }
.chat-header { display:flex; align-items:center; gap:10px; padding: 10px 12px; background:#113726; }
.chat-body { padding: 12px; height: 260px; overflow:auto; }
.chat-input { display:flex; gap:8px; padding: 10px; border-top:1px solid rgba(255,255,255,0.08); }
.msg { max-width: 78%; padding: 10px; border-radius: 12px; margin-bottom: 8px; font-size: 14px; line-height: 1.3; white-space: pre-line; }
.msg.user { background: linear-gradient(90deg,#25D366,#128C7E); color: #032616; margin-left:auto; }
.msg.bot { background: rgba(255,255,255,0.06); color: var(--muted); }
.typing { display:inline-block; width:36px; height:14px; background:rgba(255,255,255,0.10); border-radius:10px; position:relative; overflow:hidden }
.typing::before { content:""; position:absolute; left:-36px; top:0; bottom:0; width:36px; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.35),transparent); animation:shine 1.2s infinite; }
@keyframes shine { 0%{left:-36px} 100%{left:36px} }

/* FOOTER */
footer { background: var(--bg-strong); padding: 40px 20px; text-align:center; color: rgba(255,255,255,0.7); border-top:1px solid rgba(255,255,255,0.06); }

/* DESKTOP */
@media (min-width: 720px){
  .nav-links { display: flex; gap: 10px; }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .hiw-grid { grid-template-columns: repeat(4, 1fr); }
  .calc-wrap { grid-template-columns: 1fr 360px; }
}
@media (min-width: 1024px){
  .services-grid { grid-template-columns: repeat(4, 1fr); }
}