:root{--primary:#dc2626;--primary-hover:#b91c1c;--text-dark:#1f2937;--text-muted:#4b5563;--bg-pink-light:#fff5f0;--bg-gray:#fdf8f3;--white:#fff;--font:var(--font-nunito), "Nunito", sans-serif;--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--shadow-sm:0 4px 6px -1px #0000000d;--shadow-md:0 10px 25px -5px #0000001a}.landing-page{font-family:var(--font);color:var(--text-dark);background-color:var(--bg-gray);min-height:100vh;line-height:1.6;overflow-x:hidden}.landing-page *{box-sizing:border-box;margin:0;padding:0}.landing-page .container{max-width:1200px;margin:0 auto;padding:0 20px}.landing-page .background-mesh{z-index:-1;background:linear-gradient(#fffdf9 0%,#fef9f2 40%,#fdf5eb 100%);width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.landing-page .blob{filter:blur(80px);opacity:.5;border-radius:50%;position:absolute}.landing-page .blob.pink{background:#fef3c7;width:500px;height:500px;top:-100px;right:-100px}.landing-page .blob.blue{opacity:.3;background:#fde9d0;width:600px;height:600px;top:200px;left:-200px}.landing-page h1,.landing-page h2,.landing-page h3,.landing-page h4{font-weight:800;line-height:1.2}.landing-page p{color:var(--text-muted);font-size:16px}.landing-page .btn{font-weight:700;font-family:var(--font);cursor:pointer;border:none;border-radius:50px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:16px;text-decoration:none;transition:all .3s;display:inline-flex}.landing-page .btn-primary{background-color:var(--primary);color:var(--white);box-shadow:0 4px 14px #ef444466}.landing-page .btn-primary:hover{background-color:var(--primary-hover);transform:translateY(-2px)}.landing-page .btn-outline{color:var(--text-dark);background-color:#0000;border:1px solid #e5e7eb}.landing-page .btn-outline:hover{border-color:var(--text-dark)}.landing-page .btn-large{padding:14px 28px;font-size:18px}.landing-page .btn-play{color:var(--text-dark);box-shadow:var(--shadow-sm);background-color:#fff;border-radius:50px;padding:10px 24px 10px 10px;font-weight:700}.landing-page .btn-play .play-icon{background-color:var(--bg-pink-light);width:36px;height:36px;color:var(--primary);border-radius:50%;justify-content:center;align-items:center;font-size:14px;display:flex}.landing-page .header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;background:#fffc;border-bottom:1px solid #0000000d;padding:20px 0;position:sticky;top:0}.landing-page .header .container{justify-content:space-between;align-items:center;display:flex}.landing-page .logo{align-items:center;gap:10px;text-decoration:none;display:flex}.landing-page .logo-icon{font-size:32px}.landing-page .logo-text h1{color:var(--primary);margin:0;font-size:20px}.landing-page .logo-text p{color:var(--text-muted);margin:0;font-size:12px}.landing-page .nav-links{gap:30px;display:flex}.landing-page .nav-links a{color:var(--text-dark);font-size:15px;font-weight:600;text-decoration:none;position:relative}.landing-page .nav-links a.active{color:var(--primary)}.landing-page .nav-links a.active:after{content:"";background-color:var(--primary);border-radius:2px;width:100%;height:3px;position:absolute;bottom:-6px;left:0}.landing-page .auth-buttons{gap:15px;display:flex}.landing-page .hero{justify-content:space-between;align-items:center;gap:40px;padding:80px 20px;display:flex}.landing-page .hero-content{flex:1;max-width:550px}.landing-page .hero-title{color:var(--text-dark);margin-bottom:20px;font-size:48px;position:relative}.landing-page .hero-title .highlight{color:var(--primary)}.landing-page .hero-title .underline{z-index:-1;width:300px;position:absolute;bottom:-10px;left:0}.landing-page .hero-desc{margin-bottom:18px;font-size:18px}.landing-page .hero-topic-link{background:var(--white);width:fit-content;box-shadow:var(--shadow-sm);color:var(--primary);text-underline-offset:3px;border:1px solid #dc262629;border-radius:999px;align-items:center;gap:.5rem;margin-bottom:28px;padding:.65rem 1rem;font-weight:800;line-height:1.35;text-decoration:underline;display:inline-flex}.landing-page .hero-topic-link:after{content:"";font-family:"Font Awesome 6 Free";font-size:.85rem;font-weight:900}.landing-page .hero-actions{gap:20px;margin-bottom:40px;display:flex}.landing-page .social-proof{align-items:center;gap:15px;display:flex}.landing-page .avatars{display:flex}.landing-page .avatars img{border:2px solid #fff;border-radius:50%;width:40px;height:40px;margin-left:-12px}.landing-page .avatars img:first-child{margin-left:0}.landing-page .social-proof p{color:var(--text-dark);font-size:14px;font-weight:600}.landing-page .hero-image{flex:1;justify-content:center;display:flex;position:relative}.landing-page .hero-image img{border-radius:20px;width:135%;max-width:135%;height:auto;margin-top:10px;margin-right:-20%}.landing-page .hero-bubble{box-shadow:var(--shadow-md);z-index:10;background:#fff;border:2px solid #fca5a5;border-radius:40px;flex-direction:column;align-items:center;padding:15px 30px;display:flex;position:absolute;top:-20px;left:-10px}.landing-page .hero-bubble .jp{text-align:center;font-size:24px;font-weight:800;line-height:1.3}.landing-page .hero-bubble .pronounce{color:var(--primary);margin-top:5px;font-size:16px;font-weight:700}.landing-page .features{z-index:10;margin-top:-40px;padding:40px 20px;position:relative}.landing-page .feature-cards{border-radius:var(--radius-lg);box-shadow:var(--shadow-md);background:#fff;grid-template-columns:repeat(4,1fr);gap:20px;padding:30px;display:grid}.landing-page .card{text-align:center;padding:20px 10px}.landing-page .icon-wrapper{border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;margin:0 auto 15px;font-size:24px;display:flex}.landing-page .icon-wrapper.pink-light{background-color:var(--bg-pink-light);color:var(--primary)}.landing-page .icon-wrapper.red-light{color:var(--primary);background-color:#fee2e2}.landing-page .card h3{margin-bottom:10px;font-size:18px}.landing-page .card p{font-size:14px}.landing-page .how-it-works{padding:80px 20px}.landing-page .section-header{text-align:center;margin-bottom:50px}.landing-page .badge{background-color:var(--bg-pink-light);color:var(--primary);text-transform:uppercase;letter-spacing:1px;border-radius:20px;padding:5px 15px;font-size:14px;font-weight:700}.landing-page .section-title{margin-top:15px;font-size:36px}.landing-page .content-wrapper{justify-content:space-between;align-items:center;gap:60px;display:flex}.landing-page .image-with-bubbles{flex:1;padding:30px 40px;position:relative;overflow:visible}.landing-page .image-with-bubbles img{border-radius:var(--radius-lg);max-width:100%;display:block}.landing-page .bubble{z-index:10;background:#fff;border:1.5px solid;border-radius:20px;flex-direction:column;align-items:center;padding:12px 24px;display:flex;position:absolute;box-shadow:0 4px 15px #00000014}.landing-page .bubble-1{border-color:#6ee7b7;top:-5%;left:55%;transform:translate(-50%)}.landing-page .bubble-2{border-color:#93c5fd;top:35%;left:-10%}.landing-page .bubble-3{border-color:#fca5a5;top:55%;right:-5%}.landing-page .bubble .jp{color:#1a202c;font-size:22px;font-weight:900;line-height:1.2}.landing-page .bubble .pronounce{color:#718096;margin:4px 0;font-size:13px}.landing-page .bubble .vi{color:#2d3748;font-size:15px;font-weight:700}.landing-page .steps-list{flex-direction:column;flex:1;gap:30px;display:flex}.landing-page .step-item{border-radius:var(--radius-md);background:#fff;border:2px solid #fee2e2;align-items:flex-start;gap:20px;padding:20px;display:flex;position:relative}.landing-page .step-number{background-color:var(--primary);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;font-weight:800;display:flex}.landing-page .step-content h3{color:var(--primary);margin-bottom:5px;font-size:20px}.landing-page .step-icon{color:var(--primary);opacity:.5;margin-left:auto;font-size:30px}.landing-page .callout{background-color:#fecaca;border-radius:50px;align-items:center;gap:15px;margin-top:10px;padding:15px 25px;display:flex}.landing-page .callout-icon{background-color:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:18px;display:flex}.landing-page .callout p{color:var(--text-dark);margin:0;font-size:16px}.landing-page .guide-pillars{z-index:5;padding:72px 20px 48px;position:relative}.landing-page .guide-pillars-title{max-width:28rem;margin-left:auto;margin-right:auto;font-size:clamp(1.5rem,3.5vw,2.25rem)}.landing-page .guide-pillars-sub{color:var(--text-muted);max-width:36rem;margin:.5rem auto 0;font-size:1rem;font-weight:600;line-height:1.6}.landing-page .guide-pillars .section-header{margin-bottom:2.25rem}.landing-page .guide-pillars-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));align-items:stretch;gap:1.25rem;display:grid}.landing-page .guide-pillar-card{background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);color:inherit;border:1px solid #dc262614;align-items:flex-start;gap:1rem;padding:1.35rem 1.25rem;text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s;display:flex}.landing-page .guide-pillar-card:hover{border-color:#dc262633;transform:translateY(-4px);box-shadow:0 14px 32px -8px #dc26262e}.landing-page .guide-pillar-card:focus-visible{outline:2px solid var(--primary);outline-offset:3px}.landing-page .guide-pillar-icon{flex-shrink:0;width:52px;height:52px;margin:0;font-size:1.25rem}.landing-page .pillar-copy{text-align:left;flex:1;min-width:0}.landing-page .pillar-copy h3{color:var(--text-dark);margin:0 0 .4rem;font-size:1.05rem;line-height:1.3}.landing-page .pillar-copy p{color:var(--text-muted);margin:0;font-size:.875rem;font-weight:600;line-height:1.55}.landing-page .pillar-arrow{background:var(--bg-pink-light);width:2rem;height:2rem;color:var(--primary);border-radius:50%;flex-shrink:0;justify-content:center;align-self:center;align-items:center;font-size:.85rem;transition:transform .2s,background .2s;display:flex}.landing-page .guide-pillar-card:hover .pillar-arrow{background:#fee2e2;transform:translate(4px)}.landing-page .stats{background-color:#fdf0dc99;border-top:1px solid #efb46433;padding:40px 0}.landing-page .stats-grid{grid-template-columns:repeat(4,1fr);gap:30px;display:grid}.landing-page .stat-item{align-items:center;gap:15px;display:flex}.landing-page .stat-icon{color:var(--primary);font-size:32px}.landing-page .stat-info h4{margin-bottom:2px;font-size:24px}.landing-page .stat-info p{margin:0;font-size:14px}@media (max-width:992px){.landing-page .hero{text-align:center;flex-direction:column}.landing-page .hero-title .underline{left:50%;transform:translate(-50%)}.landing-page .hero-actions{justify-content:center}.landing-page .hero-topic-link{margin-left:auto;margin-right:auto}.landing-page .social-proof{justify-content:center}.landing-page .feature-cards{grid-template-columns:repeat(2,1fr)}.landing-page .content-wrapper{flex-direction:column}.landing-page .stats-grid{grid-template-columns:repeat(2,1fr)}.landing-page .guide-pillars-grid{grid-template-columns:1fr;max-width:520px;margin:0 auto}}@media (max-width:768px){.landing-page .nav-links,.landing-page .auth-buttons{display:none}.landing-page .feature-cards,.landing-page .stats-grid{grid-template-columns:1fr}}
