*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:#17222b;background:#fff;line-height:1.65}a{color:inherit}.container{width:min(1180px,92%);margin:auto}.header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border-bottom:1px solid #e6edf1}.nav-wrap{height:82px;display:flex;align-items:center;justify-content:space-between}.brand img{width:185px;max-height:58px;object-fit:contain}.header nav{display:flex;align-items:center;gap:27px;font-size:13px;font-weight:700}.header nav a{text-decoration:none}.header nav a:hover,.header nav .active{color:#087fc4}.nav-btn{background:#087fc4;color:#fff!important;padding:11px 18px;border-radius:6px}.menu{display:none;border:0;background:none;font-size:26px}.eyebrow{font-size:11px;letter-spacing:2.2px;font-weight:800;color:#0788ca;margin-bottom:16px}.hero{min-height:760px;display:flex;align-items:center;position:relative;overflow:hidden;background:#06121c;color:#fff}.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 40%,rgba(16,168,236,.22),transparent 32%),linear-gradient(120deg,#06121c,#0a2233)}.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}.hero-copy{padding:80px 0}.hero h1,.inner-hero h1{font-size:clamp(48px,7vw,88px);line-height:.98;letter-spacing:-4px;margin:0 0 28px}.hero h1 em,.inner-hero h1 em,h2 em{font-style:normal;color:#36baf5}.hero p,.inner-hero p{font-size:18px;color:#c2d2db;max-width:670px}.actions{display:flex;gap:13px;flex-wrap:wrap;margin:30px 0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 22px;border-radius:7px;text-decoration:none;font-weight:800;border:1px solid transparent;cursor:pointer}.btn.primary{background:#0b9bdf;color:#fff;box-shadow:0 12px 30px rgba(0,145,210,.22)}.btn.ghost{border-color:rgba(255,255,255,.35);color:#fff}.btn.white{background:#fff;color:#087fc4}.btn.outline-white{border-color:rgba(255,255,255,.6);color:#fff}.micro{font-size:10px;letter-spacing:2px;color:#819aa9}.hero-art{height:500px;position:relative;display:flex;align-items:center;justify-content:center}.screen-card{width:390px;height:445px;border:1px solid rgba(255,255,255,.22);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.03));box-shadow:0 40px 90px rgba(0,0,0,.4),inset 0 0 60px rgba(14,164,230,.07);overflow:hidden;transform:perspective(900px) rotateY(-7deg)}.screen-top,.screen-bottom{padding:16px 18px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.5px;color:#9fb5c2}.live{color:#43d3ff}.live i{display:inline-block;width:6px;height:6px;background:#28c8ff;border-radius:50%;margin-right:5px;box-shadow:0 0 10px #28c8ff}.screen-content{height:355px;padding:55px 35px;background:linear-gradient(160deg,rgba(5,22,34,.9),rgba(6,90,132,.48));display:flex;flex-direction:column;justify-content:center}.screen-kicker{font-size:10px;letter-spacing:3px;color:#48c7ff}.screen-content strong{font-size:42px;line-height:1.03;margin-top:14px}.screen-content strong b{color:#43c4fa}.screen-lines{margin-top:32px;display:grid;gap:7px}.screen-lines span{height:2px;background:#2ebcf0;width:100%}.screen-lines span:nth-child(2){width:70%}.screen-lines span:nth-child(3){width:45%}.orbit{position:absolute;border:1px solid rgba(61,194,243,.22);border-radius:50%;animation:spin 18s linear infinite}.orbit-a{width:540px;height:540px}.orbit-b{width:410px;height:410px;animation-direction:reverse;animation-duration:12s}.floating-chip{position:absolute;background:rgba(5,18,28,.8);border:1px solid rgba(73,201,249,.4);padding:9px 13px;border-radius:30px;font-size:10px;letter-spacing:1px;color:#bcecff;box-shadow:0 10px 30px rgba(0,0,0,.25);animation:float 4s ease-in-out infinite}.chip-1{top:70px;left:5%}.chip-2{right:0;top:210px;animation-delay:1s}.chip-3{left:8%;bottom:55px;animation-delay:2s}.hero-gridline{position:absolute;bottom:0;left:0;right:0;height:1px;background:rgba(255,255,255,.1)}.ticker{overflow:hidden;background:#0798db;color:#fff;font-weight:800;font-size:12px;letter-spacing:1.4px;white-space:nowrap}.ticker-track{display:flex;gap:34px;width:max-content;padding:16px 0;animation:marquee 24s linear infinite}.ticker b{color:#aeeaff}.section{padding:110px 0}.intro h2,h2{font-size:clamp(36px,5vw,58px);line-height:1.08;letter-spacing:-2px;margin:0}.prose{font-size:17px;color:#61707a}.text-link{display:inline-block;color:#0788ca;text-decoration:none;font-weight:800;margin-top:10px}.split{display:grid;grid-template-columns:1fr 1fr;gap:90px}.dark{background:#081722;color:#fff}.dark .eyebrow{color:#4bc7fb}.section-head{display:flex;justify-content:space-between;gap:60px;align-items:end;margin-bottom:55px}.section-head>p{max-width:440px;color:#74838d}.dark .section-head>p,.dark p{color:#aec0ca}.solution-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}.solution-card{height:490px;position:relative;overflow:hidden;border-radius:13px;background:#111}.solution-card img{width:100%;height:100%;object-fit:cover;transition:transform .7s}.solution-card:hover img{transform:scale(1.06)}.solution-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(2,12,19,.9) 100%)}.solution-copy{position:absolute;bottom:0;padding:30px}.solution-copy span{font-size:10px;letter-spacing:2px;color:#53c9fb}.solution-copy h3{font-size:34px;line-height:1.02;margin:10px 0}.solution-copy p{font-size:13px;max-width:290px}.network-section{background:#f4f8fa}.network-map{position:relative;background:#061720;border-radius:18px;min-height:560px;overflow:hidden;border:1px solid #153544;box-shadow:0 25px 80px rgba(11,49,68,.12)}.network-map:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(29,139,181,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(29,139,181,.07) 1px,transparent 1px);background-size:50px 50px}.network-map svg{width:100%;height:auto;position:absolute;inset:0}.route{fill:none;stroke:#1d6782;stroke-width:2;stroke-dasharray:8 11;animation:dash 8s linear infinite}.map-node{cursor:pointer}.map-node>circle:first-child{fill:#25baf1;filter:url(#glow);transition:transform .25s}.map-node .pulse{fill:none;stroke:#2cbff2;stroke-width:1;opacity:.35;animation:pulse 2.5s infinite}.map-node text{fill:#9cc4d3;font-size:13px;font-weight:800;letter-spacing:1px;text-anchor:middle}.map-node:hover>circle:first-child,.map-node:focus>circle:first-child{transform:scale(1.45)}.map-panel{position:absolute;left:30px;bottom:30px;width:300px;background:rgba(5,19,28,.9);border:1px solid rgba(86,200,242,.25);border-radius:12px;padding:22px;color:#fff;backdrop-filter:blur(12px)}.map-panel-label{font-size:9px;letter-spacing:2px;color:#50c8fa}.map-panel h3{font-size:28px;margin:5px 0}.map-panel p{font-size:13px;color:#aec2cb}.map-stats{display:flex;gap:16px;font-size:10px;color:#8faab6}.map-stats b{color:#42c6f8;font-size:17px;display:block}.split-image-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.image-stack{position:relative;padding-right:50px;padding-bottom:50px}.main-img{width:100%;height:500px;object-fit:cover;border-radius:15px;box-shadow:0 30px 60px rgba(0,35,55,.16)}.mini-img{position:absolute;right:0;bottom:0;width:45%;height:220px;border:9px solid #fff;border-radius:13px;overflow:hidden;box-shadow:0 20px 45px rgba(0,35,55,.2)}.mini-img img{width:100%;height:100%;object-fit:cover}.lead{font-size:18px;color:#60707b}.feature-list{margin:30px 0}.feature-list div{display:flex;gap:18px;border-top:1px solid #e1e8ec;padding:17px 0}.feature-list b{color:#0788ca;font-size:11px}.feature-list span{font-size:14px}.cta-band{padding:95px 0;background:linear-gradient(120deg,#0788c9,#0b6ca4);color:#fff}.cta-band .eyebrow{color:#bdeaff}.cta-inner{display:flex;justify-content:space-between;gap:50px;align-items:center}.cta-inner h2{font-size:clamp(38px,5vw,62px)}.cta-actions{display:flex;flex-direction:column;gap:12px;min-width:260px}.whatsapp{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border:1px solid rgba(255,255,255,.5);border-radius:7px;text-decoration:none;font-weight:800}.whatsapp.large{min-width:280px}.inner-hero{padding:120px 0 100px;background:linear-gradient(120deg,#06131d,#0a2c40);color:#fff}.partner-hero{background:radial-gradient(circle at 80% 30%,rgba(22,174,237,.23),transparent 28%),linear-gradient(120deg,#06131d,#0a2c40)}.inner-hero .container{max-width:1180px}.ad-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:15px}.ad-card{padding:28px;border:1px solid #dce6eb;border-radius:12px;background:#fff;min-height:230px;transition:transform .3s,box-shadow .3s}.ad-card:hover{transform:translateY(-8px);box-shadow:0 20px 45px rgba(8,72,104,.1)}.ad-card>span{color:#0788ca;font-size:11px;font-weight:800}.ad-card h3{font-size:22px;margin:22px 0 9px}.ad-card p{color:#687680;font-size:13px}.campaign-visual{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.campaign-stack{position:relative;height:410px}.campaign-card{position:absolute;left:5%;top:15%;width:85%;height:210px;padding:28px;border:1px solid rgba(78,200,245,.35);border-radius:14px;background:linear-gradient(135deg,#102e40,#0a1a25);box-shadow:0 25px 60px rgba(0,0,0,.3)}.campaign-card span{font-size:10px;color:#54cafa;letter-spacing:2px}.campaign-card b{display:block;font-size:34px;margin-top:40px}.campaign-card i{position:absolute;right:24px;top:24px;color:#44c9f8;font-style:normal}.campaign-card.offset{top:26%;left:10%;opacity:.7}.campaign-card.offset2{top:37%;left:15%;opacity:.4}.lead-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px}.contact-direct{display:grid;gap:8px;margin-top:25px}.contact-direct a{color:#0788ca;text-decoration:none;font-weight:800}.lead-form{border:1px solid #dce6eb;border-radius:15px;padding:32px;background:#fbfdfe;display:grid;gap:17px;box-shadow:0 20px 55px rgba(14,57,77,.06)}.lead-form label{font-size:11px;font-weight:800;letter-spacing:.6px;display:grid;gap:7px}.lead-form input,.lead-form textarea{font:inherit;font-size:14px;padding:12px 13px;border:1px solid #d6e1e7;border-radius:7px;outline:none;background:#fff}.lead-form input:focus,.lead-form textarea:focus{border-color:#0b9bdf;box-shadow:0 0 0 3px rgba(11,155,223,.1)}.lead-form small{font-size:10px;color:#7c8991}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.step{padding:35px;border:1px solid #dce6eb;border-radius:14px;min-height:260px}.step>b{font-size:34px;color:#0788ca}.step h3{font-size:18px;margin:25px 0 8px}.step p{color:#65747e;font-size:14px}.partner-model{display:grid;grid-template-columns:1fr .8fr;gap:90px;align-items:center}.ratio{display:flex;align-items:stretch;gap:8px;height:250px}.ratio-box{flex:1;background:#12364a;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:22px;display:flex;flex-direction:column;justify-content:end;font-size:45px;font-weight:800;color:#43c8fb}.ratio-box.big{flex:4;background:linear-gradient(145deg,#087eaf,#0a4c6c)}.ratio-box small{font-size:9px;letter-spacing:1px;color:#c1dce8}.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.check{display:flex;gap:16px;padding:20px;border:1px solid #dce6eb;border-radius:10px}.check b{color:#0788ca}.check span{font-size:13px;color:#65747e}footer{background:#06121b;color:#9fb2bd;padding:55px 0 25px}.footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:60px}.footer-grid img{width:165px;filter:brightness(0) invert(1);opacity:.9}.footer-grid p{font-size:12px}.footer-grid>div>span{display:block;color:#42c7fa;font-size:10px;letter-spacing:2px;font-weight:800;margin-bottom:13px}.footer-grid a{display:block;text-decoration:none;font-size:12px;margin:7px 0}.footer-grid a:hover{color:#fff}.copyright{border-top:1px solid rgba(255,255,255,.1);margin-top:45px;padding-top:20px;font-size:10px;color:#718691}.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}.reveal.visible{opacity:1;transform:none}@keyframes marquee{to{transform:translateX(-50%)}}@keyframes float{50%{transform:translateY(-10px)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,100%{transform:scale(.75);opacity:.2}50%{transform:scale(1.2);opacity:.6}}@keyframes dash{to{stroke-dashoffset:-100}}@media(max-width:950px){.header nav{display:none;position:absolute;left:0;right:0;top:82px;background:#fff;padding:22px;flex-direction:column;align-items:flex-start}.header nav.open{display:flex}.menu{display:block}.hero-grid,.split,.split-image-grid,.campaign-visual,.lead-grid,.partner-model{grid-template-columns:1fr}.hero{min-height:auto}.hero-copy{padding:75px 0 20px}.hero-art{height:560px}.solution-grid{grid-template-columns:1fr 1fr}.ad-grid{grid-template-columns:1fr 1fr}.section-head,.cta-inner{align-items:flex-start;flex-direction:column}.network-map{min-height:520px}.steps{grid-template-columns:1fr}.check-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}}@media(max-width:580px){.brand img{width:160px}.hero h1,.inner-hero h1{font-size:48px;letter-spacing:-2.5px}.hero-art{height:430px}.screen-card{width:300px;height:350px}.screen-content{height:275px;padding:35px 25px}.screen-content strong{font-size:31px}.floating-chip{font-size:8px}.chip-1{left:0}.chip-2{right:0}.solution-grid,.ad-grid{grid-template-columns:1fr}.section{padding:75px 0}.map-panel{left:15px;right:15px;bottom:15px;width:auto}.network-map{min-height:500px}.network-map svg{top:-30px}.main-img{height:380px}.mini-img{height:160px}.footer-grid{grid-template-columns:1fr}.ratio{height:200px}.ratio-box{font-size:31px}.lead-form{padding:22px}}


/* =========================================================
   VIREONX NETWORK EXPANSION
   ========================================================= */

.network-expansion {
    position: relative;
    overflow: hidden;
}


/* INTRO */

.network-intro {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 80px;
    align-items: end;
    margin-bottom: 70px;
}

.network-intro h2 {
    margin: 15px 0 0;
}

.network-intro h2 em {
    font-style: normal;
}

.network-intro-copy {
    max-width: 520px;
}

.network-intro-copy p {
    margin-bottom: 20px;
    line-height: 1.8;
}

.network-highlight {
    font-weight: 600;
}


/* NETWORK STATUS */

.network-status {
    display: flex;
    align-items: center;
    width: 100%;
    margin-bottom: 70px;
    padding: 24px 28px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 20px;
    background: rgba(255,255,255,.025);
    backdrop-filter: blur(15px);
}

.status-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 125px;
}

.status-item strong {
    display: block;
    font-size: 13px;
    letter-spacing: .08em;
}

.status-item small {
    display: block;
    margin-top: 4px;
    font-size: 9px;
    letter-spacing: .12em;
    opacity: .5;
}

.status-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    display: block;
}

.status-item.active .status-dot {
    animation: networkPulse 1.8s infinite;
}

.status-item.upcoming .status-dot {
    opacity: .25;
}

.status-line {
    height: 1px;
    flex: 1;
    margin: 0 12px;
    background: linear-gradient(
        90deg,
        rgba(255,255,255,.25),
        rgba(255,255,255,.05)
    );
}


/* ZONE 01 */

.zone-feature {
    display: grid;
    grid-template-columns: 1fr .8fr;
    gap: 60px;
    min-height: 550px;
    padding: 65px;
    border-radius: 32px;
    position: relative;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 80% 30%,
            rgba(0,170,255,.12),
            transparent 35%
        ),
        rgba(255,255,255,.025);

    border: 1px solid rgba(255,255,255,.1);
}


.zone-number {
    font-size: 120px;
    line-height: .8;
    font-weight: 800;
    opacity: .05;
    position: absolute;
    left: 45px;
    top: 35px;
}


.zone-label {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 11px;
    letter-spacing: .14em;
    font-weight: 700;
}


.live-pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
    animation: networkPulse 1.5s infinite;
}


.zone-feature h3 {
    position: relative;
    z-index: 2;
    margin: 30px 0 10px;
    font-size: clamp(42px, 5vw, 72px);
    line-height: .95;
}


.zone-feature h3 em {
    font-style: normal;
}


.zone-location {
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 25px;
}


.zone-description {
    max-width: 560px;
    line-height: 1.8;
    opacity: .7;
}


/* DISPLAY BREAKDOWN */

.display-breakdown {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    margin-top: 40px;
}


.display-type {
    display: flex;
    gap: 16px;
    padding: 20px;
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.025);
}


.display-icon {
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.1);
    font-size: 10px;
}


.display-type strong {
    display: block;
    font-size: 30px;
    line-height: 1;
}


.display-type span {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    font-weight: 600;
}


.display-type small {
    display: block;
    margin-top: 7px;
    font-size: 8px;
    letter-spacing: .1em;
    opacity: .5;
}


/* LED SHOWCASE */

.led-showcase {
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: relative;
}


.led-glow {
    position: absolute;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    filter: blur(70px);
    opacity: .25;
}


.led-screen {
    width: min(300px, 80%);
    aspect-ratio: 3 / 4;
    border-radius: 12px;
    border: 5px solid #10141a;
    background:
        linear-gradient(
            145deg,
            #101820,
            #05070a
        );

    box-shadow:
        0 30px 80px rgba(0,0,0,.6),
        inset 0 0 35px rgba(255,255,255,.04);

    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    padding: 22px;
}

.led-screen-top {
    font-size: 10px;
    letter-spacing: .2em;
    font-weight: 800;
}


.led-screen-content {
    text-align: center;
}


.led-screen-content span {
    display: block;
    font-size: 72px;
    font-weight: 800;
    line-height: .9;
}


.led-screen-content small {
    display: block;
    margin-top: 15px;
    font-size: 9px;
    letter-spacing: .15em;
}


.led-screen-bottom {
    font-size: 10px;
    text-align: center;
    letter-spacing: .15em;
    opacity: .6;
}


.led-caption {
    text-align: center;
    margin-top: 25px;
    position: relative;
    z-index: 2;
}


.led-caption span {
    display: block;
    font-size: 9px;
    letter-spacing: .15em;
    margin-bottom: 6px;
    opacity: .5;
}


.led-caption strong {
    font-size: 13px;
    letter-spacing: .08em;
}

/* =========================================================
   VIREONX — NEXT EXPANSION NETWORK
   ========================================================= */

.future-zones {
    position: relative;
    margin-top: 110px;
    padding: 75px 60px 65px;
    border-radius: 32px;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 10% 0%,
            rgba(255,255,255,.65),
            transparent 35%
        ),
        radial-gradient(
            circle at 90% 100%,
            rgba(120,200,255,.35),
            transparent 40%
        ),
        linear-gradient(
            135deg,
            #eaf8ff 0%,
            #d9f1ff 50%,
            #ccecff 100%
        );

    border: 1px solid rgba(40,130,190,.18);

    box-shadow:
        0 25px 70px rgba(40,120,180,.12);
}
.future-heading {
    display: grid;
    grid-template-columns: 1fr .75fr;
    gap: 70px;
    align-items: end;
    margin-bottom: 55px;
}


.future-heading .eyebrow {
    font-size: 11px;
    letter-spacing: .18em;
    font-weight: 700;
    opacity: .7;
}


.future-heading h3 {
    margin: 16px 0 0;
    font-size: clamp(38px, 4.5vw, 64px);
    line-height: .95;
    letter-spacing: -.03em;
}


.future-heading h3 em {
    font-style: normal;
}


.future-heading > p {
    margin: 0;
    max-width: 470px;
    font-size: 16px;
    line-height: 1.8;
    color: rgba(255,255,255,.68);
}


.zone-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}


.future-zone {
    position: relative;
    min-height: 360px;
    padding: 28px;

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.075),
            rgba(255,255,255,.025)
        );

    border: 1px solid rgba(255,255,255,.14);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04),
        0 20px 50px rgba(0,0,0,.18);

    overflow: hidden;

    transition:
        transform .35s ease,
        border-color .35s ease,
        background .35s ease,
        box-shadow .35s ease;
}


.future-zone:hover {
    transform: translateY(-8px);

    border-color: rgba(255,255,255,.28);

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.11),
            rgba(255,255,255,.035)
        );

    box-shadow:
        0 25px 70px rgba(0,0,0,.30);
}


.future-zone-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}


.future-zone-number {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .16em;
    color: rgba(255,255,255,.55);
}


.coming-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 9px 13px;

    border-radius: 30px;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;

    color: #1678ad !important;

    background: rgba(22, 120, 173, 0.08) !important;

    border: 1px solid rgba(22, 120, 173, 0.30) !important;

    white-space: nowrap;
}


.coming-badge::before {
    content: "";

    width: 6px;
    height: 6px;

    margin-right: 8px;

    border-radius: 50%;

     background: #1678ad !important;
    box-shadow: 0 0 0 4px rgba(22, 120, 173, 0.10) !important;
}


.future-zone-content {
    margin-top: 65px;
}


.future-zone h4 {
    margin: 0 0 20px;

    font-size: 32px;
    line-height: 1;

    letter-spacing: -.02em;
}


.zone-location-large {
    min-height: 65px;

    margin: 0;

    font-size: 16px;
    line-height: 1.65;

    color: rgba(255,255,255,.72);
}


.future-zone-stat {
    display: flex;
    align-items: flex-end;
    gap: 12px;

    margin-top: 40px;
    padding-top: 22px;

    border-top: 1px solid rgba(255,255,255,.12);
}


.future-zone-stat strong {
    font-size: 48px;
    line-height: .85;
    font-weight: 800;
    letter-spacing: -.04em;
}


.future-zone-stat span {
    padding-bottom: 3px;

    font-size: 11px;
    letter-spacing: .08em;

    color: rgba(255,255,255,.48);
}


.zone-arrow {
    position: absolute;

    right: 25px;
    bottom: 22px;

    font-size: 22px;

    color: rgba(255,255,255,.35);

    transition:
        transform .35s ease,
        color .35s ease;
}


.future-zone:hover .zone-arrow {
    transform: translate(4px,-4px);
    color: rgba(255,255,255,.8);
}


.future-zone::after {
    content: "";

    position: absolute;

    right: -40px;
    bottom: -70px;

    width: 170px;
    height: 170px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,.04);

    pointer-events: none;
}


@media (max-width: 1100px) {

    .future-zones {
        padding: 60px 40px;
    }

    .zone-grid {
        grid-template-columns: repeat(2, 1fr);
    }

}


@media (max-width: 800px) {

    .future-heading {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .future-heading > p {
        max-width: 650px;
    }

}


@media (max-width: 600px) {

    .future-zones {
        padding: 45px 20px;
        border-radius: 24px;
    }

    .zone-grid {
        grid-template-columns: 1fr;
    }

    .future-zone {
        min-height: 330px;
        padding: 24px;
    }

    .future-zone-content {
        margin-top: 50px;
    }

    .future-zone h4 {
        font-size: 28px;
    }

    .zone-location-large {
        font-size: 15px;
    }

    .coming-badge {
        font-size: 9px;
        padding: 8px 10px;
    }

}






/* NETWORK FOOTER */

.network-footer {
    margin-top: 70px;
    padding: 35px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    border-top: 1px solid rgba(255,255,255,.1);
}


.network-total span {
    display: block;
    font-size: 9px;
    letter-spacing: .15em;
    opacity: .5;
}


.network-total strong {
    display: block;
    margin-top: 5px;
    font-size: 54px;
    line-height: 1;
}


.network-total p {
    margin-top: 7px;
    font-size: 12px;
    opacity: .55;
}


.network-cta {
    display: flex;
    align-items: center;
    gap: 30px;
}


.network-cta p {
    max-width: 280px;
    font-size: 13px;
    line-height: 1.5;
    opacity: .65;
}


/* ANIMATION */

@keyframes networkPulse {

    0% {
        box-shadow: 0 0 0 0 rgba(0,170,255,.5);
    }

    70% {
        box-shadow: 0 0 0 10px rgba(0,170,255,0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(0,170,255,0);
    }

}


/* RESPONSIVE */

@media (max-width: 900px) {

    .network-intro,
    .zone-feature,
    .future-heading {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .network-status {
        overflow-x: auto;
    }

    .status-line {
        min-width: 30px;
    }

    .zone-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .network-footer {
        flex-direction: column;
        align-items: flex-start;
    }

}


@media (max-width: 600px) {

    .zone-feature {
        padding: 35px 25px;
    }

    .display-breakdown {
        grid-template-columns: 1fr;
    }

    .zone-grid {
        grid-template-columns: 1fr;
    }

    .network-status {
        padding: 20px;
    }

    .network-cta {
        flex-direction: column;
        align-items: flex-start;
    }

}

/* Fix text visibility on light blue Network Expansion section */

.future-heading > p {
    color: #526474 !important;
}

.future-heading .eyebrow {
    color: #31586d !important;
}

.future-heading h3 {
    color: #102331 !important;
}

.future-heading h3 em {
    color: #1678ad !important;
}

.future-zone h4 {
    color: #102331 !important;
}

.future-zone-number {
    color: #527083 !important;
}

.zone-location-large {
    color: #526474 !important;
}

.future-zone-stat strong {
    color: #102331 !important;
}

.future-zone-stat span {
    color: #607786 !important;
}

.zone-arrow {
    color: #5d7b8b !important;
}




/* =========================================================
   ZONE 01 — OUTDOOR LED SCREEN
   LIGHT BLUE PREMIUM DISPLAY
   ========================================================= */

.led-showcase {
    position: relative;
}


/* OUTER LED SCREEN */

.led-screen {
    background:
        linear-gradient(
            145deg,
            #eaf8ff 0%,
            #d5f1ff 50%,
            #c2eaff 100%
        ) !important;

    border: 2px solid rgba(22,120,173,.25) !important;

    box-shadow:
        0 30px 70px rgba(22,120,173,.20),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
}


/* TOP VIREONX TEXT */

.led-screen-top {
    color: #1678ad !important;
}


/* SCREEN CONTENT */

.led-screen-content {
    color: #102331 !important;
}


/* 100 */

.led-screen-content span {
    color: #102331 !important;
}


/* OUTDOOR LED */

.led-screen-content small {
    color: #1678ad !important;
}


/* 4 FT H × 3 FT W */

.led-screen-bottom {
    color: #102331 !important;
    border-top-color: rgba(22,120,173,.18) !important;
}


/* GLOW BEHIND SCREEN */

.led-glow {
    opacity: .25 !important;
    background:
        radial-gradient(
            circle,
            rgba(22,120,173,.35),
            transparent 65%
        ) !important;
}


/* CAPTION BELOW SCREEN */

.led-caption span {
    color: #1678ad !important;
}

.led-caption strong {
    color: #102331 !important;
}



/* =========================================================
   VIREONX — LIGHT BLUE PREMIUM GLOBAL THEME
   ========================================================= */

:root {
    --vx-light: #eaf8ff;
    --vx-light-2: #d5f1ff;
    --vx-light-3: #bde7ff;

    --vx-blue: #1678ad;
    --vx-blue-dark: #12618a;

    --vx-navy: #102331;
    --vx-text: #526474;
    --vx-muted: #607786;

    --vx-white: #ffffff;

    --vx-border: rgba(22,120,173,.16);

    --vx-shadow:
        0 25px 70px rgba(22,120,173,.12);
}


/* =========================================================
   GLOBAL PAGE
   ========================================================= */

html,
body {
    background: #eaf8ff !important;
    color: var(--vx-navy) !important;
}


/* =========================================================
   HEADER
   ========================================================= */

header,
.navbar,
.site-header,
nav {
    background: rgba(234,248,255,.92) !important;
    color: var(--vx-navy) !important;

    border-bottom-color: rgba(22,120,173,.12) !important;
}


/* =========================================================
   MAIN SECTIONS
   ========================================================= */

section {
    background-color: #eaf8ff;
    color: var(--vx-navy);
}


/* Remove common dark section backgrounds */

.dark-section,
.dark,
.dark-bg,
.black-section,
.network-section,
.section-dark {
    background:
        radial-gradient(
            circle at 10% 0%,
            rgba(255,255,255,.75),
            transparent 35%
        ),
        radial-gradient(
            circle at 90% 100%,
            rgba(120,200,255,.30),
            transparent 40%
        ),
        linear-gradient(
            135deg,
            #eaf8ff 0%,
            #d5f1ff 50%,
            #ccecff 100%
        ) !important;

    color: var(--vx-navy) !important;
}


/* =========================================================
   HEADINGS
   ========================================================= */

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--vx-navy) !important;
}


h1 em,
h2 em,
h3 em {
    color: var(--vx-blue) !important;
}


/* =========================================================
   BODY TEXT
   ========================================================= */

p {
    color: var(--vx-text);
}


/* =========================================================
   EYEBROWS / LABELS
   ========================================================= */

.eyebrow,
.section-label,
.section-kicker {
    color: var(--vx-blue) !important;
}


/* =========================================================
   CARDS
   ========================================================= */

.card,
.feature-card,
.network-card,
.future-zone,
.info-card,
.service-card {
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.96),
            rgba(245,251,255,.88)
        ) !important;

    color: var(--vx-navy) !important;

    border-color: var(--vx-border) !important;

    box-shadow:
        0 15px 45px rgba(30,100,150,.09),
        inset 0 1px 0 rgba(255,255,255,.9) !important;
}


/* =========================================================
   CARD TEXT
   ========================================================= */

.card h3,
.card h4,
.feature-card h3,
.feature-card h4,
.network-card h3,
.future-zone h3,
.future-zone h4 {
    color: var(--vx-navy) !important;
}

.card p,
.feature-card p,
.network-card p,
.future-zone p {
    color: var(--vx-text) !important;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.btn-primary,
.primary-btn,
.cta-button {
    background:
        linear-gradient(
            135deg,
            #1678ad,
            #12618a
        ) !important;

    color: #ffffff !important;

    border-color: #1678ad !important;

    box-shadow:
        0 12px 30px rgba(22,120,173,.22) !important;
}


.btn-primary:hover,
.primary-btn:hover,
.cta-button:hover {
    box-shadow:
        0 16px 38px rgba(22,120,173,.30) !important;
}


/* =========================================================
   SECONDARY BUTTONS
   ========================================================= */

.btn-secondary,
.secondary-btn {
    background: rgba(255,255,255,.75) !important;

    color: var(--vx-blue) !important;

    border: 1px solid rgba(22,120,173,.25) !important;
}


/* =========================================================
   NETWORK EXPANSION
   ========================================================= */

.future-zones {
    background:
        radial-gradient(
            circle at 10% 0%,
            rgba(255,255,255,.70),
            transparent 35%
        ),
        radial-gradient(
            circle at 90% 100%,
            rgba(120,200,255,.35),
            transparent 40%
        ),
        linear-gradient(
            135deg,
            #eaf8ff 0%,
            #d5f1ff 50%,
            #ccecff 100%
        ) !important;

    border-color: rgba(22,120,173,.16) !important;

    box-shadow:
        0 25px 70px rgba(40,120,180,.12) !important;
}


/* =========================================================
   ZONE CARDS
   ========================================================= */

.future-zone {
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.94),
            rgba(240,249,255,.88)
        ) !important;

    border-color:
        rgba(22,120,173,.18) !important;
}


/* =========================================================
   COMING SOON
   ========================================================= */

.coming-badge {
    color: #1678ad !important;

    background:
        rgba(22,120,173,.08) !important;

    border:
        1px solid rgba(22,120,173,.28) !important;
}


/* =========================================================
   LED DISPLAY
   ========================================================= */

.led-screen {
    background:
        linear-gradient(
            145deg,
            #eaf8ff 0%,
            #d5f1ff 50%,
            #bde7ff 100%
        ) !important;

    border-color:
        #1678ad !important;

    box-shadow:
        0 30px 80px rgba(22,120,173,.22),
        inset 0 0 35px rgba(255,255,255,.65) !important;

    color: var(--vx-navy) !important;
}


.led-screen-top {
    color: var(--vx-blue) !important;
}

.led-screen-content {
    color: var(--vx-navy) !important;
}

.led-screen-content span {
    color: var(--vx-navy) !important;
}

.led-screen-content small {
    color: var(--vx-blue) !important;
}

.led-screen-bottom {
    color: var(--vx-navy) !important;

    border-top-color:
        rgba(22,120,173,.18) !important;
}


/* =========================================================
   FORMS
   ========================================================= */

input,
textarea,
select {
    background: rgba(255,255,255,.88) !important;

    color: var(--vx-navy) !important;

    border-color:
        rgba(22,120,173,.18) !important;
}


input::placeholder,
textarea::placeholder {
    color: #8093a0 !important;
}


/* =========================================================
   FOOTER
   ========================================================= */

footer {
    background:
        linear-gradient(
            135deg,
            #dff4ff,
            #ccecff
        ) !important;

    color: var(--vx-navy) !important;

    border-top:
        1px solid rgba(22,120,173,.15) !important;
}


footer p,
footer span {
    color: var(--vx-text) !important;
}


footer a {
    color: var(--vx-blue) !important;
}


/* =========================================================
   BORDERS
   ========================================================= */

hr {
    border-color:
        rgba(22,120,173,.15) !important;
}


/* =========================================================
   REMOVE COMMON BLACK BACKGROUNDS
   ========================================================= */

[style*="background: #000"],
[style*="background:#000"],
[style*="background: black"],
[style*="background:black"] {
    background: #eaf8ff !important;
}

/* =========================================================
   VIREONX — FINAL LIGHT BLUE THEME
   Exact overrides for the existing website classes
   ========================================================= */

:root{
    --vx-light:#eaf8ff;
    --vx-light-2:#d5f1ff;
    --vx-light-3:#bde7ff;
    --vx-blue:#1678ad;
    --vx-blue-dark:#12618a;
    --vx-navy:#102331;
    --vx-text:#526474;
    --vx-muted:#607786;
}

/* GLOBAL */
html,
body{
    background:#eaf8ff !important;
    color:#102331 !important;
}

/* HEADER */
.header{
    background:rgba(234,248,255,.94) !important;
    border-bottom:1px solid rgba(22,120,173,.14) !important;
}
.header nav a{
    color:#102331 !important;
}
.header nav a:hover,
.header nav .active{
    color:#1678ad !important;
}
.nav-btn{
    background:#1678ad !important;
}

/* HERO — remove dark/black background */
.hero{
    background:
        radial-gradient(circle at 78% 35%,rgba(120,210,255,.42),transparent 32%),
        linear-gradient(135deg,#eaf8ff 0%,#d5f1ff 52%,#ccecff 100%) !important;
    color:#102331 !important;
}
.hero:before{
    background:
        radial-gradient(circle at 78% 35%,rgba(255,255,255,.80),transparent 32%),
        linear-gradient(120deg,rgba(255,255,255,.55),rgba(180,230,255,.18)) !important;
}
.hero h1,
.hero h1 em{
    color:#102331 !important;
}
.hero h1 em{
    color:#1678ad !important;
}
.hero p{
    color:#526474 !important;
}
.micro{
    color:#607786 !important;
}
.btn.ghost,
.btn.outline-white{
    border-color:rgba(22,120,173,.30) !important;
    color:#1678ad !important;
}

/* HERO DISPLAY */
.screen-card{
    background:
        linear-gradient(145deg,#f8fdff,#d5f1ff) !important;
    border-color:rgba(22,120,173,.22) !important;
    box-shadow:0 35px 80px rgba(22,120,173,.18),
               inset 0 0 60px rgba(255,255,255,.70) !important;
}
.screen-top,
.screen-bottom{
    color:#526474 !important;
}
.screen-content{
    background:
        linear-gradient(160deg,#dff5ff,#bde7ff) !important;
    color:#102331 !important;
}
.screen-content strong{
    color:#102331 !important;
}
.screen-content strong b,
.screen-kicker{
    color:#1678ad !important;
}
.floating-chip{
    background:rgba(255,255,255,.88) !important;
    border-color:rgba(22,120,173,.20) !important;
    color:#1678ad !important;
    box-shadow:0 10px 30px rgba(22,120,173,.12) !important;
}

/* NORMAL / DARK SECTIONS */
.dark{
    background:
        radial-gradient(circle at 10% 0%,rgba(255,255,255,.72),transparent 35%),
        radial-gradient(circle at 90% 100%,rgba(120,200,255,.30),transparent 40%),
        linear-gradient(135deg,#eaf8ff 0%,#d5f1ff 50%,#ccecff 100%) !important;
    color:#102331 !important;
}
.dark p,
.dark .section-head>p{
    color:#526474 !important;
}
.dark .eyebrow{
    color:#1678ad !important;
}

/* SOLUTION CARDS */
.solution-card{
    background:#d5f1ff !important;
}
.solution-overlay{
    background:linear-gradient(180deg,rgba(255,255,255,.02) 25%,rgba(16,35,49,.72) 100%) !important;
}

/* NETWORK MAP */
.network-map{
    background:
        radial-gradient(circle at 50% 45%,rgba(120,210,255,.24),transparent 42%),
        linear-gradient(135deg,#eaf8ff,#ccecff) !important;
    border-color:rgba(22,120,173,.18) !important;
    box-shadow:0 25px 80px rgba(22,120,173,.12) !important;
}
.network-map:before{
    background:
        linear-gradient(rgba(22,120,173,.08) 1px,transparent 1px),
        linear-gradient(90deg,rgba(22,120,173,.08) 1px,transparent 1px) !important;
}
.route{
    stroke:#78bcd8 !important;
}
.map-node text{
    fill:#526474 !important;
}
.map-panel{
    background:rgba(255,255,255,.90) !important;
    border-color:rgba(22,120,173,.20) !important;
    color:#102331 !important;
    box-shadow:0 18px 45px rgba(22,120,173,.10) !important;
}
.map-panel h3{
    color:#102331 !important;
}
.map-panel p{
    color:#526474 !important;
}

/* ZONE 01 LED */
.led-screen{
    background:linear-gradient(145deg,#eaf8ff 0%,#d5f1ff 50%,#bde7ff 100%) !important;
    border:2px solid #1678ad !important;
    box-shadow:0 30px 80px rgba(22,120,173,.22),
               inset 0 0 35px rgba(255,255,255,.65) !important;
    color:#102331 !important;
}
.led-screen-top{color:#1678ad !important;}
.led-screen-content{color:#102331 !important;}
.led-screen-content span{color:#102331 !important;}
.led-screen-content small{color:#1678ad !important;}
.led-screen-bottom{
    color:#102331 !important;
    opacity:.75 !important;
}
.led-caption span{color:#1678ad !important;}
.led-caption strong{color:#102331 !important;}

/* NEXT EXPANSION */
.future-zones{
    background:
        radial-gradient(circle at 10% 0%,rgba(255,255,255,.72),transparent 35%),
        radial-gradient(circle at 90% 100%,rgba(120,200,255,.35),transparent 40%),
        linear-gradient(135deg,#eaf8ff 0%,#d5f1ff 50%,#ccecff 100%) !important;
    border-color:rgba(22,120,173,.16) !important;
    box-shadow:0 25px 70px rgba(40,120,180,.12) !important;
}
.future-zone{
    background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(240,249,255,.90)) !important;
    border-color:rgba(22,120,173,.18) !important;
}
.future-heading>p{color:#526474 !important;}
.future-heading .eyebrow{color:#1678ad !important;}
.future-heading h3{color:#102331 !important;}
.future-heading h3 em{color:#1678ad !important;}
.future-zone h4{color:#102331 !important;}
.future-zone-number{color:#527083 !important;}
.zone-location-large{color:#526474 !important;}
.future-zone-stat strong{color:#102331 !important;}
.future-zone-stat span{color:#607786 !important;}
.zone-arrow{color:#5d7b8b !important;}
.coming-badge{
    color:#1678ad !important;
    background:rgba(22,120,173,.08) !important;
    border:1px solid rgba(22,120,173,.28) !important;
}

/* NETWORK FOOTER INSIDE SECTION */
.network-footer{
    border-top-color:rgba(22,120,173,.15) !important;
}
.network-total span{
    color:#607786 !important;
}

/* INNER HERO PAGES */
.inner-hero,
.partner-hero{
    background:
        radial-gradient(circle at 80% 25%,rgba(120,210,255,.38),transparent 30%),
        linear-gradient(135deg,#eaf8ff 0%,#d5f1ff 55%,#ccecff 100%) !important;
    color:#102331 !important;
}
.inner-hero h1,
.inner-hero h1 em{
    color:#102331 !important;
}
.inner-hero h1 em{
    color:#1678ad !important;
}
.inner-hero p{
    color:#526474 !important;
}

/* AD / PARTNER CARDS */
.ad-card,
.step,
.check,
.lead-form{
    background:rgba(255,255,255,.90) !important;
    border-color:rgba(22,120,173,.16) !important;
}
.ad-card h3,
.step h3{
    color:#102331 !important;
}
.ad-card p,
.step p,
.check span{
    color:#526474 !important;
}

/* CAMPAIGN VISUAL — remove dark cards */
.campaign-card{
    background:linear-gradient(145deg,#eaf8ff,#ccecff) !important;
    border-color:rgba(22,120,173,.22) !important;
    box-shadow:0 25px 60px rgba(22,120,173,.15) !important;
    color:#102331 !important;
}
.campaign-card span{
    color:#1678ad !important;
}
.campaign-card b{
    color:#102331 !important;
}
.campaign-card i{
    color:#1678ad !important;
}

/* PARTNER 20/80 MODEL */
.ratio-box{
    background:linear-gradient(145deg,#d5f1ff,#bde7ff) !important;
    border-color:rgba(22,120,173,.18) !important;
    color:#1678ad !important;
}
.ratio-box.big{
    background:linear-gradient(145deg,#1678ad,#12618a) !important;
    color:#fff !important;
}
.ratio-box small{
    color:#526474 !important;
}
.ratio-box.big small{
    color:#dff5ff !important;
}

/* CTA BAND — keep VireonX blue, not black */
.cta-band{
    background:linear-gradient(120deg,#1678ad,#0b8fca) !important;
}

/* FOOTER — remove black */
footer{
    background:
        linear-gradient(135deg,#dff4ff,#ccecff) !important;
    color:#102331 !important;
    border-top:1px solid rgba(22,120,173,.15) !important;
}
.footer-grid img{
    filter:none !important;
}
.footer-grid p,
.footer-grid a,
.copyright{
    color:#526474 !important;
}
.footer-grid>div>span{
    color:#1678ad !important;
}
.footer-grid a:hover{
    color:#102331 !important;
}
.copyright{
    border-top-color:rgba(22,120,173,.15) !important;
}

/* LINKS / FORM */
.text-link,
.contact-direct a{
    color:#1678ad !important;
}
.lead-form input,
.lead-form textarea{
    background:#fff !important;
    color:#102331 !important;
    border-color:rgba(22,120,173,.18) !important;
}

/* REMOVE BLACK INLINE BACKGROUNDS WHERE USED */
[style*="background:#000"],
[style*="background: #000"],
[style*="background:black"],
[style*="background: black"]{
    background:#eaf8ff !important;
}