/* Reset */
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#1a1a1a;line-height:1.6;overflow-x:hidden}.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* Header */
.header{background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.05);position:sticky;top:0;z-index:1000;padding:.75rem 0}.header-content{display:flex;justify-content:space-between;align-items:center;gap:2rem}.nav-menu{display:flex;gap:1.75rem;align-items:center}.nav-menu a{color:#1a1a1a;text-decoration:none;font-weight:600;font-size:.938rem;transition:color .3s}.nav-menu a:hover{color:#0FB9B1}.dropdown{position:relative}.dropdown-menu{display:none;position:absolute;top:100%;left:0;background:#fff;min-width:220px;box-shadow:0 10px 40px rgba(0,0,0,.15);border-radius:12px;padding:.75rem 0;margin-top:.5rem}.dropdown:hover .dropdown-menu{display:block}.dropdown-menu a{display:block;padding:.75rem 1.5rem;font-size:.875rem}.dropdown-menu a:hover{background:#f0f9ff}.btn-cta{background:#0FB9B1;color:#fff;border:none;padding:.875rem 2rem;border-radius:50px;font-weight:700;cursor:pointer;transition:all .3s;display:flex;align-items:center;gap:.5rem;font-size:.938rem}.btn-cta:hover{background:#0da39c;transform:translateY(-2px);box-shadow:0 8px 20px rgba(15,185,177,.3)}.menu-toggle{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer}.menu-toggle span{width:25px;height:3px;background:#1a1a1a;border-radius:2px}

/* Hero */
.hero{background:linear-gradient(135deg,#0FB9B1 0%,#6EC6FF 100%);color:#fff;padding:5rem 0;min-height:600px;display:flex;align-items:center;position:relative;overflow:hidden}

/* Hero with background image - uncomment and add your image */
/* .hero{background:linear-gradient(135deg,rgba(15,185,177,0.9) 0%,rgba(110,198,255,0.9) 100%),url('assets/img/hero-bg.jpg') center/cover;color:#fff;padding:5rem 0;min-height:600px;display:flex;align-items:center;position:relative;overflow:hidden} */

.hero-bg{position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 50%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(255,255,255,.1) 0%,transparent 50%)}.hero-content{position:relative;z-index:1;max-width:700px}.hero-badge{display:inline-block;background:rgba(255,255,255,.2);backdrop-filter:blur(10px);padding:.625rem 1.75rem;border-radius:50px;font-weight:700;font-size:.875rem;margin-bottom:1.5rem;border:2px solid rgba(255,255,255,.3)}.hero-title{font-size:4rem;font-weight:900;line-height:1.1;margin-bottom:1.5rem;letter-spacing:-.02em}.gradient-text{background:linear-gradient(135deg,#FFD700 0%,#FFA500 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-size:1.375rem;margin-bottom:2.5rem;opacity:.95;line-height:1.6}.hero-buttons{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:3rem}.btn-primary{background:#fff;color:#0FB9B1;border:none;padding:1rem 2.5rem;border-radius:50px;font-weight:700;font-size:1rem;cursor:pointer;transition:all .3s}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.2)}.btn-outline{background:transparent;color:#fff;border:2px solid #fff;padding:1rem 2.5rem;border-radius:50px;font-weight:700;font-size:1rem;cursor:pointer;transition:all .3s;text-decoration:none;display:inline-block}.btn-outline:hover{background:#fff;color:#0FB9B1}.btn-lg{padding:1.25rem 3rem;font-size:1.063rem}.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;max-width:500px}.stat-item{text-align:center}.stat-item h3{font-size:2.5rem;margin-bottom:.25rem}.stat-item p{font-size:.875rem;opacity:.9}

/* Icon Services */
.icon-services{padding:3rem 0;background:#fff}.services-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:2rem;max-width:1000px;margin:0 auto}.service-icon{text-align:center;text-decoration:none;color:#1a1a1a;transition:transform .3s}.service-icon:hover{transform:translateY(-8px)}.icon-box{width:90px;height:90px;margin:0 auto 1rem;border-radius:22px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 15px rgba(0,0,0,.1);transition:all .3s}.service-icon:hover .icon-box{transform:scale(1.1) rotate(5deg);box-shadow:0 10px 40px rgba(0,0,0,.15)}.gradient-1{background:linear-gradient(135deg,#0FB9B1 0%,#6EC6FF 100%)}.gradient-2{background:linear-gradient(135deg,#8B5CF6 0%,#A78BFA 100%)}.gradient-3{background:linear-gradient(135deg,#F97316 0%,#FB923C 100%)}.gradient-4{background:linear-gradient(135deg,#FFD700 0%,#FFA500 100%)}.gradient-5{background:linear-gradient(135deg,#EC4899 0%,#F472B6 100%)}.gradient-6{background:linear-gradient(135deg,#10B981 0%,#34D399 100%)}.service-icon span{display:block;font-weight:600;font-size:.938rem}

/* Sections */
.section-title{text-align:center;font-size:2.5rem;font-weight:900;margin-bottom:1rem}.section-subtitle{text-align:center;font-size:1.125rem;color:#666;margin-bottom:3rem}

/* Coverage Safe */
.coverage-safe{padding:5rem 0;background:#f9f9f9}.coverage-content{text-align:center}.coverage-content h2{font-size:2.5rem;margin-bottom:1rem}.subtitle{font-size:1.125rem;color:#666;margin-bottom:3rem}.coverage-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-bottom:3rem}.coverage-card{background:#fff;padding:2.5rem 2rem;border-radius:20px;box-shadow:0 4px 15px rgba(0,0,0,.1)}.coverage-card h3{margin-bottom:.75rem;color:#0FB9B1}.coverage-cta{background:#fff;padding:3rem 2rem;border-radius:20px;margin-top:2rem}.coverage-cta p{margin-bottom:1.5rem}.coverage-cta .note{font-size:.875rem;color:#666;margin-top:1rem}

/* Products */
.products{padding:5rem 0;background:#fff}.product-tabs{display:flex;justify-content:center;gap:1rem;margin-bottom:3rem}.tab-btn{background:#f9f9f9;border:2px solid transparent;padding:1rem 2.5rem;border-radius:50px;font-weight:700;cursor:pointer;transition:all .3s}.tab-btn.active{background:#0FB9B1;color:#fff;border-color:#0FB9B1}.tab-content{display:none}.tab-content.active{display:block}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;max-width:1100px;margin:0 auto}.pricing-card{background:#fff;border:2px solid #e5e5e5;border-radius:24px;padding:2.5rem 2rem;position:relative;transition:all .3s}.pricing-card:hover{border-color:#0FB9B1;transform:translateY(-10px);box-shadow:0 10px 40px rgba(0,0,0,.15)}.pricing-card.featured{background:linear-gradient(135deg,#0FB9B1 0%,#6EC6FF 100%);color:#fff;border-color:#0FB9B1;transform:scale(1.05)}.pricing-card.featured:hover{transform:scale(1.08) translateY(-10px)}.card-badge{position:absolute;top:-12px;right:20px;background:#FF6B35;color:#fff;padding:.5rem 1.5rem;border-radius:50px;font-size:.75rem;font-weight:700}.card-badge.popular{background:#FFD700;color:#1a1a1a}.pricing-card h3{font-size:1.875rem;margin-bottom:1rem}.price{font-size:3.5rem;font-weight:900;color:#0FB9B1;margin:1rem 0}.pricing-card.featured .price{color:#fff}.price span{font-size:1.25rem;font-weight:600}.speed{color:#666;margin-bottom:1.5rem;font-size:1.063rem}.pricing-card.featured .speed{color:rgba(255,255,255,.9)}.features{list-style:none;margin:1.5rem 0}.features li{padding:.75rem 0;border-bottom:1px solid #f0f0f0}.pricing-card.featured .features li{border-bottom-color:rgba(255,255,255,.2)}.btn-card{width:100%;background:#0FB9B1;color:#fff;border:none;padding:1.125rem;border-radius:50px;font-weight:700;font-size:1rem;cursor:pointer;margin-top:1.5rem;transition:all .3s}.pricing-card.featured .btn-card{background:#fff;color:#0FB9B1}.btn-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.2)}

/* SOHO */
.soho-highlight,.corporate-highlight{background:linear-gradient(135deg,#f0f9ff 0%,#e0f2fe 100%);padding:3rem;border-radius:24px;border:3px solid #0FB9B1}.highlight-badge{display:inline-block;background:#0FB9B1;color:#fff;padding:.625rem 1.75rem;border-radius:50px;font-weight:700;margin-bottom:1.5rem}.soho-highlight h3,.corporate-highlight h3{font-size:2rem;margin-bottom:1rem}.soho-features{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;margin:2rem 0}.soho-feature{background:#fff;padding:2rem;border-radius:16px}.corporate-features{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin:2rem 0}.corp-feature{background:#fff;padding:1.5rem;border-radius:12px;font-weight:600}

/* Trust */
.trust{padding:4rem 0;background:#fff}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem}.trust-badge{text-align:center;padding:2rem 1rem}.badge-icon{font-size:3rem;margin-bottom:1rem}.trust-badge h4{margin-bottom:.5rem}.trust-badge p{color:#666}

/* Promo */
.promo-section{padding:5rem 0;background:#f9f9f9}.promo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}.promo-card{background:#fff;padding:3rem 2rem;border-radius:24px;text-align:center;position:relative;border:2px solid #e5e5e5;transition:all .3s}.promo-card:hover{border-color:#0FB9B1;transform:translateY(-8px)}.promo-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:#FFD700;color:#1a1a1a;padding:.5rem 1.5rem;border-radius:50px;font-size:.875rem;font-weight:700}.promo-card h3{font-size:1.75rem;margin:1rem 0}.promo-value{font-size:1.5rem;font-weight:900;color:#0FB9B1;margin-bottom:1rem}.btn-promo{background:#0FB9B1;color:#fff;border:none;padding:1rem 2rem;border-radius:50px;font-weight:700;cursor:pointer;margin-top:1.5rem;transition:all .3s}.btn-promo:hover{background:#0da39c;transform:translateY(-2px)}

/* Services Detail */
.services-detail{padding:5rem 0;background:#fff}.services-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}.service-detail-card{background:#f9f9f9;padding:2.5rem 2rem;border-radius:20px;border-left:4px solid #0FB9B1}.service-detail-card h3{margin-bottom:1rem}.btn-service{background:#0FB9B1;color:#fff;border:none;padding:.875rem 2rem;border-radius:50px;font-weight:700;cursor:pointer;margin-top:1rem;transition:all .3s}.btn-service:hover{background:#0da39c}

/* Datacenter */
.datacenter-section{padding:5rem 0;background:#f9f9f9}.datacenter-features{background:#fff;padding:3rem;border-radius:24px;max-width:800px;margin:0 auto}.datacenter-features h3{font-size:2rem;margin-bottom:1.5rem}.datacenter-features ul{list-style:none;margin-bottom:2rem}.datacenter-features li{padding:1rem 0;font-size:1.063rem;border-bottom:1px solid #f0f0f0}

/* Portofolio */
.portofolio{padding:5rem 0;background:#fff}.porto-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}.porto-card{background:#f9f9f9;padding:2.5rem 2rem;border-radius:20px;text-align:center}.porto-card h3{margin-bottom:1rem}

/* About */
.about{padding:5rem 0;background:#f9f9f9}.about-content{max-width:900px;margin:0 auto;text-align:center}.about-content h2{font-size:2.5rem;margin-bottom:1.5rem}.about-content p{font-size:1.063rem;margin-bottom:1.5rem;line-height:1.8}.about-values{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:3rem}.value-item{background:#fff;padding:2rem;border-radius:16px}

/* Contact */
.contact{padding:5rem 0;background:#fff}.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}.contact-card{background:#f9f9f9;padding:2.5rem 2rem;border-radius:20px;text-align:center}.contact-card h3{color:#0FB9B1;margin-bottom:1rem}.contact-value{font-size:1.5rem;font-weight:900;color:#1a1a1a;margin:1rem 0}.btn-contact{background:#0FB9B1;color:#fff;border:none;padding:1rem 2rem;border-radius:50px;font-weight:700;cursor:pointer;margin-top:1rem;transition:all .3s}.btn-contact:hover{background:#0da39c}

/* CTA Footer */
.cta-footer{background:linear-gradient(135deg,#0FB9B1 0%,#6EC6FF 100%);padding:5rem 0;text-align:center;color:#fff}.cta-footer h2{font-size:3rem;margin-bottom:1rem}.cta-footer p{font-size:1.25rem;margin-bottom:2rem}.btn-cta-large{background:#fff;color:#0FB9B1;border:none;padding:1.5rem 4rem;border-radius:50px;font-weight:900;font-size:1.25rem;cursor:pointer;transition:all .3s}.btn-cta-large:hover{transform:translateY(-4px);box-shadow:0 15px 40px rgba(0,0,0,.3)}

/* Footer */
.footer{background:#1a1a1a;color:#fff;padding:4rem 0 2rem}.footer-content{display:grid;grid-template-columns:repeat(4,1fr);gap:3rem;margin-bottom:2rem}.footer-col h4{margin-bottom:1rem}.footer-col a{display:block;color:rgba(255,255,255,.7);text-decoration:none;margin-bottom:.75rem;transition:color .3s}.footer-col a:hover{color:#fff}.footer-col p{color:rgba(255,255,255,.7);margin-bottom:.5rem}.btn-footer{background:#0FB9B1;color:#fff;border:none;padding:.875rem 2rem;border-radius:50px;font-weight:700;cursor:pointer;transition:all .3s}.btn-footer:hover{background:#0da39c}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:2rem;text-align:center;color:rgba(255,255,255,.5)}

/* WhatsApp Popup */
.wa-popup{display:none;position:fixed;bottom:120px;right:30px;z-index:999;animation:slideUp .3s ease}@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.wa-popup.show{display:block}.wa-popup-content{background:#fff;padding:2rem;border-radius:20px;box-shadow:0 10px 40px rgba(0,0,0,.2);max-width:320px;position:relative}.wa-popup-close{position:absolute;top:10px;right:10px;background:none;border:none;font-size:2rem;color:#666;cursor:pointer;line-height:1}.wa-popup-icon{font-size:3rem;text-align:center;margin-bottom:1rem}.wa-popup-content h3{text-align:center;margin-bottom:.75rem}.wa-popup-content p{text-align:center;margin-bottom:1rem;color:#666}.btn-popup{width:100%;background:#25D366;color:#fff;border:none;padding:1.125rem;border-radius:50px;font-weight:700;cursor:pointer;transition:all .3s}.btn-popup:hover{background:#1ea952;transform:translateY(-2px)}.popup-note{font-size:.75rem;margin-top:.75rem}

/* WhatsApp Float */
.wa-float{position:fixed;bottom:30px;right:30px;background:#25D366;color:#fff;padding:1rem 1.5rem;border-radius:50px;display:flex;align-items:center;gap:1rem;text-decoration:none;box-shadow:0 8px 25px rgba(37,211,102,.4);z-index:998;transition:all .3s}.wa-float:hover{transform:translateY(-5px);box-shadow:0 12px 35px rgba(37,211,102,.5)}.wa-float-icon{width:36px;height:36px}.wa-float-text{display:flex;flex-direction:column;gap:.125rem}.wa-float-text strong{font-size:1rem}.wa-float-text span{font-size:.813rem;opacity:.9}

/* Responsive */
@media (max-width:968px){.nav-menu{display:none}.menu-toggle{display:flex}.hero-title{font-size:2.5rem}.services-grid{grid-template-columns:repeat(3,1fr)}.pricing-grid,.promo-grid,.coverage-cards,.porto-grid{grid-template-columns:1fr}.pricing-card.featured{transform:scale(1)}.soho-features{grid-template-columns:1fr}.corporate-features{grid-template-columns:1fr}.services-detail-grid,.contact-grid,.about-values,.trust-grid,.footer-content{grid-template-columns:1fr}.wa-float-text{display:none}.wa-popup{right:20px;bottom:100px}}@media (max-width:640px){.hero{padding:3rem 0}.hero-title{font-size:2rem}.hero-stats{grid-template-columns:1fr}.services-grid{grid-template-columns:repeat(2,1fr)}.section-title{font-size:2rem}.cta-footer h2{font-size:2rem}}

/* Fix btn-card as link */
a.btn-card{display:inline-block;text-decoration:none}

/* ========== NEW PRICING CARDS (HOMEPAGE) ========== */
.section-header{text-align:center;margin-bottom:3rem}
.section-label{color:#0FB9B1;font-weight:700;font-size:0.938rem;letter-spacing:0.1em;margin-bottom:0.5rem}

.pricing-grid-home{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;max-width:1100px;margin:0 auto}

.pricing-card-home{background:#fff;border:2px solid #e5e5e5;border-radius:20px;padding:2.5rem 2rem;position:relative;transition:all 0.3s}

.pricing-card-home:hover{transform:translateY(-5px);box-shadow:0 10px 30px rgba(0,0,0,0.1)}

.pricing-card-home.featured-home{border:3px solid #0FB9B1;transform:scale(1.08);box-shadow:0 15px 40px rgba(15,185,177,0.2);z-index:10}

.pricing-card-home.featured-home:hover{transform:scale(1.08) translateY(-8px);box-shadow:0 20px 50px rgba(15,185,177,0.3)}

.badge-top{position:absolute;top:-15px;left:50%;transform:translateX(-50%);background:#0FB9B1;color:#fff;padding:0.5rem 1.5rem;border-radius:50px;font-size:0.75rem;font-weight:700;white-space:nowrap}

.pricing-card-home h3{font-size:1.75rem;margin-bottom:0.5rem;color:#1a1a1a}

.card-desc{color:#666;font-size:0.938rem;margin-bottom:1.5rem}

.price-home{font-size:3.5rem;font-weight:900;color:#1a1a1a;margin:1.5rem 0;line-height:1}

.price-home span{font-size:2rem;font-weight:700}

.price-home small{font-size:1rem;font-weight:600;color:#666}

.features-home{list-style:none;margin:1.5rem 0;padding:0}

.features-home li{padding:0.75rem 0;color:#333;font-size:0.938rem;border-bottom:1px solid #f0f0f0}

.features-home li:last-child{border-bottom:none}

.btn-card-home{width:100%;background:#fff;color:#1a1a1a;border:2px solid #e5e5e5;padding:1rem;border-radius:12px;font-weight:700;font-size:1rem;cursor:pointer;margin-top:1.5rem;transition:all 0.3s}

.btn-card-home:hover{background:#f9f9f9;border-color:#0FB9B1;color:#0FB9B1;transform:translateY(-2px)}

.btn-primary-full{background:#0FB9B1;color:#fff;border-color:#0FB9B1}

.btn-primary-full:hover{background:#0da39c;border-color:#0da39c;color:#fff;transform:translateY(-2px);box-shadow:0 8px 20px rgba(15,185,177,0.3)}

/* Responsive Pricing Home */
@media (max-width:968px){
.pricing-grid-home{grid-template-columns:1fr}
.pricing-card-home.featured-home{transform:scale(1);margin:1rem 0}
.pricing-card-home.featured-home:hover{transform:translateY(-5px)}
}