:root {
  --bg: #070b18;
  --bg-elevated: rgba(15, 22, 45, 0.78);
  --panel: rgba(10, 16, 34, 0.88);
  --panel-solid: #0d142b;
  --line: rgba(157, 174, 222, 0.16);
  --line-strong: rgba(157, 174, 222, 0.28);
  --text: #f4f7ff;
  --muted: #9aa8c8;
  --cyan: #28d7ff;
  --blue: #6d7cff;
  --purple: #b564ff;
  --green: #3ce6a8;
  --danger: #ff6b86;
  --shadow: 0 30px 90px rgba(0, 0, 0, 0.42);
  --radius: 28px;
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background:
    radial-gradient(circle at 20% 0%, rgba(40, 215, 255, 0.11), transparent 35%),
    radial-gradient(circle at 80% 10%, rgba(181, 100, 255, 0.13), transparent 34%),
    linear-gradient(180deg, #070b18 0%, #080d1d 55%, #060a15 100%);
  color: var(--text);
  overflow-x: hidden;
}

button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a { color: inherit; }

.background-orb {
  position: fixed;
  width: 28rem;
  height: 28rem;
  border-radius: 50%;
  filter: blur(110px);
  opacity: 0.13;
  pointer-events: none;
  z-index: -1;
}
.orb-one { top: 22%; left: -15rem; background: var(--cyan); }
.orb-two { right: -12rem; bottom: 8%; background: var(--purple); }

.site-header {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  min-height: 86px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border-bottom: 1px solid var(--line);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}
.brand-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(40, 215, 255, 0.28);
  border-radius: 15px;
  background: linear-gradient(145deg, rgba(40, 215, 255, 0.15), rgba(109, 124, 255, 0.12));
  box-shadow: inset 0 0 20px rgba(40, 215, 255, 0.08), 0 10px 30px rgba(40, 215, 255, 0.08);
}
.brand-mark svg { width: 31px; fill: none; stroke: var(--cyan); stroke-width: 2.5; stroke-linecap: round; }
.brand-mark circle { fill: var(--cyan); stroke: none; }
.brand-copy { display: flex; flex-direction: column; line-height: 1; }
.brand-copy strong { font-size: 1.08rem; letter-spacing: 0.01em; }
.brand-copy small { margin-top: 5px; color: var(--cyan); font-size: 0.78rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }

.header-actions { display: flex; align-items: center; gap: 12px; }
.secure-pill, .call-link {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 14px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 750;
}
.secure-pill { border: 1px solid var(--line); color: var(--muted); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); }
.call-link { text-decoration: none; border: 1px solid rgba(40, 215, 255, 0.3); background: rgba(40, 215, 255, 0.08); color: #dffaff; }
.call-link:hover { background: rgba(40, 215, 255, 0.15); }

main { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.hero { padding: 72px 0 80px; }
.hero-copy { max-width: 740px; margin: 0 auto 38px; text-align: center; }
.eyebrow { margin: 0 0 12px; color: var(--cyan); font-size: 0.75rem; font-weight: 850; letter-spacing: 0.18em; text-transform: uppercase; }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1 { margin: 0; font-size: clamp(2.3rem, 6vw, 4.7rem); line-height: 0.98; letter-spacing: -0.055em; }
.hero-copy > p:last-child { max-width: 650px; margin: 22px auto 0; color: var(--muted); line-height: 1.7; font-size: 1.04rem; }
.hero-copy-after { margin: 42px auto 0; }

.test-shell {
  position: relative;
  max-width: 880px;
  margin: 0 auto;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(17, 25, 52, 0.9), rgba(8, 13, 29, 0.95));
  box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,0.04);
  overflow: hidden;
}
.test-shell::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--cyan), var(--purple), transparent);
  opacity: 0.85;
}
.connection-bar {
  min-height: 75px;
  padding: 18px 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--line);
  background: rgba(255,255,255,0.015);
}
.connection-bar > div { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.connection-right { text-align: right; }
.connection-label { color: var(--muted); font-size: 0.67rem; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }
.connection-bar strong { max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.88rem; }

.meter-area { padding: 34px 30px 22px; text-align: center; }
.stage-label { min-height: 24px; color: var(--cyan); font-size: 0.76rem; font-weight: 850; letter-spacing: 0.16em; text-transform: uppercase; }
.speedometer {
  position: relative;
  width: min(100%, 540px);
  aspect-ratio: 420 / 280;
  margin: 0 auto;
}
.meter-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.meter-track, .meter-progress { fill: none; stroke-width: 13; stroke-linecap: round; }
.meter-track { stroke: rgba(148, 166, 217, 0.13); }
.meter-progress { stroke: url(#meterGradient); stroke-dasharray: 100; stroke-dashoffset: 100; filter: url(#meterGlow); transition: stroke-dashoffset 180ms linear; }
.ticks line { stroke: rgba(184, 197, 233, 0.34); stroke-width: 2; }
.ticks line.major { stroke: rgba(224, 232, 255, 0.66); stroke-width: 3; }

.go-button {
  position: absolute;
  left: 50%;
  top: 58%;
  transform: translate(-50%, -50%);
  width: 142px;
  height: 142px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(40, 215, 255, 0.62);
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 35%, rgba(40, 215, 255, 0.19), transparent 46%),
    linear-gradient(160deg, rgba(21, 34, 68, 0.98), rgba(9, 16, 34, 0.98));
  color: white;
  box-shadow: 0 0 0 11px rgba(40, 215, 255, 0.035), 0 0 55px rgba(40, 215, 255, 0.17), inset 0 0 34px rgba(40, 215, 255, 0.08);
  cursor: pointer;
  z-index: 2;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
.go-button:hover { transform: translate(-50%, -50%) scale(1.035); box-shadow: 0 0 0 13px rgba(40, 215, 255, 0.05), 0 0 70px rgba(40, 215, 255, 0.24), inset 0 0 35px rgba(40, 215, 255, 0.12); }
.go-button:focus-visible { outline: 3px solid #fff; outline-offset: 5px; }
.go-button:disabled { cursor: progress; }
.go-button.testing { animation: pulse 1.8s ease-in-out infinite; }
.go-button.complete { border-color: rgba(60, 230, 168, 0.8); box-shadow: 0 0 0 11px rgba(60,230,168,.04), 0 0 55px rgba(60,230,168,.15), inset 0 0 34px rgba(60,230,168,.07); }
.go-ring { position: absolute; inset: 9px; border: 1px dashed rgba(178, 210, 255, 0.18); border-radius: 50%; }
.go-button.testing .go-ring { animation: rotate 4s linear infinite; }
.go-text { font-size: 2.1rem; line-height: 1; font-weight: 900; letter-spacing: -0.04em; }
.go-subtext { margin-top: 7px; color: var(--muted); font-size: 0.68rem; font-weight: 750; letter-spacing: 0.08em; text-transform: uppercase; }
.live-reading {
  position: absolute;
  left: 50%;
  bottom: 3%;
  transform: translateX(-50%);
  min-width: 170px;
  display: none;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  z-index: 3;
}
.live-reading.visible { display: flex; }
.live-reading strong { font-size: clamp(2.3rem, 7vw, 3.6rem); line-height: 1; letter-spacing: -0.06em; font-variant-numeric: tabular-nums; }
.live-reading span { color: var(--muted); font-size: 0.8rem; font-weight: 800; }

.scale-row { width: min(100%, 520px); margin: -2px auto 0; display: flex; justify-content: space-between; color: #7482a3; font-size: 0.67rem; font-variant-numeric: tabular-nums; }
.progress-copy { min-height: 24px; margin-top: 17px; color: var(--muted); font-size: 0.86rem; }

.result-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.metric-card {
  min-height: 112px;
  padding: 22px 19px;
  display: flex;
  align-items: center;
  gap: 13px;
  border-right: 1px solid var(--line);
  background: rgba(255,255,255,0.012);
}
.metric-card:last-child { border-right: 0; }
.metric-icon { width: 36px; height: 36px; flex: 0 0 36px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 12px; color: var(--cyan); background: rgba(40, 215, 255, 0.055); font-weight: 900; }
.metric-card > div:last-child { min-width: 0; }
.metric-card span { display: block; margin-bottom: 8px; color: var(--muted); font-size: 0.63rem; font-weight: 850; letter-spacing: 0.12em; }
.metric-card strong { display: block; font-size: 1.37rem; line-height: 1; font-variant-numeric: tabular-nums; white-space: nowrap; }
.metric-card small { color: #8493b4; font-size: 0.63rem; font-weight: 750; }
.metric-card.active { background: linear-gradient(180deg, rgba(40, 215, 255, 0.06), rgba(40, 215, 255, 0.015)); }
.metric-card.active .metric-icon { box-shadow: 0 0 28px rgba(40, 215, 255, 0.14); }
.metric-card.complete strong { color: #fff; }

.chart-panel { padding: 25px 26px 12px; border-bottom: 1px solid var(--line); }
.chart-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.chart-heading strong { font-size: 0.84rem; }
.chart-heading span { color: var(--muted); font-size: 0.72rem; }
#speedChart { display: block; width: 100%; height: 150px; }

.result-actions { padding: 22px 26px 27px; display: flex; justify-content: center; gap: 12px; }
.primary-button, .secondary-button {
  min-height: 46px;
  padding: 0 22px;
  border-radius: 13px;
  font-weight: 850;
  cursor: pointer;
}
.primary-button { border: 0; background: linear-gradient(135deg, var(--cyan), var(--blue)); color: #06101e; box-shadow: 0 12px 28px rgba(40, 215, 255, 0.18); }
.secondary-button { border: 1px solid var(--line-strong); background: rgba(255,255,255,0.035); color: var(--text); }
.primary-button:hover, .secondary-button:hover { filter: brightness(1.08); }

.error-message { margin: 0 26px 26px; padding: 15px 17px; border: 1px solid rgba(255, 107, 134, 0.32); border-radius: 13px; background: rgba(255, 107, 134, 0.08); color: #ffd7df; font-size: 0.85rem; line-height: 1.55; }

.tips-section, .history-section { padding: 18px 0 84px; }
.tips-heading { max-width: 620px; margin-bottom: 28px; }
h2 { margin: 0; font-size: clamp(1.8rem, 4vw, 3rem); line-height: 1.08; letter-spacing: -0.04em; }
.tips-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.tips-grid article { min-height: 205px; padding: 25px; border: 1px solid var(--line); border-radius: 20px; background: var(--bg-elevated); }
.tips-grid article > span { display: inline-grid; place-items: center; width: 38px; height: 38px; margin-bottom: 24px; border: 1px solid rgba(40, 215, 255, 0.24); border-radius: 11px; color: var(--cyan); font-size: 0.72rem; font-weight: 900; }
.tips-grid h3 { margin: 0 0 10px; font-size: 1.03rem; }
.tips-grid p { margin: 0; color: var(--muted); font-size: 0.87rem; line-height: 1.65; }

.section-title-row { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.text-button { border: 0; background: none; color: var(--cyan); font-weight: 800; cursor: pointer; }
.history-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 20px; background: var(--bg-elevated); }
table { width: 100%; border-collapse: collapse; min-width: 620px; }
th, td { padding: 18px 22px; text-align: left; border-bottom: 1px solid var(--line); }
th { color: var(--muted); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; }
td { font-size: 0.86rem; font-variant-numeric: tabular-nums; }
tbody tr:last-child td { border-bottom: 0; }

footer {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  padding: 28px 0 40px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  border-top: 1px solid var(--line);
  color: #7280a1;
  font-size: 0.75rem;
}
footer p { margin: 0; }
.noscript-message { position: fixed; left: 20px; right: 20px; bottom: 20px; z-index: 20; padding: 16px; background: #3c1120; color: white; border-radius: 12px; text-align: center; }

@keyframes pulse { 0%, 100% { transform: translate(-50%, -50%) scale(1); } 50% { transform: translate(-50%, -50%) scale(1.04); } }
@keyframes rotate { to { transform: rotate(360deg); } }

@media (max-width: 760px) {
  .site-header, main, footer { width: min(100% - 28px, 1180px); }
  .site-header { min-height: 76px; }
  .secure-pill { display: none; }
  .call-link { min-height: 38px; padding: 0 12px; font-size: 0.75rem; }
  .brand-mark { width: 43px; height: 43px; border-radius: 13px; }
  .brand-copy strong { font-size: 0.95rem; }
  .brand-copy small { font-size: 0.65rem; }
  .hero { padding: 52px 0 64px; }
  .hero-copy { margin-bottom: 28px; }
  .hero-copy > p:last-child { font-size: 0.93rem; }
  .test-shell { border-radius: 22px; }
  .connection-bar { min-height: 68px; padding: 15px 17px; }
  .connection-bar strong { max-width: 150px; font-size: 0.76rem; }
  .meter-area { padding: 27px 11px 18px; }
  .go-button { width: 116px; height: 116px; }
  .go-text { font-size: 1.72rem; }
  .go-subtext { font-size: 0.58rem; }
  .result-grid { grid-template-columns: repeat(2, 1fr); }
  .metric-card { min-height: 94px; padding: 17px 14px; }
  .metric-card:nth-child(2) { border-right: 0; }
  .metric-card:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .metric-card strong { font-size: 1.18rem; }
  .chart-panel { padding: 21px 16px 8px; }
  .result-actions { padding: 19px 16px 22px; }
  .tips-grid { grid-template-columns: 1fr; }
  .tips-grid article { min-height: auto; }
  footer { flex-direction: column; line-height: 1.55; }
}

@media (max-width: 420px) {
  .site-header { gap: 10px; }
  .brand { gap: 8px; }
  .brand-mark { width: 39px; height: 39px; }
  .brand-copy strong { font-size: 0.86rem; }
  .call-link { font-size: 0; width: 42px; padding: 0; }
  .call-link::after { content: "Call"; font-size: 0.72rem; }
  h1 { font-size: 2.5rem; }
  .speedometer { margin-top: 8px; }
  .go-button { width: 102px; height: 102px; top: 57%; }
  .go-ring { inset: 7px; }
  .go-text { font-size: 1.55rem; }
  .live-reading { bottom: 0; }
  .live-reading strong { font-size: 2rem; }
  .scale-row { font-size: 0.58rem; padding: 0 3px; }
  .metric-icon { width: 31px; height: 31px; flex-basis: 31px; border-radius: 10px; }
  .metric-card { gap: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}




/* SEO content, plan sidebar and enhanced standalone speed-test page */
.site-nav-links a.active,.site-mobile-menu a.active{color:#1A6FE8;font-weight:850}
.breadcrumb{width:100%;display:flex;align-items:center;gap:9px;padding:18px 0 0;color:#91A0C2;font-size:.79rem}
.breadcrumb a{color:#CDE9FF;text-decoration:none}.breadcrumb a:hover{text-decoration:underline}
.hero{padding-top:42px}.hero-copy{max-width:930px}.hero-copy h1{font-size:clamp(2.25rem,5.2vw,4.35rem);line-height:1.02}
.seo-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:28px;align-items:start;padding:12px 0 92px}
.seo-article{min-width:0}.content-section{margin-bottom:22px;padding:34px;border:1px solid var(--line);border-radius:24px;background:rgba(13,20,43,.82);box-shadow:0 16px 48px rgba(0,0,0,.16)}
.content-section h2{margin-bottom:18px;font-size:clamp(1.65rem,3vw,2.45rem)}.content-section h3{font-size:1.02rem}.content-section p,.content-section li{color:#B2BEDA;line-height:1.75;font-size:.94rem}.content-section p:first-of-type{margin-top:0}.content-section p:last-child{margin-bottom:0}
.quick-links{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}.quick-links a{padding:9px 12px;border:1px solid var(--line-strong);border-radius:999px;color:#DFF8FF;background:rgba(40,215,255,.055);text-decoration:none;font-size:.76rem;font-weight:800}.quick-links a:hover{border-color:rgba(40,215,255,.55)}
.definition-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.definition-grid article{padding:22px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.018)}.definition-grid article>span{width:39px;height:39px;display:grid;place-items:center;margin-bottom:14px;border-radius:11px;background:rgba(40,215,255,.09);color:var(--cyan);font-weight:900}.definition-grid h3{margin:0 0 8px}.definition-grid p{margin:0;font-size:.86rem}
.table-wrap{width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:17px}.guide-table{min-width:690px;background:rgba(5,10,23,.4)}.guide-table th{background:rgba(40,215,255,.05);color:#DFF8FF}.guide-table td{color:#AAB7D5;line-height:1.55}.content-note{margin-top:16px!important;padding:15px 17px;border-left:3px solid var(--cyan);border-radius:0 12px 12px 0;background:rgba(40,215,255,.055)}
.step-list{counter-reset:steps;list-style:none;margin:0;padding:0;display:grid;gap:12px}.step-list li{position:relative;padding:16px 16px 16px 58px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.015)}.step-list li::before{counter-increment:steps;content:counter(steps);position:absolute;left:15px;top:15px;width:29px;height:29px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(135deg,var(--cyan),var(--blue));color:#07101F;font-size:.75rem;font-weight:900}
.comparison-box{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:20px}.comparison-box>div{padding:20px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.015)}.comparison-box h3{margin:0 0 8px;color:#F4F7FF}.comparison-box p{margin:0;font-size:.83rem}
.check-list{list-style:none;margin:0;padding:0;display:grid;gap:11px}.check-list li{position:relative;padding-left:31px}.check-list li::before{content:'✓';position:absolute;left:0;top:2px;width:21px;height:21px;display:grid;place-items:center;border-radius:50%;background:rgba(60,230,168,.11);color:var(--green);font-weight:900;font-size:.72rem}
.local-link-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:21px}.local-link-grid a{padding:14px 15px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.015);color:#DDF7FF;text-decoration:none;font-size:.84rem;font-weight:750}.local-link-grid a:hover{border-color:rgba(40,215,255,.5);background:rgba(40,215,255,.05)}
.faq-list{display:grid;gap:11px;margin-top:23px}.faq-item{border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.015);overflow:hidden}.faq-item summary{position:relative;padding:18px 48px 18px 18px;color:#F4F7FF;font-size:.91rem;font-weight:800;cursor:pointer;list-style:none}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary::after{content:'+';position:absolute;right:18px;top:50%;transform:translateY(-50%);color:var(--cyan);font-size:1.35rem}.faq-item[open] summary::after{content:'−'}.faq-item div{padding:0 18px 18px}.faq-item p{margin:0;font-size:.87rem}
.plan-sidebar{position:sticky;top:88px;display:grid;gap:16px}.sidebar-card{border:1px solid var(--line-strong);border-radius:22px;background:linear-gradient(180deg,rgba(18,28,58,.96),rgba(8,14,30,.97));box-shadow:0 22px 58px rgba(0,0,0,.28);overflow:hidden}.buy-plans-card{padding:23px}.sidebar-kicker{display:inline-flex;padding:6px 10px;border-radius:999px;background:rgba(40,215,255,.1);color:var(--cyan);font-size:.69rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.buy-plans-card h2{margin:13px 0 8px;font-size:1.45rem}.buy-plans-card>p{margin:0 0 17px;color:var(--muted);font-size:.82rem;line-height:1.6}
.sidebar-plan{position:relative;display:grid;grid-template-columns:1fr auto;gap:5px 10px;margin-bottom:11px;padding:16px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.022);color:var(--text);text-decoration:none}.sidebar-plan:hover{border-color:rgba(40,215,255,.55);transform:translateY(-1px)}.sidebar-plan span:not(.popular-badge){display:flex;flex-direction:column;gap:5px}.sidebar-plan strong{font-size:.94rem}.sidebar-plan small{color:var(--muted);font-size:.67rem;font-style:normal}.sidebar-plan b{font-size:1rem;color:#fff}.sidebar-plan b small{margin-left:2px}.sidebar-plan em{grid-column:1/-1;margin-top:7px;padding:8px;border-radius:9px;background:linear-gradient(135deg,var(--cyan),var(--blue));color:#06101E;text-align:center;font-size:.72rem;font-weight:900;font-style:normal}.sidebar-plan.popular{margin-top:18px;border-color:rgba(181,100,255,.45)}.popular-badge{position:absolute;left:13px;top:-12px;padding:4px 8px;border-radius:999px;background:var(--purple);color:#fff;font-size:.61rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase}
.buy-plans-card ul{margin:18px 0;padding:0;list-style:none;display:grid;gap:8px}.buy-plans-card li{position:relative;padding-left:22px;color:#AAB7D5;font-size:.75rem}.buy-plans-card li::before{content:'✓';position:absolute;left:0;color:var(--green);font-weight:900}.sidebar-call,.sidebar-all-plans{display:flex;align-items:center;justify-content:center;text-decoration:none;font-weight:850}.sidebar-call{min-height:45px;border-radius:12px;background:#E1192D;color:#fff}.sidebar-all-plans{margin-top:12px;color:#CDEFFF;font-size:.76rem}.help-card,.guide-links-card{padding:20px}.help-card h3,.guide-links-card h3{margin:0 0 9px}.help-card p{margin:0 0 14px;color:var(--muted);font-size:.8rem;line-height:1.55}.help-card a{color:var(--cyan);font-size:.8rem;font-weight:850}.guide-links-card{display:grid;gap:9px}.guide-links-card h3{margin-bottom:3px}.guide-links-card a{color:#C7D4F1;text-decoration:none;font-size:.78rem}.guide-links-card a:hover{color:var(--cyan)}
.history-section{padding-bottom:84px}
footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:24px}footer strong{color:#EAF0FF}footer div>p{margin-top:7px}footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:13px}footer nav a{color:#9BAACB;text-decoration:none}footer nav a:hover{color:var(--cyan)}.footer-meta{text-align:right}
@media(max-width:1040px){.seo-layout{grid-template-columns:1fr}.plan-sidebar{position:static;grid-template-columns:repeat(3,1fr);align-items:start}.buy-plans-card{grid-column:span 2}.comparison-box{grid-template-columns:1fr}.site-nav-links{display:none}}
@media(max-width:760px){.content-section{padding:24px 18px;border-radius:19px}.definition-grid,.local-link-grid{grid-template-columns:1fr}.plan-sidebar{grid-template-columns:1fr}.buy-plans-card{grid-column:auto}.seo-layout{gap:20px;padding-bottom:64px}.breadcrumb{padding-top:13px}.hero{padding-top:35px}.hero-copy h1{font-size:2.35rem}footer{grid-template-columns:1fr}footer nav{justify-content:flex-start}.footer-meta{text-align:left}}
@media(max-width:420px){.hero-copy h1{font-size:2.05rem}.content-section{padding:22px 15px}.quick-links a{font-size:.7rem}.sidebar-plan{padding:14px}}

/* =====================================================
   HOMEPAGE-MATCHING SPEED TEST HEADER
   Fixes the standalone page header classes and keeps the
   navigation consistent with the main Fiber Link website.
   ===================================================== */
.site-header{
  position:sticky;
  top:0;
  z-index:200;
  width:100%;
  min-height:0;
  margin:0;
  display:block;
  color:#0f172a;
  background:rgba(255,255,255,.97);
  border-bottom:1px solid #e2e8f0;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:0 2px 12px rgba(15,23,42,.05);
}
.site-nav-container{
  width:min(1180px,calc(100% - 40px));
  margin:0 auto;
}
.site-nav-wrap{
  min-height:66px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}
.site-logo{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#1a6fe8;
  text-decoration:none;
}
.site-logo-box{
  width:54px;
  height:54px;
  flex:0 0 54px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.site-logo-box img{
  width:54px;
  height:54px;
  object-fit:contain;
  display:block;
}
.site-logo-copy{
  display:flex;
  flex-direction:column;
  line-height:1.08;
  white-space:nowrap;
}
.site-logo-copy strong{
  color:#1a6fe8;
  font-size:17px;
  font-weight:800;
  letter-spacing:-.3px;
}
.site-logo-copy small{
  margin-top:3px;
  color:#64748b;
  font-size:10px;
  font-weight:600;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.site-nav-links{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:24px;
}
.site-nav-links a{
  position:relative;
  padding:23px 0 21px;
  color:#475569;
  text-decoration:none;
  font-size:14px;
  font-weight:650;
  line-height:1;
  white-space:nowrap;
  transition:color .2s ease;
}
.site-nav-links a:hover,
.site-nav-links a.active{
  color:#1a6fe8;
}
.site-nav-links a.active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:3px;
  border-radius:3px 3px 0 0;
  background:#1a6fe8;
}
.site-nav-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:10px;
}
.site-call-link{
  display:inline-flex;
  align-items:center;
  min-height:42px;
  color:#1a6fe8;
  text-decoration:none;
  font-size:14px;
  font-weight:800;
  white-space:nowrap;
}
.site-connect-link{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border-radius:10px;
  color:#fff;
  background:#1a6fe8;
  box-shadow:0 4px 16px rgba(26,111,232,.28);
  text-decoration:none;
  font-size:14px;
  font-weight:750;
  white-space:nowrap;
  transition:background .2s ease,transform .2s ease;
}
.site-connect-link:hover{
  color:#fff;
  background:#155fc8;
  transform:translateY(-1px);
}
.site-menu-toggle{
  width:42px;
  height:42px;
  padding:9px;
  display:none;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  border:0;
  border-radius:9px;
  color:#0f172a;
  background:transparent;
  cursor:pointer;
}
.site-menu-toggle span{
  width:23px;
  height:2px;
  display:block;
  border-radius:2px;
  background:#0f172a;
}
.site-mobile-menu{
  display:none;
  padding:8px 0 15px;
  border-top:1px solid #e2e8f0;
  background:#fff;
}
.site-mobile-menu.open{
  display:flex;
  flex-direction:column;
}
.site-mobile-menu a{
  padding:11px 4px;
  border-bottom:1px solid #eef2f7;
  color:#475569;
  text-decoration:none;
  font-size:15px;
  font-weight:650;
}
.site-mobile-menu a:last-child{border-bottom:0}
.site-mobile-menu a:hover,
.site-mobile-menu a.active{color:#1a6fe8}

@media(max-width:1100px){
  .site-nav-links{gap:15px}
  .site-nav-links a{font-size:13px}
  .site-call-link{display:none}
}
@media(max-width:900px){
  .site-nav-container{width:min(100% - 28px,1180px)}
  .site-nav-links,.site-nav-actions{display:none}
  .site-menu-toggle{display:flex}
}
@media(max-width:480px){
  .site-nav-wrap{min-height:62px}
  .site-logo-box,.site-logo-box img{width:49px;height:49px}
  .site-logo-box{flex-basis:49px}
  .site-logo-copy strong{font-size:16px}
}


/* =====================================================
   COLORFUL LIGHT THEME
   Fast local Roboto-style stack: no external font request.
   ===================================================== */
:root {
  --bg: #eef4ff;
  --bg-deep: #e4ecff;
  --bg-elevated: rgba(255, 255, 255, 0.92);
  --panel: #ffffff;
  --panel-solid: #ffffff;
  --surface: #ffffff;
  --surface-soft: #f5f8ff;
  --surface-tint: #edf3ff;
  --line: #d8e2f5;
  --line-strong: #b9c9e7;
  --text: #162039;
  --muted: #61708e;
  --cyan: #08a9e6;
  --blue: #4f46e5;
  --purple: #9333ea;
  --green: #0aa66f;
  --orange: #f97316;
  --danger: #dc3150;
  --accent: #4f46e5;
  --accent-2: #08a9e6;
  --accent-3: #9333ea;
  --accent-contrast: #ffffff;
  --header-bg: rgba(255, 255, 255, 0.88);
  --soft-fill: rgba(79, 70, 229, 0.055);
  --active-fill: rgba(79, 70, 229, 0.11);
  --shadow: 0 24px 70px rgba(50, 72, 130, 0.16);
  --shadow-soft: 0 10px 30px rgba(50, 72, 130, 0.10);
  --chart-grid: rgba(79, 70, 229, 0.12);
  --chart-line: #4f46e5;
  --chart-line-soft: #08a9e6;
  color-scheme: light;
  font-family: Roboto, Arial, Helvetica, "Segoe UI", sans-serif;
}


html { background: var(--bg); }
body,
button,
input,
textarea,
select {
  font-family: Roboto, Arial, Helvetica, "Segoe UI", sans-serif;
}
body {
  background:
    radial-gradient(circle at 5% 5%, color-mix(in srgb, var(--cyan) 18%, transparent), transparent 30%),
    radial-gradient(circle at 95% 8%, color-mix(in srgb, var(--purple) 16%, transparent), transparent 31%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-deep) 100%);
  color: var(--text);
  transition: background .28s ease, color .2s ease;
}
.background-orb { display: block; opacity: .10; }
.orb-one { background: var(--cyan); }
.orb-two { background: var(--purple); }
::selection { color: #fff; background: var(--accent); }

.site-header {
  color: var(--text);
  background: var(--header-bg);
  border-color: var(--line);
  box-shadow: 0 4px 24px rgba(36, 54, 99, .08);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.site-logo { color: var(--text); }
.site-logo-box {
  background: linear-gradient(145deg, color-mix(in srgb, var(--cyan) 17%, var(--surface)), color-mix(in srgb, var(--purple) 13%, var(--surface)));
  border-color: color-mix(in srgb, var(--cyan) 35%, var(--line));
  box-shadow: 0 8px 22px color-mix(in srgb, var(--blue) 15%, transparent);
}
.site-logo-box img { filter: none; }
.site-logo-copy strong { color: var(--text); }
.site-logo-copy small { color: var(--blue); opacity: 1; }
.site-nav-links a,
.site-call-link,
.site-mobile-menu a { color: var(--muted); }
.site-nav-links a:hover,
.site-nav-links a.active,
.site-mobile-menu a:hover,
.site-mobile-menu a.active,
.site-call-link:hover { color: var(--blue); }
.site-nav-links a.active::after { background: linear-gradient(90deg, var(--cyan), var(--blue), var(--purple)); }
.site-call-link {
  border-color: color-mix(in srgb, var(--cyan) 36%, var(--line));
  background: color-mix(in srgb, var(--cyan) 9%, var(--surface));
}
.site-connect-link {
  color: #fff;
  background: linear-gradient(135deg, var(--blue), var(--purple));
  box-shadow: 0 9px 24px color-mix(in srgb, var(--blue) 28%, transparent);
}
.site-connect-link:hover { color: #fff; filter: brightness(1.06); }
.site-mobile-menu { background: var(--surface); border-color: var(--line); box-shadow: var(--shadow); }
.site-mobile-menu a { border-color: var(--line); }
.site-menu-toggle { color: var(--text); }
.site-menu-toggle span { background: var(--text); }

.site-menu-toggle:focus-visible,
a:focus-visible,
button:focus-visible { outline: 3px solid color-mix(in srgb, var(--cyan) 60%, #fff); outline-offset: 3px; }

.breadcrumb,
.breadcrumb a,
.hero-copy > p:last-child,
.content-section p,
.content-section li,
.progress-copy,
.connection-label,
.go-subtext,
.live-reading span,
.metric-card span,
.metric-card small,
.chart-heading span,
.buy-plans-card > p,
.help-card p,
.sidebar-plan small,
.buy-plans-card li,
footer,
footer nav a { color: var(--muted); }
.eyebrow,
.stage-label,
.text-button,
.help-card a,
.guide-links-card a:hover,
.sidebar-all-plans { color: var(--blue); }
.eyebrow { text-shadow: 0 7px 24px color-mix(in srgb, var(--blue) 18%, transparent); }
h1 {
  background: linear-gradient(105deg, var(--text) 8%, var(--blue) 52%, var(--purple) 88%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.test-shell,
.content-section,
.sidebar-card,
.history-table-wrap,
.tips-grid article {
  background: var(--bg-elevated);
  border-color: var(--line-strong);
  box-shadow: var(--shadow);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.test-shell { overflow: hidden; }
.test-shell::before { height: 4px; background: linear-gradient(90deg, var(--cyan), var(--blue), var(--purple), var(--orange)); opacity: 1; }
.connection-bar,
.result-grid,
.chart-panel,
.metric-card,
.history-table-wrap,
.table-wrap { border-color: var(--line); }
.connection-bar {
  background: linear-gradient(90deg, color-mix(in srgb, var(--cyan) 6%, var(--surface)), color-mix(in srgb, var(--purple) 5%, var(--surface)));
}
.metric-card,
.definition-grid article,
.comparison-box > div,
.step-list li,
.local-link-grid a,
.faq-item,
.sidebar-plan { background: var(--soft-fill); }
.connection-bar strong,
.metric-card strong,
.metric-card.complete strong,
.content-section h2,
.content-section h3,
.comparison-box h3,
.faq-item summary,
.sidebar-plan b,
footer strong { color: var(--text); }

.meter-track { stroke: color-mix(in srgb, var(--blue) 13%, var(--line)); }
.meter-progress { stroke: url(#meterGradient); filter: url(#meterGlow); }
.ticks line { stroke: var(--line-strong); }
.ticks line.major { stroke: color-mix(in srgb, var(--blue) 60%, var(--text)); }
.go-button {
  border-color: color-mix(in srgb, var(--cyan) 75%, #fff);
  color: #fff;
  background:
    radial-gradient(circle at 48% 30%, rgba(255,255,255,.20), transparent 38%),
    linear-gradient(145deg, var(--cyan), var(--blue) 52%, var(--purple));
  box-shadow: 0 0 0 11px color-mix(in srgb, var(--cyan) 8%, transparent), 0 20px 55px color-mix(in srgb, var(--blue) 30%, transparent);
}
.go-button:hover { box-shadow: 0 0 0 14px color-mix(in srgb, var(--cyan) 12%, transparent), 0 24px 70px color-mix(in srgb, var(--purple) 30%, transparent); }
.go-button.complete {
  border-color: var(--green);
  background: linear-gradient(145deg, var(--green), var(--cyan));
  box-shadow: 0 0 0 11px color-mix(in srgb, var(--green) 9%, transparent), 0 20px 55px color-mix(in srgb, var(--green) 24%, transparent);
}
.go-ring { border-color: rgba(255,255,255,.35); }
.go-subtext { color: rgba(255,255,255,.78); }
.scale-row { color: var(--muted); }
.metric-icon,
.definition-grid article > span {
  color: #fff;
  border-color: transparent;
  box-shadow: 0 8px 20px rgba(47, 66, 130, .15);
}
.ping-card .metric-icon { background: linear-gradient(135deg, var(--orange), #ffbe3d); }
.jitter-card .metric-icon { background: linear-gradient(135deg, var(--purple), #e879f9); }
.download-card .metric-icon { background: linear-gradient(135deg, var(--cyan), var(--blue)); }
.upload-card .metric-icon { background: linear-gradient(135deg, var(--green), var(--cyan)); }
.metric-card.active { background: linear-gradient(180deg, color-mix(in srgb, var(--cyan) 9%, var(--surface)), color-mix(in srgb, var(--purple) 5%, var(--surface))); }
.metric-card.active .metric-icon { box-shadow: 0 0 30px color-mix(in srgb, var(--cyan) 30%, transparent); }

.primary-button,
.step-list li::before,
.sidebar-call {
  color: #fff;
  background: linear-gradient(135deg, var(--blue), var(--purple));
  box-shadow: 0 12px 30px color-mix(in srgb, var(--blue) 22%, transparent);
}
.sidebar-plan em {
  color: #fff;
  background: linear-gradient(135deg, var(--green), var(--cyan));
  box-shadow: none;
}
.secondary-button {
  color: var(--blue);
  background: color-mix(in srgb, var(--blue) 8%, var(--surface));
  border-color: color-mix(in srgb, var(--blue) 30%, var(--line));
}
.primary-button:hover,
.secondary-button:hover,
.sidebar-call:hover,
.sidebar-plan em:hover { filter: brightness(1.06); }
.error-message {
  color: var(--danger);
  background: color-mix(in srgb, var(--danger) 8%, var(--surface));
  border-color: color-mix(in srgb, var(--danger) 32%, var(--line));
}

.quick-links a,
.local-link-grid a,
.guide-links-card a,
.breadcrumb a { color: var(--blue); }
.quick-links a {
  background: color-mix(in srgb, var(--blue) 6%, var(--surface));
  border-color: color-mix(in srgb, var(--blue) 20%, var(--line));
}
.quick-links a:hover,
.local-link-grid a:hover,
.sidebar-plan:hover { border-color: var(--blue); background: var(--active-fill); }
.guide-table { background: var(--surface); }
.guide-table th { color: var(--text); background: linear-gradient(90deg, color-mix(in srgb, var(--cyan) 7%, var(--surface)), color-mix(in srgb, var(--purple) 6%, var(--surface))); }
.guide-table td { color: var(--muted); }
.content-note { border-color: var(--blue); background: color-mix(in srgb, var(--blue) 7%, var(--surface)); }
.check-list li::before { color: #fff; background: linear-gradient(135deg, var(--green), var(--cyan)); }
.faq-item { border-color: var(--line); }
.faq-item[open] { border-color: color-mix(in srgb, var(--blue) 38%, var(--line)); background: color-mix(in srgb, var(--blue) 6%, var(--surface)); }
.faq-item summary::after { color: var(--blue); }
.sidebar-kicker,
.popular-badge {
  color: #fff;
  background: linear-gradient(135deg, var(--orange), var(--purple));
}
.sidebar-plan.popular { border-color: color-mix(in srgb, var(--purple) 52%, var(--line)); box-shadow: 0 10px 30px color-mix(in srgb, var(--purple) 10%, transparent); }
.buy-plans-card li::before { color: var(--green); }

footer { border-color: var(--line); }
footer nav a:hover { color: var(--blue); }
.noscript-message { color: #fff; background: linear-gradient(135deg, var(--blue), var(--purple)); }

@media (max-width: 900px) {
}

@media (max-width: 480px) {
  .site-nav-container { width: min(100% - 22px, 1180px); }
}

/* Keep navigation usable on tablets where desktop links no longer fit. */
@media (max-width: 1040px) {
  .site-nav-links,
  .site-nav-actions { display: none; }
  .site-menu-toggle { display: flex; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}