/* =============================================================================
   PEERYX — peeryx-v200-design-system.css
   Master design system overlay — loads LAST, highest specificity
   Premium B2B network operator / Anti-DDoS provider aesthetic
   ============================================================================= */

/* ─── 1. DESIGN TOKENS ──────────────────────────────────────────────── */
:root {
  /* Brand palette */
  --ds-bg-0:          #020911;   /* deepest background */
  --ds-bg-1:          #040e1f;   /* section surface */
  --ds-bg-2:          #071526;   /* card surface */
  --ds-bg-3:          #0c1d38;   /* elevated card */
  --ds-blue:          #1848c4;   /* primary blue */
  --ds-blue-lt:       #2d64e0;
  --ds-blue-glow:     rgba(24,72,196,0.22);
  --ds-cyan:          #17d4f5;   /* accent cyan */
  --ds-cyan-dk:       #0eb8d8;
  --ds-teal:          #00d9a0;   /* accent teal / clean traffic */
  --ds-teal-dk:       #00b895;
  --ds-red-attack:    #ff3d50;   /* attack / DDoS — limited use */
  --ds-white:         #f0f6ff;
  --ds-text:          #c8daf0;
  --ds-muted:         #6e8fad;
  --ds-muted-lt:      #8faac5;
  --ds-border:        rgba(255,255,255,0.07);
  --ds-border-md:     rgba(255,255,255,0.11);
  --ds-border-blue:   rgba(24,100,224,0.28);

  /* Typography */
  --ds-font-h:   'Sora', system-ui, -apple-system, sans-serif;
  --ds-font-b:   'Hanken Grotesk', 'Inter', system-ui, sans-serif;
  --ds-font-mono:'JetBrains Mono', 'Fira Code', monospace;

  /* Radius / spacing */
  --ds-radius:    14px;
  --ds-radius-sm: 8px;
  --ds-radius-lg: 20px;
  --ds-gap:       clamp(20px, 2.5vw, 36px);
  --ds-section-v: clamp(72px, 8vw, 108px);

  /* Shadows */
  --ds-shadow-card:  0 2px 16px rgba(0,0,0,.32), 0 0 0 1px rgba(255,255,255,.055);
  --ds-shadow-blue:  0 12px 36px rgba(24,72,196,.28);
  --ds-shadow-glow:  0 0 32px rgba(0,217,160,.18);

  /* Override teal CTA vars used by v120/v129/v130 */
  --px120-cta-bg:    #1848c4;
  --px120-cta-hover: #2056d8;
  --px120-teal:      #1848c4;
  --v99-grad: linear-gradient(135deg,#0f36a8,#1848c4);
  --p15-teal: #1848c4;

  /* Override teal link vars used by v95 — change all inline links to blue */
  --px20-link:            rgba(100,155,240,.88);
  --px16-link:            rgba(110,160,242,.85);
  --b33-muted:            rgba(100,150,230,.80);
}

/* ─── 2. GLOBAL BASE OVERRIDES ──────────────────────────────────────── */
html body {
  background: var(--ds-bg-0) !important;
  color: var(--ds-text) !important;
  font-family: var(--ds-font-b) !important;
}
html body * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  box-sizing: border-box;
}

/* ─── 3. SKIP LINK (accessibility) ─────────────────────────────────── */
.px-skip-link {
  position: absolute;
  top: -100px;
  left: 16px;
  z-index: 99999;
  background: var(--ds-blue);
  color: #fff;
  padding: 8px 16px;
  border-radius: 0 0 8px 8px;
  font-weight: 700;
  text-decoration: none;
  font-size: 13px;
  transition: top .2s;
}
.px-skip-link:focus { top: 0; }

/* ─── 4. NAVBAR / HEADER — PREMIUM OVERRIDE ────────────────────────── */

/* Overall header */
html body .site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 9500 !important;
  background: rgba(5,10,20,.97) !important;
  backdrop-filter: blur(20px) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.1) !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.04), 0 2px 24px rgba(0,0,0,.32) !important;
}

/* Subtle top accent line — blue steel, not cyan neon */
html body .site-header::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent 0%, rgba(60,110,220,.45) 50%, transparent 100%) !important;
  pointer-events: none !important;
}

/* Header inner layout */
html body .site-header .container.header-inner {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center !important;
  gap: 24px !important;
  min-height: 64px !important;
  max-width: 1440px !important;
  width: min(100% - 40px, 1440px) !important;
  margin-inline: auto !important;
  padding: 0 !important;
  overflow: visible !important;
}

/* ── Brand / Logo ── */
html body .site-header .brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}
/* brand-mark = icon container (now uses peeryx-logo-mark.webp, square icon) */
html body .site-header .brand-mark {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(8,18,42,.95) !important;
  border: 1px solid rgba(82,120,200,.28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
  overflow: hidden !important;
}
html body .site-header .brand-mark img {
  width: 26px !important;
  height: 26px !important;
  object-fit: contain !important;
  display: block !important;
}
/* Match v113 specificity: html body .site-header .brand .brand-copy — 4 classes */
html body .site-header .brand .brand-copy {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}
html body .site-header .brand-name {
  color: #f0f5ff !important;
  -webkit-text-fill-color: #f0f5ff !important;
  background: none !important;
  font-size: 15.5px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  line-height: 1.1 !important;
}
html body .site-header .brand-sub {
  display: block !important;
  color: rgba(130,160,195,.55) !important;
  -webkit-text-fill-color: rgba(130,160,195,.55) !important;
  font-size: 8px !important;
  letter-spacing: .32em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  margin-top: 2px !important;
  line-height: 1 !important;
}

/* ── Desktop nav pill ── */
html body .site-header .desktop-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 1px !important;
  padding: 4px 5px !important;
  border-radius: 100px !important;
  background: rgba(8,16,36,.6) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
}
html body .site-header .desktop-nav .nav-link {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 7px 14px !important;
  border-radius: 100px !important;
  color: rgba(190,210,235,.75) !important;
  -webkit-text-fill-color: rgba(190,210,235,.75) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .005em !important;
  line-height: 1 !important;
  text-decoration: none !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  white-space: nowrap !important;
  transition: color .15s ease, background .15s ease !important;
}
/* Kill ALL pseudo-elements from legacy CSS — explicit active overrides below */
html body .site-header .desktop-nav .nav-link::before,
html body .site-header .desktop-nav .nav-link::after,
html body .site-header .desktop-nav .nav-link:hover::before,
html body .site-header .desktop-nav .nav-link:hover::after,
html body .site-header .desktop-nav .nav-link.active::before,
html body .site-header .desktop-nav .nav-link.active::after,
html body .site-header .desktop-nav .nav-link[aria-current]::before,
html body .site-header .desktop-nav .nav-link[aria-current]::after {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
}
html body .site-header .desktop-nav .nav-link:hover {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: rgba(255,255,255,.06) !important;
}
html body .site-header .desktop-nav .nav-link.active,
html body .site-header .desktop-nav .nav-link[aria-current="page"] {
  color: #f0f5ff !important;
  -webkit-text-fill-color: #f0f5ff !important;
  background: rgba(30,65,180,.3) !important;
  box-shadow: none !important;
}

/* ── Header actions (right side) ── */
html body .site-header .header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
  justify-content: flex-end !important;
}

/* Account login link (subtle ghost) */
html body .site-header .account-link-login {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 14px !important;
  height: 36px !important;
  border-radius: 8px !important;
  color: rgba(180,205,235,.7) !important;
  -webkit-text-fill-color: rgba(180,205,235,.7) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  white-space: nowrap !important;
  transition: all .15s !important;
  line-height: 1 !important;
}
html body .site-header .account-link-login:hover {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: rgba(255,255,255,.06) !important;
  border-color: rgba(255,255,255,.16) !important;
}

/* Primary CTA — solid blue, no teal
   Specificity must beat v120's html body .site-header .account-link.account-link-register (0,3,2)
   We match that selector + add the <a> variant = (0,3,2) loading after v120 wins */
html body .site-header .account-link.account-link-register,
html body .site-header a.account-link-register,
html body .site-header .account-link-register {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 18px !important;
  height: 36px !important;
  border-radius: 8px !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
  text-decoration: none !important;
  background: #1848c4 !important;
  border: 1px solid rgba(100,140,240,.35) !important;
  box-shadow: 0 2px 12px rgba(24,72,196,.28), inset 0 1px 0 rgba(255,255,255,.10) !important;
  white-space: nowrap !important;
  transition: background .18s, box-shadow .18s, transform .18s !important;
  line-height: 1 !important;
}
html body .site-header .account-link.account-link-register:hover,
html body .site-header a.account-link-register:hover,
html body .site-header .account-link-register:hover {
  background: #2056d8 !important;
  box-shadow: 0 4px 20px rgba(24,72,196,.42) !important;
  transform: translateY(-1px) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Mobile toggle */
html body .site-header .mobile-toggle {
  display: none !important;
  width: 40px !important;
  height: 40px !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  gap: 5px !important;
  background: rgba(8,16,32,.6) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 10px !important;
  cursor: pointer !important;
  padding: 0 !important;
  flex-shrink: 0 !important;
}
html body .site-header .mobile-toggle span {
  display: block !important;
  width: 20px !important;
  height: 2px !important;
  background: rgba(200,218,240,.85) !important;
  border-radius: 2px !important;
  transition: all .25s ease !important;
}

/* Locale switcher */
html body .site-header .locale-switcher {
  position: relative !important;
  flex-shrink: 0 !important;
}
html body .site-header .locale-trigger {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 8px 10px !important;
  height: 36px !important;
  border-radius: 10px !important;
  background: rgba(8,16,32,.6) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  color: rgba(200,218,240,.75) !important;
  -webkit-text-fill-color: rgba(200,218,240,.75) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  cursor: pointer !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
html body .site-header .locale-trigger svg {
  width: 13px !important;
  height: 13px !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2 !important;
  opacity: .65 !important;
}
html body .site-header .locale-menu {
  position: absolute !important;
  right: 0 !important;
  top: calc(100% + 8px) !important;
  min-width: 200px !important;
  background: rgba(4,12,26,.98) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 14px !important;
  padding: 8px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.55) !important;
  z-index: 9900 !important;
}
html body .site-header .locale-menu a {
  display: flex !important;
  align-items: center !important;
  padding: 9px 12px !important;
  border-radius: 8px !important;
  color: rgba(200,218,240,.8) !important;
  -webkit-text-fill-color: rgba(200,218,240,.8) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  background: transparent !important;
  transition: all .15s !important;
}
html body .site-header .locale-menu a:hover,
html body .site-header .locale-menu a.active {
  background: rgba(24,72,196,.18) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Mobile nav drawer */
html body .site-header .mobile-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0; right: 0; bottom: 0 !important;
  background: rgba(3,9,18,.97) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  z-index: 9400 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow-y: auto !important;
  padding: 80px 0 40px !important;
  transform: translateX(100%) !important;
  transition: transform .3s cubic-bezier(.4,0,.2,1) !important;
}
html body .site-header .mobile-nav[data-open="true"] {
  transform: translateX(0) !important;
}
html body .site-header .mobile-nav .nav-link {
  display: flex !important;
  align-items: center !important;
  padding: 16px 24px !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  color: rgba(200,218,240,.85) !important;
  -webkit-text-fill-color: rgba(200,218,240,.85) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  background: transparent !important;
  transition: all .15s !important;
}
html body .site-header .mobile-nav .nav-link:hover,
html body .site-header .mobile-nav .nav-link.active {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: rgba(24,72,196,.12) !important;
}
html body .site-header .mobile-nav .mobile-demo-link {
  margin: 20px 24px 0 !important;
  width: calc(100% - 48px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px 24px !important;
  background: linear-gradient(135deg, #1848c4, #0eb8d8) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  border: 1px solid rgba(23,212,245,.25) !important;
  box-shadow: 0 8px 28px rgba(24,72,196,.35) !important;
}
html body .site-header .mobile-account-actions {
  display: flex !important;
  gap: 10px !important;
  padding: 16px 24px !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
  margin-top: 8px !important;
}
html body .site-header .mobile-account-actions .account-link {
  flex: 1 !important;
  text-align: center !important;
  padding: 12px !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
html body .site-header .mobile-account-actions .account-link-login {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  color: rgba(200,218,240,.8) !important;
  -webkit-text-fill-color: rgba(200,218,240,.8) !important;
}
html body .site-header .mobile-account-actions .account-link-register {
  background: linear-gradient(135deg, #1848c4, #0eb8d8) !important;
  border: none !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Responsive nav breakpoints — single breakpoint 1100px, no overlap zone */
@media (min-width: 1101px) {
  html body .site-header .desktop-nav        { display: flex !important; }
  html body .site-header .mobile-toggle      { display: none !important; }
  html body .site-header .account-link-login { display: flex !important; }
  html body .site-header .account-link-register { display: flex !important; }
}
@media (max-width: 1100px) {
  html body .site-header .container.header-inner {
    grid-template-columns: auto auto !important;
    gap: 12px !important;
  }
  html body .site-header .desktop-nav           { display: none !important; }
  html body .site-header .account-link-login    { display: none !important; }
  html body .site-header .account-link-register { display: none !important; }
  html body .site-header .locale-trigger        { min-width: auto !important; }
  html body .site-header .mobile-toggle         { display: flex !important; }
}
@media (max-width: 480px) {
  html body .site-header .locale-trigger { display: none !important; }
  html body .site-header .container.header-inner {
    width: min(100% - 24px, 1440px) !important;
  }
}

/* ─── 5. HERO SECTION — pxv93-hero ─────────────────────────────────── */

html body .pxv93-home .pxv93-hero {
  position: relative !important;
  background: var(--ds-bg-0) !important;
  overflow: hidden !important;
  padding: clamp(80px, 10vw, 120px) 0 clamp(72px, 9vw, 108px) !important;
  min-height: unset !important;
}

/* Hero radial atmosphere */
html body .pxv93-home .pxv93-hero::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(ellipse 55% 70% at 80% 40%, rgba(24,72,196,.18) 0%, transparent 60%),
    radial-gradient(ellipse 45% 60% at 10% 20%, rgba(0,185,155,.08) 0%, transparent 55%),
    radial-gradient(ellipse 80% 40% at 50% 110%, rgba(24,72,196,.07) 0%, transparent 50%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
/* Dot-grid texture */
html body .pxv93-home .pxv93-hero::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: radial-gradient(circle, rgba(255,255,255,.025) 1px, transparent 1px) !important;
  background-size: 32px 32px !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
html body .pxv93-home .pxv93-grid-bg { display: none !important; }

/* Hero layout */
html body .pxv93-home .pxv93-hero-grid {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: clamp(40px, 5vw, 72px) !important;
  align-items: center !important;
}

/* Hero copy */
html body .pxv93-home .pxv93-hero-copy {
  max-width: 580px !important;
}
html body .pxv93-home .pxv93-eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 5px 14px !important;
  border-radius: 100px !important;
  background: rgba(24,72,196,.12) !important;
  border: 1px solid rgba(80,130,230,.28) !important;
  color: rgba(140,175,255,.85) !important;
  font-family: var(--ds-font-mono) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  margin-bottom: 24px !important;
}
html body .pxv93-home .pxv93-hero h1 {
  font-family: var(--ds-font-h) !important;
  font-size: clamp(32px, 4.2vw, 54px) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  letter-spacing: -.025em !important;
  color: #fff !important;
  margin: 0 0 24px !important;
  background: none !important;
  -webkit-text-fill-color: #fff !important;
}
html body .pxv93-home .pxv93-lead {
  font-size: clamp(16px, 1.8vw, 20px) !important;
  line-height: 1.55 !important;
  color: rgba(200,218,240,.85) !important;
  margin: 0 0 12px !important;
  font-weight: 500 !important;
}
html body .pxv93-home .pxv93-text {
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: rgba(180,200,228,.7) !important;
  margin: 0 0 32px !important;
}

/* Hero CTA buttons */
html body .pxv93-home .pxv93-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  align-items: center !important;
  margin-bottom: 36px !important;
}
/* Hero & CTA buttons — all-blue, no teal gradient.
   Must beat v130's html body .pxv93-hero-copy .pxv93-actions a.pxv93-primary (0,3,3).
   Highest selector here: html body .pxv93-home .pxv93-hero-copy .pxv93-actions a.pxv93-btn.pxv93-primary = (0,5,3) */
html body .pxv93-home .pxv93-hero-copy .pxv93-actions a.pxv93-btn.pxv93-primary,
html body .pxv93-home .pxv93-hero-copy .pxv93-actions a.pxv93-primary,
html body .pxv93-home .pxv93-cta-card a.pxv93-btn.pxv93-primary,
html body .pxv93-home .pxv93-cta-card .pxv93-btn.pxv93-primary,
html body .pxv93-home .pxv93-primary,
html body .pxv93-home .pxv93-btn.pxv93-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 14px 28px !important;
  background: linear-gradient(135deg, #0f36a8 0%, #1848c4 50%, #1e58d0 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  border: 1px solid rgba(40,80,200,.5) !important;
  box-shadow: 0 8px 30px rgba(24,72,196,.40), inset 0 1px 0 rgba(255,255,255,.18) !important;
  transition: all .22s ease !important;
  letter-spacing: .005em !important;
  white-space: nowrap !important;
}
html body .pxv93-home .pxv93-hero-copy .pxv93-actions a.pxv93-btn.pxv93-primary:hover,
html body .pxv93-home .pxv93-hero-copy .pxv93-actions a.pxv93-primary:hover,
html body .pxv93-home .pxv93-cta-card a.pxv93-btn.pxv93-primary:hover,
html body .pxv93-home .pxv93-cta-card .pxv93-btn.pxv93-primary:hover,
html body .pxv93-home .pxv93-primary:hover,
html body .pxv93-home .pxv93-btn.pxv93-primary:hover {
  background: linear-gradient(135deg, #1040c0 0%, #1f54d8 50%, #2260e0 100%) !important;
  box-shadow: 0 12px 40px rgba(24,72,196,.55) !important;
  transform: translateY(-2px) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
html body .pxv93-home .pxv93-ghost {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 14px 24px !important;
  background: rgba(255,255,255,.05) !important;
  color: rgba(200,218,240,.9) !important;
  -webkit-text-fill-color: rgba(200,218,240,.9) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  transition: all .2s ease !important;
  white-space: nowrap !important;
}
html body .pxv93-home .pxv93-ghost:hover {
  background: rgba(255,255,255,.09) !important;
  border-color: rgba(255,255,255,.2) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Hero metrics strip */
html body .pxv93-home .pxv93-metrics {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 24px 36px !important;
  padding-top: 28px !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
}
html body .pxv93-home .pxv93-metrics > div {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
html body .pxv93-home .pxv93-metrics i {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 8px !important;
  background: rgba(24,72,196,.14) !important;
  border: 1px solid rgba(60,100,200,.28) !important;
  flex-shrink: 0 !important;
  color: rgba(130,170,255,.9) !important;
}
html body .pxv93-home .pxv93-metrics strong {
  display: block !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  line-height: 1.2 !important;
  font-family: var(--ds-font-mono) !important;
}
html body .pxv93-home .pxv93-metrics span {
  font-size: 11.5px !important;
  color: var(--ds-muted) !important;
  line-height: 1.2 !important;
}

/* ─── 6. HERO NETMAP — network diagram ──────────────────────────────── */

html body .pxv93-home .hero-netmap,
html body .pxv93-home .pxv93-hero-visual {
  position: relative !important;
  background: rgba(5,14,30,.7) !important;
  border: 1px solid rgba(40,80,180,.22) !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 40px rgba(0,0,0,.40), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
html body .pxv93-home .netmap-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  background: rgba(8,16,32,.5) !important;
}
html body .pxv93-home .netmap-live {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--ds-teal) !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  font-family: var(--ds-font-mono) !important;
}
html body .pxv93-home .netmap-live::before {
  content: '' !important;
  display: block !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: var(--ds-teal) !important;
  box-shadow: 0 0 8px var(--ds-teal) !important;
  animation: pulse-dot 2.2s ease-in-out infinite !important;
}
@keyframes pulse-dot {
  0%, 100% { opacity: 1; box-shadow: 0 0 8px var(--ds-teal); }
  50% { opacity: .6; box-shadow: 0 0 14px var(--ds-teal); }
}
html body .pxv93-home .netmap-asn {
  font-size: 10.5px !important;
  font-family: var(--ds-font-mono) !important;
  color: rgba(200,218,240,.45) !important;
  letter-spacing: .04em !important;
}
html body .pxv93-home .netmap-footer {
  padding: 10px 18px !important;
  font-size: 10px !important;
  font-family: var(--ds-font-mono) !important;
  color: rgba(200,218,240,.35) !important;
  border-top: 1px solid rgba(255,255,255,.05) !important;
  letter-spacing: .06em !important;
  background: rgba(4,10,20,.4) !important;
}

/* NOC topology flow */
html body .pxv93-home .netmap-topo {
  display: grid !important;
  grid-template-columns: 1fr auto auto auto 1fr !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 24px 16px !important;
  min-height: 130px !important;
}
html body .pxv93-home .noc-layer {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
html body .pxv93-home .noc-node {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 8px 10px !important;
  border-radius: 8px !important;
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  text-align: center !important;
}
html body .pxv93-home .noc-node-attack {
  background: rgba(255,61,80,.05) !important;
  border-color: rgba(255,61,80,.22) !important;
}
html body .pxv93-home .noc-asn {
  font-size: 10px !important;
  font-family: var(--ds-font-mono) !important;
  font-weight: 700 !important;
  color: rgba(200,218,240,.65) !important;
  letter-spacing: .04em !important;
}
html body .pxv93-home .noc-node-attack .noc-asn {
  color: rgba(255,61,80,.8) !important;
}
html body .pxv93-home .noc-label {
  font-size: 9px !important;
  color: rgba(200,218,240,.35) !important;
  letter-spacing: .04em !important;
}
html body .pxv93-home .noc-arrows,
html body .pxv93-home .noc-arrow-out {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 6px !important;
}
html body .pxv93-home .noc-arrows svg,
html body .pxv93-home .noc-arrow-out svg {
  width: 80px !important;
  height: auto !important;
  flex-shrink: 0 !important;
}
html body .pxv93-home .noc-scrubber {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 14px 16px !important;
  background: rgba(24,72,196,.10) !important;
  border: 1.5px solid rgba(60,110,220,.40) !important;
  border-radius: 12px !important;
  text-align: center !important;
  min-width: 80px !important;
}
html body .pxv93-home .noc-shield-icon svg {
  width: 28px !important;
  height: 32px !important;
}
html body .pxv93-home .noc-scrubber-label {
  font-size: 9.5px !important;
  font-family: var(--ds-font-mono) !important;
  font-weight: 800 !important;
  color: rgba(160,195,255,.95) !important;
  letter-spacing: .1em !important;
  line-height: 1 !important;
}
html body .pxv93-home .noc-scrubber-sub {
  font-size: 8px !important;
  font-family: var(--ds-font-mono) !important;
  color: rgba(120,165,255,.55) !important;
  letter-spacing: .12em !important;
}

/* Netmap metrics bars */
html body .pxv93-home .netmap-metrics {
  padding: 12px 16px !important;
  border-top: 1px solid rgba(255,255,255,.05) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
}
html body .pxv93-home .netmap-metric-row {
  display: grid !important;
  grid-template-columns: 1fr auto auto !important;
  gap: 8px !important;
  align-items: center !important;
}
html body .pxv93-home .netmap-metric-label {
  font-size: 10px !important;
  color: rgba(200,218,240,.5) !important;
  white-space: nowrap !important;
}
html body .pxv93-home .netmap-metric-bar {
  width: 80px !important;
}
html body .pxv93-home .netmap-metric-bar-track {
  height: 3px !important;
  background: rgba(255,255,255,.08) !important;
  border-radius: 3px !important;
  overflow: hidden !important;
}
html body .pxv93-home .netmap-metric-bar-fill {
  height: 100% !important;
  border-radius: 3px !important;
}
html body .pxv93-home .m-total .netmap-metric-bar-fill {
  width: 88% !important;
  background: linear-gradient(90deg, #1848c4, #3d7fff) !important;
}
html body .pxv93-home .m-attack .netmap-metric-bar-fill {
  width: 72% !important;
  background: linear-gradient(90deg, #ff3d50, #ff6b7a) !important;
}
html body .pxv93-home .m-clean .netmap-metric-bar-fill {
  width: 92% !important;
  background: linear-gradient(90deg, #1848c4, #4da8ff) !important;
}
html body .pxv93-home .netmap-metric-value {
  font-size: 9.5px !important;
  font-family: var(--ds-font-mono) !important;
  color: rgba(200,218,240,.55) !important;
  white-space: nowrap !important;
}
html body .pxv93-home .m-clean .netmap-metric-value {
  color: rgba(130,185,255,.85) !important;
}

/* Hero SVG inline color overrides — recolor teal p15-* classes to blue */
html body .pxv93-home .hero-netmap svg .p15-path-clean {
  stroke: rgba(60,120,255,.38) !important;
}
html body .pxv93-home .hero-netmap svg .p15-pkt,
html body .pxv93-home .hero-netmap svg .p15-pkt-2 {
  fill: rgba(70,130,255,.85) !important;
}
html body .pxv93-home .hero-netmap svg .p15-shield-ring {
  stroke: rgba(40,90,210,.20) !important;
}
/* noc-arrows SVG paths (arrows between nodes) */
html body .pxv93-home .noc-arrows svg path,
html body .pxv93-home .noc-arrow-out svg path {
  stroke: rgba(60,120,220,.50) !important;
  fill: rgba(60,120,220,.50) !important;
}

/* ─── 7. HERO RESPONSIVE ─────────────────────────────────────────────── */
@media (max-width: 1024px) {
  html body .pxv93-home .pxv93-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 48px !important;
  }
  html body .pxv93-home .pxv93-hero-copy {
    max-width: 100% !important;
    text-align: center !important;
  }
  html body .pxv93-home .pxv93-actions {
    justify-content: center !important;
  }
  html body .pxv93-home .pxv93-metrics {
    justify-content: center !important;
  }
  html body .pxv93-home .pxv93-hero-copy {
    order: 1 !important;
  }
  html body .pxv93-home .hero-netmap,
  html body .pxv93-home .pxv93-hero-visual {
    order: 2 !important;
    max-width: 560px !important;
    margin: 0 auto !important;
  }
}
@media (max-width: 640px) {
  html body .pxv93-home .pxv93-hero {
    padding: 64px 0 56px !important;
  }
  html body .pxv93-home .pxv93-hero h1 {
    font-size: clamp(26px, 7vw, 36px) !important;
  }
  html body .pxv93-home .pxv93-metrics {
    gap: 16px 24px !important;
  }
  html body .pxv93-home .netmap-topo {
    grid-template-columns: 1fr auto auto !important;
    gap: 6px !important;
    padding: 16px 12px !important;
  }
  html body .pxv93-home .noc-layer-clients { display: none !important; }
  html body .pxv93-home .noc-arrow-out { display: none !important; }
  html body .pxv93-home .noc-arrows svg { width: 52px !important; }
}

/* ─── 8. TRUST BAND ──────────────────────────────────────────────────── */

/* New px-trust-band (from home-premium.php) */
html body .px-trust-band {
  background: rgba(4,12,26,.7) !important;
  border-top: 1px solid rgba(255,255,255,.05) !important;
  border-bottom: 1px solid rgba(255,255,255,.05) !important;
  padding: 20px 0 !important;
  overflow: hidden !important;
}
html body .px-trust-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px 24px !important;
  align-items: center !important;
  justify-content: center !important;
}
html body .px-trust-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
html body .px-trust-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  background: rgba(24,72,196,.14) !important;
  border: 1px solid rgba(23,212,245,.18) !important;
  color: var(--ds-cyan) !important;
  font-family: var(--ds-font-mono) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  white-space: nowrap !important;
}
html body .px-trust-item > span:last-child {
  font-size: 12px !important;
  color: var(--ds-muted) !important;
  white-space: nowrap !important;
}

/* pxv93 trust strip (inside home-v93) */
html body .pxv93-home .trust-strip {
  background: rgba(4,12,26,.6) !important;
  border-top: 1px solid rgba(255,255,255,.05) !important;
  border-bottom: 1px solid rgba(255,255,255,.05) !important;
  padding: 18px 0 !important;
}
html body .pxv93-home .trust-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px 20px !important;
  align-items: center !important;
  justify-content: center !important;
}
html body .pxv93-home .trust-pill {
  padding: 5px 14px !important;
  border-radius: 6px !important;
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: rgba(200,218,240,.7) !important;
  font-family: var(--ds-font-mono) !important;
  letter-spacing: .03em !important;
  white-space: nowrap !important;
}

/* ─── 9. SECTION HEADERS — universal ────────────────────────────────── */
html body .pxv93-home .pxv93-section-head {
  text-align: center !important;
  max-width: 680px !important;
  margin: 0 auto 52px !important;
}
html body .pxv93-home .pxv93-section-head > span:first-child {
  display: inline-block !important;
  font-family: var(--ds-font-mono) !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: rgba(110,155,230,.70) !important;
  margin-bottom: 14px !important;
}
html body .pxv93-home .pxv93-section-head h2 {
  font-family: var(--ds-font-h) !important;
  font-size: clamp(24px, 3vw, 38px) !important;
  font-weight: 800 !important;
  letter-spacing: -.022em !important;
  color: #fff !important;
  margin: 0 0 16px !important;
  line-height: 1.18 !important;
}
html body .pxv93-home .pxv93-section-head p {
  font-size: 16px !important;
  line-height: 1.65 !important;
  color: rgba(200,218,240,.7) !important;
  margin: 0 !important;
}

/* ─── 10. HOW SECTION — mitigation architecture ──────────────────────── */
html body .pxv93-home .pxv93-how {
  background: var(--ds-bg-1) !important;
  padding: var(--ds-section-v) 0 !important;
  border-top: 1px solid rgba(255,255,255,.04) !important;
}
html body .pxv93-home .pxv93-how .pxv93-head-actions {
  display: flex !important;
  justify-content: center !important;
  gap: 20px !important;
  margin-top: 20px !important;
  flex-wrap: wrap !important;
}
html body .pxv93-home .pxv93-how .pxv93-head-actions a {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--ds-cyan) !important;
  text-decoration: none !important;
  letter-spacing: .02em !important;
  transition: opacity .15s !important;
}
html body .pxv93-home .pxv93-how .pxv93-head-actions a:hover { opacity: .75 !important; }

html body .pxv93-home .pxv93-how-grid {
  display: grid !important;
  grid-template-columns: 1fr 360px !important;
  gap: 40px !important;
  align-items: start !important;
}
html body .pxv93-home .pxv93-pillars {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
}
html body .pxv93-home .pxv93-pillars article {
  background: rgba(8,18,40,.65) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: var(--ds-radius) !important;
  padding: 24px !important;
  transition: border-color .2s !important;
}
html body .pxv93-home .pxv93-pillars article:hover {
  border-color: rgba(23,212,245,.2) !important;
}
html body .pxv93-home .pxv93-pillars h3 {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin: 12px 0 8px !important;
}
html body .pxv93-home .pxv93-pillars p {
  font-size: 13px !important;
  color: rgba(200,218,240,.65) !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

/* Architecture dashboard */
html body .pxv93-home .pxv93-arch {
  background: rgba(5,14,30,.8) !important;
  border: 1px solid rgba(23,212,245,.14) !important;
  border-radius: var(--ds-radius) !important;
  overflow: hidden !important;
}
html body .pxv93-home .pxv93-dash-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
html body .pxv93-home .pxv93-dash-top strong {
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #fff !important;
  font-family: var(--ds-font-mono) !important;
}
html body .pxv93-home .pxv93-dash-top span {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 10px !important;
  font-family: var(--ds-font-mono) !important;
  color: var(--ds-teal) !important;
  letter-spacing: .06em !important;
}
html body .pxv93-home .pxv93-dash-top span i {
  display: block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: var(--ds-teal) !important;
  animation: pulse-dot 2.2s infinite !important;
}
html body .pxv93-home .pxv93-arch-flow {
  padding: 18px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
html body .pxv93-home .pxv93-arch-step {
  display: grid !important;
  grid-template-columns: 28px 1fr !important;
  gap: 12px !important;
  align-items: start !important;
}
html body .pxv93-home .pxv93-arch-num {
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
  background: rgba(24,72,196,.18) !important;
  border: 1px solid rgba(23,212,245,.2) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  font-family: var(--ds-font-mono) !important;
  color: var(--ds-cyan) !important;
  flex-shrink: 0 !important;
}
html body .pxv93-home .pxv93-arch-body strong {
  display: block !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: rgba(240,246,255,.85) !important;
  margin-bottom: 3px !important;
}
html body .pxv93-home .pxv93-arch-body span {
  font-size: 11.5px !important;
  color: rgba(200,218,240,.5) !important;
  line-height: 1.5 !important;
}
html body .pxv93-home .pxv93-dash-stats {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
}
html body .pxv93-home .pxv93-dash-stats > div {
  padding: 12px 16px !important;
  border-right: 1px solid rgba(255,255,255,.06) !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
html body .pxv93-home .pxv93-dash-stats > div:nth-child(2n) { border-right: none !important; }
html body .pxv93-home .pxv93-dash-stats strong {
  display: block !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  font-family: var(--ds-font-mono) !important;
  color: #fff !important;
  margin-bottom: 2px !important;
}
html body .pxv93-home .pxv93-dash-stats span {
  font-size: 10px !important;
  color: rgba(200,218,240,.45) !important;
  letter-spacing: .04em !important;
}
html body .pxv93-home .pxv93-dash-stats .ok strong {
  color: var(--ds-teal) !important;
}

@media (max-width: 1024px) {
  html body .pxv93-home .pxv93-how-grid {
    grid-template-columns: 1fr !important;
  }
  html body .pxv93-home .pxv93-arch { max-width: 480px !important; }
}
@media (max-width: 640px) {
  html body .pxv93-home .pxv93-pillars {
    grid-template-columns: 1fr !important;
  }
}

/* ─── 11. SOLUTIONS GRID ─────────────────────────────────────────────── */
html body .pxv93-home .pxv93-solutions {
  padding: var(--ds-section-v) 0 !important;
  background: var(--ds-bg-0) !important;
}
html body .pxv93-home .pxv93-solutions-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
  gap: 20px !important;
}
html body .pxv93-home .pxv93-solution {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  padding: 28px 24px !important;
  background: rgba(8,18,40,.65) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: var(--ds-radius) !important;
  text-decoration: none !important;
  transition: all .22s ease !important;
}
html body .pxv93-home .pxv93-solution:hover {
  border-color: rgba(23,212,245,.22) !important;
  background: rgba(10,22,50,.8) !important;
  box-shadow: 0 4px 32px rgba(24,72,196,.18) !important;
  transform: translateY(-2px) !important;
}
html body .pxv93-home .pxv93-sol-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
html body .pxv93-home .pxv93-solution h3 {
  font-size: 15.5px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin: 0 !important;
  -webkit-text-fill-color: #fff !important;
}
html body .pxv93-home .pxv93-solution p {
  font-size: 13px !important;
  color: rgba(200,218,240,.65) !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  flex: 1 !important;
}
html body .pxv93-home .pxv93-solution ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
html body .pxv93-home .pxv93-solution li {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12.5px !important;
  color: rgba(200,218,240,.7) !important;
}
html body .pxv93-home .pxv93-solution > strong {
  font-size: 12.5px !important;
  color: var(--ds-cyan) !important;
  -webkit-text-fill-color: var(--ds-cyan) !important;
  font-weight: 700 !important;
  margin-top: auto !important;
  display: block !important;
}

/* ─── 12. FOOTER ────────────────────────────────────────────────────── */
html body .site-footer {
  background: rgba(2,6,14,.98) !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
}
html body .site-footer h2, html body .site-footer h3 {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
html body .site-footer p, html body .site-footer li {
  color: rgba(200,218,240,.6) !important;
}
html body .site-footer a {
  color: rgba(200,218,240,.65) !important;
  text-decoration: none !important;
  transition: color .15s !important;
}
html body .site-footer a:hover {
  color: rgba(23,212,245,.9) !important;
}
html body .footer-highlight {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 12px !important;
  background: rgba(24,72,196,.1) !important;
  border: 1px solid rgba(23,212,245,.14) !important;
  border-radius: 6px !important;
  font-size: 11.5px !important;
  font-family: var(--ds-font-mono) !important;
  color: rgba(200,218,240,.6) !important;
  letter-spacing: .03em !important;
  margin: 10px 0 !important;
}

/* ─── 13. REVEAL ANIMATIONS ────────────────────────────────────────── */
@media (prefers-reduced-motion: no-preference) {
  .pxv99-reveal:not(.pxv99-in),
  .reveal:not(.visible) {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .5s ease, transform .5s ease;
  }
  .pxv99-reveal.pxv99-in,
  .reveal.visible {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ─── 14. SCROLLBAR PREMIUM ─────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: rgba(4,12,26,.8); }
::-webkit-scrollbar-thumb { background: rgba(23,100,210,.45); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(23,212,245,.5); }

/* ─── 15. GLOBAL BUTTON STYLES ──────────────────────────────────────── */
html body .button-primary,
html body .btn-primary {
  background: linear-gradient(135deg, #1848c4 0%, #1260d8 55%, #0eb8d8 120%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border: 1px solid rgba(23,212,245,.25) !important;
  box-shadow: 0 6px 22px rgba(24,72,196,.30) !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
html body .button-primary:hover,
html body .btn-primary:hover {
  box-shadow: 0 10px 32px rgba(24,72,196,.44) !important;
  transform: translateY(-1px) !important;
}
html body .button-ghost,
html body .btn-ghost {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: rgba(200,218,240,.9) !important;
  -webkit-text-fill-color: rgba(200,218,240,.9) !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
html body .button-ghost:hover,
html body .btn-ghost:hover {
  border-color: rgba(255,255,255,.22) !important;
  background: rgba(255,255,255,.09) !important;
}

/* ─── 16. CARDS PREMIUM ─────────────────────────────────────────────── */
html body .glass-card,
html body .feature-card {
  background: rgba(8,18,40,.7) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: var(--ds-radius) !important;
  backdrop-filter: blur(8px) !important;
}
html body .glass-card:hover,
html body .feature-card:hover {
  border-color: rgba(23,212,245,.18) !important;
}

/* ─── 17. CONTAINER ─────────────────────────────────────────────────── */
html body .pxv93-container,
html body .container {
  width: min(100% - 40px, 1240px) !important;
  margin-inline: auto !important;
}
@media (max-width: 640px) {
  html body .pxv93-container,
  html body .container {
    width: min(100% - 24px, 1240px) !important;
  }
}

/* ─── 18. BLOG PREMIUM ──────────────────────────────────────────────── */
html body [data-blog-empty][hidden],
html body .blog-empty-state-v80[hidden] { display: none !important; }
html body :has(>[data-blog-cards] [data-article-card]:not(.is-hidden):not([hidden])) > [data-blog-empty] {
  display: none !important;
  visibility: hidden !important;
}

/* ─── 19. PARTNER SECTION FOOTER ────────────────────────────────────── */
html body .footer-partners {
  padding: var(--ds-section-v) 0 !important;
}
html body .footer-partners h2 {
  font-family: var(--ds-font-h) !important;
  font-size: clamp(22px, 2.5vw, 30px) !important;
  font-weight: 800 !important;
  color: #fff !important;
  letter-spacing: -.02em !important;
  margin: 0 0 10px !important;
}
html body .footer-partner-card {
  background: rgba(8,18,40,.6) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: var(--ds-radius) !important;
  padding: 24px !important;
  transition: border-color .2s !important;
}
html body .footer-partner-card:hover {
  border-color: rgba(23,212,245,.18) !important;
}

/* ─── 20. NETWORK/INFRA MAP OVERRIDES ───────────────────────────────── */
/* Hide fake/future PoP labels from world map in home-premium.php */
html body .label-ny,
html body .px-map-label.label-ny,
html body .label-dubai,
html body .px-map-label.label-dubai,
html body .label-singapore,
html body .px-map-label.label-singapore,
html body .eu-dubai,
html body .px-map-label.eu-dubai { display: none !important; }

/* Mark Paris as deploying */
html body .label-paris::after,
html body .eu-paris::after {
  content: ' *' !important;
  font-size: .8em !important;
  opacity: .6 !important;
}

/* ─── 21. RESPONSIVE GLOBAL ─────────────────────────────────────────── */
@media (max-width: 768px) {
  :root {
    --ds-section-v: clamp(52px, 7vw, 80px);
  }
}
@media (max-width: 480px) {
  html body .pxv93-home .pxv93-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  html body .pxv93-home .pxv93-primary,
  html body .pxv93-home .pxv93-ghost {
    justify-content: center !important;
    width: 100% !important;
  }
}

/* ─── 22. FOCUS / ACCESSIBILITY ─────────────────────────────────────── */
*:focus-visible {
  outline: 2px solid rgba(23,212,245,.75) !important;
  outline-offset: 2px !important;
}
button, a, input, textarea, select {
  -webkit-tap-highlight-color: transparent;
}

/* ─── 23. CANVAS NETWORK ANIMATION ──────────────────────────────────── */
canvas.pxv99-net {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 0 !important;
  opacity: .35 !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   §v201  PREMIUM UPGRADE PASS — navbar, hero, contact, transit, design system
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── v201-A. NAVBAR — premium level ────────────────────────────────────── */

/* Taller header with more presence */
html body .site-header .container.header-inner {
  min-height: 70px !important;
  gap: 20px !important;
}

/* Logo mark — larger, more presence */
html body .site-header .brand-mark {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 10px !important;
  background: linear-gradient(145deg, rgba(24,72,196,.20) 0%, rgba(8,18,42,.98) 100%) !important;
  border: 1px solid rgba(60,110,220,.38) !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.04), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html body .site-header .brand-mark img {
  width: 24px !important;
  height: 24px !important;
}

/* Brand name — crisper, stronger */
html body .site-header .brand-name {
  font-size: 14.5px !important;
  font-weight: 900 !important;
  letter-spacing: .10em !important;
  color: #f2f6ff !important;
  -webkit-text-fill-color: #f2f6ff !important;
}
html body .site-header .brand-sub {
  font-size: 7.5px !important;
  letter-spacing: .40em !important;
  color: rgba(100,135,190,.50) !important;
  -webkit-text-fill-color: rgba(100,135,190,.50) !important;
  margin-top: 1px !important;
}

/* Desktop nav pill — cleaner, slightly more refined */
html body .site-header .desktop-nav {
  gap: 0 !important;
  padding: 5px 6px !important;
  background: rgba(6,12,28,.70) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  backdrop-filter: blur(12px) !important;
}

/* Nav links — better typography, more breathing room */
html body .site-header .desktop-nav .nav-link {
  padding: 7px 16px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  letter-spacing: .005em !important;
  color: rgba(185,205,235,.72) !important;
  -webkit-text-fill-color: rgba(185,205,235,.72) !important;
}
html body .site-header .desktop-nav .nav-link:hover {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: rgba(255,255,255,.08) !important;
}
html body .site-header .desktop-nav .nav-link.active,
html body .site-header .desktop-nav .nav-link[aria-current] {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: rgba(24,72,196,.22) !important;
  border-radius: 100px !important;
}

/* ─── v201-B. HERO — shorter & stronger ─────────────────────────────────── */

/* Reduce hero height: target ~720px at 1440px vs previous ~1050px */
html body .pxv93-home .pxv93-hero {
  padding: clamp(44px, 5vw, 68px) 0 clamp(36px, 4vw, 52px) !important;
}

/* H1 — punchy, compact, strong */
html body .pxv93-home .pxv93-hero h1 {
  font-size: clamp(28px, 3.5vw, 46px) !important;
  line-height: 1.06 !important;
  letter-spacing: -.028em !important;
  margin-bottom: 18px !important;
  hyphens: none !important;
  -webkit-hyphens: none !important;
  overflow-wrap: break-word !important;
}

/* Lead text — one liner, essential only */
html body .pxv93-home .pxv93-lead {
  font-size: clamp(15px, 1.3vw, 17px) !important;
  line-height: 1.58 !important;
  margin-bottom: 20px !important;
}

/* Hide the second/redundant paragraph in hero — reduces height by ~80px */
html body .pxv93-home .pxv93-hero .pxv93-text {
  display: none !important;
}

/* Hero visual — constrained height for compact hero */
html body .pxv93-home .pxv93-hero-visual,
html body .pxv93-home .hero-netmap {
  max-height: 380px !important;
}

/* Hero actions — tighter gap */
html body .pxv93-home .pxv93-actions {
  margin-bottom: 28px !important;
  gap: 12px !important;
}

/* Metrics strip — 4-col grid, always single row */
html body .pxv93-home .pxv93-metrics {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 10px !important;
  flex-wrap: unset !important;
}
html body .pxv93-home .pxv93-metrics > div {
  padding: 10px 12px !important;
  flex: unset !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
html body .pxv93-home .pxv93-metrics strong {
  font-size: 12.5px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 100% !important;
}
html body .pxv93-home .pxv93-metrics span,
html body .pxv93-home .pxv93-metrics > div > span,
html body .pxv93-home .pxv93-metrics > div > span:last-of-type {
  font-size: 10.5px !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  max-width: 100% !important;
  display: block !important;
  word-break: break-word !important;
}
html body .pxv93-home .pxv93-metrics i {
  width: 28px !important;
  height: 28px !important;
  flex-shrink: 0 !important;
}

/* Mobile: 2×2 grid */
@media (max-width: 600px) {
  html body .pxv93-home .pxv93-metrics {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ─── v201-B2. HERO VISUAL PANEL — remove dashboard feel ────────────────── */

/* Hide metric bars at bottom of NOC panel — makes visual look architectural not monitoring */
html body .pxv93-home .netmap-metrics {
  display: none !important;
}

/* Expand SVG to fill the space */
html body .pxv93-home .netmap-svg-wrap {
  flex: 1 !important;
  min-height: 220px !important;
}
html body .pxv93-home .netmap-svg-wrap svg {
  width: 100% !important;
  height: 100% !important;
  min-height: 200px !important;
}

/* Header of NOC panel — more minimal */
html body .pxv93-home .netmap-header {
  border-bottom: 1px solid rgba(40,80,180,.18) !important;
  background: transparent !important;
  padding: 10px 16px !important;
}

/* ─── v201-C. HERO VISUAL — cleaner SVG appearance ──────────────────────── */

/* Arrow markers: override inline stroke to blue */
html body .pxv93-home .hero-netmap svg marker path {
  stroke: rgba(60,120,255,.60) !important;
  fill: none !important;
}
html body .pxv93-home .hero-netmap svg defs + g marker path,
html body .pxv93-home .hero-netmap svg [id="nm-arr"] path {
  stroke: rgba(60,120,255,.60) !important;
}

/* All clean paths: blue, not teal */
html body .pxv93-home .hero-netmap svg .p15-path-clean {
  stroke: rgba(60,120,255,.32) !important;
}

/* Attack path: keep red/orange for semantic correctness */
html body .pxv93-home .hero-netmap svg .p15-path-attack {
  stroke: rgba(220,60,60,.30) !important;
}

/* Animated clean packets: blue */
html body .pxv93-home .hero-netmap svg .p15-pkt,
html body .pxv93-home .hero-netmap svg .p15-pkt-2 {
  fill: rgba(80,140,255,.82) !important;
}

/* Attack packets: keep red */
html body .pxv93-home .hero-netmap svg .p15-pkt-atk,
html body .pxv93-home .hero-netmap svg .p15-pkt-atk-2 {
  fill: rgba(220,60,60,.80) !important;
}

/* ─── v201-D. GLOBAL SECTIONS — premium spacing & typography ────────────── */

/* Section headings — stronger, more confident */
html body .pxv93-home .pxv93-section-head h2,
html body .section h2,
html body h2.section-title {
  letter-spacing: -.025em !important;
  line-height: 1.10 !important;
}

/* Glass cards — slightly more premium border/bg */
html body .glass-card {
  background: rgba(8,16,38,.58) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 14px !important;
  transition: border-color .2s ease, box-shadow .2s ease !important;
}
html body .glass-card:hover {
  border-color: rgba(60,110,220,.25) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,.25), 0 0 0 1px rgba(60,110,220,.12) !important;
}

/* Icon cards — better icon */
html body .icon-card .card-icon {
  border-radius: 10px !important;
  background: rgba(24,72,196,.12) !important;
  border: 1px solid rgba(40,90,200,.22) !important;
}

/* ─── v201-E. CONTACT FORM — premium rebuild ─────────────────────────────── */

html body .contact-card {
  background: rgba(6,14,34,.72) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 16px !important;
  padding: clamp(28px, 3.5vw, 48px) !important;
}

html body .contact-card h2 {
  font-size: clamp(18px, 1.8vw, 24px) !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  color: #f0f5ff !important;
  -webkit-text-fill-color: #f0f5ff !important;
  margin-bottom: 24px !important;
}

/* Form row: two-column on desktop */
html body .contact-form .form-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
}

/* Labels — clear, readable */
html body .contact-form label {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-bottom: 16px !important;
}
html body .contact-form label span {
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  color: rgba(150,180,225,.75) !important;
  -webkit-text-fill-color: rgba(150,180,225,.75) !important;
}

/* Inputs, selects, textareas — premium dark field */
html body .contact-form input,
html body .contact-form select,
html body .contact-form textarea {
  width: 100% !important;
  padding: 13px 16px !important;
  background: rgba(4,10,26,.80) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 10px !important;
  color: rgba(220,232,252,.90) !important;
  -webkit-text-fill-color: rgba(220,232,252,.90) !important;
  font-size: 14px !important;
  font-family: inherit !important;
  line-height: 1.5 !important;
  outline: none !important;
  transition: border-color .18s ease, box-shadow .18s ease !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  box-sizing: border-box !important;
}
html body .contact-form input:focus,
html body .contact-form select:focus,
html body .contact-form textarea:focus {
  border-color: rgba(60,110,220,.70) !important;
  box-shadow: 0 0 0 3px rgba(24,72,196,.18) !important;
}
html body .contact-form input::placeholder,
html body .contact-form textarea::placeholder {
  color: rgba(120,150,200,.35) !important;
  -webkit-text-fill-color: rgba(120,150,200,.35) !important;
}
html body .contact-form textarea {
  resize: vertical !important;
  min-height: 140px !important;
}
html body .contact-form select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(130,165,210,.6)' stroke-width='2'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 18px !important;
  padding-right: 40px !important;
  cursor: pointer !important;
}
html body .contact-form select option {
  background: #0a1428 !important;
  color: #e0eaff !important;
}

/* Submit button — full width, strong */
html body .contact-form button[type="submit"] {
  width: 100% !important;
  padding: 15px 24px !important;
  margin-top: 8px !important;
  background: linear-gradient(135deg, #0f36a8 0%, #1848c4 50%, #1e58d0 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  cursor: pointer !important;
  transition: background .18s ease, box-shadow .18s ease, transform .12s ease !important;
  box-shadow: 0 4px 16px rgba(24,72,196,.35) !important;
}
html body .contact-form button[type="submit"]:hover {
  background: linear-gradient(135deg, #1848c4 0%, #2056d8 100%) !important;
  box-shadow: 0 6px 24px rgba(24,72,196,.50) !important;
  transform: translateY(-1px) !important;
}

/* Contact sidebar — cleaner */
html body .contact-side {
  background: rgba(6,14,34,.50) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 16px !important;
  padding: clamp(24px, 3vw, 40px) !important;
}
html body .contact-side h2 {
  font-size: clamp(16px, 1.5vw, 21px) !important;
  font-weight: 800 !important;
  color: #f0f5ff !important;
  -webkit-text-fill-color: #f0f5ff !important;
  margin-bottom: 16px !important;
}
html body .contact-side p,
html body .contact-side .feature-inline span {
  font-size: 14px !important;
  line-height: 1.65 !important;
  color: rgba(155,185,225,.72) !important;
  -webkit-text-fill-color: rgba(155,185,225,.72) !important;
}

/* Contact form — mobile single column */
@media (max-width: 640px) {
  html body .contact-form .form-row {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* ─── v201-F. TRANSIT IP PROOF STRIP — card-based ───────────────────────── */

html body .transit-proof-strip-v81 {
  background: rgba(4,10,26,.90) !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
  padding: 32px 0 !important;
}

html body .transit-proof-grid-v81 {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 0 !important;
}

html body .transit-proof-item-v81 {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px 24px !important;
  text-align: center !important;
  border-right: 1px solid rgba(255,255,255,.07) !important;
  gap: 8px !important;
}
html body .transit-proof-item-v81:last-child {
  border-right: none !important;
}

html body .transit-proof-item-v81 > strong {
  display: block !important;
  font-size: clamp(22px, 2.4vw, 32px) !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  color: #f0f6ff !important;
  -webkit-text-fill-color: #f0f6ff !important;
  line-height: 1 !important;
}
html body .transit-proof-item-v81 > span {
  display: block !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: rgba(130,165,210,.65) !important;
  -webkit-text-fill-color: rgba(130,165,210,.65) !important;
  line-height: 1.45 !important;
  max-width: 180px !important;
  letter-spacing: .01em !important;
}

@media (max-width: 640px) {
  html body .transit-proof-grid-v81 {
    grid-template-columns: 1fr !important;
  }
  html body .transit-proof-item-v81 {
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
    padding: 18px 16px !important;
  }
  html body .transit-proof-item-v81:last-child {
    border-bottom: none !important;
  }
}

/* ─── v201-G. SUBPAGE HERO — more premium ───────────────────────────────── */

html body .hero-subpage {
  padding: clamp(56px, 7vw, 96px) 0 clamp(40px, 5vw, 64px) !important;
}

html body .hero-subpage h1 {
  font-size: clamp(28px, 3.6vw, 48px) !important;
  font-weight: 800 !important;
  letter-spacing: -.025em !important;
  line-height: 1.08 !important;
}

/* Eyebrows on subpages */
html body .eyebrow {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: rgba(120,165,230,.75) !important;
  -webkit-text-fill-color: rgba(120,165,230,.75) !important;
  margin-bottom: 18px !important;
  display: block !important;
}

/* ─── v201-H. BLOG PAGE — knowledge center upgrade ───────────────────────── */

/* Blog hero */
html body .blog-page .hero-subpage h1,
html body [class*="blog"] .hero-subpage h1,
html body .blog-index-hero h1 {
  font-size: clamp(28px, 3.8vw, 50px) !important;
  font-weight: 800 !important;
}

/* Blog search bar */
html body .blog-search,
html body [data-article-search],
html body .blog-filter input[type="search"],
html body .blog-filter input[type="text"] {
  background: rgba(4,10,26,.80) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 100px !important;
  padding: 12px 20px !important;
  color: rgba(220,232,252,.90) !important;
  -webkit-text-fill-color: rgba(220,232,252,.90) !important;
  font-size: 14px !important;
  outline: none !important;
  transition: border-color .18s ease !important;
}
html body [data-article-search]:focus {
  border-color: rgba(60,110,220,.60) !important;
}

/* Blog filter chips */
html body [data-topic-filter] {
  border-radius: 100px !important;
  padding: 7px 16px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  transition: all .15s ease !important;
}
html body [data-topic-filter].active {
  background: rgba(24,72,196,.25) !important;
  border-color: rgba(60,110,220,.45) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Blog article cards */
html body .resource-card,
html body .blog-home-card {
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  background: rgba(6,14,34,.65) !important;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}
html body .resource-card:hover,
html body .blog-home-card:hover {
  border-color: rgba(60,110,220,.28) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.28) !important;
  transform: translateY(-2px) !important;
}

/* ─── v201-I. SOLUTIONS GRID — home ─────────────────────────────────────── */

html body .pxv93-home .pxv93-solution {
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  background: rgba(6,14,34,.60) !important;
  transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease !important;
}
html body .pxv93-home .pxv93-solution:hover {
  border-color: rgba(40,90,200,.32) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,.32), 0 0 0 1px rgba(40,90,200,.12) !important;
  transform: translateY(-3px) !important;
}

/* ─── v201-J. GLOBAL TYPOGRAPHY REFINEMENTS ─────────────────────────────── */

/* Subpage paragraphs */
html body .hero-text,
html body .hero-subpage .hero-text {
  font-size: clamp(15px, 1.2vw, 17px) !important;
  line-height: 1.68 !important;
  color: rgba(160,190,225,.72) !important;
  -webkit-text-fill-color: rgba(160,190,225,.72) !important;
  max-width: 580px !important;
  margin-bottom: 0 !important;
}

/* Reduce massive section vertical padding on subpages */
html body .section {
  padding-top: clamp(56px, 7vw, 96px) !important;
  padding-bottom: clamp(56px, 7vw, 96px) !important;
}

/* ─── v201-K. TRANSIT IP — hero refinement ───────────────────────────────── */

html body .transit-hero-v81 {
  padding: clamp(52px, 6.5vw, 84px) 0 clamp(36px, 4.5vw, 56px) !important;
}

html body .transit-hero-copy-v81 h1 {
  font-size: clamp(26px, 3.4vw, 44px) !important;
  font-weight: 800 !important;
  letter-spacing: -.025em !important;
  line-height: 1.09 !important;
}

/* Transit visual panel — cleaner */
html body .transit-hero-visual-v81 {
  border-radius: 14px !important;
  border: 1px solid rgba(40,80,180,.22) !important;
  background: rgba(4,10,24,.80) !important;
  backdrop-filter: blur(8px) !important;
}

/* ─── v201-L. FOOTER — subtle upgrade ────────────────────────────────────── */

html body .site-footer,
html body footer.pxv93-footer {
  border-top: 1px solid rgba(255,255,255,.07) !important;
}

/* ─── v201-M. MOBILE RESPONSIVE FIXES ────────────────────────────────────── */

@media (max-width: 768px) {
  /* Contact layout stacks on mobile */
  html body .container.two-col.align-start {
    grid-template-columns: 1fr !important;
  }

  /* Transit hero stacks */
  html body .transit-hero-grid-v81 {
    grid-template-columns: 1fr !important;
  }

  /* Transit proof 1-column */
  html body .transit-proof-grid-v81 {
    grid-template-columns: 1fr !important;
  }

  /* Blog cards */
  html body .resource-card-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 480px) {
  /* Contact full single column */
  html body .contact-form .form-row {
    grid-template-columns: 1fr !important;
  }

  /* Blog cards single column on very small */
  html body .resource-card-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ─── v201-N. ACCESSIBILITY FOCUS UPGRADE ────────────────────────────────── */
*:focus-visible {
  outline: 2px solid rgba(60,110,220,.80) !important;
  outline-offset: 3px !important;
}

/* ─── v201-P. RÉSEAU / TRUST PAGES — premium infrastructure look ──────────── */

/* Hero section — more vertical breathing room */
html body .section-trust-page {
  padding: clamp(72px, 9vw, 120px) 0 clamp(56px, 7vw, 96px) !important;
}

/* Hero grid: left copy + right visual card side by side */
html body .section-trust-page .hero-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: clamp(40px, 5vw, 72px) !important;
  align-items: start !important;
}

/* Hero H1 */
html body .section-trust-page .hero-copy h1 {
  font-size: clamp(28px, 3.4vw, 48px) !important;
  font-weight: 800 !important;
  letter-spacing: -.028em !important;
  line-height: 1.07 !important;
  color: #f2f6ff !important;
  -webkit-text-fill-color: #f2f6ff !important;
  margin-bottom: 18px !important;
  hyphens: none !important;
  -webkit-hyphens: none !important;
}
html body .section-trust-page .hero-lead {
  font-size: clamp(14px, 1.2vw, 16px) !important;
  color: rgba(155,185,235,.75) !important;
  -webkit-text-fill-color: rgba(155,185,235,.75) !important;
  line-height: 1.70 !important;
  margin-bottom: 32px !important;
}
html body .section-trust-page .hero-actions {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

/* Trust hero visual card — premium AS card */
html body .trust-hero-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: clamp(28px, 3vw, 44px) !important;
  background: linear-gradient(145deg, rgba(8,18,46,.98) 0%, rgba(5,12,32,.99) 100%) !important;
  border: 1px solid rgba(40,80,200,.30) !important;
  border-radius: 18px !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.04), 0 32px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.07) !important;
  position: relative !important;
  overflow: hidden !important;
}
html body .trust-hero-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(80,130,255,.50), transparent) !important;
}
html body .trust-hero-card::after {
  content: 'AS213382' !important;
  position: absolute !important;
  top: clamp(20px, 2.5vw, 32px) !important;
  right: clamp(20px, 2.5vw, 32px) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .12em !important;
  color: rgba(80,140,240,.60) !important;
  background: rgba(24,72,196,.12) !important;
  border: 1px solid rgba(40,80,200,.25) !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
}
html body .trust-hero-card strong {
  display: block !important;
  font-size: clamp(16px, 1.5vw, 20px) !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
  color: #f0f6ff !important;
  -webkit-text-fill-color: #f0f6ff !important;
  margin-bottom: 8px !important;
}
html body .trust-hero-card > span {
  display: block !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  color: rgba(100,155,240,.85) !important;
  -webkit-text-fill-color: rgba(100,155,240,.85) !important;
  text-transform: uppercase !important;
  margin-bottom: 20px !important;
}
html body .trust-hero-card p {
  font-size: 13.5px !important;
  color: rgba(140,175,230,.62) !important;
  -webkit-text-fill-color: rgba(140,175,230,.62) !important;
  line-height: 1.65 !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
  padding-top: 16px !important;
  margin-top: 4px !important;
}

/* Trust card grid — 2×2 on desktop */
html body .trust-card-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 20px !important;
  margin-top: 0 !important;
}
html body .section-trust-page + .section {
  padding-top: clamp(16px, 2vw, 32px) !important;
  padding-bottom: clamp(64px, 8vw, 100px) !important;
}

html body .trust-card-grid .feature-card {
  padding: clamp(24px, 2.8vw, 40px) !important;
  background: rgba(6,14,36,.72) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 16px !important;
  position: relative !important;
  overflow: hidden !important;
  transition: border-color .2s ease, box-shadow .2s ease !important;
}
html body .trust-card-grid .feature-card:hover {
  border-color: rgba(40,90,210,.28) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.28) !important;
}
html body .trust-card-grid .feature-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent, rgba(40,90,220,.40), transparent) !important;
}
html body .trust-card-grid .feature-card h2 {
  font-size: clamp(15px, 1.4vw, 18px) !important;
  font-weight: 800 !important;
  color: #eaf0ff !important;
  -webkit-text-fill-color: #eaf0ff !important;
  margin-bottom: 10px !important;
  letter-spacing: -.01em !important;
}
html body .trust-card-grid .feature-card p {
  font-size: 14px !important;
  color: rgba(135,175,230,.68) !important;
  -webkit-text-fill-color: rgba(135,175,230,.68) !important;
  line-height: 1.68 !important;
}

/* Feature card icon — small icon block in card header area */
html body .feature-card-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 11px !important;
  background: rgba(24,72,196,.14) !important;
  border: 1px solid rgba(40,90,210,.22) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 16px !important;
  flex-shrink: 0 !important;
}
html body .feature-card-icon svg {
  width: 20px !important;
  height: 20px !important;
  stroke: rgba(100,155,240,.90) !important;
  fill: none !important;
  stroke-width: 1.6 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* Feature card badge — status indicator */
html body .feature-card-badge {
  display: inline-block !important;
  margin-top: 14px !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
}
html body .feature-card-badge--active {
  color: rgba(60,210,120,.90) !important;
  -webkit-text-fill-color: rgba(60,210,120,.90) !important;
  background: rgba(24,180,80,.12) !important;
  border: 1px solid rgba(40,180,80,.22) !important;
}

/* Responsive: stack at ≤768px */
@media (max-width: 768px) {
  html body .trust-card-grid {
    grid-template-columns: 1fr !important;
  }
  html body .section-trust-page .hero-grid {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
}

/* ─── v201-Q. TRANSIT IP — decompact sections ──────────────────────────────── */

/* Hero — more vertical breathing */
html body .transit-hero-v81 {
  padding: clamp(60px, 7.5vw, 96px) 0 clamp(40px, 5vw, 60px) !important;
}

/* Delivery mode cards — more padding, better cards */
html body .transit-modes-v81,
html body .section-modes,
html body [class*="delivery-mode"],
html body [class*="transit-mode"] {
  padding: clamp(48px, 6vw, 80px) 0 !important;
}

/* Transit section spacing — general sections under transit page */
html body .page-transit .section,
html body .px83-transit .section {
  padding-top: clamp(56px, 7vw, 88px) !important;
  padding-bottom: clamp(56px, 7vw, 88px) !important;
}

/* Transit proof items — more comfortable */
html body .transit-proof-item-v81 {
  padding: clamp(20px, 2.5vw, 32px) clamp(20px, 2.5vw, 28px) !important;
}

/* Transit modes: ensure they don't look crammed */
html body .transit-proof-grid-v81 {
  gap: 16px !important;
}

/* ─── v201-R. BLOG / KNOWLEDGE CENTER POLISH ──────────────────────────────── */

/* Blog hero section — tighter but elegant */
html body .page-blog .hero-subpage,
html body .blog-hero-v80,
html body .sec-blog-hero {
  padding: clamp(60px, 7.5vw, 96px) 0 clamp(36px, 4.5vw, 56px) !important;
}

/* Featured article card on blog hero — premium */
html body .blog-featured-card,
html body .blog-home-featured {
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  overflow: hidden !important;
  transition: border-color .2s ease, box-shadow .2s ease !important;
}
html body .blog-featured-card:hover,
html body .blog-home-featured:hover {
  border-color: rgba(40,90,210,.28) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,.32) !important;
}

/* ─── v201-T. BLOG / KNOWLEDGE CENTER premium polish ───────────────────────── */

/* Blog hero KC badge */
html body .blog-kc-badge,
html body .blog-kc-label {
  color: rgba(110,155,230,.75) !important;
  -webkit-text-fill-color: rgba(110,155,230,.75) !important;
  border-color: rgba(40,90,210,.25) !important;
}

/* Featured article panel — blue border, premium glass */
html body .blog-featured-panel-v80 {
  background: rgba(6,14,36,.80) !important;
  border: 1px solid rgba(40,90,210,.26) !important;
  box-shadow: 0 4px 32px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
html body .blog-featured-panel-v80:hover {
  border-color: rgba(40,90,210,.40) !important;
  box-shadow: 0 8px 40px rgba(0,0,0,.34) !important;
}
html body .blog-meta-badge {
  color: rgba(100,155,240,.90) !important;
  -webkit-text-fill-color: rgba(100,155,240,.90) !important;
  background: rgba(24,72,196,.14) !important;
  border-color: rgba(40,90,210,.22) !important;
}
html body .blog-meta-badge-as,
html body .blog-meta-badge-count {
  color: rgba(135,175,230,.75) !important;
  -webkit-text-fill-color: rgba(135,175,230,.75) !important;
}

/* Reading paths — link colors blue not teal (match v133 specificity: li a) */
html body .blog-path-links li a,
html body .blog-path-links a,
html body .blog-path-links .path-arrow {
  color: rgba(100,155,240,.85) !important;
  -webkit-text-fill-color: rgba(100,155,240,.85) !important;
  text-decoration: none !important;
}
html body .blog-path-links li a:hover,
html body .blog-path-links a:hover {
  color: rgba(145,190,255,.95) !important;
  -webkit-text-fill-color: rgba(145,190,255,.95) !important;
}
html body .blog-path-num {
  color: rgba(40,80,180,.70) !important;
  -webkit-text-fill-color: rgba(40,80,180,.70) !important;
  font-weight: 800 !important;
}
html body .blog-path-head {
  color: #dce8ff !important;
  -webkit-text-fill-color: #dce8ff !important;
}
html body .blog-path-card {
  border-top: 2px solid rgba(40,90,210,.28) !important;
}
html body .blog-path-card.blog-path-accent-ddos { border-top-color: rgba(24,72,196,.55) !important; }
html body .blog-path-card.blog-path-accent-bgp  { border-top-color: rgba(50,100,220,.45) !important; }
html body .blog-path-card.blog-path-accent-gaming{ border-top-color: rgba(80,130,240,.40) !important; }
html body .blog-path-card.blog-path-accent-network{ border-top-color: rgba(30,85,210,.50) !important; }

/* Category insight cards */
html body .blog-insight-card {
  background: rgba(8,18,42,.55) !important;
  border: 1px solid rgba(40,90,210,.18) !important;
  transition: border-color .18s ease, box-shadow .18s ease !important;
}
html body .blog-insight-card:hover {
  border-color: rgba(40,90,210,.35) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.22) !important;
}

/* Skip link — currently teal, change to blue */
html body .px-skip-link {
  color: rgba(100,155,240,.90) !important;
  -webkit-text-fill-color: rgba(100,155,240,.90) !important;
}

/* ─── v201-S. HOMEPAGE — hero improvements ─────────────────────────────────── */

/* Proof strip / metrics — more vertical breathing */
html body .pxv93-metrics {
  gap: 10px !important;
  margin-top: 36px !important;
  padding-top: 28px !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
}

/* ─── v201-T. CONTENT-VISIBILITY OVERRIDE — full-page rendering fix ─────────── */
/* v95 sets content-visibility:auto on .section + many selectors, causing blank
   sections in Playwright fullPage screenshots and potential visual jank.
   Override to content-visibility:visible so all sections render immediately. */
html body .section,
html body .section-alt,
html body .pxv93-how,
html body .pxv93-solutions,
html body .pxv93-why,
html body .pxv93-infra,
html body .pxv93-blog,
html body .pxv93-cta,
html body .pxv93-expertise,
html body .pxv93-partners,
html body .hero-subpage,
html body .blog-index-hero,
html body .article-hero {
  content-visibility: visible !important;
  contain-intrinsic-size: auto !important;
}

/* ─── v201-U. CONTACT FORM — field-wrap structure + accessible labels ────────── */

/* Field wrapper: contains label + input, stacked column */
html body .contact-form .field-wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  margin-bottom: 18px !important;
}
html body .contact-form .field-wrap label {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: rgba(148,178,222,.78) !important;
  -webkit-text-fill-color: rgba(148,178,222,.78) !important;
  margin-bottom: 0 !important;
  gap: 0 !important;
}
html body .contact-form .field-wrap label abbr {
  text-decoration: none !important;
  color: rgba(110,155,230,.70) !important;
  -webkit-text-fill-color: rgba(110,155,230,.70) !important;
  margin-left: 2px !important;
}
html body .contact-form .field-wrap input,
html body .contact-form .field-wrap select,
html body .contact-form .field-wrap textarea {
  margin-bottom: 0 !important;
}
html body .contact-form .field-wrap-full {
  grid-column: 1 / -1 !important;
}

/* Alt contact link below submit */
html body .contact-form .form-alt-contact {
  margin-top: 14px !important;
  text-align: center !important;
  font-size: 13px !important;
  color: rgba(120,155,205,.60) !important;
  -webkit-text-fill-color: rgba(120,155,205,.60) !important;
}
html body .contact-form .form-alt-contact a {
  color: rgba(100,148,230,.80) !important;
  -webkit-text-fill-color: rgba(100,148,230,.80) !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(100,148,230,.25) !important;
  transition: color .15s, border-color .15s !important;
}
html body .contact-form .form-alt-contact a:hover {
  color: rgba(130,175,255,.95) !important;
  -webkit-text-fill-color: rgba(130,175,255,.95) !important;
  border-bottom-color: rgba(130,175,255,.50) !important;
}

/* Ensure form-row still two-column on desktop when using field-wrap */
html body .contact-form .form-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  margin-bottom: 0 !important;
}

@media (max-width: 640px) {
  html body .contact-form .form-row {
    grid-template-columns: 1fr !important;
  }
}

/* ─── v201-V. RÉSEAU PAGE — PoP strip + AS card + expose + Looking Glass ─────── */

/* Section title (smaller H2 intro) */
html body .network-section-title {
  font-size: clamp(18px, 1.8vw, 22px) !important;
  font-weight: 700 !important;
  color: rgba(180,210,255,.70) !important;
  -webkit-text-fill-color: rgba(180,210,255,.70) !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  margin-bottom: 24px !important;
}

/* PoP grid: 4 cards row on desktop, 2-col tablet, 1-col mobile */
html body .network-pop-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 16px !important;
}
@media (max-width: 900px) {
  html body .network-pop-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 480px) {
  html body .network-pop-grid {
    grid-template-columns: 1fr !important;
  }
}

html body .network-pop-item {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 18px 20px !important;
  background: rgba(4,12,32,.65) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 12px !important;
}
html body .network-pop-item.pop-active {
  border-color: rgba(40,160,80,.28) !important;
  background: rgba(4,24,16,.70) !important;
}
html body .network-pop-item.pop-deploying {
  border-color: rgba(60,110,220,.25) !important;
  background: rgba(4,10,30,.70) !important;
}

/* Pulsing dot */
html body .pop-status-dot {
  display: inline-block !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}
html body .pop-status-dot.dot-active {
  background: #2ec970 !important;
  box-shadow: 0 0 0 3px rgba(46,201,112,.20) !important;
  animation: px-pulse-green 2.4s ease-in-out infinite !important;
}
html body .pop-status-dot.dot-deploying {
  background: #4878e0 !important;
  box-shadow: 0 0 0 3px rgba(72,120,224,.18) !important;
}
html body .pop-status-dot.dot-roadmap {
  background: rgba(120,145,185,.40) !important;
}
@keyframes px-pulse-green {
  0%, 100% { box-shadow: 0 0 0 3px rgba(46,201,112,.20); }
  50%       { box-shadow: 0 0 0 6px rgba(46,201,112,.08); }
}

html body .pop-info {
  flex: 1 !important;
  min-width: 0 !important;
}
html body .pop-info strong {
  display: block !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #eef3ff !important;
  -webkit-text-fill-color: #eef3ff !important;
}
html body .pop-info span {
  display: block !important;
  font-size: 11.5px !important;
  color: rgba(130,165,210,.65) !important;
  -webkit-text-fill-color: rgba(130,165,210,.65) !important;
  margin-top: 2px !important;
}

/* Status badges */
html body .pop-status-badge {
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  padding: 3px 8px !important;
  border-radius: 4px !important;
  flex-shrink: 0 !important;
}
html body .pop-status-badge.badge-active {
  background: rgba(46,201,112,.15) !important;
  color: #2ec970 !important;
  -webkit-text-fill-color: #2ec970 !important;
  border: 1px solid rgba(46,201,112,.25) !important;
}
html body .pop-status-badge.badge-deploying {
  background: rgba(72,120,224,.14) !important;
  color: rgba(110,158,242,.90) !important;
  -webkit-text-fill-color: rgba(110,158,242,.90) !important;
  border: 1px solid rgba(72,120,224,.22) !important;
}
html body .pop-status-badge.badge-roadmap {
  background: rgba(255,255,255,.05) !important;
  color: rgba(130,160,200,.60) !important;
  -webkit-text-fill-color: rgba(130,160,200,.60) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
}

/* AS card */
html body .network-as-card h2,
html body .network-expose-card h2 {
  font-size: clamp(16px, 1.5vw, 20px) !important;
  font-weight: 800 !important;
  color: #eef3ff !important;
  -webkit-text-fill-color: #eef3ff !important;
  margin-bottom: 12px !important;
}
html body .network-as-card p,
html body .network-expose-card p {
  font-size: 13.5px !important;
  color: rgba(160,190,230,.75) !important;
  -webkit-text-fill-color: rgba(160,190,230,.75) !important;
  margin-bottom: 20px !important;
  line-height: 1.6 !important;
}

/* AS table */
html body .network-as-table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin-top: 4px !important;
}
html body .network-as-table tr {
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
html body .network-as-table tr:last-child {
  border-bottom: none !important;
}
html body .network-as-table th {
  text-align: left !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  color: rgba(130,165,210,.60) !important;
  -webkit-text-fill-color: rgba(130,165,210,.60) !important;
  padding: 10px 0 10px 0 !important;
  width: 38% !important;
  vertical-align: top !important;
}
html body .network-as-table td {
  font-size: 13px !important;
  color: rgba(210,228,255,.85) !important;
  -webkit-text-fill-color: rgba(210,228,255,.85) !important;
  padding: 10px 0 10px 12px !important;
  font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace !important;
  vertical-align: top !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}
@media (max-width: 420px) {
  html body .network-as-table td {
    font-size: 11.5px !important;
  }
  html body .network-as-table th {
    font-size: 10px !important;
    width: 32% !important;
  }
}

/* Expose split */
html body .expose-split {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 20px !important;
  margin-top: 16px !important;
}
@media (max-width: 600px) {
  html body .expose-split {
    grid-template-columns: 1fr !important;
  }
}
html body .expose-col-label {
  display: block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: rgba(130,165,210,.60) !important;
  -webkit-text-fill-color: rgba(130,165,210,.60) !important;
  margin-bottom: 12px !important;
}
html body .expose-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
html body .expose-list li {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  font-size: 13px !important;
  color: rgba(200,220,255,.80) !important;
  -webkit-text-fill-color: rgba(200,220,255,.80) !important;
  line-height: 1.4 !important;
}
html body .expose-list li svg {
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0 !important;
  margin-top: 1px !important;
  stroke: rgba(100,148,230,.75) !important;
  fill: none !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
html body .expose-list.expose-peeryx li svg {
  stroke: rgba(46,201,112,.80) !important;
}

/* Looking Glass card */
html body .network-lg-card {
  max-width: 720px !important;
  margin: 0 auto !important;
}
html body .network-lg-card h2 {
  font-size: clamp(18px, 2vw, 26px) !important;
  font-weight: 800 !important;
  color: #eef3ff !important;
  -webkit-text-fill-color: #eef3ff !important;
  margin-bottom: 12px !important;
}
html body .network-lg-card > p {
  font-size: 14px !important;
  color: rgba(155,190,235,.75) !important;
  -webkit-text-fill-color: rgba(155,190,235,.75) !important;
  line-height: 1.65 !important;
  margin-bottom: 24px !important;
}
html body .network-lg-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 20px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
html body .network-lg-list li {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 14px !important;
  color: rgba(210,228,255,.85) !important;
  -webkit-text-fill-color: rgba(210,228,255,.85) !important;
}
html body .network-lg-list li svg {
  width: 18px !important;
  height: 18px !important;
  flex-shrink: 0 !important;
  stroke: rgba(100,148,230,.75) !important;
  fill: none !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
html body .network-lg-note {
  font-size: 12px !important;
  color: rgba(120,155,205,.55) !important;
  -webkit-text-fill-color: rgba(120,155,205,.55) !important;
  font-style: italic !important;
  margin-top: 8px !important;
  margin-bottom: 0 !important;
}

/* END peeryx-v200-design-system.css */