:root{
  --brand:#087AC7;
  --brand-rgb:8,122,199;
  --brand-2:#08D894;
  --brand-2-rgb:8,216,148;
  --dark:#042A4A;
  --soft:#F3FBFF;
  --muted:#64748b;
}
body{background:#fff;color:#102033;font-family:"Poppins",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}.navbar{border-bottom:1px solid rgba(var(--brand-rgb),.08)}.navbar-brand img{max-height:58px;width:auto}.navbar .nav-link{font-weight:600;color:#17324d}.navbar .nav-link:hover{color:var(--brand)}.btn-primary{background:linear-gradient(135deg,var(--brand),var(--brand-2));border:0;box-shadow:0 10px 22px rgba(var(--brand-rgb),.20)}.btn-primary:hover{filter:brightness(.96);transform:translateY(-1px)}.btn-outline-primary{border-color:var(--brand);color:var(--brand)}.btn-outline-primary:hover{background:var(--brand);border-color:var(--brand);color:#fff}.text-primary{color:var(--brand)!important}.bg-primary{background:var(--brand)!important}.hero{background:radial-gradient(circle at 20% 10%,rgba(var(--brand-2-rgb),.35),transparent 32%),linear-gradient(135deg,var(--dark),var(--brand) 58%,var(--brand-2));color:white;border-radius:0 0 46px 46px;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;right:-90px;top:-90px;width:310px;height:310px;background:rgba(255,255,255,.10);border-radius:50%;box-shadow:-70px 130px 0 rgba(255,255,255,.07)}.glass{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(12px)}.card-soft{border:0;border-radius:22px;box-shadow:0 12px 34px rgba(8,122,199,.10)}.card-soft:hover{box-shadow:0 16px 40px rgba(8,216,148,.16)}.section{padding:74px 0}.price{font-size:2.2rem;font-weight:900;color:var(--brand)}.admin-sidebar{min-height:100vh;background:linear-gradient(180deg,var(--dark),#063961 55%,var(--brand))}.admin-sidebar h5{font-weight:800}.admin-sidebar a{color:#e8f7ff;text-decoration:none;display:block;padding:12px 16px;border-radius:14px;margin:4px 0;font-weight:600}.admin-sidebar a:hover,.admin-sidebar a.active{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff}.table td,.table th{vertical-align:middle}.logo-preview{max-height:90px;max-width:260px}.form-control,.form-select,.btn{border-radius:13px}.form-control:focus,.form-select:focus{border-color:var(--brand-2);box-shadow:0 0 0 .2rem rgba(var(--brand-2-rgb),.16)}.badge{border-radius:999px}.footer{background:linear-gradient(135deg,var(--dark),#063961);color:#dbeafe}.footer a{color:#e8fff8}.feature-icon{width:52px;height:52px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(var(--brand-rgb),.12),rgba(var(--brand-2-rgb),.18));color:var(--brand);font-weight:900}.premium-gradient{background:linear-gradient(135deg,rgba(var(--brand-rgb),.08),rgba(var(--brand-2-rgb),.14));border:1px solid rgba(var(--brand-rgb),.08)}@media(max-width:768px){.section{padding:44px 0}.price{font-size:1.8rem}.admin-sidebar{min-height:auto}.navbar-brand img{max-height:48px}}
.whatsapp-float{position:fixed;bottom:22px;right:22px;background:#25d366;color:#fff;width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:29px;text-decoration:none;box-shadow:0 12px 28px rgba(0,0,0,.25);z-index:9999}.whatsapp-float:hover{color:#fff;transform:translateY(-2px)}

/* Penyempurnaan kontras agar teks tidak bertabrakan dengan background */
.hero, .hero *{text-shadow:0 1px 2px rgba(0,0,0,.18)}
.hero .btn, .hero .btn *{text-shadow:none}
.hero .lead{color:rgba(255,255,255,.88)!important}
.hero .glass{color:#fff!important}
.hero .glass h1,.hero .glass h2,.hero .glass h3,.hero .glass h4,.hero .glass h5,.hero .glass li,.hero .glass p{color:#fff!important}
.card-soft,.card-soft p,.card-soft li{color:#23364a}
.card-soft .text-muted{color:#64748b!important}
.footer h1,.footer h2,.footer h3,.footer h4,.footer h5,.footer h6{color:#fff}
.footer p,.footer li,.footer .small{color:#dbeafe}
.whatsapp-float{background:#25d366!important;color:#fff!important;border:3px solid rgba(255,255,255,.85)}
.whatsapp-float i{font-family:"Font Awesome 6 Brands";font-weight:400}
.whatsapp-float .wa-fallback{display:none;font-weight:800;font-size:18px;letter-spacing:.5px}
.whatsapp-float i:empty + .wa-fallback{display:inline-block}
@supports not (font-variation-settings: normal){.whatsapp-float .wa-fallback{display:inline-block}.whatsapp-float i{display:none}}

/* Admin & Employee responsive polish */
.layout-menu.menu-vertical{width:280px;max-width:86vw;overflow-x:hidden}.layout-page{min-width:0}.menu-inner{overflow-y:auto;overflow-x:hidden}.menu .menu-item .menu-link{min-height:46px;border-radius:12px;margin:2px 12px;color:#425466;gap:.25rem}.menu .menu-item .menu-link>div{white-space:normal;line-height:1.25;overflow-wrap:anywhere}.menu .menu-icon{flex:0 0 auto;color:inherit}.bg-menu-theme .menu-inner>.menu-item.active>.menu-link,.bg-menu-theme .menu-inner>.menu-item>.menu-link:hover{color:#fff!important;background:linear-gradient(90deg,var(--brand,#1B75BB),var(--brand-2,#12C48B))!important;box-shadow:0 8px 18px rgba(27,117,187,.18)}.layout-navbar .navbar-nav-right{min-width:0}.layout-navbar .navbar-nav.align-items-center{min-width:0}.layout-navbar .text-muted{white-space:normal;overflow-wrap:anywhere}.content-wrapper{min-width:0}.container-xxl,.container-fluid{max-width:100%}.card{max-width:100%}.table-responsive{width:100%;overflow-x:auto}.btn{white-space:normal}.form-control,.form-select{max-width:100%}
@media(max-width:1199.98px){.layout-menu{position:fixed!important;top:0!important;bottom:0!important;height:100vh!important;z-index:1080}.layout-page{padding-left:0!important}.layout-navbar{margin-inline:12px!important}.container-xxl.flex-grow-1.container-p-y{padding-left:12px!important;padding-right:12px!important}.menu .menu-item .menu-link{margin-left:10px;margin-right:10px}}
@media(max-width:767.98px){.layout-navbar{border-radius:16px!important}.navbar-nav-right{gap:8px}.navbar-nav-right .btn{padding:.45rem .7rem;font-size:.82rem}.content-footer .container-xxl{gap:6px;text-align:center}.card-body{padding:1rem}.card-header{padding:1rem}.menu .app-brand.demo{height:68px}.app-brand-logo img{max-height:40px;max-width:135px}.table td,.table th{font-size:.86rem}.btn-lg{font-size:1rem}.layout-navbar .ms-2.text-muted{display:none!important}}


/* Fix accordion Template Builder agar bisa diklik dan tetap responsif */
.admin-template-accordion .accordion-item{overflow:hidden;background:#fff}
.admin-template-accordion .accordion-button{cursor:pointer;pointer-events:auto;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;min-height:52px;color:#1f2937;background:#fff;border:0;box-shadow:none!important}
.admin-template-accordion .accordion-button:not(.collapsed){color:#0f4f82;background:linear-gradient(90deg,rgba(27,117,187,.08),rgba(18,196,139,.10))}
.admin-template-accordion .accordion-button .badge{white-space:normal;overflow-wrap:anywhere}
.admin-template-accordion .accordion-collapse{display:none}
.admin-template-accordion .accordion-collapse.show{display:block}
.admin-template-accordion .accordion-body{background:#fff}
.admin-template-accordion textarea.form-control{min-height:90px}
@media(max-width:767.98px){
  .admin-template-accordion .accordion-button{font-size:.92rem;align-items:flex-start}
  .admin-template-accordion .accordion-body{padding:.9rem}
  .admin-template-accordion .row.g-3>[class*="col-"]{width:100%;max-width:100%;flex:0 0 100%}
}

/* Modern Bootstrap + FontAwesome polish for public homepage */
.section-kicker{
  display:inline-flex;align-items:center;gap:.25rem;
  padding:.45rem .9rem;border-radius:999px;
  color:var(--brand);background:linear-gradient(135deg,rgba(var(--brand-rgb),.10),rgba(var(--brand-2-rgb),.16));
  font-weight:800;font-size:.78rem;letter-spacing:.02em;
}
.section-stats{position:relative;overflow:hidden}
.section-stats:before{
  content:"";position:absolute;inset:auto -120px -180px auto;width:360px;height:360px;border-radius:50%;
  background:radial-gradient(circle,rgba(var(--brand-2-rgb),.17),transparent 68%);pointer-events:none;
}
.stats-card{
  position:relative;overflow:hidden;border:1px solid rgba(var(--brand-rgb),.08);border-radius:26px;background:#fff;
  padding:1.65rem 1.25rem;text-align:center;box-shadow:0 18px 44px rgba(15,35,60,.08);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.55rem;min-height:190px;
}
.stats-card:hover{transform:translateY(-6px);box-shadow:0 22px 54px rgba(var(--brand-rgb),.16);border-color:rgba(var(--brand-2-rgb),.35)}
.stats-card:after{content:"";position:absolute;right:-42px;top:-42px;width:115px;height:115px;border-radius:50%;background:rgba(var(--brand-2-rgb),.11)}
.stats-icon{width:56px;height:56px;border-radius:18px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font-size:1.35rem;box-shadow:0 12px 24px rgba(var(--brand-rgb),.20)}
.stats-value{font-size:2.05rem;line-height:1;font-weight:900;color:#102033;letter-spacing:-.03em;max-width:100%;overflow-wrap:anywhere;word-break:break-word}
.stats-label{font-size:.96rem;line-height:1.45;color:#475569;max-width:22ch;margin-inline:auto;overflow-wrap:anywhere;word-break:normal;hyphens:auto}
@media(max-width:575.98px){
  .stats-card{min-height:auto;padding:1.25rem 1rem;border-radius:22px;align-items:flex-start;text-align:left}
  .stats-icon{width:48px;height:48px;border-radius:16px;font-size:1.15rem}
  .stats-value{font-size:1.75rem}
  .stats-label{margin-inline:0;max-width:none}
}

/* ===== AZWAR rebuild homepage ===== */
.azn-hero{background:linear-gradient(180deg,#f7faff 0%,#eef5ff 100%);position:relative;overflow:hidden}
.azn-hero:before{content:"";position:absolute;right:-120px;top:-80px;width:320px;height:320px;background:radial-gradient(circle,rgba(47,109,242,.16),transparent 68%);border-radius:50%}
.azn-logo-main{max-width:280px;background:#fff;padding:.35rem}
.azn-title{font-size:clamp(2rem,4vw,4rem);font-weight:900;line-height:1.02;color:#2458d3;letter-spacing:-.03em}
.azn-subbrand{font-size:clamp(1.1rem,2vw,1.8rem);font-weight:800;color:#2458d3;position:relative;display:inline-block;padding-inline:2.2rem}
.azn-subbrand:before,.azn-subbrand:after{content:"";position:absolute;top:50%;width:26px;height:3px;background:#2458d3;border-radius:999px}
.azn-subbrand:before{left:0}.azn-subbrand:after{right:0}
.azn-feature-pill{display:inline-flex;align-items:center;gap:.7rem;padding:.75rem 1rem;border-radius:999px;background:#fff;border:1px solid rgba(36,88,211,.10);box-shadow:0 10px 25px rgba(36,88,211,.08);font-weight:600;color:#17324d}
.azn-feature-pill i{width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2F6DF2,#5f8dff);color:#fff}
.azn-fiber-card{position:relative;min-height:320px;border-radius:28px;overflow:hidden;box-shadow:0 22px 40px rgba(23,50,77,.10);background:#dceaff}
.azn-fiber-bg{position:absolute;inset:0;background:
radial-gradient(circle at 78% 20%,rgba(255,255,255,.95) 0 3px,transparent 4px),
radial-gradient(circle at 84% 28%,rgba(255,255,255,.8) 0 3px,transparent 4px),
radial-gradient(circle at 90% 35%,rgba(255,255,255,.75) 0 3px,transparent 4px),
radial-gradient(circle at 72% 45%,rgba(255,255,255,.7) 0 4px,transparent 5px),
linear-gradient(120deg,transparent 0 40%,rgba(255,255,255,.0) 40%),
repeating-linear-gradient(150deg,rgba(255,255,255,.0) 0 11px,rgba(255,255,255,.25) 12px 14px,rgba(255,255,255,.0) 15px 26px),
linear-gradient(135deg,#cfe2ff,#6fa1ff 60%,#2F6DF2);
opacity:1}
.azn-fiber-overlay{position:relative;z-index:1;padding:2rem;color:#fff;background:linear-gradient(180deg,rgba(22,56,122,.15),rgba(22,56,122,.28))}
.azn-package-card{border:0;border-radius:22px;overflow:hidden;box-shadow:0 18px 38px rgba(23,50,77,.10)}
.azn-package-head{background:#2b57ba;color:#fff;padding:1rem 1.25rem;font-size:1.3rem;font-weight:700;display:flex;align-items:center;justify-content:center;gap:.8rem;min-height:72px;text-align:center;flex-wrap:wrap}
.azn-price{font-size:clamp(2rem,3vw,3rem);font-weight:500;color:#1a2433;line-height:1.1}
.azn-list li{display:flex;align-items:flex-start;gap:.7rem;margin-bottom:.7rem;color:#26384d}
.azn-list i{color:#f5bd1f;margin-top:.25rem}
.azn-divider{width:80px;height:4px;border-radius:999px;background:linear-gradient(90deg,#2F6DF2,#82a6ff);margin:.6rem auto 0}
.azn-contact-item{display:flex;align-items:center;gap:1rem;padding:1rem;border-radius:18px;background:#fff;border:1px solid rgba(23,50,77,.08);box-shadow:0 8px 18px rgba(23,50,77,.06)}
.azn-contact-item i{width:46px;height:46px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#f2f6ff;color:#1f57da;font-size:1.1rem;flex:0 0 auto}
.azn-coverage-card{padding:1.4rem;border-radius:20px;border:1px solid rgba(23,50,77,.08);box-shadow:0 14px 28px rgba(23,50,77,.08)}
.azn-coverage-card.is-active{background:#edf5ff}
.azn-coverage-card.is-soon{background:#fff6d9}
.azn-coverage-icon{width:58px;height:58px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:1.3rem;flex:0 0 auto}
.azn-coverage-card.is-active .azn-coverage-icon{background:#d7e6ff;color:#2458d3}
.azn-coverage-card.is-soon .azn-coverage-icon{background:#ffe6a1;color:#b88400}
@media(max-width:991.98px){.azn-hero{text-align:center}.azn-subbrand{padding-inline:0}.azn-subbrand:before,.azn-subbrand:after{display:none}.azn-feature-pill{justify-content:center}.azn-logo-main{max-width:220px}}


/* ===== PRO ISP LANDING V2 - Azwar Digital Network ===== */
.azn-pro-page{
  background:
    radial-gradient(circle at 10% 8%, rgba(47,109,242,.12), transparent 26rem),
    radial-gradient(circle at 92% 16%, rgba(63,142,76,.12), transparent 22rem),
    #f7f9fc;
  overflow:hidden;
}
.pro-hero{
  min-height: calc(100vh - 82px);
  display:flex;
  align-items:center;
  position:relative;
  padding:6rem 0;
  background:
    linear-gradient(125deg, rgba(255,255,255,.96) 0 45%, rgba(232,241,255,.86) 45% 100%),
    radial-gradient(circle at 84% 30%, rgba(47,109,242,.28), transparent 30rem);
}
.pro-hero:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(115deg, transparent 0 55%, rgba(47,109,242,.12) 55% 56%, transparent 56% 62%, rgba(255,255,255,.42) 62% 63%, transparent 63%),
    repeating-linear-gradient(145deg, transparent 0 22px, rgba(47,109,242,.055) 23px 24px, transparent 25px 48px);
  pointer-events:none;
}
.pro-hero-glow{position:absolute;border-radius:50%;filter:blur(24px);opacity:.75;pointer-events:none}
.pro-glow-one{width:340px;height:340px;background:rgba(47,109,242,.20);right:8%;top:12%}
.pro-glow-two{width:260px;height:260px;background:rgba(63,142,76,.15);left:5%;bottom:10%}
.pro-badge,.pro-mini{
  display:inline-flex;align-items:center;gap:.55rem;border-radius:999px;
  padding:.55rem 1rem;background:#fff;border:1px solid rgba(47,109,242,.12);
  color:#2458d3;font-weight:800;font-size:.82rem;box-shadow:0 12px 30px rgba(31,64,140,.08)
}
.pro-mini{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}
.pro-mini.light{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.16);color:#fff}
.pro-title{
  color:#1f55db;
  font-size:clamp(2.8rem,6.6vw,6.2rem);
  line-height:.95;
  font-weight:950;
  letter-spacing:-.065em;
  text-transform:uppercase;
  text-shadow:0 10px 28px rgba(31,85,219,.12);
}
.pro-lead{font-size:1.16rem;max-width:42rem;line-height:1.8}
.btn-pro-green{
  background:linear-gradient(135deg,#198447,#3F8E4C);
  color:#fff!important;border:0;border-radius:16px;font-weight:800;
  box-shadow:0 14px 28px rgba(25,132,71,.22);
}
.btn-pro-green:hover{filter:brightness(.96);transform:translateY(-2px)}
.btn-pro-outline{
  border:1px solid rgba(31,85,219,.35);color:#1f55db!important;background:#fff;border-radius:16px;font-weight:800;
  box-shadow:0 12px 24px rgba(31,85,219,.08)
}
.btn-pro-outline:hover{background:#1f55db;color:#fff!important;transform:translateY(-2px)}
.pro-metric{
  background:rgba(255,255,255,.88);border:1px solid rgba(47,109,242,.10);border-radius:20px;
  padding:1rem;box-shadow:0 14px 34px rgba(31,64,140,.08);height:100%;
}
.pro-metric strong{display:block;font-size:1.35rem;color:#173b96;font-weight:950;line-height:1}
.pro-metric span{display:block;color:#64748b;font-size:.86rem;margin-top:.3rem}
.pro-orbit-card{
  min-height:540px;position:relative;border-radius:38px;background:
    radial-gradient(circle at 50% 52%, rgba(255,255,255,.96), rgba(255,255,255,.76) 34%, rgba(222,236,255,.72) 58%, rgba(47,109,242,.10));
  border:1px solid rgba(47,109,242,.12);
  box-shadow:0 26px 70px rgba(31,64,140,.16);
  overflow:hidden;
}
.pro-orbit-ring{position:absolute;inset:50%;border-radius:50%;border:1px dashed rgba(47,109,242,.28);transform:translate(-50%,-50%)}
.ring-one{width:410px;height:410px}.ring-two{width:280px;height:280px;border-style:solid;border-color:rgba(63,142,76,.20)}
.pro-logo-planet{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:230px;height:230px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:#fff;border:10px solid rgba(47,109,242,.10);
  box-shadow:0 24px 50px rgba(31,64,140,.22);overflow:hidden;padding:1rem;
}
.pro-logo-planet img{width:100%;height:100%;object-fit:contain}
.pro-floating-card{
  position:absolute;display:flex;align-items:center;gap:.9rem;background:rgba(255,255,255,.94);
  border:1px solid rgba(47,109,242,.10);border-radius:22px;padding:1rem 1.1rem;
  box-shadow:0 20px 45px rgba(31,64,140,.14);backdrop-filter:blur(10px);max-width:270px;
}
.pro-floating-card i{width:46px;height:46px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2F6DF2,#6b95ff);color:#fff;flex:0 0 auto}
.pro-floating-card b{display:block;color:#15233b}.pro-floating-card small{display:block;color:#64748b;line-height:1.25}
.card-a{left:34px;top:82px}.card-b{right:24px;top:210px}.card-c{left:74px;bottom:64px}
.pro-section{padding:6rem 0}
.pro-section-head h2,.pro-contact h2{font-size:clamp(2rem,4vw,3.2rem);font-weight:950;letter-spacing:-.04em;color:#121d31}
.pro-section-head p{color:#64748b;font-size:1.05rem}
.pro-feature-card{
  background:#fff;border:1px solid rgba(31,64,140,.08);border-radius:28px;padding:1.6rem;
  box-shadow:0 18px 44px rgba(31,64,140,.08);transition:.22s ease;
}
.pro-feature-card:hover{transform:translateY(-8px);box-shadow:0 24px 60px rgba(31,85,219,.16)}
.pro-icon{width:60px;height:60px;border-radius:20px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2F6DF2,#79a0ff);color:#fff;font-size:1.35rem;margin-bottom:1.1rem}
.pro-feature-card h5{font-weight:900;color:#15233b}.pro-feature-card p{color:#64748b;margin-bottom:0;line-height:1.7}
.pro-price-card{
  position:relative;background:#fff;border:1px solid rgba(31,64,140,.08);border-radius:30px;padding:1.25rem;
  box-shadow:0 20px 48px rgba(31,64,140,.09);transition:.22s ease;overflow:hidden;
}
.pro-price-card:hover{transform:translateY(-8px);box-shadow:0 28px 70px rgba(31,85,219,.17)}
.pro-price-card.is-popular{border-color:rgba(47,109,242,.36);box-shadow:0 28px 70px rgba(47,109,242,.16)}
.pro-ribbon{position:absolute;right:1rem;top:1rem;background:#ffe044;color:#1d2a42;font-weight:900;font-size:.78rem;padding:.35rem .7rem;border-radius:999px;z-index:2}
.pro-ribbon.gold{background:#ffd35a}
.pro-price-top{background:linear-gradient(135deg,#1f55db,#2d66ea);border-radius:22px;padding:1.35rem;color:#fff;text-align:center;margin-bottom:1.4rem}
.pro-price-top h3{margin:0;font-size:1.45rem;font-weight:900}.pro-price-top span{opacity:.9;font-weight:600}
.pro-price{font-size:clamp(2.2rem,4vw,3.3rem);font-weight:950;color:#121d31;text-align:center;line-height:1}
.pro-price-note{text-align:center;color:#64748b;margin:.35rem 0 1.35rem}
.pro-price-list{list-style:none;padding:0;margin:0 0 1.6rem}
.pro-price-list li{display:flex;align-items:flex-start;gap:.8rem;padding:.55rem 0;color:#26384d;font-weight:500}
.pro-price-list i{color:#f2bd16;margin-top:.15rem}
.pro-dark{background:
  radial-gradient(circle at 15% 0%, rgba(47,109,242,.28), transparent 24rem),
  radial-gradient(circle at 90% 80%, rgba(63,142,76,.20), transparent 22rem),
  #081329;
}
.pro-step{height:100%;border-radius:26px;padding:1.4rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#fff;backdrop-filter:blur(12px)}
.pro-step span{display:inline-block;font-weight:950;color:#6ea1ff;margin-bottom:1rem}
.pro-step i{display:flex;width:54px;height:54px;border-radius:18px;align-items:center;justify-content:center;background:rgba(255,255,255,.12);font-size:1.25rem;margin-bottom:1rem}
.pro-step h5{font-weight:900}.pro-step p{color:rgba(255,255,255,.64);margin:0}
.pro-coverage{
  display:flex;align-items:center;gap:1.1rem;padding:1.35rem;border-radius:26px;border:1px solid rgba(31,64,140,.08);
  box-shadow:0 18px 40px rgba(31,64,140,.08);transition:.22s ease;
}
.pro-coverage:hover{transform:translateY(-5px)}
.pro-coverage.active{background:linear-gradient(135deg,#edf5ff,#fff)}
.pro-coverage.soon{background:linear-gradient(135deg,#fff4cf,#fff)}
.pro-coverage-pin{width:68px;height:68px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.55rem;flex:0 0 auto}
.pro-coverage.active .pro-coverage-pin{background:#d9e8ff;color:#1f55db}
.pro-coverage.soon .pro-coverage-pin{background:#ffe49a;color:#b88400}
.pro-coverage h4{font-weight:950;margin:0;color:#1f55db}.pro-coverage p{margin:.25rem 0;color:#64748b}.pro-coverage span{display:inline-block;border-radius:999px;padding:.25rem .8rem;font-weight:900;font-size:.78rem}
.pro-coverage.active span{background:#1f55db;color:#fff}.pro-coverage.soon span{background:#ffc928;color:#1d2a42}
.pro-contact{background:#fff;border-radius:34px;padding:2rem;box-shadow:0 22px 60px rgba(31,64,140,.10);border:1px solid rgba(31,64,140,.08)}
.pro-contact-item{height:100%;border-radius:24px;border:1px solid rgba(31,64,140,.08);padding:1.25rem;text-align:center;background:#fbfdff}
.pro-contact-item i{width:56px;height:56px;border-radius:20px;display:inline-flex;align-items:center;justify-content:center;background:#eef5ff;color:#1f55db;font-size:1.25rem;margin-bottom:.8rem}
.pro-contact-item small{display:block;color:#64748b}.pro-contact-item b{display:block;color:#15233b;overflow-wrap:anywhere}
@media(max-width:991.98px){
  .pro-hero{padding:4rem 0;text-align:center;min-height:auto}
  .pro-lead{margin-inline:auto}
  .pro-orbit-card{min-height:430px}
  .pro-logo-planet{width:190px;height:190px}
  .card-a{left:18px;top:52px}.card-b{right:16px;top:180px}.card-c{left:24px;bottom:48px}
}
@media(max-width:575.98px){
  .pro-hero{padding:3rem 0}.pro-section{padding:4rem 0}
  .pro-orbit-card{min-height:360px;border-radius:26px}
  .pro-logo-planet{width:150px;height:150px;border-width:7px}
  .pro-floating-card{position:absolute;padding:.75rem;border-radius:18px;max-width:190px;font-size:.82rem}
  .pro-floating-card i{width:38px;height:38px;border-radius:13px}
  .card-a{left:8px;top:34px}.card-b{right:8px;top:152px}.card-c{left:12px;bottom:30px}
  .ring-one{width:300px;height:300px}.ring-two{width:210px;height:210px}
  .pro-price-card,.pro-feature-card,.pro-contact{border-radius:24px}
}


/* ===== NAV MENU FIX + 4D ISP ANIMATION ===== */
.azn-main-nav{
  z-index: 1050;
  border-bottom:1px solid rgba(31,85,219,.10);
}
.azn-main-nav .nav-brand-logo{
  max-height:54px;
  max-width:220px;
  object-fit:contain;
}
.azn-main-nav .navbar-nav .nav-link{
  color:#1a2942!important;
  font-weight:800;
  border-radius:14px;
  padding:.72rem .86rem!important;
  display:flex;
  align-items:center;
  gap:.25rem;
}
.azn-main-nav .navbar-nav .nav-link:hover,
.azn-main-nav .navbar-nav .nav-link:focus{
  color:#1f55db!important;
  background:#eef5ff;
}
.azn-main-nav .navbar-toggler{
  background:#eef5ff;
  border-radius:14px;
  padding:.7rem .85rem;
}
@media(max-width:1199.98px){
  .azn-main-nav .navbar-collapse{
    background:#fff;
    border-radius:22px;
    margin-top:1rem;
    padding:.75rem;
    box-shadow:0 18px 40px rgba(31,64,140,.12);
    max-height:calc(100vh - 95px);
    overflow-y:auto;
  }
  .azn-main-nav .navbar-nav .nav-link{justify-content:flex-start}
  .azn-main-nav .btn-pro-green{width:100%;justify-content:center;display:flex}
}
@media(max-width:575.98px){
  .azn-main-nav .nav-brand-logo{max-height:44px;max-width:170px}
}

/* Canvas background network animation */
.isp-network-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  opacity:.9;
  pointer-events:none;
}
.pro-hero>.container{z-index:2}
.pro-hero{isolation:isolate}

/* 4D-ish orbit visual */
.pro-4d-stage{
  perspective:1100px;
  transform-style:preserve-3d;
}
.pro-grid-space{
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(47,109,242,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47,109,242,.10) 1px, transparent 1px);
  background-size:38px 38px;
  transform:rotateX(62deg) translateY(100px) scale(1.15);
  transform-origin:center bottom;
  opacity:.38;
  mask-image:linear-gradient(to top, #000 0%, transparent 76%);
}
.ring-three{width:520px;height:520px;border-style:dotted;border-color:rgba(47,109,242,.16);animation:orbitSpin 26s linear infinite reverse}
.ring-one{animation:orbitSpin 18s linear infinite}
.ring-two{animation:orbitSpin 22s linear infinite reverse}
@keyframes orbitSpin{
  from{transform:translate(-50%,-50%) rotate(0deg)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}
.pro-logo-planet{
  animation:planetFloat 4.8s ease-in-out infinite;
}
@keyframes planetFloat{
  0%,100%{transform:translate(-50%,-50%) translateY(0) rotateY(0deg)}
  50%{transform:translate(-50%,-50%) translateY(-12px) rotateY(8deg)}
}
.pro-node{
  position:absolute;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:92px;height:92px;
  border-radius:24px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(47,109,242,.16);
  box-shadow:0 18px 42px rgba(31,64,140,.14);
  color:#1f55db;
  font-weight:900;
  z-index:3;
  animation:nodeFloat 5s ease-in-out infinite;
}
.pro-node i{font-size:1.55rem;margin-bottom:.35rem}
.pro-node span{font-size:.78rem;color:#1a2942}
.node-a{left:38px;top:52%;animation-delay:.1s}
.node-b{right:56px;top:54%;animation-delay:.6s}
.node-c{left:50%;top:22px;transform:translateX(-50%);animation-delay:1.1s}
.node-d{left:50%;bottom:26px;transform:translateX(-50%);animation-delay:1.6s}
@keyframes nodeFloat{
  0%,100%{margin-top:0}
  50%{margin-top:-10px}
}
.pro-flow{
  position:absolute;
  height:3px;
  background:linear-gradient(90deg, transparent, #2F6DF2, #3F8E4C, transparent);
  border-radius:999px;
  filter:drop-shadow(0 0 8px rgba(47,109,242,.55));
  z-index:2;
  opacity:.72;
  animation:flowMove 2.8s linear infinite;
}
.flow-a{left:120px;top:49%;width:150px;transform:rotate(-12deg)}
.flow-b{right:130px;top:50%;width:150px;transform:rotate(12deg);animation-delay:.5s}
.flow-c{left:50%;top:33%;width:150px;transform:translateX(-50%) rotate(90deg);animation-delay:1s}
@keyframes flowMove{
  0%{background-position:-160px 0;opacity:.35}
  50%{opacity:.95}
  100%{background-position:160px 0;opacity:.35}
}

/* Tutorial topology animation */
.pro-tutorial-title{
  font-size:clamp(2rem,4vw,3.4rem);
  line-height:1.06;
  letter-spacing:-.04em;
  color:#121d31;
}
.pro-network-tutorial{
  background:
    radial-gradient(circle at 15% 20%, rgba(47,109,242,.08), transparent 22rem),
    radial-gradient(circle at 90% 70%, rgba(63,142,76,.08), transparent 24rem),
    #fff;
}
.pro-tutorial-list{display:grid;gap:.9rem;margin-top:1.4rem}
.pro-tutorial-list div{
  display:flex;align-items:center;gap:.9rem;
  padding:1rem;border-radius:18px;background:#f7faff;
  border:1px solid rgba(47,109,242,.10);font-weight:700;color:#21324c;
}
.pro-tutorial-list i{
  width:42px;height:42px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:#e8f0ff;color:#1f55db;
}
.pro-topology-card{
  position:relative;
  min-height:460px;
  border-radius:36px;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 50%, rgba(47,109,242,.12), transparent 15rem),
    linear-gradient(135deg,#081329,#112b67 58%,#0d653c);
  box-shadow:0 28px 70px rgba(15,35,60,.18);
  border:1px solid rgba(255,255,255,.10);
}
.pro-topology-card:before{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size:44px 44px;
  opacity:.28;
}
.topology-device{
  position:absolute;
  z-index:2;
  width:132px;
  min-height:118px;
  border-radius:26px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(255,255,255,.42);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  box-shadow:0 24px 55px rgba(0,0,0,.22);
  animation:deviceFloat 4.6s ease-in-out infinite;
}
.topology-device i{font-size:2rem;color:#1f55db;margin-bottom:.5rem}
.topology-device b{color:#121d31}
.topology-device small{color:#64748b}
.device-internet{left:8%;top:12%;animation-delay:.1s}
.device-pop{left:40%;top:36%;animation-delay:.6s}
.device-olt{right:8%;top:13%;animation-delay:1.1s}
.device-home{right:14%;bottom:12%;animation-delay:1.6s}
@keyframes deviceFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.topology-line{
  position:absolute;
  z-index:1;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(255,255,255,.05),rgba(120,170,255,.9),rgba(65,220,145,.8),rgba(255,255,255,.05));
  box-shadow:0 0 18px rgba(80,145,255,.65);
  animation:linePulse 2.6s ease-in-out infinite;
}
.line-1{left:20%;top:35%;width:245px;transform:rotate(18deg)}
.line-2{left:55%;top:35%;width:210px;transform:rotate(-18deg);animation-delay:.55s}
.line-3{right:20%;top:62%;width:190px;transform:rotate(62deg);animation-delay:1s}
@keyframes linePulse{0%,100%{opacity:.4;filter:blur(0)}50%{opacity:1;filter:blur(.3px)}}
.topology-pulse{
  position:absolute;
  z-index:3;
  width:15px;height:15px;border-radius:50%;
  background:#6ea1ff;
  box-shadow:0 0 0 8px rgba(110,161,255,.12),0 0 22px rgba(110,161,255,.95);
  animation:pulsePath 4.4s linear infinite;
}
.pulse-1{left:18%;top:30%}
.pulse-2{left:52%;top:40%;animation-delay:1s}
.pulse-3{right:26%;top:60%;animation-delay:2s}
@keyframes pulsePath{
  0%{transform:translate(0,0) scale(.7);opacity:.2}
  40%{opacity:1}
  100%{transform:translate(130px,60px) scale(1.1);opacity:.05}
}
@media(max-width:991.98px){
  .pro-node{width:78px;height:78px;border-radius:20px}
  .pro-node span{font-size:.7rem}
  .node-a{left:12px}.node-b{right:12px}
  .flow-a,.flow-b{width:100px}
  .pro-topology-card{min-height:520px}
  .device-internet{left:7%;top:8%}.device-pop{left:35%;top:36%}.device-olt{right:7%;top:8%}.device-home{right:24%;bottom:8%}
}
@media(max-width:575.98px){
  .pro-topology-card{min-height:560px;border-radius:26px}
  .topology-device{width:118px;min-height:106px;border-radius:22px}
  .device-internet{left:50%;top:7%;transform:translateX(-50%)}
  .device-pop{left:50%;top:31%;transform:translateX(-50%)}
  .device-olt{left:50%;right:auto;top:55%;transform:translateX(-50%)}
  .device-home{left:50%;right:auto;bottom:6%;transform:translateX(-50%)}
  .line-1,.line-2,.line-3{left:50%;width:3px;height:85px;transform:translateX(-50%);top:auto}
  .line-1{top:24%}.line-2{top:47%}.line-3{top:70%}
  .topology-pulse{display:none}
}


/* ===== HARD FIX: visible public menu + 4D character guide ===== */
.azn-super-nav{
  background:rgba(255,255,255,.96)!important;
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(31,85,219,.12);
  box-shadow:0 10px 30px rgba(15,35,60,.07);
  z-index:2000!important;
}
.azn-nav-wrap{
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.25rem;
  width:100%;
}
.azn-nav-brand{
  display:flex!important;
  align-items:center;
  gap:.85rem;
  text-decoration:none!important;
  color:#1f55db!important;
  font-weight:950;
  letter-spacing:-.02em;
  min-width:0;
}
.azn-nav-brand img{
  height:56px!important;
  width:56px!important;
  min-width:56px;
  object-fit:contain;
  border-radius:12px;
  background:#fff;
  box-shadow:0 8px 18px rgba(31,85,219,.08);
}
.azn-nav-brand span{
  display:block!important;
  font-size:1rem;
  line-height:1.1;
  white-space:normal;
  max-width:260px;
}
.azn-nav-menu{
  display:flex!important;
  align-items:center;
  justify-content:flex-end;
  gap:.25rem;
  flex-wrap:wrap;
}
.azn-nav-menu a{
  display:inline-flex!important;
  align-items:center;
  gap:.45rem;
  padding:.74rem .88rem;
  border-radius:16px;
  text-decoration:none!important;
  color:#1a2942!important;
  font-weight:850;
  font-size:.94rem;
  line-height:1;
  white-space:nowrap;
}
.azn-nav-menu a:hover{
  color:#1f55db!important;
  background:#eef5ff;
  transform:translateY(-1px);
}
.azn-nav-menu .azn-nav-cta{
  background:linear-gradient(135deg,#198447,#3F8E4C)!important;
  color:#fff!important;
  box-shadow:0 12px 26px rgba(25,132,71,.22);
}
.azn-nav-menu .azn-nav-cta:hover{color:#fff!important;filter:brightness(.96)}
.azn-nav-toggle{
  display:none;
  border:0;
  background:#eef5ff;
  color:#1f55db;
  width:48px;
  height:48px;
  border-radius:16px;
  font-size:1.1rem;
}
@media(max-width:1399.98px){
  .azn-nav-menu a{font-size:.86rem;padding:.68rem .62rem}
  .azn-nav-brand span{max-width:210px;font-size:.92rem}
}
@media(max-width:1199.98px){
  .azn-nav-wrap{min-height:76px;flex-wrap:wrap}
  .azn-nav-toggle{display:inline-flex;align-items:center;justify-content:center}
  .azn-nav-menu{
    display:none!important;
    width:100%;
    flex-direction:column;
    align-items:stretch;
    gap:.45rem;
    padding:.9rem;
    border-radius:24px;
    background:#fff;
    box-shadow:0 18px 44px rgba(31,64,140,.14);
    margin-bottom:.9rem;
  }
  .azn-nav-menu.show{display:flex!important}
  .azn-nav-menu a{width:100%;justify-content:flex-start;font-size:.98rem;padding:.92rem 1rem}
  .azn-nav-menu .azn-nav-cta{justify-content:center}
  .azn-nav-brand img{height:48px!important;width:48px!important;min-width:48px}
  .azn-nav-brand span{max-width:calc(100vw - 150px);font-size:.9rem}
}
@media(max-width:575.98px){
  .azn-nav-brand span{font-size:.78rem;max-width:190px}
}

/* Character guide section */
.pro-character-guide{
  background:
    radial-gradient(circle at 10% 20%, rgba(47,109,242,.10), transparent 24rem),
    radial-gradient(circle at 85% 60%, rgba(63,142,76,.08), transparent 24rem),
    linear-gradient(180deg,#fff,#f7faff);
}
.pro-guide-title{
  font-size:clamp(2rem,4vw,3.5rem);
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.05em;
  color:#121d31;
}
.pro-4d-character-wrap{
  position:relative;
  min-height:520px;
  display:flex;
  align-items:center;
  justify-content:center;
  perspective:1200px;
}
.pro-4d-character{
  position:relative;
  width:240px;
  height:330px;
  transform-style:preserve-3d;
  animation:characterFloat 4.2s ease-in-out infinite;
  z-index:3;
}
@keyframes characterFloat{
  0%,100%{transform:translateY(0) rotateY(-8deg) rotateX(2deg)}
  50%{transform:translateY(-18px) rotateY(10deg) rotateX(-2deg)}
}
.pro-4d-shadow{
  position:absolute;
  bottom:74px;
  width:230px;
  height:46px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(31,85,219,.20),transparent 70%);
  filter:blur(3px);
  animation:shadowPulse 4.2s ease-in-out infinite;
}
@keyframes shadowPulse{0%,100%{transform:scale(1);opacity:.5}50%{transform:scale(.82);opacity:.28}}
.char-antenna{
  position:absolute;
  left:50%;
  top:0;
  width:5px;
  height:42px;
  background:#1f55db;
  border-radius:999px;
  transform:translateX(-50%);
}
.char-antenna:after{
  content:"";
  position:absolute;
  left:50%;
  top:-12px;
  width:22px;
  height:22px;
  border-radius:50%;
  background:linear-gradient(135deg,#6ea1ff,#1f55db);
  transform:translateX(-50%);
  box-shadow:0 0 24px rgba(47,109,242,.8);
}
.char-head{
  position:absolute;
  left:50%;
  top:34px;
  width:154px;
  height:128px;
  transform:translateX(-50%);
  border-radius:44px;
  background:linear-gradient(145deg,#ffffff,#dfeaff);
  border:1px solid rgba(47,109,242,.18);
  box-shadow:inset -12px -14px 26px rgba(47,109,242,.12),0 24px 46px rgba(31,64,140,.18);
}
.char-eye{
  position:absolute;
  top:48px;
  width:24px;
  height:24px;
  border-radius:50%;
  background:#1f55db;
  box-shadow:0 0 18px rgba(47,109,242,.65);
  animation:blinkEye 4.5s infinite;
}
.char-eye.left{left:43px}.char-eye.right{right:43px}
@keyframes blinkEye{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.12)}}
.char-smile{
  position:absolute;
  left:50%;
  bottom:30px;
  width:50px;
  height:22px;
  border-bottom:5px solid #3F8E4C;
  border-radius:0 0 40px 40px;
  transform:translateX(-50%);
}
.char-body{
  position:absolute;
  left:50%;
  top:170px;
  width:184px;
  height:142px;
  transform:translateX(-50%);
  border-radius:42px 42px 34px 34px;
  background:linear-gradient(145deg,#2F6DF2,#16387A);
  box-shadow:inset -18px -18px 28px rgba(0,0,0,.13),0 24px 44px rgba(31,64,140,.22);
}
.char-badge{
  position:absolute;
  left:50%;
  top:35px;
  width:66px;
  height:66px;
  border-radius:24px;
  transform:translateX(-50%);
  background:#fff;
  color:#1f55db;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.7rem;
  box-shadow:0 14px 28px rgba(0,0,0,.12);
}
.char-arm{
  position:absolute;
  width:54px;
  height:110px;
  border-radius:30px;
  background:linear-gradient(145deg,#6ea1ff,#1f55db);
  top:15px;
}
.arm-left{left:-46px;transform:rotate(24deg);animation:waveLeft 2.6s ease-in-out infinite}
.arm-right{right:-46px;transform:rotate(-24deg);animation:waveRight 2.6s ease-in-out infinite}
@keyframes waveLeft{0%,100%{transform:rotate(24deg)}50%{transform:rotate(44deg)}}
@keyframes waveRight{0%,100%{transform:rotate(-24deg)}50%{transform:rotate(-44deg)}}
.char-leg{
  position:absolute;
  bottom:-42px;
  width:52px;
  height:70px;
  border-radius:0 0 28px 28px;
  background:linear-gradient(145deg,#16387A,#0b1d4a);
}
.leg-left{left:42px}.leg-right{right:42px}
.char-signal{
  position:absolute;
  border:2px solid rgba(47,109,242,.34);
  border-left:0;
  border-bottom:0;
  border-radius:0 999px 0 0;
  animation:signalPing 2.4s ease-out infinite;
}
.sig-1{width:170px;height:170px;right:40px;top:90px}
.sig-2{width:230px;height:230px;right:10px;top:60px;animation-delay:.45s}
.sig-3{width:290px;height:290px;right:-20px;top:30px;animation-delay:.9s}
@keyframes signalPing{0%{opacity:0;transform:scale(.75)}35%{opacity:1}100%{opacity:0;transform:scale(1.08)}}
.guide-bubble{
  position:relative;
  background:#fff;
  border:1px solid rgba(31,64,140,.08);
  border-radius:26px;
  padding:1.35rem;
  box-shadow:0 18px 44px rgba(31,64,140,.08);
  transition:.22s ease;
}
.guide-bubble:hover{transform:translateY(-6px);box-shadow:0 24px 58px rgba(31,85,219,.15)}
.guide-bubble i{
  width:54px;
  height:54px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  background:linear-gradient(135deg,#2F6DF2,#74a0ff);
  color:#fff;
  font-size:1.25rem;
  margin-bottom:1rem;
}
.guide-bubble h5{font-weight:950;color:#15233b}
.guide-bubble p{color:#64748b;margin:0;line-height:1.7}
@media(max-width:991.98px){
  .pro-4d-character-wrap{min-height:420px}
  .pro-4d-character{transform:scale(.9)}
}
@media(max-width:575.98px){
  .pro-4d-character-wrap{min-height:360px}
  .pro-4d-character{transform:scale(.72)}
  .sig-1,.sig-2,.sig-3{display:none}
}


/* ===== 4D Video Explainer Section ===== */
.pro-video-explainer{
  background:
    radial-gradient(circle at 20% 10%, rgba(47,109,242,.12), transparent 26rem),
    radial-gradient(circle at 85% 80%, rgba(63,142,76,.10), transparent 26rem),
    linear-gradient(180deg,#f8fbff,#ffffff);
}
.video4d-stage{
  min-height:620px;
  position:relative;
  overflow:hidden;
  border-radius:38px;
  background:
    radial-gradient(circle at 45% 42%, rgba(255,255,255,.92), rgba(225,237,255,.60) 32%, transparent 46%),
    linear-gradient(135deg,#07152f,#123278 52%,#0e6744);
  box-shadow:0 34px 80px rgba(15,35,60,.22);
  border:1px solid rgba(255,255,255,.22);
  transform-style:preserve-3d;
  perspective:1200px;
}
.video4d-grid{
  position:absolute;inset:-10%;
  background:
    linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:48px 48px;
  transform:rotateX(62deg) translateY(180px) scale(1.22);
  transform-origin:center bottom;
  opacity:.38;
}
.video4d-sky-glow{position:absolute;border-radius:50%;filter:blur(28px);opacity:.7}
.video4d-sky-glow.glow-a{width:330px;height:330px;background:rgba(47,109,242,.42);right:5%;top:4%}
.video4d-sky-glow.glow-b{width:260px;height:260px;background:rgba(63,142,76,.32);left:10%;bottom:8%}
.video4d-character{
  position:absolute;left:50%;top:50%;z-index:5;
  width:170px;height:245px;
  transform:translate(-50%,-50%) rotateY(-10deg);
  animation:v4dCharFloat 4s ease-in-out infinite;
}
@keyframes v4dCharFloat{0%,100%{transform:translate(-50%,-50%) translateY(0) rotateY(-10deg)}50%{transform:translate(-50%,-50%) translateY(-16px) rotateY(12deg)}}
.v4d-head{
  position:absolute;left:50%;top:0;transform:translateX(-50%);
  width:132px;height:108px;border-radius:36px;
  background:linear-gradient(145deg,#fff,#dce8ff);
  box-shadow:inset -10px -12px 22px rgba(47,109,242,.13),0 20px 40px rgba(0,0,0,.18);
}
.v4d-eye{position:absolute;top:40px;width:20px;height:20px;border-radius:50%;background:#1f55db;box-shadow:0 0 16px rgba(110,161,255,.85);animation:v4dBlink 4.2s infinite}
.v4d-eye.eye-left{left:36px}.v4d-eye.eye-right{right:36px}
@keyframes v4dBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.12)}}
.v4d-mouth{position:absolute;left:50%;bottom:24px;width:42px;height:18px;border-bottom:5px solid #3F8E4C;border-radius:0 0 26px 26px;transform:translateX(-50%)}
.v4d-body{
  position:absolute;left:50%;top:122px;transform:translateX(-50%);
  width:150px;height:110px;border-radius:34px;
  background:linear-gradient(145deg,#2F6DF2,#16387A);
  box-shadow:inset -14px -14px 24px rgba(0,0,0,.16),0 24px 40px rgba(0,0,0,.20);
}
.v4d-badge{position:absolute;left:50%;top:26px;transform:translateX(-50%);width:58px;height:58px;border-radius:20px;background:#fff;color:#1f55db;display:flex;align-items:center;justify-content:center;font-size:1.5rem}
.v4d-hand{position:absolute;top:12px;width:42px;height:88px;border-radius:999px;background:linear-gradient(145deg,#78a4ff,#1f55db)}
.hand-left{left:-34px;transform:rotate(24deg);animation:v4dWaveL 2.2s ease-in-out infinite}.hand-right{right:-34px;transform:rotate(-24deg);animation:v4dWaveR 2.2s ease-in-out infinite}
@keyframes v4dWaveL{0%,100%{transform:rotate(24deg)}50%{transform:rotate(48deg)}}@keyframes v4dWaveR{0%,100%{transform:rotate(-24deg)}50%{transform:rotate(-48deg)}}
.scene-device{
  position:absolute;z-index:4;width:145px;min-height:118px;border-radius:26px;
  background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.38);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  box-shadow:0 22px 50px rgba(0,0,0,.20);
  transition:.55s ease;
}
.scene-device i{font-size:2rem;color:#1f55db;margin-bottom:.45rem}.scene-device b{color:#121d31}.scene-device small{color:#64748b}
.scene-cloud{left:8%;top:10%}.scene-core{right:10%;top:12%}.scene-olt{right:12%;bottom:12%}.scene-home{left:10%;bottom:14%}
.v4d-line{position:absolute;z-index:2;height:4px;border-radius:999px;background:linear-gradient(90deg,transparent,#6ea1ff,#43dc91,transparent);box-shadow:0 0 18px rgba(110,161,255,.75);animation:v4dLine 2.8s ease-in-out infinite}
.l1{left:21%;top:27%;width:270px;transform:rotate(16deg)}.l2{right:22%;top:31%;width:270px;transform:rotate(-16deg);animation-delay:.5s}.l3{right:24%;bottom:33%;width:300px;transform:rotate(165deg);animation-delay:1s}
@keyframes v4dLine{0%,100%{opacity:.32}50%{opacity:1}}
.v4d-packet{position:absolute;z-index:6;width:16px;height:16px;border-radius:50%;background:#8db2ff;box-shadow:0 0 0 8px rgba(141,178,255,.13),0 0 22px rgba(141,178,255,1);animation:v4dPacket 4s linear infinite}
.p1{left:17%;top:25%}.p2{right:24%;top:30%;animation-delay:1.2s}.p3{right:30%;bottom:34%;animation-delay:2.2s}
@keyframes v4dPacket{0%{transform:translate(0,0) scale(.65);opacity:.25}45%{opacity:1}100%{transform:translate(180px,70px) scale(1.1);opacity:.04}}
.v4d-caption{
  position:absolute;left:24px;right:24px;bottom:24px;z-index:7;
  background:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.45);
  border-radius:24px;padding:1.25rem;box-shadow:0 18px 44px rgba(0,0,0,.18);backdrop-filter:blur(14px);
}
.v4d-caption-step{display:inline-flex;border-radius:999px;background:#eef5ff;color:#1f55db;font-size:.78rem;font-weight:900;padding:.25rem .75rem;margin-bottom:.5rem}
.v4d-caption h4{font-weight:950;color:#121d31;margin-bottom:.3rem}.v4d-caption p{color:#475569;margin:0}
.video4d-panel{background:#fff;border:1px solid rgba(31,64,140,.08);border-radius:30px;padding:1.5rem;box-shadow:0 24px 60px rgba(31,64,140,.10)}
.video4d-steps{display:grid;gap:.7rem}
.video4d-steps button{border:1px solid rgba(31,64,140,.08);background:#f8fbff;border-radius:20px;padding:1rem;text-align:left;display:flex;gap:.9rem;align-items:center;transition:.2s ease;color:#15233b}
.video4d-steps button i{width:44px;height:44px;border-radius:16px;background:#e8f0ff;color:#1f55db;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.video4d-steps button b{display:block}.video4d-steps button small{display:block;color:#64748b}
.video4d-steps button.active{background:linear-gradient(135deg,#1f55db,#2F6DF2);color:#fff;box-shadow:0 14px 30px rgba(31,85,219,.18)}
.video4d-steps button.active small{color:rgba(255,255,255,.78)}.video4d-steps button.active i{background:rgba(255,255,255,.16);color:#fff}
.video4d-stage.scene-package .scene-cloud{transform:translateY(-10px) scale(1.08)}.video4d-stage.scene-coverage .scene-home{transform:translateY(-10px) scale(1.08)}.video4d-stage.scene-register .video4d-character{filter:drop-shadow(0 0 22px rgba(110,161,255,.55))}.video4d-stage.scene-install .scene-olt{transform:translateY(-10px) scale(1.08)}.video4d-stage.scene-support .scene-core{transform:translateY(-10px) scale(1.08)}
.video4d-paused *{animation-play-state:paused!important}
@media(max-width:991.98px){.video4d-stage{min-height:560px}.scene-device{width:125px;min-height:104px}.scene-cloud{left:5%;top:7%}.scene-core{right:5%;top:7%}.scene-olt{right:5%;bottom:20%}.scene-home{left:5%;bottom:20%}.v4d-line{display:none}}
@media(max-width:575.98px){.video4d-stage{min-height:620px;border-radius:26px}.video4d-character{transform:translate(-50%,-50%) scale(.82)}.scene-device{width:118px;min-height:96px;font-size:.85rem}.scene-cloud{left:50%;top:5%;transform:translateX(-50%)}.scene-core{right:5%;top:28%}.scene-home{left:5%;top:28%;bottom:auto}.scene-olt{left:50%;right:auto;bottom:28%;transform:translateX(-50%)}.v4d-caption{left:14px;right:14px;bottom:14px}.video4d-panel{border-radius:24px;padding:1rem}}


/* ===== Voice controls for 4D explainer ===== */
.btn-voice-on{
  background:linear-gradient(135deg,#2F6DF2,#6d98ff);
  color:#fff!important;
  border:0;
  border-radius:16px;
  font-weight:850;
  box-shadow:0 12px 26px rgba(47,109,242,.20);
}
.btn-voice-on:hover{filter:brightness(.96);transform:translateY(-1px)}
.btn-voice-off{
  background:#fff;
  color:#1a2942!important;
  border:1px solid rgba(31,64,140,.14);
  border-radius:16px;
  font-weight:850;
}
.btn-voice-off:hover{background:#f3f7ff;color:#1f55db!important}
.voice-status{
  border:1px solid rgba(31,64,140,.10);
  background:#f8fbff;
  color:#64748b;
  border-radius:16px;
  padding:.75rem .9rem;
  font-size:.88rem;
  line-height:1.45;
}
.voice-status.is-active{
  background:linear-gradient(135deg,rgba(47,109,242,.10),rgba(63,142,76,.10));
  color:#17324d;
  border-color:rgba(47,109,242,.18);
}

/* ===== GLOBALHOME THEME + HUMAN ABSENSI GUIDE ===== */
:root{
  --globalhome-blue:#087DCA;
  --globalhome-green:#09D99C;
  --globalhome-dark:#0B2545;
}
body{font-family:'Poppins',Arial,sans-serif;background:#f7fbff;color:#0f172a}
.azn-super-nav{background:rgba(255,255,255,.92)!important;backdrop-filter:blur(16px);border-bottom:1px solid rgba(8,125,202,.10)}
.azn-nav-brand img{max-height:56px;object-fit:contain}.azn-nav-brand span{color:var(--globalhome-blue);letter-spacing:-.02em}.azn-nav-menu a:hover,.azn-nav-menu a.active{color:var(--globalhome-blue)!important}.azn-nav-cta{background:linear-gradient(135deg,var(--globalhome-blue),var(--globalhome-green))!important;color:#fff!important}
.pro-hero{background:radial-gradient(circle at 10% 10%,rgba(9,217,156,.22),transparent 30%),radial-gradient(circle at 90% 25%,rgba(8,125,202,.18),transparent 34%),linear-gradient(180deg,#ffffff 0%,#eef9ff 100%)!important;overflow:hidden}.pro-title{color:var(--globalhome-dark)!important;letter-spacing:-.04em}.pro-lead{color:#475569!important}.pro-badge,.pro-mini{background:rgba(9,217,156,.13)!important;color:var(--globalhome-blue)!important;border:1px solid rgba(8,125,202,.10)}.btn-pro-green{background:linear-gradient(135deg,var(--globalhome-green),var(--globalhome-blue))!important;color:#fff!important;border:0!important;box-shadow:0 16px 35px rgba(8,125,202,.18)}.btn-pro-outline{border:1px solid rgba(8,125,202,.25)!important;color:var(--globalhome-blue)!important;background:#fff!important}.btn-pro-outline:hover{background:var(--globalhome-blue)!important;color:#fff!important}.pro-metric strong{background:linear-gradient(135deg,var(--globalhome-blue),var(--globalhome-green));-webkit-background-clip:text;background-clip:text;color:transparent}.pro-logo-planet{background:#fff!important;box-shadow:0 22px 70px rgba(8,125,202,.18)!important}.pro-logo-planet img{max-width:82%;max-height:82%;object-fit:contain}.pro-node i,.scene-device i,.guide-bubble i,.pro-icon i{color:var(--globalhome-blue)!important}.pro-orbit-ring{border-color:rgba(8,125,202,.16)!important}.pro-flow,.v4d-packet,.topology-pulse{background:linear-gradient(90deg,var(--globalhome-green),var(--globalhome-blue))!important}
.video4d-stage{background:radial-gradient(circle at 25% 15%,rgba(9,217,156,.22),transparent 30%),radial-gradient(circle at 75% 8%,rgba(8,125,202,.18),transparent 30%),linear-gradient(145deg,#0b2545,#0b3c64 52%,#062138)!important}.video4d-panel,.pro-feature-card,.pro-price-card,.attendance-link-card,.phone-mockup-card{border:1px solid rgba(8,125,202,.10)!important;box-shadow:0 18px 48px rgba(11,37,69,.08)!important}.v4d-caption{background:rgba(255,255,255,.92)!important;color:#0f172a!important}.v4d-caption h4{color:var(--globalhome-blue)!important}
.video4d-character.human-guide{width:108px;height:188px;left:8%;bottom:15%;border-radius:0;background:transparent;filter:drop-shadow(0 20px 24px rgba(0,0,0,.18));animation:humanFloat 4.4s ease-in-out infinite}.human-guide .v4d-hair{position:absolute;left:25px;top:0;width:58px;height:42px;background:#1e293b;border-radius:28px 28px 18px 18px;z-index:3}.human-guide .v4d-head{position:absolute;left:24px;top:18px;width:62px;height:66px;background:#ffd8b8;border-radius:28px 28px 24px 24px;z-index:4;box-shadow:inset 0 -7px 0 rgba(120,53,15,.05)}.human-guide .v4d-ear{position:absolute;top:28px;width:12px;height:18px;background:#ffd8b8;border-radius:50%;z-index:-1}.human-guide .ear-left{left:-7px}.human-guide .ear-right{right:-7px}.human-guide .v4d-eye{position:absolute;top:28px;width:7px;height:7px;background:#0f172a;border-radius:50%}.human-guide .eye-left{left:18px}.human-guide .eye-right{right:18px}.human-guide .v4d-mouth{position:absolute;left:23px;top:45px;width:18px;height:8px;border-bottom:3px solid #ef4444;border-radius:0 0 16px 16px;background:transparent}.human-guide .v4d-neck{position:absolute;left:45px;top:78px;width:20px;height:16px;background:#f5c59e;border-radius:0 0 8px 8px;z-index:2}.human-guide .v4d-body{position:absolute;left:14px;top:88px;width:82px;height:74px;background:linear-gradient(135deg,var(--globalhome-blue),#0ea5e9);border-radius:24px 24px 18px 18px;z-index:2;box-shadow:inset 0 -12px 0 rgba(0,0,0,.08)}.human-guide .v4d-shirt-collar{position:absolute;top:0;left:27px;width:28px;height:14px;background:#fff;border-radius:0 0 16px 16px}.human-guide .v4d-badge{position:absolute;right:16px;top:22px;width:28px;height:28px;border-radius:10px;background:#fff;color:var(--globalhome-blue);display:flex;align-items:center;justify-content:center}.human-guide .v4d-hand{position:absolute;top:12px;width:18px;height:58px;background:#ffd8b8;border-radius:16px;transform-origin:top}.human-guide .hand-left{left:-15px;transform:rotate(20deg);animation:waveHuman 2.4s ease-in-out infinite}.human-guide .hand-right{right:-15px;transform:rotate(-28deg)}.human-guide .v4d-legs{position:absolute;left:26px;top:158px;display:flex;gap:10px}.human-guide .v4d-legs span{display:block;width:22px;height:30px;background:#1e293b;border-radius:0 0 12px 12px}.human-guide:before,.human-guide:after{display:none!important}@keyframes humanFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes waveHuman{0%,100%{transform:rotate(20deg)}50%{transform:rotate(55deg)}}
.pro-attendance-app{background:linear-gradient(180deg,#fff,#f3fbff)}.attendance-link-card{display:flex;align-items:center;gap:14px;background:#fff;border-radius:22px;padding:16px}.attendance-link-card>i{width:46px;height:46px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(8,125,202,.13),rgba(9,217,156,.18));color:var(--globalhome-blue);font-size:1.25rem}.attendance-link-card div{min-width:0;flex:1}.attendance-link-card small{display:block;color:#64748b;font-weight:700}.attendance-link-card b{display:block;color:#0f172a;overflow-wrap:anywhere}.phone-mockup-card{background:radial-gradient(circle at 20% 10%,rgba(9,217,156,.18),transparent 30%),#fff;border-radius:32px;padding:28px;display:flex;justify-content:center}.phone-frame{width:min(310px,100%);min-height:560px;background:#0f172a;border-radius:42px;padding:14px;box-shadow:0 25px 70px rgba(15,23,42,.25);position:relative}.phone-notch{position:absolute;top:22px;left:50%;transform:translateX(-50%);width:94px;height:22px;background:#0f172a;border-radius:0 0 18px 18px;z-index:2}.phone-screen{min-height:532px;border-radius:32px;background:linear-gradient(180deg,#f8fdff,#eafaf5);padding:46px 20px 22px;text-align:center}.phone-logo{height:74px;max-width:190px;object-fit:contain;margin-bottom:14px}.phone-screen h4{font-weight:900;color:var(--globalhome-dark);margin-bottom:22px}.phone-row{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid rgba(8,125,202,.10);border-radius:16px;padding:12px;margin-bottom:10px;text-align:left;font-weight:700;color:#334155}.phone-row i{width:32px;height:32px;border-radius:11px;background:rgba(8,125,202,.10);display:flex;align-items:center;justify-content:center;color:var(--globalhome-blue)}.phone-btn{display:block;margin-top:18px;padding:13px 14px;border-radius:18px;background:linear-gradient(135deg,var(--globalhome-blue),var(--globalhome-green));color:#fff!important;text-decoration:none;font-weight:900}.fw-black{font-weight:900!important}
@media(max-width:767.98px){.attendance-link-card{align-items:flex-start;flex-wrap:wrap}.attendance-link-card .btn{width:100%}.phone-frame{min-height:500px}.phone-screen{min-height:472px}.video4d-character.human-guide{transform:scale(.82);left:1%;bottom:10%}}
/* Re-skin old helper character so no robot/old 4D look remains */
.pro-4d-character{background:transparent!important;border-radius:0!important;box-shadow:none!important;width:150px!important;height:230px!important}.pro-4d-character .char-antenna{display:none!important}.pro-4d-character .char-head{width:76px!important;height:78px!important;left:37px!important;top:18px!important;background:#ffd8b8!important;border-radius:34px 34px 28px 28px!important;box-shadow:inset 0 -8px 0 rgba(120,53,15,.05)!important}.pro-4d-character .char-head:before{content:"";position:absolute;left:6px;top:-18px;width:64px;height:38px;background:#1e293b;border-radius:30px 30px 16px 16px}.pro-4d-character .char-body{width:108px!important;height:88px!important;left:21px!important;top:105px!important;background:linear-gradient(135deg,var(--globalhome-blue),var(--globalhome-green))!important;border-radius:26px 26px 20px 20px!important}.pro-4d-character .char-badge{background:#fff!important;color:var(--globalhome-blue)!important}.pro-4d-character .char-arm{background:#ffd8b8!important;border-radius:18px!important}.pro-4d-character .char-leg{background:#1e293b!important;border-radius:0 0 14px 14px!important}.pro-4d-character .char-smile{border-bottom-color:#ef4444!important}.pro-4d-character-wrap .char-signal{border-color:rgba(9,217,156,.38)!important}


/* Globalhome ISP Template V2 - corporate ISP landing, not attendance sales */
body{font-family:'Plus Jakarta Sans','Poppins',Arial,sans-serif;background:#f4f8fb;color:#0b2540}.gh-navbar{background:rgba(255,255,255,.9);backdrop-filter:blur(18px);border-bottom:1px solid rgba(8,122,199,.08);box-shadow:0 12px 36px rgba(5,31,55,.06)}.gh-nav-wrap{height:78px;display:flex;align-items:center;justify-content:space-between;gap:16px}.gh-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#082a45;font-weight:900;font-size:1.18rem}.gh-brand img{height:46px;max-width:190px;object-fit:contain}.gh-nav-menu{display:flex;align-items:center;gap:6px}.gh-nav-menu a{display:inline-flex;align-items:center;gap:8px;padding:10px 13px;border-radius:999px;color:#183b56;text-decoration:none;font-weight:800;font-size:.9rem;transition:.2s}.gh-nav-menu a:hover{background:#eef8ff;color:var(--brand)}.gh-nav-menu .gh-nav-cta{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;box-shadow:0 12px 22px rgba(8,122,199,.22)}.gh-nav-toggle{display:none;border:0;background:#eef8ff;color:var(--brand);width:44px;height:44px;border-radius:14px}.gh-page{overflow:hidden}.gh-hero{position:relative;min-height:720px;padding:110px 0 90px;background:radial-gradient(circle at 20% 20%,rgba(8,216,148,.22),transparent 28%),radial-gradient(circle at 80% 10%,rgba(8,122,199,.22),transparent 30%),linear-gradient(135deg,#061f35 0%,#082b4d 50%,#043a52 100%);color:#fff}.gh-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,#000,transparent 92%)}.gh-eyebrow,.gh-chip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;background:rgba(8,216,148,.14);border:1px solid rgba(8,216,148,.32);color:#a6ffe0;font-weight:900;font-size:.88rem}.gh-title{font-size:clamp(2.4rem,5vw,5.2rem);font-weight:950;line-height:1.02;letter-spacing:-.06em;margin:22px 0}.gh-lead{font-size:1.14rem;line-height:1.85;color:rgba(255,255,255,.78);max-width:680px}.gh-actions{display:flex;gap:14px;flex-wrap:wrap;margin:30px 0}.gh-btn-primary{border:0;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff!important;font-weight:900;border-radius:16px;padding:.82rem 1.12rem;box-shadow:0 18px 34px rgba(8,122,199,.24)}.gh-btn-light{background:#fff;color:#0b3559!important;border:1px solid rgba(8,122,199,.12);font-weight:900;border-radius:16px;padding:.82rem 1.12rem;box-shadow:0 12px 30px rgba(5,31,55,.08)}.gh-quick-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:560px}.gh-quick-stats div{padding:18px;border-radius:22px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14)}.gh-quick-stats b{display:block;font-size:1.7rem;font-weight:950}.gh-quick-stats span{color:rgba(255,255,255,.72);font-weight:700;font-size:.87rem}.gh-network-card{position:relative;min-height:540px;border-radius:42px;background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.07));border:1px solid rgba(255,255,255,.18);box-shadow:0 38px 100px rgba(0,0,0,.25);overflow:hidden}.gh-logo-chip{position:absolute;left:28px;top:28px;right:28px;display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:24px;background:rgba(255,255,255,.92);color:#082a45;font-weight:950;z-index:5}.gh-logo-chip img{height:42px;object-fit:contain}.gh-engineer{position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);width:155px;height:245px;z-index:4;filter:drop-shadow(0 22px 36px rgba(0,0,0,.32));animation:ghFloat 4s ease-in-out infinite}.gh-person-head{position:absolute;left:45px;top:0;width:66px;height:72px;background:#ffd7bd;border-radius:28px 28px 34px 34px}.gh-person-head:before{content:'';position:absolute;left:3px;right:3px;top:-10px;height:26px;background:#123650;border-radius:24px 24px 12px 12px}.gh-person-head span:before,.gh-person-head span:after{content:'';position:absolute;top:35px;width:8px;height:8px;background:#09263e;border-radius:50%}.gh-person-head span:before{left:19px}.gh-person-head span:after{right:19px}.gh-person-body{position:absolute;left:28px;top:75px;width:100px;height:105px;background:linear-gradient(135deg,var(--brand),var(--brand-2));border-radius:28px 28px 20px 20px;color:#fff;display:grid;place-items:center;font-size:2.1rem}.gh-person-arm{position:absolute;top:92px;width:28px;height:92px;background:#ffd7bd;border-radius:999px}.gh-person-arm.left{left:10px;transform:rotate(18deg)}.gh-person-arm.right{right:8px;transform:rotate(-20deg);animation:ghWave 2.5s ease-in-out infinite}.gh-person-leg{position:absolute;top:168px;width:34px;height:78px;background:#0b3559;border-radius:12px 12px 18px 18px}.gh-person-leg.left{left:43px}.gh-person-leg.right{right:41px}.gh-orbit{position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);border:2px dashed rgba(255,255,255,.2);border-radius:50%;animation:ghSpin 18s linear infinite}.gh-o1{width:320px;height:320px}.gh-o2{width:430px;height:430px;animation-duration:25s}.gh-o3{width:520px;height:520px;animation-duration:34s}.gh-device{position:absolute;z-index:6;display:flex;align-items:center;gap:9px;padding:12px 14px;border-radius:18px;background:rgba(255,255,255,.94);color:#0b3559;font-weight:900;box-shadow:0 14px 32px rgba(0,0,0,.17)}.gh-device i{color:var(--brand);font-size:1.1rem}.d1{left:42px;bottom:116px}.d2{right:44px;bottom:112px}.d3{left:70px;top:170px}.d4{right:66px;top:174px}.gh-signal{position:absolute;height:3px;background:linear-gradient(90deg,transparent,var(--brand-2),transparent);border-radius:99px;animation:ghPulse 2.4s ease-in-out infinite}.s1{left:120px;right:120px;top:250px}.s2{left:100px;right:100px;bottom:190px;animation-delay:.5s}.s3{width:300px;left:50%;top:360px;transform:translateX(-50%) rotate(90deg);animation-delay:1s}.gh-section{padding:86px 0}.gh-section-head{text-align:center;max-width:780px;margin:0 auto 42px}.gh-section-head span{display:inline-block;color:var(--brand);font-weight:950;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;margin-bottom:10px}.gh-section-head h2{font-size:clamp(1.8rem,3vw,3rem);font-weight:950;letter-spacing:-.04em;color:#082a45}.gh-section-head p{color:#6b7b8c;line-height:1.85}.gh-service-card,.gh-price-card,.gh-news{height:100%;border:1px solid rgba(8,122,199,.09);background:#fff;border-radius:30px;padding:28px;box-shadow:0 20px 50px rgba(5,31,55,.07);transition:.2s}.gh-service-card:hover,.gh-price-card:hover{transform:translateY(-5px);box-shadow:0 28px 70px rgba(5,31,55,.11)}.gh-service-card i{width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,rgba(8,122,199,.12),rgba(8,216,148,.18));display:grid;place-items:center;color:var(--brand);font-size:1.45rem;margin-bottom:18px}.gh-service-card h4,.gh-price-card h3{font-weight:950;color:#082a45}.gh-service-card p,.gh-price-card p,.gh-news p{color:#6b7b8c;line-height:1.75}.gh-packages{background:linear-gradient(180deg,#fff,#f4f8fb)}.gh-speed{display:inline-flex;padding:9px 13px;border-radius:999px;background:#eaf8ff;color:var(--brand);font-weight:950}.gh-price{font-size:2rem;font-weight:950;color:#082a45;margin:18px 0}.gh-price small{font-size:.85rem;color:#748496}.gh-flow{background:#061f35;color:#fff}.gh-flow .gh-section-head h2{color:#fff}.gh-flow .gh-section-head p{color:rgba(255,255,255,.7)}.gh-timeline{display:grid;gap:15px}.gh-timeline div{display:grid;grid-template-columns:70px 160px 1fr;gap:16px;align-items:center;padding:18px;border-radius:24px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}.gh-timeline b{width:52px;height:52px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(135deg,var(--brand),var(--brand-2));font-weight:950}.gh-timeline h5{margin:0;font-weight:950}.gh-timeline p{margin:0;color:rgba(255,255,255,.72)}.gh-news{display:flex;gap:16px}.gh-news i{width:46px;height:46px;flex:0 0 46px;border-radius:16px;background:#eaf8ff;color:var(--brand);display:grid;place-items:center}.gh-news h5{font-weight:950;color:#082a45}.gh-internal{padding-top:34px}.gh-internal-box{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:34px;border-radius:34px;background:linear-gradient(135deg,#eef9ff,#effff8);border:1px solid rgba(8,122,199,.08)}.gh-internal-box h3{font-weight:950;color:#082a45;margin-top:12px}.gh-internal-box p{color:#617386}.gh-url{display:flex;align-items:center;gap:10px;padding:14px;border-radius:18px;background:#fff;color:#0b3559;word-break:break-word}.gh-internal-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}.gh-cta{padding-top:30px}.gh-cta-box{text-align:center;border-radius:40px;padding:56px;background:radial-gradient(circle at 20% 20%,rgba(8,216,148,.18),transparent 30%),linear-gradient(135deg,#082a45,#064d6b);color:#fff}.gh-cta-box h2{font-size:clamp(1.8rem,4vw,3.4rem);font-weight:950;letter-spacing:-.04em}.gh-cta-box p{color:rgba(255,255,255,.76);margin-bottom:24px}@keyframes ghFloat{0%,100%{transform:translate(-50%,-52%)}50%{transform:translate(-50%,-48%)}}@keyframes ghSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes ghPulse{0%,100%{opacity:.25}50%{opacity:1}}@keyframes ghWave{0%,100%{transform:rotate(-20deg)}50%{transform:rotate(-42deg)}}@media(max-width:991px){.gh-nav-toggle{display:grid;place-items:center}.gh-nav-menu{display:none;position:absolute;left:16px;right:16px;top:84px;background:#fff;border-radius:24px;padding:14px;box-shadow:0 24px 70px rgba(5,31,55,.16);flex-direction:column;align-items:stretch;z-index:50}.gh-nav-menu.show{display:flex}.gh-nav-menu a{justify-content:flex-start}.gh-hero{padding:70px 0}.gh-network-card{min-height:460px}.gh-timeline div{grid-template-columns:58px 1fr}.gh-timeline p{grid-column:2}.gh-internal-box{flex-direction:column;align-items:flex-start}.gh-internal-actions{justify-content:flex-start}.gh-quick-stats{grid-template-columns:1fr}}@media(max-width:575px){.gh-title{font-size:2.35rem}.gh-network-card{min-height:420px;border-radius:28px}.gh-device{font-size:.78rem}.d1{left:16px;bottom:90px}.d2{right:16px;bottom:90px}.d3{left:16px;top:135px}.d4{right:16px;top:135px}.gh-o2,.gh-o3{display:none}.gh-section{padding:62px 0}.gh-cta-box{padding:34px 20px}.gh-url{font-size:.82rem}}
