/* Лендинг /svadebnyy-planer/. Токены и кнопки — planer.css. */
.eyebrow { text-transform: uppercase; letter-spacing: .14em; font: 700 12px/1.3 var(--sans); color: var(--gold); margin: 0 0 10px; }
.sub { color: var(--muted); max-width: 60ch; margin: -4px 0 26px; }
.lp-top { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 16px; padding: 10px max(16px, calc((100vw - 1180px) / 2)); background: color-mix(in srgb, var(--bg) 90%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.lp-logo { display: flex; flex-direction: column; line-height: 1.05; text-decoration: none; color: var(--ink); }
.lp-logo b { font: 700 13px/1 var(--sans); letter-spacing: .16em; }
.lp-logo span { font: italic 600 17px/1.1 var(--serif); color: var(--wine); }
.lp-top nav { display: none; gap: 22px; margin-left: auto; }
.lp-top nav a { color: var(--ink2); text-decoration: none; font-weight: 600; font-size: 14.5px; }
.lp-top nav a:hover { color: var(--wine); }
.lp-top > .btn { margin-left: auto; }
@media (min-width: 900px) { .lp-top nav { display: flex; } .lp-top > .btn { margin-left: 10px; } }
main { overflow-x: hidden; }
.sec { max-width: 1180px; margin: 0 auto; padding: 64px 16px; }
.sec > h2 { max-width: 22ch; }

/* Герой */
.hero { max-width: 1180px; margin: 0 auto; padding: 40px 16px 48px; display: grid; gap: 40px; align-items: center; }
.hero h1 { font-size: clamp(40px, 7.4vw, 72px); margin: 0 0 18px; }
.lead { font-size: clamp(17px, 2.2vw, 20px); color: var(--ink2); max-width: 42ch; }
.cta { display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0 14px; }
.hero-v { position: relative; min-height: 460px; display: grid; place-items: center; border-radius: 28px; background: radial-gradient(80% 70% at 60% 30%, var(--wine-soft), transparent 70%), radial-gradient(60% 60% at 20% 90%, var(--gold-soft), transparent 70%); }
.hero-v::before { content: ''; position: absolute; inset: 18px; border: 1px solid var(--gold-soft); border-radius: 22px; }
.hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 28px; }
.phone { position: relative; z-index: 1; width: 250px; padding: 16px 14px 12px; border-radius: 34px; background: var(--paper); border: 1px solid var(--line2); box-shadow: var(--shadow-lg); }
.ph-top { text-align: center; } .ph-top b { display: block; font: 600 22px var(--serif); } .ph-top span { font-size: 12px; color: var(--muted); }
.ph-ring { position: relative; width: 104px; margin: 12px auto 4px; }
.ph-ring svg { display: block; } .r0 { fill: none; stroke: var(--line); stroke-width: 8; } .r1 { fill: none; stroke: var(--wine); stroke-width: 8; stroke-linecap: round; }
.ph-ring span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 1px; font: 600 18px var(--serif); color: var(--muted); } .ph-ring b { font-size: 32px; color: var(--ink); }
.ph-h { text-align: center; font-weight: 700; font-size: 13px; margin: 0 0 8px; }
.ph-l { list-style: none; padding: 0; margin: 0; font-size: 12.5px; display: grid; gap: 6px; }
.ph-l li { padding-left: 22px; position: relative; } .ph-l li::before { content: ''; position: absolute; left: 0; top: 2px; width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid var(--line2); }
.ph-l li.ok::before { background: var(--ok); border-color: var(--ok); } .ph-l li.ok { color: var(--muted); } .ph-l em { font-style: normal; color: var(--muted); }
.ph-nav { display: flex; justify-content: space-around; margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--line); } .ph-nav i { width: 18px; height: 18px; border-radius: 6px; border: 1.5px solid var(--line2); } .ph-nav i.on { border-color: var(--wine); background: var(--wine-soft); }
.note { position: absolute; z-index: 2; padding: 10px 14px; border-radius: 14px; background: var(--paper); box-shadow: var(--shadow); font-size: 13px; border: 1px solid var(--line); }
.n1 { top: 44px; left: 12px; } .n2 { bottom: 40px; right: 12px; color: var(--wine); }
@media (min-width: 900px) { .hero { grid-template-columns: 1.05fr 1fr; padding-top: 70px; } .hero-v { min-height: 560px; } .n1 { left: -10px; } .n2 { right: -10px; } }

/* Боль → решение */
.pain-g { display: grid; gap: 16px; }
.pain-c { border-radius: var(--r); padding: 26px 24px; border: 1px solid var(--line); }
.pain-c ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.pain-c li { padding-left: 28px; position: relative; }
.pain-c.bad { background: var(--bg2); } .pain-c.bad li::before { content: '✕'; position: absolute; left: 4px; color: var(--muted); }
.pain-c.good { background: var(--paper); border-color: var(--gold-soft); box-shadow: var(--shadow); } .pain-c.good li::before { content: '✓'; position: absolute; left: 4px; color: var(--ok); font-weight: 700; }
@media (min-width: 800px) { .pain-g { grid-template-columns: 1fr 1fr; } }

/* Разделы с мини-макетами */
.scs { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.sc { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; }
.sc h3 { font-size: 23px; margin: 14px 0 6px; } .sc p { font-size: 14.5px; color: var(--ink2); margin: 0; }
.mm { height: 96px; border-radius: 12px; background: var(--bg2); padding: 12px; display: grid; gap: 7px; align-content: center; overflow: hidden; }
.mm b { display: block; height: 8px; border-radius: 4px; background: var(--line2); } .mm b.s { width: 60%; }
.mm-cl { grid-template-columns: 14px 1fr; align-items: center; } .mm-cl i { width: 14px; height: 14px; border-radius: 4px; border: 1.5px solid var(--line2); } .mm-cl i.on { background: var(--wine); border-color: var(--wine); }
.mm-tl { grid-template-columns: 44px 1fr; align-items: center; gap: 5px 8px; } .mm-tl span { font: 600 13px var(--serif); color: var(--wine); } .mm-tl b { height: 10px; background: linear-gradient(90deg, var(--gold-soft), var(--wine-soft)); }
.mm-gs { grid-template-columns: repeat(3, 1fr); } .mm-gs em { font: normal 600 24px var(--serif); text-align: center; color: var(--ink); } .mm-gs em.ok { color: var(--ok); } .mm-gs em.no { color: var(--bad); } .mm-gs b { grid-column: 1 / -1; }
.mm-st { grid-template-columns: repeat(3, 1fr); place-items: center; } .mm-st span { position: relative; width: 52px; height: 52px; border-radius: 50%; border: 1.5px solid var(--gold); }
.mm-st i { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: var(--wine); left: calc(50% - 4.5px); top: calc(50% - 4.5px); }
.mm-st i:nth-child(1) { transform: rotate(0) translateY(-30px); } .mm-st i:nth-child(2) { transform: rotate(60deg) translateY(-30px); } .mm-st i:nth-child(3) { transform: rotate(120deg) translateY(-30px); } .mm-st i:nth-child(4) { transform: rotate(180deg) translateY(-30px); } .mm-st i:nth-child(5) { transform: rotate(240deg) translateY(-30px); opacity: .3; } .mm-st i:nth-child(6) { transform: rotate(300deg) translateY(-30px); opacity: .3; }
.mm-pp { grid-template-columns: 54px 1fr auto; grid-template-rows: auto auto; } .mm-pp span { grid-row: 1 / 3; width: 54px; height: 54px; border-radius: 50%; background: var(--gold-soft); } .mm-pp em { grid-row: 1 / 3; font-style: normal; padding: 8px; border-radius: 10px; background: var(--wine-soft); }
.mm-to { grid-template-columns: 1fr auto; align-items: center; } .mm-to i { font: 600 12px var(--sans); font-style: normal; color: var(--muted); }
.mm-mu { grid-template-columns: 40px 1fr; align-items: center; } .mm-mu span { width: 40px; height: 40px; border-radius: 50%; background: var(--wine); } .mm-mu div { position: relative; height: 26px; border-radius: 6px; background: repeating-linear-gradient(90deg, var(--line2) 0 3px, transparent 3px 6px); } .mm-mu i { position: absolute; top: -4px; bottom: -4px; border: 2px solid var(--wine); border-radius: 6px; background: rgba(122, 41, 70, .12); }
.mm-ph { grid-template-columns: repeat(3, 1fr); } .mm-ph i { height: 32px; border-radius: 6px; background: linear-gradient(135deg, var(--gold-soft), var(--wine-soft)); }
.mm-hi b:nth-child(odd) { width: 90%; } .mm-an { grid-template-columns: 60px 1fr; align-items: center; } .mm-an span { grid-row: 1 / 3; width: 60px; height: 60px; background: repeating-conic-gradient(var(--ink) 0 25%, var(--paper) 0 50%) 0 0 / 12px 12px; border-radius: 6px; opacity: .8; }

/* Шаги */
.steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; counter-reset: s; }
.steps li { counter-increment: s; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); padding: 22px 22px 20px 72px; position: relative; }
.steps li::before { content: counter(s); position: absolute; left: 20px; top: 16px; font: 600 40px/1 var(--serif); color: var(--gold); }
.steps b { font-size: 17px; } .steps p { margin: 6px 0 0; color: var(--ink2); }
@media (min-width: 800px) { .steps { grid-template-columns: repeat(3, 1fr); } }

/* Ведущим */
.split { display: grid; gap: 30px; align-items: center; }
.split-v { position: relative; min-height: 300px; border-radius: 24px; background: linear-gradient(135deg, var(--wine2), #2b1020); display: grid; place-items: center; overflow: hidden; padding: 24px; }
.split-v img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.host-card { position: relative; width: min(340px, 100%); background: var(--paper); border-radius: 18px; padding: 18px; box-shadow: var(--shadow-lg); }
.hc { display: grid; grid-template-columns: 1fr auto; gap: 0 10px; padding: 10px 0; border-top: 1px solid var(--line); } .hc b { font: 600 18px var(--serif); } .hc span { font-size: 12.5px; color: var(--muted); grid-row: 2; } .hc em { grid-row: 1 / 3; align-self: center; font-style: normal; font-weight: 700; color: var(--warn); } .hc em.ok { color: var(--ok); }
.ticks { list-style: none; padding: 0; margin: 0 0 22px; display: grid; gap: 8px; } .ticks li { padding-left: 26px; position: relative; } .ticks li::before { content: '✓'; position: absolute; left: 2px; color: var(--ok); font-weight: 700; }
@media (min-width: 900px) { .split { grid-template-columns: 1.1fr 1fr; } }

/* Цена */
.price-c { max-width: 640px; margin: 0 auto; text-align: center; background: var(--paper); border: 1px solid var(--gold-soft); border-radius: 28px; padding: 40px 24px; box-shadow: var(--shadow); }
.price-c h2 { max-width: none; } .price-c .p { color: var(--wine); font-size: 1.3em; } .price-c .sub { margin: 0 auto 20px; }
.price-c .ticks { text-align: left; max-width: 420px; margin: 0 auto 26px; }

/* FAQ */
.faq { display: grid; gap: 10px; max-width: 860px; }
.faq details { background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 0 18px; }
.faq summary { cursor: pointer; list-style: none; padding: 16px 30px 16px 0; font-weight: 700; position: relative; }
.faq summary::-webkit-details-marker { display: none; } .faq summary::after { content: '+'; position: absolute; right: 0; top: 12px; font: 400 26px var(--serif); color: var(--wine); } .faq details[open] summary::after { content: '−'; }
.faq p { margin: 0 0 16px; color: var(--ink2); }

/* Платформа и Руслан */
.duo { display: grid; gap: 16px; } @media (min-width: 800px) { .duo { grid-template-columns: 1fr 1fr; } }
.duo-c { display: block; text-decoration: none; color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); padding: 24px; transition: border-color .15s; }
.duo-c:hover { border-color: var(--wine); } .duo-c p { color: var(--ink2); } .lnk { color: var(--wine); font-weight: 700; }
.final { text-align: center; } .final h2 { margin: 0 auto 10px; } .final p { color: var(--ink2); max-width: 52ch; margin: 0 auto 22px; }
.lp-foot { border-top: 1px solid var(--line); padding: 28px 16px 90px; text-align: center; font-size: 13.5px; color: var(--muted); display: grid; gap: 8px; }
.lp-foot a { color: var(--ink2); } .lp-foot-l { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 16px; }
.seo-links { max-width: 1180px; margin: 0 auto; padding: 20px 16px; }
@media (max-width: 899px) { .hero-v { padding: 70px 0 64px; } .n1 { top: 12px; left: 10px; } .n2 { bottom: 12px; right: 10px; } }

/* Блок ссылок на статьи волны planer-2026-10 (вставляется между маркерами SEO-LINKS) */
.seo-links .sl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px 28px;margin-top:18px}
.seo-links h3{font-size:15px;letter-spacing:.02em;color:var(--wine);margin:0 0 8px}
.seo-links ul{list-style:none;margin:0;padding:0}
.seo-links li{margin:0 0 7px;line-height:1.35}
.seo-links a{color:var(--ink2);text-decoration:none;border-bottom:1px solid var(--gold-soft)}
.seo-links a:hover{color:var(--wine);border-color:var(--wine)}
.seo-links h3{font-family:inherit;font-weight:700;font-size:14px;letter-spacing:.01em}
