/* ============================================================
   public.css — публичные SSR-статьи (SEO). Светлая тема, mobile-first,
   читабельная типографика. Бренд #2dd4bf. Скоуп .article-body.
   ============================================================ */
:root{
  --brand:#2dd4bf;--brand-2:#14b8a6;--brand-ink:#062a26;
  --ink:#16181d;--ink-soft:#41454f;--ink-mut:#6b7280;
  --bg:#ffffff;--panel:#f6f8fa;--border:#e6e8ee;
  --ok:#1a7f37;--ok-bg:#eaf6ec;--warn:#b3631a;--warn-bg:#fdf2e7;--danger:#b42318;--danger-bg:#fdecec;
  --sans:-apple-system,system-ui,"Segoe UI",Roboto,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;}
body.public{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;}

/* header */
.site-head{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px 16px;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--border);}
.site-head .brand{font-weight:800;font-size:15px;color:var(--ink);text-decoration:none;letter-spacing:-.01em;}
.site-head .head-cta{font:700 13px var(--sans);background:var(--brand);color:var(--brand-ink);padding:9px 14px;border-radius:10px;text-decoration:none;white-space:nowrap;}

/* layout */
.article-wrap{max-width:720px;margin:0 auto;padding:20px 16px 64px;}
.article h1{font-size:1.85rem;line-height:1.2;font-weight:800;letter-spacing:-.02em;margin:8px 0 10px;}
.article-meta{color:var(--ink-mut);font-size:13.5px;display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--border);}

/* body typography */
.article-body{font-size:17px;}
.article-body h2{font-size:1.4rem;font-weight:800;letter-spacing:-.01em;margin:34px 0 12px;}
.article-body h3{font-size:1.15rem;font-weight:700;margin:24px 0 8px;}
.article-body p{margin:0 0 16px;}
.article-body a{color:var(--brand-2);}
.article-body ul,.article-body ol{margin:0 0 16px;padding-left:22px;}
.article-body li{margin:6px 0;}
.article-body img{max-width:100%;height:auto;border-radius:12px;}
.article-body strong{font-weight:700;}
.article-body blockquote{margin:16px 0;padding:10px 14px;background:var(--panel);border-left:3px solid var(--brand);border-radius:8px;color:var(--ink-soft);}
.article-body hr{border:none;border-top:1px solid var(--border);margin:28px 0;}
.article-body figure{margin:18px 0;}
.article-body figcaption{font-size:13px;color:var(--ink-mut);margin-top:6px;text-align:center;}

/* таблицы норм — ОБЯЗАТЕЛЬНО overflow-x на мобиле (узкие экраны) */
.article-body .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 18px;border:1px solid var(--border);border-radius:12px;}
.article-body table{border-collapse:collapse;width:100%;min-width:480px;font-size:14.5px;}
.article-body th{background:var(--brand);color:var(--brand-ink);font-weight:700;text-align:left;padding:11px 12px;white-space:nowrap;}
.article-body td{padding:10px 12px;border-top:1px solid var(--border);}
.article-body tbody tr:nth-child(even){background:var(--panel);}

/* ---- компоненты шорткодов ---- */
.btn-primary{display:inline-block;background:var(--brand);color:var(--brand-ink);font-weight:700;padding:13px 20px;border-radius:12px;text-decoration:none;border:none;cursor:pointer;}
.btn-primary:hover{background:var(--brand-2);}
.cta{margin:22px 0;}
.cta--inline{padding:16px;background:var(--panel);border:1px solid var(--border);border-radius:14px;text-align:center;}

.service-promo,.lead-capture{margin:24px 0;padding:18px;background:var(--panel);border:1px solid var(--border);border-radius:16px;}
.service-promo h3,.lead-capture h3{margin:0 0 8px;font-size:1.15rem;}
.service-promo ul{margin:10px 0 14px;padding-left:20px;}
.service-promo li{margin:6px 0;}
.service-promo .btn-primary,.lead-capture .btn-primary{margin-top:6px;}
.micro{font-size:12.5px;color:var(--ink-mut);margin:10px 0 0;}

/* reference scale */
.ref-scale{margin:20px 0;padding:16px;border:1px solid var(--border);border-radius:16px;background:#fff;}
.ref-scale .rs-title{font-weight:800;margin-bottom:10px;}
.ref-scale .rs-row{display:flex;align-items:center;gap:10px;margin:8px 0;flex-wrap:wrap;}
.ref-scale .rs-sex{flex:0 0 88px;font-size:13px;color:var(--ink-mut);font-weight:600;}
.ref-scale .rs-zones{display:flex;flex:1;min-width:220px;border-radius:8px;overflow:hidden;border:1px solid var(--border);font-size:12.5px;font-weight:600;}
.ref-scale .rs-zones>span{padding:7px 8px;text-align:center;flex:1;white-space:nowrap;}
.ref-scale .rs-lo{background:var(--danger-bg);color:var(--danger);}
.ref-scale .rs-ok{background:var(--ok-bg);color:var(--ok);flex:1.4;}
.ref-scale .rs-hi{background:var(--warn-bg);color:var(--warn);}
.ref-scale .rs-cta{display:inline-block;margin-top:10px;color:var(--brand-2);font-weight:700;text-decoration:none;}
.ref-scale .rs-disc{font-size:12px;color:var(--ink-mut);margin:8px 0 0;}
/* узкие экраны (<380px): метка пола на отдельную строку, шкала во всю ширину */
@media (max-width:380px){
  .ref-scale .rs-sex{flex:1 0 100%;}
  .ref-scale .rs-zones{min-width:0;font-size:11px;}
  .ref-scale .rs-zones>span{padding:6px 4px;}
}

/* writer-фолбэки (если компонент не отрендерился) */
.cta-inline,.cta-final{margin:22px 0;padding:16px;background:var(--panel);border:1px solid var(--border);border-radius:14px;text-align:center;}
.infographic{margin:18px 0;}

/* footer */
.article-foot{max-width:720px;margin:36px auto 0;padding:18px 16px 0;border-top:1px solid var(--border);}
.disc-full{font-size:13px;color:var(--ink-mut);line-height:1.55;}
.foot-links{font-size:13.5px;margin-top:10px;}
.foot-links a{color:var(--brand-2);text-decoration:none;}

/* ---- лендинг ---- */
.hero{max-width:760px;margin:0 auto;padding:48px 16px 28px;text-align:center;}
.hero .logo{font-size:52px;}
.hero h1{font-size:2rem;font-weight:800;letter-spacing:-.02em;margin:12px 0 10px;}
.hero p.sub{font-size:17px;color:var(--ink-soft);margin:0 auto 20px;max-width:560px;}
.hero .btn-primary{font-size:16px;padding:15px 26px;}
.values{max-width:760px;margin:8px auto 0;padding:0 16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;}
.value{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:16px;}
.value .ic{font-size:24px;}
.value h3{margin:8px 0 4px;font-size:15px;}
.value p{margin:0;font-size:13.5px;color:var(--ink-soft);}
.articles{max-width:760px;margin:36px auto 0;padding:0 16px;}
.articles h2{font-size:1.3rem;margin:0 0 14px;}
.art-card{display:block;padding:14px 16px;border:1px solid var(--border);border-radius:14px;margin-bottom:10px;text-decoration:none;color:var(--ink);}
.art-card:hover{border-color:var(--brand);}
.art-card b{font-size:15px;}
.art-card p{margin:4px 0 0;font-size:13px;color:var(--ink-mut);}
.land-foot{max-width:760px;margin:40px auto 0;padding:18px 16px 56px;border-top:1px solid var(--border);font-size:12.5px;color:var(--ink-mut);}

/* ---- секции лендинга ---- */
.section{max-width:880px;margin:0 auto;padding:34px 16px 0;}
.section>h2{font-size:1.5rem;font-weight:800;letter-spacing:-.01em;text-align:center;margin:0 0 18px;}
.center{text-align:center;}
.section .muted.center{max-width:620px;margin:0 auto;}

/* как работает */
.steps-land{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;}
.step-card{position:relative;background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:18px 16px;}
.step-card .sc-n{position:absolute;top:12px;right:14px;font:800 14px var(--sans);color:var(--brand-2);opacity:.5;}
.step-card .sc-ic{font-size:28px;}
.step-card h3{margin:8px 0 4px;font-size:15px;}
.step-card p{margin:0;font-size:13.5px;color:var(--ink-soft);}

/* тарифы */
.pricing .plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;align-items:start;}
.plan-card{position:relative;background:#fff;border:1px solid var(--border);border-radius:18px;padding:20px 18px;text-align:center;}
.plan-card.best{border-color:var(--brand);box-shadow:0 8px 24px rgba(45,212,191,.18);}
.plan-card .pc-tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--brand);color:var(--brand-ink);font:700 10px var(--sans);text-transform:uppercase;padding:4px 12px;border-radius:99px;}
.plan-card .pc-name{font-weight:700;font-size:15px;color:var(--ink-soft);}
.plan-card .pc-price{font:800 30px var(--sans);margin:6px 0 12px;}
.plan-card .pc-price small{font-size:14px;color:var(--ink-mut);font-weight:600;}
.plan-card .pc-note{font-size:12px;color:var(--ink-mut);margin:-8px 0 12px;}
.plan-card ul{list-style:none;padding:0;margin:0 0 16px;text-align:left;}
.plan-card li{font-size:13.5px;color:var(--ink-soft);padding:6px 0 6px 22px;position:relative;border-top:1px solid var(--border);}
.plan-card li:first-child{border-top:none;}
.plan-card li::before{content:"✓";position:absolute;left:0;color:var(--brand-2);font-weight:800;}
.plan-card .btn-primary{width:100%;}
.plan-card .btn-primary.sec{background:var(--panel);color:var(--ink);border:1px solid var(--border);}

/* какие анализы */
.covered-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;}
.cov-col{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:16px 18px;}
.cov-col h3{font-size:15px;margin:0 0 8px;}
.cov-col.cov-yes{border-color:var(--brand);}
.cov-col ul{margin:0;padding-left:20px;}
.cov-col li{font-size:14px;color:var(--ink-soft);margin:7px 0;line-height:1.5;}
.cov-col.cov-soon li{color:var(--ink-mut);}

/* faq */
.faq-land details{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:2px 16px;margin-bottom:10px;}
.faq-land summary{cursor:pointer;font-weight:700;font-size:15px;padding:14px 0;list-style:none;}
.faq-land summary::-webkit-details-marker{display:none;}
.faq-land summary::after{content:"+";float:right;color:var(--brand-2);font-weight:800;}
.faq-land details[open] summary::after{content:"–";}
.faq-land details p{margin:0 0 14px;font-size:14.5px;color:var(--ink-soft);line-height:1.55;}

/* hero компактный (страница тарифов) */
.hero.compact{padding:36px 16px 8px;}
.hero.compact h1{font-size:1.8rem;}

/* сравнительная таблица тарифов */
.compare-table{border-collapse:collapse;width:100%;min-width:520px;font-size:14px;}
.compare-table th{background:var(--brand);color:var(--brand-ink);font-weight:700;text-align:center;padding:12px 10px;}
.compare-table th:first-child{text-align:left;}
.compare-table td{padding:11px 10px;border-top:1px solid var(--border);text-align:center;color:var(--ink-soft);}
.compare-table td:first-child{text-align:left;font-weight:600;color:var(--ink);}
.compare-table tbody tr:nth-child(even){background:var(--panel);}

/* финальный cta */
.cta-band{text-align:center;background:var(--brand-soft);border-radius:20px;padding:34px 16px;margin-top:40px;}
.cta-band h2{margin-bottom:16px;}
.cta-band .btn-primary{font-size:16px;padding:15px 28px;}
