:root{
  --brand:#fdd401;         /* Stella yellow */
  --brand-2:#ffdf3d;
  --ink:#0f172a;
  --muted:#64748b;
  --bg:#f4f5f7;
  --card:#ffffff;
  --line:rgba(15,23,42,.10);
  --shadow:0 14px 26px rgba(15,23,42,.08);
  --shadow-sm:0 10px 18px rgba(15,23,42,.06);
  --r:20px;

  /* Spacing scale (mobile-first) */
  --s1:8px;
  --s2:12px;
  --s3:16px;
  --s4:20px;
  --s5:28px;
  --s6:36px;
  --s7:48px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  color:var(--ink);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.6;
}

.container{max-width:1120px;margin:0 auto;padding:0 clamp(16px, 3vw, 24px)}

/* Topbar */
.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(244,245,247,.84);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
}
.topbar__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 0;
  gap:var(--s3);
  flex-wrap:wrap;
}

.brand{display:flex;align-items:center;gap:var(--s2);min-width:0;flex:1 1 auto;min-width:0}
.logo{
  width:clamp(56px, 18vw, 112px);
  height:clamp(56px, 18vw, 112px);
  border-radius:clamp(14px, 5vw, 22px);
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow-sm);
  display:grid;place-items:center;
  padding:8px;
  flex-shrink:0;
}
.logo img{width:100%;height:100%;object-fit:contain;display:block}
.logo__fallback{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  text-align:center;
}
.brand__txt{display:flex;flex-direction:column;line-height:1.1;min-width:0}
.brand__name{font-weight:950;letter-spacing:.2px}
.brand__sub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:-1px}

.nav{display:none;gap:14px;flex-wrap:wrap;align-items:center}
.nav a{
  font-size:13px;
  color:var(--muted);
  text-decoration:none;
  font-weight:850;
  line-height:1.2;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  cursor:pointer;
}
.nav a:hover{color:var(--ink)}

/* Мобильная навигация */
.nav-toggle{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  padding:0;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:12px;
  cursor:pointer;
  appearance:none;
  min-height:44px;
  transition:background-color 0.2s, border-color 0.2s;
}
.nav-toggle:hover{
  background:rgba(15,23,42,.02);
  border-color:rgba(15,23,42,.18);
}
.nav-toggle:focus-visible{
  outline:3px solid rgba(253,212,1,.50);
  outline-offset:2px;
  border-color:rgba(253,212,1,.40);
}
.nav-toggle__icon{
  position:relative;
  width:20px;
  height:2px;
  background:var(--ink);
  border-radius:2px;
  transition:background-color 0.2s;
}
.nav-toggle__icon::before,
.nav-toggle__icon::after{
  content:'';
  position:absolute;
  left:0;
  width:20px;
  height:2px;
  background:var(--ink);
  border-radius:2px;
  transition:transform 0.3s, top 0.3s;
}
.nav-toggle__icon::before{
  top:-6px;
}
.nav-toggle__icon::after{
  top:6px;
}
.nav-toggle[aria-expanded="true"] .nav-toggle__icon{
  background:transparent;
}
.nav-toggle[aria-expanded="true"] .nav-toggle__icon::before{
  top:0;
  transform:rotate(45deg);
}
.nav-toggle[aria-expanded="true"] .nav-toggle__icon::after{
  top:0;
  transform:rotate(-45deg);
}

.nav--mobile{
  display:none;
}
@media (max-width: 859px){
  .nav-toggle{display:flex;flex-shrink:0}
  .nav{display:none}
  /* Хедер на мобильной: одна строка — логотип + бургер, телефон только в меню */
  .topbar__inner{
    gap:var(--s2);
    flex-wrap:nowrap;
  }
  .topbar__inner > .pill{
    display:none; /* телефон в мобильном меню */
  }
  .topbar__inner > .nav-toggle{
    order:2;
  }
  .topbar__inner > .brand{
    order:1;
    flex:1 1 auto;
    min-width:0;
  }
}
/* На десктопе pill в хедере виден; на мобильном скрыт (телефон в меню) */
@media (max-width: 480px){
  .topbar__inner > .pill small{
    display:none;
  }
}
@media (max-width: 859px){
  /* Боковая панель (drawer), не на всю ширину */
  .nav--mobile{
    position:fixed;
    top:0;
    left:0;
    width:min(300px, 85vw);
    max-width:100%;
    height:100%;
    height:100dvh;
    background:var(--card);
    border-right:1px solid var(--line);
    padding:var(--s4);
    padding-top:calc(var(--topbar-height, 70px) + var(--s3));
    display:flex;
    flex-direction:column;
    gap:2px;
    transform:translateX(-100%);
    transition:transform 0.25s ease-out;
    z-index:40;
    box-shadow:8px 0 24px rgba(15,23,42,.12);
    overflow-y:auto;
  }
  .nav--mobile.is-open{
    transform:translateX(0);
  }
  .nav--mobile a{
    font-size:15px;
    color:var(--ink);
    text-decoration:none;
    font-weight:850;
    padding:12px 14px;
    border-radius:12px;
    transition:background-color 0.2s;
    min-height:44px;
    display:flex;
    align-items:center;
    cursor:pointer;
  }
  .nav--mobile a:hover,
  .nav--mobile a:focus-visible{
    background:rgba(15,23,42,.08);
    outline:none;
    box-shadow:inset 0 0 0 2px rgba(253,212,1,.50);
  }
  /* Телефон в меню: выделенный блок внизу */
  .nav--mobile__phone{
    margin-top:auto;
    padding-top:var(--s3);
    border-top:1px solid var(--line);
    background:rgba(253,212,1,.12) !important;
    border:1px solid rgba(253,212,1,.35);
    justify-content:center;
    gap:10px;
  }
  .nav--mobile__phone .icon{
    width:20px;
    height:20px;
    flex-shrink:0;
  }
}

/* Оверлей при открытом мобильном меню */
body.nav-open::before{
  content:'';
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.35);
  z-index:35;
  pointer-events:auto;
}
@media (min-width: 860px){
  .nav-toggle{display:none}
}

.pill{
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:999px;
  background:var(--card);border:1px solid var(--line);
  box-shadow:var(--shadow-sm);
  font-weight:900;font-size:13px;text-decoration:none;color:var(--ink);
  white-space:nowrap;
  line-height:1.3;
  min-height:44px; /* WCAG */
  transition:border-color 0.2s, box-shadow 0.2s;
  flex-shrink:0;
  cursor:pointer;
}
.pill__icon{
  width:20px;
  height:20px;
  flex-shrink:0;
  object-fit:contain;
}
.pill:hover{
  border-color:rgba(15,23,42,.20);
  box-shadow:0 12px 20px rgba(15,23,42,.10);
}
.pill:focus-visible{
  outline:none;
  border-color:rgba(253,212,1,.60);
  box-shadow:0 0 0 3px rgba(253,212,1,.25), var(--shadow-sm);
}
.pill small{font-weight:850;color:var(--muted)}

/* Screen reader only */
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border-width:0;
}

/* Shared */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.contacts-card{padding:var(--s5)}
.section{padding:var(--s7) 0}

/* Mobile-first section header: stacked (more air, less “налеплено”) */
.section__head{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s1);margin-bottom:var(--s4)}
.h2{margin:0;font-size:clamp(18px, 3.6vw, 24px);font-weight:950;letter-spacing:-.25px}
.h3{margin:0;font-size:clamp(16px, 2.8vw, 20px);font-weight:950;letter-spacing:-.15px;line-height:1.3}
.hint{margin:0;color:var(--muted);font-size:14px;font-weight:750;line-height:1.6;max-width:62ch}

.btn{
  appearance:none;border:0;cursor:pointer;
  border-radius:16px;padding:12px 14px;
  font-weight:950;letter-spacing:.2px;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  text-decoration:none;
  min-height:44px; /* WCAG: тач-таргет */
  transition:background-color 0.2s, border-color 0.2s, box-shadow 0.2s;
}
.btn--primary{
  background:var(--brand);
  color:var(--ink);
  box-shadow:0 14px 26px rgba(253,212,1,.24);
}
.btn--primary:hover{background:var(--brand-2)}
.btn--primary:active{
  background:var(--brand);
  box-shadow:0 8px 16px rgba(253,212,1,.20);
}
.btn--primary:focus-visible{
  outline:3px solid rgba(253,212,1,.60);
  outline-offset:2px;
  box-shadow:0 14px 26px rgba(253,212,1,.24), 0 0 0 2px rgba(253,212,1,.30);
}
.btn--primary:disabled{
  opacity:0.5;
  cursor:not-allowed;
  pointer-events:none;
}
.btn--large{
  padding:14px 20px;
  font-size:16px;
  min-height:52px;
}
.btn--loading {
  position:relative;
  color:transparent;
  pointer-events:none;
}
.btn--loading::after {
  content:'';
  position:absolute;
  width:16px;
  height:16px;
  top:50%;
  left:50%;
  margin-left:-8px;
  margin-top:-8px;
  border:2px solid currentColor;
  border-top-color:transparent;
  border-radius:50%;
  animation:spin 0.6s linear infinite;
}
@keyframes spin {
  to { transform:rotate(360deg); }
}
.btn[aria-disabled="true"]{
  opacity:0.5;
  cursor:not-allowed;
  pointer-events:none;
}
.btn--ghost{
  background:var(--card);
  color:var(--ink);
  border:1px solid var(--line);
}

/* Hover: брендовая рамка + лёгкая заливка */
.btn--ghost:hover{
  border-color:rgba(253,212,1,.65);
  background:rgba(253,212,1,.10);
  box-shadow:0 10px 18px rgba(253,212,1,.12);
}

/* Active: чуть плотнее */
.btn--ghost:active{
  background:rgba(253,212,1,.16);
  box-shadow:0 6px 12px rgba(253,212,1,.10);
}

/* Focus: сохраняем WCAG */
.btn--ghost:focus-visible{
  outline:3px solid rgba(253,212,1,.50);
  outline-offset:2px;
  border-color:rgba(253,212,1,.55);
}
.btn--ghost:disabled{
  opacity:0.5;
  cursor:not-allowed;
  pointer-events:none;
}
.text-link[aria-disabled="true"]{
  opacity:0.6;
  cursor:not-allowed;
  pointer-events:none;
  text-decoration:none;
}

/* Иконка-кнопка (мессенджеры) */
.btn--icon{
  width:64px;
  padding:12px;
  justify-content:center;
}
.icon{
  width:24px;
  height:24px;
  display:block;
  object-fit:contain;
}
.btn--icon .icon{
  width:40px;
  height:40px;
  object-fit:contain;
}

/* Текстовая ссылка (как “text button”): компактнее, чем кнопка */
.text-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--ink);
  font-weight:950;
  text-decoration:none;
  padding:10px 0;
  min-height:44px; /* WCAG: тач-таргет */
  border-radius:12px;
  cursor:pointer;
}
.text-link:hover{
  text-decoration:underline;
  text-underline-offset:3px;
}
.text-link:focus-visible{
  outline:3px solid rgba(253,212,1,.50);
  outline-offset:2px;
}

.chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 10px;border-radius:999px;
  background:rgba(15,23,42,.04);
  border:1px solid var(--line);
  font-size:12px;color:var(--muted);font-weight:850;
}
.chip i{width:8px;height:8px;border-radius:999px;background:var(--brand);box-shadow:0 0 0 6px rgba(253,212,1,.14)}

/* Hero */
.hero{padding:var(--s5) 0 var(--s2)}
.hero__card{padding:clamp(20px, 3.5vw, 36px)}
.hero__grid{display:grid;gap:var(--s6)}

.kicker{display:inline-flex;align-items:center;gap:10px;font-size:12px;color:var(--muted);font-weight:850}
.kicker .dot{width:9px;height:9px;border-radius:999px;background:var(--brand);box-shadow:0 0 0 6px rgba(253,212,1,.16)}

h1{margin:10px 0 10px;font-size:clamp(28px, 6vw, 46px);line-height:1.12;letter-spacing:-.65px}
.lead{
  margin:0;
  color:#475569; /* Более темный, контраст 5.1:1 */
  font-size:15px;
  line-height:1.7;
  font-weight:730;
  max-width:70ch;
}

.hero__chips{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s4)}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s4)}

.hero__media{
  border-radius:var(--r);
  border:1px solid var(--line);
  background:
    radial-gradient(900px 420px at 70% 20%, rgba(253,212,1,.22), rgba(253,212,1,0)),
    linear-gradient(180deg, rgba(15,23,42,.04), rgba(15,23,42,.015));
  overflow:hidden;
  position:relative;
  min-height:260px;
  box-shadow:var(--shadow-sm);
}
.hero__media img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.02) contrast(1.02)}
.hero__media .fallback{
  position:absolute;inset:0;display:grid;place-items:center;
  color:rgba(15,23,42,.55);font-weight:900;font-size:13px;
  padding:var(--s4);text-align:center;
}

.badge{
  position:absolute;left:14px;bottom:14px;
  background:rgba(255,255,255,.88);
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px 12px;
  box-shadow:var(--shadow-sm);
  display:flex;flex-direction:column;gap:2px;
  max-width:calc(100% - 28px);
}
.badge b{font-size:14px}
.badge span{font-size:12px;color:var(--muted);font-weight:850}

.fine{margin-top:var(--s3);font-size:13px;color:#475569;font-weight:750;line-height:1.6} /* Контраст 5.1:1 (WCAG AA) */

/* Equipment cards */
.grid{display:grid;gap:var(--s4)}
.eq{padding:20px;display:grid;gap:var(--s3);transition:border-color 0.2s, box-shadow 0.2s}
.eq:hover{border-color:rgba(15,23,42,.15);box-shadow:0 16px 30px rgba(15,23,42,.10)}
.eq__img{
  border-radius:16px;
  border:1px solid var(--line);
  background:
    radial-gradient(420px 240px at 20% 20%, rgba(253,212,1,.22), rgba(253,212,1,0)),
    linear-gradient(180deg, rgba(15,23,42,.05), rgba(15,23,42,.02));
  overflow:hidden;
  aspect-ratio: 16 / 10;
  position:relative;
}
.eq__img img{width:100%;height:100%;object-fit:cover;display:block}
.eq__img .ph{position:absolute;inset:0;display:grid;place-items:center;color:rgba(15,23,42,.55);font-weight:900;font-size:12px;padding:14px;text-align:center}

.eq__title{font-weight:950;letter-spacing:-.25px;font-size:15px}
.eq__meta{display:flex;flex-wrap:wrap;gap:10px}
.eq__meta .chip{background:rgba(253,212,1,.14);border-color:rgba(253,212,1,.34);color:rgba(15,23,42,.86)}
.eq__meta .chip i{box-shadow:0 0 0 6px rgba(253,212,1,.12)}

.eq__cta{display:grid;grid-template-columns:1fr;gap:12px}

/* Hover карточки: чуть "поднимаем" и подсвечиваем CTA */
.card.eq:hover{
  border-color:rgba(253,212,1,.35);
  box-shadow:0 18px 34px rgba(15,23,42,.10);
}

.card.eq:hover .btn--ghost{
  border-color:rgba(253,212,1,.65);
  background:rgba(253,212,1,.10);
}

/* Quote block */
.quote{
  padding:clamp(16px, 3vw, 22px);
  background:
    radial-gradient(900px 320px at 15% 0%, rgba(253,212,1,.18), rgba(253,212,1,0)),
    #fff;
}
.quote__grid{display:grid;gap:var(--s6);align-items:stretch}
.quote__copy{padding:0;display:flex;flex-direction:column;gap:var(--s4);min-height:100%}

/* Мобильная версия: калькулятор перед формой заявки, чтобы пользователь сначала выбрал услугу */
@media (max-width: 859px){
  .quote__grid{
    grid-template-rows:auto auto auto;
  }
  .quote__copy{
    display:contents;
  }
  .quote__copy > *:first-child{
    grid-row:1;
  }
  .quote__calc{
    grid-row:2;
  }
  .quote__copy > .lead-form{
    grid-row:3;
  }
}

.lead-form{
  margin-top:var(--s4);
  padding-top:var(--s4);
  border-top:1px solid var(--line);
  display:none;
}
.lead-form .kicker{margin-bottom:var(--s2)}

/* Make the left column feel “designed”, not stuck to the top */
.panel{
  padding:16px;
  border-radius:16px;
  border:1px solid var(--line);
  background:rgba(15,23,42,.02);
  box-shadow:none;
}
.panel--soft{
  background:radial-gradient(700px 240px at 15% 0%, rgba(253,212,1,.14), rgba(253,212,1,0)), rgba(15,23,42,.02);
  border-color:rgba(15,23,42,.10);
}
/* Параграфы в panel должны соответствовать стилям информационных блоков */
.panel p{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.7;
  font-weight:730;
}
.panel p.fine{
  font-size:13px;
  color:#475569;
  font-weight:750;
  line-height:1.6;
}
.quote__calc{
  /* Контейнер калькулятора в quote: без “card в card”, без второй рамки/тени */
  padding:14px;
  border:0;
  box-shadow:none;
}
.quote__call{margin-top:auto}
.quote__call b{display:block;font-weight:950;margin:0 0 6px}
.quote__call p{margin:0;color:var(--muted);font-size:13px;line-height:1.6;font-weight:740}
.quote__call .actions{display:grid;grid-template-columns:1fr;gap:12px;margin-top:12px}
.quote__call .actions .btn{width:100%}

/* CTA rows: full-width buttons (fixes “прижата к левому краю”) */
.cta-row{display:grid;grid-template-columns:1fr;gap:12px;margin-top:14px}
.cta-row .btn{width:100%}

@media (min-width: 520px){
  .quote__call .actions{grid-template-columns:1fr 1fr}
  .cta-row{grid-template-columns:1fr 1fr}
}
.bullets{margin:var(--s3) 0 0;padding:0;list-style:none;display:grid;gap:10px}
.bullets li{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-weight:760;font-size:13px;line-height:1.55}
.bullets li b{color:var(--ink)}
.quote__copy .bullets{margin:var(--s3) 0 0;padding:0;list-style:none;display:grid;gap:10px}
.quote__copy .bullets li{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-weight:760;font-size:13px;line-height:1.55}
.quote__copy .bullets li b{color:var(--ink)}
.tick{width:18px;height:18px;border-radius:7px;background:rgba(253,212,1,.20);border:1px solid rgba(253,212,1,.38);flex:0 0 auto;margin-top:2px}

/* Form */
.form{display:grid;gap:16px}
.field{display:flex;flex-direction:column;gap:10px}
label{font-size:12px;color:var(--muted);font-weight:900}
select,input{
  width:100%;padding:13px 12px;border-radius:14px;
  border:1px solid var(--line);
  background:#fff;color:var(--ink);
  font-weight:850;
  min-height:44px; /* WCAG: тач-таргет */
  transition:border-color 0.2s, box-shadow 0.2s;
}
/* Кастомная стрелка дропдауна: SVG-стрелка внутри круга, через background-image на select */
select{
  appearance:none;
  -webkit-appearance:none;
  padding-right:52px;
  cursor:pointer;
  background:#fff
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='%23fdd401' fill-opacity='0.12' stroke='%23fdd401' stroke-opacity='0.35' stroke-width='1'/%3E%3Cpath d='M11 13l5 6 5-6' fill='none' stroke='%230f172a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
    no-repeat right 10px center / 32px 32px;
}
input:hover{
  border-color:rgba(15,23,42,.20);
}
/* Hover для select: сохраняем SVG-стрелку, круг ярче */
select:hover{
  border-color:rgba(15,23,42,.20);
  background:#fff
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='%23fdd401' fill-opacity='0.18' stroke='%23fdd401' stroke-opacity='0.50' stroke-width='1'/%3E%3Cpath d='M11 13l5 6 5-6' fill='none' stroke='%230f172a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
    no-repeat right 10px center / 32px 32px;
}
input:focus{
  outline:none;
  border-color:rgba(253,212,1,.70);
  box-shadow:0 0 0 3px rgba(253,212,1,.20);
}
/* Focus для select: сохраняем SVG-стрелку, круг самый яркий */
select:focus{
  outline:none;
  border-color:rgba(253,212,1,.70);
  box-shadow:0 0 0 3px rgba(253,212,1,.20);
  background:#fff
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='%23fdd401' fill-opacity='0.22' stroke='%23fdd401' stroke-opacity='0.60' stroke-width='1'/%3E%3Cpath d='M11 13l5 6 5-6' fill='none' stroke='%230f172a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
    no-repeat right 10px center / 32px 32px;
}
input:active{
  border-color:rgba(253,212,1,.80);
}
select:active{
  border-color:rgba(253,212,1,.80);
}
select:disabled,input:disabled{
  opacity:0.5;
  cursor:not-allowed;
}
select:disabled{
  background:rgba(15,23,42,.02);
}
input:disabled{
  background:rgba(15,23,42,.02);
}
select:invalid,input:invalid:not(:placeholder-shown){
  border-color:#ef4444;
  box-shadow:0 0 0 3px rgba(239,68,68,.15);
}
.field--error input,
.field--error select,
.field--error textarea {
  border-color:#ef4444;
  box-shadow:0 0 0 3px rgba(239,68,68,.15);
}
/* Текст подсказки при ошибке (минимум не соблюдён) */
.field--error .min-hint {
  color:#ef4444;
}
textarea{
  width:100%;padding:13px 12px;border-radius:14px;
  border:1px solid var(--line);
  background:#fff;color:var(--ink);
  font-weight:850;
  font-family:inherit;
  resize:vertical;
  min-height:80px;
  transition:border-color 0.2s, box-shadow 0.2s;
}
textarea:hover{
  border-color:rgba(15,23,42,.20);
}
textarea:focus{
  outline:none;
  border-color:rgba(253,212,1,.70);
  box-shadow:0 0 0 3px rgba(253,212,1,.20);
}
textarea:active{
  border-color:rgba(253,212,1,.80);
}
textarea:disabled{
  opacity:0.5;
  cursor:not-allowed;
  background:rgba(15,23,42,.02);
}
textarea:invalid:not(:placeholder-shown){
  border-color:#ef4444;
  box-shadow:0 0 0 3px rgba(239,68,68,.15);
}
.field--error textarea {
  border-color:#ef4444;
  box-shadow:0 0 0 3px rgba(239,68,68,.15);
}

.calc__result{
  margin-top:12px;padding:14px;border-radius:16px;
  background:rgba(15,23,42,.03);
  border:1px solid var(--line);
  position:relative;
  transition:opacity 0.2s;
}
.calc__result[aria-busy="true"]{
  opacity:0.7;
}
.calc__result[aria-busy="true"]::before{
  content:'';
  position:absolute;
  top:8px;
  right:8px;
  width:12px;
  height:12px;
  border:2px solid var(--muted);
  border-top-color:transparent;
  border-radius:50%;
  animation:spin 0.6s linear infinite;
}
.calc__result b{font-size:18px;font-weight:950;color:var(--ink);display:block;margin-bottom:4px}
.calc__result .row{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--ink);margin-top:10px;font-weight:850}
.calc__result small{color:var(--muted);font-weight:760}

/* Info cards */
.info{padding:20px;transition:border-color 0.2s, box-shadow 0.2s}
.info:hover{border-color:rgba(15,23,42,.15);box-shadow:0 16px 30px rgba(15,23,42,.10)}
.info b{display:block;font-weight:950;margin-bottom:8px}
.info p{margin:0;color:var(--muted);font-size:14px;line-height:1.7;font-weight:730}
/* Списки в карточках info должны иметь те же стили, что и параграфы */
.card.info .bullets{margin:var(--s3) 0 0;padding:0;list-style:none;display:grid;gap:10px}
.card.info .bullets li{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-weight:730;font-size:14px;line-height:1.7}
.card.info .bullets li b{color:var(--ink);font-weight:950}
.card.info{display:flex;flex-direction:column}
.card.info .info__cta{margin-top:auto;padding-top:12px;display:grid;grid-template-columns:1fr}
.card.info .info__cta .btn{width:100%}

/* Sticky mobile bar: ровная сетка 2×2, не перекрывает контент */
.sticky{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:60;
  padding:12px 16px;
  padding-bottom:max(12px, env(safe-area-inset-bottom));
  background:rgba(244,245,247,.96);
  backdrop-filter:blur(10px);
  border-top:1px solid var(--line);
  box-shadow:0 -4px 20px rgba(15,23,42,.06);
}
.sticky__inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 12px;
  max-width:400px;
  margin:0 auto;
}
.sticky__inner .btn--icon{
  width:100%;
  min-width:0;
  padding:12px;
}
.sticky .btn{padding:12px 14px;border-radius:16px}

/* Отступ контента над sticky-баром */
.pad-bottom{padding-bottom:100px}
@media (max-width: 859px){
  .pad-bottom{padding-bottom:120px}
}

/* Desktop enhancements */
@media (min-width: 860px){
  .nav{display:flex}
  .section{padding:72px 0}
  .section__head{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:var(--s4)}
  .lead{font-size:16px}
  .hero__grid{
    grid-template-columns:1.15fr .85fr;
    align-items:stretch;
    gap:var(--s7)
  }
  .hero__media{min-height:460px}
  .grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quote__grid{
    grid-template-columns:1fr .95fr;
    align-items:start;
    gap:var(--s7)
  }
  .sticky{display:none}
  .pad-bottom{padding-bottom:72px}
}

/* Доступность: уважение prefers-reduced-motion (ui-ux-pro-max) */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,
  *::before,
  *::after{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
  }
}