/* Первая страница для гостя и вход. Палитра и шрифты — из app.css. */

:root{--inlaw:#F3EBDA; --inlaw-line:#C9B58C}
@media (prefers-color-scheme: dark){:root{--inlaw:#2C271B; --inlaw-line:#7A6A45}}

html:has(.l-landing){scroll-behavior:smooth;scroll-padding-top:76px}

.lp-in{max-width:1180px;margin:0 auto;padding:0 20px}
.lp-narrow{max-width:780px}
.btn-big{font-size:15.5px;padding:12px 20px;border-radius:9px}

/* ---------- шапка ---------- */
.lp-top{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.lp-top-in{display:flex;align-items:center;gap:10px 22px;padding-top:11px;padding-bottom:11px}
.lp-top .brand{font-size:23px}
.lp-nav{display:flex;gap:2px;margin-left:10px}
.lp-nav a{font-size:14.5px;font-weight:500;color:var(--muted);text-decoration:none;padding:7px 11px;border-radius:6px;white-space:nowrap}
.lp-nav a:hover{color:var(--ink);background:var(--surface2)}
.lp-cta{display:flex;gap:8px;margin-left:auto}
.brand-tag{display:inline-block;margin-left:10px;padding-left:10px;border-left:1px solid var(--line-strong);font-family:var(--body);font-size:12.5px;font-weight:500;color:var(--muted);vertical-align:2px}

/* Меню разделов на телефоне */
.lp-burger{display:none;position:relative}
.lp-burger summary{list-style:none;cursor:pointer;width:40px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:7px;background:var(--surface)}
.lp-burger summary::-webkit-details-marker{display:none}
.lp-burger summary span,.lp-burger summary span::before,.lp-burger summary span::after{content:"";display:block;width:18px;height:2px;border-radius:1px;background:var(--ink)}
.lp-burger summary span{position:relative}
.lp-burger summary span::before{position:absolute;top:-6px}
.lp-burger summary span::after{position:absolute;top:6px}
.lp-burger[open] summary{background:var(--surface2)}
.lp-burger nav{position:absolute;right:0;top:46px;z-index:40;min-width:240px;display:grid;gap:2px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:8px}
.lp-burger nav a{font-size:15.5px;font-weight:500;color:var(--ink);text-decoration:none;padding:11px 12px;border-radius:7px}
.lp-burger nav a:not(.btn):hover,.lp-burger nav a.on{background:var(--surface2)}
.lp-burger nav .btn{margin-top:6px;color:var(--bg)}

/* Кнопка регистрации, закреплённая внизу экрана телефона */
.lp-sticky{display:none}

/* ---------- первый экран ---------- */
.lp-hero{padding:64px 0 56px;background:
  radial-gradient(900px 420px at 85% 0%,color-mix(in srgb,var(--nagly) 11%,transparent),transparent 70%),
  radial-gradient(700px 380px at 0% 100%,color-mix(in srgb,var(--khor) 10%,transparent),transparent 70%)}
.lp-hero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:48px;align-items:center}
.lp-hero h1{font-size:clamp(34px,4.6vw,56px);line-height:1.04;letter-spacing:-.01em}
.lp-lede{font-size:18px;line-height:1.55;color:var(--muted);margin:18px 0 0;max-width:54ch}
.lp-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.lp-note{font-size:13.5px;color:var(--muted);margin:14px 0 0}

.lp-tree{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:18px 18px 12px}
.lp-tree svg{display:block;width:100%;height:auto}
.t-lines path{fill:none;stroke:var(--line-strong);stroke-width:1.5}
.t-lines-dir path{stroke:var(--nagly);stroke-width:2.2}
.t-node rect{fill:var(--surface);stroke:var(--line);stroke-width:1.2}
.t-node.t-dir rect{fill:color-mix(in srgb,var(--nagly) 11%,var(--surface));stroke:var(--nagly)}
.t-node.t-inlaw rect{fill:var(--inlaw);stroke:var(--inlaw-line)}
.t-node.t-me rect{stroke-width:2.6}
.t-sur{font-family:var(--body);font-size:8.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;fill:var(--muted)}
.t-dir .t-sur{fill:var(--nagly)}
.t-nm{font-family:var(--display);font-size:12.6px;font-weight:700;fill:var(--ink)}
.t-dt{font-family:var(--mono);font-size:9.5px;fill:var(--muted)}
.lp-legend{display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:center;margin-top:10px;font-size:12.5px;color:var(--muted)}
.lp-legend span{display:inline-flex;align-items:center;gap:6px}
.lg{width:14px;height:10px;border-radius:3px;border:1px solid var(--line-strong);background:var(--surface)}
.lg-dir{background:color-mix(in srgb,var(--nagly) 16%,var(--surface));border-color:var(--nagly)}
.lg-inlaw{background:var(--inlaw);border-color:var(--inlaw-line)}

/* Та же семья крупными карточками — вместо схемы на узком экране */
.lp-tree-m{display:none}
.tm-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:10px;position:relative;padding-bottom:22px}
.tm-row:last-child{padding-bottom:0}
.tm-row:not(:last-child)::after{content:"";position:absolute;left:50%;bottom:3px;width:2px;height:16px;background:var(--nagly);border-radius:1px}
.tm-card{background:color-mix(in srgb,var(--nagly) 9%,var(--surface));border:1.5px solid var(--nagly);border-radius:10px;padding:10px 12px;display:grid;gap:1px;min-width:0}
.tm-card b{font-family:var(--display);font-size:17px;line-height:1.15}
.tm-kin{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--nagly)}
.tm-dt{font-family:var(--mono);font-size:12px;color:var(--muted)}
.tm-me{border-width:2.6px;text-align:center}
.tm-me b{font-size:19px}

/* ---------- кто делает ---------- */
.lp-maker{display:grid;grid-template-columns:200px minmax(0,1fr);gap:40px;align-items:start;margin-top:34px}
.lp-maker-who{margin:0;display:grid;gap:12px;justify-items:center;text-align:center}
.lp-maker-who img,.lp-maker-ava{width:160px;height:160px;border-radius:50%;object-fit:cover;border:1px solid var(--line)}
.lp-maker-ava{display:grid;place-items:center;background:color-mix(in srgb,var(--nagly) 14%,var(--surface));color:var(--nagly);font-family:var(--display);font-weight:700;font-size:52px}
.lp-maker-who figcaption{display:grid;gap:2px}
.lp-maker-who b{font-family:var(--display);font-size:20px}
.lp-maker-who span{font-size:13.5px;color:var(--muted)}
.lp-maker-text{max-width:66ch}
.lp-maker-text p{font-size:17px;line-height:1.6;margin:0 0 14px}
.lp-maker-text .lp-ticks{margin:20px 0 0;font-size:16px}
.lp-maker-mail{margin-top:20px!important;font-size:15px!important;color:var(--muted)}
.lp-features p a{white-space:nowrap}

/* ---------- страницы о постере и GEDCOM, снимки экрана ---------- */
.ft-hero{padding:44px 0 52px}
.ft-hero h1{font-size:clamp(32px,4.4vw,52px);line-height:1.05;margin-top:6px}
.ft-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:34px}
.ft-examples figure{margin:0}
.ft-examples img{display:block;width:100%;height:auto;border-radius:8px;border:1px solid var(--line);box-shadow:var(--shadow)}
.ft-examples figcaption{font-size:13.5px;color:var(--muted);margin-top:9px;text-align:center}
.ft-list{margin:18px 0 0;padding-left:22px;display:grid;gap:11px;font-size:16px}
.ft-list li::marker{font-family:var(--display);font-weight:700;color:var(--nagly)}
.ft-shot{margin:0}
.ft-shot img,.shot img{display:block;width:100%;height:auto}
.shot{margin:0}
.lp-steps.ft-steps4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ft-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;margin-top:30px}
.ft-two h3{font-size:22px;margin-bottom:12px}
.ft-two .lp-ticks{font-size:16px}
.ft-no{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:16px;color:var(--muted)}
.ft-no li{position:relative;padding-left:24px}
.ft-no li::before{content:"";position:absolute;left:3px;top:.72em;width:11px;height:2px;background:var(--line-strong)}
.ft-p{font-size:16px;color:var(--muted);margin:0}
.lp-demo h2{font-size:clamp(25px,3vw,32px)}

/* ---------- разделы ---------- */
.lp-sec{padding:72px 0}
.lp-alt{background:var(--surface2)}
.lp-sec h2{font-size:clamp(27px,3.4vw,38px);max-width:24ch}
.lp-sub{font-size:17px;color:var(--muted);max-width:68ch;margin:14px 0 0}

.lp-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:36px}
.lp-features article{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:22px 22px 18px}
.lp-features h3{font-size:21px;margin:12px 0 8px}
.lp-features p{color:var(--muted);margin:0}
.f-ico{width:30px;height:30px;fill:none;stroke:var(--nagly);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* ---------- примеры экранов ---------- */
.lp-demo{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1fr);gap:48px;align-items:center;margin-top:56px}
.lp-demo-rev .lp-demo-text{order:2}
.lp-demo-text h3{font-size:27px;margin-bottom:10px}
.lp-demo-text p{color:var(--muted);font-size:16px}
.lp-ticks{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:7px}
.lp-ticks li{position:relative;padding-left:24px}
.lp-ticks li::before{content:"";position:absolute;left:3px;top:.42em;width:10px;height:6px;border-left:2px solid var(--khor);border-bottom:2px solid var(--khor);transform:rotate(-45deg)}

.mock{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden;font-size:13.5px}
.mock-bar{display:flex;align-items:center;gap:6px;padding:9px 14px;background:var(--bg);border-bottom:1px solid var(--line);color:var(--muted);font-size:12.5px}
.mock-bar i{width:9px;height:9px;border-radius:50%;background:var(--line)}
.mock-bar span{margin-left:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mock-body{padding:20px}

.mock-person{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px}
.mp-head{display:flex;gap:14px;align-items:center}
.mp-ava{width:62px;height:62px;border-radius:50%;flex:none;display:grid;place-items:center;background:color-mix(in srgb,var(--nagly) 14%,var(--surface));color:var(--nagly);font-family:var(--display);font-weight:700;font-size:22px}
.mp-sur{font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--nagly)}
.mp-name{font-family:var(--display);font-weight:700;font-size:23px;line-height:1.1}
.mp-dates{font-family:var(--mono);font-size:11.5px;color:var(--muted);margin-top:3px}
.mp-kin{margin-top:14px;display:inline-block;background:var(--ok-bg);color:var(--ok-ink);border-radius:999px;padding:3px 12px;font-size:13px}
.mp-facts{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;margin:14px 0 0}
.mp-facts dt{color:var(--muted)}
.mp-facts dd{margin:0}
.mp-photos{display:flex;gap:8px;margin-top:16px}
.mp-photos i{width:58px;height:58px;border-radius:7px;background:linear-gradient(135deg,color-mix(in srgb,var(--voron) 30%,var(--surface2)),var(--surface2))}
.mp-photos i.doc{background:repeating-linear-gradient(180deg,var(--warn-bg) 0 7px,color-mix(in srgb,var(--voron) 22%,var(--warn-bg)) 7px 8px);border:1px solid var(--line)}
.mp-side{display:grid;gap:6px;align-content:start}
.mp-lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:6px}
.mp-lbl:first-child{margin-top:0}
.mp-pc{border:1px solid var(--line);border-left:3px solid var(--nagly);border-radius:7px;padding:6px 10px;display:grid}
.mp-pc b{font-family:var(--display);font-size:15px}
.mp-pc span{font-family:var(--mono);font-size:10.5px;color:var(--muted)}
.mp-add{border:1px dashed var(--line-strong);border-radius:7px;padding:6px 10px;color:var(--muted);font-size:12.5px}

.mock-review{display:grid;gap:10px}
.mr-item{border:1px solid var(--line);border-radius:10px;padding:12px 14px;display:grid;gap:5px}
.mr-who{font-size:12px;color:var(--muted)}
.mr-what{font-size:14.5px}
.mr-what s{color:var(--muted)}
.mr-btns{display:flex;gap:8px;margin-top:4px}
.mr-btns span{font-size:12.5px;font-weight:500;border-radius:6px;padding:4px 12px;border:1px solid var(--line)}
.mr-btns .mr-yes{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.mr-btns .mr-ok{background:var(--ok-bg);color:var(--ok-ink);border-color:transparent}
.mr-done{opacity:.72}

.mock-docs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.mock-docs figure{margin:0}
.mock-docs figcaption{font-size:12px;color:var(--muted);margin-top:7px;text-align:center}
.paper,.photo{aspect-ratio:3/4;border-radius:6px;border:1px solid var(--line);overflow:hidden}
.paper{background:#F6EEDB;padding:12px 10px;display:grid;gap:7px;align-content:start;color:#5A4A2B}
.paper b{font-family:var(--display);font-size:11px;text-align:center;border-bottom:1px solid #C9B58C;padding-bottom:5px}
.paper i{height:2px;background:#B9A57B;border-radius:1px;opacity:.75}
.paper i.short{width:55%}
.paper.letter{background:#EFE7D6;transform:rotate(-1.2deg)}
.paper.letter i{background:#6D7FA8;opacity:.6;height:1.5px}
.photo{position:relative;background:linear-gradient(180deg,#CFCBC2,#9E988C);box-shadow:inset 0 0 0 6px #F4F1EA}
.photo span{position:absolute;bottom:0;width:38%;height:62%;background:#5E594F;border-radius:46% 46% 0 0;opacity:.8}
.photo span:first-child{left:14%}
.photo span:last-child{right:14%;height:54%;background:#F1EEE6;opacity:.92}

/* ---------- шаги ---------- */
.lp-steps{list-style:none;counter-reset:s;margin:34px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.lp-steps li{counter-increment:s;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:20px 22px;color:var(--muted)}
.lp-steps li::before{content:counter(s);display:block;font-family:var(--display);font-weight:700;font-size:38px;line-height:1;color:var(--nagly);margin-bottom:10px}
.lp-steps b{color:var(--ink)}

/* ---------- тарифы ---------- */
.lp-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:36px;align-items:stretch}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:26px 24px;display:flex;flex-direction:column}
.plan-main{border:2px solid var(--nagly);box-shadow:var(--shadow)}
.plan h3{font-size:24px;display:flex;align-items:center;gap:10px}
.soon{font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;background:var(--warn-bg);color:var(--warn-ink);border-radius:999px;padding:2px 9px}
.plan-price{font-family:var(--display);font-weight:700;font-size:44px;line-height:1;margin:14px 0 4px;font-variant-numeric:lining-nums}
.plan-later{font-family:var(--body);font-weight:500;font-size:15px;color:var(--muted);padding:15px 0 14px}
.plan ul{list-style:none;margin:16px 0 22px;padding:0;display:grid;gap:8px;flex:1}
.plan li{position:relative;padding-left:22px}
.plan li::before{content:"";position:absolute;left:2px;top:.42em;width:10px;height:6px;border-left:2px solid var(--khor);border-bottom:2px solid var(--khor);transform:rotate(-45deg)}

/* ---------- вопросы ---------- */
#faq details{border-bottom:1px solid var(--line);padding:16px 0}
#faq details:first-of-type{margin-top:26px;border-top:1px solid var(--line)}
#faq summary{font-family:var(--display);font-weight:700;font-size:20px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px}
#faq summary::-webkit-details-marker{display:none}
#faq summary::after{content:"+";font-family:var(--body);font-weight:400;color:var(--muted)}
#faq details[open] summary::after{content:"–"}
#faq details p{color:var(--muted);margin:10px 0 0;max-width:66ch;font-size:16px}

/* ---------- призыв и подвал ---------- */
.lp-final{background:var(--ink);color:var(--bg);padding:68px 0;text-align:center}
.lp-final h2{font-size:clamp(27px,3.6vw,40px)}
.lp-final p{opacity:.78;font-size:17px;margin:12px 0 26px}
.lp-final-btn{background:var(--bg);color:var(--ink);border-color:var(--bg)}
.lp-foot{padding:26px 0 34px;border-top:1px solid var(--line)}
.lp-foot-in{display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px}
.lp-foot nav{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px}
.lp-foot nav a{color:var(--muted);text-decoration:none}
.lp-foot nav a:hover{color:var(--ink)}
.lp-foot .muted{margin-left:auto}
.lp-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 26px;margin-top:16px;font-size:13px;color:var(--muted);font-variant-numeric:lining-nums}
.lp-legal a{color:var(--muted)}
.lp-legal nav{flex-wrap:wrap;gap:6px 18px;font-size:13px}
.lp-legal nav a{text-decoration:underline}

/* ---------- политика и согласие ---------- */
.legal .prose{margin-top:26px;font-size:16.5px}
.legal .prose h2{scroll-margin-top:16px}
.legal .prose ol{margin:0 0 16px;padding-left:24px;display:grid;gap:9px}
.legal-table{overflow-x:auto;margin:0 0 18px}
.legal-table table{width:100%;min-width:520px;border-collapse:collapse;font-size:15px;line-height:1.5}
.legal-table th,.legal-table td{border:1px solid var(--line);padding:9px 12px;text-align:left;vertical-align:top}
.legal-table th{background:var(--surface2);font-weight:600}
.legal-owner{margin:34px 0 0;padding-top:16px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
.consent{font-size:13.5px!important;font-weight:400!important;line-height:1.45}
.consent a{font-weight:600}

/* ---------- вход и регистрация ---------- */
.auth{max-width:440px;margin:5vh auto 0;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:30px 32px 26px}
.auth-brand{display:inline-block;font-size:24px;margin-bottom:18px}
.auth h1{font-size:30px;margin-bottom:6px}
.auth .form{margin-top:20px}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--surface2);border-radius:9px;padding:4px;margin-bottom:22px}
.auth-tabs a{text-align:center;font-weight:500;font-size:14.5px;color:var(--muted);text-decoration:none;padding:8px 10px;border-radius:6px}
.auth-tabs a.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.auth .field{display:grid;gap:6px}
.auth-alt{margin:18px 0 0;font-size:14.5px;color:var(--muted)}
.auth-soon{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- блог ---------- */
.lp-nav a.on{color:var(--ink);background:var(--surface2)}
.blog-list,.post-page{padding-top:48px;padding-bottom:64px}
.blog-list h1,.post-page h1{font-size:clamp(30px,4.4vw,46px);line-height:1.08}
.blog-list,.post-page,.lp-features h3{font-variant-numeric:lining-nums}
.blog-item{border-top:1px solid var(--line);padding:26px 0 22px}
.blog-item:first-of-type{margin-top:34px}
.blog-item h2{font-size:clamp(22px,2.8vw,28px)}
.blog-item h2 a{color:var(--ink);text-decoration:none}
.blog-item h2 a:hover{color:var(--nagly)}
.blog-item p{color:var(--muted);font-size:16.5px;margin:8px 0 10px}
.post-meta{font-family:var(--mono);font-size:12.5px;color:var(--muted);margin:10px 0 0!important}
.crumbs{font-size:13.5px;color:var(--muted);margin-bottom:14px}
.crumbs a{color:var(--muted)}
.post-lead{font-size:19px;line-height:1.55;color:var(--muted);margin:20px 0 6px}
.prose{font-size:17.5px;line-height:1.68}
.prose h2{font-size:clamp(23px,2.8vw,29px);margin:38px 0 12px}
.prose h3{font-size:20px;margin:24px 0 8px}
.prose p{margin:0 0 14px}
.prose ul,.prose ol{margin:0 0 16px;padding-left:24px;display:grid;gap:7px}
.prose a{font-weight:500}
.post-author{font-size:14.5px;color:var(--muted);margin:6px 0 0}
.post-author a{color:var(--ink);font-weight:600;text-decoration:none}
.post-author a:hover{text-decoration:underline}
.post-toc{margin:26px 0 4px;padding:16px 20px;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.post-toc b{font-family:var(--mono);font-weight:500;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.post-toc ol{margin:10px 0 0;padding-left:22px;display:grid;gap:6px;font-size:16px}
.prose h2{scroll-margin-top:84px}
.prose table{width:100%;border-collapse:collapse;font-size:15.5px;line-height:1.5;margin:0 0 18px}
.prose th,.prose td{border:1px solid var(--line);padding:9px 12px;text-align:left;vertical-align:top}
.prose th{background:var(--surface2);font-weight:600}
.prose .tbl{overflow-x:auto;margin:0 0 18px}
.prose .tbl table{min-width:560px;margin:0}
.prose .note{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--nagly);border-radius:8px;padding:12px 16px;font-size:16px}
.prose .check{list-style:none;padding-left:0}
.prose .check li{position:relative;padding-left:30px}
.prose .check li::before{content:"";position:absolute;left:2px;top:.3em;width:15px;height:15px;border:1.5px solid var(--line-strong);border-radius:3px}
@media print{.lp-top,.lp-foot,.post-cta,.post-more,.post-toc,.crumbs,.lp-sticky,.lp-burger{display:none!important}.post-page{padding-top:0}.prose{font-size:12pt}}
.post-cta{margin:44px 0 0;background:var(--ink);color:var(--bg);border-radius:16px;padding:30px 28px;text-align:center}
.post-cta h2{font-size:clamp(22px,3vw,30px)}
.post-cta p{opacity:.8;margin:10px 0 20px;font-size:16.5px}
.post-cta .btn{background:var(--bg);color:var(--ink);border-color:var(--bg)}
.post-more{margin-top:40px}
.post-more h2{font-size:22px;margin-bottom:10px}
.post-more ul{margin:0;padding-left:20px;display:grid;gap:8px;font-size:17px}

/* ---------- узкие экраны ---------- */
@media (max-width:980px){
  .lp-nav{display:none}
  .lp-burger{display:block}
  .lp-cta{gap:6px}
  .lp-maker{grid-template-columns:minmax(0,1fr);gap:22px}
  .lp-maker-who{grid-template-columns:auto minmax(0,1fr);justify-items:start;text-align:left;align-items:center;gap:16px}
  .lp-maker-who img,.lp-maker-ava{width:96px;height:96px;font-size:32px}
  .lp-hero{padding:40px 0 44px}
  .lp-hero-in,.lp-demo{grid-template-columns:minmax(0,1fr);gap:28px}
  .lp-demo-rev .lp-demo-text{order:0}
  .lp-features,.lp-steps,.lp-steps.ft-steps4,.lp-plans,.ft-examples,.ft-two{grid-template-columns:minmax(0,1fr)}
  .lp-sec{padding:52px 0}
  .lp-foot .muted{margin-left:0}
}
@media (max-width:760px){
  .brand-tag{display:none}
  /* Закреплённая кнопка: показывается после первого экрана и прячется у подвала (app.js) */
  .lp-sticky:not([hidden]){display:block;position:fixed;left:0;right:0;bottom:0;z-index:35;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);border-top:1px solid var(--line)}
  .lp-sticky .btn{display:flex;width:100%}
}
@media (max-width:600px){
  .lp-tree{display:none}
  .lp-tree-m{display:block}
}
@media (max-width:560px){
  .lp-in{padding:0 16px}
  .lp-top .brand{font-size:20px}
  .lp-cta .btn{padding:7px 10px;font-size:13px}
  .lp-cta .btn-primary{display:none}
  .lp-actions .btn{flex:1 1 100%}
  .mock-person{grid-template-columns:minmax(0,1fr)}
  .mock-body{padding:14px}
  .auth{margin-top:2vh;padding:22px 18px 20px;border-radius:12px}
  .auth .row2{grid-template-columns:minmax(0,1fr)}
}

/* Шаблоны семейного древа (/shablon-semejnogo-dreva) */
.tpl-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:30px}
.tpl-card{background:var(--surface,#fff);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column}
.tpl-card h3{font-size:19px;margin:14px 0 6px}
.tpl-card p{font-size:14.5px;color:var(--muted);margin:0 0 14px;flex:1}
.tpl-prev{display:flex;align-items:center;justify-content:center;background:var(--bg);border-radius:8px;height:250px;overflow:hidden}
.tpl-prev img{display:block;max-width:100%;max-height:236px;width:auto;height:auto;border:1px solid var(--line);box-shadow:var(--shadow)}
.tpl-dl{display:flex;gap:8px;flex-wrap:wrap}
.tpl-xlsx{justify-content:center}
@media (max-width:900px){.tpl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.tpl-grid{grid-template-columns:1fr}.tpl-prev{height:220px}}