/* Основа страниц Студии (docs/SITES-STUDIO.md): /_pub/site-base.css на <адрес>.shtabsite.ru. Нейросеть строит страницы на
   этих классах, стиль проекта меняет переменные (--s-*) в style.css. Телефон и компьютер, светлая основа. */
:root{--s-bg:#FAF7F2;--s-surface:#FFFFFF;--s-ink:#1F2A37;--s-ink2:#4B5563;--s-mute:#6B7280;--s-line:#E7E0D5;--s-accent:#9A5B13;--s-accent-ink:#FFFFFF;
 --s-soft:#F3EDE3;--s-ok:#1F6B54;--s-err:#B5402F;--s-radius:16px;--s-shadow:0 1px 2px rgba(0,0,0,.04),0 12px 32px -18px rgba(40,30,10,.25);
 --s-font:'Golos Text',-apple-system,'Segoe UI',Roboto,sans-serif;--s-head:'Playfair Display',Georgia,serif;--s-max:1120px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--s-bg);color:var(--s-ink);font:400 16px/1.6 var(--s-font)}
img,video{max-width:100%;height:auto;display:block}
a{color:var(--s-accent)}
h1,h2,h3,h4{font-family:var(--s-head);line-height:1.15;margin:0 0 .5em;color:var(--s-ink);font-weight:600}
h1{font-size:clamp(32px,5vw,56px)}h2{font-size:clamp(26px,3.4vw,38px)}h3{font-size:22px}
p{margin:0 0 1em}.s-lead{font-size:clamp(17px,2vw,20px);color:var(--s-ink2)}.s-mute{color:var(--s-mute)}
.s-wrap{width:100%;max-width:var(--s-max);margin:0 auto;padding:0 20px}
.s-section{padding:clamp(48px,8vw,96px) 0}.s-section.s-alt{background:var(--s-soft)}
.s-empty{padding:18vh 20px;text-align:center;color:var(--s-mute)}
/* шапка и меню */
.s-nav{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--s-bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--s-line)}
.s-nav .s-wrap{display:flex;align-items:center;gap:20px;min-height:64px;flex-wrap:wrap}
.s-logo{font:600 20px var(--s-head);color:var(--s-ink);text-decoration:none;margin-right:auto}
.s-menu{display:flex;gap:18px;flex-wrap:wrap}.s-menu a{color:var(--s-ink2);text-decoration:none;font-weight:500}.s-menu a:hover,.s-menu a.on{color:var(--s-accent)}
/* первый экран */
.s-hero{padding:clamp(56px,10vw,128px) 0 clamp(40px,7vw,88px)}.s-hero .s-lead{max-width:640px}
.s-hero-split{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
/* кнопки */
.s-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:12px;background:var(--s-accent);color:var(--s-accent-ink);font:600 16px var(--s-font);text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform .15s,opacity .15s}
.s-btn:hover{opacity:.92;transform:translateY(-1px)}.s-btn.s-ghost{background:transparent;color:var(--s-ink);border-color:var(--s-line)}
.s-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
/* сетки и карточки */
.s-grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.s-grid-2{grid-template-columns:repeat(2,1fr)}.s-grid-3{grid-template-columns:repeat(3,1fr)}.s-grid-4{grid-template-columns:repeat(4,1fr)}
.s-card{background:var(--s-surface);border:1px solid var(--s-line);border-radius:var(--s-radius);padding:24px;box-shadow:var(--s-shadow)}
.s-card h3{margin-bottom:.35em}.s-badge{display:inline-block;padding:4px 10px;border-radius:99px;background:var(--s-soft);color:var(--s-ink2);font-size:13px;font-weight:500}
.s-price{font:600 32px var(--s-head);color:var(--s-ink)}.s-price small{font:400 15px var(--s-font);color:var(--s-mute)}
.s-list{padding-left:20px}.s-list li{margin:6px 0}
.s-quote{font:500 20px/1.5 var(--s-head);border-left:3px solid var(--s-accent);padding-left:18px}
/* цифры и дашборды */
.s-kpis{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.s-kpi{background:var(--s-surface);border:1px solid var(--s-line);border-radius:var(--s-radius);padding:18px 20px}
.s-kpi .s-k-label{font-size:13px;color:var(--s-mute)}.s-kpi .s-k-value{font:600 30px var(--s-head);margin-top:4px}.s-kpi .s-k-delta{font-size:13px;margin-top:2px}
.s-up{color:var(--s-ok)}.s-down{color:var(--s-err)}
.s-chart{background:var(--s-surface);border:1px solid var(--s-line);border-radius:var(--s-radius);padding:18px;min-height:280px;position:relative}
.s-table-wrap{width:100%;overflow-x:auto}
.s-table{width:100%;border-collapse:collapse;font-size:15px;background:var(--s-surface)}.s-table th,.s-table td{padding:12px 14px;border-bottom:1px solid var(--s-line);text-align:left;vertical-align:top}
.s-table th{font-size:13px;color:var(--s-mute);font-weight:600}.s-table td.s-num{text-align:right;white-space:nowrap}
/* форма заявки: <form data-shtab-form="zayavka"> - заявки приходят владельцу в Штаб */
.s-form{display:grid;gap:14px;max-width:560px}.s-form label{display:grid;gap:6px;font-size:14px;color:var(--s-ink2)}
.s-form input,.s-form textarea,.s-form select{width:100%;min-height:48px;padding:12px 14px;border-radius:12px;border:1px solid var(--s-line);background:var(--s-surface);color:var(--s-ink);font:400 16px var(--s-font)}
.s-form textarea{min-height:110px;resize:vertical}.s-form input:focus,.s-form textarea:focus{outline:none;border-color:var(--s-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--s-accent) 18%,transparent)}
.s-form .s-consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--s-mute)}.s-form .s-consent input{width:20px;min-height:20px;margin-top:2px}
.s-form-ok{padding:16px;border-radius:12px;background:color-mix(in srgb,var(--s-ok) 12%,transparent);color:var(--s-ok)}.s-form-err{color:var(--s-err);font-size:14px}
.s-hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
/* подвал */
.s-footer{padding:40px 0;border-top:1px solid var(--s-line);color:var(--s-mute);font-size:14px}.s-footer .s-wrap{display:flex;gap:16px;flex-wrap:wrap;justify-content:space-between}
@media (max-width:860px){.s-hero-split,.s-grid-2,.s-grid-3,.s-grid-4{grid-template-columns:1fr}.s-menu{gap:12px;font-size:15px}.s-card{padding:20px}}
