*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:#0b1626;background:#f7fafc;line-height:1.5}.topbar{height:78px;display:flex;align-items:center;gap:28px;padding:8px 5%;background:#fff;position:sticky;top:0;z-index:50;box-shadow:0 3px 20px #00152a12}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#0b1626;margin-right:auto}.brand img{width:58px;height:58px;border-radius:50%;object-fit:cover}.brand b{display:block;font-size:19px;color:#0877d9;line-height:1.05}.brand small{display:block;font-size:9px;font-weight:800;letter-spacing:.7px}.topbar nav{display:flex;gap:25px}.topbar nav a{color:#182638;text-decoration:none;font-weight:800;font-size:14px}.mini-chat{background:#0878ff;color:#fff;text-decoration:none;padding:11px 17px;border-radius:12px;font-weight:900}.hero{min-height:650px;position:relative;overflow:hidden;background:#071526}.hero-photo{position:absolute;inset:0;background:url('assets/family-hero.jpg') center/cover no-repeat;transform:scale(1.01)}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#04101fe8 0%,#04101fc8 31%,#04101f38 62%,#04101f18 100%)}.hero-copy{position:relative;z-index:2;color:#fff;width:min(650px,90%);padding:100px 0 80px 7%}.pill,.heading span,.family-message span,.contact>div>span{font-weight:900;letter-spacing:1.6px;color:#11c8ff}.hero h1{font-size:clamp(44px,6vw,76px);line-height:.98;margin:13px 0}.hero h1 em,.heading em,.family-message em{color:#12c8ff;font-style:normal}.hero-copy>p{font-size:19px;max-width:560px;color:#d8e7f3}.cta{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0}.btn{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;color:#fff;font-weight:900;border-radius:13px;padding:13px 24px;min-width:170px;box-shadow:0 10px 25px #0003}.btn small{font-size:10px;font-weight:700;opacity:.85}.primary{background:#0878ff}.green{background:#16b94c}.hero-points{display:flex;flex-wrap:wrap;gap:10px;color:#eaf6ff;font-weight:800}.hero-points span{padding:8px 11px;background:#071e34cc;border:1px solid #0ccaff55;border-radius:10px}.trust{display:grid;grid-template-columns:repeat(4,1fr);background:#061426;color:#fff;padding:22px 7%;gap:12px}.trust div{display:flex;align-items:center;gap:10px;justify-content:center;border-right:1px solid #ffffff20}.trust div:last-child{border:0}.trust strong{font-size:30px;color:#11c8ff}.trust span{font-weight:800}.section{max-width:1250px;margin:auto;padding:85px 6%}.section.light{max-width:none;background:#eef5fa}.heading{text-align:center;margin:0 auto 38px;max-width:750px}.heading h2{font-size:42px;line-height:1.05;margin:7px 0}.heading p{color:#65778b}.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{padding:30px;border-radius:22px;color:#fff;box-shadow:0 20px 40px #00152a1c;min-height:365px;display:flex;flex-direction:column}.basic{background:linear-gradient(150deg,#0d9418,#051d0a)}.standard{background:linear-gradient(150deg,#067cff,#06204d)}.premium{background:linear-gradient(150deg,#ed1b99,#3b082f)}.label{font-size:16px;font-weight:900}.card h3{font-size:58px;line-height:1;margin:22px 0 0}.card>small{font-weight:800;opacity:.8}.speed{font-size:42px;font-weight:900;margin-top:15px}.speed i{font-size:20px;font-style:normal}.card p{opacity:.9}.card-btn{margin-top:auto;text-align:center;padding:12px;border:1px solid #ffffff66;border-radius:11px;text-decoration:none;color:#fff;font-weight:900;background:#ffffff18}.features{max-width:1150px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.features article{background:#fff;border:1px solid #dce7f0;border-radius:18px;padding:25px;box-shadow:0 12px 30px #00152a0d}.features b{font-size:18px;color:#0878d9}.features p{color:#5f7185;font-size:14px}.family-message{padding:85px 7%;background:linear-gradient(100deg,#061426eF,#06142699),url('assets/family-hero.jpg') center/cover;min-height:390px;color:#fff;display:flex;align-items:center}.family-message h2{font-size:45px;line-height:1.05;margin:8px 0 12px}.family-message p{max-width:570px;color:#d7e5f0}.contact{padding:65px 7%;background:#061426;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:30px}.contact h2{font-size:38px;line-height:1.1;margin:7px 0}.contact p{color:#b9cbd9}.contact-actions{display:flex;gap:12px;flex-wrap:wrap}footer{background:#02070d;color:#fff;padding:28px 6%;display:flex;align-items:center;justify-content:space-between;gap:20px}.footer-brand{display:flex;align-items:center;gap:12px}.footer-brand img{width:48px;height:48px;border-radius:50%;object-fit:cover}.footer-brand b{display:block;font-size:14px}.footer-brand span{display:block;color:#9db1c3;font-size:12px}.mobile-cta{display:none}@media(max-width:900px){.topbar{height:68px;padding:7px 14px}.topbar nav{display:none}.brand img{width:46px;height:46px}.brand b{font-size:16px}.brand small{font-size:7px}.mini-chat{padding:9px 11px;font-size:11px}.hero{min-height:720px}.hero-photo{background-position:62% center}.hero-shade{background:linear-gradient(90deg,#04101fe8 0%,#04101fb8 50%,#04101f40 100%)}.hero-copy{padding:70px 22px 100px;width:100%}.hero h1{font-size:46px}.hero-copy>p{font-size:16px}.trust{grid-template-columns:repeat(2,1fr);padding:18px}.trust div{border:0}.plans,.features{grid-template-columns:1fr}.section{padding:60px 20px}.heading h2{font-size:32px}.card{min-height:330px}.family-message{padding:65px 22px;min-height:450px}.family-message h2{font-size:35px}.contact{display:block;padding:50px 22px}.contact h2{font-size:30px}.contact-actions{margin-top:25px}.contact-actions .btn{flex:1}.footer-brand b{font-size:12px}footer{padding-bottom:82px}.mobile-cta{display:grid;position:fixed;bottom:0;left:0;right:0;z-index:60;grid-template-columns:1fr 1fr;gap:8px;padding:8px;background:#fff;box-shadow:0 -6px 25px #0002}.mobile-cta a{padding:13px;text-align:center;border-radius:10px;color:#fff;text-decoration:none;font-weight:900;background:#0878ff}.mobile-cta a:last-child{background:#16b94c}}


/* Clean mobile CTA: no duplicate fixed Apply/Chat bar */
.mobile-cta{display:none !important}

@media(max-width:900px){
  .topbar{
    justify-content:space-between;
  }
  .brand{
    margin-right:auto;
  }
}


/* Mobile v4: one CTA pair only */
@media (max-width:900px){
  .contact-actions{
    display:none !important;
  }
}


/* Mobile family photo refinement */
@media(max-width:900px){
  .hero-photo{
    height:300px;
    flex-basis:300px;
    background-image:url('assets/family-hero-mobile.jpg') !important;
    background-position:center center !important;
    background-size:cover !important;
  }
  .hero-shade{height:300px}
  .family-message{
    background:
      linear-gradient(90deg,#061426ed 0%,#061426c4 100%),
      url('assets/family-hero-mobile.jpg') center/cover;
  }
}
@media(max-width:430px){
  .hero-photo{
    height:230px;
    flex-basis:230px;
  }
  .hero-shade{height:230px}
}


/* =========================================================
   FINAL HERO LAYOUT — photo stays clear, text stays readable
   Desktop: text panel on the left, family photo on the right.
   Mobile: family photo first, text underneath.
   ========================================================= */

@media (min-width:901px){
  .hero{
    min-height:650px;
    background:#061426;
  }
  .hero-photo{
    inset:0 0 0 38%;
    background-image:url('assets/family-hero.jpg') !important;
    background-position:center center !important;
    background-size:cover !important;
    transform:none;
  }
  .hero-shade{
    inset:0 0 0 33%;
    background:linear-gradient(90deg,#061426 0%,#061426cc 16%,#06142635 48%,#06142600 72%) !important;
  }
  .hero-copy{
    width:46%;
    min-height:650px;
    padding:100px 30px 80px 7%;
    background:#061426;
  }
  .hero h1{
    font-size:clamp(43px,5.2vw,68px);
  }
  .hero-copy>p{
    max-width:510px;
  }
}

@media (max-width:900px){
  .hero{
    min-height:0 !important;
    height:auto;
    display:flex;
    flex-direction:column;
    background:#061426;
  }

  /* Photo is completely separate from the text so faces are never
     covered by the headline or buttons. */
  .hero-photo{
    position:relative !important;
    inset:auto !important;
    width:100%;
    height:250px !important;
    flex:0 0 250px !important;
    background-image:url('assets/family-hero-mobile.jpg') !important;
    background-position:center center !important;
    background-size:cover !important;
    transform:none !important;
  }

  .hero-shade{
    position:absolute !important;
    inset:0 0 auto 0 !important;
    height:250px !important;
    background:linear-gradient(180deg,#06142600 55%,#06142655 100%) !important;
    pointer-events:none;
  }

  .hero-copy{
    position:relative !important;
    width:100% !important;
    min-height:0 !important;
    padding:27px 20px 30px !important;
    background:#061426;
  }

  .hero h1{
    font-size:39px !important;
    line-height:1.02;
    margin:10px 0 12px;
  }

  .hero-copy>p{
    font-size:14px !important;
    line-height:1.5;
    margin:0;
  }

  .cta{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:9px;
    margin:20px 0 14px;
  }

  .btn{
    min-width:0;
    padding:12px 8px;
    border-radius:11px;
    font-size:13px;
  }

  .hero-points{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:8px;
  }

  .hero-points span{
    padding:8px 7px;
    font-size:10px;
    text-align:center;
  }

  /* No repeated CTA lower on the page. */
  .contact-actions{
    display:none !important;
  }
}

@media (max-width:430px){
  .hero-photo{
    height:225px !important;
    flex-basis:225px !important;
  }
  .hero-shade{
    height:225px !important;
  }
  .hero-copy{
    padding:24px 17px 27px !important;
  }
  .hero h1{
    font-size:35px !important;
  }
  .hero-points span{
    font-size:9.5px;
  }
}

@media (max-width:360px){
  .hero h1{font-size:32px !important}
  .cta{grid-template-columns:1fr}
  .hero-points{grid-template-columns:1fr}
}


/* Final CTA behavior */
.hero .btn.green{display:inline-flex !important;}
@media(max-width:900px){
  .hero .cta{
    grid-template-columns:1fr 1fr !important;
  }
}
@media(max-width:360px){
  .hero .cta{
    grid-template-columns:1fr !important;
  }
}


/* =========================================================
   V6 FINAL HERO
   - Desktop: full family photo on the right, text on the left.
   - Mobile: complete family photo first, text below.
   - Both Apply Now and Chat With Us are retained.
   ========================================================= */

.hero .btn.green{display:inline-flex !important;}

@media (min-width:901px){
  .hero{
    min-height:650px;
    background:#061426;
  }
  .hero-photo{
    inset:0 0 0 42% !important;
    background-image:url('assets/family-hero.jpg') !important;
    background-position:center center !important;
    background-size:cover !important;
    transform:none !important;
  }
  .hero-shade{
    inset:0 0 0 36% !important;
    background:linear-gradient(90deg,#061426 0%,#061426d9 17%,#06142635 52%,#06142600 78%) !important;
  }
  .hero-copy{
    width:47% !important;
    min-height:650px;
    padding:92px 30px 70px 7% !important;
    background:#061426;
  }
}

@media (max-width:900px){
  .hero{
    min-height:0 !important;
    height:auto !important;
    display:flex !important;
    flex-direction:column !important;
    background:#061426 !important;
  }
  .hero-photo{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    height:270px !important;
    flex:0 0 270px !important;
    background-image:url('assets/family-hero-mobile.jpg') !important;
    background-position:center center !important;
    background-size:cover !important;
    transform:none !important;
  }
  .hero-shade{
    position:absolute !important;
    inset:0 !important;
    height:270px !important;
    background:linear-gradient(180deg,#06142600 50%,#06142645 100%) !important;
  }
  .hero-copy{
    position:relative !important;
    width:100% !important;
    min-height:0 !important;
    padding:25px 18px 30px !important;
    background:#061426 !important;
  }
  .hero h1{
    font-size:36px !important;
    line-height:1.04 !important;
    margin:9px 0 11px !important;
  }
  .hero-copy>p{
    font-size:14px !important;
    line-height:1.5 !important;
  }
  .cta{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:9px !important;
    margin:19px 0 13px !important;
  }
  .hero .btn{
    display:flex !important;
    align-items:center;
    justify-content:center;
    min-width:0;
    padding:12px 7px !important;
    font-size:12px !important;
  }
  .hero-points{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:7px !important;
  }
  .hero-points span{
    font-size:10px !important;
    padding:8px 6px !important;
  }
}

@media (max-width:430px){
  .hero-photo{
    height:245px !important;
    flex-basis:245px !important;
  }
  .hero-shade{height:245px !important;}
  .hero h1{font-size:34px !important;}
}

@media (max-width:360px){
  .hero-photo{
    height:225px !important;
    flex-basis:225px !important;
  }
  .hero-shade{height:225px !important;}
  .hero h1{font-size:31px !important;}
  .cta{grid-template-columns:1fr !important;}
  .hero-points{grid-template-columns:1fr !important;}
}


/* Cloudflare final refinements */
.trust{grid-template-columns:repeat(5,1fr)}
.features{grid-template-columns:repeat(4,1fr)}
.footer-chat{display:inline-flex;align-items:center;justify-content:center;background:#16b94c;color:#fff;text-decoration:none;font-weight:900;border-radius:11px;padding:11px 18px;white-space:nowrap}
@media(max-width:900px){
  .trust{grid-template-columns:repeat(2,1fr)}
  .features{grid-template-columns:1fr}
  footer{display:grid;grid-template-columns:1fr auto;align-items:center}
  .footer-chat{grid-column:2;grid-row:1;align-self:center}
  footer>small{grid-column:1 / -1}
}
@media(max-width:430px){
  footer{grid-template-columns:1fr}
  .footer-chat{grid-column:1;grid-row:auto;width:100%}
}

.trust { position: relative; }
.trust-note {
  width: 100%;
  margin: 4px 0 0;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .2px;
  opacity: .9;
}
@media (max-width: 640px) {
  .trust-note { font-size: 13px; margin-top: 8px; }
}

/* Business email */
.contact-email{margin-top:14px}.contact-email a{color:#11c8ff;text-decoration:none;font-weight:800}.footer-links{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.footer-email{color:#9db1c3;text-decoration:none;font-weight:800;font-size:13px}

/* Network activity showcase */
.network-status{padding:72px 6%;background:#050b18;color:#fff;overflow:hidden}
.network-shell{max-width:1220px;margin:auto;border:1px solid #0878ff66;border-radius:26px;padding:28px 30px 24px;background:
  radial-gradient(circle at 86% 42%,#153e7b40 0,#153e7b00 32%),
  linear-gradient(145deg,#08162b,#030914);box-shadow:0 24px 70px #00152a40;position:relative}
.network-shell:before{content:"";position:absolute;inset:-30% -10%;background:repeating-linear-gradient(115deg,transparent 0 22px,#16c8ff0b 23px 24px);pointer-events:none}
.network-top{position:relative;z-index:1;display:grid;grid-template-columns:1.4fr auto auto;align-items:center;gap:25px}
.network-kicker{font-size:12px;letter-spacing:3px;color:#19c8ff;font-weight:900}
.network-top h2{margin:4px 0 0;font-size:34px;letter-spacing:.3px}
.network-online{justify-self:center;border:1px solid #17d87866;background:#0a6a3922;color:#5bff9b;border-radius:999px;padding:11px 19px;font-weight:900;letter-spacing:1.4px;box-shadow:inset 0 0 22px #1aff7a0d}
.network-online span{display:inline-block;width:10px;height:10px;border-radius:50%;background:#36ed7e;box-shadow:0 0 13px #36ed7e;margin-right:9px}
.network-datetime{text-align:right;display:flex;flex-direction:column;gap:2px}
.network-datetime strong{font-size:14px;color:#8cdfff}
.network-datetime span{font-size:25px;font-weight:900}
.network-speeds{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:26px 0 20px}
.network-speed-card{display:flex;align-items:center;gap:18px;padding:20px 24px;border:1px solid #ffffff18;border-radius:19px;background:#0b1425cc}
.network-speed-card .speed-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;font-size:33px;font-weight:900}
.network-speed-card.download .speed-icon{color:#20d8ff;border:2px solid #20d8ff66;background:#20d8ff10}
.network-speed-card.upload .speed-icon{color:#b478ff;border:2px solid #b478ff66;background:#b478ff10}
.network-speed-card small{display:block;font-weight:900;letter-spacing:1.6px;color:#a9bdd1;font-size:12px}
.network-speed-card strong{display:block;font-size:43px;line-height:1.05;letter-spacing:-1px}
.network-speed-card strong b{font-size:18px;color:#25cfff;letter-spacing:0}
.network-speed-card.upload strong b{color:#bd8cff}
.network-graph-wrap{position:relative;z-index:1;height:285px;margin-left:70px;border-left:1px solid #2b5076;border-bottom:1px solid #2b5076}
.network-axis{position:absolute;left:-70px;top:4px;bottom:3px;width:60px;display:flex;flex-direction:column;justify-content:space-between;color:#8ea4bb;font-size:11px;text-align:right}
.network-graph{width:100%;height:100%;overflow:visible}
.graph-grid path{stroke:#1a4264;stroke-width:1;opacity:.55}
.graph-line{fill:none;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.graph-line.download-line{stroke:#1ed6ff}
.graph-line.upload-line{stroke:#ad70ff}
.graph-line.glow{stroke-width:7;opacity:.45}
.graph-fill{opacity:.9}
.network-legend{position:relative;z-index:1;display:flex;align-items:center;gap:25px;margin:17px 4px 0;color:#b9cbe0;font-size:13px;font-weight:800}
.network-legend>span{display:flex;align-items:center;gap:8px}
.legend-dot{width:11px;height:11px;border-radius:50%;display:inline-block}
.legend-dot.down{background:#1ed6ff;box-shadow:0 0 10px #1ed6ff}
.legend-dot.up{background:#ad70ff;box-shadow:0 0 10px #ad70ff}
.network-flow{margin-left:auto;gap:5px!important}
.network-flow i{width:4px;height:16px;border-radius:5px;background:#1ed6ff;animation:flow 1s infinite ease-in-out}
.network-flow i:nth-child(2){animation-delay:.1s}.network-flow i:nth-child(3){animation-delay:.2s}.network-flow i:nth-child(4){animation-delay:.3s}.network-flow i:nth-child(5){animation-delay:.4s}.network-flow i:nth-child(6){animation-delay:.5s}.network-flow i:nth-child(7){animation-delay:.6s}.network-flow i:nth-child(8){animation-delay:.7s}
@keyframes flow{0%,100%{transform:scaleY(.5);opacity:.45}50%{transform:scaleY(1.5);opacity:1}}
@media(max-width:900px){
  .network-status{padding:52px 16px}
  .network-shell{padding:22px 16px 18px;border-radius:20px}
  .network-top{grid-template-columns:1fr auto;gap:12px}
  .network-top h2{font-size:25px}
  .network-online{grid-column:2;grid-row:1;align-self:start;font-size:11px;padding:9px 12px}
  .network-datetime{grid-column:1/-1;text-align:left;border-top:1px solid #ffffff12;padding-top:11px;flex-direction:row;justify-content:space-between;align-items:center}
  .network-datetime strong{font-size:12px}
  .network-datetime span{font-size:17px}
  .network-speeds{grid-template-columns:1fr;gap:10px;margin-top:19px}
  .network-speed-card{padding:15px 16px}
  .network-speed-card .speed-icon{width:48px;height:48px;font-size:27px}
  .network-speed-card strong{font-size:34px}
  .network-graph-wrap{height:230px;margin-left:52px}
  .network-axis{left:-52px;width:45px;font-size:9px}
  .network-legend{gap:15px;font-size:11px}
}
@media(max-width:430px){
  .network-top h2{font-size:23px}
  .network-online{padding:8px 10px}
  .network-speed-card strong{font-size:31px}
  .network-speed-card strong b{font-size:15px}
  .network-graph-wrap{height:205px}
  .network-flow{display:none!important}
}
