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

:root {
  --bg: #06050B;
  --accent: #00D8A4;
  --accent-light: #B0FFEC;
  --white: #FFFFFF;
  --gray: #8892A4;
  --gray2: #3A4455;
  --card: rgba(255,255,255,0.04);
  --card-border: rgba(0,216,164,0.15);
  --glass: rgba(0,216,164,0.06);
  --glass-border: rgba(0,216,164,0.2);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Manrope',sans-serif; background:var(--bg); color:var(--white); overflow-x:hidden; line-height:1.6; }

/* PROGRESS */
#progress-bar { position:fixed; top:0; left:0; z-index:9999; height:3px; width:0%; background:linear-gradient(90deg,var(--accent),var(--accent-light)); border-radius:0 2px 2px 0; }

/* BG */
.bg-layer { position:fixed; inset:0; z-index:-1; background:var(--bg); overflow:hidden; }
.bg-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(0,216,164,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,216,164,0.04) 1px,transparent 1px); background-size:60px 60px; }
.glow { position:absolute; border-radius:50%; filter:blur(90px); pointer-events:none; will-change:transform; }
.g1 { width:700px; height:700px; top:-150px; right:-150px; background:radial-gradient(circle,rgba(0,216,164,0.13) 0%,transparent 70%); }
.g2 { width:500px; height:500px; bottom:20%; left:-150px; background:radial-gradient(circle,rgba(0,216,164,0.08) 0%,transparent 70%); }
.g3 { width:400px; height:400px; top:55%; right:-80px; background:radial-gradient(circle,rgba(0,100,80,0.1) 0%,transparent 70%); }

/* NAV */
nav { position:fixed; top:0; left:0; right:0; z-index:100; padding:0 24px; height:64px; background:rgba(6,5,11,0.85); backdrop-filter:blur(20px); border-bottom:1px solid rgba(0,216,164,0.08); display:flex; align-items:center; justify-content:space-between; }
.nav-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.nav-logo img { width:36px; height:36px; border-radius:9px; }
.nav-logo span { font-size:16px; font-weight:700; }
.nav-links { display:flex; gap:28px; list-style:none; }
.nav-links a { color:var(--gray); text-decoration:none; font-size:14px; font-weight:500; transition:color .2s; }
.nav-links a:hover { color:var(--accent); }
.nav-right { display:flex; align-items:center; gap:14px; }
.nav-cta { background:var(--accent); color:#06050B; border:none; padding:10px 20px; border-radius:50px; font-family:'Manrope',sans-serif; font-weight:700; font-size:13px; cursor:pointer; transition:all .2s; white-space:nowrap; }
.nav-cta:hover { background:var(--accent-light); transform:translateY(-1px); }
.burger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
.burger span { display:block; width:24px; height:2px; background:var(--white); border-radius:2px; transition:all .3s; }
.burger.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }
.mobile-menu { display:none; position:fixed; top:64px; left:0; right:0; background:rgba(6,5,11,0.98); backdrop-filter:blur(20px); border-bottom:1px solid rgba(0,216,164,0.1); padding:16px 24px; z-index:99; flex-direction:column; }
.mobile-menu.open { display:flex; }
.mobile-menu a { color:var(--gray); text-decoration:none; font-size:16px; padding:14px 0; border-bottom:1px solid rgba(255,255,255,0.05); transition:color .2s; }
.mobile-menu a:hover { color:var(--accent); }
.mob-cta { margin-top:16px; background:var(--accent); color:#06050B; border:none; padding:14px; border-radius:50px; font-family:'Manrope',sans-serif; font-weight:700; font-size:15px; cursor:pointer; text-align:center; }

/* UTILS */
.container { max-width:1160px; margin:0 auto; padding:0 24px; }
.accent { color:var(--accent); }
.section { padding:100px 0; position:relative; }
.section-dark { background:rgba(0,0,0,0.3); }
.section-label { display:inline-block; font-size:12px; font-weight:700; color:var(--accent); letter-spacing:.1em; text-transform:uppercase; margin-bottom:12px; }
.section-title { font-size:clamp(26px,3.5vw,42px); font-weight:800; margin-bottom:12px; line-height:1.2; }
.section-sub { color:var(--gray); font-size:16px; }

/* REVEAL */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .65s ease,transform .65s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay:.1s; }
.reveal-delay-2 { transition-delay:.2s; }
.reveal-delay-3 { transition-delay:.3s; }
.reveal-delay-4 { transition-delay:.4s; }

/* HERO */
#hero { min-height:100vh; display:flex; align-items:center; padding-top:64px; }
.hero-inner { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; width:100%; padding:60px 0; }
.hero-badge { display:inline-flex; align-items:center; gap:8px; background:var(--glass); border:1px solid var(--glass-border); padding:8px 16px; border-radius:50px; font-size:13px; color:var(--accent); font-weight:600; margin-bottom:32px; }
.hero-badge::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--accent); flex-shrink:0; animation:pulse 2s infinite; }
@keyframes pulse { 0%,100%{opacity:1;} 50%{opacity:0.3;} }
.hero-title { font-size:clamp(28px,3.6vw,50px); font-weight:900; line-height:1.1; margin-bottom:24px; letter-spacing:-0.02em; }
.hero-title .line { display:block; }
.hero-title .line-accent { color:var(--accent); }
.hero-sub { font-size:16px; color:var(--gray); line-height:1.75; margin-bottom:32px; }
.hero-sub strong { color:var(--white); }
.hero-badges { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:36px; }
.hb { display:flex; align-items:center; gap:7px; background:var(--glass); border:1px solid var(--glass-border); padding:9px 15px; border-radius:10px; font-size:13px; font-weight:600; transition:all .2s; }
.hb:hover { background:rgba(0,216,164,0.1); border-color:rgba(0,216,164,0.3); }
.cta-btn { display:inline-flex; align-items:center; gap:10px; background:var(--accent); color:#06050B; border:none; padding:17px 36px; border-radius:60px; font-family:'Manrope',sans-serif; font-weight:800; font-size:16px; cursor:pointer; transition:all .25s; text-decoration:none; }
.cta-btn:hover { background:var(--accent-light); transform:translateY(-2px); box-shadow:0 16px 48px rgba(0,216,164,0.3); }
.microtrust { display:flex; gap:20px; flex-wrap:wrap; margin-top:16px; font-size:13px; color:var(--gray); }
.microtrust span { display:flex; align-items:center; gap:5px; }
.microtrust span::before { content:'✓'; color:var(--accent); font-weight:700; }
.hero-stats { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.stat-card { background:var(--card); border:1px solid var(--card-border); border-radius:20px; padding:24px; backdrop-filter:blur(10px); transition:all .3s; }
.stat-card:hover { border-color:rgba(0,216,164,0.35); transform:translateY(-3px); box-shadow:0 8px 32px rgba(0,216,164,0.1); }
.stat-card .num { font-size:38px; font-weight:900; color:var(--accent); line-height:1; }
.stat-card .lbl { font-size:13px; color:var(--gray); margin-top:6px; }
.stat-card-wide { grid-column:1/-1; display:flex; align-items:center; gap:16px; }

/* FEARS */
.fears-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:52px; }
.fear-card { background:var(--card); border:1px solid var(--card-border); border-radius:24px; padding:32px; transition:all .3s; }
.fear-card:hover { transform:translateY(-6px); border-color:rgba(0,216,164,0.4); box-shadow:0 12px 40px rgba(0,216,164,0.1); }
.fear-tag { display:inline-block; background:rgba(0,216,164,0.1); color:var(--accent); padding:8px 16px; border-radius:50px; font-size:13px; font-style:italic; font-weight:600; margin-bottom:20px; border:1px solid rgba(0,216,164,0.2); }
.fear-text { color:var(--gray); font-size:15px; line-height:1.7; margin-bottom:16px; }
.fear-quote { border-left:3px solid var(--accent); padding-left:14px; font-style:italic; color:var(--accent-light); font-size:14px; line-height:1.6; }

/* STEPS */
.steps-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:52px; }
.step-card { background:var(--card); border:1px solid var(--card-border); border-radius:20px; padding:28px; transition:all .3s; position:relative; overflow:hidden; }
.step-card::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(0,216,164,0.05) 0%,transparent 60%); opacity:0; transition:opacity .3s; }
.step-card:hover::before { opacity:1; }
.step-card:hover { border-color:rgba(0,216,164,0.3); transform:translateY(-4px); }
.step-num { font-size:52px; font-weight:900; color:rgba(0,216,164,0.1); line-height:1; margin-bottom:14px; }
.step-title { font-size:16px; font-weight:700; margin-bottom:8px; }
.step-text { color:var(--gray); font-size:14px; line-height:1.65; }
.steps-note { margin-top:28px; background:var(--glass); border:1px solid var(--glass-border); border-radius:16px; padding:18px 24px; display:flex; align-items:center; gap:12px; font-size:15px; font-weight:600; color:var(--accent); }

/* PARTNER */
.partner-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:52px; }
.partner-card { background:var(--glass); border:1px solid var(--glass-border); border-radius:24px; padding:36px; transition:all .3s; }
.partner-card:hover { transform:translateY(-6px); border-color:rgba(0,216,164,0.4); box-shadow:0 16px 48px rgba(0,216,164,0.1); }
.partner-icon { font-size:36px; margin-bottom:18px; }
.partner-title { font-size:19px; font-weight:700; margin-bottom:12px; }
.partner-text { color:var(--gray); font-size:14px; line-height:1.7; margin-bottom:20px; }
.partner-quote { border-left:3px solid var(--accent); padding-left:14px; font-style:italic; color:var(--accent); font-size:13px; line-height:1.6; }

/* FOUNDER */
.founder-inner { display:grid; grid-template-columns:1fr 1.3fr; gap:72px; align-items:start; }
.founder-photos-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.founder-photo { border-radius:16px; overflow:hidden; border:1px solid var(--card-border); transition:all .3s; cursor:pointer; }
.founder-photo:hover { border-color:rgba(0,216,164,0.4); transform:scale(1.02); }
.founder-photo img { width:100%; height:190px; object-fit:cover; object-position:top center; display:block; }
.founder-photo.vovchansk img { object-position:50% 30%; }
.founder-photo-tag { padding:9px 12px; background:rgba(6,5,11,0.9); font-size:11px; color:var(--gray); line-height:1.3; }
.founder-photo-wide { grid-column:1/-1; }
.founder-photo-wide img { height:230px; object-position:center 35%; }
.founder-name { font-size:36px; font-weight:800; margin-bottom:6px; }
.founder-role { color:var(--accent); font-size:14px; font-weight:600; margin-bottom:28px; }
.founder-text { color:var(--gray); font-size:15px; line-height:1.8; margin-bottom:20px; }
.founder-sig { color:var(--accent); font-style:italic; font-size:14px; margin-bottom:32px; }
.founder-stats { display:flex; gap:36px; margin-bottom:36px; }
.fs .n { font-size:34px; font-weight:800; color:var(--accent); }
.fs .l { font-size:12px; color:var(--gray); margin-top:3px; }

/* SLIDERS */
.slider-section { margin-bottom:56px; }
.slider-title { font-size:20px; font-weight:700; margin-bottom:20px; }
.slider-track { display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:4px; cursor:grab; -webkit-overflow-scrolling:touch; }
.slider-track::-webkit-scrollbar { display:none; }
.slider-track.grabbing { cursor:grabbing; }
.slide-card { flex:0 0 280px; scroll-snap-align:start; border-radius:16px; overflow:hidden; border:1px solid var(--card-border); transition:border-color .2s; cursor:pointer; background:#0a0a0f; }
.slide-card:hover { border-color:rgba(0,216,164,0.4); }
.slide-card img { width:100%; display:block; object-fit:contain; }
.slide-card.tall img { max-height:480px; }
.slide-card.square img { max-height:320px; }

/* LESSONS */
.lessons-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:44px; }
.lesson-card { background:var(--card); border:1px solid var(--card-border); border-radius:20px; overflow:hidden; transition:all .3s; cursor:pointer; }
.lesson-card:hover { transform:translateY(-6px); border-color:rgba(0,216,164,0.4); box-shadow:0 16px 48px rgba(0,216,164,0.12); }
.lesson-card img { width:100%; height:190px; object-fit:cover; display:block; }
.lesson-info { padding:20px; }
.lesson-num { font-size:11px; color:var(--accent); font-weight:700; margin-bottom:6px; letter-spacing:.06em; }
.lesson-title { font-size:16px; font-weight:700; line-height:1.4; }
.lesson-free { display:inline-block; margin-top:12px; background:rgba(0,216,164,0.1); color:var(--accent); padding:5px 12px; border-radius:50px; font-size:12px; font-weight:700; border:1px solid rgba(0,216,164,0.2); }

/* CALC */
.calc-wrap { max-width:680px; margin:0 auto; background:var(--card); border:1px solid var(--card-border); border-radius:28px; padding:48px; }
.calc-lbl { font-size:13px; color:var(--gray); font-weight:600; margin-bottom:8px; }
.calc-val { font-size:52px; font-weight:900; color:var(--accent); margin-bottom:20px; letter-spacing:-0.02em; }
input[type=range] { -webkit-appearance:none; width:100%; height:4px; background:var(--gray2); border-radius:4px; outline:none; margin-bottom:36px; cursor:pointer; }
input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; width:24px; height:24px; border-radius:50%; background:var(--accent); cursor:pointer; box-shadow:0 0 0 5px rgba(0,216,164,0.2); }
.calc-results { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:24px; }
.cr { background:rgba(0,216,164,0.05); border:1px solid rgba(0,216,164,0.12); border-radius:16px; padding:20px; text-align:center; }
.cr .n { font-size:22px; font-weight:800; color:var(--accent); }
.cr .l { font-size:12px; color:var(--gray); margin-top:5px; }
.calc-note { font-size:12px; color:var(--gray2); text-align:center; margin-bottom:28px; line-height:1.5; }

/* FAQ */
.faq-wrap { max-width:740px; margin:44px auto 0; }
.faq-item { border-bottom:1px solid rgba(255,255,255,0.06); }
.faq-q { display:flex; justify-content:space-between; align-items:center; padding:22px 0; cursor:pointer; font-size:16px; font-weight:600; user-select:none; transition:color .2s; }
.faq-q:hover { color:var(--accent); }
.faq-arrow { width:28px; height:28px; border-radius:50%; background:var(--card); border:1px solid var(--card-border); display:flex; align-items:center; justify-content:center; font-size:16px; color:var(--accent); flex-shrink:0; margin-left:16px; transition:all .3s; }
.faq-q.open .faq-arrow { transform:rotate(45deg); background:rgba(0,216,164,0.1); }
.faq-a { color:var(--gray); font-size:15px; line-height:1.75; max-height:0; overflow:hidden; transition:max-height .4s ease,padding .3s; }
.faq-a.open { max-height:300px; padding-bottom:22px; }

/* FINAL CTA */
#final-cta { text-align:center; padding:130px 0; position:relative; overflow:hidden; }
.final-glow { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:600px; height:600px; background:radial-gradient(circle,rgba(0,216,164,0.12) 0%,transparent 65%); pointer-events:none; }
#final-cta h2 { font-size:clamp(28px,4vw,54px); font-weight:900; margin-bottom:16px; letter-spacing:-0.02em; position:relative; }
#final-cta p { color:var(--gray); font-size:17px; max-width:520px; margin:0 auto 44px; line-height:1.7; position:relative; }

/* FOOTER */
footer { background:rgba(0,0,0,0.5); border-top:1px solid rgba(255,255,255,0.05); padding:48px 0; }
.footer-top { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; margin-bottom:28px; }
.footer-logo { display:flex; align-items:center; gap:10px; }
.footer-logo img { width:32px; height:32px; border-radius:8px; }
.footer-logo span { font-weight:700; font-size:15px; }
.footer-links { display:flex; gap:24px; }
.footer-links a { color:var(--gray); text-decoration:none; font-size:14px; transition:color .2s; }
.footer-links a:hover { color:var(--accent); }
.footer-disc { font-size:12px; color:var(--gray2); line-height:1.7; border-top:1px solid rgba(255,255,255,0.04); padding-top:24px; }

/* LIGHTBOX */
.lightbox { position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,0.95); backdrop-filter:blur(12px); display:none; align-items:center; justify-content:center; padding:20px; }
.lightbox.open { display:flex; }
.lightbox img { max-width:90vw; max-height:90vh; object-fit:contain; border-radius:12px; }
.lightbox-close { position:absolute; top:20px; right:24px; background:none; border:none; color:var(--white); font-size:36px; cursor:pointer; line-height:1; opacity:.7; transition:opacity .2s; }
.lightbox-close:hover { opacity:1; }

/* FLOAT CTA — тільки мобайл */
#float-cta { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); z-index:200; opacity:0; transition:opacity .3s; pointer-events:none; display:none; }
#float-cta.visible { opacity:1; pointer-events:all; }
#float-cta button { background:var(--accent); color:#06050B; border:none; padding:14px 28px; border-radius:50px; font-family:'Manrope',sans-serif; font-weight:800; font-size:14px; cursor:pointer; box-shadow:0 8px 32px rgba(0,216,164,0.5); white-space:nowrap; }

/* MODAL */
.modal-overlay { position:fixed; inset:0; z-index:999; background:rgba(0,0,0,0.88); backdrop-filter:blur(10px); display:none; align-items:center; justify-content:center; padding:20px; }
.modal-overlay.active { display:flex; }
.modal { background:#0e1520; border:1px solid var(--glass-border); border-radius:28px; padding:48px; max-width:460px; width:100%; position:relative; }
.modal-close { position:absolute; top:18px; right:20px; background:none; border:none; color:var(--gray); font-size:26px; cursor:pointer; }
.modal-close:hover { color:var(--white); }
.modal h3 { font-size:24px; font-weight:800; margin-bottom:8px; }
.modal p { color:var(--gray); font-size:14px; margin-bottom:28px; }
.form-group { margin-bottom:14px; }
.form-group label { font-size:12px; color:var(--gray); font-weight:600; display:block; margin-bottom:6px; letter-spacing:.03em; }
.form-group input { width:100%; padding:14px 16px; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); border-radius:12px; color:var(--white); font-family:'Manrope',sans-serif; font-size:15px; outline:none; transition:border-color .2s; }
.form-group input:focus { border-color:var(--accent); }
.form-group input::placeholder { color:var(--gray2); }
.form-submit { width:100%; padding:16px; background:var(--accent); color:#06050B; border:none; border-radius:14px; font-family:'Manrope',sans-serif; font-weight:800; font-size:16px; cursor:pointer; margin-top:6px; transition:all .2s; }
.form-submit:hover { background:var(--accent-light); }
.form-micro { font-size:12px; color:var(--gray2); text-align:center; margin-top:12px; }

/* RESPONSIVE */
@media(max-width:900px) {
  .nav-links { display:none; }
  .burger { display:flex; }
  .nav-cta { display:none; }
  #float-cta { display:block; }
  .hero-inner { grid-template-columns:1fr; gap:40px; }
  .hero-stats { display:none; }
  .fears-grid, .partner-grid { grid-template-columns:1fr; }
  .steps-grid { grid-template-columns:1fr 1fr; }
  .founder-inner { grid-template-columns:1fr; }
  .lessons-grid { grid-template-columns:1fr 1fr; }
  .calc-results { grid-template-columns:1fr; }
  .calc-wrap { padding:28px; }
  .section { padding:70px 0; }
  .modal { padding:28px; }
}
@media(max-width:600px) {
  .steps-grid { grid-template-columns:1fr; }
  .lessons-grid { grid-template-columns:1fr; }
  .slide-card { flex:0 0 260px; }
  .founder-stats { flex-wrap:wrap; gap:20px; }
  .section { padding:56px 0; }
}
