:root{--navy:#061426;--navy2:#0a203c;--blue:#0ea5e9;--cyan:#22d3ee;--red:#e11d2e;--white:#f7fbff;--muted:#9fb3c8;--line:rgba(148,190,225,.18);--card:#0b1d32;--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--navy);color:var(--white);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.65}a{color:inherit;text-decoration:none}img{max-width:100%}.container{width:min(var(--max),calc(100% - 40px));margin:auto}.site-header{position:fixed;z-index:100;top:0;left:0;right:0;background:rgba(4,15,29,.82);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.nav-wrap{height:74px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:11px;font-size:16px;font-weight:700;letter-spacing:.1px}.brand b{color:#56d8ff}.brand-mark{display:grid;place-items:center;width:36px;height:36px;background:linear-gradient(135deg,var(--red),#ff5464);border:1px solid rgba(255,255,255,.35);border-radius:11px;box-shadow:0 8px 25px rgba(225,29,46,.28);font-weight:900}.main-nav{display:flex;align-items:center;gap:25px;font-size:14px;color:#c5d3e1}.main-nav a:hover{color:#fff}.nav-cta{padding:10px 17px;background:var(--red);border-radius:10px;color:#fff!important;font-weight:800}.nav-toggle{display:none;color:#fff;background:transparent;border:1px solid var(--line);border-radius:9px;padding:7px 10px;font-size:20px}.hero{position:relative;min-height:780px;padding:148px 0 80px;display:flex;align-items:center;overflow:hidden}.hero-media{position:absolute;inset:0;background:url('assets/hero-server-indonesia.webp') center/cover no-repeat}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,15,29,.98) 0%,rgba(4,15,29,.92) 38%,rgba(4,15,29,.3) 72%,rgba(4,15,29,.7) 100%),linear-gradient(0deg,var(--navy),transparent 28%)}.hero-grid{position:relative;display:grid;grid-template-columns:1.12fr .62fr;gap:80px;align-items:center}.eyebrow{display:inline-flex;align-items:center;gap:9px;text-transform:uppercase;letter-spacing:2.1px;font-weight:800;font-size:12px;color:#68ddff}.eyebrow i{width:25px;height:2px;background:var(--red)}h1,h2,h3,p{margin-top:0}.hero h1{font-size:clamp(47px,6vw,78px);line-height:1.03;letter-spacing:-3.5px;margin:22px 0 25px;max-width:790px}.hero h1 span{background:linear-gradient(90deg,#62dfff,#1891e6);-webkit-background-clip:text;color:transparent}.hero-copy>p{font-size:18px;color:#b9c9d8;max-width:680px}.hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin:32px 0}.button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border-radius:11px;font-weight:800;border:1px solid transparent;transition:.2s transform,.2s box-shadow,.2s background}.button:hover{transform:translateY(-2px)}.button.primary{background:linear-gradient(135deg,var(--red),#ff4254);box-shadow:0 13px 30px rgba(225,29,46,.22)}.button.secondary,.button.outline{border-color:var(--line);background:rgba(255,255,255,.045)}.button.secondary:hover,.button.outline:hover{background:rgba(255,255,255,.1)}.hero-points{display:flex;flex-wrap:wrap;gap:18px 25px;padding:0;margin:0;list-style:none;color:#d4deea;font-size:14px}.hero-points span{color:#55ddff;font-weight:900}.status-card{padding:26px;background:rgba(8,28,50,.78);border:1px solid rgba(89,208,255,.28);border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,.35);backdrop-filter:blur(16px)}.status-head,.metric{display:flex;justify-content:space-between;gap:20px}.status-head{padding-bottom:18px;border-bottom:1px solid var(--line);font-size:12px;letter-spacing:1px}.status-head i{font-style:normal;color:#53edbb}.metric{margin:19px 0 7px}.metric span{color:var(--muted);font-size:12px}.meter{height:5px;background:rgba(255,255,255,.08);border-radius:10px;overflow:hidden}.meter i{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--cyan));border-radius:10px}.status-card small{display:block;margin-top:22px;color:#7f97ae}.trust-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#07192d}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:25px 0}.trust-grid div{display:flex;flex-direction:column;padding:0 35px;border-right:1px solid var(--line)}.trust-grid div:first-child{padding-left:0}.trust-grid div:last-child{border:0}.trust-grid strong{font-size:20px}.trust-grid span{color:var(--muted);font-size:13px}.section{padding:105px 0}.section.alt{background:#07182b}.section-heading{max-width:700px;margin-bottom:45px}.section-heading.center{text-align:center;margin:0 auto 45px}.section-heading h2,.split-copy h2{font-size:clamp(34px,4.2vw,54px);line-height:1.12;letter-spacing:-2px;margin:16px 0}.section-heading p,.split-copy>p{color:var(--muted);font-size:17px}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.service-card{padding:29px 25px;background:linear-gradient(180deg,rgba(16,49,80,.75),rgba(7,26,47,.78));border:1px solid var(--line);border-radius:16px}.service-icon{display:grid;place-items:center;width:45px;height:45px;margin-bottom:24px;border-radius:12px;background:rgba(34,211,238,.1);border:1px solid rgba(34,211,238,.25);color:#65e2ff;font-weight:900}.service-card h3{font-size:21px;margin-bottom:9px}.service-card p{color:var(--muted);font-size:14px}.service-card a{color:#5adeff;font-weight:800;font-size:13px}.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;align-items:stretch}.price-card{position:relative;padding:31px 24px;background:#0a1d33;border:1px solid var(--line);border-radius:18px}.price-card.featured{border-color:#20bee9;box-shadow:0 0 0 1px rgba(32,190,233,.25),0 25px 60px rgba(0,0,0,.22)}.popular{position:absolute;top:-13px;right:18px;padding:5px 10px;background:#12a9d8;border-radius:7px;font-size:10px;font-weight:900;letter-spacing:1px}.tag{font-size:11px;letter-spacing:1.7px;color:#5cddff;font-weight:900}.price-card h3{font-size:25px;margin:8px 0 0}.price{font-size:30px;font-weight:900;margin:10px 0 18px}.price small{font-size:12px;color:var(--muted);font-weight:600}.price-card ul{padding:0;margin:0 0 25px;list-style:none;border-top:1px solid var(--line)}.price-card li{padding:9px 0;border-bottom:1px solid var(--line);color:#c4d3e1;font-size:14px}.price-card li:before{content:'✓';color:#4ce0ff;margin-right:8px}.price-card .button{width:100%;font-size:13px}.visual-section{background:radial-gradient(circle at 15% 50%,rgba(14,165,233,.12),transparent 38%),var(--navy)}.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}.image-shell{padding:8px;border:1px solid rgba(92,220,255,.25);border-radius:20px;background:rgba(255,255,255,.025);box-shadow:0 30px 80px rgba(0,0,0,.25);overflow:hidden}.image-shell img{display:block;width:100%;border-radius:14px}.compact-plans{display:grid;gap:10px;margin:28px 0}.compact-plans div{display:grid;grid-template-columns:1fr 1.2fr auto;gap:15px;align-items:center;padding:15px 17px;background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:11px}.compact-plans strong{color:#fff}.compact-plans span{color:var(--muted);font-size:12px}.compact-plans b{font-size:12px;color:#5cddff;text-align:right}.game-section{position:relative;overflow:hidden;background:#060d1b}.game-glow{position:absolute;width:700px;height:700px;right:-180px;top:-180px;background:radial-gradient(circle,rgba(207,45,255,.16),transparent 65%)}.eyebrow.purple{color:#dc7cff}.eyebrow.purple i{background:#d642ff}.game-layout{position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:30px;align-items:center}.game-image{border-color:rgba(212,66,255,.3)}.game-plans{display:grid;gap:12px}.game-plan{display:flex;justify-content:space-between;gap:25px;align-items:center;padding:20px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.035)}.game-plan.highlight{border-color:rgba(215,74,255,.55);background:linear-gradient(110deg,rgba(152,35,189,.12),rgba(14,165,233,.08))}.game-plan span{font-size:10px;color:#df79ff;font-weight:900;letter-spacing:1.5px}.game-plan h3{margin:3px 0;font-size:19px}.game-plan p{margin:0;color:var(--muted);font-size:13px}.game-plan>div:last-child{text-align:right;min-width:112px}.game-plan strong{display:block;font-size:17px}.game-plan small{display:block;color:var(--muted)}.game-plan a{display:inline-block;margin-top:7px;color:#64dfff;font-weight:900;font-size:13px}.plan-note{color:#7088a0;font-size:12px}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.feature{padding:27px 24px;border-left:2px solid #18bdeb;background:linear-gradient(90deg,rgba(27,93,130,.11),transparent)}.feature span{font-weight:900;color:#44d7ff}.feature h3{margin:12px 0 7px}.feature p{color:var(--muted);font-size:14px}.faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px}.accordion details{border-bottom:1px solid var(--line);padding:18px 0}.accordion summary{cursor:pointer;font-weight:800;list-style:none;padding-right:30px;position:relative}.accordion summary:after{content:'+';position:absolute;right:0;color:#55ddff;font-size:20px}.accordion details[open] summary:after{content:'−'}.accordion p{color:var(--muted);font-size:14px;margin:12px 0 0}.cta-section{padding:50px 0 105px;background:#07182b}.cta-box{display:flex;align-items:center;justify-content:space-between;gap:45px;padding:48px 52px;border-radius:22px;background:linear-gradient(120deg,#0d7db2,#075b92 55%,#d82035);box-shadow:0 25px 70px rgba(0,0,0,.3)}.cta-box h2{font-size:38px;line-height:1.1;margin:10px 0}.cta-box p{margin:0;color:#e0f4ff}.eyebrow.light{color:#fff}.button.white{background:#fff;color:#07182b;white-space:nowrap}.site-footer{padding:70px 0 25px;background:#040f1d;border-top:1px solid var(--line)}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px}.footer-grid>div{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.footer-grid p,.footer-grid a,.footer-grid span{color:#849ab0;font-size:13px}.footer-grid h3{margin-bottom:8px;font-size:14px}.footer-brand{margin-bottom:10px}.copyright{display:flex;justify-content:space-between;margin-top:50px;padding-top:20px;border-top:1px solid var(--line);color:#5f778e;font-size:12px}.floating-wa{position:fixed;z-index:90;right:22px;bottom:22px;display:grid;place-items:center;width:54px;height:54px;background:#20bd67;color:#fff;border-radius:50%;font-size:13px;font-weight:900;box-shadow:0 14px 35px rgba(0,0,0,.35)}.reveal{opacity:0;transform:translateY(18px);transition:.65s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:980px){.main-nav{position:absolute;top:74px;left:20px;right:20px;display:none;flex-direction:column;align-items:stretch;padding:20px;background:#07182b;border:1px solid var(--line);border-radius:14px}.main-nav.open{display:flex}.nav-toggle{display:block}.hero{min-height:auto}.hero-grid,.split-grid,.game-layout,.faq-grid{grid-template-columns:1fr}.status-card{max-width:600px}.service-grid,.pricing-grid,.feature-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:2fr 1fr 1fr}.footer-grid>div:last-child{grid-column:2/4}.compact-plans div{grid-template-columns:1fr}.compact-plans b{text-align:left}}
@media(max-width:640px){.container{width:min(100% - 26px,var(--max))}.hero{padding:125px 0 60px}.hero-overlay{background:linear-gradient(0deg,rgba(4,15,29,.98),rgba(4,15,29,.63)),linear-gradient(90deg,rgba(4,15,29,.7),transparent)}.hero h1{font-size:44px;letter-spacing:-2px}.hero-copy>p{font-size:16px}.status-card{display:none}.hero-actions .button{width:100%}.trust-grid{grid-template-columns:1fr 1fr;gap:20px}.trust-grid div{padding:0;border:0}.service-grid,.pricing-grid,.feature-grid{grid-template-columns:1fr}.section{padding:75px 0}.section-heading h2,.split-copy h2{font-size:36px}.cta-box{align-items:flex-start;flex-direction:column;padding:32px 25px}.cta-box h2{font-size:32px}.cta-box .button{width:100%}.game-plan{align-items:flex-start;flex-direction:column}.game-plan>div:last-child{text-align:left}.footer-grid{grid-template-columns:1fr 1fr;gap:35px}.footer-grid>div:first-child{grid-column:1/3}.footer-grid>div:last-child{grid-column:auto}.copyright{gap:10px;flex-direction:column}.floating-wa{width:50px;height:50px}.brand{font-size:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}