/* ── HERO ── */
#hero{position:relative;padding:6rem 0 6rem;overflow:hidden;background:linear-gradient(180deg,#f0f7fd 0%,#fafaf9 40%,#fafaf9 100%)}
#hero::before{content:"";position:absolute;top:-260px;right:-120px;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(6,147,227,.12) 0%,rgba(6,147,227,.03) 40%,transparent 70%);pointer-events:none}
#hero::after{content:"";position:absolute;bottom:-80px;left:-60px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(6,147,227,.06) 0%,transparent 70%);pointer-events:none}
#hero .hero-bg-grid{position:absolute;inset:0;background-image:radial-gradient(rgba(6,147,227,.04) 1px,transparent 1px);background-size:40px 40px;pointer-events:none;mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,black 30%,transparent 70%)}
#hero .container{display:flex;align-items:center;justify-content:space-between;gap:64px;position:relative;z-index:1}
#hero .hero-text{flex:1;max-width:600px}
#hero .hero-kicker{display:inline-flex;align-items:center;gap:10px;font-size:.78rem;font-weight:700;color:rgb(var(--rgb-color-primary));margin-bottom:28px;font-family:var(--font-body);text-transform:uppercase;letter-spacing:.08em;background:rgba(var(--rgb-color-primary),.06);padding:8px 16px;border-radius:100px}
#hero .hero-kicker::before{content:"";width:8px;height:8px;border-radius:50%;background:rgb(var(--rgb-color-primary));animation:hero-pulse 2s ease-in-out infinite}
@keyframes hero-pulse{0%,100%{box-shadow:0 0 0 0 rgba(6,147,227,.4)}50%{box-shadow:0 0 0 10px rgba(6,147,227,0)}}
#hero .hero-title{font-size:3rem;font-weight:900;line-height:1.2;margin:0 0 20px;font-family:var(--font-heading);letter-spacing:-.02em;background:linear-gradient(135deg,#0693e3,#0ea5e9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
#hero .hero-desc{font-size:1.1rem;color:var(--color-text-muted);line-height:1.75;margin:0 0 40px;max-width:460px;position:relative;padding-left:20px;border-left:3px solid rgba(var(--rgb-color-primary),.3)}
#hero .hero-btns{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
#hero .hero-btns .btn-primary{display:inline-flex;align-items:center;gap:10px;padding:16px 36px;background:linear-gradient(135deg,#0693e3,#0284c7);color:#fff;font-weight:700;font-size:1rem;font-family:var(--font-body);border-radius:100px;box-shadow:0 6px 24px rgba(6,147,227,.3);transition:all .3s cubic-bezier(.4,0,.2,1);border:none;position:relative;overflow:hidden}
#hero .hero-btns .btn-primary::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#38bdf8,#0693e3);opacity:0;transition:opacity .3s ease}
#hero .hero-btns .btn-primary span{position:relative;z-index:1}
#hero .hero-btns .btn-primary svg{position:relative;z-index:1}
#hero .hero-btns .btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(6,147,227,.4);color:#fff}
#hero .hero-btns .btn-primary:hover::after{opacity:1}
#hero .hero-btns .btn-outline{display:inline-flex;align-items:center;padding:16px 32px;background:transparent;color:var(--color-text);font-weight:600;font-size:1rem;font-family:var(--font-body);border-radius:100px;border:2px solid var(--color-border);transition:all .3s cubic-bezier(.4,0,.2,1)}
#hero .hero-btns .btn-outline:hover{border-color:rgb(var(--rgb-color-primary));color:rgb(var(--rgb-color-primary));transform:translateY(-1px)}
#hero .hero-visual{flex-shrink:0;position:relative}
#hero .hero-visual::before{content:"";position:absolute;inset:-16px;border-radius:28px;background:linear-gradient(135deg,rgba(6,147,227,.06),rgba(6,147,227,.02));z-index:0}
#hero .hero-float{position:absolute;border-radius:50%;background:rgb(var(--rgb-color-primary));z-index:0}
#hero .hero-float.f1{width:12px;height:12px;top:10%;right:-20px;opacity:.5;animation:float-orb 3s ease-in-out infinite}
#hero .hero-float.f2{width:8px;height:8px;bottom:25%;left:-30px;opacity:.35;animation:float-orb 3s ease-in-out 1s infinite}
#hero .hero-float.f3{width:16px;height:16px;top:55%;right:-40px;opacity:.25;animation:float-orb 3s ease-in-out .5s infinite}
@keyframes float-orb{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-16px) scale(1.2)}}
#hero .hero-card{width:440px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:24px;padding:36px;box-shadow:0 20px 60px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);position:relative;z-index:1}
#hero .hero-card .card-bar{display:flex;align-items:center;gap:8px;margin-bottom:24px}
#hero .hero-card .card-bar span{width:12px;height:12px;border-radius:50%}
#hero .hero-card .card-bar span:nth-child(1){background:#f43f5e}
#hero .hero-card .card-bar span:nth-child(2){background:#fbbf24}
#hero .hero-card .card-bar span:nth-child(3){background:#22c55e}
#hero .hero-card .lang-pair{display:flex;align-items:center;gap:16px;margin-bottom:24px}
#hero .hero-card .lang{flex:1;text-align:center}
#hero .hero-card .lang .lang-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);margin-bottom:8px;font-family:var(--font-body);font-weight:600}
#hero .hero-card .lang .lang-name{font-size:1.4rem;font-weight:800;font-family:var(--font-heading);color:var(--color-text)}
#hero .hero-card .lang-swap{flex-shrink:0;width:40px;height:40px;border-radius:50%;background:var(--color-bg);border:1px solid var(--color-border);display:flex;align-items:center;justify-content:center;color:rgb(var(--rgb-color-primary));font-size:1.1rem;transition:all var(--transition)}
#hero .hero-card .lang-swap:hover{background:rgb(var(--rgb-color-primary));color:#fff;border-color:rgb(var(--rgb-color-primary));transform:rotate(180deg)}
#hero .hero-card .trans-text{background:var(--color-bg);border-radius:14px;padding:22px;font-size:.95rem;line-height:1.7;color:var(--color-text);border:1px solid var(--color-border);min-height:80px;position:relative}
#hero .hero-card .trans-text::after{content:"";position:absolute;bottom:12px;right:16px;width:36px;height:8px;background:linear-gradient(90deg,transparent,var(--color-bg) 60%);pointer-events:none}
#hero .hero-card .trans-meta{display:flex;justify-content:space-between;align-items:center;margin-top:16px}
#hero .hero-card .trans-dots{display:flex;gap:5px}
#hero .hero-card .trans-dots span{width:8px;height:8px;border-radius:50%;background:var(--color-border);transition:all var(--transition)}
#hero .hero-card .trans-dots span.active{background:rgb(var(--rgb-color-primary));box-shadow:0 0 8px rgba(var(--rgb-color-primary),.4)}
#hero .hero-card .trans-speed{font-size:.75rem;color:var(--color-text-muted);font-weight:500}

/* ── FEATURES ── */
#features .features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
#features .feature-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px;padding:32px 28px;transition:all var(--transition)}
#features .feature-card:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,.05)}
#features .feature-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;font-size:1.3rem;background:rgba(var(--rgb-color-primary),.06);color:rgb(var(--rgb-color-primary))}
#features .feature-card h3{font-size:1.1rem;font-weight:800;color:var(--color-text);margin:0 0 8px;font-family:var(--font-heading)}
#features .feature-card p{font-size:.9rem;color:var(--color-text-muted);line-height:1.6;margin:0}

/* ── WHY US ── */
#why-us{background:var(--color-surface);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}
#why-us .section-header{text-align:center;margin:0 auto}
#why-us .why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
#why-us .why-item{text-align:center;padding:32px 20px;border-radius:16px;transition:all var(--transition)}
#why-us .why-item:hover{background:var(--color-bg)}
#why-us .why-num{font-family:var(--font-heading);font-size:2.5rem;font-weight:800;color:rgb(var(--rgb-color-primary));line-height:1;margin-bottom:12px}
#why-us .why-item h3{font-size:1rem;font-weight:800;color:var(--color-text);margin:0 0 6px;font-family:var(--font-heading)}
#why-us .why-item p{font-size:.85rem;color:var(--color-text-muted);line-height:1.55;margin:0}

/* ── STEPS ── */
#steps .steps-row{display:flex;align-items:flex-start;justify-content:space-between;gap:32px;position:relative}
#steps .steps-row::before{content:"";position:absolute;top:36px;left:55px;right:55px;height:1px;background:var(--color-border)}
#steps .step{flex:1;text-align:center;position:relative;z-index:1}
#steps .step-icon{width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;background:var(--color-surface);border:1px solid var(--color-border);font-size:1.4rem;color:rgb(var(--rgb-color-primary));transition:all var(--transition);position:relative;z-index:2}
#steps .step:hover .step-icon{box-shadow:0 0 0 8px rgba(var(--rgb-color-primary),.06);border-color:rgb(var(--rgb-color-primary))}
#steps .step h3{font-size:1.05rem;font-weight:800;color:var(--color-text);margin:0 0 6px;font-family:var(--font-heading)}
#steps .step p{font-size:.85rem;color:var(--color-text-muted);line-height:1.55;margin:0}

/* ── DOWNLOAD ── */
#download .platform-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
#download .platform-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px;padding:32px 20px;text-align:center;transition:all var(--transition);cursor:pointer}
#download .platform-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.05);border-color:rgb(var(--rgb-color-primary))}
#download .platform-card .pf-icon{width:56px;height:56px;border-radius:14px;background:rgba(var(--rgb-color-primary),.06);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:1.5rem;color:rgb(var(--rgb-color-primary))}
#download .platform-card h3{font-size:1rem;font-weight:800;color:var(--color-text);margin:0 0 4px;font-family:var(--font-heading)}
#download .platform-card .ver{font-size:.78rem;color:var(--color-text-muted);margin-bottom:16px}
#download .platform-card .platform-btn{display:inline-block;padding:9px 22px;background:rgb(var(--rgb-color-primary));color:#fff;border-radius:100px;font-size:.82rem;font-weight:600;box-shadow:0 2px 8px rgba(var(--rgb-color-primary),.2);transition:all var(--transition)}
#download .platform-card .platform-btn:hover{filter:brightness(1.08);box-shadow:0 4px 14px rgba(var(--rgb-color-primary),.3);color:#fff}

/* ── STATS ── */
#stats{background:var(--color-surface);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}
#stats .section-header{text-align:center;margin:0 auto}
#stats .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
#stats .stat-item{text-align:center;padding:24px}
#stats .stat-num{font-family:var(--font-heading);font-size:3.2rem;font-weight:800;color:rgb(var(--rgb-color-primary));line-height:1;margin-bottom:8px;letter-spacing:-.02em}
#stats .stat-label{font-size:.88rem;color:var(--color-text-muted);font-weight:500}

/* ── CTA ── */
#cta-banner{text-align:center}
#cta-banner .cta-card{max-width:640px;margin:0 auto;padding:56px 48px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:20px;box-shadow:0 4px 24px rgba(0,0,0,.03)}
#cta-banner .cta-card h2{font-size:2.25rem;font-weight:800;color:var(--color-text);margin:0 0 12px;line-height:1.15;font-family:var(--font-heading)}
#cta-banner .cta-card p{font-size:1.05rem;color:var(--color-text-muted);margin:0 0 28px}
#cta-banner .cta-card .btn-cta{display:inline-flex;align-items:center;gap:8px;padding:15px 36px;background:rgb(var(--rgb-color-primary));color:#fff;font-weight:600;font-size:.95rem;font-family:var(--font-body);border-radius:100px;box-shadow:0 4px 16px rgba(var(--rgb-color-primary),.25);transition:all var(--transition)}
#cta-banner .cta-card .btn-cta:hover{filter:brightness(1.08);box-shadow:0 6px 24px rgba(var(--rgb-color-primary),.35);transform:translateY(-1px);color:#fff}

/* ── FAQ ── */
#faqsu-faq-list{max-width:800px;margin:0 auto}
#faqsu-faq-list .faqsu-faq-single{border-bottom:1px solid var(--color-border);padding:24px 0}
#faqsu-faq-list .faqsu-faq-single:last-child{border-bottom:none}
#faqsu-faq-list .faqsu-faq-question{font-size:1.05rem;font-weight:800;color:var(--color-text);margin:0 0 10px;cursor:pointer;font-family:var(--font-heading)}
#faqsu-faq-list .faqsu-faq-question:hover{color:rgb(var(--rgb-color-primary))}
#faqsu-faq-list .faqsu-faq-answare{font-size:.92rem;color:var(--color-text-muted);line-height:1.7;margin:0}

/* ── NEWS ── */
#news .news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
#news .news-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px;overflow:hidden;transition:all var(--transition)}
#news .news-item:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,.05)}
#news .news-thumb{width:100%;height:200px;overflow:hidden}
#news .news-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
#news .news-item:hover .news-thumb img{transform:scale(1.04)}
#news .news-content{padding:22px}
#news .news-meta{display:flex;align-items:center;gap:10px;margin-bottom:10px}
#news .news-date{font-size:.78rem;color:var(--color-text-muted)}
#news .news-cat{font-size:.72rem;color:rgb(var(--rgb-color-primary));font-weight:600;background:rgba(var(--rgb-color-primary),.06);padding:3px 10px;border-radius:100px}
#news .news-title{font-size:1.05rem;font-weight:800;color:var(--color-text);line-height:1.35;margin:0 0 8px;font-family:var(--font-heading);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#news .news-item:hover .news-title{color:rgb(var(--rgb-color-primary))}
#news .news-excerpt{font-size:.85rem;color:var(--color-text-muted);line-height:1.55;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

@media (max-width:768px){
	#hero{padding:3.5rem 0 3rem}
	#hero .container{flex-direction:column;gap:48px}
	#hero .hero-text{max-width:100%}
	#hero .hero-title{font-size:1.8rem}
	#hero .hero-desc{padding-left:16px;max-width:100%}
	#hero .hero-card{width:100%;max-width:440px}
	#hero .hero-visual::before{display:none}
	#hero .hero-bg-grid{background-size:28px 28px}
	#features .features-grid{grid-template-columns:1fr}
	#why-us .why-grid{grid-template-columns:repeat(2,1fr)}
	#steps .steps-row{flex-direction:column;align-items:center;gap:40px}
	#steps .steps-row::before{display:none}
	#download .platform-grid{grid-template-columns:repeat(2,1fr)}
	#stats .stats-grid{grid-template-columns:repeat(2,1fr)}
	#stats .stat-num{font-size:2.4rem}
	#cta-banner .cta-card{padding:40px 24px}
	#cta-banner .cta-card h2{font-size:1.7rem}
	#news .news-grid{grid-template-columns:1fr}
	#faqsu-faq-list .faqsu-faq-single{padding:20px 0}
}
@media (max-width:480px){
	#why-us .why-grid{grid-template-columns:1fr}
	#download .platform-grid{grid-template-columns:1fr}
	#stats .stats-grid{grid-template-columns:1fr}
}
