/* LEONI editorial direction, 23 September 2026. */
:root { --ink:#302b38; --muted:#63576a; --paper:#fffcf9; --line:#efc5d0; --purple:#ed467b; --purple-dark:#ad2450; --orange:#ff9228; }
body { background:var(--paper); }
.nav { height:96px; max-width:1320px; padding:0 40px; }
.brand { font-weight:500; line-height:1.5; }
.brand img { width:54px; height:54px; }
.nav-link { border:1px solid #dfcec7; border-radius:40px; padding:12px 20px; text-decoration:none; font-weight:600; }
.hero { display:block; max-width:1280px; margin:12px auto 0; min-height:610px; padding:56px 48px; border-radius:36px; background:#fbe9e2; overflow:hidden; }
.hero-copy { position:relative; z-index:2; width:43%; padding:12px 0; }
.eyebrow { color:#885361; font-size:11px; font-weight:600; letter-spacing:.09em; }
.hero .eyebrow { display:inline-block; color:#67424c; background:#f6d3d5; padding:10px 14px; border-radius:30px; letter-spacing:.025em; text-transform:none; font-size:12px; }
.hero h1 { font-size:clamp(38px,4.3vw,60px); font-weight:600; letter-spacing:-.045em; line-height:1.06; }
.hero-lead { font-size:17px; margin:22px 0 28px; line-height:1.6; }
.hero-visual { position:absolute; inset:0; width:100%; border-radius:0; overflow:hidden; background:#f5e8db; }
.hero-visual:after { display:block; content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(255,250,247,.97) 0%,rgba(255,250,247,.94) 31%,rgba(255,250,247,.65) 42%,rgba(255,250,247,0) 57%); }
.hero-visual img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.hero-actions { gap:20px; }
.hero-actions .hero-price { font-size:13px; color:var(--muted); }
.hero-price strong { font-size:29px; font-weight:600; }
.button-primary { background:#ff9228; color:#302014; box-shadow:none; transform:none; }
.button-primary:hover { background:#ffb659; }
.button-primary:active { box-shadow:none; transform:none; }
.button { min-height:58px; border-radius:16px; font-weight:600; padding:14px 24px; line-height:1.4; }
.hero-actions .button { width:100%; gap:16px; justify-content:center; font-size:14px; }
.hero-actions .button span { color:inherit; font-size:24px; }
.proof-strip { max-width:1208px; margin:22px auto 0; color:var(--ink); background:transparent; border-radius:0; box-shadow:none; gap:12px; }
.proof-strip div { background:white; border:1px solid var(--line); border-radius:18px; padding:22px; align-items:center; }
.proof-strip div:last-child { border:1px solid var(--line); }
.proof-strip strong { color:#a25165; font-size:26px; font-weight:600; white-space:nowrap; }
.proof-strip span { font-size:12px; }
.section { padding-top:90px; }
h2 { font-size:clamp(30px,3.3vw,44px); font-weight:600; line-height:1.12; letter-spacing:-.035em; }
h3 { font-size:20px; font-weight:600; }
.section-heading { display:flex; flex-direction:column; gap:12px; max-width:900px; margin-bottom:32px; }
.section-heading h2 { margin:0; }
.section-heading > p:not(.eyebrow) { max-width:760px; font-size:18px; line-height:1.6; margin:6px 0 0; color:#403949; }
.section-heading > .eyebrow { font-size:clamp(22px,2.3vw,28px); line-height:1.2; font-weight:600; letter-spacing:-.025em; text-transform:none; color:var(--ink); }
.cards { gap:16px; }
.card { border:none; background:#ffdbaf; padding:30px; border-radius:24px; }
.card:nth-child(2), .card:nth-child(3) { background:#ffb7cb; }
.card span { color:#a45a68; margin-bottom:24px; font-size:13px; font-weight:600; }
.result-panel { background:#d9f4dc; color:#163c2d; padding:48px; gap:42px; }
.result-panel h2,.result-panel li { color:#163c2d; }
.result-panel .eyebrow.light { color:#102e24; font-size:22px; text-transform:none; letter-spacing:0; }
.result-panel li { border-color:rgba(16,46,36,.25); }
.result-panel li:before { color:#102e24; }
.expert-profile { max-width:1064px; margin:90px auto 0; padding:32px; display:grid; grid-template-columns:280px 1fr; align-items:center; gap:44px; background:#f8e9dc; border-radius:28px; }
.expert-photo { width:100%; height:350px; object-fit:cover; object-position:center 20%; display:block; padding:0; border:0; border-radius:20px; box-shadow:none; }
.expert-profile h2 { font-size:38px; }
.expert-role { font-size:16px; font-weight:600; }
.expert-copy p,.expert-copy li { font-size:15px; }
.number { background:#f47680; color:#30242d; border-radius:50%; }
.timeline { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.timeline li,.timeline li:last-child { display:flex; flex-direction:column; align-items:flex-start; gap:24px; padding:30px; border:1px solid #efd5c0; border-radius:26px; background:#fff2df; }
.timeline li:nth-child(2) { background:#f0eaff; border-color:#dfd3f7; }
.timeline li:nth-child(3) { background:#e7f5eb; border-color:#cce8d5; }
.timeline li:nth-child(4) { background:#ffe7eb; border-color:#f5cdd5; }
.timeline .number { width:64px; height:64px; background:#fff; border-radius:20px; color:#352a42; font-size:32px; flex-shrink:0; }
.timeline h3 { font-size:24px; line-height:1.25; margin:0 0 16px; }
.timeline p { color:#453d49; font-size:16px; line-height:1.6; }
.format-note { margin-top:28px; padding:24px 28px; border-left:4px solid #ff9228; }
.format-note h3 { margin:0 0 10px; }
.format-note p { margin:0; max-width:720px; color:#453d49; line-height:1.6; }
.honest { max-width:840px; }
.honest .quote-mark { color:#d27687; }
.honest p { font-size:17px; }
.offer-box { background:#ffbd72; gap:38px; padding:44px; }
.hero-price s,.price s { font-size:24px; color:#66545f; }
.nav-actions { display:flex; gap:12px; align-items:center; }
.nav-signup { min-height:44px; font-size:14px; }
@media(max-width:780px) { .nav { height:auto; min-height:100px; flex-wrap:wrap; padding-top:12px; padding-bottom:12px; } .nav-actions { width:100%; justify-content:space-between; gap:6px; } .nav-signup { font-size:12px; padding:10px 14px; } }
.price strong { font-weight:600; }
.hero-price small { display:block; margin-top:8px; font-size:14px; }
.offer-countdown { margin-top:24px; padding:18px; background:#fff8f2; border-radius:18px; }
.offer-countdown p { margin:0 0 10px; font-size:14px; }
.offer-countdown strong { display:block; font-size:clamp(16px,2vw,22px); font-variant-numeric:tabular-nums; }
.offer-countdown small { display:block; margin-top:10px; font-size:11px; }
[hidden] { display:none !important; }
.lead-form { box-shadow:none; border:1px solid #eddbce; }
.lead-form label { font-weight:600; }
.faq summary { font-weight:600; font-size:17px; }
@media(max-width:1000px) {
 .hero { gap:24px; margin:12px 20px 0; padding:28px; }
 .proof-strip { margin:20px 20px 0; }
 .expert-profile { margin:70px 28px 0; grid-template-columns:220px 1fr; gap:28px; }
}
@media(max-width:780px) {
 .timeline { grid-template-columns:1fr; }
 .timeline li,.timeline li:last-child { padding:24px; gap:20px; }
 .nav { height:82px; padding:0 18px; gap:10px; }
 .nav-link { padding:10px 12px; white-space:nowrap; font-size:11px; }
 .brand { gap:7px; }
 .brand img { width:42px; height:42px; }
 .brand span { max-width:175px; font-size:9px; }
 .hero { display:block; min-height:740px; padding:26px 20px 310px; margin:0 12px; border-radius:26px; }
 .hero-copy { padding:0; width:100%; }
 .hero h1 { font-size:clamp(35px,8.6vw,48px); }
 .hero-lead { font-size:15px; margin:18px 0 22px; }
 .hero-visual { height:100%; border-radius:0; }
 .hero-visual img { height:340px; position:absolute; bottom:0; object-fit:cover; object-position:right center; }
 .hero-visual:after { background:linear-gradient(180deg,#fffaf7 0%,#fffaf7 52%,rgba(255,250,247,0) 70%); }
 .hero-actions { gap:15px; }
 .proof-strip { margin:16px 12px 0; gap:8px; grid-template-columns:1fr; }
 /* В одну строку помещается только «12–17 лет»: у остальных nowrap-заголовок
    наезжал на пояснение справа, поэтому на узком экране складываем в столбик. */
 .proof-strip div { padding:16px 20px; flex-direction:column; align-items:flex-start; gap:4px; }
 .proof-strip strong { white-space:normal; }
 .section { padding:64px 20px 0; }
 .section-heading { grid-template-columns:1fr; gap:8px; }
 .card { padding:24px; }
 .result-panel { padding:30px 24px; gap:24px; }
 .expert-profile { margin:64px 20px 0; padding:24px; display:block; }
 .expert-photo { max-width:240px; margin:0 auto 26px; }
 .expert-profile h2 { font-size:32px; }
 .offer-box { padding:26px 16px; gap:28px; }
 .faq { padding-bottom:64px; }
}