/* =========================================================
 * Astricode Web 1.7.20
 * Safe Public Visual Identity System
 *
 * Petrol · steel · code · radar
 *
 * Important:
 * Radar is rendered as CSS background imagery only.
 * It never participates in document flow.
 * ========================================================= */

:root {
  --as-petrol-0: #05171a;
  --as-petrol-1: #071b1f;
  --as-petrol-2: #092026;

  --as-steel-1: #75b2bf;
  --as-steel-2: #a4d0d4;
  --as-steel-3: #8fc4ca;

  --as-radar: rgba(126, 188, 195, .115);
  --as-code: rgba(137, 199, 205, .115);
}


/* =========================================================
 * 01 · SHARED PETROL + RADAR HERO
 *
 * The radar is literally part of the background.
 * It cannot change dimensions, margins or flow.
 * ========================================================= */

.astricode-route-home .hero,
.astricode-route-ops .hero,
.astricode-route-demo .hero,
.astricode-route-compare .compare-hero,
.astricode-route-security .security-hero,
.astricode-route-docs .docs-hero,
.astricode-route-docs-article .docs-article-hero,
.astricode-route-press .press-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  background:
    radial-gradient(
      circle at 78% 43%,

      transparent 0,
      transparent 76px,

      rgba(126,188,195,.12) 77px,
      rgba(126,188,195,.12) 78px,

      transparent 79px,
      transparent 146px,

      rgba(126,188,195,.095) 147px,
      rgba(126,188,195,.095) 148px,

      transparent 149px,
      transparent 218px,

      rgba(126,188,195,.065) 219px,
      rgba(126,188,195,.065) 220px,

      transparent 221px
    ),

    linear-gradient(
      155deg,
      var(--as-petrol-0) 0%,
      var(--as-petrol-1) 54%,
      var(--as-petrol-2) 100%
    ) !important;
}


/* =========================================================
 * 02 · REMOVE LEGACY GLOW NODES
 *
 * They remain in the HTML for now but are visually inert.
 * Display:none means they cannot affect geometry.
 * ========================================================= */

.astricode-route-home .hero-glow-b,

.astricode-route-ops .hero-glow-a,
.astricode-route-ops .hero-glow-b,

.astricode-route-demo .hero-glow-a,
.astricode-route-demo .hero-glow-b,

.astricode-route-compare .compare-glow,

.astricode-route-security .security-hero-glow,

.cta-glow,
.compare-cta-glow,
.security-cta-glow {
  display: none !important;
}


/*
 * IMPORTANT:
 * Home hero-glow-a is NOT hidden.
 *
 * 1.7.19 already uses it for the approved programming
 * texture, so we leave it untouched.
 */


/* =========================================================
 * 03 · CODE SIGNATURE
 *
 * Absolute pseudo-elements never occupy layout space.
 * ========================================================= */

.astricode-route-ops .hero::after,
.astricode-route-demo .hero::after,
.astricode-route-compare .compare-hero::after,
.astricode-route-security .security-hero::after,
.astricode-route-docs .docs-hero::after,
.astricode-route-docs-article .docs-article-hero::after,
.astricode-route-press .press-hero::after {
  content:
    "const site = inspect();\A"
    "const signals = collect(site);\A"
    "\A"
    "if (signals.needAction) {\A"
    "  protectBoundaries();\A"
    "  actWithinScope();\A"
    "}\A"
    "\A"
    "const result = verifyOutcome();\A"
    "record(result);\A"
    "\A"
    "// understand → act → verify";

  position: absolute;

  z-index: 1;

  top: 118px;
  right: 3%;

  width: min(590px, 43vw);
  height: 470px;

  overflow: hidden;

  padding: 28px 18px;

  white-space: pre;

  color: var(--as-code);

  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Monaco,
    Consolas,
    "Liberation Mono",
    monospace;

  font-size: 13px;
  font-weight: 500;
  line-height: 1.95;
  letter-spacing: .015em;

  transform: rotate(-1deg);

  pointer-events: none;

  -webkit-mask-image:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(0,0,0,.46) 18%,
      #000 46%,
      rgba(0,0,0,.76) 80%,
      transparent 100%
    );

  mask-image:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(0,0,0,.46) 18%,
      #000 46%,
      rgba(0,0,0,.76) 80%,
      transparent 100%
    );
}


/* Keep all actual hero content above decoration. */

.hero-grid,
.compare-hero-grid,
.security-hero-layout,
.docs-hero-grid,
.docs-article-hero-inner,
.press-hero-grid {
  position: relative;
  z-index: 2;
}


/* =========================================================
 * 04 · CTA RADAR AREAS
 * ========================================================= */

.astricode-route-home .cta-section,
.astricode-route-ops .cta-section,
.astricode-route-demo .cta-section,
.astricode-route-compare .compare-cta,
.astricode-route-security .security-cta,
.astricode-route-docs .docs-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  background:
    radial-gradient(
      circle at 84% 50%,

      transparent 0,
      transparent 62px,

      rgba(126,188,195,.10) 63px,
      rgba(126,188,195,.10) 64px,

      transparent 65px,
      transparent 124px,

      rgba(126,188,195,.07) 125px,
      rgba(126,188,195,.07) 126px,

      transparent 127px,
      transparent 188px,

      rgba(126,188,195,.045) 189px,
      rgba(126,188,195,.045) 190px,

      transparent 191px
    ),

    linear-gradient(
      155deg,
      #061619 0%,
      #07191d 62%,
      #081d21 100%
    ) !important;
}

.cta-inner,
.compare-cta-inner,
.security-cta-inner {
  position: relative;
  z-index: 2;
}


/* =========================================================
 * 05 · BUTTON SYSTEM
 * ========================================================= */

.button-primary {
  color: #061419 !important;

  background:
    linear-gradient(
      135deg,
      var(--as-steel-1) 0%,
      var(--as-steel-2) 100%
    ) !important;

  border-color:
    rgba(181,220,224,.56) !important;

  box-shadow:
    0 10px 26px rgba(65,125,137,.13) !important;
}

.button-primary:hover {
  color: #061419 !important;

  background:
    linear-gradient(
      135deg,
      #83bec8 0%,
      #b3dadd 100%
    ) !important;

  box-shadow:
    0 14px 30px rgba(65,125,137,.17) !important;
}


/* =========================================================
 * 06 · EYEBROW SYSTEM
 * ========================================================= */

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 14px;

  padding: 10px 16px;

  color: #bac8cb !important;

  border:
    1px solid rgba(105,169,175,.25) !important;

  border-radius: 8px !important;

  background:
    rgba(7,28,32,.48) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.018) !important;
}

.eyebrow::before {
  content: "";

  width: 32px;
  height: 2px;

  flex: 0 0 32px;

  border-radius: 999px;

  background:
    linear-gradient(
      90deg,
      #5d9ba3,
      #9bcdd0
    );

  box-shadow:
    0 0 12px rgba(117,190,195,.09);
}

.eyebrow-dot,
.eyebrow .eyebrow-dot {
  display: none !important;
}

.eyebrow-dark {
  color: #53676b !important;

  border-color:
    rgba(77,130,136,.18) !important;

  background:
    rgba(217,232,233,.40) !important;
}


/* =========================================================
 * 07 · CLEAR CARD RADAR
 *
 * Again: background only. No pseudo-element sizing.
 * ========================================================= */

.astricode-route-home .origin-stat {
  background:
    radial-gradient(
      circle at 88% 82%,

      transparent 0,
      transparent 45px,

      rgba(126,188,203,.13) 46px,
      rgba(126,188,203,.13) 47px,

      transparent 48px,
      transparent 91px,

      rgba(126,188,203,.09) 92px,
      rgba(126,188,203,.09) 93px,

      transparent 94px,
      transparent 138px,

      rgba(126,188,203,.055) 139px,
      rgba(126,188,203,.055) 140px,

      transparent 141px
    ),

    linear-gradient(
      160deg,
      #0c1b20 0%,
      #08171c 100%
    ) !important;

  box-shadow:
    0 28px 80px rgba(0,0,0,.27),
    inset 0 1px 0 rgba(255,255,255,.025) !important;
}


/* Disable previous CLEAR pseudo previews if still present in production. */

.astricode-route-home .origin-stat::before,
.astricode-route-home .origin-stat::after {
  content: none !important;
  display: none !important;
}


/* =========================================================
 * 08 · COMPARE STEEL GEOMETRY
 * ========================================================= */

.edition-orbit-ring {
  border-color:
    rgba(111,173,180,.18) !important;
}

.ring-two {
  border-color:
    rgba(94,153,161,.13) !important;
}

.orbit-connector {
  background:
    linear-gradient(
      90deg,
      transparent,
      #5d969e,
      #96c4c8,
      transparent
    ) !important;
}

.orbit-connector span {
  background: #83b7bd !important;

  box-shadow:
    0 0 0 7px rgba(131,183,189,.07),
    0 0 20px rgba(131,183,189,.13) !important;
}


/* =========================================================
 * 09 · SECURITY GEOMETRY
 * ========================================================= */

.boundary-ring,
.boundary-ring-two {
  border-color:
    rgba(104,168,175,.17) !important;
}

.boundary-core {
  background:
    linear-gradient(
      150deg,
      #13272c,
      #0b1b20
    ) !important;

  box-shadow:
    0 28px 70px rgba(0,0,0,.32) !important;
}


/* =========================================================
 * 10 · WORKFLOW ACCENTS
 * ========================================================= */

.workflow-grid::before {
  background:
    linear-gradient(
      90deg,
      #5c99a1,
      #9bcdd0
    ) !important;

  box-shadow:
    0 0 14px rgba(117,190,195,.09) !important;
}

.workflow-index {
  color: #9bcdd0 !important;

  border-color:
    rgba(108,174,181,.46) !important;
}

.workflow-card .feature-kicker {
  color: #78b4bb !important;
}


/* =========================================================
 * MOBILE
 * ========================================================= */

@media (max-width: 900px) {

  .astricode-route-ops .hero::after,
  .astricode-route-demo .hero::after,
  .astricode-route-compare .compare-hero::after,
  .astricode-route-security .security-hero::after,
  .astricode-route-docs .docs-hero::after,
  .astricode-route-docs-article .docs-article-hero::after,
  .astricode-route-press .press-hero::after {
    display: none;
  }

}

/* === ASTRICODE COMPARE CARD RADAR START === */
/* =========================================================
 * Compare cards · radar treatment
 *
 * Background imagery only.
 * Does not alter layout geometry.
 * ========================================================= */

/*
 * Main Pro comparison card.
 * Replace purple glow with technical radar geometry.
 */
.astricode-route-compare .edition-card-pro {
  border-color:
    rgba(126, 188, 195, .28) !important;

  background:
    radial-gradient(
      circle at 91% 10%,

      transparent 0,
      transparent 52px,

      rgba(126,188,195,.13) 53px,
      rgba(126,188,195,.13) 54px,

      transparent 55px,
      transparent 104px,

      rgba(126,188,195,.09) 105px,
      rgba(126,188,195,.09) 106px,

      transparent 107px,
      transparent 157px,

      rgba(126,188,195,.055) 158px,
      rgba(126,188,195,.055) 159px,

      transparent 160px
    ),

    linear-gradient(
      145deg,
      #13272c 0%,
      #0b1b20 100%
    ) !important;

  box-shadow:
    0 32px 85px rgba(5, 19, 22, .24) !important;
}


/*
 * Small Pro card in the hero orbit.
 */
.astricode-route-compare .orbit-pro {
  background:
    radial-gradient(
      circle at 88% 16%,

      transparent 0,
      transparent 38px,

      rgba(126,188,195,.12) 39px,
      rgba(126,188,195,.12) 40px,

      transparent 41px,
      transparent 78px,

      rgba(126,188,195,.075) 79px,
      rgba(126,188,195,.075) 80px,

      transparent 81px
    ),

    linear-gradient(
      145deg,
      #13272c,
      #0b1b20
    ) !important;
}


/*
 * Remove the old purple gradient border.
 */
.astricode-route-compare .orbit-pro::before {
  background:
    linear-gradient(
      135deg,
      #669da5,
      #9bcdd0,
      transparent 75%
    ) !important;
}


/*
 * Launch ribbon.
 */
.astricode-route-compare .edition-ribbon {
  color: #cfe3e6 !important;

  background:
    rgba(117, 178, 191, .14) !important;

  border:
    1px solid rgba(126, 188, 195, .14);
}


/*
 * Planned Pro additions panel.
 */
.astricode-route-compare .pro-future {
  border-color:
    rgba(126, 188, 195, .20) !important;

  background:
    rgba(111, 173, 184, .055) !important;
}

.astricode-route-compare .pro-future-head strong {
  color: #d2e5e7 !important;
}

.astricode-route-compare .pro-future-head span {
  color: #a8d0d4 !important;

  background:
    rgba(117, 178, 191, .13) !important;
}
/* === ASTRICODE COMPARE CARD RADAR END === */

/* === ASTRICODE COMPARE OVERLAP FIX START === */
/*
 * The radar belongs to the card background and therefore
 * must not alter the positioning model of card contents.
 */

.astricode-route-compare .edition-card-pro .edition-ribbon {
  position: absolute !important;
  top: 24px !important;
  right: 24px !important;
  z-index: 3 !important;
}

/*
 * Explicitly preserve the native header layout.
 */
.astricode-route-compare .edition-card-pro .edition-card-head {
  position: static !important;
}

/*
 * Preserve the original price alignment.
 */
.astricode-route-compare .edition-card-pro .edition-price {
  position: static !important;
}
/* === ASTRICODE COMPARE OVERLAP FIX END === */

/* === ASTRICODE REMAINING CARD RADARS START === */
/* =========================================================
 * Remaining card radar system
 *
 * Background/decorative imagery only.
 * No child positioning or card dimensions are modified.
 * ========================================================= */


/* ---------------------------------------------------------
 * HOME · FEATURE CARDS
 *
 * Existing ::after decoration already sits outside document
 * flow. Replace its soft violet blob with technical rings.
 * --------------------------------------------------------- */

.astricode-route-home .feature-card::after {
  background:
    repeating-radial-gradient(
      circle,

      transparent 0,
      transparent 34px,

      rgba(91, 154, 162, .12) 35px,
      rgba(91, 154, 162, .12) 36px,

      transparent 37px,
      transparent 70px
    ) !important;

  opacity: .72;

  filter: none !important;
}


/* ---------------------------------------------------------
 * HOME · PRO PLAN CARD
 * --------------------------------------------------------- */

.astricode-route-home .plan-pro {
  border-color:
    rgba(126, 188, 195, .25) !important;

  background:
    radial-gradient(
      circle at 91% 9%,

      transparent 0,
      transparent 52px,

      rgba(126,188,195,.13) 53px,
      rgba(126,188,195,.13) 54px,

      transparent 55px,
      transparent 104px,

      rgba(126,188,195,.09) 105px,
      rgba(126,188,195,.09) 106px,

      transparent 107px,
      transparent 158px,

      rgba(126,188,195,.055) 159px,
      rgba(126,188,195,.055) 160px,

      transparent 161px
    ),

    linear-gradient(
      155deg,
      #13272c 0%,
      #0b1b20 72%
    ) !important;
}

/* Kill the old violet radial accent. */
.astricode-route-home .plan-pro .pro-accent {
  display: none !important;
}

.astricode-route-home .plan-pro .plan-badge {
  color: #cfe3e6 !important;

  border-color:
    rgba(126,188,195,.18) !important;

  background:
    rgba(117,178,191,.13) !important;
}


/* ---------------------------------------------------------
 * HOME · DATABASE VISUAL CARD
 * --------------------------------------------------------- */

.astricode-route-home .database-panel {
  background:
    radial-gradient(
      circle at 86% 15%,

      transparent 0,
      transparent 44px,

      rgba(126,188,195,.12) 45px,
      rgba(126,188,195,.12) 46px,

      transparent 47px,
      transparent 88px,

      rgba(126,188,195,.08) 89px,
      rgba(126,188,195,.08) 90px,

      transparent 91px,
      transparent 133px,

      rgba(126,188,195,.045) 134px,
      rgba(126,188,195,.045) 135px,

      transparent 136px
    ),

    linear-gradient(
      145deg,
      #11252a,
      #0b1a20
    ) !important;
}


/* ---------------------------------------------------------
 * SECURITY · FEATURED PRINCIPLE CARD
 * --------------------------------------------------------- */

.astricode-route-security
.security-principle-card.principle-featured {
  border-color:
    rgba(126,188,195,.24) !important;

  background:
    radial-gradient(
      circle at 72% 20%,

      transparent 0,
      transparent 58px,

      rgba(126,188,195,.12) 59px,
      rgba(126,188,195,.12) 60px,

      transparent 61px,
      transparent 116px,

      rgba(126,188,195,.08) 117px,
      rgba(126,188,195,.08) 118px,

      transparent 119px,
      transparent 174px,

      rgba(126,188,195,.045) 175px,
      rgba(126,188,195,.045) 176px,

      transparent 177px
    ),

    linear-gradient(
      150deg,
      #12262b,
      #0b1a20
    ) !important;
}


/*
 * The circular security symbol already behaves like telemetry,
 * so retain its geometry but remove its violet lighting.
 */
.astricode-route-security
.principle-featured .principle-symbol {
  background:
    radial-gradient(
      circle,
      #152a30 0%,
      #0e1d23 67%
    ) !important;

  box-shadow:
    0 0 0 45px rgba(126,188,195,.035),
    0 0 0 90px rgba(126,188,195,.018) !important;
}


/* ---------------------------------------------------------
 * PRESS · PRIMARY LOGO PREVIEW
 * --------------------------------------------------------- */

.astricode-route-press .press-logo-preview {
  background:
    radial-gradient(
      circle at 82% 18%,

      transparent 0,
      transparent 54px,

      rgba(126,188,195,.12) 55px,
      rgba(126,188,195,.12) 56px,

      transparent 57px,
      transparent 108px,

      rgba(126,188,195,.08) 109px,
      rgba(126,188,195,.08) 110px,

      transparent 111px,
      transparent 164px,

      rgba(126,188,195,.045) 165px,
      rgba(126,188,195,.045) 166px,

      transparent 167px
    ),

    linear-gradient(
      155deg,
      #0e2227 0%,
      #09191e 66%,
      #0b1e23 100%
    ) !important;

  box-shadow:
    0 24px 60px rgba(5,19,22,.15) !important;
}


/* ---------------------------------------------------------
 * PRESS · PRO EDITION CARD
 * --------------------------------------------------------- */

.astricode-route-press .press-edition-pro {
  border-color:
    rgba(126,188,195,.24) !important;

  background:
    radial-gradient(
      circle at 91% 11%,

      transparent 0,
      transparent 42px,

      rgba(126,188,195,.12) 43px,
      rgba(126,188,195,.12) 44px,

      transparent 45px,
      transparent 84px,

      rgba(126,188,195,.075) 85px,
      rgba(126,188,195,.075) 86px,

      transparent 87px,
      transparent 127px,

      rgba(126,188,195,.04) 128px,
      rgba(126,188,195,.04) 129px,

      transparent 130px
    ),

    rgba(111,173,184,.035) !important;
}


/* ---------------------------------------------------------
 * Keep the new palette on nearby Pro labels/links.
 * --------------------------------------------------------- */

.astricode-route-press .press-edition-pro a {
  color: #9bcdd0 !important;
}

.astricode-route-home .plan-pro .plan-label {
  color: #91aeb3 !important;
}
/* === ASTRICODE REMAINING CARD RADARS END === */

/* === ASTRICODE FINAL DARK SURFACE AUTHORITY START === */
/* =========================================================
 * FINAL DARK SURFACE AUTHORITY
 *
 * One visual language across Astricode:
 * petrol base + technical radar + code.
 *
 * No hero dimensions, padding, grids or content positioning
 * are changed here.
 * ========================================================= */


/* ---------------------------------------------------------
 * HERO BACKGROUNDS
 * --------------------------------------------------------- */

.astricode-route-home .hero,

.astricode-route-ops .ops-hero,

.astricode-route-demo .hero,

.astricode-route-compare .compare-hero,

.astricode-route-security .security-hero,

.astricode-route-docs .docs-hero,

.astricode-route-docs-article .docs-article-hero,

.astricode-route-press .press-hero {
  background:

    radial-gradient(
      circle at 84% 44%,

      transparent 0,
      transparent 72px,

      rgba(126,188,195,.11) 73px,
      rgba(126,188,195,.11) 74px,

      transparent 75px,
      transparent 143px,

      rgba(126,188,195,.075) 144px,
      rgba(126,188,195,.075) 145px,

      transparent 146px,
      transparent 214px,

      rgba(126,188,195,.045) 215px,
      rgba(126,188,195,.045) 216px,

      transparent 217px
    ),

    linear-gradient(
      155deg,
      #05171a 0%,
      #071b1f 54%,
      #092026 100%
    ) !important;
}


/* ---------------------------------------------------------
 * REMOVE ALL LEGACY HERO GLOWS
 * --------------------------------------------------------- */

.astricode-route-home .hero-glow-b,

.astricode-route-ops .hero-glow-a,
.astricode-route-ops .hero-glow-b,

.astricode-route-demo .hero-glow-a,
.astricode-route-demo .hero-glow-b,

.astricode-route-compare .compare-glow,

.astricode-route-security .security-hero-glow,

.astricode-route-press .press-hero-glow,
.astricode-route-press .press-hero-glow-a,
.astricode-route-press .press-hero-glow-b {
  display: none !important;

  background: none !important;

  filter: none !important;

  box-shadow: none !important;
}


/*
 * Home hero-glow-a is intentionally retained:
 * it is the accepted programming texture, not a glow.
 */


/* ---------------------------------------------------------
 * SECONDARY DARK SECTIONS
 * --------------------------------------------------------- */

.astricode-route-ops .ops-loop-section,
.astricode-route-ops .ops-boundary-section,

.astricode-route-security .secure-delivery-section,
.astricode-route-security .security-nonclaims,

.astricode-route-docs .docs-boundary,

.section-ink {
  background:
    linear-gradient(
      155deg,
      #061619 0%,
      #07191d 62%,
      #081d21 100%
    ) !important;
}


/* ---------------------------------------------------------
 * CTA AREAS
 * --------------------------------------------------------- */

.astricode-route-home .cta-section,

.astricode-route-ops .cta-section,

.astricode-route-demo .cta-section,

.astricode-route-compare .compare-cta,

.astricode-route-security .security-cta,

.astricode-route-docs .docs-cta {
  background:

    radial-gradient(
      circle at 84% 50%,

      transparent 0,
      transparent 57px,

      rgba(126,188,195,.10) 58px,
      rgba(126,188,195,.10) 59px,

      transparent 60px,
      transparent 114px,

      rgba(126,188,195,.065) 115px,
      rgba(126,188,195,.065) 116px,

      transparent 117px,
      transparent 173px,

      rgba(126,188,195,.035) 174px,
      rgba(126,188,195,.035) 175px,

      transparent 176px
    ),

    linear-gradient(
      155deg,
      #061619 0%,
      #07191d 62%,
      #081d21 100%
    ) !important;
}


/* Legacy CTA glow elements. */

.cta-glow,
.compare-cta-glow,
.security-cta-glow {
  display: none !important;

  background: none !important;

  filter: none !important;

  box-shadow: none !important;
}


/*
 * Some older shared CTA CSS created the glow with ::before.
 * Neutralise it so the radar background above is authoritative.
 */

.astricode-route-home .cta-section::before,
.astricode-route-ops .cta-section::before,
.astricode-route-demo .cta-section::before {
  content: none !important;
  display: none !important;
}


/* ---------------------------------------------------------
 * OPS SPECIFIC LEGACY RADIAL
 *
 * ops.css originally contains:
 * - violet radial
 * - blue radial
 *
 * The explicit .ops-hero rule above overrides both.
 * --------------------------------------------------------- */

.astricode-route-ops .ops-hero {
  background:

    radial-gradient(
      circle at 84% 44%,

      transparent 0,
      transparent 72px,

      rgba(126,188,195,.11) 73px,
      rgba(126,188,195,.11) 74px,

      transparent 75px,
      transparent 143px,

      rgba(126,188,195,.075) 144px,
      rgba(126,188,195,.075) 145px,

      transparent 146px,
      transparent 214px,

      rgba(126,188,195,.045) 215px,
      rgba(126,188,195,.045) 216px,

      transparent 217px
    ),

    linear-gradient(
      155deg,
      #05171a 0%,
      #071b1f 54%,
      #092026 100%
    ) !important;
}


/* ---------------------------------------------------------
 * PRESS HERO
 *
 * press.css had two radial glows in the hero background plus
 * two additional glow elements.
 * --------------------------------------------------------- */

.astricode-route-press .press-hero {
  background:

    radial-gradient(
      circle at 84% 44%,

      transparent 0,
      transparent 72px,

      rgba(126,188,195,.11) 73px,
      rgba(126,188,195,.11) 74px,

      transparent 75px,
      transparent 143px,

      rgba(126,188,195,.075) 144px,
      rgba(126,188,195,.075) 145px,

      transparent 146px,
      transparent 214px,

      rgba(126,188,195,.045) 215px,
      rgba(126,188,195,.045) 216px,

      transparent 217px
    ),

    linear-gradient(
      155deg,
      #05171a,
      #071b1f 54%,
      #092026
    ) !important;
}


/* ---------------------------------------------------------
 * SECURITY FEATURED SURFACE
 * --------------------------------------------------------- */

.astricode-route-security
.security-principle-card.principle-featured {
  background:

    radial-gradient(
      circle at 78% 20%,

      transparent 0,
      transparent 55px,

      rgba(126,188,195,.11) 56px,
      rgba(126,188,195,.11) 57px,

      transparent 58px,
      transparent 110px,

      rgba(126,188,195,.07) 111px,
      rgba(126,188,195,.07) 112px,

      transparent 113px,
      transparent 166px,

      rgba(126,188,195,.04) 167px,
      rgba(126,188,195,.04) 168px,

      transparent 169px
    ),

    linear-gradient(
      150deg,
      #12262b,
      #0b1a20
    ) !important;
}


/* ---------------------------------------------------------
 * NO BLUR GLOW ALLOWED IN SHARED DARK VISUALS
 * --------------------------------------------------------- */

.astricode-route-home .pro-accent,

.astricode-route-security .security-cta-glow,

.astricode-route-compare .compare-cta-glow {
  filter: none !important;
}


/* ---------------------------------------------------------
 * MOBILE
 * --------------------------------------------------------- */

@media (max-width: 900px) {

  .astricode-route-home .hero,
  .astricode-route-ops .ops-hero,
  .astricode-route-demo .hero,
  .astricode-route-compare .compare-hero,
  .astricode-route-security .security-hero,
  .astricode-route-docs .docs-hero,
  .astricode-route-docs-article .docs-article-hero,
  .astricode-route-press .press-hero {

    background:

      radial-gradient(
        circle at 92% 28%,

        transparent 0,
        transparent 52px,

        rgba(126,188,195,.075) 53px,
        rgba(126,188,195,.075) 54px,

        transparent 55px,
        transparent 102px,

        rgba(126,188,195,.04) 103px,
        rgba(126,188,195,.04) 104px,

        transparent 105px
      ),

      linear-gradient(
        155deg,
        #05171a,
        #071b1f 54%,
        #092026
      ) !important;
  }

}
/* === ASTRICODE FINAL DARK SURFACE AUTHORITY END === */

/* === ASTRICODE FINAL VISUAL COHERENCE START === */
/* =========================================================
 * FINAL VISUAL COHERENCE
 *
 * Petrol · steel · code · radar.
 *
 * No layout dimensions or child positioning are changed.
 * ========================================================= */


/* ---------------------------------------------------------
 * NAVIGATION
 *
 * Every template already marks its active navigation item
 * with .nav-current. Make that state global instead of
 * depending on route-specific CSS.
 * --------------------------------------------------------- */

.main-nav a.nav-current,
.main-nav a[aria-current="page"] {
  color: #ffffff !important;
  font-weight: 700 !important;
}


/* ---------------------------------------------------------
 * HOME · FEATURE CARDS
 *
 * Replace the old diffuse violet card decoration.
 * --------------------------------------------------------- */

.astricode-route-home .feature-card::after {
  background:
    repeating-radial-gradient(
      circle,

      transparent 0,
      transparent 34px,

      rgba(126,188,195,.11) 35px,
      rgba(126,188,195,.11) 36px,

      transparent 37px,
      transparent 70px
    ) !important;

  filter: none !important;
  box-shadow: none !important;
}


/* Integrity visual: steel telemetry instead of violet glow. */

.astricode-route-home .scan-ring {
  border-color:
    rgba(126,188,195,.20) !important;
}

.astricode-route-home .ring-b {
  border-color:
    rgba(126,188,195,.13) !important;
}

.astricode-route-home .scan-core {
  background:
    radial-gradient(
      circle,
      #14292e 0%,
      #0d1c21 68%
    ) !important;

  border-color:
    rgba(126,188,195,.22) !important;

  box-shadow:
    0 0 0 28px rgba(126,188,195,.025),
    0 0 0 56px rgba(126,188,195,.012) !important;
}


/* ---------------------------------------------------------
 * FREE / PRO CARDS
 *
 * Used by Home and Ops.
 * --------------------------------------------------------- */

.plan-pro {
  border-color:
    rgba(126,188,195,.25) !important;

  background:

    radial-gradient(
      circle at 89% 11%,

      transparent 0,
      transparent 50px,

      rgba(126,188,195,.12) 51px,
      rgba(126,188,195,.12) 52px,

      transparent 53px,
      transparent 101px,

      rgba(126,188,195,.08) 102px,
      rgba(126,188,195,.08) 103px,

      transparent 104px,
      transparent 153px,

      rgba(126,188,195,.045) 154px,
      rgba(126,188,195,.045) 155px,

      transparent 156px
    ),

    linear-gradient(
      150deg,
      #13272c 0%,
      #0b1b20 100%
    ) !important;

  box-shadow:
    0 30px 80px rgba(3,17,20,.22) !important;
}

.plan-pro .pro-accent {
  display: none !important;
}

.plan-pro .plan-badge {
  color: #cfe4e6 !important;

  background:
    rgba(117,178,191,.13) !important;

  border-color:
    rgba(126,188,195,.18) !important;
}


/* ---------------------------------------------------------
 * OPS · DUAL DARK CARDS
 *
 * Both cards now use the same visual language.
 * --------------------------------------------------------- */

.astricode-route-ops .ops-panel {
  background:

    radial-gradient(
      circle at 88% 14%,

      transparent 0,
      transparent 48px,

      rgba(126,188,195,.105) 49px,
      rgba(126,188,195,.105) 50px,

      transparent 51px,
      transparent 96px,

      rgba(126,188,195,.07) 97px,
      rgba(126,188,195,.07) 98px,

      transparent 99px,
      transparent 145px,

      rgba(126,188,195,.04) 146px,
      rgba(126,188,195,.04) 147px,

      transparent 148px
    ),

    linear-gradient(
      145deg,
      #11252a 0%,
      #0b1a20 100%
    ) !important;

  border-color:
    rgba(126,188,195,.11) !important;
}


/*
 * database-panel used to add another purple radial-gradient
 * on top of .ops-panel. Neutralise that specificity.
 */

.astricode-route-ops .ops-panel.database-panel {
  background:

    radial-gradient(
      circle at 88% 14%,

      transparent 0,
      transparent 48px,

      rgba(126,188,195,.105) 49px,
      rgba(126,188,195,.105) 50px,

      transparent 51px,
      transparent 96px,

      rgba(126,188,195,.07) 97px,
      rgba(126,188,195,.07) 98px,

      transparent 99px,
      transparent 145px,

      rgba(126,188,195,.04) 146px,
      rgba(126,188,195,.04) 147px,

      transparent 148px
    ),

    linear-gradient(
      145deg,
      #11252a 0%,
      #0b1a20 100%
    ) !important;
}


/* ---------------------------------------------------------
 * OPS · HERO CONSOLE
 *
 * Keep the console. Only replace the violet accent frame.
 * --------------------------------------------------------- */

.astricode-route-ops .ops-console::before {
  background:
    linear-gradient(
      135deg,
      rgba(126,188,195,.24),
      transparent 31%,
      rgba(94,153,161,.10)
    ) !important;

  box-shadow: none !important;
}


/* ---------------------------------------------------------
 * OPS · CAPABILITY VISUALS
 *
 * They were not glows, so preserve structure and simply
 * convert violet telemetry accents to steel.
 * --------------------------------------------------------- */

.astricode-route-ops .integrity-score {
  border-color:
    rgba(126,188,195,.42) !important;

  box-shadow:
    inset 0 0 0 17px rgba(126,188,195,.06) !important;
}

.astricode-route-ops .integrity-line i {
  background:
    linear-gradient(
      90deg,
      #669da5,
      #9bcdd0
    ) !important;
}

.astricode-route-ops .performance-chart span {
  background:
    linear-gradient(
      #78b3ba,
      #456f78
    ) !important;
}

.astricode-route-ops .cleanup-bar span {
  background:
    linear-gradient(
      90deg,
      #669da5,
      #8fc4ca
    ) !important;
}


/* ---------------------------------------------------------
 * OPS · BOUNDARY SECTION
 *
 * Remove its original purple radial illumination.
 * --------------------------------------------------------- */

.astricode-route-ops .ops-boundary-section {
  background:

    radial-gradient(
      circle at 82% 45%,

      transparent 0,
      transparent 58px,

      rgba(126,188,195,.09) 59px,
      rgba(126,188,195,.09) 60px,

      transparent 61px,
      transparent 116px,

      rgba(126,188,195,.055) 117px,
      rgba(126,188,195,.055) 118px,

      transparent 119px
    ),

    linear-gradient(
      155deg,
      #061619,
      #07191d 62%,
      #081d21
    ) !important;
}


/* ---------------------------------------------------------
 * OPS · SMALL PRO SUMMARY CARD
 * --------------------------------------------------------- */

.astricode-route-ops
.edition-summary .edition-pro {
  border-color:
    rgba(126,188,195,.22) !important;

  background:

    radial-gradient(
      circle at 90% 12%,

      transparent 0,
      transparent 34px,

      rgba(126,188,195,.10) 35px,
      rgba(126,188,195,.10) 36px,

      transparent 37px,
      transparent 69px,

      rgba(126,188,195,.055) 70px,
      rgba(126,188,195,.055) 71px,

      transparent 72px
    ),

    linear-gradient(
      145deg,
      #13272c,
      #0b1b20
    ) !important;
}


/* ---------------------------------------------------------
 * COMPARE · PRO CARDS
 *
 * Preserve the layout fix already approved.
 * Background only.
 * --------------------------------------------------------- */

.astricode-route-compare .edition-card-pro {
  border-color:
    rgba(126,188,195,.28) !important;

  background:

    radial-gradient(
      circle at 91% 10%,

      transparent 0,
      transparent 52px,

      rgba(126,188,195,.13) 53px,
      rgba(126,188,195,.13) 54px,

      transparent 55px,
      transparent 104px,

      rgba(126,188,195,.09) 105px,
      rgba(126,188,195,.09) 106px,

      transparent 107px,
      transparent 157px,

      rgba(126,188,195,.055) 158px,
      rgba(126,188,195,.055) 159px,

      transparent 160px
    ),

    linear-gradient(
      145deg,
      #13272c,
      #0b1b20
    ) !important;
}


/* ---------------------------------------------------------
 * SECURITY · FEATURED CARD
 * --------------------------------------------------------- */

.astricode-route-security
.security-principle-card.principle-featured {
  border-color:
    rgba(126,188,195,.23) !important;

  background:

    radial-gradient(
      circle at 78% 20%,

      transparent 0,
      transparent 55px,

      rgba(126,188,195,.11) 56px,
      rgba(126,188,195,.11) 57px,

      transparent 58px,
      transparent 110px,

      rgba(126,188,195,.07) 111px,
      rgba(126,188,195,.07) 112px,

      transparent 113px,
      transparent 166px,

      rgba(126,188,195,.04) 167px,
      rgba(126,188,195,.04) 168px,

      transparent 169px
    ),

    linear-gradient(
      150deg,
      #12262b,
      #0b1a20
    ) !important;
}

.astricode-route-security
.principle-featured .principle-symbol {
  background:
    radial-gradient(
      circle,
      #152a30,
      #0e1d23 67%
    ) !important;

  box-shadow:
    0 0 0 45px rgba(126,188,195,.03),
    0 0 0 90px rgba(126,188,195,.015) !important;
}


/* ---------------------------------------------------------
 * PRESS · BRAND PREVIEW + PRO
 * --------------------------------------------------------- */

.astricode-route-press .press-logo-preview {
  background:

    radial-gradient(
      circle at 82% 18%,

      transparent 0,
      transparent 54px,

      rgba(126,188,195,.11) 55px,
      rgba(126,188,195,.11) 56px,

      transparent 57px,
      transparent 108px,

      rgba(126,188,195,.07) 109px,
      rgba(126,188,195,.07) 110px,

      transparent 111px,
      transparent 164px,

      rgba(126,188,195,.04) 165px,
      rgba(126,188,195,.04) 166px,

      transparent 167px
    ),

    linear-gradient(
      155deg,
      #0e2227,
      #09191e 66%,
      #0b1e23
    ) !important;
}

.astricode-route-press .press-edition-pro {
  border-color:
    rgba(126,188,195,.22) !important;

  background:

    radial-gradient(
      circle at 91% 11%,

      transparent 0,
      transparent 42px,

      rgba(126,188,195,.11) 43px,
      rgba(126,188,195,.11) 44px,

      transparent 45px,
      transparent 84px,

      rgba(126,188,195,.07) 85px,
      rgba(126,188,195,.07) 86px,

      transparent 87px,
      transparent 127px,

      rgba(126,188,195,.04) 128px,
      rgba(126,188,195,.04) 129px,

      transparent 130px
    ),

    rgba(111,173,184,.035) !important;
}


/* ---------------------------------------------------------
 * KEEP BUTTON / SIGNAL ACCENTS CONSISTENT
 * --------------------------------------------------------- */

.ops-points span,
.capability-card > span,
.signal-grid article > span,
.edition-summary article > span {
  color: #78b4bb !important;
}


/* ---------------------------------------------------------
 * SAFETY:
 * no children, dimensions or positioning are touched here.
 * --------------------------------------------------------- */

/* === ASTRICODE FINAL VISUAL COHERENCE END === */