/* dao/static/css/theme.css */
/* dao/static/css/theme.css */

:root{
  --color-bg:#f7f9fc;
  --color-text:#0b1524;
  --color-muted:#4f5b76;
  --color-primary:#175ce1;
  --color-primary-dark:#0f3cb8;
  --color-accent:#e3ecff;
  --color-border:#d5dceb;
  --surface:#ffffff;
  --surface-elev:#f1f5ff;
  --cta-text:#ffffff;

  /* База фона: единый цвет + тонкий шум */
  --hero-bg-base: var(--color-bg);
  --hero-panel: var(--color-bg);
  --page-bg: var(--color-bg);
  --noise-bg: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='64' height='64'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' seed='2'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncA type='table' tableValues='0 0.06'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");

  --radius-pill:999px;
  --radius-card:24px;
  --radius-control:12px;
  --radius-section:32px;

  --border-default:1px solid var(--color-border);
  --border-card:1px solid var(--color-border);
  --border-section:1px solid var(--color-border);

  --shadow-header:0 10px 25px rgba(10,15,45,.06);
  --shadow-card:0 18px 40px rgba(12,30,80,.08);
  --shadow-section:0 24px 60px rgba(15,42,110,.08);

  --focus-ring:0 0 0 2px rgba(23,92,225,.4);
  --button-shadow:0 18px 30px rgba(23,92,225,.25);

  --cta-max-width:480px;
  --nav-height:64px;

  --hero-bottom-gap: clamp(16px, 2.5vh, 28px);
}

/* Десктоп: уменьшаем высоту шапки в 2 раза */
@media (min-width: 881px){
  :root{ --nav-height:32px; }
}

html,body{
  background-color: var(--page-bg);
  background-image: var(--noise-bg);
  background-repeat: repeat;
  background-size: 140px 140px;
  background-attachment: fixed;
  color: var(--color-text);
}
a{color:var(--color-primary)}
a:hover,a:focus{text-decoration:underline}
body{font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.6}

/* Header */
.site-header{background:rgba(255,255,255,.92);border-bottom:var(--border-default);box-shadow:var(--shadow-header);backdrop-filter:blur(16px)}
.nav__link{color:var(--color-text)}
/* Синеватая подсветка активного/hover */
.nav__link--active,
.nav__link:hover{
  background:linear-gradient(180deg, rgba(23,92,225,.14), rgba(23,92,225,.1));
  color:var(--color-primary);
  border-color:rgba(23,92,225,.28);
  box-shadow:0 0 0 2px rgba(23,92,225,.12) inset, 0 6px 18px rgba(23,92,225,.12);
}
.nav__burger{border:var(--border-default);background:var(--surface);color:var(--color-text)}
.nav__burger:hover{background:rgba(23,92,225,.06)}

/* Правый чип текущего раздела (мобилка) — кликабелен */
.nav__current{
  background:rgba(23,92,225,.10);
  color:var(--color-primary);
  border-color:rgba(23,92,225,.28);
  box-shadow:0 0 0 2px rgba(23,92,225,.10) inset, 0 8px 22px rgba(23,92,225,.12);
  cursor:pointer;
}
.nav__current:hover,
.nav__current:focus-visible{
  background:rgba(23,92,225,.14);
  box-shadow:0 0 0 2px rgba(23,92,225,.14) inset, 0 10px 24px rgba(23,92,225,.14);
  outline:none;
}
.nav__link--lang{
  border-color:rgba(23,92,225,.35);
  color:var(--color-primary);
  background:rgba(23,92,225,.08);
}
.nav__link--lang:hover,
.nav__link--lang:focus-visible{
  background:rgba(23,92,225,.16);
  color:var(--color-primary-dark);
}

/* Hero: не перекрашиваем поверх фона страницы */
.hero{color:var(--color-text)}
.hero--cover{background:transparent}
.hero__lead{color:var(--color-muted)}
.hero__bullets .hero__bullet{color:var(--color-text)}
.hero__bullets .hero__bullet::before{background:var(--color-primary)}

/* Sections */
.section-include{background:var(--surface);border:var(--border-section);border-radius:var(--radius-section);box-shadow:var(--shadow-section);position:relative;overflow:visible}
.section-include.section-include--muted{background:var(--surface-elev)}
.section-include.section-include--cta{background:linear-gradient(135deg,#f7fbff,#eef3ff)}
.section-include::after{content:"";position:absolute;left:2rem;right:2rem;bottom:.5rem;height:12px;background:linear-gradient(90deg,transparent,rgba(23,92,225,.2),transparent);filter:blur(14px);opacity:.7;pointer-events:none}
.hero--cover + .section-include{margin-top:clamp(1.25rem,4vw,2.5rem)}

.card,.integration__step,.confidence__item,.plan-card,.contact-card{background:var(--surface);border:var(--border-card);border-radius:var(--radius-card);box-shadow:var(--shadow-card);color:var(--color-text)}
.plan-card .price{color:var(--color-text)}
.contact-card a{color:var(--color-primary)}

.list--check li::before{background:var(--color-primary)}

/* Buttons */
.button{border-radius:var(--radius-pill);background:linear-gradient(135deg,var(--color-primary),var(--color-primary-dark));color:var(--cta-text);box-shadow:var(--button-shadow)}
.button--outline,.button--ghost{border:1.5px solid rgba(23,92,225,.35);color:var(--color-primary);background:transparent}
.button--outline:hover,.button--ghost:hover,.button--outline:focus-visible,.button--ghost:focus-visible{background:rgba(23,92,225,.08)}
.button:focus-visible{outline:var(--focus-ring);outline-offset:2px}

/* FAQ */
.faq{background:var(--surface);border:var(--border-card);box-shadow:0 10px 24px rgba(12,30,80,.08)}
.faq summary{color:var(--color-text)}

/* Notes */
.note{color:var(--color-muted)}

/* Forms */
input[type="text"],input[type="tel"],input[type="email"],input[type="search"],textarea{
  background:#fff;border:var(--border-default);color:var(--color-text);border-radius:var(--radius-control);
  transition:border-color .15s ease,box-shadow .15s ease;
}
input:focus,textarea:focus{border-color:var(--color-primary);box-shadow:var(--focus-ring)}
input::placeholder,textarea::placeholder{color:var(--color-muted)}

/* Footer */
.site-footer{
  position: fixed; bottom: 0; left: 0; right: 0;
  z-index: 800;
  background:#fff; border-top:var(--border-default);
  padding:.3rem 0;
  padding-bottom: calc(.3rem + env(safe-area-inset-bottom, 0px));
}
.footer-container{
  display:flex; align-items:center; justify-content:center; gap:.75rem;
  padding:.3rem 1rem .4rem;
}
.footer-brand p{margin:0; line-height:1.15; color:var(--color-text); font-weight:700}
.footer-city{margin:0; line-height:1.15; color:var(--color-muted)}

@media (max-width: 600px){
  .site-footer{padding:.2rem 0; padding-bottom: calc(.2rem + env(safe-area-inset-bottom, 0px))}
  .footer-container{flex-direction:column; justify-content:center; text-align:center; gap:.25rem; padding:.2rem .75rem .25rem}
  .footer-brand p{font-size:.95rem}
  .footer-city{font-size:.85rem}
}
@media (min-width:900px){
  .site-footer{padding:.4rem 0}
  .footer-container{padding:.35rem 1.25rem .45rem; justify-content:center; gap:.5rem}
}

.hero__buttons .button--outline{border-color:rgba(23,92,225,.35)}
.skip-link:focus{background:var(--color-primary);color:var(--cta-text)}
.section-include.section-include--muted .confidence__item,
.section-include.section-include--muted .integration__step{background:var(--surface);box-shadow:var(--shadow-card)}
