:root{
  --blue:#0c7cf3; --blue2:#17a8ff; --navy:#102b54; --text:#14274a;
  --muted:#657799; --line:#d9e7f7; --soft:#f4f8fd; --green:#1fc65e;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--text);background:#fff}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
button{font:inherit}
.container{width:min(1400px,calc(100% - 48px));margin:auto}

.site-header{height:72px;background:rgba(255,255,255,.97);box-shadow:0 1px 0 rgba(18,55,99,.08);position:sticky;top:0;z-index:40}
.nav{height:72px;display:flex;align-items:center;gap:32px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:48px;height:48px;border-radius:12px;box-shadow:0 4px 12px rgba(12,124,243,.2)}
.brand div{display:flex;flex-direction:column}
.brand strong{font-size:23px;color:#152b50;line-height:1.05}
.brand span{font-size:13px;color:#48648d;margin-top:4px}
.menu{margin-left:auto;display:flex;align-self:stretch}
.menu a{min-width:112px;padding:14px 16px 8px;text-align:center;position:relative;display:flex;flex-direction:column;justify-content:center}
.menu a b{font-size:14px}
.menu a span{font-size:11px;color:#50698d;margin-top:4px}
.menu a.active:after,.menu a:hover:after{content:"";position:absolute;left:20px;right:20px;bottom:0;height:3px;border-radius:3px;background:var(--blue)}
.menu a.active b,.menu a:hover b{color:var(--blue)}
.lang-switch{background:#eaf2ff;border-radius:14px;padding:5px;display:flex;gap:4px}
.lang-switch button{border:0;background:transparent;padding:8px 13px;border-radius:10px;font-weight:700;color:#446286;cursor:pointer}
.lang-switch button.active{background:white;color:var(--blue);box-shadow:0 2px 8px rgba(32,83,145,.12)}

.hero{position:relative;background:
  linear-gradient(90deg,rgba(6,28,55,.97) 0%,rgba(7,35,68,.93) 43%,rgba(11,47,85,.83) 100%),
  url("assets/slide-split-clean.webp") center/cover no-repeat;color:white;overflow:hidden}
.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 83% 25%,rgba(20,150,255,.23),transparent 34%)}
.hero-grid{position:relative;z-index:2;min-height:430px;display:grid;grid-template-columns:.82fr 1.18fr;align-items:center;gap:34px;padding:38px 0 28px}
.hero-copy h1{font-size:62px;line-height:.95;margin:0 0 8px;letter-spacing:-2px}
.hero-copy h2{font-size:25px;color:#18a8ff;margin:0 0 10px}
.hero-copy>p{font-size:17px;color:#d8e7f8;margin:0 0 22px}
.hero-features{display:flex;gap:22px;flex-wrap:wrap;margin:12px 0 26px}
.hero-feature{width:94px;text-align:center}
.hf-icon,.mini-icon{display:grid;place-items:center;color:white;font-weight:800}
.hf-icon{width:44px;height:44px;border-radius:11px;margin:0 auto 8px;font-size:23px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.24),0 5px 12px rgba(0,0,0,.2)}
.green .hf-icon,.mini-icon.green{background:linear-gradient(#2fd76c,#13af4a)}
.orange .hf-icon,.mini-icon.orange{background:linear-gradient(#ffab32,#f17c00)}
.blue .hf-icon,.mini-icon.blue{background:linear-gradient(#2f9fff,#0872dc)}
.purple .hf-icon,.mini-icon.purple{background:linear-gradient(#9d66ff,#6f36ea)}
.red .hf-icon,.mini-icon.red{background:linear-gradient(#ff5a62,#ef2632)}
.hero-feature b{display:block;font-size:12px;white-space:nowrap}
.hero-feature span{display:block;font-size:11px;color:#c8d8ed;margin-top:3px}
.hero-actions{display:flex;gap:16px;margin-bottom:14px}
.btn{height:60px;border-radius:12px;display:inline-flex;align-items:center;gap:15px;padding:0 26px;font-weight:700}
.btn-icon{font-size:27px}
.btn span span,.btn small{display:block}
.btn b{display:block;font-size:17px}
.btn small{font-size:12px;font-weight:500;margin-top:2px}
.btn-download{background:linear-gradient(180deg,#1eb5ff,#0780ef);box-shadow:0 10px 28px rgba(0,129,239,.28)}
.btn-donate{background:linear-gradient(180deg,#7690b2,#4f6687);box-shadow:0 10px 28px rgba(0,0,0,.16)}
.hero-meta{font-size:12px;color:#d3e2f2;line-height:1.65}
.hero-device{padding:8px}
.device-frame{background:#071421;border:2px solid #87a8c7;border-radius:34px;padding:17px;box-shadow:0 24px 50px rgba(0,0,0,.38)}
.device-frame img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:20px}

.gallery-section{background:#fff;padding:18px 0 8px;border-bottom:1px solid #edf2f8}
.slider{position:relative}
.slider-track{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:0 30px}
.thumb{margin:0;text-align:center;transition:.2s transform,.2s border-color}
.thumb img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;border:2px solid #dbe6f4;box-shadow:0 3px 12px rgba(31,76,128,.1)}
.thumb.active img{border-color:#0e8eff;box-shadow:0 0 0 3px rgba(14,142,255,.16)}
.thumb div{font-size:13px;color:#22426f;padding:9px 2px}
.slider-nav{position:absolute;top:39%;z-index:3;width:44px;height:44px;border-radius:50%;border:0;background:#eff5fc;color:#1386f4;font-size:32px;line-height:1;cursor:pointer}
.slider-nav.prev{left:-5px}.slider-nav.next{right:-5px}
.slider-dots{display:flex;gap:8px;justify-content:center;margin-top:5px}
.slider-dots button{width:9px;height:9px;border:0;border-radius:50%;background:#c8d6e8;padding:0}
.slider-dots button.active{background:#118ef9}

.overview{display:grid;grid-template-columns:1.08fr 1fr .92fr;gap:24px;padding:18px 0 34px}
.panel{border:1px solid #dce8f5;border-radius:10px;overflow:hidden;background:white;box-shadow:0 2px 9px rgba(31,76,128,.04)}
.panel-title{height:46px;background:linear-gradient(#f8fbff,#eff5fb);border-bottom:1px solid #e2ebf6;display:flex;align-items:center;padding:0 18px;gap:10px}
.panel-title h3{margin:0;font-size:18px;color:#145aac}
.panel-title h3 small{font-size:12px;font-weight:500;color:#385b86}
.panel-icon{font-size:23px;color:#0e88f7}
.feature-row{display:grid;grid-template-columns:42px 165px 1fr;align-items:center;gap:10px;padding:9px 18px;border-bottom:1px solid #eef3f8}
.feature-row:last-child{border-bottom:0}
.mini-icon{width:33px;height:33px;border-radius:8px}
.feature-row div b,.feature-row div small{display:block}
.feature-row div b{font-size:13px;color:#143d76}
.feature-row div small{font-size:10px;color:#52709b;margin-top:2px}
.feature-row p{font-size:11px;color:#597297;margin:0;line-height:1.35}

.step{display:grid;grid-template-columns:36px 1fr;gap:10px;align-items:start;padding:10px 18px}
.step>span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#0c89f6;color:white;font-weight:700}
.step b,.step small{display:block}
.step b{font-size:13px;color:#133f77}
.step small{font-size:10px;color:#5a7599;margin-top:2px;line-height:1.35}

.right-stack{display:flex;flex-direction:column;gap:12px}
.download-panel{border-color:#bfe9cb;background:#f7fff9}
.download-title{background:linear-gradient(#eaffef,#dff9e7)}
.download-title h3,.download-title .panel-icon{color:#069d4a}
.download-box{display:grid;grid-template-columns:64px 1fr 130px;align-items:center;gap:12px;padding:14px}
.download-box>img{width:60px;height:60px;border-radius:13px}
.download-info{display:flex;flex-direction:column}
.download-info b{font-size:14px;color:#153b6f}
.download-info span{font-size:10px;color:#61769a;line-height:1.4}
.download-now{border:0;border-radius:10px;background:linear-gradient(#1bc866,#08a448);color:white;height:56px;font-weight:700;cursor:pointer}
.download-now small{display:block;font-size:10px;font-weight:500}
.download-hint{font-size:11px;color:#a56b00;padding:0 14px 10px}

.support-panel{border-color:#f5cbd6;background:#fffafb}
.support-title{background:linear-gradient(#fff4f7,#ffecef)}
.support-title h3,.support-title .panel-icon{color:#ee335d}
.support-box{display:grid;grid-template-columns:1fr 150px;gap:16px;align-items:center;padding:14px}
.support-box p{font-size:11px;color:#5f7596;line-height:1.5;margin:0}
.support-btn{height:54px;border:1px solid #ff5c7b;border-radius:10px;background:white;color:#ed3f62;font-size:21px;display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer}
.support-btn b,.support-btn small{display:block}.support-btn b{font-size:13px}.support-btn small{font-size:10px}
.donate-methods{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px;border-top:1px solid #f5dbe2}
.donate-method{text-align:center}
.donate-method b{display:block;font-size:12px;margin-bottom:8px}
.donate-method img{height:150px;margin:auto;object-fit:contain;background:white;border-radius:8px}
.donate-method a{display:block;font-size:10px;color:#1677be;margin-top:7px}

.section-white{background:white;padding:54px 0;border-top:1px solid #eef3f8}
.section-light{background:#f5f9fe;padding:54px 0}
.content-grid{display:grid;grid-template-columns:.38fr .62fr;gap:36px;align-items:center}
.content-grid h2,.center-title{color:#153e72;margin:0 0 12px;font-size:28px}
.content-grid p,.center-sub{color:#63789a;line-height:1.65}
.video-card{background:#0a1726;padding:10px;border-radius:18px;box-shadow:0 18px 42px rgba(29,69,113,.14)}
.video-card video{display:block;width:100%;border-radius:12px;aspect-ratio:16/9}
.center-title,.center-sub{text-align:center}
.screen-map{max-width:1320px;margin:24px auto 0;background:white;border:1px solid #dbe7f4;border-radius:14px;padding:8px;box-shadow:0 12px 35px rgba(31,76,128,.08)}
.screen-map img{width:100%;border-radius:9px}

.faq-list{max-width:980px;margin:24px auto 0;display:grid;gap:10px}
.faq-item{border:1px solid #dce8f5;border-radius:10px;background:#fff;overflow:hidden}
.faq-item button{width:100%;border:0;background:#f8fbff;padding:16px 18px;display:flex;justify-content:space-between;color:#194878;font-weight:700;cursor:pointer;text-align:left}
.faq-body{display:none;padding:0 18px 17px;color:#61789a;line-height:1.6;font-size:13px}
.faq-item.open .faq-body{display:block}

.community-strip{background:#eef6ff;padding:28px 0}
.community-box{display:flex;align-items:center;justify-content:space-between;gap:24px}
.community-box h3{margin:0 0 6px;color:#184a7d}
.community-box p{margin:0;color:#677d9d}
.community-btn{background:#0d85f5;color:white;border-radius:10px;padding:13px 18px;font-weight:700}

footer{background:white;border-top:1px solid #e7eef7;padding:24px 0}
.footer-inner{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#64799a}
.footer-brand{display:flex;align-items:center;gap:10px}.footer-brand img{width:36px;height:36px;border-radius:8px}.footer-brand div{display:flex;flex-direction:column}.footer-brand b{color:#173e70}.hidden{display:none!important}

@media(max-width:1100px){
  .menu{display:none}
  .hero-grid{grid-template-columns:1fr;padding-top:48px}
  .hero-device{max-width:850px}
  .slider-track{grid-template-columns:repeat(2,1fr)}
  .overview{grid-template-columns:1fr 1fr}.right-stack{grid-column:1/-1}
}
@media(max-width:720px){
  .container{width:min(100% - 24px,1400px)}
  .site-header,.nav{height:64px}.brand img{width:40px;height:40px}.brand strong{font-size:18px}.brand span{font-size:10px}
  .lang-switch button{padding:7px 9px}
  .hero-grid{padding:34px 0}.hero-copy h1{font-size:48px}.hero-copy h2{font-size:21px}.hero-features{gap:12px}.hero-feature{width:82px}
  .hero-actions{flex-direction:column}.btn{width:100%;justify-content:center}
  .slider-track{grid-template-columns:1fr;padding:0 28px}.thumb{display:none}.thumb.active{display:block}
  .overview{grid-template-columns:1fr}
  .feature-row{grid-template-columns:42px 1fr}.feature-row p{grid-column:2}
  .content-grid{grid-template-columns:1fr}
  .download-box{grid-template-columns:56px 1fr}.download-now{grid-column:1/-1}
  .support-box{grid-template-columns:1fr}.support-btn{width:100%}
  .community-box{flex-direction:column;align-items:flex-start}
  .footer-inner{flex-direction:column;gap:12px;align-items:flex-start}
}


.download-count-line{
  margin-top:3px;
  color:#0b8f49 !important;
  font-weight:700;
}
.download-count-line b{
  color:#087b3f;
}