@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Oswald:wght@400;500;600;700&display=swap');

:root { --bg:#070a08; --surface:#101610; --surface-2:#151c15; --text:#f4f7f1; --muted:#a8b0a8; --accent:#c8ff39; --line:rgba(255,255,255,.1); --container:1160px; }
* { box-sizing:border-box; margin:0; } html { scroll-behavior:smooth; } body { min-width:320px; background:var(--bg); color:var(--text); font-family:Inter,Arial,sans-serif; line-height:1.6; } a { color:inherit; text-decoration:none; } img { display:block; max-width:100%; } .container { width:min(var(--container),calc(100% - 40px)); margin:auto; }
.cover-frame img { object-position:43% center; }
.course-header { position:relative; z-index:2; border-bottom:1px solid var(--line); background:rgba(7,10,8,.92); } .header-inner { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px; }.course-logo { display:inline-flex; align-items:center; gap:9px; font-weight:800; letter-spacing:-.04em; font-size:21px; }.course-logo img { width:30px; height:30px; object-fit:contain; }.course-logo b { color:var(--accent); }.header-link { color:var(--muted); font-size:14px; font-weight:700; }.header-link:hover { color:var(--accent); }
.course-hero { position:relative; overflow:hidden; padding:92px 0 100px; background:radial-gradient(circle at 78% 38%,rgba(141,214,39,.14),transparent 28%),linear-gradient(135deg,#070a08 22%,#111a10); }.hero-glow { position:absolute; border:1px solid rgba(200,255,57,.18); border-radius:50%; pointer-events:none; }.glow-one { width:620px; height:620px; right:-120px; top:30px; }.glow-two { width:390px; height:390px; right:40px; top:146px; }.hero-grid { position:relative; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:78px; }.eyebrow { display:inline-block; color:var(--accent); font-size:11px; font-weight:900; letter-spacing:.16em; }.hero-copy h1 { margin:14px 0 20px; max-width:640px; font-family:Oswald,Impact,sans-serif; font-size:clamp(56px,7vw,94px); font-weight:700; letter-spacing:-.04em; line-height:.97; text-transform:uppercase; }.hero-copy h1 em,h2 em { color:var(--accent); font-style:normal; }.hero-copy>p { max-width:610px; color:var(--muted); font-size:17px; }.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }.button { display:inline-flex; align-items:center; justify-content:center; gap:15px; min-height:52px; padding:14px 22px; border-radius:8px; font-size:14px; font-weight:900; transition:transform .2s,background .2s; }.button:hover { transform:translateY(-2px); }.button-primary { background:var(--accent); color:#071006; }.button-primary span { font-size:21px; line-height:0; }.button-secondary { border:1px solid rgba(255,255,255,.2); color:var(--text); }.trust-list { display:flex; flex-wrap:wrap; gap:16px 23px; margin-top:30px; padding:0; list-style:none; color:#d2d9d0; font-size:13px; font-weight:700; }.trust-list span { color:var(--accent); margin-right:5px; }.hero-cover { position:relative; width:min(100%,440px); margin-left:auto; }.cover-frame { padding:10px; border:1px solid rgba(200,255,57,.35); border-radius:22px; background:rgba(10,16,10,.74); box-shadow:0 24px 70px rgba(0,0,0,.46); }.cover-frame img { aspect-ratio:1; border-radius:14px; object-fit:cover; }.cover-badge { position:absolute; bottom:28px; left:-40px; display:flex; align-items:center; gap:9px; padding:11px 15px; border:1px solid var(--line); border-radius:10px; background:#111811; box-shadow:0 12px 30px rgba(0,0,0,.34); }.cover-badge strong { color:var(--accent); font-family:Oswald,sans-serif; font-size:36px; line-height:1; }.cover-badge span { width:58px; font-size:11px; font-weight:800; line-height:1.2; text-transform:uppercase; }
.course-intro { padding:115px 0; background:#eff2ec; color:#0d130d; }.intro-grid,.access-grid,.faq-grid { display:grid; grid-template-columns:1fr 1fr; gap:90px; }.course-intro .eyebrow { color:#477000; }.course-intro h2,.section-heading h2,.access-grid h2,.offer h2,.faq h2 { margin-top:12px; font-family:Oswald,Impact,sans-serif; font-size:clamp(40px,4.8vw,64px); letter-spacing:-.03em; line-height:1.02; text-transform:uppercase; }.course-intro h2 em { color:#579100; }.intro-text { color:#485148; font-size:17px; }.intro-text p+p { margin-top:16px; }
.benefits { padding:105px 0; }.benefit-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:24px; }.benefit-grid article { min-height:246px; padding:25px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(145deg,#151c15,#0e130e); }.benefit-grid article span { color:var(--accent); font-family:Oswald,sans-serif; font-size:27px; }.benefit-grid h3 { margin:41px 0 8px; font-size:21px; }.benefit-grid p { color:var(--muted); font-size:14px; }
.modules { padding:110px 0; background:#0d120d; }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; }.section-heading h2 { max-width:690px; }.section-heading>p { max-width:300px; color:var(--muted); font-size:15px; }.module-list { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:42px; }.module-list article { display:flex; gap:23px; padding:25px; border:1px solid var(--line); border-radius:12px; background:#111711; transition:border-color .2s,transform .2s; }.module-list article:hover { transform:translateY(-3px); border-color:rgba(200,255,57,.52); }.module-list b { color:var(--accent); font-family:Oswald,sans-serif; font-size:30px; line-height:1; }.module-list span { color:#aeb8a9; font-size:10px; font-weight:900; letter-spacing:.13em; }.module-list h3 { margin:4px 0 5px; font-size:18px; }.module-list p { color:var(--muted); font-size:13px; }
.course-access { padding:110px 0; background:linear-gradient(135deg,#182518,#0b0f0c); }.access-grid p { margin-top:20px; color:var(--muted); font-size:16px; }.access-grid ol { display:grid; align-content:center; gap:16px; padding:0; list-style:none; }.access-grid li { display:flex; align-items:center; gap:17px; padding:18px; border-bottom:1px solid var(--line); font-size:15px; font-weight:700; }.access-grid li b { display:grid; width:34px; height:34px; place-items:center; border-radius:50%; background:var(--accent); color:#071006; }
.offer { padding:100px 0; }.offer-card { display:grid; grid-template-columns:1.15fr .85fr; gap:55px; padding:55px; border:1px solid rgba(200,255,57,.36); border-radius:22px; background:radial-gradient(circle at 80% 50%,rgba(200,255,57,.16),transparent 36%),#111911; }.offer h2 { max-width:610px; }.offer>div>p { margin-top:16px; max-width:560px; color:var(--muted); }.price-box { align-self:center; padding:25px; border-radius:13px; background:#090e09; text-align:center; }.price-box small { color:var(--accent); font-size:10px; font-weight:900; letter-spacing:.12em; }.price-box strong { display:block; margin:6px 0 15px; font-family:Oswald,sans-serif; font-size:73px; line-height:.9; }.price-box sup { font-size:24px; vertical-align:top; }.price-box strong span { font-size:38px; }.price-box .button { width:100%; }.price-box p { margin-top:12px; color:var(--muted); font-size:11px; }
.faq { padding:105px 0; border-top:1px solid var(--line); }.faq h2 { max-width:450px; }.faq details { padding:20px 0; border-bottom:1px solid var(--line); }.faq summary { display:flex; justify-content:space-between; gap:22px; cursor:pointer; font-size:16px; font-weight:800; list-style:none; }.faq summary::after { content:'+'; color:var(--accent); font-size:23px; line-height:.8; }.faq details[open] summary::after { content:'−'; }.faq details p { padding-top:12px; color:var(--muted); font-size:14px; }
footer { padding:28px 0; border-top:1px solid var(--line); color:var(--muted); font-size:12px; } footer .container { display:flex; align-items:center; justify-content:space-between; gap:20px; } footer .course-logo { color:var(--text); font-size:17px; }
@media (max-width:850px) { .course-hero { padding:68px 0 78px; }.hero-grid,.intro-grid,.access-grid,.faq-grid,.offer-card { grid-template-columns:1fr; gap:44px; }.hero-cover { width:min(100%,390px); margin:0 auto; }.cover-badge { left:-10px; }.course-intro,.benefits,.modules,.course-access,.offer,.faq { padding:75px 0; }.benefit-grid,.module-list { grid-template-columns:1fr; }.section-heading { display:block; }.section-heading>p { margin-top:18px; }.offer-card { padding:34px 24px; } }
@media (max-width:520px) { .container { width:min(var(--container),calc(100% - 28px)); }.header-inner { min-height:67px; }.hero-copy h1 { font-size:53px; }.hero-actions .button { width:100%; }.trust-list { display:grid; gap:8px; }.cover-badge { bottom:16px; }.course-intro h2,.section-heading h2,.access-grid h2,.offer h2,.faq h2 { font-size:40px; }.module-list article { padding:19px; }.module-list b { font-size:25px; } footer .container { flex-direction:column; align-items:flex-start; gap:10px; } }
