@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700&family=Poppins:wght@300;400;500;600;700;800&family=Sora:wght@500;600;700;800&display=swap');

/* ── CSS Variables ── */
:root {
   --font-body:   "Poppins", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
   --font-heading:"Sora", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
   --safe-top:     env(safe-area-inset-top, 0px);
   --nav-core-height: 76px;
   --bg-primary:   #0b1324;
   --bg-secondary: #121c33;
   --bg-tertiary:  #182844;
   --bg-card:      rgba(14, 23, 45, 0.66);
   --surface-strong:#1b2d4b;
    --accent:       #2f8cff;
    --accent-dim:   rgba(47, 140, 255, 0.12);
      --accent-border:rgba(87, 131, 219, 0.24);
   --orange:       #ff8b4d;
   --orange-dark:  #f26f2c;
    --accent-grad:  linear-gradient(135deg, #2f8cff 0%, #61b5ff 100%);
    --orange-grad:  linear-gradient(135deg, #2f8cff 0%, #1d66ff 100%);
    --shadow-soft:  0 16px 34px rgba(0, 0, 0, 0.35);
    --shadow-lg:    0 26px 60px rgba(0, 0, 0, 0.48);
      --text-primary: #f4f8ff;
   --text-muted:   #b5c4e1;
      --white:        #f7fbff;
   --nav-height:   calc(var(--nav-core-height) + var(--safe-top));
   --radius:       14px;
    --radius-lg:    20px;
   --border-soft:  rgba(17, 39, 71, 0.14);
   --focus-ring:   0 0 0 3px rgba(47, 111, 223, 0.22);
  --transition:   0.3s ease;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
   font-family: var(--font-body);
   font-size: 16px;
  background: var(--bg-primary);
  color: var(--text-primary);
   line-height: 1.65;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
   background-image: radial-gradient(circle at 8% -8%, rgba(139,92,246,0.075), transparent 42%), radial-gradient(circle at 92% 8%, rgba(47,111,223,0.06), transparent 34%);
   background-attachment: initial;
}

::selection {
   background: rgba(47, 111, 223, 0.2);
   color: #0b1f3f;
}
img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }

a,
button,
input,
select,
textarea {
   transition: color var(--transition), background-color var(--transition), border-color var(--transition), box-shadow var(--transition), transform var(--transition), opacity var(--transition);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
   outline: none;
   box-shadow: var(--focus-ring);
}

/* ── Scrollbar ── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg-primary); }
::-webkit-scrollbar-thumb { background: var(--accent-border); border-radius: 4px; }

/* ── Typography ── */
h1, h2 { font-family: var(--font-heading); line-height: 1.18; letter-spacing: .005em; font-weight: 700; }
h3, h4, h5 { font-family: var(--font-heading); line-height: 1.3; font-weight: 600; }
h1 { font-size: clamp(2rem, 5vw, 3.6rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); }
h3 { font-size: 1.3rem; }

/* ── Utility ── */
.container { max-width: 1280px; margin: 0 auto; padding: 0 clamp(1rem, 3.2vw, 2.25rem); }
.section { padding: clamp(4.2rem, 8vw, 6.6rem) 0; position: relative; }
.section + .section::before {
   content: '';
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   height: 1px;
   background: linear-gradient(90deg, transparent 0%, rgba(17, 39, 71, 0.08) 18%, rgba(17, 39, 71, 0.08) 82%, transparent 100%);
}
.section-header { text-align: center; margin-bottom: clamp(2.2rem, 5vw, 3.8rem); }
.section-header::before {
   content: '';
   display: block;
   width: 64px;
   height: 3px;
   margin: 0 auto 0.95rem;
   border-radius: 999px;
   background: linear-gradient(90deg, transparent 0%, rgba(47, 140, 255, 0.82) 50%, transparent 100%);
   box-shadow: 0 0 18px rgba(47, 140, 255, 0.24);
}
.section-header h2 {
   color: var(--white);
   margin-bottom: 0.75rem;
   font-size: clamp(1.7rem, 3vw, 2.5rem);
   letter-spacing: .01em;
   text-wrap: balance;
}
.section-header h2 span { color: var(--accent); }
.section-header p { color: var(--text-muted); max-width: 720px; margin: 0 auto; font-size: 1rem; line-height: 1.7; }

.section-stage::before,
.section-story-alt::before {
   content: '';
   position: absolute;
   inset: 0;
   pointer-events: none;
}

.section-stage {
   background: linear-gradient(180deg, rgba(8, 14, 29, 0.98) 0%, rgba(5, 8, 22, 1) 100%);
}

.section-story-alt {
   background: linear-gradient(180deg, rgba(7, 13, 28, 0.98) 0%, rgba(4, 8, 20, 1) 100%);
}

.section-stage::before {
   background:
      radial-gradient(circle at 10% 0%, rgba(47, 140, 255, 0.16), transparent 30%),
      radial-gradient(circle at 92% 12%, rgba(255, 139, 77, 0.1), transparent 24%);
   opacity: 0.9;
}

.section-story-alt::before {
   background:
      radial-gradient(circle at 88% 0%, rgba(95, 224, 168, 0.1), transparent 26%),
      radial-gradient(circle at 8% 92%, rgba(47, 140, 255, 0.12), transparent 28%);
   opacity: 0.85;
}
.badge { display: inline-block; padding: 0.25rem 0.75rem; border-radius: 999px; font-size: 0.82rem; font-weight: 600; }
.badge-accent { background: var(--accent-dim); color: var(--accent); border: 1px solid var(--accent-border); }
.badge-orange { background: #ffffff; color: var(--orange); border: 1px solid var(--accent-border); }
.badge-green  { background: #ffffff; color: #00d464; border: 1px solid var(--accent-border); }
.text-accent  { color: var(--accent); }
.text-orange  { color: var(--orange); }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }

/* ── Buttons ── */
.btn {
  display: inline-flex; align-items: center; gap: 0.5rem;
   padding: 0.82rem 2rem; border-radius: 12px; font-weight: 600;
   font-size: 0.95rem; cursor: pointer; border: none; letter-spacing: .01em;
   transition: var(--transition), box-shadow var(--transition); font-family: var(--font-body);
}
.btn:focus-visible {
   outline: none;
   box-shadow: 0 0 0 3px rgba(47,111,223,0.28);
}
.btn-primary {
   background: var(--orange-grad); color: #ffffff;
   box-shadow: 0 8px 22px rgba(255,107,53,0.3);
}
.btn-primary:hover { background: linear-gradient(135deg, #e95f2b 0%, #ff7a46 100%); transform: translateY(-2px); box-shadow: 0 10px 26px rgba(255,107,53,0.36); }
.btn-outline {
   background: rgba(255,255,255,0.58); color: #2b63c9;
  border: 2px solid var(--accent);
}
.btn-outline:hover { background: var(--accent-grad); color: #ffffff; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(17,39,71,0.2); }
.btn:active { transform: translateY(0); }
.btn-sm { padding: 0.5rem 1.25rem; font-size: 0.85rem; }

.btn-secondary {
   background: #ffffff;
   color: var(--accent);
   border: 1px solid var(--accent-border);
}

.btn-secondary:hover {
   background: rgba(47,111,223,0.08);
   border-color: rgba(47,111,223,0.24);
}

/* ── Glass Card ── */
.card {
      background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
   border: 1px solid var(--border-soft);
   border-radius: var(--radius-lg);
  backdrop-filter: blur(12px);
         box-shadow: var(--shadow-soft);
   position: relative;
   overflow: hidden;
  transition: var(--transition);
}
.card:hover { border-color: rgba(47, 111, 223, 0.24); box-shadow: var(--shadow-lg); transform: translateY(-5px); }

@media (hover: none) {
   .card:hover {
      transform: none;
      box-shadow: 0 10px 24px rgba(17, 39, 71, 0.09);
   }
}

/* ════════════════════════════════════════
   NAVIGATION
═══════════════════════════════════════ */
.navbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
   height: var(--nav-height);
   padding-top: var(--safe-top);
  display: flex; align-items: center;
    background: rgba(3, 10, 28, 0.9);
  backdrop-filter: blur(16px);
   border-bottom: 1px solid var(--border-soft);
  transition: background var(--transition);
}
.navbar.scrolled { background: rgba(2, 8, 24, 0.96); box-shadow: 0 12px 26px rgba(0,0,0,0.34); }
.nav-inner { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.nav-logo {
   display: flex;
   align-items: center;
   gap: 0;
   min-height: 44px;
   font-size: 0;
   color: transparent;
}
.nav-logo::before {
   content: '';
   display: block;
   width: 312px;
   height: 72px;
   background: center / contain no-repeat url('../assets/NewLogo-tight.png');
   flex-shrink: 0;
}
.nav-logo span,
.nav-logo i {
   display: none;
}
.footer-brand .nav-logo::before {
   width: 320px;
   height: 74px;
}
.nav-links { display: flex; align-items: center; gap: 1.2rem; }
.nav-links a { color: var(--text-primary); font-size: 0.92rem; font-weight: 600; transition: color var(--transition); position: relative; padding: .2rem 0; }
.nav-links a::after { content: ''; position: absolute; bottom: -4px; left: 0; width: 0; height: 2px; background: var(--accent); transition: width var(--transition); }
.nav-links a:hover, .nav-links a.active { color: #8fc0ff; }
.nav-links a:hover::after, .nav-links a.active::after { width: 100%; }
.nav-dropdown {
   position: relative;
   display: inline-flex;
   align-items: center;
}
.nav-dropdown.open .nav-dropdown-menu {
   opacity: 1;
   visibility: visible;
   transform: translateY(0);
}
.nav-dropdown-toggle {
   display: inline-flex;
   align-items: center;
   gap: 0.4rem;
}
.nav-dropdown-toggle i {
   font-size: 0.72rem;
   transition: transform var(--transition);
}
.nav-dropdown-menu {
   position: absolute;
   top: calc(100% + 0.9rem);
   left: 0;
   min-width: 290px;
   background: #ffffff;
   border: 1px solid var(--accent-border);
   border-radius: 12px;
   box-shadow: 0 16px 34px rgba(17,39,71,0.14);
   padding: 0.42rem;
   display: grid;
   gap: 0.15rem;
   opacity: 0;
   visibility: hidden;
   transform: translateY(8px);
   transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
   z-index: 1001;
}
.nav-dropdown-menu a {
   padding: 0.52rem 0.7rem;
   border-radius: 8px;
   font-size: 0.86rem;
   font-weight: 600;
}
.nav-dropdown-menu a::after {
   display: none;
}
.nav-dropdown-toggle:focus-visible,
.nav-dropdown-menu a:focus-visible {
   outline: none;
   box-shadow: none;
   color: #8fc0ff;
   text-decoration: underline;
   text-underline-offset: 0.28em;
}
.nav-dropdown-menu a:hover,
.nav-dropdown-menu a.active {
   background: var(--accent-dim);
   color: var(--accent);
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu,
.nav-dropdown-toggle[aria-expanded="true"] + .nav-dropdown-menu {
   opacity: 1;
   visibility: visible;
   transform: translateY(0);
}
.nav-dropdown:hover .nav-dropdown-toggle i,
.nav-dropdown:focus-within .nav-dropdown-toggle i,
.nav-dropdown.open .nav-dropdown-toggle i,
.nav-dropdown-toggle.active i,
.nav-dropdown-toggle[aria-expanded="true"] i {
   transform: rotate(180deg);
}

.page-status-banner {
   position: fixed;
   top: calc(var(--nav-core-height) + var(--safe-top));
   left: 0;
   right: 0;
   z-index: 999;
   padding: 0.68rem 1rem;
   background: #fff7ed;
   color: #7c2d12;
   border-bottom: 1px solid rgba(255, 107, 53, 0.24);
   text-align: center;
   font-size: 0.9rem;
   font-weight: 600;
   transform: translateY(-120%);
   opacity: 0;
   pointer-events: none;
   transition: transform var(--transition), opacity var(--transition);
}

.page-status-banner.show {
   transform: translateY(0);
   opacity: 1;
}

.u-hidden-honeypot {
   position: absolute !important;
   left: -10000px !important;
   width: 1px !important;
   height: 1px !important;
   opacity: 0 !important;
   pointer-events: none !important;
}

.page-status-banner[data-type="offline"] {
   background: #eff6ff;
   color: #1e3a8a;
   border-bottom-color: rgba(47, 111, 223, 0.24);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
   .card,
   .navbar,
   .mobile-sticky-cta {
      backdrop-filter: none;
      background: #f8faff;
   }
}
.nav-cta {
   margin-left: 1rem;
   line-height: 1.2;
}

.nav-links a.nav-cta {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   padding: 0.52rem 1.65rem;
}

.nav-links a.nav-cta::after {
   display: none;
}
.hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 4px; }
.hamburger span { display: block; width: 24px; height: 2px; background: var(--text-primary); border-radius: 2px; transition: var(--transition); }
.hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

/* ════════════════════════════════════════
   HERO
═══════════════════════════════════════ */
.hero {
   min-height: calc(100vh - 6px);
   min-height: 100dvh;
   min-height: calc(100dvh - 6px);
   display: flex; align-items: center;
  position: relative; overflow: hidden;
   padding-top: calc(var(--nav-height) + 0.2rem);
   padding-bottom: 2.2rem;
}
.hero-bg {
  position: absolute; inset: 0; z-index: 0;
   background:
      radial-gradient(circle at 14% 50%, rgba(15, 68, 156, 0.26), transparent 34%),
      radial-gradient(circle at 86% 22%, rgba(47, 140, 255, 0.22), transparent 26%),
      linear-gradient(100deg, #02091f 0%, #031233 44%, #041230 60%, #031028 100%);
}
.cyber-grid {
  position: absolute; inset: 0; z-index: 0;
  background-image:
    linear-gradient(rgba(68, 138, 255, 0.11) 1px, transparent 1px),
    linear-gradient(90deg, rgba(68, 138, 255, 0.11) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at 34% 50%, rgba(0,0,0,0.66) 0%, transparent 74%);
  opacity: 0.24;
}
.hero-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; align-items: center; }
.hero-content { padding: 1.7rem 0 0.4rem; max-width: 720px; }
.hero-visual { position: relative; display: flex; align-items: flex-end; justify-content: flex-end; min-height: 520px; }
.hero-visual::before {
   content: '';
   position: absolute;
   inset: 2% 4% 8% 12%;
   border-radius: 32px;
   border: 1px solid rgba(68, 138, 255, 0.38);
   box-shadow: 0 0 0 1px rgba(68, 138, 255, 0.18), 0 0 50px rgba(48, 124, 255, 0.38);
   pointer-events: none;
}
.hero-visual::after {
   content: '';
   position: absolute;
   inset: 0;
   background:
     linear-gradient(110deg, rgba(2, 8, 24, 0.66) 12%, rgba(2, 8, 24, 0) 56%),
     radial-gradient(circle at 58% 34%, rgba(49, 139, 255, 0.26), transparent 30%);
   pointer-events: none;
}
.hero-visual-orb {
   position: absolute;
   width: 420px;
   height: 420px;
   right: 15%;
   bottom: 4%;
   border-radius: 50%;
   border: 2px solid rgba(66, 145, 255, 0.42);
   box-shadow: 0 0 48px rgba(47, 140, 255, 0.32);
   opacity: 0.68;
   pointer-events: none;
}
.hero-img {
   width: min(100%, 640px);
   max-width: 640px;
   border-radius: 28px;
   box-shadow: 0 28px 66px rgba(0,0,0,0.42);
   object-fit: cover;
   aspect-ratio: 4 / 3;
   border: 1px solid rgba(66,145,255,0.22);
   filter: saturate(1.06) contrast(1.04) brightness(0.84) hue-rotate(4deg);
}
.hero-kicker {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   padding: 0.56rem 1.22rem;
   border-radius: 999px;
   border: 1px solid rgba(66,145,255,0.42);
   background: rgba(4, 22, 60, 0.62);
   color: #c8ddff;
   font-size: 0.88rem;
   font-weight: 700;
   letter-spacing: 0.08em;
   text-transform: uppercase;
   margin-bottom: 1.25rem;
}
.hero-label {
   display: inline-flex;
   align-items: flex-start;
   gap: 0.5rem;
   margin-bottom: 1.5rem;
   max-width: min(100%, 760px);
   line-height: 1.55;
   white-space: normal;
}
.hero-label i { color: var(--accent); animation: pulse 2s infinite; }
.hero h1 { color: var(--white); margin-bottom: 1.25rem; }
.hero h1 .highlight {
  color: var(--accent);
   text-shadow: 0 0 26px rgba(47,111,223,0.24);
}
.hero h1 {
   font-size: clamp(2.2rem, 4.6vw, 4.35rem);
   line-height: 1.04;
   letter-spacing: -0.01em;
   max-width: 12.8ch;
}
.hero p {
   font-size: 1.05rem;
   color: #c5d4ef;
   max-width: 620px;
   margin-bottom: 1.8rem;
}
.hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.hero-actions .btn {
   min-width: 220px;
   justify-content: center;
   font-size: 1.02rem;
   border-radius: 14px;
   padding: 0.86rem 1.45rem;
}
.hero-actions .btn-outline {
   border-color: rgba(66,145,255,0.5);
   background: rgba(2, 16, 48, 0.58);
   color: #e8f2ff;
}
.hero-proof-grid {
   position: relative;
   z-index: 2;
   margin-top: 1.15rem;
   display: grid;
   grid-template-columns: repeat(4, minmax(0, 1fr));
   gap: 0.85rem;
}
.hero-proof-card {
   display: flex;
   gap: 0.85rem;
   align-items: center;
   padding: 1.08rem 1.05rem;
   border-radius: 18px;
   border: 1px solid rgba(66,145,255,0.34);
   background: linear-gradient(180deg, rgba(4, 16, 42, 0.86) 0%, rgba(3, 12, 30, 0.95) 100%);
   box-shadow: 0 12px 28px rgba(0,0,0,0.24);
}
.hero-proof-icon {
   width: 56px;
   height: 56px;
   flex-shrink: 0;
   border-radius: 50%;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   border: 1px solid rgba(66,145,255,0.42);
   color: #59b7ff;
   font-size: 1.32rem;
   background: radial-gradient(circle at 30% 25%, rgba(47,140,255,0.34), rgba(4,20,56,0.86));
}
.hero-proof-card h3 {
   margin: 0;
   font-size: 1.04rem;
   color: #eaf2ff;
}
.hero-proof-card p {
   margin: 0.1rem 0 0;
   font-size: 0.92rem;
   color: #adbfde;
}
.hero-trust-row {
   display: flex;
   flex-wrap: wrap;
   gap: 0.65rem;
   margin-top: 1.15rem;
}
.hero-trust-row span {
   display: inline-flex;
   align-items: center;
   gap: 0.4rem;
   border: 1px solid var(--accent-border);
   border-radius: 999px;
   background: #ffffff;
   color: var(--text-muted);
   padding: 0.42rem 0.7rem;
   font-size: 0.82rem;
   font-weight: 600;
}
.hero-trust-row i { color: var(--accent); }
.hero-stats { display: flex; gap: 2.25rem; margin-top: 3.25rem; flex-wrap: wrap; }
.hero-stat strong { display: block; font-family: var(--font-heading); font-size: 1.8rem; color: var(--accent); }
.hero-stat span { font-size: 0.85rem; color: var(--text-muted); }

body[data-hero-source="api"] .hero {
   min-height: 100vh;
   min-height: 100dvh;
   padding-top: calc(var(--nav-height) + 0.8rem);
   display: flex;
   align-items: center;
   background: #020817;
}

body[data-hero-source="api"] .hero-inner {
   display: grid;
   grid-template-columns: 1fr;
   gap: 1.2rem;
   align-items: center;
}

body[data-hero-source="api"] .hero-content {
   padding: 0.25rem 0 0;
   max-width: 760px;
}

body[data-hero-source="api"] .hero h1 {
   margin: 0 0 1.25rem;
   font-size: clamp(2.15rem, 4.2vw, 4.6rem);
   line-height: 1.08;
   color: var(--white);
   letter-spacing: -0.01em;
   max-width: 14.8ch;
}

body[data-hero-source="api"] .hero h1 .highlight {
   color: #8fc0ff;
   text-shadow: 0 0 32px rgba(47, 140, 255, 0.24);
}

body[data-hero-source="api"] .hero p {
   margin: 0 0 1.1rem;
   max-width: 620px;
   color: #d7e6ff;
   font-size: 1.01rem;
   border-left: 3px solid rgba(66, 145, 255, 0.5);
   padding-left: 1rem;
}

body[data-hero-source="api"] .hero-actions {
   display: flex;
   gap: 0.75rem;
   flex-wrap: wrap;
}

body[data-hero-source="api"] .hero-actions .btn {
   display: inline-flex;
   align-items: center;
   gap: 0.5rem;
   border-radius: 12px;
   padding: 0.78rem 1.2rem;
   font-size: 0.95rem;
   font-weight: 600;
   text-decoration: none;
   border: 0;
}

body[data-hero-source="api"] .hero-actions .btn-primary {
   background: var(--orange-grad);
   color: #ffffff;
}

body[data-hero-source="api"] .hero-actions .btn-outline {
   background: rgba(2, 16, 48, 0.58);
   border: 2px solid rgba(66, 145, 255, 0.5);
   color: #e8f2ff;
}

body[data-hero-source="api"] .hero-bg {
   background:
      linear-gradient(90deg, rgba(2, 8, 24, 0.92) 0%, rgba(2, 8, 24, 0.80) 32%, rgba(2, 8, 24, 0.44) 58%, rgba(2, 8, 24, 0.08) 100%),
      url('../assets/hero-reference-bg.png') 88% 50% / cover no-repeat;
   opacity: 1;
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
   box-shadow: none;
}

body[data-hero-source="api"] .hero .cyber-grid {
   opacity: 0.08;
   mask-image: radial-gradient(ellipse at 36% 50%, rgba(0, 0, 0, 0.22) 0%, transparent 78%);
}

body[data-hero-source="api"] .hero-proof-card {
   transition: transform 0.26s ease, box-shadow 0.26s ease, border-color 0.26s ease;
}

body[data-hero-source="api"] .hero-proof-card:nth-child(2) {
   transform: translateY(4px);
}

body[data-hero-source="api"] .hero-proof-card:nth-child(3) {
   transform: translateY(8px);
}

body[data-hero-source="api"] .hero-proof-card:nth-child(4) {
   transform: translateY(12px);
}

/* ════════════════════════════════════════
   STATS BAR
═══════════════════════════════════════ */
.stats-bar {
    background: transparent;
   border-top: 0;
   border-bottom: 0;
   padding: 0.8rem 0 0.2rem;
}
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; text-align: center; border: 1px solid var(--border-soft); border-radius: 16px; background: #ffffff; padding: 1.1rem 0.8rem; box-shadow: 0 10px 22px rgba(17, 39, 71, 0.07); }
.stat-item { position: relative; }
.stat-item:not(:last-child)::after { content: ''; position: absolute; right: -0.35rem; top: 18%; bottom: 18%; width: 1px; background: var(--border-soft); }
.stat-item strong { display: block; font-family: var(--font-heading); font-size: 2rem; color: var(--accent); }
.stat-item span { color: var(--text-muted); font-size: 0.9rem; }

/* ════════════════════════════════════════
   WHY THE PERSISTENCE ACADEMY
═══════════════════════════════════════ */
.why-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.25rem; align-items: stretch; }
.why-card {
   padding: 1.75rem 1.3rem;
   text-align: center;
   min-height: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 0.7rem;
   background: linear-gradient(180deg, rgba(10, 18, 36, 0.92) 0%, rgba(7, 12, 24, 0.98) 100%);
   border-color: rgba(87, 131, 219, 0.22);
   box-shadow: 0 20px 48px rgba(2, 8, 24, 0.28);
   border-top: 2px solid rgba(47, 140, 255, 0.38);
}
.why-card i,
.course-card-icon,
.u-feature-icon {
   width: 54px;
   height: 54px;
   border-radius: 14px;
   border: 1px solid rgba(47,111,223,0.18);
   background: rgba(47,111,223,0.08);
   display: inline-flex;
   align-items: center;
   justify-content: center;
}
.why-card i { font-size: 1.5rem; color: var(--accent); margin-bottom: 0.1rem; }
.why-card h3 { font-size: 1.04rem; color: var(--white); margin-bottom: 0.15rem; line-height: 1.38; }
.why-card p { font-size: 0.88rem; color: var(--text-muted); line-height: 1.62; }

/* ════════════════════════════════════════
   COURSES GRID
═══════════════════════════════════════ */
.courses-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.35rem; align-items: stretch; }
.course-card {
   padding: 1.55rem;
   display: flex;
   flex-direction: column;
   gap: 0.9rem;
   height: 100%;
   border: 1px solid rgba(94, 156, 255, 0.3);
   background: linear-gradient(180deg, rgba(10, 18, 36, 0.96) 0%, rgba(6, 11, 24, 0.98) 100%);
   border-top: 2px solid rgba(47, 140, 255, 0.42);
   box-shadow: 0 18px 44px rgba(2, 8, 24, 0.24);
}
.course-card-icon { flex-shrink: 0; }
.course-card-icon i { font-size: 1.5rem; color: var(--accent); }
.course-card-media {
   position: relative;
   width: calc(100% + 0.7rem);
   margin: -0.35rem -0.35rem 0;
   aspect-ratio: 16 / 9;
   height: auto;
   flex-shrink: 0;
   border-radius: 12px;
   overflow: hidden;
   border: 1px solid rgba(47,111,223,0.18);
   background: rgba(5, 12, 28, 0.72);
}
.course-card-media-image,
.course-card-media-video {
   width: 100%;
   height: 100%;
   object-fit: contain;
   object-position: center;
   display: block;
}
.course-card h3 { color: var(--white); font-size: 1.12rem; line-height: 1.4; font-weight: 600; }
.course-card p { color: rgba(220, 233, 255, 0.88); font-size: 0.9rem; line-height: 1.6; flex: 1; }
.course-meta { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.course-card .btn { align-self: flex-start; margin-top: auto; }
.course-card .btn-outline {
   background: rgba(10, 18, 36, 0.78);
   color: #dbe8ff;
   border-color: rgba(102, 162, 255, 0.55);
}
.course-card .btn-outline:hover {
   background: rgba(47, 140, 255, 0.22);
   color: #ffffff;
   border-color: rgba(131, 183, 255, 0.82);
}
.filter-bar { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 2rem; }
.filter-btn { padding: 0.52rem 1.28rem; border-radius: 999px; background: #ffffff; border: 1px solid var(--border-soft); color: var(--text-primary); cursor: pointer; font-size: 0.85rem; font-weight: 500; transition: var(--transition); }
.filter-btn:hover, .filter-btn.active { background: rgba(47,111,223,0.08); color: #2b63c9; border-color: rgba(47,111,223,0.22); }

.accelerator-grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 1.2rem;
}

.accelerator-card {
   padding: 1.35rem;
   display: flex;
   flex-direction: column;
   gap: 0.7rem;
   background: linear-gradient(180deg, rgba(10, 18, 36, 0.92) 0%, rgba(7, 12, 24, 0.98) 100%);
   border-color: rgba(87, 131, 219, 0.22);
   box-shadow: 0 20px 48px rgba(2, 8, 24, 0.28);
   border-top: 2px solid rgba(255, 139, 77, 0.38);
}

.accelerator-step {
   width: 44px;
   height: 44px;
   border-radius: 12px;
   background: rgba(47,111,223,0.08);
   color: var(--accent);
   display: inline-flex;
   align-items: center;
   justify-content: center;
   font-family: var(--font-heading);
}
.catalog-highlights {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 1rem;
   margin: 0 0 2rem;
}

.catalog-highlight-card {
   border: 1px solid var(--accent-border);
   border-radius: 12px;
   background: #ffffff;
   padding: 1rem 1.2rem;
}

.catalog-highlight-card strong {
   display: block;
   color: var(--white);
   font-family: var(--font-heading);
   font-weight: 600;
   font-size: 1rem;
   margin-bottom: 0.2rem;
}

.catalog-highlight-card span {
   color: var(--text-muted);
   font-size: 0.88rem;
}

/* ════════════════════════════════════════
   BATCHES TABLE
═══════════════════════════════════════ */
.batch-table-wrap { overflow-x: auto; }
.batch-table { width: 100%; border-collapse: collapse; }
.batch-table th, .batch-table td { padding: 1rem 1.25rem; text-align: left; border-bottom: 1px solid var(--accent-border); font-size: 0.9rem; }
.batch-table th { color: var(--accent); font-family: var(--font-body); font-weight: 700; font-size: 0.86rem; letter-spacing: 0.03em; background: var(--bg-card); }
.batch-table tr:hover td { background: #ffffff; }
.seats-pill { display: inline-block; padding: 0.2rem 0.6rem; border-radius: 999px; font-size: 0.86rem; font-weight: 600; }
.batch-session-pill { display: inline-block; padding: 0.2rem 0.65rem; border-radius: 999px; font-size: 0.86rem; font-weight: 700; border: 1px solid var(--accent-border); background: var(--accent-dim); color: var(--accent); }
.batch-session-morning { background: rgba(95, 224, 168, 0.12); color: #5fe0a8; }
.batch-session-afternoon { background: rgba(255, 201, 71, 0.14); color: #ffc947; }
.batch-session-evening { background: rgba(47, 140, 255, 0.16); color: #7ab6ff; }
.seats-low { background: #ffffff; color: var(--orange); border: 1px solid var(--accent-border); }
.seats-ok  { background: #ffffff; color: #00d464; border: 1px solid var(--accent-border); }

/* ════════════════════════════════════════
   CERTIFICATIONS ROW
═══════════════════════════════════════ */
.cert-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem; }
.cert-badge {
  padding: 0.75rem 1.75rem;
  background: var(--bg-card);
  border: 1px solid var(--accent-border);
  border-radius: 999px;
  font-size: 0.9rem; font-weight: 600;
  color: var(--text-muted);
  transition: var(--transition);
}
.cert-badge:hover { color: var(--accent); border-color: var(--accent); }

/* Reusable utilities for removing inline styles */
.u-text-center { text-align: center; }
.u-mt-lg { margin-top: 2.5rem; }
.u-mb-md { margin-bottom: 1rem; }
.u-mb-sm { margin-bottom: .25rem; }
.u-mb-lg { margin-bottom: 2rem; }
.u-mb-xl { margin-bottom: 1.25rem; }
.u-muted { color: var(--text-muted); }
.u-flex-center { display: flex; justify-content: center; align-items: center; }
.u-flex-wrap { flex-wrap: wrap; }
.u-gap-sm { gap: 0.75rem; }
.u-gap-md { gap: 1rem; }
.u-max-600 { max-width: 600px; margin-left: auto; margin-right: auto; }
.u-max-680 { max-width: 680px; margin-left: auto; margin-right: auto; }
.u-max-700 { max-width: 700px; margin-left: auto; margin-right: auto; }
.u-max-780 { max-width: 780px; margin-left: auto; margin-right: auto; }
.u-footer-compact { padding-top: 0 !important; border-top: none !important; }
.u-w-100 { width: 100%; }

.cta-block {
   text-align: center;
   max-width: 680px;
   margin: 0 auto;
}

.cta-block p { color: var(--text-muted); }

.surface-soft {
   background: var(--bg-secondary);
}

.meta-line {
   display: flex;
   gap: 1rem;
   justify-content: center;
   align-items: center;
   margin-bottom: 1rem;
   flex-wrap: wrap;
}

.u-meta-text {
   color: var(--text-muted);
   font-size: .88rem;
}

.u-inline-flex { display: inline-flex; }
.u-flex { display: flex; }
.u-flex-1 { flex: 1; }
.u-stack-md { display: flex; flex-direction: column; gap: 1rem; }

.u-feature-row { display: flex; gap: 1rem; align-items: flex-start; }
.u-feature-icon {
   flex-shrink: 0;
}

.u-text-sm-muted {
   color: var(--text-muted);
   font-size: .88rem;
}

.u-text-white { color: var(--white); }

.u-mr-sm { margin-right: .5rem; }
.u-mt-md { margin-top: .75rem; }

.u-pill-gap { gap: .75rem; }

.u-mx-auto { margin-left: auto; margin-right: auto; }

.u-pt-lg { padding-top: 2rem; }

.u-border-top { border-top: 1px solid var(--accent-border); }

.u-loading-text {
   text-align: center;
   color: var(--text-muted);
}

.u-section-soft {
   background: var(--bg-secondary);
}

.u-py-xl { padding: 2rem 0; }

.u-tags-row {
   margin: 2rem auto 0;
   gap: .5rem;
}

.u-justify-start { justify-content: flex-start; }

.u-note {
   text-align: center;
   margin-top: 1rem;
   font-size: .88rem;
   color: var(--text-muted);
}

.u-note i { color: var(--accent); }

.u-note .ok { color: #00d464; }
.ok { color: #00d464; }

.js-enabled [data-hydrate] {
   opacity: 0;
   visibility: hidden;
   transform: translateY(8px);
}

.js-enabled [data-hydrate].is-hydrated {
   opacity: 1;
   visibility: visible;
   transform: translateY(0);
   transition: opacity 0.26s ease, transform 0.26s ease;
}

.proof-chip span {
   color: var(--text-muted);
   font-size: 0.79rem;
}

.skeleton {
   position: relative;
   overflow: hidden;
   background: #eef3fb;
}

.skeleton::after {
   content: '';
   position: absolute;
   inset: 0;
   transform: translateX(-100%);
   background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0) 100%);
   animation: shimmer 1.2s infinite;
}

.skeleton-card {
   border: 1px solid var(--accent-border);
   border-radius: 14px;
   background: #ffffff;
   padding: 1.2rem;
   min-height: 190px;
}

.skeleton-line {
   height: 11px;
   border-radius: 999px;
   margin-bottom: 0.5rem;
}

.skeleton-line.lg { height: 16px; width: 74%; }
.skeleton-line.md { width: 62%; }
.skeleton-line.sm { width: 45%; }
.skeleton-media { height: 120px; border-radius: 10px; margin-bottom: .8rem; }
.skeleton-pill { height: 48px; }
.skeleton-row { height: 18px; border-radius: 8px; }

.mobile-sticky-cta {
   position: fixed;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: 997;
   background: rgba(255,255,255,0.98);
   border-top: 1px solid var(--accent-border);
   backdrop-filter: blur(10px);
   padding: 0.7rem 0.9rem calc(0.7rem + env(safe-area-inset-bottom));
   display: none;
}

.mobile-sticky-cta .mobile-sticky-inner {
   display: grid;
   grid-template-columns: 1fr;
   gap: 0.6rem;
}

.mobile-sticky-cta .btn {
   justify-content: center;
   width: 100%;
   padding: 0.7rem 0.9rem;
}

.mobile-sticky-cta-spacer {
   display: none;
   height: 82px;
}

.get-in-touch-shell {
   position: fixed;
   right: 1.1rem;
   bottom: 1.1rem;
   z-index: 998;
   display: flex;
   flex-direction: column;
   align-items: flex-end;
   gap: 0.55rem;
}

.get-in-touch-fab {
   border: 0;
   border-radius: 999px;
   background: var(--orange-grad);
   color: #ffffff;
   font-weight: 700;
   font-size: 0.88rem;
   display: inline-flex;
   align-items: center;
   gap: 0.45rem;
   padding: 0.72rem 1.05rem;
   box-shadow: 0 12px 30px rgba(255,107,53,0.3);
   cursor: pointer;
}

.get-in-touch-fab:hover {
   transform: translateY(-1px);
   box-shadow: 0 14px 34px rgba(255,107,53,0.36);
}

.get-in-touch-fab:focus-visible {
   outline: none;
   box-shadow: 0 0 0 3px rgba(47,111,223,0.24), 0 12px 30px rgba(255,107,53,0.3);
}

.get-in-touch-panel {
   min-width: 240px;
   border: 1px solid var(--accent-border);
   border-radius: 14px;
   background: #ffffff;
   box-shadow: var(--shadow-lg);
   padding: 0.42rem;
   display: grid;
   gap: 0.3rem;
   max-height: 0;
   opacity: 0;
   transform: translateY(10px);
   pointer-events: none;
   overflow: hidden;
   transition: max-height 0.24s ease, opacity 0.2s ease, transform 0.24s ease;
}

.get-in-touch-shell.open .get-in-touch-panel {
   max-height: 220px;
   opacity: 1;
   transform: translateY(0);
   pointer-events: auto;
}

.get-in-touch-panel a {
   display: inline-flex;
   align-items: center;
   gap: 0.45rem;
   border-radius: 10px;
   color: var(--text-primary);
   font-size: 0.86rem;
   font-weight: 600;
   padding: 0.55rem 0.62rem;
}

.get-in-touch-panel a:hover {
   background: var(--accent-dim);
}

.get-in-touch-panel a:focus-visible {
   outline: none;
   background: var(--accent-dim);
   box-shadow: inset 0 0 0 2px rgba(47,111,223,0.34);
}

.contact-map-wrap {
   border-radius: var(--radius);
   overflow: hidden;
   border: 1px solid var(--accent-border);
}

.contact-map-box {
   background: var(--bg-card);
   min-height: 240px;
}

.contact-map-embed {
   width: 100%;
   height: 240px;
   border: 0;
   display: block;
}

.contact-map-link-row {
   padding: 0.7rem 0.9rem;
   border-top: 1px solid var(--accent-border);
   background: var(--bg-soft);
}

.contact-map-link-row a {
   display: inline-flex;
   align-items: center;
   gap: 0.4rem;
}

.icon-lg { font-size: 2rem; }

/* ════════════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════════ */
#testimonials { padding-bottom: clamp(5rem, 9vw, 7.4rem); }
.testimonials-layout { display: block; }
.testimonials-track {
   --testimonial-gap: 1.5rem;
   display: flex;
   gap: var(--testimonial-gap);
   overflow-x: auto;
   scroll-snap-type: x mandatory;
   padding-bottom: 1rem;
   scrollbar-width: none;
}
.testimonials-track::-webkit-scrollbar { display: none; }
.testimonials-track.is-empty {
   justify-content: center;
   overflow: hidden;
}
.testimonial-card {
   flex: 0 0 calc((100% - var(--testimonial-gap)) / 2);
   min-width: 0;
   max-width: none;
   height: 520px;
   padding: 2rem;
   scroll-snap-align: start;
}
.testimonial-card {
   display: flex;
   flex-direction: column;
   background: linear-gradient(180deg, rgba(10, 18, 36, 0.92) 0%, rgba(7, 12, 24, 0.98) 100%);
   border-color: rgba(87, 131, 219, 0.2);
   box-shadow: 0 16px 40px rgba(2, 8, 24, 0.22);
   border-top: 2px solid rgba(255, 203, 71, 0.34);
}
.testimonial-stars { color: #ffc947; font-size: 0.85rem; margin-bottom: 1.2rem; flex: none; }
.testimonial-media {
   flex: none;
   margin: -0.25rem 0 1rem;
}

.testimonial-video-frame {
   position: relative;
   display: grid;
   place-items: center;
   width: 100%;
   aspect-ratio: 16 / 9;
   overflow: hidden;
   border-radius: 10px;
   border: 1px solid rgba(87, 131, 219, 0.28);
   background: rgba(5, 12, 28, 0.78);
   color: var(--text-primary);
}

.testimonial-video-frame iframe,
.testimonial-video-frame video,
.testimonial-video-frame img {
   width: 100%;
   height: 100%;
   border: 0;
   object-fit: cover;
   display: block;
}

.testimonial-video-link {
   text-decoration: none;
}

.testimonial-video-link span {
   position: absolute;
   inset: auto 1rem 1rem;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: .45rem;
   padding: .55rem .85rem;
   border-radius: 999px;
   background: rgba(3, 8, 21, 0.82);
   color: #ffffff;
   font-weight: 700;
   font-size: .86rem;
}

.testimonial-card-video .testimonial-quote {
   flex: 1 1 auto;
   min-height: 0;
   margin-bottom: 1rem;
}

.testimonial-quote-empty {
   color: var(--text-muted);
   font-style: normal;
}
.testimonial-empty-card {
   min-width: min(100%, 560px);
   max-width: 560px;
   border-top-color: rgba(87, 131, 219, 0.34);
}
.testimonial-empty-card h3 {
   color: var(--white);
   margin-bottom: .55rem;
}
.testimonial-empty-card p {
   color: var(--text-muted);
   margin-bottom: .9rem;
}
.testimonial-open-btn {
   position: relative;
   justify-content: center;
   width: min(100%, 320px);
   min-height: 52px;
   padding-inline: 1.25rem 3.25rem;
}

.testimonial-open-btn-label {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
   white-space: nowrap;
}

.testimonial-open-btn-icon {
   position: absolute;
   right: 1.15rem;
}

.testimonial-quote {
   color: var(--text-primary);
   font-size: 0.92rem;
   font-style: italic;
   line-height: 1.72;
   margin-bottom: 1.4rem;
   padding-right: .5rem;
   overflow-y: auto;
   flex: 1 1 auto;
   min-height: 0;
   scrollbar-width: thin;
   scrollbar-color: rgba(87, 131, 219, 0.7) rgba(87, 131, 219, 0.14);
}
.testimonial-quote::-webkit-scrollbar { width: 6px; }
.testimonial-quote::-webkit-scrollbar-track { background: rgba(87, 131, 219, 0.14); border-radius: 999px; }
.testimonial-quote::-webkit-scrollbar-thumb { background: rgba(87, 131, 219, 0.7); border-radius: 999px; }
.testimonial-author { display: flex; align-items: center; gap: 0.75rem; margin-top: auto; flex: none; }
.testimonial-avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--accent-dim); display: flex; align-items: center; justify-content: center; color: var(--accent); font-weight: 700; font-size: 1rem; overflow: hidden; flex-shrink: 0; }
.testimonial-name { font-weight: 600; font-size: 0.9rem; color: var(--white); }
.testimonial-role { font-size: 0.88rem; color: var(--text-muted); }
.testimonial-submit-card { min-width: 0; }
.testimonial-cta-card { display: grid; gap: .8rem; align-content: start; }
.testimonial-submit-copy { color: var(--text-muted); margin-bottom: 1rem; }
.testimonial-consent-group { margin-bottom: 1rem; }
.testimonial-consent-label { display: flex; gap: 0.55rem; align-items: flex-start; color: var(--text-muted); line-height: 1.5; }
.testimonial-consent-label input { margin-top: 0.2rem; }
.carousel-controls { display: flex; justify-content: center; gap: 1rem; margin-top: 1.5rem; }
.carousel-btn { width: 40px; height: 40px; border-radius: 50%; background: var(--bg-card); border: 1px solid var(--accent-border); color: var(--accent); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: var(--transition); }
.carousel-btn:hover { background: var(--accent); color: var(--bg-primary); }
.carousel-btn.is-disabled,
.carousel-btn:disabled {
   opacity: .45;
   cursor: not-allowed;
   pointer-events: none;
}
.carousel-controls.is-hidden { display: none; }

@media (max-width: 991px) {
   .testimonial-card { flex-basis: calc((100% - var(--testimonial-gap)) / 2); }
}

@media (max-width: 640px) {
   .testimonials-track { --testimonial-gap: 1rem; }
   .testimonial-card { flex-basis: 100%; height: 460px; padding: 1.4rem; }
}

body.u-modal-open { overflow: hidden; }

.testimonial-modal-overlay {
   position: fixed;
   inset: 0;
   background: rgba(3, 8, 21, 0.72);
   display: none;
   align-items: center;
   justify-content: center;
   padding: 1.25rem;
   z-index: 1200;
}

.testimonial-modal-overlay.open { display: flex; }

.testimonial-form-modal {
   width: min(760px, 100%);
   max-height: min(92vh, 920px);
   overflow: auto;
   padding: 1.2rem;
   border: 1px solid rgba(87, 131, 219, 0.35);
   opacity: 0;
   transform: translateY(14px);
   transition: opacity .22s ease, transform .22s ease;
}

.testimonial-modal-overlay.open .testimonial-form-modal {
   opacity: 1;
   transform: translateY(0);
}

.testimonial-form-modal .form-row { gap: .85rem; }
.testimonial-form-modal .form-group { position: relative; z-index: 0; }
.testimonial-form-modal .form-group:focus-within { z-index: 2; }
.testimonial-form-modal select.form-control {
   color-scheme: dark;
   cursor: pointer;
}

.testimonial-form-modal select.form-control option {
   background: #101a33;
   color: #f5f8ff;
}

.testimonial-form-modal select.form-control option:checked {
   background: #2f6fdf;
   color: #ffffff;
}

.testimonial-rating-picker {
   display: flex;
   align-items: center;
   gap: .35rem;
   min-height: 42px;
}

.testimonial-rating-star {
   width: 38px;
   height: 38px;
   border-radius: 10px;
   border: 1px solid rgba(126, 163, 235, 0.4);
   background: rgba(10, 19, 40, 0.9);
   color: #7e92b8;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   transition: var(--transition);
}

.testimonial-rating-star:hover {
   border-color: rgba(255, 201, 71, 0.55);
   color: #ffd86e;
}

.testimonial-rating-star.is-active {
   border-color: rgba(255, 201, 71, 0.66);
   color: #ffc947;
   background: rgba(46, 32, 5, 0.55);
}

.testimonial-rating-star[aria-checked="true"] {
   box-shadow: 0 0 0 2px rgba(255, 201, 71, 0.22);
}

.testimonial-rating-label {
   margin-top: .45rem;
}

.testimonial-progress {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: .45rem;
   margin-bottom: .85rem;
}

.testimonial-progress-step {
   display: inline-flex;
   justify-content: center;
   align-items: center;
   border: 1px solid rgba(87, 131, 219, .32);
   border-radius: 999px;
   padding: .36rem .48rem;
   color: var(--text-muted);
   font-size: .74rem;
   font-weight: 600;
   letter-spacing: .01em;
   background: rgba(13, 20, 37, 0.62);
}

.testimonial-progress-step.is-active {
   color: #b7d6ff;
   border-color: rgba(87, 131, 219, .62);
   box-shadow: inset 0 0 0 1px rgba(87, 131, 219, .26);
}

.testimonial-progress-step.is-complete {
   color: #9ff0be;
   border-color: rgba(57, 176, 111, .58);
   background: rgba(16, 92, 56, .26);
}

.modal-head {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: .5rem;
}

.modal-head h3 {
   color: var(--white);
   margin: 0;
}

.modal-close-btn {
   width: 42px;
   height: 42px;
   border-radius: 999px;
   border: 1px solid var(--accent-border);
   background: rgba(21, 31, 55, 0.88);
   color: var(--text-primary);
   cursor: pointer;
}

.modal-close-btn:hover { border-color: var(--accent); }
.modal-close-btn:focus-visible { box-shadow: var(--focus-ring); }

.testimonial-success-panel {
   border: 1px solid rgba(47, 140, 255, 0.32);
   background: rgba(12, 31, 64, 0.45);
   border-radius: 12px;
   padding: 1rem;
   margin-top: .5rem;
}

.testimonial-success-panel h4 {
   color: var(--white);
   margin-bottom: .4rem;
}

.testimonial-success-panel p {
   color: var(--text-muted);
   margin-bottom: .7rem;
}

.testimonial-success-actions {
   display: flex;
   gap: .6rem;
   flex-wrap: wrap;
}

.testimonial-submit-btn {
   position: sticky;
   bottom: 0;
   z-index: 2;
   display: flex;
   justify-content: center;
   align-items: center;
   text-align: center;
   padding-right: 3.25rem;
}

.testimonial-submit-btn.is-submitting .testimonial-submit-btn-icon {
   display: none;
}

.testimonial-submit-btn-label {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
   white-space: nowrap;
}

.testimonial-submit-btn-icon {
   position: absolute;
   right: 1.15rem;
}

/* ════════════════════════════════════════
   HIRING PARTNERS
═══════════════════════════════════════ */
.partners-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem; }
.partner-logo {
  padding: 1rem 2rem; background: var(--bg-card);
  border: 1px solid var(--accent-border); border-radius: 10px;
  font-weight: 700; font-size: 1rem; color: var(--text-muted);
  transition: var(--transition); min-width: 120px; text-align: center;
}
.partner-logo:hover { color: #2b63c9; border-color: var(--accent); box-shadow: 0 10px 24px rgba(17,39,71,0.16); }

/* ════════════════════════════════════════
   DEMO CTA BAND
═══════════════════════════════════════ */
.demo-band {
   background: #ffffff;
  border: 1px solid var(--accent-border);
  border-radius: 20px; padding: 3.5rem;
  display: flex; align-items: center; gap: 3rem; flex-wrap: wrap;
}

.demo-section .demo-band {
   box-shadow: var(--shadow-lg);
}
.demo-band-text { flex: 1; min-width: 280px; }
.demo-band-text h2 { color: var(--white); margin-bottom: 0.75rem; }
.demo-band-text p { color: var(--text-muted); }
.demo-form { display: flex; gap: 0.75rem; flex-wrap: wrap; flex: 1; min-width: 280px; }
.demo-form input { flex: 1; min-width: 140px; padding: 0.8rem 1rem; background: var(--bg-secondary); border: 1px solid var(--accent-border); border-radius: 8px; color: var(--text-primary); font-family: var(--font-body); font-size: 0.9rem; outline: none; transition: border-color var(--transition); }
.demo-form input:focus { border-color: var(--accent); }
.demo-form input::placeholder { color: var(--text-muted); }
.demo-form select { flex: 1; min-width: 140px; padding: 0.8rem 1rem; background: var(--bg-secondary); border: 1px solid var(--accent-border); border-radius: 8px; color: var(--text-primary); font-family: var(--font-body); font-size: 0.9rem; outline: none; cursor: pointer; color-scheme: dark; }
.demo-form select option { background: var(--bg-secondary); color: var(--text-primary); }

/* ════════════════════════════════════════
   BLOG CARDS
═══════════════════════════════════════ */
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.35rem; align-items: stretch; }
.blog-card { padding: 0; overflow: hidden; height: 100%; display: flex; flex-direction: column; }
.blog-card-img { height: 180px; background: linear-gradient(135deg, rgba(47,111,223,0.09), rgba(255,107,53,0.07)); display: flex; align-items: center; justify-content: center; font-size: 3rem; color: var(--accent); border-bottom: 1px solid var(--border-soft); overflow: hidden; padding: 0; }
.blog-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.blog-card:hover .blog-card-img img { transform: scale(1.05); }
.blog-card-body { padding: 1.5rem; display: flex; flex-direction: column; height: 100%; }
.blog-card-meta { display: flex; gap: 1rem; align-items: center; margin-bottom: 0.75rem; }
.blog-card-meta span { font-size: 0.88rem; color: var(--text-muted); }
.blog-card h3 { color: var(--white); font-size: 1rem; margin-bottom: 0.5rem; }
.blog-card p { color: var(--text-muted); font-size: 0.88rem; margin-bottom: 1rem; }
.blog-card .btn { margin-top: auto; align-self: flex-start; }

.blog-feature {
   display: grid;
   grid-template-columns: minmax(0, 1.4fr) minmax(240px, 1fr);
   gap: 1.4rem;
   margin-bottom: 2rem;
   padding: 1.3rem;
   border: 1px solid var(--accent-border);
   border-radius: 14px;
   background: #ffffff;
}

.blog-feature h3 {
   color: var(--white);
   margin-bottom: 0.65rem;
   font-size: 1.1rem;
}

.blog-feature p {
   color: var(--text-muted);
   font-size: 0.9rem;
   margin-bottom: 1rem;
}

.blog-feature-stats {
   display: grid;
   grid-template-columns: 1fr;
   gap: 0.7rem;
}

.blog-feature-pill {
   border: 1px solid var(--accent-border);
   border-radius: 10px;
   padding: 0.7rem 0.85rem;
   background: #ffffff;
}

.blog-feature-pill strong {
   display: block;
   color: var(--accent);
   font-size: 0.86rem;
}

.blog-feature-pill span {
   color: var(--text-muted);
   font-size: 0.84rem;
}

/* ════════════════════════════════════════
   FOOTER
═══════════════════════════════════════ */
.footer { background: linear-gradient(180deg, #f8faff 0%, #edf3ff 100%); border-top: 1px solid var(--border-soft); padding: 4rem 0 1.5rem; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 3rem; margin-bottom: 3rem; }
.footer-brand p { color: var(--text-muted); font-size: 0.88rem; margin: 1rem 0 1.25rem; max-width: 280px; }
.footer-social { display: flex; gap: 0.75rem; }
.social-link { width: 36px; height: 36px; border-radius: 8px; background: var(--bg-card); border: 1px solid var(--accent-border); display: flex; align-items: center; justify-content: center; color: var(--text-muted); transition: var(--transition); }
.social-link:hover { color: var(--accent); border-color: var(--accent); }
.social-link:active { transform: translateY(1px); }
.footer-col h4 { color: var(--white); font-family: var(--font-heading); font-size: 0.9rem; margin-bottom: 1rem; letter-spacing: 0.02em; font-weight: 600; }
.footer-col ul li { margin-bottom: 0.6rem; }
.footer-col ul a { color: var(--text-muted); font-size: 0.88rem; transition: color var(--transition); }
.footer-col ul a:hover { color: var(--accent); }
.footer-contact li { display: flex; gap: 0.6rem; align-items: flex-start; color: var(--text-muted); font-size: 0.88rem; margin-bottom: 0.75rem; }
.footer-contact i { color: var(--accent); margin-top: 2px; flex-shrink: 0; }
.footer-bottom { border-top: 1px solid var(--accent-border); padding-top: 1.5rem; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.footer-bottom p { color: var(--text-muted); font-size: 0.88rem; }
.footer-bottom a { color: var(--accent); }

/* ════════════════════════════════════════
   FORMS
═══════════════════════════════════════ */
.form-group { margin-bottom: 1.25rem; }
.form-group label { display: block; font-size: 0.92rem; color: var(--text-muted); margin-bottom: 0.4rem; }
.form-control {
  width: 100%; padding: 0.8rem 1rem;
  background: var(--bg-secondary); border: 1px solid var(--accent-border);
  border-radius: 8px; color: var(--text-primary);
   font-family: var(--font-body); font-size: 0.9rem;
  outline: none; transition: border-color var(--transition);
}
.form-control:focus { border-color: var(--accent); }
.form-control:focus-visible { box-shadow: var(--focus-ring); }
.form-control.error { border-color: var(--orange); }
.form-error { font-size: 0.84rem; color: var(--orange); margin-top: 0.3rem; display: none; }
.form-error.show { display: block; }
.form-help { font-size: .78rem; color: var(--text-muted); line-height: 1.5; margin-top: .4rem; }
.form-success { text-align: center; padding: 1.5rem; color: #00d464; font-weight: 600; display: none; }
.form-consent-note { font-size: .78rem; color: var(--muted); line-height: 1.5; margin: .35rem 0 .85rem; }
textarea.form-control { resize: vertical; min-height: 120px; }

/* Dark dropdown: prevents native white option list across all themed selects */
select.form-control { color-scheme: dark; cursor: pointer; }
select.form-control option { background: #101a33; color: #f5f8ff; }
select.form-control option:checked { background: #2f6fdf; color: #ffffff; }
.u-sr-only {
   position: absolute;
   width: 1px;
   height: 1px;
   padding: 0;
   margin: -1px;
   overflow: hidden;
   clip: rect(0, 0, 0, 0);
   white-space: nowrap;
   border: 0;
}

/* ════════════════════════════════════════
   PAGE HERO (inner pages)
═══════════════════════════════════════ */
.page-hero {
   padding: calc(var(--nav-height) + 4.8rem) 0 4.1rem;
   background: linear-gradient(180deg, #f8faff 0%, #edf3ff 100%);
   text-align: center;
   border-bottom: 1px solid var(--border-soft);
}
.page-hero h1 { color: var(--white); margin-bottom: 0.75rem; letter-spacing: .01em; }
.page-hero p { color: var(--text-muted); max-width: 660px; margin: 0 auto; }
.breadcrumb { display: flex; justify-content: center; gap: 0.5rem; font-size: 0.88rem; color: var(--text-muted); margin-bottom: 1rem; }
.breadcrumb a { color: var(--accent); }
.breadcrumb span { color: var(--text-muted); }

body[data-program-page="digital-marketing"] {
   --accent: #2f8cff;
   --accent-dim: rgba(47, 140, 255, 0.12);
}

body[data-program-page="blockchain-technology"] {
   --accent: #2f8cff;
   --accent-dim: rgba(47, 140, 255, 0.12);
}

body[data-program-page="azure-data-engineer-fabric"] {
   --accent: #2f8cff;
   --accent-dim: rgba(47, 140, 255, 0.12);
}

.program-hero-badges {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   gap: 0.75rem;
   margin-top: 1.3rem;
}

.program-hero-badges span {
   display: inline-flex;
   align-items: center;
   gap: 0.45rem;
   padding: 0.48rem 0.8rem;
   border-radius: 999px;
   background: rgba(7,12,24,0.84);
   border: 1px solid rgba(47,140,255,0.28);
   color: var(--text-primary);
   font-size: 0.82rem;
   font-weight: 600;
   box-shadow: 0 12px 26px rgba(0, 0, 0, 0.22);
}

.program-hero-badges i {
   color: #8fc0ff;
}

.program-visual-frame {
   position: relative;
   overflow: hidden;
   border-radius: 22px;
   border: 1px solid rgba(17,39,71,0.08);
   box-shadow: 0 22px 56px rgba(17,39,71,0.16);
   background: #ffffff;
   padding: 0.4rem;
}

.program-visual-frame .about-visual-photo {
   aspect-ratio: auto;
   object-fit: contain;
   width: 100%;
   height: auto;
   margin-bottom: 0;
   border-radius: 16px;
}

.program-visual-frame::after {
   content: '';
   position: absolute;
   inset: auto 0 0 0;
   height: 42%;
   background: linear-gradient(180deg, rgba(17,39,71,0) 0%, rgba(17,39,71,0.16) 100%);
   pointer-events: none;
}

.program-proof-band {
   display: grid;
   grid-template-columns: repeat(4, minmax(0, 1fr));
   gap: 1rem;
}

.program-proof-card {
   padding: 1.3rem;
   display: flex;
   flex-direction: column;
   gap: 0.55rem;
}

.program-proof-card strong {
   color: var(--white);
   font-family: var(--font-heading);
   font-size: 1rem;
}

.program-proof-card p {
   color: var(--text-muted);
   font-size: 0.88rem;
}

.program-proof-card i,
.related-program-icon,
.program-spotlight-icon {
   width: 50px;
   height: 50px;
   border-radius: 14px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   background: var(--accent-dim);
   color: var(--accent);
   border: 1px solid rgba(47,111,223,0.18);
   font-size: 1.25rem;
}

.related-program-card,
.program-spotlight-card {
   padding: 1.4rem;
   display: flex;
   flex-direction: column;
   gap: 0.75rem;
}

.related-program-card .btn,
.program-spotlight-card .btn {
   align-self: flex-start;
   margin-top: auto;
}

.program-tools-strip {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   gap: 0.7rem;
}

.program-tools-strip span {
   display: inline-flex;
   align-items: center;
   gap: 0.45rem;
   border-radius: 999px;
   background: #ffffff;
   border: 1px solid var(--accent-border);
   padding: 0.48rem 0.8rem;
   color: var(--text-muted);
   font-size: 0.84rem;
   font-weight: 600;
}

.program-tools-strip i {
   color: var(--accent);
}

.program-spotlight-grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 1.2rem;
}

/* ════════════════════════════════════════
   ABOUT PAGE
═══════════════════════════════════════ */
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.about-visual { position: relative; }
.about-visual-photo { width: 100%; border-radius: 16px; aspect-ratio: 16/9; object-fit: cover; margin-bottom: 1.5rem; box-shadow: var(--shadow-soft); }
.about-visual-inner { border-radius: 20px; background: var(--bg-card); border: 1px solid var(--accent-border); padding: 2.5rem; }
.about-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.about-stat { text-align: center; }
.about-stat strong { display: block; font-family: var(--font-heading); font-size: 2rem; color: var(--accent); }
.about-stat span { font-size: 0.88rem; color: var(--text-muted); }
.timeline { position: relative; padding-left: 2rem; }
.timeline::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--accent-border); }
.timeline-item { position: relative; padding-bottom: 2.5rem; }
.timeline-item::before { content: ''; position: absolute; left: -2rem; top: 4px; transform: translateX(-50%); width: 12px; height: 12px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px var(--accent); }
.timeline-item h4 { color: var(--white); margin-bottom: 0.25rem; }
.timeline-item span { font-size: 0.84rem; color: var(--accent); margin-bottom: 0.5rem; display: block; }
.timeline-item p { color: var(--text-muted); font-size: 0.88rem; }
.trainers-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.trainer-card { padding: 2rem; text-align: center; }
.trainer-avatar { width: 80px; height: 80px; border-radius: 50%; background: var(--accent-dim); border: 2px solid var(--accent-border); display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; font-size: 2rem; color: var(--accent); overflow: hidden; }
.trainer-avatar img,.testimonial-avatar img,.story-avatar img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.trainer-card h3 { color: var(--white); font-size: 1rem; margin-bottom: 0.25rem; }
.trainer-card .title { color: var(--accent); font-size: 0.88rem; margin-bottom: 0.75rem; }
.trainer-card p { color: var(--text-muted); font-size: 0.88rem; margin-bottom: 1rem; }
.trainer-certs { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.4rem; }

/* ════════════════════════════════════════
   PLACEMENT PAGE
═══════════════════════════════════════ */
.placement-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; margin-bottom: 3rem; }
.placement-stat-card { padding: 2rem; text-align: center; }
.placement-stat-card {
   background: linear-gradient(180deg, rgba(9, 16, 34, 0.94) 0%, rgba(6, 11, 24, 0.98) 100%);
   border-color: rgba(87, 131, 219, 0.2);
   box-shadow: 0 16px 40px rgba(2, 8, 24, 0.22);
   border-top: 2px solid rgba(95, 224, 168, 0.34);
}
.placement-stat-card i { font-size: 2rem; color: var(--accent); margin-bottom: 1rem; }
.placement-stat-card strong { display: block; font-family: var(--font-heading); font-size: 2rem; color: var(--white); }
.placement-stat-card span { color: var(--text-muted); font-size: 0.85rem; }
.story-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; align-items: stretch; }
.story-card {
   padding: 1.75rem;
   height: 100%;
   background: linear-gradient(180deg, rgba(10, 18, 36, 0.92) 0%, rgba(7, 12, 24, 0.98) 100%);
   border-color: rgba(87, 131, 219, 0.22);
   box-shadow: 0 16px 40px rgba(2, 8, 24, 0.24);
   border-top: 2px solid rgba(47, 140, 255, 0.34);
}
.story-header { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.story-avatar { width: 52px; height: 52px; border-radius: 50%; background: var(--accent-dim); display: flex; align-items: center; justify-content: center; color: var(--accent); font-weight: 700; font-size: 1.1rem; flex-shrink: 0; overflow: hidden; }
.story-name { font-weight: 600; color: var(--white); }
.story-role { font-size: 0.84rem; color: var(--text-muted); }
.story-company { display: flex; align-items: center; gap: 0.4rem; color: var(--accent); font-size: 0.85rem; font-weight: 600; margin-bottom: 0.5rem; }
.story-package { font-size: 0.88rem; color: var(--orange); }
.story-quote { font-size: 0.85rem; color: var(--text-muted); font-style: italic; margin-top: 0.75rem; }

.home-placement-record .placement-stats {
   margin-bottom: 1.4rem;
}

.home-placement-record .story-grid {
   margin-bottom: 1.8rem;
}

/* ════════════════════════════════════════
   BLOG
═══════════════════════════════════════ */
.blog-post-content { max-width: 780px; margin: 0 auto; }
.cms-rich-content h1,
.cms-rich-content h2,
.cms-rich-content h3,
.cms-rich-content h4,
.blog-post-content h2, .blog-post-content h3 {
   color: var(--white);
   margin: 2rem 0 0.75rem;
   line-height: 1.35;
}

.cms-rich-content h2,
.blog-post-content h2 {
   font-size: 1.25rem;
   padding-left: 0.7rem;
   border-left: 3px solid var(--accent);
}

.cms-rich-content p,
.blog-post-content p {
   color: var(--text-muted);
   margin-bottom: 1rem;
   font-size: 0.98rem;
}

.cms-rich-content a,
.blog-post-content a {
   color: var(--accent);
   font-weight: 600;
   text-decoration: underline;
   text-underline-offset: 0.18em;
}

.cms-rich-content img,
.blog-post-content img {
   max-width: 100%;
   height: auto;
   border-radius: 12px;
   border: 1px solid var(--accent-border);
   margin: 1.2rem auto;
   box-shadow: var(--shadow-soft);
}

.cms-rich-content .ql-align-center { text-align: center; }
.cms-rich-content .ql-align-right { text-align: right; }
.cms-rich-content .ql-align-justify { text-align: justify; }
.cms-rich-content .ql-size-small { font-size: 0.86rem; }
.cms-rich-content .ql-size-large { font-size: 1.18rem; }
.cms-rich-content .ql-size-huge { font-size: 1.46rem; line-height: 1.45; }
.cms-rich-content .ql-font-serif { font-family: Georgia, 'Times New Roman', serif; }
.cms-rich-content .ql-font-mono { font-family: 'Courier New', monospace; }

.cms-rich-content .ql-indent-1 { padding-left: 2rem; }
.cms-rich-content .ql-indent-2 { padding-left: 4rem; }
.cms-rich-content .ql-indent-3 { padding-left: 6rem; }
.cms-rich-content .ql-indent-4 { padding-left: 8rem; }
.cms-rich-content .ql-indent-5 { padding-left: 10rem; }
.cms-rich-content .ql-indent-6 { padding-left: 12rem; }
.cms-rich-content .ql-indent-7 { padding-left: 14rem; }
.cms-rich-content .ql-indent-8 { padding-left: 16rem; }

.article-rich > p:first-child {
   font-size: 1.05rem;
   color: var(--text-primary);
}

.cms-rich-content ul, .cms-rich-content ol,
.blog-post-content ul, .blog-post-content ol { color: var(--text-muted); padding-left: 1.5rem; margin-bottom: 1rem; }
.cms-rich-content li,
.blog-post-content li { margin-bottom: 0.4rem; }
.cms-rich-content code,
.blog-post-content code { background: var(--bg-card); padding: 0.15rem 0.4rem; border-radius: 4px; font-size: 0.88rem; color: var(--accent); }

.cms-rich-content blockquote,
.blog-post-content blockquote {
   margin: 1.3rem 0;
   padding: 0.85rem 1rem;
   border-left: 3px solid var(--orange);
   background: rgba(255,107,53,0.08);
   color: var(--text-primary);
   border-radius: 8px;
}

.article-tags {
   padding-top: 1rem;
   border-top: 1px dashed var(--accent-border);
}

/* ════════════════════════════════════════
   CONTACT
═══════════════════════════════════════ */
.contact-grid { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(360px, 1.35fr); gap: 2rem; align-items: start; }
.contact-info h3 { color: var(--white); margin-bottom: 1.5rem; }

.contact-quick-grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 0.8rem;
   margin-bottom: 1.5rem;
}

.contact-quick-item {
   padding: 0.75rem 0.8rem;
   border: 1px solid var(--accent-border);
   border-radius: 10px;
      background: rgba(47,111,223,0.06);
}

.contact-quick-item strong {
   display: block;
   color: var(--white);
   font-family: var(--font-heading);
   font-weight: 600;
   font-size: 0.86rem;
   margin-bottom: 0.1rem;
}

.contact-quick-item span {
   color: var(--text-muted);
   font-size: 0.76rem;
}
.contact-detail { display: flex; gap: 1rem; align-items: flex-start; margin-bottom: 1.5rem; }
.contact-icon { width: 44px; height: 44px; border-radius: 10px; background: var(--accent-dim); display: flex; align-items: center; justify-content: center; color: var(--accent); flex-shrink: 0; }
.contact-detail h4 { color: var(--white); font-size: 0.9rem; margin-bottom: 0.2rem; }
.contact-detail p { color: var(--text-muted); font-size: 0.88rem; }
.contact-form-card { background: var(--bg-card); border: 1px solid var(--accent-border); border-radius: var(--radius); padding: clamp(1.5rem, 3vw, 2.5rem); box-shadow: 0 14px 32px rgba(17,39,71,0.12); }
.contact-form-card h3 { color: var(--white); margin-bottom: 1.5rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

@media (max-width: 960px) {
   .testimonial-form-modal .form-row {
      grid-template-columns: 1fr;
      gap: .7rem;
   }
}

@media (max-width: 700px) {
   .testimonial-form-modal {
      max-height: 100vh;
      border-radius: 14px;
      padding: 1rem;
   }

   .testimonial-submit-btn {
      border-top: 1px solid rgba(87, 131, 219, 0.25);
      border-radius: 10px;
      background: linear-gradient(180deg, rgba(13, 20, 37, 0.85), rgba(13, 20, 37, 0.98));
      padding-block: .75rem;
   }

   .testimonial-consent-label input {
      width: 18px;
      height: 18px;
      margin-top: 0.15rem;
      flex-shrink: 0;
   }

   .testimonial-progress {
      grid-template-columns: 1fr;
      gap: .35rem;
   }
}

/* ════════════════════════════════════════
   COURSE DETAIL
═══════════════════════════════════════ */
.course-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 340px); gap: 2rem; align-items: start; }

.course-detail-main {
   background: rgba(255,255,255,0.02);
   border: 1px solid rgba(17, 39, 71, 0.14);
   border-radius: 14px;
   padding: clamp(1.15rem, 3vw, 2rem);
}

.course-detail-main h2 {
   letter-spacing: 0.01em;
}

.course-detail-main p {
   max-width: 72ch;
}

.course-detail-side {
   min-width: 0;
}
.syllabus-accordion { border: 1px solid var(--accent-border); border-radius: var(--radius); overflow: hidden; }
.accordion-item { border-bottom: 1px solid var(--accent-border); }
.accordion-item:last-child { border-bottom: none; }
.accordion-header { padding: 1.25rem 1.5rem; display: flex; justify-content: space-between; align-items: center; cursor: pointer; background: var(--bg-card); transition: background var(--transition); }
.accordion-header:hover { background: rgba(47,111,223,0.06); }
.accordion-header h4 { color: var(--white); font-size: 0.95rem; }
.accordion-header i { color: var(--accent); transition: transform var(--transition); }
.accordion-item.open .accordion-header i { transform: rotate(180deg); }
.accordion-body { padding: 0 1.5rem; max-height: 0; overflow: hidden; transition: max-height 0.4s ease, padding 0.3s ease; }
.accordion-item.open .accordion-body { max-height: 500px; padding: 1rem 1.5rem; }
.accordion-body li { padding: 0.3rem 0; color: var(--text-muted); font-size: 0.88rem; display: flex; align-items: center; gap: 0.5rem; }
.accordion-body li::before { content: '›'; color: var(--accent); font-size: 1.1rem; }
.enroll-card { background: var(--bg-card); border: 1px solid var(--accent-border); border-radius: var(--radius); padding: 2rem; position: sticky; top: calc(var(--nav-height) + 1.5rem); box-shadow: 0 14px 30px rgba(17, 39, 71, 0.12); }
.enroll-card h3 { color: var(--white); margin-bottom: 1.5rem; }
.course-info-list li { display: flex; justify-content: space-between; padding: 0.6rem 0; border-bottom: 1px solid var(--accent-border); font-size: 0.88rem; }
.course-info-list li:last-child { border-bottom: none; }
.course-info-list li span:first-child { color: var(--text-muted); }
.course-info-list li span:last-child { color: var(--white); font-weight: 500; }

/* ════════════════════════════════════════
    INTELLIGENCE HUB
═══════════════════════════════════════ */
.intel-grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 1.25rem;
}

.intel-card {
   padding: 1.4rem;
   display: flex;
   flex-direction: column;
   gap: 0.8rem;
   min-height: 100%;
}

.intel-card h3 {
   color: var(--white);
   font-size: 1.02rem;
   display: flex;
   align-items: center;
   gap: 0.5rem;
}

.intel-card h3 i {
   color: var(--accent);
}

.intel-card p {
   color: var(--text-muted);
   font-size: 0.9rem;
}

.intel-list {
   margin: 0.2rem 0 0.5rem;
   padding-left: 1.05rem;
}

.intel-list li {
   color: var(--text-muted);
   font-size: 0.86rem;
   margin-bottom: 0.35rem;
}

.intel-card .btn {
   margin-top: auto;
   align-self: flex-start;
}

/* ════════════════════════════════════════
   THE PERSISTENCE ACADEMY EDGE
═══════════════════════════════════════ */
.edge-grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 1.2rem;
}

.edge-card {
   padding: 1.25rem;
   display: flex;
   flex-direction: column;
   gap: 0.7rem;
}

.edge-card h3 {
   color: var(--white);
   font-size: 1.02rem;
   display: flex;
   align-items: center;
   gap: 0.5rem;
}

.edge-card h3 i {
   color: var(--accent);
}

.edge-card p {
   color: var(--text-muted);
   font-size: 0.9rem;
}

.edge-metric {
   margin-top: auto;
   padding: 0.55rem 0.65rem;
   border: 1px solid var(--accent-border);
   border-radius: 8px;
   color: var(--text-primary);
   background: #ffffff;
   font-size: 0.84rem;
   font-weight: 600;
}

/* ════════════════════════════════════════
    ADVANCED PAGES
═══════════════════════════════════════ */
.matrix-grid,
.resource-grid,
.faq-grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 1.2rem;
}

.tier-card,
.resource-card,
.faq-card {
   padding: 1.25rem;
}

.tier-card h3,
.resource-card h3,
.faq-card h3,
.policy-content h2 {
   color: var(--white);
   margin-bottom: 0.55rem;
}

.tier-list,
.resource-list {
   margin: 0.7rem 0 0;
   padding-left: 1.05rem;
}

.tier-list li,
.resource-list li,
.faq-card p,
.policy-content p,
.policy-content li {
   color: var(--text-muted);
   font-size: 0.9rem;
   margin-bottom: 0.35rem;
}

.assessment-shell {
   max-width: 920px;
   margin: 0 auto;
}

.assessment-form {
   display: grid;
   gap: 1rem;
}

.question-card {
   border: 1px solid var(--accent-border);
   border-radius: 12px;
   padding: 1rem;
   background: #ffffff;
}

.question-card h4 {
   color: var(--white);
   font-size: 1rem;
   margin-bottom: 0.6rem;
}

.question-options {
   display: grid;
   gap: 0.5rem;
}

.question-options label {
   display: flex;
   gap: 0.5rem;
   align-items: flex-start;
   color: var(--text-muted);
   font-size: 0.9rem;
}

.assessment-result {
   margin-top: 1rem;
   border: 1px solid var(--accent-border);
   border-radius: 12px;
   padding: 1rem;
   background: #ffffff;
   display: none;
}

.assessment-result.show {
   display: block;
}

.assessment-result h3 {
   color: var(--accent);
   margin-bottom: 0.4rem;
}

.policy-content {
   max-width: 900px;
   margin: 0 auto;
}

.policy-content section {
   border: 1px solid var(--accent-border);
   border-radius: 12px;
   background: #ffffff;
   padding: 1rem 1.1rem;
   margin-bottom: 1rem;
}

.placement-directory-controls {
   display: grid;
   grid-template-columns: 1.2fr 1fr 1fr 0.8fr;
   gap: 0.8rem;
   margin-bottom: 1rem;
}

.placement-directory-controls .form-control {
   background: #ffffff;
}

.placement-directory-grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 1rem;
}

.placement-directory-card {
   padding: 1.15rem;
}

.placement-directory-card h3 {
   color: var(--white);
   font-size: 1rem;
   margin-bottom: 0.35rem;
}

.placement-directory-meta {
   display: flex;
   flex-wrap: wrap;
   gap: 0.45rem;
   margin: 0.45rem 0 0.7rem;
}

.placement-directory-empty {
   border: 1px dashed var(--accent-border);
   border-radius: 12px;
   padding: 1rem;
   text-align: center;
   color: var(--text-muted);
   background: #ffffff;
}

.page-error-state {
   padding: 1.5rem;
}

.site-search-form {
   display: grid;
   grid-template-columns: minmax(0, 1fr) auto;
   gap: 0.75rem;
   margin-bottom: 1rem;
}

.site-search-input {
   min-height: 50px;
   font-size: 1rem;
}

.search-tabs {
   display: flex;
   flex-wrap: wrap;
   gap: 0.55rem;
   margin-bottom: 1rem;
}

.search-summary {
   color: var(--text-muted);
   margin-bottom: 1rem;
   font-size: 0.94rem;
}

.search-results {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 1rem;
}

.search-result-card {
   padding: 1.15rem;
   display: flex;
   flex-direction: column;
   gap: 0.65rem;
}

.search-result-card h3 {
   color: var(--white);
   font-size: 1.05rem;
}

.search-result-card p {
   color: var(--text-muted);
   font-size: 0.9rem;
   flex: 1;
}

.search-result-topline {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 0.5rem;
   color: var(--text-muted);
   font-size: 0.82rem;
}

.filter-btn:focus-visible,
.carousel-btn:focus-visible,
.social-link:focus-visible {
   box-shadow: var(--focus-ring);
}

/* Keep legacy/dynamic floating WhatsApp widgets suppressed globally. */
.whatsapp-float,
.joinchat,
#joinchat,
[class*="whatsapp-widget"],
[id*="whatsapp-widget"],
[class*="whatsapp-float"],
[id*="whatsapp-float"] {
   display: none !important;
}

@media (prefers-reduced-motion: reduce) {
   *,
   *::before,
   *::after {
      animation: none !important;
      transition: none !important;
      scroll-behavior: auto !important;
   }

   .animate-in,
   .blog-card-img img,
   .skeleton::after {
      transition: none !important;
   }
}

/* ════════════════════════════════════════
   ANIMATIONS
═══════════════════════════════════════ */
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes glow { 0%, 100% { box-shadow: 0 0 10px rgba(47,111,223,0.18); } 50% { box-shadow: 0 0 24px rgba(47,111,223,0.32); } }
@keyframes shimmer { 100% { transform: translateX(100%); } }

.animate-in { opacity: 0; animation: fadeInUp 0.62s ease forwards; animation-delay: var(--stagger-delay, 0ms); will-change: transform, opacity; }
.animate-delay-1 { animation-delay: 0.1s; }
.animate-delay-2 { animation-delay: 0.2s; }
.animate-delay-3 { animation-delay: 0.3s; }

@media (hover: none) {
   .blog-card:hover .blog-card-img img {
      transform: none;
   }
}

/* ════════════════════════════════════════
   DARK CYBER THEME OVERRIDES
═══════════════════════════════════════ */
body {
   background:
      radial-gradient(circle at 12% 12%, rgba(47, 140, 255, 0.16), transparent 28%),
      radial-gradient(circle at 88% 8%, rgba(17, 94, 255, 0.14), transparent 24%),
      radial-gradient(circle at 70% 84%, rgba(17, 24, 39, 0.88), transparent 36%),
      linear-gradient(180deg, #020617 0%, #050816 40%, #070b18 100%);
   color: var(--text-primary);
   position: relative;
   isolation: isolate;
}

body::before,
body::after {
   content: '';
   position: fixed;
   inset: 0;
   pointer-events: none;
   z-index: -1;
}

body::before {
   background:
      linear-gradient(115deg, transparent 0%, rgba(47, 140, 255, 0.08) 24%, transparent 26%),
      linear-gradient(245deg, transparent 0%, rgba(17, 94, 255, 0.08) 24%, transparent 27%);
   opacity: 0.75;
}

body::after {
   background-image:
      radial-gradient(rgba(91, 153, 255, 0.14) 1px, transparent 1px),
      radial-gradient(rgba(91, 153, 255, 0.07) 1px, transparent 1px);
   background-position: 0 0, 24px 24px;
   background-size: 48px 48px;
   opacity: 0.12;
   mix-blend-mode: screen;
}

::selection {
   background: rgba(47, 140, 255, 0.34);
   color: #ffffff;
}

::-webkit-scrollbar-track {
   background: var(--bg-primary);
}

::-webkit-scrollbar-thumb {
   background: linear-gradient(180deg, rgba(47, 140, 255, 0.8), rgba(97, 181, 255, 0.62));
}

.navbar,
.navbar.scrolled,
.nav-dropdown-menu,
.card,
.stats-grid,
.blog-feature,
.blog-feature-pill,
.program-visual-frame,
.program-tools-strip span,
.program-proof-card,
.program-spotlight-card,
.related-program-card,
.edge-card,
.intel-card,
.resource-card,
.tier-card,
.faq-card,
.question-card,
.assessment-result,
.policy-content section,
.placement-directory-empty,
.search-result-card,
.search-tabs .btn,
.contact-form-card,
.contact-map-wrap,
.contact-map-box,
.demo-band,
.footer,
.page-hero,
.hero-bg,
.hero-trust-row span,
.batch-table th,
.batch-table tr:hover td,
.cert-badge,
.skeleton-card,
.mobile-sticky-cta,
.get-in-touch-panel,
.modal,
.toast,
.search-input,
.form-control,
.demo-form input,
.demo-form select,
.filter-btn,
.partner-logo,
.carousel-btn,
.u-rich-editor,
.u-preview-box,
.edge-metric,
.funnel-item,
.funnel-kpi,
.timeline-item,
.dashboard-intro,
.media-card,
.revision-row,
.table-actions,
.program-tools-strip span,
.course-card-media {
   background: linear-gradient(180deg, rgba(21, 31, 55, 0.88) 0%, rgba(13, 20, 37, 0.92) 100%);
   border-color: var(--accent-border);
   box-shadow: var(--shadow-soft);
}

.hero-bg {
   background:
      radial-gradient(circle at 80% 18%, rgba(47, 140, 255, 0.13), transparent 28%),
      radial-gradient(circle at 10% 28%, rgba(16, 185, 255, 0.09), transparent 24%),
      linear-gradient(135deg, #070f1d 0%, #0c1830 48%, #0a1224 100%);
}

.cyber-grid {
   background-image:
      linear-gradient(rgba(47, 140, 255, 0.1) 1px, transparent 1px),
      linear-gradient(90deg, rgba(47, 140, 255, 0.1) 1px, transparent 1px);
   opacity: 0.28;
}

.section + .section::before {
   background: linear-gradient(90deg, transparent 0%, rgba(87, 131, 219, 0.12) 18%, rgba(87, 131, 219, 0.12) 82%, transparent 100%);
}

.section-header h2,
.hero h1,
.page-hero h1,
.blog-card h3,
.course-card h3,
.why-card h3,
.testimonial-name,
.footer-col h4,
.program-proof-card strong,
.program-spotlight-card h3,
.related-program-card h3,
.edge-card h3,
.intel-card h3,
.resource-card h3,
.tier-card h3,
.faq-card h3,
.search-result-card h3,
.contact-info h3,
.contact-form-card h3,
.course-detail-main h2,
.enroll-card h3,
.dashboard-intro h2,
.u-preview-headline {
   color: var(--white);
}

.section-header p,
.hero p,
.page-hero p,
.blog-card p,
.why-card p,
.catalog-highlight-card span,
.program-visual-frame,
.program-proof-card p,
.blog-feature p,
.course-card.is-filter-hidden {
   display: none !important;
}
.blog-feature-pill span,
.footer-brand p,
.footer-col ul a,
.footer-contact li,
.u-muted,
.u-text-muted,
.u-text-sm-muted,
.loading-hint,
.contact-detail p,
.contact-quick-item span,
.search-summary,
.search-result-card p,
.assessment-result p,
.policy-content p,
.policy-content li,
.placement-directory-empty,
.timeline-item span,
.timeline-item p,
.story-role,
.testimonial-role,
.u-note,
.confirm-message,
.login-card h2,
.form-group label,
.search-input::placeholder,
.form-control::placeholder,
.demo-form input::placeholder,
.demo-form select,
.site-search-input::placeholder {
   color: var(--text-muted);
}

.btn-primary,
.nav-cta,
.btn-success,
.get-in-touch-fab {
   background: var(--accent-grad);
   color: #ffffff;
   box-shadow: 0 14px 30px rgba(47, 140, 255, 0.28);
}

.btn-primary:hover,
.nav-cta:hover,
.btn-success:hover,
.get-in-touch-fab:hover {
   box-shadow: 0 18px 36px rgba(47, 140, 255, 0.35);
}

.btn-outline,
.btn-secondary,
.btn-ghost,
.filter-btn,
.search-tabs .btn,
.carousel-btn,
.social-link,
.partner-logo,
.cert-badge,
.badge,
.badge-orange,
.badge-green,
.badge-accent {
   background: rgba(7, 12, 24, 0.82);
   color: var(--text-primary);
   border-color: var(--accent-border);
}

.btn-outline:hover,
.btn-secondary:hover,
.btn-ghost:hover,
.filter-btn:hover,
.filter-btn.active,
.search-tabs .btn:hover,
.search-tabs .btn.active {
   background: rgba(47, 140, 255, 0.18);
   color: var(--white);
   border-color: rgba(47, 140, 255, 0.38);
}

.badge-accent,
.badge-published,
.badge-approved,
.badge-new {
   background: rgba(47, 140, 255, 0.14);
   color: #88baff;
}

.badge-orange,
.badge-enrolled,
.story-package,
.text-orange {
   background: rgba(255, 139, 77, 0.12);
   color: #ffb48b;
}

.badge-green,
.badge-contacted,
.status-dot-live,
.ok,
.u-text-green {
   color: #5fe0a8;
}

.stats-grid,
.card,
.blog-feature,
.demo-band,
.contact-form-card,
.modal,
.login-card,
.table-card,
.table-wrap table thead th,
.revision-row,
.timeline-item,
.dashboard-intro,
.u-rich-editor,
.u-preview-box,
.question-card,
.assessment-result,
.policy-content section,
.placement-directory-empty,
.search-result-card,
.funnel-item,
.funnel-kpi,
.edge-metric,
.media-card,
.blog-feature-pill,
.blog-card-body,
.contact-map-box,
.contact-map-link-row,
.mobile-sticky-cta,
.get-in-touch-panel,
.get-in-touch-shell .get-in-touch-panel,
.toast,
.skeleton-card,
.skeleton,
.program-visual-frame,
.catalog-highlight-card,
.program-tools-strip span,
.program-proof-card,
.related-program-card,
.program-spotlight-card,
.why-card i,
.course-card-icon,
.u-feature-icon,
.contact-icon,
.trainer-avatar,
.story-avatar,
.testimonial-avatar,
.stat-item strong,
.stat-card-icon,
.mini-track,
.mini-progress,
.mini-fill,
.funnel-kpi strong,
.funnel-item strong,
.chart-card,
.table-actions {
   border-color: var(--accent-border);
}

.nav-links a,
.nav-dropdown-toggle,
.nav-dropdown-menu a,
.hero-label,
.hero-trust-row span,
.footer-bottom a,
.footer-social .social-link,
.breadcrumb a,
.breadcrumb span,
.program-tools-strip span,
.contact-quick-item strong,
.contact-detail h4,
.story-company,
.accordion-body li::before,
.accordion-header i,
.program-proof-card i,
.related-program-icon,
.program-spotlight-icon,
.why-card i,
.course-card-icon i,
.u-feature-icon,
.social-link:hover,
.footer-contact i,
.text-accent,
.u-note i,
.catalog-highlight-card strong,
.blog-feature-pill strong,
.mini-value,
.mini-fill,
.mini-progress::-webkit-progress-value,
.u-preview-headline,
.u-legend,
.u-rich-editor .ql-toolbar button,
.u-rich-editor .ql-picker-label,
.u-rich-editor .ql-stroke,
.u-rich-editor .ql-fill {
   color: var(--accent);
}

.course-card-media-image,
.course-card-media-video,
.hero-img,
.about-visual-photo,
.blog-card-img img,
.program-visual-frame img,
.program-spotlight-card img,
.related-program-card img,
.search-result-card img,
.media-thumb img,
.trainer-avatar img,
.testimonial-avatar img,
.story-avatar img {
   filter: saturate(1.06) contrast(1.02) brightness(0.92);
}

.page-status-banner {
   background: rgba(7, 12, 24, 0.95);
   color: #d6e7ff;
   border-bottom-color: rgba(47, 140, 255, 0.28);
}

.page-status-banner[data-type="offline"] {
   background: rgba(14, 28, 54, 0.96);
   color: #b9d3ff;
}

.u-section-soft,
.surface-soft,
.stats-bar,
.section-stage,
.section-story-alt,
.section,
.contact-map-link-row,
.mobile-sticky-cta,
.footer,
.page-hero,
.hero,
.demo-band,
.blog-feature,
.blog-feature-pill,
.program-visual-frame,
.policy-content section,
.question-card,
.assessment-result,
.placement-directory-empty,
.search-result-card,
.footer-col ul a,
.footer-contact li,
.login-page {
   background-color: transparent;
}

.footer {
   background:
      radial-gradient(circle at 20% 0%, rgba(47, 140, 255, 0.14), transparent 30%),
      linear-gradient(180deg, rgba(11, 18, 35, 0.92) 0%, rgba(6, 11, 28, 0.98) 100%);
   border-top-color: rgba(87, 131, 219, 0.22);
}

.hero h1 .highlight,
.section-header h2 span,
.course-info-list li span:last-child,
.story-company,
.program-tools-strip i,
.contact-detail h4,
.footer-bottom a,
.footer-contact i,
.accordion-header h4,
.search-result-topline,
.catalog-highlight-card strong,
.blog-feature-pill strong,
.testimonial-stars,
.placement-directory-meta .badge,
.u-feature-icon,
.u-preview-headline,
.u-legend,
.mini-label,
.mini-value,
.status-dot-live,
.u-text-accent {
   color: #8fc0ff;
}

.hero h1 .highlight {
   text-shadow: 0 0 32px rgba(47, 140, 255, 0.24);
}

.course-card-media,
.hero-img,
.about-visual-photo,
.blog-card-img,
.search-result-card img,
.program-visual-frame,
.media-thumb,
.contact-map-box,
.preview-frame,
.preview-surface {
   box-shadow: 0 20px 50px rgba(0, 0, 0, 0.38);
}

.program-hero-badges span,
.hero-trust-row span,
.program-tools-strip span,
.contact-quick-item,
.course-info-list li,
.mini-row,
.search-tabs .btn,
.filter-btn,
.badge,
.cert-badge,
.social-link,
.carousel-btn,
.btn,
.btn-primary,
.btn-outline,
.btn-secondary,
.btn-ghost,
.form-control,
.search-input,
.select-control,
.demo-form input,
.demo-form select,
.modal,
.toast,
.login-card,
.table-actions {
   border-radius: 12px;
}

.program-visual-frame::after {
   background: linear-gradient(180deg, rgba(2, 6, 23, 0) 0%, rgba(2, 6, 23, 0.44) 100%);
}

.table-wrap table thead th,
th {
   background: rgba(6, 11, 24, 0.98);
   color: #86b8ff;
}

table tbody tr:nth-child(even) td,
.table-wrap table tbody tr:nth-child(even) td,
.table-wrap table tbody tr:hover td,
tr:hover td {
   background: rgba(47, 140, 255, 0.05);
}

.hero p,
.page-hero p,
.section-header p,
.card p,
.blog-card p,
.course-card p,
.why-card p,
.program-proof-card p,
.footer-brand p,
.footer-col ul a,
.footer-contact li,
.contact-detail p,
.contact-quick-item span,
.search-result-card p,
.assessment-result p,
.policy-content p,
.policy-content li,
.placement-directory-empty,
.timeline-item p,
.story-role,
.testimonial-role,
.u-note,
.confirm-message,
.login-card h2,
.search-summary,
.u-text-muted,
.u-muted,
.u-text-sm-muted,
.loading-hint {
   text-shadow: 0 0 1px rgba(0, 0, 0, 0.2);
}

.navbar,
.page-hero,
.hero-bg,
.card,
.stats-grid,
.demo-band,
.blog-feature,
.contact-form-card,
.modal,
.login-card,
.table-card,
.footer,
.mobile-sticky-cta,
.get-in-touch-panel,
.nav-dropdown-menu {
   backdrop-filter: blur(18px);
}

.filter-btn:hover,
.filter-btn.active,
.btn-outline:hover,
.btn-secondary:hover,
.btn-ghost:hover,
.search-tabs .btn:hover,
.search-tabs .btn.active,
.social-link:hover,
.carousel-btn:hover {
   box-shadow: 0 0 0 1px rgba(47, 140, 255, 0.28), 0 0 24px rgba(47, 140, 255, 0.18);
}

/* Homepage fidelity lock: keeps nav/hero geometry and contrast aligned with the approved reference. */
.navbar {
   border-bottom: 1px solid rgba(79, 143, 255, 0.18);
}

.nav-links {
   gap: 1.55rem;
}

.nav-links a {
   color: #d9e7ff;
   font-weight: 500;
   letter-spacing: 0.01em;
   font-size: 0.95rem;
}

.nav-links a:hover,
.nav-links a.active {
   color: #ffffff;
}

.nav-links a::after {
   bottom: -8px;
   height: 2px;
   border-radius: 2px;
   background: linear-gradient(90deg, #42a4ff 0%, #7fb9ff 100%);
}

.hero {
   padding-bottom: 2.2rem;
   background:
   linear-gradient(90deg, rgba(1, 8, 28, 0.72) 0%, rgba(2, 10, 34, 0.6) 32%, rgba(2, 9, 30, 0.26) 58%, rgba(2, 9, 30, 0.06) 100%),
   url('../assets/hero-reference-bg.png') 88% 50% / cover no-repeat;
}

.hero .hero-bg {
   background: transparent;
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
   box-shadow: none;
}

.hero .cyber-grid {
   opacity: 0.04;
   mask-image: radial-gradient(ellipse at 36% 50%, rgba(0, 0, 0, 0.22) 0%, transparent 78%);
}

.hero-inner {
   grid-template-columns: 1fr;
   gap: 1.2rem;
}

.hero-content {
   padding-top: 0.25rem;
   max-width: 760px;
}

.hero-kicker {
   font-size: 0.82rem;
   padding: 0.52rem 1.15rem;
}

.hero h1 {
   font-size: clamp(2.15rem, 4.2vw, 4.6rem);
   line-height: 1.14;
   letter-spacing: -0.01em;
   max-width: 13.2ch;
   margin-bottom: 1.1rem;
}

.hero p {
   font-size: 1.01rem;
   margin-bottom: 1.1rem;
   max-width: 620px;
   border-left: 3px solid rgba(66, 145, 255, 0.5);
   padding-left: 1rem;
}

.hero-actions {
   gap: 0.75rem;
}

.hero-actions .btn {
   min-width: 198px;
   padding: 0.78rem 1.2rem;
}

.hero-proof-grid {
   margin-top: 1.1rem;
}

.hero-proof-card {
   min-height: 100px;
}
