.hp-container{margin:0 auto}.hp-hero{text-align:center;padding:72px 24px 56px;background:radial-gradient(circle at 15% 50%, rgba(0, 102, 204, 0.08) 0%, transparent 25%),radial-gradient(circle at 85% 30%, rgba(118, 75, 162, 0.08) 0%, transparent 25%),radial-gradient(circle at 50% 80%, rgba(0, 163, 0, 0.06) 0%, transparent 20%),linear-gradient(135deg, #f0f8ff 0%, #f5f0ff 50%, #f0fff4 100%);border-radius:0 0 24px 24px;margin-bottom:0;position:relative;overflow:hidden}.hp-hero::before{content:"";position:absolute;top:-60px;right:-60px;width:200px;height:200px;background:radial-gradient(circle, rgba(0, 102, 204, 0.1) 0%, transparent 70%);border-radius:50%;pointer-events:none}.hp-hero::after{content:"";position:absolute;bottom:-40px;left:-40px;width:150px;height:150px;background:radial-gradient(circle, rgba(118, 75, 162, 0.1) 0%, transparent 70%);border-radius:50%;pointer-events:none}.hp-hero__title,.hp-app-banner__title,.hp-how-it-works__step-title,.hp-category-section__title,.scroll-showcase__title{text-wrap:balance}.hp-hero__subtitle,.hp-app-banner__subtitle,.hp-how-it-works__step-text,.hp-category-section__subtitle,.scroll-showcase__description{text-wrap:pretty}.hp-hero__title{font-size:3rem;font-weight:700;color:var(--text-color, #333);margin:0 0 20px;line-height:1.2;letter-spacing:-0.01em}.hp-hero__title-line{display:block}.hp-hero__title--accent{background:linear-gradient(135deg, var(--primary-color, #0066cc), var(--secondary-color, #764ba2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hp-hero__subtitle{font-size:1.15rem;color:var(--text-secondary, #495057);max-width:640px;margin:0 auto 32px;line-height:1.7}.hp-hero__tutorial-btn{display:inline-flex;align-items:center;gap:7px;background:transparent;border:1px solid rgba(0, 102, 204, 0.4);color:var(--primary-color, #0066cc);border-radius:999px;padding:9px 18px;font-size:15px;font-weight:600;cursor:pointer;transition:background .15s ease}.hp-hero__tutorial-btn:hover{background:rgba(0, 102, 204, 0.08)}.hp-hero__cta-group{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.hp-hero__cta{display:inline-flex;align-items:center;gap:8px;padding:14px 32px;background:var(--primary-color, #0066cc);color:#fff;font-size:1rem;font-weight:600;border:none;border-radius:12px;cursor:pointer;transition:all .2s ease;font-family:inherit;box-shadow:0 4px 14px rgba(0, 102, 204, 0.3)}.hp-hero__cta:hover{background:var(--primary-dark, #004a99);transform:translateY(-1px);box-shadow:0 6px 20px rgba(0, 102, 204, 0.4)}.hp-hero__cta--secondary{display:inline-flex;align-items:center;gap:8px;padding:14px 32px;background:transparent;color:var(--text-color, #333);font-size:1rem;font-weight:600;border:2px solid var(--border-color, #e1e5e9);border-radius:12px;cursor:pointer;transition:all .2s ease;text-decoration:none;font-family:inherit}.hp-hero__cta--secondary:hover{border-color:var(--primary-color, #0066cc);color:var(--primary-color, #0066cc);background:rgba(0, 102, 204, 0.04)}.scroll-showcase{position:relative;background:linear-gradient(180deg, #f8fafc 0%, #fff 100%)}.scroll-showcase__sticky{position:sticky;top:0;display:flex;align-items:center;justify-content:center;padding:24px 48px;min-height:60vh;transition:min-height .3s ease}.scroll-showcase__sticky.is-scrolling{min-height:100vh}.scroll-showcase__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:100px;max-width:1600px;width:100%}.scroll-showcase__image-container{position:relative;width:320px;height:662px;flex-shrink:0}.scroll-showcase__image-wrapper{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transform:translateY(40px);transition:opacity .5s ease,transform .5s ease;display:flex;align-items:center;justify-content:center}.scroll-showcase__image-wrapper.active{opacity:1;transform:translateY(0) scale(1)}.scroll-showcase__image-wrapper.active .scroll-showcase__image{animation:imageGlow .6s ease-out forwards}@keyframes imageGlow{0%{transform:scale(0.95);box-shadow:0 20px 60px rgba(0, 0, 0, 0.15)}50%{transform:scale(1.02)}100%{transform:scale(1);box-shadow:0 30px 80px rgba(0, 0, 0, 0.25),0 15px 40px rgba(0, 0, 0, 0.15),0 0 60px rgba(100, 100, 255, 0.08)}}.scroll-showcase__image{width:100%;height:auto;border-radius:55px;border:1px solid rgba(255, 255, 255, 0.2);box-shadow:0 30px 80px rgba(0, 0, 0, 0.25),0 15px 40px rgba(0, 0, 0, 0.15),0 0 60px rgba(100, 100, 255, 0.08);transition:transform .3s ease,box-shadow .3s ease}.scroll-showcase__image:hover{transform:scale(1.02);box-shadow:0 35px 90px rgba(0, 0, 0, 0.3),0 20px 50px rgba(0, 0, 0, 0.18),0 0 80px rgba(100, 100, 255, 0.12)}.scroll-showcase__image-placeholder{width:100%;height:0;padding-bottom:200%;border-radius:36px;background:linear-gradient(135deg, #f0f0f0 0%, #e0e0e0 100%)}.scroll-showcase__text{max-width:480px}.scroll-showcase__title{font-size:2.5rem;font-weight:800;color:var(--text-color, #333);margin:0 0 20px;line-height:1.2}.scroll-showcase__description{font-size:1.25rem;color:var(--text-secondary, #666);line-height:1.7;margin:0 0 32px}.scroll-showcase__indicators{display:flex;gap:12px}.scroll-showcase__indicator{width:10px;height:10px;border-radius:50%;background:#ddd;transition:background .3s ease,transform .3s ease}.scroll-showcase__indicator.active{background:var(--primary-color, #0066cc);transform:scale(1.3)}@media(max-width: 1024px){.scroll-showcase__content{gap:48px}.scroll-showcase__image-container{width:260px;height:538px}.scroll-showcase__title{font-size:2rem}.scroll-showcase__description{font-size:1.1rem}}@media(max-width: 768px){.scroll-showcase__sticky{padding:16px;min-height:60vh}.scroll-showcase__sticky.is-scrolling{min-height:100vh}.scroll-showcase__content{flex-direction:column;gap:24px;text-align:center;justify-content:center;margin-inline-start:0;height:100%}.scroll-showcase__image-container{width:280px;height:580px}.scroll-showcase__image{border-radius:48px}.scroll-showcase__text{padding:0 16px}.scroll-showcase__title{font-size:1.5rem;margin-bottom:12px}.scroll-showcase__description{font-size:1rem;margin-bottom:20px}.scroll-showcase__indicators{justify-content:center}}.hp-how-it-works{padding:64px 24px;text-align:center;background:radial-gradient(circle at 0% 50%, rgba(0, 163, 0, 0.05) 0%, transparent 30%),radial-gradient(circle at 100% 50%, rgba(0, 102, 204, 0.05) 0%, transparent 30%),linear-gradient(180deg, #fff 0%, #f8fafc 50%, #fff 100%);position:relative}.hp-how-it-works__title{font-size:2rem;font-weight:700;color:var(--text-color, #333);margin:0 0 48px;letter-spacing:-0.01em}.hp-how-it-works__steps{display:flex;align-items:flex-start;justify-content:center;gap:24px;max-width:1100px;margin:0 auto}.hp-how-it-works__step{flex:1;text-align:center;padding:0 12px}.hp-how-it-works__step-number{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg, var(--primary-color, #0066cc), var(--secondary-color, #764ba2));color:#fff;font-size:1.25rem;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 4px 12px rgba(0, 102, 204, 0.25)}.hp-how-it-works__step-title{font-size:1.1rem;font-weight:600;color:var(--text-color, #333);margin:0 0 8px}.hp-how-it-works__step-text{font-size:.9rem;color:var(--text-secondary, #495057);line-height:1.6;margin:0 auto;max-width:300px}.hp-how-it-works__connector{width:48px;height:2px;background:var(--border-color, #e1e5e9);margin-top:24px;flex-shrink:0}.hp-category-section{padding:48px 24px 0;background:radial-gradient(ellipse at 50% 0%, rgba(0, 102, 204, 0.03) 0%, transparent 50%)}.hp-category-section--alt{background:radial-gradient(ellipse at 50% 0%, rgba(118, 75, 162, 0.04) 0%, transparent 50%),var(--bg-color, #f8f9fa)}.hp-category-section__header{text-align:center;margin-bottom:24px}.hp-category-section__badge{display:inline-block;padding:4px 14px;border-radius:20px;color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px}.hp-category-section__title{font-size:2rem;font-weight:700;color:var(--text-color, #333);margin:0 0 12px;letter-spacing:-0.01em}.hp-category-section__subtitle{font-size:1.05rem;color:var(--text-secondary, #495057);max-width:600px;margin:0 auto;line-height:1.7}.hp-app-banner{text-align:center;padding:64px 24px;background:radial-gradient(circle at 90% 20%, rgba(0, 102, 204, 0.1) 0%, transparent 30%),radial-gradient(circle at 10% 80%, rgba(118, 75, 162, 0.1) 0%, transparent 30%),linear-gradient(135deg, #f0f8ff 0%, #f5f0ff 50%, #f0fff4 100%);border-radius:24px;margin:24px 16px;position:relative;overflow:hidden}.hp-app-banner__title{font-size:2rem;font-weight:700;color:var(--text-color, #333);margin:0 0 12px}.hp-app-banner__subtitle{font-size:1.05rem;color:var(--text-secondary, #495057);max-width:520px;margin:0 auto 32px;line-height:1.7}.hp-app-banner__badges{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.hp-app-banner__badge img{height:48px;transition:transform .2s ease}.hp-app-banner__badge:hover img{transform:scale(1.05)}@media(max-width: 768px){.hp-hero{padding:48px 16px 40px}.hp-hero__title{font-size:2rem}.hp-hero__subtitle{font-size:1rem;max-width:100%}.hp-category-section__title{font-size:1.5rem}.hp-hero__cta-group{flex-direction:column;gap:12px}.hp-hero__cta,.hp-hero__cta--secondary{width:100%;justify-content:center}.hp-how-it-works{padding:48px 16px}.hp-how-it-works__steps{flex-direction:column;gap:32px;align-items:center}.hp-how-it-works__step{text-align:center}.hp-how-it-works__connector{display:none}.hp-how-it-works__title{font-size:1.5rem}.hp-app-banner{padding:48px 16px}.hp-app-banner__title{font-size:1.5rem}.hp-app-banner__badges{flex-direction:column;align-items:center}}@media(max-width: 480px){.hp-hero{padding:32px 12px 32px}.hp-hero__title{font-size:1.6rem}}
