/* BonanzaNet customer portal visual redesign, scoped to /customer/login. */
:root {
  --bn-blue:#086fd8;
  --bn-blue-deep:#063a83;
  --bn-cyan:#13a9f2;
  --bn-orange:#f49a00;
  --bn-ink:#10254a;
  --bn-muted:#5a6d8a;
  --bn-edge:#d9e9fa;
}
html{scroll-behavior:smooth}
body{
  background:#f3f9ff!important;
  background-image:linear-gradient(155deg,#e7f6ff 0%,#f7fbff 36%,#fff 85%)!important;
  color:var(--bn-ink)!important;
}
body .container{max-width:1330px}
.custom-navbar{
  background:rgba(255,255,255,.98)!important;
  border-bottom:1px solid #e2eef9!important;
  padding:6px 0!important;
  box-shadow:0 4px 22px rgba(7,75,147,.04);
}
.navbar-brand.bn-brand{display:flex;align-items:center;gap:11px;min-width:0}
.bn-brand-icon{width:42px;height:48px;object-fit:contain;flex-shrink:0}
.bn-brand-name{display:flex;flex-direction:column;line-height:.98;white-space:nowrap}
.bn-brand-name small{font-size:8px;letter-spacing:2.1px;font-weight:800;color:#64748b}
.bn-brand-name strong{font-size:clamp(18px,2vw,28px);font-style:italic;letter-spacing:-1.2px;font-weight:900}
.bn-brand-name strong span:first-child{color:#f49a00}
.bn-brand-name strong span:last-child{color:#1570ba}
.custom-navbar .nav-link{color:#203858!important;font-size:13px;font-weight:650;padding:10px 11px!important}
.custom-navbar .nav-link.active{color:#0875e2!important;background:transparent!important}
.custom-navbar .nav-link.active:after{content:"";display:block;height:3px;border-radius:5px;background:#0875e2;max-width:55px;margin:2px auto 0}
.custom-navbar .nav-link:hover{color:#0875e2!important;background:#edf6ff!important}
.bn-header-action{display:flex;align-items:center;gap:10px}
.btn-portal-access,.btn-submit-login,.bn-primary-btn{
  background:linear-gradient(135deg,#159af4 0%,#0062e9 100%)!important;
  color:#fff!important;border:0!important;border-radius:11px;
  box-shadow:0 9px 20px rgba(4,109,221,.18)!important;
  font-weight:750;
}
.btn-portal-access{font-size:12px;padding:10px 18px}
.btn-portal-access:hover,.btn-submit-login:hover,.bn-primary-btn:hover{filter:brightness(1.05);transform:translateY(-1px)}
.bn-pwa-action{font-size:12px;background:#fff!important;border:1px solid #d8eaf9!important;color:#0874d5!important;border-radius:11px;padding:9px 13px}
.bn-pwa-action:hover{background:#eaf6ff!important;color:#0466bf!important}
.modern-hero{
  position:relative;isolation:isolate;
  padding:42px 0 25px!important;
  background:radial-gradient(650px 470px at 53% 33%,rgba(90,202,255,.3),transparent 80%),
  radial-gradient(500px 480px at 3% 65%,rgba(199,235,255,.9),transparent 75%),
  linear-gradient(120deg,#f1faff 0%,#e9f6ff 51%,#f9fcff 100%);
  overflow:hidden;
}
.modern-hero:after{position:absolute;content:"";z-index:-1;width:370px;height:370px;border-radius:50%;
  right:24%;top:-140px;border:60px solid rgba(255,255,255,.3)}
.bn-hero-grid{
  display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.82fr) minmax(310px,.96fr);
  align-items:center;gap:23px;
}
.bn-hero-copy{position:relative;z-index:2}
.bn-eyebrow{display:inline-flex;gap:7px;align-items:center;border-radius:25px;
  background:#d5ebff;color:#046bc3;font-size:11px;font-weight:800;padding:7px 12px;margin-bottom:18px}
.bn-hero-title{color:#091e47!important;font-size:clamp(33px,3.4vw,52px);
  font-weight:900;line-height:1.13;letter-spacing:-1.9px;margin-bottom:15px;max-width:490px}
.bn-hero-title em{font-style:normal;color:#086ef3;display:inline}
.bn-hero-desc{font-size:14px;color:#506483!important;line-height:1.7;margin:0 0 20px;max-width:490px}
.bn-benefit-strip{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:0 0 20px}
.bn-benefit{display:flex;align-items:center;gap:8px;font-size:11px;line-height:1.4;font-weight:750;color:#1d385e}
.bn-benefit i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:#fff;font-size:17px;box-shadow:0 5px 14px rgba(15,105,195,.13)}
.bn-benefit:nth-child(1) i{background:linear-gradient(140deg,#ffb53b,#fb8700)}
.bn-benefit:nth-child(2) i{background:linear-gradient(140deg,#37b7ff,#0871e6)}
.bn-benefit:nth-child(3) i{background:linear-gradient(140deg,#44dca2,#13b96b)}
.bn-secondary-actions{display:flex;flex-wrap:wrap;gap:8px}
.bn-secondary-actions .btn{font-size:11px;border-radius:10px;font-weight:750}
.bn-art{
  min-height:340px;position:relative;display:flex;flex-direction:column;
  align-items:center;justify-content:flex-end;padding-bottom:23px;overflow:visible;
}
.bn-art:before{content:"";position:absolute;width:325px;height:325px;border-radius:50%;
 background:radial-gradient(circle at 40% 38%,#ecfbff 0%,#bfe8ff 45%,rgba(122,194,240,.1) 74%,transparent 75%);
 top:0;left:50%;transform:translateX(-50%)}
.bn-art:after{content:"";position:absolute;width:270px;height:33px;bottom:0;border-radius:50%;
 background:rgba(2,105,201,.12);filter:blur(13px)}
.bn-wifi-glow{position:absolute;z-index:2;top:14px;left:50%;transform:translateX(-50%);
 font-size:173px;line-height:1;color:#0a9ef2;
 filter:drop-shadow(0 10px 12px rgba(0,129,248,.21));
 text-shadow:0 3px 0 #b7f1ff}
.bn-router{position:relative;z-index:3;background:linear-gradient(160deg,#fff,#e9f4ff 85%);
 border:1px solid #a7d8fa;border-bottom:7px solid #55b7ef;
 box-shadow:inset 0 7px 7px rgba(255,255,255,.9),0 12px 30px rgba(6,75,145,.22);
 width:min(270px,100%);height:105px;border-radius:28px 28px 18px 18px;
 display:flex;align-items:center;justify-content:center}
.bn-router::before,.bn-router::after{
 content:"";position:absolute;width:12px;height:105px;bottom:75px;background:linear-gradient(90deg,#d1e7f9,#fff,#62a7d7);
 border:1px solid #7eb3db;border-radius:8px 8px 3px 3px;z-index:-1}
.bn-router:before{left:19px}.bn-router:after{right:19px}
.bn-router .bn-router-brand{display:flex;align-items:center;gap:4px;font-weight:900;font-style:italic;font-size:17px;color:#f39200}
.bn-router .bn-router-brand img{width:31px;height:35px;object-fit:contain}
.bn-router .bn-router-brand .net{color:#0969bd}
.bn-led{position:absolute;bottom:13px;left:36%;width:28%;height:5px;border-radius:20px;background:#00b9ff;
 box-shadow:0 0 10px #00c9ff}
.bn-login-card{
  background:#fff!important;overflow:hidden;
  border:1px solid #e0eefb!important;border-radius:22px;
  box-shadow:0 18px 44px rgba(20,87,150,.12)!important;
  max-width:420px;margin-left:auto;
}
.bn-login-header{padding:27px 26px 12px!important;text-align:left!important;background:#fff!important;border:0!important}
.bn-login-heading{display:flex;align-items:flex-start;gap:12px}
.bn-login-heading-icon{display:grid;place-items:center;flex-shrink:0;width:43px;height:43px;border-radius:50%;background:linear-gradient(140deg,#ffa329,#ff7800);color:#fff;font-size:22px}
.bn-login-heading h2{font-size:18px;line-height:1.3;letter-spacing:-.4px;margin:0 0 6px;color:#112851!important;font-weight:850}
.bn-login-heading p{font-size:12px;line-height:1.6;color:#697d99!important;margin:0}
.bn-login-body{padding:13px 26px 24px!important}
.bn-phone-label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;color:#172c55;margin-bottom:8px}
.bn-phone-label i{color:#14b66b;font-size:17px}
#phone,#phone:focus{height:46px!important;padding:9px 13px!important;
 background:#fff!important;color:#17305c!important;border:1px solid #c9d9eb!important;border-radius:10px!important;
 caret-color:#17305c;box-shadow:none;transition:border-color .2s}
#phone:focus{border-color:#138be9!important;box-shadow:0 0 0 3px rgba(4,137,235,.10)!important}
#phone:-webkit-autofill,#phone:-webkit-autofill:hover,#phone:-webkit-autofill:focus{
 -webkit-box-shadow:0 0 0 1000px #fff inset!important;
 -webkit-text-fill-color:#17305c!important;color:#17305c!important}
.bn-login-body #btn-login{height:48px;margin-top:4px;font-size:14px}
.bn-login-note{display:flex;align-items:center;gap:11px;border-radius:12px;background:#eef7ff;
 padding:11px 13px;margin-top:15px;color:#5b718d;font-size:11px;line-height:1.55}
.bn-login-note i{display:grid;place-items:center;flex-shrink:0;width:30px;height:30px;border-radius:50%;background:#fff;color:#167ce2;font-size:15px}
.bn-login-footer{text-align:center;font-size:11px;color:#657892;margin-top:13px}
.bn-login-footer a{color:#0c78d7;font-weight:800}
.bn-parent-logo{max-height:26px;max-width:180px;object-fit:contain;margin-top:10px}
.bn-actions-band{background:#fff;padding:18px 0 12px}
.bn-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.bn-quick-link{
 display:flex;align-items:center;gap:12px;text-decoration:none;padding:15px 13px;min-height:94px;
 border-radius:15px;border:1px solid #e8f0f9;color:#1a355d;
 transition:transform .2s,box-shadow .2s}
.bn-quick-link:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(14,72,142,.1);color:#063b8b}
.bn-quick-link .bn-quick-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:15px;flex-shrink:0;font-size:23px;color:#fff}
.bn-quick-link .bn-quick-copy{flex:1;min-width:0;line-height:1.35}
.bn-quick-link strong{display:block;font-size:13px;font-weight:850;margin-bottom:3px}
.bn-quick-link small{display:block;color:#6b7f99;font-size:11px;line-height:1.45}
.bn-quick-link .bn-arrow{font-size:15px;color:inherit;opacity:.75}
.bn-quick-link.bn-billing{background:#f0f9ff}.bn-billing .bn-quick-icon{background:linear-gradient(135deg,#6ad1ff,#0480ee)}
.bn-quick-link.bn-voucher{background:#fff8f1}.bn-voucher .bn-quick-icon{background:linear-gradient(135deg,#ffb34b,#ff7900)}
.bn-quick-link.bn-install{background:#f7f5ff}.bn-install .bn-quick-icon{background:linear-gradient(135deg,#a990ff,#6950ef)}
.bn-quick-link.bn-support{background:#f0fcf5}.bn-support .bn-quick-icon{background:linear-gradient(135deg,#46d999,#08a963)}
.bn-section{padding:35px 0 24px!important;background:#fff}
.bn-section-header{display:flex;align-items:end;justify-content:space-between;gap:15px;margin-bottom:19px}
.bn-section-kicker{display:flex;align-items:center;gap:8px;color:#087cde;font-size:10px;font-weight:850;letter-spacing:.45px;text-transform:uppercase;margin-bottom:5px}
.bn-section-kicker:before{content:"";display:block;width:22px;height:4px;background:var(--bn-orange);border-radius:3px}
.bn-section-title{font-size:24px;letter-spacing:-.6px;color:#102650!important;font-weight:900;margin:0 0 4px}
.bn-section-subtitle{font-size:12px;color:#6a7f99!important;margin:0}
.bn-packages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.bn-packages .bn-package-col{min-width:0}
.bn-package-card{
 display:flex;flex-direction:column;height:100%;padding:20px 16px 15px!important;
 border-radius:16px;border:1px solid #e0eaf6!important;box-shadow:0 4px 15px rgba(33,99,164,.04)!important;
 background:#fff!important;position:relative;min-width:0}
.bn-package-card.bn-popular{border:1.5px solid #f49a00!important;background:#fafdff!important}
.bn-package-card .pkg-badge-popular{top:-12px;left:50%;right:auto;transform:translateX(-50%);white-space:nowrap;font-size:10px;box-shadow:none}
.bn-package-head{display:flex;align-items:center;gap:10px;min-height:44px;margin-bottom:4px}
.bn-package-head .bn-package-icon{width:36px;height:36px;flex-shrink:0;display:grid;place-items:center;color:#0875e0;background:#e9f5ff;border-radius:12px;font-size:20px}
.bn-popular .bn-package-icon{color:#ec8800;background:#fff0d7}
.bn-package-head .pkg-name{font-size:17px!important;margin:0!important;color:#12305a!important}
.bn-package-card .pkg-speed-tag{margin:8px 0 12px;max-width:100%;font-size:10px;padding:5px 9px}
.bn-package-card .pkg-price{font-size:clamp(18px,2.2vw,26px);white-space:nowrap;color:#0874da!important;margin:0}
.bn-package-card .pkg-period{font-size:11px!important;margin:3px 0 17px;color:#7a8ba0!important}
.bn-package-card .pkg-features{margin-bottom:18px;padding:0}
.bn-package-card .pkg-features li{font-size:11px!important;line-height:1.6;color:#506883;padding:5px 0;border:0}
.bn-package-card .pkg-features li i{font-size:12px;color:#007df2}
.bn-package-card .btn-pkg-action{margin-top:auto;padding:9px 10px;border:1.5px solid #0875ea;color:#076bda;background:#fff;border-radius:9px;font-size:12px}
.bn-popular .btn-pkg-action{background:linear-gradient(135deg,#159bf4,#0062e9)!important;color:#fff!important;border:0}
.bn-features-section{background:linear-gradient(120deg,#eef8ff,#f8fcff)!important;padding:30px 0!important}
.bn-feature-grid{display:grid;grid-template-columns:1.2fr repeat(4,minmax(0,1fr));gap:14px;align-items:stretch}
.bn-feature-intro{display:flex;flex-direction:column;justify-content:center;padding:8px 10px}
.bn-feature-intro h2{font-size:23px;font-weight:900;letter-spacing:-.6px;line-height:1.2;margin-bottom:10px;color:#0b2954}
.bn-feature-intro p{font-size:11px;line-height:1.6;color:#637a97;margin:0}
.bn-feature{background:#fff!important;border:1px solid #e5eff8!important;border-radius:15px;padding:18px 12px;text-align:center;box-shadow:0 4px 18px rgba(16,86,151,.04)}
.bn-feature .feature-icon-wrapper{margin:0 auto 9px;width:43px;height:43px;border:0;background:#e8f5ff;font-size:20px}
.bn-feature .feature-title{font-size:12px;font-weight:850;line-height:1.4;margin:0 0 6px}
.bn-feature .feature-desc{font-size:10px!important;line-height:1.5}
#contact-info{padding-top:35px!important;padding-bottom:20px!important}
.site-footer{padding:31px 0 22px!important;margin-top:0!important;background:#fff!important}
.footer-brand .bn-brand-icon{height:40px;width:35px}
.footer-brand .bn-brand-name strong{font-size:23px}
.bn-footer-note{font-size:12px;color:#627994;max-width:330px}
.site-footer .footer-links{font-size:12px}
.site-footer .footer-bottom{padding-top:14px;font-size:11px}
@media(max-width:1199.98px){
 .bn-hero-grid{grid-template-columns:1.07fr .72fr 1fr;gap:13px}
 .bn-hero-title{font-size:37px}
 .bn-art{min-height:320px}
 .bn-wifi-glow{font-size:145px;top:39px}
 .bn-router{width:205px;height:90px}
 .bn-login-header{padding:22px 18px 10px!important}
 .bn-login-body{padding:10px 18px 19px!important}
 .bn-quick-link{padding:12px 9px;gap:8px}
 .bn-quick-link .bn-quick-icon{width:38px;height:38px;font-size:19px}
 .bn-packages{gap:10px}
 .bn-package-card{padding:18px 12px 13px!important}
}
@media(max-width:991.98px){
 .custom-navbar .nav-link.active:after{margin-left:10px}
 .bn-hero-grid{grid-template-columns:1fr 1fr;gap:8px 16px}
 .bn-art{grid-column:1;grid-row:2;min-height:260px}
 .bn-login-card{grid-column:2;grid-row:1 / span 2;max-width:none;align-self:center}
 .bn-hero-copy{grid-column:1;grid-row:1}
 .bn-hero-title{font-size:clamp(31px,4vw,42px)}
 .bn-wifi-glow{font-size:150px;top:0}
 .bn-router{width:220px;height:91px}
 .bn-benefit-strip{gap:8px}
 .bn-benefit{font-size:9px}
 .bn-quick-grid,.bn-packages{grid-template-columns:repeat(2,minmax(0,1fr))}
 .bn-feature-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
 .bn-feature-intro{grid-column:1/-1;text-align:center}
 .bn-feature-intro h2{font-size:20px}
}
@media(max-width:575.98px){
 .custom-navbar .container{padding-left:16px;padding-right:16px}
 .navbar-brand.bn-brand{gap:7px}
 .bn-brand-icon{width:33px;height:38px}
 .bn-brand-name small{font-size:6px;letter-spacing:1.1px}
 .bn-brand-name strong{font-size:21px;letter-spacing:-.9px}
 .bn-header-action{gap:5px}
 .bn-header-action .btn{font-size:12px}
 .modern-hero{padding:25px 0 22px!important}
 .modern-hero .container{padding:0 17px}
 .bn-hero-grid{display:flex;flex-direction:column;gap:11px}
 .bn-hero-copy{width:100%;order:1}
 .bn-eyebrow{margin-bottom:12px;font-size:10px}
 .bn-hero-title{font-size:33px;line-height:1.14;max-width:100%;letter-spacing:-1.1px;margin-bottom:9px}
 .bn-hero-desc{font-size:12px;line-height:1.6;margin-bottom:14px}
 .bn-benefit-strip{gap:12px;margin:0 0 12px}
 .bn-benefit{gap:6px;font-size:10px}
 .bn-benefit i{width:30px;height:30px;font-size:14px}
 .bn-secondary-actions .btn{font-size:10px;padding:7px 10px}
 .bn-art{order:2;grid-column:auto;grid-row:auto;width:100%;min-height:170px;max-height:170px;overflow:hidden;padding-bottom:0}
 .bn-art:before{width:245px;height:245px;top:-64px}
 .bn-art:after{bottom:-6px}
 .bn-wifi-glow{font-size:125px;top:-10px}
 .bn-router{width:190px;height:75px;border-radius:20px 20px 16px 16px;transform:translateY(-1px)}
 .bn-router:before,.bn-router:after{height:61px;bottom:62px}
 .bn-router .bn-router-brand{font-size:14px}
 .bn-router .bn-router-brand img{width:25px;height:28px}
 .bn-login-card{order:3;align-self:stretch;width:100%;margin:0;grid-column:auto;grid-row:auto;border-radius:19px}
 .bn-login-header{padding:18px 18px 8px!important}
 .bn-login-heading h2{font-size:17px}
 .bn-login-heading p{font-size:11px}
 .bn-login-body{padding:10px 18px 19px!important}
 .bn-login-note{margin-top:10px}
 .bn-actions-band{padding:15px 0 12px}
 .bn-quick-grid{gap:8px}
 .bn-quick-link{min-height:68px;padding:9px 7px;gap:7px;border-radius:11px}
 .bn-quick-link .bn-quick-icon{width:33px;height:33px;border-radius:10px;font-size:17px}
 .bn-quick-link strong{font-size:10px;margin:0}
 .bn-quick-link small{font-size:9px}
 .bn-quick-link .bn-arrow{display:none}
 .bn-section{padding:28px 0 20px!important}
 .bn-section-header{margin-bottom:13px}
 .bn-section-title{font-size:21px}
 .bn-section-subtitle{font-size:11px}
 .bn-packages{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .bn-package-card{padding:17px 9px 10px!important;border-radius:13px}
 .bn-package-head{gap:6px}
 .bn-package-head .bn-package-icon{width:29px;height:29px;font-size:15px}
 .bn-package-head .pkg-name{font-size:14px!important}
 .bn-package-card .pkg-price{font-size:clamp(16px,4vw,22px)}
 .bn-package-card .pkg-features li{font-size:10px!important}
 .bn-package-card .pkg-badge-popular{font-size:9px;top:-10px}
 .bn-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .bn-feature{padding:13px 10px}
 .bn-feature-intro h2{font-size:18px}
 .site-footer .container{padding:0 18px}
}
/* Logo resmi yang dikirim pemilik, hanya untuk tampilan portal; favicon tetap. */
.bn-official-wordmark{display:block;width:265px;max-width:100%;height:auto;object-fit:contain}
.bn-router-brand .bn-router-wordmark{display:block;width:192px;max-width:90%;height:auto}
.footer-brand .bn-official-wordmark{width:220px}
#pwa-install-banner .btn-warning{min-width:84px;white-space:nowrap;flex-shrink:0}
@media(max-width:575.98px){
 .bn-official-wordmark{width:225px;max-width:calc(100vw - 95px)}
 .bn-router-brand .bn-router-wordmark{width:152px}
 #pwa-install-banner .btn-warning{min-width:74px;font-size:12px;padding:9px!important}
 #pwa-install-banner .glass-card{gap:8px!important}
}


/* Perapian tipografi halaman pelanggan: ukuran konsisten antar kartu. */
.bn-section-header-centered{
  display:flex!important;
  flex-direction:column;
  align-items:center!important;
  justify-content:center!important;
  gap:7px;
  text-align:center;
}
.bn-section-header-centered .bn-section-kicker{
  justify-content:center;
  font-size:12px;
}
.bn-section-header-centered .bn-section-title{
  font-size:24px;
}
.bn-section-header-centered .bn-section-subtitle{
  font-size:13px!important;
}
.bn-section-header-centered > a{
  font-size:12px!important;
}
.bn-eyebrow,.bn-section-kicker{
  font-size:12px;
}
.bn-phone-label,.bn-login-footer,.bn-login-note{
  font-size:13px;
}
.bn-quick-link strong,.bn-feature .feature-title{
  font-size:14px!important;
  line-height:1.45;
  font-weight:800;
}
.bn-quick-link small,.bn-feature .feature-desc,
.bn-feature-intro p,.bn-package-card .pkg-features li,
.bn-package-card .pkg-period{
  font-size:12.5px!important;
  line-height:1.55;
}
.bn-package-head .pkg-name{font-size:16px!important}
.bn-package-card .pkg-speed-tag{font-size:12px}
.bn-package-card .btn-pkg-action{font-size:13px}
.bn-feature-intro .bn-section-kicker{font-size:12px}
.bn-feature-intro h2{
  font-size:24px!important;
  line-height:1.25;
}
.bn-feature .feature-title{margin-bottom:7px}
.bn-feature .feature-desc{margin:0}
@media (max-width:575.98px){
  .bn-section-header-centered .bn-section-title{font-size:21px}
  .bn-feature-intro h2{font-size:21px!important}
  .bn-quick-link strong,.bn-feature .feature-title{font-size:13px!important}
  .bn-quick-link small{font-size:11.5px!important}
  .bn-package-head .pkg-name{font-size:14px!important}
  .bn-package-card .pkg-features li{font-size:11.5px!important}
  .bn-feature .feature-desc,.bn-feature-intro p{font-size:12.5px!important}
}

/* Paket dipusatkan juga saat jumlah paket aktif kurang dari empat. */
.bn-packages{
  display:flex!important;
  justify-content:center;
  align-items:stretch;
  flex-wrap:wrap;
  gap:14px;
}
.bn-packages .bn-package-col{
  flex:0 1 calc((100% - 42px)/4);
  min-width:0;
}
@media(max-width:991.98px){
  .bn-packages .bn-package-col{
    flex-basis:calc((100% - 14px)/2);
  }
}
@media(max-width:575.98px){
  .bn-packages{gap:8px}
  .bn-packages .bn-package-col{
    flex-basis:calc((100% - 8px)/2);
  }
}

/* Penyempurnaan keterbacaan dan pemusatan paket — hanya tampilan. */
.bn-section-header-centered{width:100%;text-align:center;margin-bottom:26px}
.bn-section-header-centered .bn-section-kicker,
.bn-feature-intro .bn-section-kicker{font-size:14px!important;letter-spacing:.35px}
.bn-section-header-centered .bn-section-title{font-size:28px!important;line-height:1.25}
.bn-section-header-centered .bn-section-subtitle{font-size:15px!important;line-height:1.55}
.bn-section-header-centered > a{font-size:14px!important}
.bn-packages{justify-content:center!important;align-items:stretch;margin-inline:auto}
.bn-packages.bn-package-count-2 .bn-package-col{flex:0 1 365px!important;width:365px;max-width:100%}
.bn-packages.bn-package-count-1 .bn-package-col{flex:0 1 365px!important;width:365px;max-width:100%}
.bn-package-card{padding:24px 20px 20px!important}
.bn-package-head .pkg-name{font-size:19px!important}
.bn-package-card .pkg-speed-tag{font-size:14px!important;padding:7px 11px}
.bn-package-card .pkg-price{font-size:28px!important}
.bn-package-card .pkg-period{font-size:14px!important}
.bn-package-card .pkg-features li{font-size:15px!important;line-height:1.5;padding:6px 0}
.bn-package-card .pkg-features li i{font-size:15px}
.bn-package-card .btn-pkg-action{font-size:15px!important;padding:12px 10px}
.bn-package-card .pkg-badge-popular{font-size:12px!important;padding:6px 12px}
.bn-features-section{padding:40px 0!important}
.bn-feature-intro h2{font-size:27px!important;line-height:1.25}
.bn-feature-intro p{font-size:15px!important;line-height:1.6}
.bn-feature{padding:24px 16px!important}
.bn-feature .feature-title{font-size:16px!important;line-height:1.4}
.bn-feature .feature-desc{font-size:15px!important;line-height:1.55}
.bn-feature .feature-icon-wrapper{width:48px;height:48px;font-size:22px;margin-bottom:12px}
.bn-quick-link strong{font-size:15px!important}
.bn-quick-link small{font-size:14px!important}
.bn-hero-desc{font-size:16px}
.bn-benefit{font-size:13px}
.bn-secondary-actions .btn{font-size:13px}
.custom-navbar .nav-link{font-size:14px}
.bn-phone-label,.bn-login-note,.bn-login-footer{font-size:14px}
@media(max-width:991.98px){
  .bn-feature-intro h2{font-size:25px!important}
  .bn-packages.bn-package-count-2 .bn-package-col{flex-basis:min(365px,calc((100% - 14px)/2))!important;width:auto}
}
@media(max-width:575.98px){
  .bn-section-header-centered .bn-section-title{font-size:23px!important}
  .bn-section-header-centered .bn-section-subtitle{font-size:13.5px!important}
  .bn-section-header-centered .bn-section-kicker,
  .bn-feature-intro .bn-section-kicker{font-size:12px!important}
  .bn-section-header-centered > a{font-size:13px!important}
  .bn-packages.bn-package-count-2 .bn-package-col{flex:0 1 calc((100% - 8px)/2)!important;width:auto}
  .bn-package-card{padding:19px 12px 13px!important}
  .bn-package-head .pkg-name{font-size:16px!important}
  .bn-package-card .pkg-speed-tag{font-size:12px!important}
  .bn-package-card .pkg-price{font-size:clamp(17px,4.9vw,21px)!important}
  .bn-package-card .pkg-period{font-size:13px!important}
  .bn-package-card .pkg-features li{font-size:13px!important;line-height:1.45;padding:5px 0}
  .bn-package-card .pkg-features li i{font-size:13px}
  .bn-package-card .btn-pkg-action{font-size:13px!important;padding:10px 6px}
  .bn-feature-intro h2{font-size:22px!important}
  .bn-feature-intro p{font-size:14px!important}
  .bn-feature{padding:18px 12px!important}
  .bn-feature .feature-title{font-size:14px!important}
  .bn-feature .feature-desc{font-size:13.5px!important}
  .bn-quick-link strong{font-size:12px!important}
  .bn-quick-link small{font-size:11.5px!important}
  .bn-hero-desc{font-size:13.5px}
  .bn-benefit{font-size:11px}
  .bn-secondary-actions .btn{font-size:11px}
}

/* Paket pada HP/tablet digeser mendatar, tidak turun ke baris berikutnya. */
@media (max-width: 991.98px) {
  .bn-packages {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 4px;
    gap: 14px;
    padding: 22px 4px 20px;
    scrollbar-width: thin;
  }
  .bn-packages .bn-package-col,
  .bn-packages.bn-package-count-1 .bn-package-col,
  .bn-packages.bn-package-count-2 .bn-package-col {
    flex: 0 0 350px !important;
    width: 350px !important;
    max-width: none !important;
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }
}
@media (max-width: 575.98px) {
  .bn-packages {
    gap: 12px;
    padding: 22px 3px 18px;
    scroll-padding-inline: 3px;
  }
  .bn-packages .bn-package-col,
  .bn-packages.bn-package-count-1 .bn-package-col,
  .bn-packages.bn-package-count-2 .bn-package-col {
    flex: 0 0 min(82vw, 330px) !important;
    width: min(82vw, 330px) !important;
  }
  .bn-package-head .pkg-name { font-size: 17px !important; }
  .bn-package-card .pkg-price { font-size: 23px !important; }
  .bn-package-card .pkg-features li { font-size: 14px !important; }
  .bn-package-card .btn-pkg-action { font-size: 14px !important; }
}
/* Logo resmi di ilustrasi modem/ONU: atasi aturan ikon kecil terdahulu. */
.bn-router .bn-router-brand {
  width: 100%;
  justify-content: center;
}
.bn-router .bn-router-brand img.bn-router-wordmark {
  display: block;
  width: min(90%, 250px) !important;
  max-width: 90% !important;
  height: auto !important;
  max-height: 74px;
  object-fit: contain;
}
@media (max-width: 575.98px) {
  .bn-router .bn-router-brand img.bn-router-wordmark {
    width: 91% !important;
    max-width: 91% !important;
  }
}

/* Penyesuaian terbatas ukuran logo modem dan kartu informasi layanan. */
.bn-router .bn-router-brand img.bn-router-wordmark {
  width: min(69%, 180px) !important;
  max-width: 69% !important;
  max-height: 54px;
}
@media (max-width: 575.98px) {
  .bn-router .bn-router-brand img.bn-router-wordmark {
    width: min(74%, 146px) !important;
    max-width: 74% !important;
  }
}
/* Ukuran kolom informasi disamakan dengan 4 kartu Keunggulan. */
#contact-info .bn-contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 4fr);
  gap: 14px;
  align-items: start;
}
#contact-info .bn-contact-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  align-items: stretch;
}
#contact-info .bn-contact-cell {min-width: 0;}
#contact-info .bn-contact-cell > .glass-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 100%;
  padding: 24px 16px !important;
  background: #fff !important;
  border: 1px solid #e5eff8 !important;
  border-radius: 15px !important;
  box-shadow: 0 4px 18px rgba(16,86,151,.04) !important;
  text-align: center;
}
#contact-info .bn-contact-cell > .glass-card > i {
  display: grid !important;
  place-items: center;
  width: 48px;
  height: 48px;
  margin: 0 auto 12px !important;
  background: #e8f5ff;
  border-radius: 50%;
  font-size: 22px !important;
}
#contact-info .bn-contact-cell h5 {
  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.4;
  margin: 0 0 7px !important;
  color: #10254a !important;
}
#contact-info .bn-contact-cell p,
#contact-info .bn-contact-cell a {
  font-size: 15px !important;
  line-height: 1.55;
  font-weight: 400 !important;
  overflow-wrap: anywhere;
  word-break: normal;
}
#contact-info .bn-contact-cell a {color: #086fd8 !important; font-weight: 700 !important;}
@media (max-width: 991.98px) {
  #contact-info .bn-contact-layout {grid-template-columns: minmax(0,1fr);}
}
@media (max-width: 575.98px) {
  #contact-info .bn-contact-card-grid {grid-template-columns: repeat(2, minmax(0,1fr));gap:9px;}
  #contact-info .bn-contact-cell > .glass-card {padding: 18px 12px !important;}
  #contact-info .bn-contact-cell h5 {font-size: 14px !important;}
  #contact-info .bn-contact-cell p,
  #contact-info .bn-contact-cell a {font-size: 13.5px !important;}
}

/* Tinggi kartu informasi mengikuti tinggi kartu Internet Stabil pada tiap lebar layar. */
#contact-info .bn-contact-cell > .glass-card {min-height:222px;}
@media (min-width:992px) and (max-width:1199.98px) {
  #contact-info .bn-contact-cell > .glass-card {min-height:246px;}
}
@media (min-width:576px) and (max-width:991.98px) {
  #contact-info .bn-contact-cell > .glass-card {min-height:232px;}
}
@media (max-width:575.98px) {
  #contact-info .bn-contact-cell > .glass-card {min-height:166px;}
}
@media (max-width:340px) {
  #contact-info .bn-contact-cell > .glass-card {min-height:207px;}
}

/* Logo BonanzaNet pada ilustrasi modem/ONU diperkecil kembali. */
.bn-router .bn-router-brand img.bn-router-wordmark {
  width: min(52%, 130px) !important;
  max-width: 52% !important;
  max-height: 40px;
}
@media (max-width: 575.98px) {
  .bn-router .bn-router-brand img.bn-router-wordmark {
    width: min(59%, 110px) !important;
    max-width: 59% !important;
  }
}
/* Alamat kantor di footer, tepat di antara logo dan deskripsi perusahaan. */
.site-footer .bn-footer-address {
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin:0 0 12px;
  max-width:320px;
  color:#53677c;
}
.site-footer .bn-footer-address > i {
  flex-shrink:0;
  color:#0874d5;
  font-size:18px;
  line-height:1.35;
}
.site-footer .bn-footer-address h6 {
  color:#223b56;
  font-size:14px;
  font-weight:800;
  line-height:1.4;
  margin:0 0 3px;
}
.site-footer .bn-footer-address p {
  color:#53677c !important;
  font-size:13.5px;
  line-height:1.5;
  overflow-wrap:anywhere;
  margin:0;
}

/* Partner resmi: teks, logo, nama partner di tengah kolom informasi perusahaan. */
#contact-info .bn-contact-partner { text-align:center; }
#contact-info .bn-contact-partner > img {
  display:block;
  margin-left:auto;
  margin-right:auto;
}

/* Partner resmi ditengah-tengah seluruh area Informasi Perusahaan, bukan di kolom kiri. */
#contact-info .bn-contact-partner {
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  margin-top:28px !important;
  padding:22px 10px 2px !important;
}
#contact-info .bn-contact-partner > img {
  margin-inline:auto;
  max-width:min(300px,90%) !important;
}