/* Layout: one long single-offer page. Video-first hero, then pains, lessons grid, method, teacher, offer box, FAQ. Sticky buy bar on phones. */
:root{
  --bg:#f4f6f6; --paper:#fbfaf6; --surface:#ffffff; --ink:#1b2733; --muted:#566673; --line:#dbe2e5;
  --ember:#d4532b; --ember-ink:#ffffff; --ember-soft:#fbe8e0; --gold:#e3a12a; --sage:#3f8a76;
  --display:"Rubik","Assistant",system-ui,sans-serif;
  --body:"Assistant",system-ui,"Segoe UI",Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#10171c; --paper:#151e24; --surface:#18232a; --ink:#edf1f2; --muted:#9fb1ba; --line:#2a3943;
  --ember:#ef835b; --ember-ink:#1a0f0a; --ember-soft:#3a2219; --gold:#f0bd55; --sage:#7cc1ad; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#10171c; --paper:#151e24; --surface:#18232a; --ink:#edf1f2; --muted:#9fb1ba; --line:#2a3943;
  --ember:#ef835b; --ember-ink:#1a0f0a; --ember-soft:#3a2219; --gold:#f0bd55; --sage:#7cc1ad; color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--bg);color:var(--ink);font:400 18px/1.65 var(--body);margin:0}
.wrap{max-width:1040px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--display);text-wrap:balance;line-height:1.18;margin:0}
h1{font-size:clamp(34px,5.6vw,56px);font-weight:800;letter-spacing:-.01em}
h2{font-size:clamp(26px,3.8vw,36px);font-weight:700}
h3{font-size:20px;font-weight:700}
p{margin:0}
section{padding-block:56px}
.eyebrow{font:700 14px var(--body);letter-spacing:.05em;color:var(--ember)}
.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:700 20px var(--display);text-decoration:none;color:var(--ember-ink);background:var(--ember);padding:15px 30px;border-radius:12px;border:0;cursor:pointer;transition:transform .15s ease, box-shadow .15s ease;box-shadow:0 6px 18px -8px var(--ember)}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.btn{transition:none}.btn:hover{transform:none}}
.btn small{font:600 15px var(--body);opacity:.85}

/* top */
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-block:16px;font-size:15px}
.brand{font:700 17px var(--display)}
.top a{color:var(--muted);text-decoration:none}

/* hero */
.hero{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:center;padding-block:28px 48px}
.hero > *{min-width:0}
.hero .copy{display:grid;gap:18px;justify-items:start}
.lead{font-size:21px;color:var(--muted);max-width:56ch}
.price-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px}
.price{font:800 44px var(--display);font-variant-numeric:tabular-nums}
.was{color:var(--muted);text-decoration:line-through;font-size:20px}
.tag{font:700 14px var(--body);background:var(--ember-soft);color:var(--ember);padding:4px 10px;border-radius:999px}
.facts{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:15px;color:var(--muted)}
.facts span{display:inline-flex;align-items:center;gap:6px}
.facts span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--sage)}
.player{display:grid;gap:10px}
.player video{width:100%;max-width:100%;aspect-ratio:16/9;border-radius:16px;background:#000;display:block;box-shadow:0 22px 50px -28px rgba(20,30,40,.55)}
.player .cap{font-size:15px;color:var(--muted);display:flex;gap:8px;align-items:center}
.free{font:700 13px var(--body);background:var(--sage);color:var(--surface);padding:3px 9px;border-radius:6px}
@media (max-width:820px){.hero{grid-template-columns:1fr;gap:26px}.player{order:-1}}

/* pains */
.band{background:var(--paper);border-block:1px solid var(--line)}
.pains{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:24px;padding:0;list-style:none}
.pains li{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px 18px;font-weight:600;line-height:1.45}
.turn{margin-top:22px;font-size:20px;max-width:62ch}

/* lessons */
.lessons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:26px}
@media (max-width:820px){.lessons{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.lessons{grid-template-columns:1fr}}
.lesson{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.lesson .th{position:relative;aspect-ratio:16/9;max-width:100%;background:#f3f1ea}
.lesson .th img{width:100%;height:100%;object-fit:cover;display:block}
.lesson .dur{position:absolute;bottom:8px;inset-inline-end:8px;background:rgba(18,22,26,.75);color:#fff;font-size:13px;padding:2px 8px;border-radius:6px;font-variant-numeric:tabular-nums}
.lesson .body{padding:14px 16px 18px;display:grid;gap:4px}
.lesson .n{font:700 14px var(--body);color:var(--ember)}
.lesson strong{font:700 18px var(--display);line-height:1.3}
.lesson span.s{color:var(--muted);font-size:15.5px}

/* method */
.method{display:grid;grid-template-columns:1.1fr 1fr;gap:36px;align-items:center}
.method > *{min-width:0}
.method img{width:100%;max-width:100%;border-radius:14px;border:1px solid var(--line);background:#fbfaf6}
.method .txt{display:grid;gap:14px}
.quote{font:700 24px/1.35 var(--display);border-inline-start:4px solid var(--ember);padding-inline-start:16px}
@media (max-width:820px){.method{grid-template-columns:1fr}}

/* teacher */
.teacher{display:grid;grid-template-columns:200px 1fr;gap:30px;align-items:start}
.teacher > *{min-width:0}
.teacher img{width:200px;max-width:100%;aspect-ratio:480/528;object-fit:cover;border-radius:16px}
.teacher .txt{display:grid;gap:14px}
.creds{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px 22px;margin:6px 0 0;padding:0;list-style:none;font-size:16px}
.creds b{display:block;font-family:var(--display);font-weight:700}
.creds span{color:var(--muted)}
@media (max-width:620px){.teacher{grid-template-columns:1fr}.teacher img{width:150px}}

/* offer */
.offer{background:var(--surface);border:2px solid var(--ember);border-radius:20px;padding:30px clamp(18px,4vw,40px);display:grid;gap:18px;max-width:720px;margin:0 auto}
.incl{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.incl li{display:flex;gap:10px;align-items:flex-start}
.incl li::before{content:"✓";color:var(--sage);font-weight:800;flex:none}
.secure{font-size:14px;color:var(--muted)}

/* faq */
.faq{display:grid;gap:10px;margin-top:20px;max-width:760px}
details{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 18px}
summary{cursor:pointer;font:700 18px var(--display)}
details p{margin-top:10px;color:var(--muted)}

/* footer */
footer{border-top:1px solid var(--line);padding-block:28px 110px;font-size:15px;color:var(--muted)}
footer .row{display:flex;flex-wrap:wrap;gap:8px 24px}
.sel{user-select:all;color:var(--ink);font-variant-numeric:tabular-nums}
.wa{color:var(--sage);font-weight:700;font-variant-numeric:tabular-nums}

/* sticky bar (phones) */
.sticky{position:fixed;inset:auto 0 0 0;z-index:20;background:var(--surface);border-top:1px solid var(--line);
  padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));
  display:none;align-items:center;justify-content:space-between;gap:12px;box-shadow:0 -10px 30px -20px rgba(0,0,0,.35)}
.sticky .p{font:800 24px var(--display)}
.sticky .p s{font:400 15px var(--body);color:var(--muted);margin-inline-start:6px}
.sticky .btn{padding:11px 20px;font-size:17px}
@media (max-width:820px){.sticky{display:flex}}
@media (min-width:821px){footer{padding-block:28px}}
.pending-note{display:none;margin-top:8px;font-size:14px;color:var(--ember)}

:lang(ru){--display:"Rubik",system-ui,sans-serif;--body:"Rubik",system-ui,"Segoe UI",Arial,sans-serif}
.langs{display:flex;gap:4px;flex-wrap:wrap}
.langs a{font-size:14px;color:var(--muted);text-decoration:none;padding:3px 8px;border-radius:6px}
.langs a[aria-current="true"]{color:var(--ink);background:var(--surface);border:1px solid var(--line)}
:lang(ar){--display:"Noto Sans Arabic","Rubik",system-ui,sans-serif;--body:"Noto Sans Arabic","Rubik",system-ui,sans-serif}
.moment-sec{padding-block:40px 8px}
.moment{position:relative;margin:0 auto;max-width:760px;border-radius:22px;overflow:hidden;box-shadow:0 26px 60px -30px rgba(20,30,40,.55)}
.moment img{display:block;width:100%;height:auto}
.moment figcaption{position:absolute;inset:auto 0 0 0;padding:70px 28px 24px;background:linear-gradient(to top,rgba(10,20,28,.72),rgba(10,20,28,0));color:#fff;font:700 clamp(22px,3.4vw,34px)/1.25 var(--display);text-shadow:0 2px 12px rgba(0,0,0,.35)}
@media (max-width:620px){.moment figcaption{padding:50px 18px 16px}}
.navlink{font:600 16px var(--body,inherit);color:inherit;text-decoration:none;opacity:.85}.navlink:hover{opacity:1;text-decoration:underline}
.guar{font-size:16px;margin-top:4px}.guar a{color:inherit}
/* logo-mobile */@media (max-width:640px){.top{flex-wrap:wrap}.top > .brand{width:100%}}