/* ===================================================================
   SECYORITY — DESIGN SYSTEM
   A classic, high-trust B2B security brand: dark navy + signal blue,
   geometric display type paired with a technical mono accent, and a
   single restrained "radar scan" motif in the hero rather than
   animation scattered everywhere.
   =================================================================== */

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: hidden; }
body{ overflow-x: hidden; }
body, h1, h2, h3, h4, p, ul, figure { margin: 0; }
ul { padding: 0; }
img { max-width: 100%; display: block; }
button { font: inherit; }
a { text-decoration: none; color: inherit; }

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

/* ---------- Tokens ---------- */
:root{
  /* ---- Brand palette: bright white, dark blue, orange ---- */
  --blue-50:  #FFFFFF;
  --blue-100: #F7FAFF;
  --blue-200: #EAF0FF;
  --blue-300: #1C2E72;
  --blue-400: #122463;
  --blue-500: #0B1B4D;
  --blue-600: #07143D;
  --blue-700: #061033;
  --blue-800: #050B2A;
  --blue-900: #03071B;

  --orange-50:  #FFF3ED;
  --orange-100: #FFE0D1;
  --orange-200: #FFC0A3;
  --orange-300: #FF9670;
  --orange-400: #FF7048;
  --orange-500: #FF5A2F;
  --orange-600: #E8441D;
  --orange-700: #B83218;

  /* ---- Semantic aliases onto the scale (used throughout the stylesheet) ---- */
  --color-vibrant-blue: var(--blue-600);      /* dark blue structure */
  --color-sky-blue: var(--color-action);      /* legacy accent alias now resolves to orange */
  --color-pale-blue: var(--blue-100);         /* bright white tint */
  --color-dark-blueish-ash: var(--blue-800);  /* depth, borders, secondary emphasis */
  --color-action: var(--orange-500);          /* 10% CTA / decisive accent */
  --color-action-hover: var(--orange-400);
  --color-action-strong: var(--orange-600);
  --color-warning: #FFB15F;

  /* ---- Dark neutral hierarchy — 60% foundation, not saturated navy ---- */
  --color-dark-navy: #03071B;   /* main background */
  --color-navy-soft: #050B2A;   /* secondary background */
  --color-paper: #07143D;       /* section background */
  --color-mist: #0B1B4D;        /* card background */
  --color-surface: #10245F;     /* elevated surface (popovers, dropdowns, mega-menu) */

  --color-navy-line: rgba(255,255,255,0.10);
  --color-line: rgba(255,255,255,0.09);

  /* ---- Text hierarchy — muted grays, not pure white ---- */
  --color-heading: #FFFFFF;      /* primary text */
  --color-text: #F7FAFF;         /* secondary text */
  --color-text-light: #DCE5F8;   /* muted text */
  --color-text-disabled: #8B98B6;/* disabled text */

  /* Type */
  --font-display: 'Space Grotesk', sans-serif;
  --font-body: 'Space Grotesk', sans-serif;
  --font-mono: 'Space Grotesk', sans-serif;

  /* Spacing scale */
  --spacing-xs: 0.5rem;
  --spacing-sm: 0.75rem;
  --spacing-md: 1.25rem;
  --spacing-lg: 2rem;
  --spacing-xl: 3rem;
  --spacing-2xl: 5rem;

  /* Radius / shadow */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --shadow-sm: 0 2px 8px rgba(0,0,0,.25);
  --shadow-md: 0 8px 24px rgba(0,0,0,.35);
  --shadow-lg: 0 20px 50px rgba(0,0,0,.5);
  --shadow-glow: 0 0 0 1px rgba(255,90,47,.35), 0 12px 30px rgba(255,90,47,.28);

  --ease: cubic-bezier(.4,0,.2,1);
}

/* ---------- Base typography ---------- */
body{
  font-family: var(--font-body);
  font-size: 17px;
  color: var(--color-text);
  background: var(--color-paper);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4{
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--color-heading);
}

h1{ font-size: clamp(2.25rem, 4.4vw, 3.5rem); letter-spacing: -0.025em; }
h2{ font-size: clamp(1.75rem, 3vw, 2.5rem); margin-bottom: var(--spacing-md); letter-spacing: -0.02em; }
h3{ font-size: 1.25rem; margin-bottom: var(--spacing-xs); color: var(--color-heading); }

p{ color: var(--color-text-light); }

::selection{ background: var(--color-action); color: #fff; }

/* Skip link — hidden until keyboard-focused, standard accessible pattern */
.skip-link{
  position: absolute;
  top: -60px;
  left: 1rem;
  z-index: 1000;
  background: var(--color-action);
  color: #fff;
  padding: .75rem 1.25rem;
  border-radius: 8px;
  font-weight: 600;
  font-size: .9rem;
  transition: top .2s var(--ease);
}
.skip-link:focus{ top: 1rem; }

#main-content{ scroll-margin-top: 90px; }

/* ---------- Browser cursor: standard pointer with orange brand accent ---------- */
html, body,
html a, html button,
html input, html textarea, html select, html [contenteditable]{ cursor: auto !important; }

a, button, [role="button"],
.card, .service-tile, .diff-card, .mega-menu__item,
.mega-menu__sidebar-item, .faq-item__trigger, .mobile-accordion__trigger,
.job-card, .footer-social__btn, .social-widget__toggle, .social-widget__item { cursor: pointer !important; }

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

/* Dedicated focus-ring color — brighter than the resting brand blue so
   focus is unmistakably distinct from hover/active, not just a repeat
   of the brand color (mirrors Action Blue vs Focus Blue). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible{
  outline: 2px solid var(--color-action);
  outline-offset: 3px;
  border-radius: 4px;
}

/* Eyebrow / mono label — the site's technical signature accent */
.eyebrow{
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--color-sky-blue);
  margin-bottom: var(--spacing-sm);
  text-align: center;
}
.eyebrow--light{ color: var(--color-sky-blue); text-align: left; }

/* ---------- Layout utilities ---------- */
.container{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--spacing-lg);
}

.grid{ display: grid; gap: var(--spacing-lg); }
.grid-2{ grid-template-columns: repeat(2, 1fr); align-items: center; }
.grid-3{ grid-template-columns: repeat(3, 1fr); }
.grid-4{ grid-template-columns: repeat(4, 1fr); }

.flex{ display: flex; flex-wrap: wrap; }
.flex-col{ display: flex; flex-direction: column; }
.flex-center{ display: flex; align-items: center; justify-content: center; }

.text-center{ text-align: center; }
.text-white{ color: #fff; }
.opacity-75{ opacity: .75; }

.gradient-text{
  background: linear-gradient(100deg, var(--color-action), var(--color-sky-blue) 72%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

@media (max-width: 900px){
  .grid-2{ grid-template-columns: 1fr; }
  .grid-3{ grid-template-columns: repeat(2, 1fr); }
  .grid-4{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px){
  .grid-3, .grid-4{ grid-template-columns: 1fr; }
  .container{ padding: 0 var(--spacing-md); }
}

/* ---------- Buttons ---------- */
.btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .85rem 1.6rem;
  border-radius: 10px;
  font-weight: 600;
  font-size: .95rem;
  border: 1.5px solid transparent;
  cursor: pointer;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease), background-color .2s var(--ease), color .2s var(--ease);
  white-space: nowrap;
}
.btn:active{ transform: scale(.96); }
.btn-primary{
  background: linear-gradient(135deg, var(--color-action), var(--color-action-strong) 130%);
  color: #fff;
  box-shadow: 0 6px 18px rgba(255,90,47,.28);
}
.btn-primary:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(255,112,72,.42);
  background: linear-gradient(135deg, var(--color-action-hover), var(--color-action) 130%);
}
.btn-primary:active{ transform: scale(.96); }
.btn-secondary{
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.34);
  color: #fff;
}
.btn-secondary:hover{
  transform: translateY(-2px);
  border-color: var(--color-action);
  background: rgba(255,90,47,.12);
}
.btn-secondary:active{ transform: scale(.96); }

/* ---------- Top bar: ambient cybersecurity signal (decorative only) ----------
   Built entirely from existing tokens:
   primary/accent glow = --color-sky-blue, structure = --color-vibrant-blue,
   fine lines = --color-dark-blueish-ash, background = --color-dark-navy /
   --color-navy-soft, hairlines = --color-navy-line. No new colors introduced. */
.topbar{
  position: relative;
  height: 34px;
  background: linear-gradient(180deg, var(--color-navy-soft) 0%, var(--color-dark-navy) 100%);
  border-bottom: 1px solid var(--color-navy-line);
  overflow: hidden;
}
.topbar-signal{ position: absolute; inset: 0; overflow: hidden; }

/* Layer 1 — background texture: barely-there vertical hairlines */
.topbar-signal__grid{
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0, rgba(255,255,255,.035) 1px, transparent 1px, transparent 64px);
  opacity: .7;
}

/* Layer 6 — depth: ambient glow that drifts slowly left/right */
.topbar-signal__glow{
  position: absolute;
  top: 50%;
  left: 18%;
  width: 320px;
  height: 130px;
  background: radial-gradient(closest-side, rgba(255,90,47,.26), transparent 72%);
  filter: blur(16px);
  transform: translate(-50%, -50%);
  animation: topbar-glow-drift 17s ease-in-out infinite;
  pointer-events: none;
}
@keyframes topbar-glow-drift{
  0%, 100% { left: 14%; opacity: .5; }
  50%      { left: 80%; opacity: .8; }
}
.topbar:hover .topbar-signal__glow{ filter: blur(16px) brightness(1.25); }

/* Layer 2 — technical layer: static faint waveform + flickering connectors */
.topbar-signal__wave{ position: absolute; inset: 0; width: 100%; height: 100%; }
.topbar-signal__wave path{ fill: none; stroke: rgba(255,90,47,.14); stroke-width: 1; }

.topbar-signal__links{ position: absolute; inset: 0; }
.tl{
  position: absolute;
  top: 50%;
  height: 1px;
  width: 44px;
  background: linear-gradient(90deg, transparent, rgba(16,25,114,.65), transparent);
  opacity: 0;
  animation: tl-flicker 7s ease-in-out infinite;
}
.tl-1{ left: 16%; animation-delay: 0s; }
.tl-2{ left: 47%; animation-delay: 2.3s; }
.tl-3{ left: 74%; animation-delay: 4.6s; }
@keyframes tl-flicker{
  0%, 84%, 100% { opacity: 0; }
  90%, 95%      { opacity: .85; }
}

/* Layer 3 — signal: smooth light trail sweeping across the bar */
.topbar-signal__beam{
  position: absolute;
  top: 50%;
  left: -30%;
  width: 28%;
  height: 1.5px;
  transform: translateY(-50%);
  background: linear-gradient(90deg, transparent, rgba(255,90,47,.95) 50%, transparent);
  box-shadow: 0 0 8px 1px rgba(255,90,47,.5);
  animation: topbar-beam-travel 7.5s linear infinite;
  pointer-events: none;
  transition: filter .3s var(--ease);
}
.topbar-signal__beam--soft{
  height: 4px;
  opacity: .3;
  filter: blur(2.5px);
  animation-duration: 11.5s;
  animation-delay: -4s;
}
@keyframes topbar-beam-travel{
  from { left: -30%; }
  to   { left: 130%; }
}
.topbar:hover .topbar-signal__beam{ filter: brightness(1.4); }

/* Layer 4 — particles travelling along the signal, staggered speeds */
.topbar-signal__particles span{
  position: absolute;
  top: var(--y, 50%);
  left: -2%;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--color-sky-blue);
  box-shadow: 0 0 4px 1px rgba(255,90,47,.7);
  opacity: 0;
  animation-name: particle-travel;
  animation-duration: var(--d, 10s);
  animation-delay: var(--delay, 0s);
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
@keyframes particle-travel{
  0%   { left: -2%; opacity: 0; }
  8%   { opacity: .9; }
  92%  { opacity: .9; }
  100% { left: 102%; opacity: 0; }
}
/* extra particles, revealed only on hover */
.particle--reveal{ animation-play-state: paused; }
.topbar:hover .particle--reveal{ animation-play-state: running; }

/* tiny illuminated points appearing at random intervals */
.topbar-signal__twinkles span{
  position: absolute;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: var(--color-pale-blue);
  opacity: 0;
  animation-name: twinkle;
  animation-duration: var(--dur, 4s);
  animation-delay: var(--delay, 0s);
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}
@keyframes twinkle{
  0%, 100% { opacity: 0; transform: scale(.6); }
  50%      { opacity: 1; transform: scale(1.3); }
}

/* Hover — ripple travelling through the bar, one shot per hover-in */
.topbar-signal__ripple{
  position: absolute;
  top: 50%;
  left: 0;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  pointer-events: none;
}
.topbar:hover .topbar-signal__ripple{ animation: ripple-travel 1.1s ease-out; }
@keyframes ripple-travel{
  0%   { left: 0%;   width: 2px;  height: 2px;  opacity: .9; box-shadow: 0 0 0 0 rgba(255,90,47,.5); }
  100% { left: 100%; width: 90px; height: 90px; opacity: 0;  box-shadow: 0 0 30px 10px rgba(255,90,47,0); }
}

/* Tablet — reduce particle/detail density */
@media (max-width: 900px){
  .topbar-signal__particles span:nth-child(n+6){ display: none; }
  .topbar-signal__twinkles span:nth-child(n+5){ display: none; }
  .tl-3{ display: none; }
}

/* Mobile — simplify further, same identity, lighter load */
@media (max-width: 560px){
  .topbar{ height: 28px; }
  .topbar-signal__particles span:nth-child(n+4){ display: none; }
  .topbar-signal__twinkles span:nth-child(n+3){ display: none; }
  .topbar-signal__links{ display: none; }
  .topbar-signal__beam--soft{ display: none; }
  .topbar-signal__glow{ width: 220px; height: 90px; }
}

/* ---------- Logo mark ---------- */
.logo{ display: inline-flex; align-items: center; gap: 0; }
.logo__mark{
  display: none !important;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}
.logo__mark svg.icon{ display: none !important; }
.logo__word{
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.3rem;
  letter-spacing: -0.01em;
  color: var(--color-heading);
  line-height: 1;
}

/* ---------- Services mega-menu ---------- */
.nav-links--mega > li.has-mega{ position: static; }
.mega-menu{
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  width: min(940px, calc(100vw - 2.5rem));
  background: var(--color-surface);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: var(--spacing-md);
  display: grid;
  grid-template-columns: 232px 1fr 220px;
  gap: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s var(--ease);
  z-index: 200;
}
.has-mega:hover > .mega-menu,
.has-mega:focus-within > .mega-menu,
.has-mega.is-open > .mega-menu{
  opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(4px);
}

.mega-menu__sidebar{
  display: flex;
  flex-direction: column;
  gap: .2rem;
  border-right: 1px solid var(--color-line);
  padding-right: var(--spacing-sm);
}
.mega-menu__sidebar-item{
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  padding: .55rem .65rem;
  border-radius: var(--radius-sm);
  font-size: .8rem;
  line-height: 1.3;
  font-weight: 600;
  color: var(--color-text-light);
  border-left: 3px solid transparent;
  transition: background .15s var(--ease), color .15s var(--ease), border-color .15s var(--ease);
}
.mega-menu__sidebar-item svg.icon{ margin-top: .1rem; }
.mega-menu__sidebar-item svg.icon{ width: 16px; height: 16px; color: var(--color-sky-blue); flex-shrink: 0; }
.mega-menu__sidebar-item:hover,
.mega-menu__sidebar-item.is-active{
  background: rgba(255,90,47,.12);
  color: var(--color-heading);
  border-left-color: var(--color-sky-blue);
}

.mega-menu__main{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .2rem .5rem;
  padding: 0 var(--spacing-md);
  align-content: start;
}
.mega-menu__item{
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  padding: .65rem .5rem;
  border-radius: var(--radius-sm);
  transition: background .15s var(--ease);
}
.mega-menu__item:hover{ background: rgba(255,255,255,.06); }
.mega-menu__item svg.icon{ width: 18px; height: 18px; color: var(--color-sky-blue); margin-top: .15rem; flex-shrink: 0; }
.mega-menu__item strong{
  display: block;
  font-family: var(--font-display);
  font-size: .88rem;
  font-weight: 700;
  color: var(--color-heading);
  margin-bottom: .15rem;
}
.mega-menu__item small{
  display: block;
  font-size: .78rem;
  color: var(--color-text-light);
  line-height: 1.35;
}

.mega-menu__promo{
  background: linear-gradient(155deg, var(--color-dark-navy), var(--color-vibrant-blue) 70%, var(--color-action-strong) 155%);
  border-radius: var(--radius-md);
  padding: var(--spacing-md);
  color: #fff;
  display: flex;
  flex-direction: column;
}
.mega-menu__promo-icon{
  width: 40px; height: 40px;
  border-radius: var(--radius-sm);
  background: rgba(255,90,47,.15);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: .75rem;
}
.mega-menu__promo-icon svg.icon{ width: 20px; height: 20px; color: var(--color-sky-blue); }
.mega-menu__promo h4{
  font-family: var(--font-display);
  font-size: .95rem;
  color: #fff;
  margin-bottom: .4rem;
}
.mega-menu__promo p{
  font-size: .8rem;
  color: rgba(255,255,255,.7);
  margin-bottom: .75rem;
  line-height: 1.5;
}
.mega-menu__promo a{
  font-size: .8rem;
  font-weight: 700;
  color: var(--color-sky-blue);
}
.mega-menu__promo a:hover{ text-decoration: underline; }

@media (max-width: 1050px){
  .mega-menu{ grid-template-columns: 180px 1fr; }
  .mega-menu__promo{ display: none; }
}

/* Simple mega-menu variant (no sidebar/promo) — used for Industries */
.mega-menu--simple{
  grid-template-columns: 1fr;
  width: min(640px, calc(100vw - 2.5rem));
}
.mega-menu--simple .mega-menu__main{
  grid-template-columns: 1fr 1fr;
  padding: 0;
  gap: .25rem .75rem;
}
@media (max-width: 640px){
  .mega-menu--simple .mega-menu__main{ grid-template-columns: 1fr; }
}

/* ---------- Header / Nav ---------- */
header{
  position: sticky;
  top: 0;
  z-index: 500;
  background: rgba(8,10,18,.88);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid transparent;
  transition: box-shadow .3s var(--ease), border-color .3s var(--ease), padding .3s var(--ease);
}
header.is-scrolled{
  box-shadow: var(--shadow-sm);
  border-bottom-color: var(--color-line);
}
header nav{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.15rem 0;
  transition: padding .3s var(--ease);
}
header.is-scrolled nav{ padding: .8rem 0; }

.logo{
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.25rem;
  color: var(--color-heading);
}
.logo svg.icon{ color: var(--color-action); }

/* Desktop dropdown nav */
.nav-links--mega{ display: flex; align-items: center; gap: 1.75rem; list-style: none; }
.nav-links--mega > li{ position: relative; }
.nav-links--mega > li > a{
  font-weight: 600;
  font-size: .95rem;
  color: var(--color-heading);
  padding: .4rem 0;
  position: relative;
  white-space: nowrap;
}
.nav-links--mega > li > a::after{
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -2px;
  height: 2px;
  background: var(--color-sky-blue);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s var(--ease);
}
.nav-links--mega > li > a:hover::after{ transform: scaleX(1); }
.nav-links--mega > li > a.nav-cta::after{ display: none; }

.nav-links--mega .caret{ font-size: .65em; display: inline-block; margin-left: 2px; transition: transform .2s var(--ease); }
.nav-links--mega .has-dropdown:hover > a .caret,
.nav-links--mega .has-dropdown:focus-within > a .caret,
.nav-links--mega .has-dropdown.is-open > a .caret{ transform: rotate(180deg); }

.nav-links--mega .dropdown{
  list-style: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translate(-50%, 8px);
  background: var(--color-surface);
  border: 1px solid rgba(255,255,255,.08);
  min-width: 230px;
  padding: .5rem;
  margin: 0;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s var(--ease);
  z-index: 200;
}
.nav-links--mega .has-dropdown:hover > .dropdown,
.nav-links--mega .has-dropdown:focus-within > .dropdown,
.nav-links--mega .has-dropdown.is-open > .dropdown{
  opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, 4px);
}
.nav-links--mega .dropdown li a{
  display: block;
  padding: .55rem .75rem;
  border-radius: var(--radius-sm);
  color: var(--color-heading);
  white-space: nowrap;
  font-weight: 500;
  font-size: .9rem;
  transition: background .15s var(--ease), color .15s var(--ease);
}
.nav-links--mega .dropdown li a:hover{
  background: rgba(255,90,47,.12);
  color: var(--color-sky-blue);
}

.nav-cta{
  background: linear-gradient(135deg, var(--color-action), var(--color-action-strong));
  color: #fff !important;
  width: 270px;
  min-width: 270px;
  min-height: 3.75rem;
  padding: 1rem 1.5rem;
  border-radius: 10px;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  white-space: nowrap;
  overflow: visible;
  flex-shrink: 0;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
  animation: nav-cta-pulse 3.2s ease-in-out infinite;
}
.nav-cta svg.icon{ transition: transform .2s var(--ease); }
.nav-cta:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(255,112,72,.44);
  background: linear-gradient(135deg, var(--color-action-hover), var(--color-action));
  animation-play-state: paused;
}
.nav-cta:active{ transform: scale(.96); }
.nav-cta:hover svg.icon{ transform: translateX(2px); }
@keyframes nav-cta-pulse{
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,90,47,.4); }
  50%      { box-shadow: 0 0 0 6px rgba(255,90,47,0); }
}
@media (prefers-reduced-motion: reduce){
  .nav-cta{ animation: none; }
}

/* Hamburger */
.hamburger{
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
.hamburger span{
  display: block;
  height: 2px;
  width: 100%;
  background: var(--color-dark-navy);
  border-radius: 2px;
  transition: transform .3s var(--ease), opacity .3s var(--ease);
}
.hamburger.is-active span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.hamburger.is-active span:nth-child(2){ opacity: 0; }
.hamburger.is-active span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

/* Mobile menu */
.mobile-menu{
  display: none;
  flex-direction: column;
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s var(--ease);
}
.mobile-menu.is-open{ max-height: 900px; }
.mobile-menu > a{
  padding: .9rem 0;
  border-bottom: 1px solid var(--color-line);
  font-weight: 600;
}
.mobile-menu > a.nav-cta{
  text-align: center;
  border-bottom: none;
  margin-top: .75rem;
  padding-inline: 1.25rem;
  width: 100%;
  min-width: 0;
}
.mobile-accordion{ border-bottom: 1px solid var(--color-line); }
.mobile-accordion__trigger{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: none;
  border: none;
  font-weight: 600;
  padding: .9rem 0;
  cursor: pointer;
  text-align: left;
  color: var(--color-heading);
}
.mobile-accordion__trigger .caret{ transition: transform .2s var(--ease); }
.mobile-accordion.is-open .mobile-accordion__trigger .caret{ transform: rotate(180deg); }
.mobile-accordion__panel{
  display: flex;
  flex-direction: column;
  max-height: 0;
  overflow: hidden;
  padding-left: 1rem;
  transition: max-height .3s var(--ease);
}
.mobile-accordion.is-open .mobile-accordion__panel{ max-height: 400px; }
.mobile-accordion__panel a{ padding: .55rem 0; color: var(--color-text-light); font-weight: 500; }

@media (max-width: 1140px){
  .nav-links--mega{ display: none; }
  .hamburger{ display: flex; }
  .mobile-menu{ display: flex; }
}

/* ---------- Referral partners page ---------- */
.referral-page{
  --referral-bg: var(--color-dark-navy);
  --referral-red: var(--color-action);
  --referral-copy: var(--color-text-light);
  min-height: 100vh;
  color: var(--referral-copy);
  background-color: var(--referral-bg);
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(60deg, transparent 48%, rgba(255,255,255,.025) 49%, rgba(255,255,255,.025) 51%, transparent 52%),
    linear-gradient(-60deg, transparent 48%, rgba(255,255,255,.025) 49%, rgba(255,255,255,.025) 51%, transparent 52%);
  background-size: 100% 72px, 72px 124px, 72px 124px;
  background-position: 0 0, 0 0, 36px 62px;
}
.referral-header{
  border-bottom: 1px solid rgba(255,255,255,.06);
  background: rgba(3,7,27,.92);
}
.referral-header .container{
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.referral-header .logo__word{ color: #fff; }
.referral-header__link{
  color: rgba(255,255,255,.7);
  font-size: .88rem;
  font-weight: 600;
  transition: color .2s var(--ease);
}
.referral-header__link:hover{ color: var(--referral-red); }
.referral-nav-link{ color: var(--color-text-light); }
.referral-nav-link:hover{ color: var(--color-sky-blue); }
.referral-hero{
  min-height: calc(100vh - 77px);
  display: flex;
  align-items: center;
  padding: clamp(4.5rem, 10vw, 8rem) 0 5rem;
  position: relative;
  overflow: hidden;
}
.referral-hero::after{
  content: '';
  position: absolute;
  width: 58vw;
  height: 58vw;
  top: -18vw;
  right: -20vw;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,90,47,.1), transparent 65%);
  pointer-events: none;
}
.referral-hero .container{ position: relative; z-index: 1; }
.referral-hero__content{ max-width: 820px; }
.referral-hero__eyebrow{
  margin-bottom: 1rem;
  color: var(--referral-red);
  font-size: .86rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.referral-hero h1{
  max-width: 760px;
  margin-bottom: 1.5rem;
  color: #f4f5f8;
  font-size: clamp(3.25rem, 7vw, 5.2rem);
  line-height: .98;
  letter-spacing: -.055em;
}
.referral-hero h1 .accent{ color: var(--referral-red); }
.referral-hero__lede{
  max-width: 760px;
  margin-bottom: 1.15rem;
  color: #dce5f8;
  font-size: clamp(1.02rem, 1.5vw, 1.25rem);
  line-height: 1.55;
}
.referral-hero__actions{
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 2.6rem;
}
.referral-hero__actions .btn{
  min-height: 58px;
  padding: .95rem 1.7rem;
  border-radius: 8px;
  font-weight: 700;
}
.referral-hero__actions .btn-primary{
  background: var(--color-action-strong);
  border-color: var(--color-action-strong);
}
.referral-hero__actions .btn-primary:hover{ background: var(--referral-red); border-color: var(--referral-red); }
.referral-hero__actions .btn-secondary{
  background: #303239;
  border-color: #303239;
  color: #fff;
}
.referral-hero__actions .btn-secondary:hover{ background: #3b3d46; border-color: #3b3d46; }
.referral-trust{
  max-width: 820px;
  margin-top: 3rem;
  padding-top: 1.8rem;
  border-top: 1px solid rgba(255,255,255,.1);
}
.referral-trust__label{
  margin-bottom: 1.2rem;
  color: #c9d2e5;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.referral-trust__badges{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2.7rem;
}
.referral-badge{
  min-width: 70px;
  color: rgba(255,255,255,.86);
  font-size: .68rem;
  font-weight: 700;
  line-height: 1.05;
  text-align: center;
  text-transform: uppercase;
}
.referral-badge--cyber{
  width: 42px;
  padding: .35rem .2rem;
  border-radius: 3px;
  background: linear-gradient(#087da7, #21305f);
  color: #fff;
  font-size: .46rem;
  letter-spacing: -.02em;
}
.referral-badge--crest{
  width: 30px;
  padding: .42rem .14rem;
  border: 2px solid #dce5f8;
  background: #f2f5fb;
  color: #127b9a;
  font-size: .48rem;
  line-height: 1.1;
}
.referral-badge--csc{
  min-width: 118px;
  font-size: .73rem;
  letter-spacing: -.04em;
}
.referral-badge--csc strong{ display: block; font-size: 1.15rem; letter-spacing: -.08em; }
.referral-benefits{
  padding: clamp(4.5rem, 8vw, 7rem) 0 clamp(5rem, 9vw, 8rem);
  background: #fff;
  color: #102044;
}
.referral-benefits__eyebrow{
  margin-bottom: .85rem;
  color: var(--color-action);
  font-size: .86rem;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.referral-benefits h2{
  max-width: 760px;
  margin-bottom: 1.35rem;
  color: #071b43;
  font-size: clamp(2.25rem, 4vw, 3.2rem);
  letter-spacing: -.045em;
}
.referral-benefits__rule{
  width: 54px;
  height: 3px;
  margin-bottom: clamp(3.5rem, 7vw, 5.5rem);
  background: var(--color-action);
}
.referral-benefits__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3.5rem 5.5rem;
}
.referral-benefit{
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 1rem;
}
.referral-benefit__icon{
  display: grid;
  width: 21px;
  height: 21px;
  place-items: center;
  margin-top: .2rem;
  border: 1.5px solid var(--color-action);
  border-radius: 50%;
  color: var(--color-action);
  font-size: .8rem;
  font-weight: 700;
  line-height: 1;
}
.referral-benefit h3{
  margin-bottom: .5rem;
  color: #071b43;
  font-size: 1.1rem;
}
.referral-benefit p{
  margin-bottom: 1.25rem;
  color: #405574;
  font-size: 1.05rem;
  line-height: 1.65;
}
.referral-benefit p:last-child{ margin-bottom: 0; }
.referral-benefit a{ color: #0648b7; text-decoration: underline; text-underline-offset: 2px; }
.referral-benefit a:hover{ color: var(--color-action); }
.referral-audience{
  padding: clamp(4.5rem, 8vw, 7rem) 0 clamp(5rem, 9vw, 8rem);
  background: #f3f6fa;
  color: #102044;
}
.referral-audience__eyebrow{
  margin-bottom: .85rem;
  color: var(--color-action);
  font-size: .86rem;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.referral-audience h2{
  max-width: 780px;
  margin-bottom: 1.35rem;
  color: #071b43;
  font-size: clamp(2.25rem, 4vw, 3.2rem);
  letter-spacing: -.045em;
}
.referral-audience__rule{
  width: 48px;
  height: 3px;
  margin-bottom: 1.6rem;
  background: var(--color-action);
}
.referral-audience__intro{
  max-width: 760px;
  margin-bottom: 2.5rem;
  color: #294467;
  font-size: 1.04rem;
  line-height: 1.55;
}
.referral-audience__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 4rem;
}
.referral-audience__item{
  padding: 1.45rem 0 2.2rem;
  border-top: 2px solid rgba(16,32,68,.12);
}
.referral-audience__title{
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: .75rem;
}
.referral-audience__title h3{
  margin: 0;
  color: #071b43;
  font-size: 1.12rem;
}
.referral-audience__icon{
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  fill: none;
  stroke: var(--color-action);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
}
.referral-audience__item p{
  max-width: 560px;
  color: #294467;
  font-size: 1.04rem;
  line-height: 1.6;
}
.referral-process{
  padding: 1.75rem 0 4.5rem;
  background: #fff;
  color: #102044;
}
.referral-process__eyebrow,
.referral-faq__eyebrow{
  margin-bottom: .3rem;
  color: var(--color-action);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.referral-process h2,
.referral-faq h2{
  margin-bottom: 1.15rem;
  color: #071b43;
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  letter-spacing: -.04em;
}
.referral-process__intro{
  margin-bottom: 1.6rem;
  color: #294467;
  font-size: .82rem;
}
.referral-process__grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
}
.referral-process__step{
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: .8rem;
}
.referral-process__number{
  color: var(--color-action);
  font-size: .75rem;
  font-weight: 700;
}
.referral-process__step h3{
  margin-bottom: .45rem;
  color: #071b43;
  font-size: .95rem;
}
.referral-process__step p{
  color: #405574;
  font-size: .8rem;
  line-height: 1.55;
}
.referral-form-section{
  padding: 4.5rem 1.25rem 5.5rem;
  background: #fff;
}
.referral-form-section__inner{
  width: 100%;
  max-width: 560px;
  margin: 0 auto;
}
.referral-form-section h2{
  margin-bottom: .45rem;
  color: #071b43;
  font-size: clamp(1.7rem, 3vw, 2.2rem);
  letter-spacing: -.04em;
}
.referral-form-section__inner > p{
  margin-bottom: 1.5rem;
  color: #405574;
  font-size: .82rem;
  line-height: 1.5;
}
.referral-form{
  padding: 1rem;
  border: 1px solid #d7dce3;
  border-radius: 8px;
  background: #f7f8fa;
}
.referral-form__row{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
}
.referral-form label{
  display: block;
  margin-bottom: .8rem;
  color: #102044;
  font-size: .64rem;
  font-weight: 600;
}
.referral-form input:not([type="checkbox"]),
.referral-form textarea{
  display: block;
  width: 100%;
  margin-top: .3rem;
  padding: .6rem .65rem;
  border: 1px solid #d9dee6;
  border-radius: 5px;
  background: #fff;
  color: #102044;
  font: inherit;
  font-size: .8rem;
}
.referral-form textarea{ resize: vertical; }
.referral-form__consent{
  display: flex !important;
  align-items: flex-start;
  gap: .4rem;
  font-size: .62rem !important;
  font-weight: 400 !important;
  line-height: 1.4;
}
.referral-form__consent input{ margin-top: .1rem; accent-color: var(--color-action); }
.referral-form__consent a{ color: var(--color-action); text-decoration: underline; }
.referral-form__submit{
  display: block;
  width: 100%;
  padding: .7rem 1rem;
  border-radius: 5px;
  background: var(--color-action);
  border-color: var(--color-action);
  font-size: .78rem;
}
.referral-faq{
  padding: 4rem 0 6rem;
  background: #fff;
  color: #102044;
}
.referral-faq__eyebrow,
.referral-faq h2{ text-align: center; }
.referral-faq h2{ margin-bottom: 2rem; }
.referral-faq__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 4rem;
}
.referral-faq details{
  border-bottom: 1px solid #dfe3e8;
}
.referral-faq summary{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 0;
  color: #071b43;
  cursor: pointer;
  font-size: .78rem;
  font-weight: 600;
  list-style: none;
}
.referral-faq summary::-webkit-details-marker{ display: none; }
.referral-faq summary::after{ content: '+'; color: #7b8798; font-size: 1rem; font-weight: 400; }
.referral-faq details[open] summary::after{ content: '−'; }
.referral-faq details p{
  padding: 0 0 1rem;
  color: #405574;
  font-size: .78rem;
  line-height: 1.55;
}
@media (max-width: 640px){
  .referral-header .container{ min-height: 64px; }
  .referral-header__link{ font-size: .78rem; }
  .referral-hero{ min-height: calc(100vh - 65px); padding-top: 4rem; }
  .referral-hero h1{ font-size: clamp(2.8rem, 14vw, 4.2rem); }
  .referral-hero__actions{ margin-top: 2rem; }
  .referral-hero__actions .btn{ width: 100%; justify-content: center; }
  .referral-trust__badges{ gap: 1.5rem 2rem; }
  .referral-benefits__grid{ grid-template-columns: 1fr; gap: 2.75rem; }
  .referral-benefit p{ font-size: 1rem; }
  .referral-audience__grid{ grid-template-columns: 1fr; }
  .referral-audience__desktop-break{ display: none; }
  .referral-audience__item{ padding-bottom: 2rem; }
  .referral-audience__item p{ font-size: 1rem; }
  .referral-process__grid,
  .referral-faq__grid{ grid-template-columns: 1fr; }
  .referral-process__grid{ gap: 1.75rem; }
  .referral-form__row{ grid-template-columns: 1fr; gap: 0; }
}

/* ---------- Hero ---------- */
.section-hero{
  position: relative;
  background: var(--color-dark-navy);
  padding: var(--spacing-2xl) 0 calc(var(--spacing-2xl) + 2rem);
  overflow: hidden;
}
.section-hero .container{ position: relative; z-index: 1; }
.hero-layout{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .9fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 6rem);
}
.hero-content{ max-width: 760px; text-align: left; }
.hero-content .eyebrow{ text-align: center; }
.hero-content .hero-lede{ margin-left: auto; margin-right: auto; }
.hero-content .eyebrow{ text-align: left; }
.hero-content .flex{ justify-content: flex-start; }
.hero-content .hero-reassurance{ justify-content: flex-start; }
.section-hero h1{ margin-bottom: var(--spacing-md); }
.hero-art{
  position: relative;
  max-width: 560px;
  justify-self: end;
  border: 1px solid rgba(111,131,180,.28);
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255,90,47,.08), 0 24px 70px rgba(0,0,0,.42);
}
.hero-art::after{
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.15) 48%, transparent 60%);
  transform: translateX(-120%);
  animation: hero-art-scan 6s ease-in-out infinite;
  pointer-events: none;
}
.hero-art img{ width: 100%; height: auto; }
@keyframes hero-art-scan{
  0%, 45%{ transform: translateX(-120%); }
  70%, 100%{ transform: translateX(120%); }
}

.hero-scroll-cue{
  position: relative;
  z-index: 1;
  display: flex;
  margin: var(--spacing-xl) auto 0;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  animation: cue-bounce 2.2s ease-in-out infinite;
}
.hero-scroll-cue svg{ width: 18px; height: 18px; }
@keyframes cue-bounce{
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(6px); }
}

@media (max-width: 900px){
  .hero-layout{ grid-template-columns: 1fr; gap: var(--spacing-xl); }
  .hero-content{ max-width: 760px; margin: 0 auto; text-align: center; }
  .hero-content .eyebrow,
  .hero-content .flex,
  .hero-content .hero-reassurance{ justify-content: center; text-align: center; }
  .hero-art{ width: min(100%, 560px); justify-self: center; }
}

/* ---------- Homepage: hero reassurance line ---------- */
.hero-lede{ font-size: 1.125rem; margin-bottom: var(--spacing-lg); max-width: 560px; }
.hero-reassurance{
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .85rem;
  color: rgba(255,255,255,.6);
  margin-top: var(--spacing-md);
}
.hero-reassurance svg.icon{ width: 15px; height: 15px; color: var(--color-sky-blue); }

/* ---------- Trust bar ---------- */
.trust-bar{
  background: var(--color-navy-soft);
  padding: var(--spacing-lg) 0;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.trust-bar__label{
  text-align: center;
  font-family: var(--font-mono);
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.45);
  margin-bottom: var(--spacing-sm);
}
.trust-bar__row{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-lg);
}
.trust-bar__row span{
  font-family: var(--font-display);
  font-weight: 600;
  font-size: .95rem;
  color: rgba(255,255,255,.65);
  letter-spacing: .01em;
}

/* ---------- Dark section (reusable for differentiation / methodology / final CTA) ---------- */
#lead-form{ scroll-margin-top: 90px; }
.section-dark{
  background: linear-gradient(180deg, var(--color-dark-navy) 0%, var(--color-navy-soft) 100%);
  padding: var(--spacing-2xl) 0;
}

/* ---------- Problem section ---------- */
.problem-grid{ grid-template-columns: 1fr 1fr; gap: var(--spacing-md); }
.problem-item{
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  padding: var(--spacing-sm);
}
.problem-item svg.icon{
  width: 22px; height: 22px;
  color: var(--color-action);
  flex-shrink: 0;
  margin-top: .15rem;
}
.problem-item strong{
  display: block;
  font-family: var(--font-display);
  font-size: .92rem;
  color: var(--color-heading);
  margin-bottom: .2rem;
}
.problem-item span{ font-size: .85rem; color: var(--color-text-light); line-height: 1.5; }
@media (max-width: 700px){ .problem-grid{ grid-template-columns: 1fr; } }

/* ---------- Differentiator cards ---------- */
.diff-card{
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-md);
  padding: var(--spacing-md);
  transition: border-color .25s var(--ease), transform .25s var(--ease);
}
.diff-card:hover{ border-color: rgba(255,90,47,.35); transform: translateY(-3px); }
.diff-card svg.icon{ width: 26px; height: 26px; color: var(--color-sky-blue); margin-bottom: var(--spacing-sm); }
.diff-card h3{ font-size: 1rem; margin-bottom: .4rem; }
.diff-card p{ font-size: .85rem; color: rgba(255,255,255,.55); line-height: 1.5; }

/* ---------- Service tiles ---------- */
.service-tile{
  display: block;
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  padding: var(--spacing-md);
  transition: transform .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.service-tile:hover{
  transform: translateY(-4px);
  border-color: rgba(255,90,47,.35);
  box-shadow: var(--shadow-glow);
}
.service-tile svg.icon{ width: 24px; height: 24px; color: var(--color-sky-blue); margin-bottom: var(--spacing-sm); }
.service-tile h3{ font-size: 1rem; margin-bottom: .35rem; }
.service-tile p{ font-size: .84rem; line-height: 1.5; margin-bottom: var(--spacing-sm); }
.service-tile__tag{
  display: inline-block;
  font-family: var(--font-mono);
  font-size: .68rem;
  letter-spacing: .02em;
  color: var(--color-sky-blue);
  border-top: 1px solid var(--color-line);
  padding-top: .5rem;
  width: 100%;
}

/* ---------- Process rail ---------- */
.process-rail{
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: var(--spacing-md);
  margin-top: var(--spacing-xl);
  position: relative;
}
.process-rail::before{
  content: '';
  position: absolute;
  top: 18px;
  left: 4%;
  right: 4%;
  height: 1px;
  background: rgba(255,255,255,.12);
  z-index: 0;
}
.process-step{ position: relative; z-index: 1; }
.process-step__num{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--color-dark-navy);
  border: 1.5px solid var(--color-action);
  color: var(--color-sky-blue);
  font-family: var(--font-mono);
  font-size: .8rem;
  font-weight: 700;
  margin-bottom: var(--spacing-sm);
}
.process-step h3{ font-size: .95rem; margin-bottom: .35rem; }
.process-step p{ font-size: .82rem; color: rgba(255,255,255,.55); line-height: 1.5; }
@media (max-width: 900px){
  .process-rail{ grid-template-columns: repeat(3, 1fr); }
  .process-rail::before{ display: none; }
}
@media (max-width: 560px){
  .process-rail{ grid-template-columns: 1fr 1fr; }
}

/* ---------- Technical depth tag cloud ---------- */
.tech-tags{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .6rem;
  max-width: 760px;
  margin: 0 auto;
}
.tech-tags span{
  font-family: var(--font-mono);
  font-size: .78rem;
  letter-spacing: .02em;
  font-weight: 700;
  color: #fff;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.2);
  border-left: 3px solid var(--color-action);
  box-shadow: inset 0 0 0 1px rgba(255,90,47,.08);
  padding: .55rem 1rem;
  border-radius: 999px;
}

/* Categorized framework groups (comprehensive standards list) */
.framework-groups{ align-items: start; }
.section-white#frameworks{
  position: relative;
  overflow: hidden;
  padding-top: clamp(4rem, 8vw, 7rem);
  padding-bottom: clamp(4rem, 8vw, 7rem);
  background:
    radial-gradient(circle at 12% 18%, rgba(255,90,47,.1), transparent 24%),
    linear-gradient(135deg, #07143d 0%, #03071b 100%);
}
.section-white#frameworks::before{
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(147,171,227,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(147,171,227,.045) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: linear-gradient(135deg, rgba(0,0,0,.85), transparent 72%);
  pointer-events: none;
}
.section-white#frameworks .container{ position: relative; z-index: 1; }
.section-white#frameworks > .container > h2{
  max-width: 920px;
  margin-right: auto;
  margin-left: auto;
  font-size: clamp(2.2rem, 4.5vw, 4.1rem);
  letter-spacing: -.045em;
}
.section-white#frameworks > .container > p:not(.eyebrow){
  color: #c6d2eb;
  font-size: 1.05rem;
  line-height: 1.65;
}
.framework-group h4{
  font-family: var(--font-mono);
  font-size: .72rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-heading);
  text-align: center;
  margin-bottom: var(--spacing-sm);
  padding: .75rem .8rem;
  border: 1px solid rgba(147,171,227,.18);
  border-bottom-color: rgba(255,90,47,.65);
  border-radius: 8px;
  background: rgba(16,36,95,.48);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.tech-tags--column{
  flex-direction: column;
  align-items: center;
  max-width: none;
  gap: .65rem;
}
.tech-tags--column span{
  width: 100%;
  text-align: center;
  box-sizing: border-box;
  min-height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(31,48,101,.78);
  border-color: rgba(147,171,227,.28);
  border-left-color: var(--color-action);
  box-shadow: 0 8px 18px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.04);
  transition: transform .2s var(--ease), border-color .2s var(--ease), background .2s var(--ease);
}
.tech-tags--column span:hover{
  transform: translateX(4px);
  background: rgba(44,65,131,.9);
  border-color: rgba(255,150,112,.65);
}
@media (max-width: 900px){
  .framework-groups{ grid-template-columns: 1fr 1fr; gap: var(--spacing-lg) var(--spacing-md); }
}
@media (max-width: 560px){
  .framework-groups{ grid-template-columns: 1fr; }
}

/* ---------- Frameworks section: modern standards index ---------- */
.section-white#frameworks{
  padding: clamp(5rem, 10vw, 9rem) 0;
  background: #03071b;
}
.section-white#frameworks::before{
  background-image: linear-gradient(90deg, rgba(255,90,47,.12) 1px, transparent 1px);
  background-size: 20% 100%;
  mask-image: linear-gradient(90deg, #000, transparent 90%);
  opacity: .35;
}
.section-white#frameworks > .container > .eyebrow{
  width: max-content;
  margin-bottom: 1.25rem;
  padding: .45rem .7rem;
  border: 1px solid rgba(255,90,47,.35);
  border-radius: 4px;
  background: rgba(255,90,47,.08);
  text-align: left;
}
.section-white#frameworks > .container > h2{
  max-width: 820px;
  margin: 0 0 1.25rem;
  text-align: left;
  font-size: clamp(2.5rem, 5vw, 5rem);
  line-height: .98;
}
.section-white#frameworks > .container > p:not(.eyebrow){
  max-width: 680px;
  margin: 0 0 clamp(3rem, 6vw, 5rem);
  text-align: left;
  color: #9eacc8;
}
.framework-groups{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  counter-reset: framework-card;
}
.framework-group{
  position: relative;
  min-height: 430px;
  padding: 1.25rem;
  border: 1px solid rgba(147,171,227,.16);
  border-radius: 12px;
  background: linear-gradient(160deg, rgba(16,36,95,.82), rgba(5,11,42,.92));
  box-shadow: 0 18px 40px rgba(0,0,0,.22);
  counter-increment: framework-card;
  transition: transform .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.framework-group::before{
  content: '0' counter(framework-card);
  display: block;
  margin-bottom: 3.5rem;
  color: rgba(255,150,112,.9);
  font-family: var(--font-mono);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
}
.framework-group::after{
  content: '';
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  width: 34px;
  height: 1px;
  background: var(--color-action);
  box-shadow: 0 5px 0 rgba(255,90,47,.35), 0 10px 0 rgba(255,90,47,.16);
}
.framework-group:hover{
  transform: translateY(-6px);
  border-color: rgba(255,112,72,.65);
  box-shadow: 0 24px 50px rgba(0,0,0,.35), 0 0 0 1px rgba(255,90,47,.08);
}
.framework-group h4{
  margin: 0 0 1.25rem;
  padding: 0;
  border: 0;
  background: none;
  color: #f4f7ff;
  font-family: var(--font-display);
  font-size: 1.15rem;
  letter-spacing: -.02em;
  line-height: 1.15;
  text-align: left;
  text-transform: none;
}
.tech-tags--column{
  display: flex;
  align-items: flex-start;
  gap: .45rem;
}
.tech-tags--column span{
  width: auto;
  min-height: 0;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  padding: .48rem .65rem;
  border: 1px solid rgba(147,171,227,.2);
  border-left: 2px solid rgba(255,90,47,.8);
  border-radius: 5px;
  background: rgba(7,20,61,.8);
  color: #cbd7ed;
  font-family: var(--font-body);
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.2;
  text-align: left;
  box-shadow: none;
  transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.tech-tags--column span:hover{
  transform: none;
  border-color: rgba(255,150,112,.65);
  background: rgba(255,90,47,.12);
  color: #fff;
}
@media (max-width: 900px){
  .framework-groups{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .section-white#frameworks > .container > h2{ font-size: clamp(2.3rem, 12vw, 3.5rem); }
  .framework-groups{ grid-template-columns: 1fr; }
  .framework-group{ min-height: 0; }
}

/* ---------- Case study flow ---------- */
.case-flow{ display: flex; flex-direction: column; gap: var(--spacing-md); margin: var(--spacing-md) 0; }
.case-flow strong{
  display: block;
  font-family: var(--font-mono);
  font-size: .7rem;
  letter-spacing: .06em;
  color: var(--color-action);
  margin-bottom: .25rem;
}
.case-flow p{ margin: 0; font-size: .92rem; }

/* ---------- Report preview mockup ---------- */
.report-preview{
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  padding: var(--spacing-lg);
  box-shadow: var(--shadow-lg);
}
.report-preview__topbar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--spacing-md);
}
.report-preview__topbar > span:first-child{
  font-family: var(--font-mono);
  font-size: .65rem;
  letter-spacing: .05em;
  color: var(--color-text-light);
}
.severity-badge{
  font-family: var(--font-mono);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  padding: .25rem .6rem;
  border-radius: 4px;
}
.severity-badge--critical{ background: rgba(255,90,47,.18); color: var(--orange-300); }
.severity-badge--high{ background: rgba(255,177,95,.18); color: var(--color-warning); }
.severity-badge--medium{ background: rgba(255,90,47,.18); color: var(--color-sky-blue); }
.severity-badge--low{ background: rgba(255,255,255,.1); color: rgba(255,255,255,.6); }
.report-preview h4{ font-size: 1rem; margin-bottom: var(--spacing-md); line-height: 1.4; }
.report-preview__row{ margin-bottom: var(--spacing-sm); padding-bottom: var(--spacing-sm); border-bottom: 1px solid var(--color-line); }
.report-preview__row:last-of-type{ border-bottom: none; }
.report-preview__row strong{
  display: block;
  font-family: var(--font-mono);
  font-size: .65rem;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--color-text-light);
  margin-bottom: .25rem;
}
.report-preview__row p{ margin: 0; font-size: .86rem; }
.report-preview__footer{
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .8rem;
  color: #7FD99A;
  margin-top: var(--spacing-sm);
}
.report-preview__footer svg.icon{ width: 15px; height: 15px; }

/* ---------- FAQ accordion ---------- */
.faq-item{ border-bottom: 1px solid var(--color-line); }
.faq-item__trigger{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: none;
  border: none;
  padding: var(--spacing-sm) 0;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: .95rem;
  color: var(--color-heading);
  text-align: left;
  cursor: pointer;
}
.faq-item__trigger .caret{ transition: transform .2s var(--ease); color: var(--color-action); }
.faq-item.is-open .faq-item__trigger .caret{ transform: rotate(180deg); }
.faq-item__panel{
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s var(--ease);
}
.faq-item.is-open .faq-item__panel{ max-height: 220px; }
.faq-item__panel p{ padding-bottom: var(--spacing-sm); font-size: .9rem; }
.faq-item__panel a{ color: var(--color-action); text-decoration: underline; }

/* ---------- Lead form (final CTA) ---------- */
.lead-form{
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-lg);
  padding: var(--spacing-lg);
}
.lead-form__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  margin-bottom: .75rem;
}
.lead-form input,
.lead-form textarea{
  width: 100%;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: var(--radius-sm);
  padding: .7rem .85rem;
  color: #fff;
  font-family: var(--font-body);
  font-size: .88rem;
  resize: vertical;
  transition: border-color .2s var(--ease), background .2s var(--ease);
}
.lead-form input::placeholder,
.lead-form textarea::placeholder{ color: rgba(255,255,255,.4); }
.lead-form input:focus,
.lead-form textarea:focus{
  outline: none;
  border-color: var(--color-action);
  background: rgba(255,255,255,.09);
}
.lead-form textarea{ margin-bottom: var(--spacing-md); }
.lead-form__submit{ width: 100%; }
.lead-form__note{
  font-size: .75rem;
  color: rgba(255,255,255,.45);
  text-align: center;
  margin-top: var(--spacing-sm);
}
@media (max-width: 560px){
  .lead-form__grid{ grid-template-columns: 1fr; }
}

/* ---------- Scroll-depth consultation popup ---------- */
.consult-popup{
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-lg);
  background: rgba(3,7,27,.72);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s var(--ease), visibility .22s var(--ease);
}
.consult-popup.is-open{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.consult-popup__dialog{
  position: relative;
  width: min(100%, 520px);
  background: var(--color-surface);
  border: 1px solid rgba(255,255,255,.18);
  border-top: 4px solid var(--color-action);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: clamp(1.25rem, 4vw, 2rem);
  transform: translateY(16px) scale(.98);
  transition: transform .22s var(--ease);
}
.consult-popup.is-open .consult-popup__dialog{ transform: translateY(0) scale(1); }
.consult-popup__close{
  position: absolute;
  top: .8rem;
  right: .8rem;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 50%;
  background: rgba(255,255,255,.06);
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.consult-popup__close:hover{ background: rgba(255,90,47,.16); border-color: var(--color-action); }
.consult-popup h2{
  font-size: clamp(1.45rem, 3vw, 2rem);
  margin: 0 2.5rem .6rem 0;
}
.consult-popup p{
  color: var(--color-text-light);
  margin-bottom: var(--spacing-md);
}
.consult-popup__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
}
.consult-popup input,
.consult-popup textarea{
  width: 100%;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
  border-radius: var(--radius-sm);
  padding: .8rem .95rem;
  font-family: var(--font-body);
  font-size: .92rem;
}
.consult-popup textarea{
  min-height: 104px;
  resize: vertical;
  margin: .75rem 0 var(--spacing-md);
}
.consult-popup input::placeholder,
.consult-popup textarea::placeholder{ color: rgba(255,255,255,.55); }
.consult-popup input:focus,
.consult-popup textarea:focus{
  outline: none;
  border-color: var(--color-action);
  background: rgba(255,255,255,.1);
}
.consult-popup__submit{ width: 100%; }
@media (max-width: 560px){
  .consult-popup{ padding: var(--spacing-md); align-items: flex-end; }
  .consult-popup__grid{ grid-template-columns: 1fr; }
}

/* ---------- Sections ---------- */
.section-white{ background: var(--color-paper); padding: var(--spacing-2xl) 0; }
.section-light{ background: var(--color-mist); padding: var(--spacing-2xl) 0; }

/* ---------- Cards ---------- */
.card{
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  padding: var(--spacing-lg);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.card:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow-glow);
  border-color: rgba(255,90,47,.25);
}
.card h3{ margin-top: var(--spacing-md); }
.card p{ font-size: .95rem; }
.card ul{ margin-top: var(--spacing-sm); }
.card ul li{
  display: flex;
  align-items: center;
  padding: .3rem 0;
  font-size: .92rem;
  color: var(--color-text-light);
}

.card-icon{
  width: 56px;
  height: 56px;
  border-radius: var(--radius-md);
  background: rgba(185,198,253,.45);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .3s var(--ease);
}
.card:hover .card-icon{ transform: scale(1.08) rotate(-4deg); }
.card-icon svg.icon{ width: 26px; height: 26px; }
.card-icon svg.icon.icon--on-color{ color: #fff; }
.card-icon svg.icon.icon--brand{ color: var(--color-action); }
.card-icon:not([style]) svg.icon:not(.icon--on-color):not(.icon--brand){ color: var(--color-action); }

/* ---------- CTA / blog / trust supporting bits ---------- */
h3 svg.icon{ width: 20px; height: 20px; vertical-align: -4px; margin-right: .35rem; color: var(--color-sky-blue); }
.blog-icon{ width: 38px; height: 38px; color: #fff; }
.li-check{ width: 14px; height: 14px; margin-right: .45rem; vertical-align: -2px; color: var(--color-sky-blue); }

article.card{ display: flex; flex-direction: column; }

/* ---------- Blog index: editorial feed ---------- */
.blog-hero{
  position: relative;
  overflow: hidden;
  min-height: 640px;
  padding: 2rem 0 5rem;
  background:
    radial-gradient(circle at 76% 45%, rgba(255,90,47,.42), transparent 25%),
    radial-gradient(circle at 58% 25%, rgba(52,134,255,.18), transparent 24%),
    linear-gradient(135deg, #020515 0%, #07143d 58%, #101f67 100%);
}
.blog-hero::before{
  content: '';
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(147,171,227,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(147,171,227,.06) 1px, transparent 1px);
  background-size: 70px 70px;
  mask-image: radial-gradient(circle at 80% 45%, #000, transparent 65%);
  pointer-events: none;
}
.blog-hero .container{ position: relative; z-index: 1; }
.blog-hero__breadcrumbs{ color: rgba(214,228,255,.65); }
.blog-hero__breadcrumbs a,
.blog-hero__breadcrumbs .is-current{ color: rgba(214,228,255,.8); }
.blog-hero__layout{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .8fr);
  align-items: center;
  gap: 4rem;
  min-height: 500px;
}
.blog-hero__content{ max-width: 700px; }
.blog-hero__content .eyebrow{ width: max-content; margin-bottom: 1.5rem; text-align: left; }
.blog-hero h1{
  margin: 0 0 1.5rem;
  color: #f4f7ff;
  font-size: clamp(4rem, 8vw, 8rem);
  line-height: .86;
  letter-spacing: -.075em;
}
.blog-hero h1 span{ color: #ff7048; }
.blog-hero__lede{
  max-width: 520px;
  margin-bottom: 2.25rem;
  color: #c4d0e8;
  font-size: 1.15rem;
  line-height: 1.5;
}
.blog-hero__cta{
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  padding: .95rem 1.6rem;
  border-radius: 999px;
  background: #f4f7ff;
  color: #07143d;
  font-size: 1rem;
  font-weight: 700;
  transition: transform .2s var(--ease), background .2s var(--ease), color .2s var(--ease);
}
.blog-hero__cta:hover{ transform: translateY(-3px); background: #ff7048; color: #fff; }
.blog-hero__art{
  position: relative;
  width: min(100%, 480px);
  aspect-ratio: 1 / 1;
  justify-self: end;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,112,72,.34), rgba(52,134,255,.1) 42%, transparent 68%);
  filter: saturate(1.25);
}
.blog-hero__ring{
  position: absolute;
  inset: 13%;
  border: 1px solid rgba(147,171,227,.32);
  border-radius: 50%;
  transform: rotate(24deg) scaleX(.78);
}
.blog-hero__ring--two{ inset: 25%; border-color: rgba(255,112,72,.9); transform: rotate(-34deg) scaleX(.72); box-shadow: 0 0 28px rgba(255,90,47,.28); }
.blog-hero__shield{
  position: absolute;
  inset: 32%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 3px solid #ff7048;
  border-radius: 28% 28% 42% 42%;
  background: rgba(7,20,61,.85);
  color: #f4f7ff;
  box-shadow: 0 0 70px rgba(255,90,47,.52), 0 0 24px rgba(52,134,255,.28), inset 0 0 30px rgba(255,90,47,.18);
  transform: rotate(45deg);
}
.blog-hero__shield .icon{ width: 4rem; height: 4rem; transform: rotate(-45deg); color: #ff9670; filter: drop-shadow(0 0 10px rgba(255,150,112,.7)); }
.blog-hero__signal{ position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #ff9670; box-shadow: 0 0 20px 5px rgba(255,90,47,.55); }
.blog-hero__signal--one{ top: 18%; right: 20%; }
.blog-hero__signal--two{ bottom: 20%; left: 16%; background: #9db6f2; box-shadow: 0 0 20px 5px rgba(111,131,180,.55); }
.blog-hero__label{ position: absolute; right: 7%; bottom: 20%; color: rgba(244,247,255,.6); font-family: var(--font-mono); font-size: .65rem; letter-spacing: .16em; }
.blog-feed-section{
  background: #f7f8fb;
  padding: clamp(3rem, 7vw, 6rem) 0;
}
.blog-feed{
  max-width: 1000px;
  margin: 0 auto;
}
.blog-post{
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: clamp(2rem, 6vw, 5rem);
  align-items: center;
  padding: 2.5rem 0;
  border-top: 1px solid rgba(7,20,61,.14);
}
.blog-post:last-child{ border-bottom: 1px solid rgba(7,20,61,.14); }
.blog-post__body{ min-width: 0; }
.blog-post__meta{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .45rem;
  margin-bottom: 1rem;
  color: #59677f;
  font-size: .82rem;
}
.blog-post__avatar{
  display: inline-flex;
  width: 1.65rem;
  height: 1.65rem;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #ff7048;
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
}
.blog-post__link{ display: block; }
.blog-post__link h2{
  max-width: 680px;
  margin: 0 0 .65rem;
  color: #07143d;
  font-size: clamp(1.8rem, 3.3vw, 3rem);
  line-height: 1.04;
  letter-spacing: -.045em;
}
.blog-post__link:hover h2{ color: #e8441d; }
.blog-post__link p{
  max-width: 650px;
  margin: 0;
  color: #58667d;
  font-size: 1.05rem;
  line-height: 1.5;
}
.blog-post__actions{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .8rem;
  margin-top: 1.5rem;
  color: #7a879d;
  font-size: .76rem;
}
.blog-post__actions span:not(:last-child)::after{
  content: '·';
  margin-left: .8rem;
  color: #b0b8c6;
}
.blog-post__actions a{
  margin-left: auto;
  color: #e8441d;
  font-weight: 700;
}
.blog-post__actions a:hover{ color: #07143d; }
.blog-post__visual{
  position: relative;
  display: flex;
  height: 150px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 4px;
  background: #07143d;
  color: #ff7048;
}
.blog-post__visual::before,
.blog-post__visual::after{
  content: '';
  position: absolute;
  border: 1px solid rgba(255,255,255,.18);
  transform: rotate(45deg);
}
.blog-post__visual::before{ width: 155px; height: 155px; }
.blog-post__visual::after{ width: 92px; height: 92px; border-color: rgba(255,112,72,.5); }
.blog-post__visual .icon{ position: relative; z-index: 1; width: 3.5rem; height: 3.5rem; }
.blog-post__visual span{
  position: absolute;
  right: .75rem;
  bottom: .65rem;
  z-index: 1;
  color: rgba(255,255,255,.65);
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .1em;
}
.blog-post__visual--cloud{ background: linear-gradient(135deg, #0b1b4d, #1c2e72); color: #a9c4ff; }
.blog-post__visual--api{ background: linear-gradient(135deg, #351326, #e8441d); color: #ffd0c0; }
@media (max-width: 700px){
  .blog-hero{ min-height: 760px; }
  .blog-hero__layout{ grid-template-columns: 1fr; gap: 2rem; }
  .blog-hero h1{ font-size: clamp(4rem, 18vw, 6rem); }
  .blog-hero__art{ width: min(100%, 350px); justify-self: center; }
  .blog-post{ grid-template-columns: 1fr; gap: 1.25rem; padding: 2rem 0; }
  .blog-post__visual{ order: -1; height: 170px; }
  .blog-post__actions a{ margin-left: 0; }
}

/* ---------- Interior page hero (lighter than homepage hero, no radar) ---------- */
.shop-category-nav{
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  justify-content: center;
  margin: 0 auto var(--spacing-2xl);
}
.shop-category-nav a{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .7rem 1rem;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  color: var(--color-heading);
  font-size: .9rem;
  font-weight: 600;
  transition: border-color .2s var(--ease), color .2s var(--ease), background .2s var(--ease);
}
.shop-category-nav a:hover{
  border-color: var(--color-action);
  background: rgba(255,90,47,.08);
  color: var(--color-action);
}
.shop-category-nav svg.icon{ width: 17px; height: 17px; color: var(--color-action); }
.shop-layout{
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  align-items: start;
  gap: var(--spacing-xl);
}
.shop-sidebar{
  position: sticky;
  top: 1rem;
  color: var(--color-text-light);
}
.shop-filter{
  padding: 0 0 1.25rem;
  border-bottom: 1px solid var(--color-line);
}
.shop-filter + .shop-filter{ padding-top: 1.25rem; }
.shop-filter h3{
  margin-bottom: .7rem;
  color: var(--color-heading);
  font-size: .92rem;
}
.shop-filter__links{
  display: flex;
  flex-direction: column;
  gap: .42rem;
}
.shop-filter__links a,
.shop-filter__more{
  color: var(--color-text-light);
  font-size: .78rem;
  line-height: 1.3;
  transition: color .2s var(--ease);
}
.shop-filter__links a:hover,
.shop-filter__more:hover{ color: var(--color-action); }
.shop-filter__more{
  display: inline-block;
  margin-top: .65rem;
  color: var(--color-sky-blue);
  font-size: .7rem;
  font-weight: 700;
}
.shop-filter__checks{
  display: flex;
  flex-direction: column;
  gap: .38rem;
}
.shop-filter__checks label{
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  color: var(--color-text-light);
  cursor: pointer;
  font-size: .76rem;
  line-height: 1.25;
}
.shop-filter__checks input{
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--color-action);
}
.shop-catalog-content{ min-width: 0; }
.shop-catalog{ scroll-margin-top: 100px; }
.shop-catalog + .shop-catalog{
  margin-top: var(--spacing-2xl);
  padding-top: var(--spacing-2xl);
  border-top: 1px solid var(--color-line);
}
.shop-catalog__heading{
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--spacing-lg);
  margin-bottom: var(--spacing-xl);
}
.shop-catalog__heading .eyebrow{
  margin-bottom: .5rem;
  text-align: left;
}
.shop-catalog__heading h2{ margin-bottom: 0; text-align: left; }
.shop-catalog__heading > p{
  max-width: 410px;
  margin-bottom: .25rem;
  font-size: .95rem;
}
.shop-category-card{
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: var(--spacing-lg);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  transition: transform .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.shop-category-card:hover{
  border-color: rgba(255,90,47,.45);
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}
.shop-category-card__icon{
  display: flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--spacing-md);
  border-radius: var(--radius-sm);
  background: rgba(255,90,47,.12);
  color: var(--color-action);
}
.shop-category-card__icon svg.icon{ width: 22px; height: 22px; }
.shop-category-card h3{ margin-bottom: .55rem; }
.shop-category-card p{ font-size: .92rem; line-height: 1.55; }
.shop-category-card .btn{ align-self: flex-start; margin-top: auto; padding-top: .7rem; padding-bottom: .7rem; }
.shop-product-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.shop-product{
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 4px;
  background: var(--color-surface);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.shop-product__anchor{
  position: absolute;
  margin-top: -100px;
}
.shop-product:hover{
  border-color: rgba(255,90,47,.4);
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}
.shop-product__image{
  display: flex;
  aspect-ratio: 1.22 / 1;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #142b67, #07143d);
  color: var(--color-action);
}
.shop-product__image svg.icon{ width: 62px; height: 62px; filter: drop-shadow(0 8px 12px rgba(0,0,0,.3)); }
.shop-product__image--screen{ background: linear-gradient(135deg, #dce5f8, #758ab0); color: #10245f; }
.shop-product__image--usb{ background: linear-gradient(135deg, #303e62, #0b1b4d); }
.shop-product__image--password{ background: linear-gradient(135deg, #10245f, #e8441d); color: #fff; }
.shop-product__image--vpn{ background: linear-gradient(135deg, #081536, #1c2e72); color: #ff9670; }
.shop-product__image--checklist{ background: linear-gradient(135deg, #f7faff, #b7c9e8); color: #e8441d; }
.shop-product__image--course{ background: linear-gradient(135deg, #0b1b4d, #ff7048); color: #fff; }
.shop-product__image--report{ background: linear-gradient(135deg, #10245f, #07143d); color: #ffb15f; }
.shop-product__body{ padding: .8rem .7rem .9rem; }
.shop-product h3{
  display: -webkit-box;
  min-height: 2.7em;
  overflow: hidden;
  color: var(--color-heading);
  font-size: .93rem;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.shop-product__price{
  margin-top: .45rem;
  color: var(--color-action);
  font-size: 1.08rem;
  font-weight: 600;
}
.shop-product__was{
  margin-top: .18rem;
  color: rgba(255,255,255,.48);
  font-size: .76rem;
  text-decoration: line-through;
}
.shop-product__was span{
  margin-left: .3rem;
  color: var(--color-text-light);
  text-decoration: none;
}
.shop-product__link{
  display: inline-block;
  margin-top: .55rem;
  color: var(--color-sky-blue);
  font-size: .76rem;
  font-weight: 600;
}
.shop-product__link:hover{ color: var(--color-action); }
.privacy-screen-form-section{
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: var(--spacing-2xl);
  margin-top: var(--spacing-2xl);
  padding: var(--spacing-2xl) 0 0;
  border-top: 1px solid var(--color-line);
  scroll-margin-top: 100px;
}
.privacy-screen-form-section__intro h2{ margin-bottom: .7rem; }
.privacy-screen-form-section__intro .eyebrow{ margin-bottom: .5rem; text-align: left; }
.privacy-screen-form-section__intro p:last-child{ max-width: 420px; font-size: .95rem; }
.privacy-screen-form{
  padding: var(--spacing-lg);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}
.privacy-screen-form__row{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--spacing-md);
}
.privacy-screen-form label{
  display: block;
  margin-bottom: var(--spacing-md);
  color: var(--color-text-light);
  font-size: .8rem;
  font-weight: 600;
}
.privacy-screen-form input,
.privacy-screen-form select,
.privacy-screen-form textarea{
  display: block;
  width: 100%;
  margin-top: .4rem;
  padding: .7rem .75rem;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  background: var(--color-dark-blueish-ash);
  color: var(--color-heading);
  font: inherit;
  font-size: .85rem;
}
.privacy-screen-form select option{ background: var(--color-dark-navy); color: #fff; }
.privacy-screen-form textarea{ resize: vertical; }
.privacy-screen-form__submit{ margin-top: .15rem; }
.shop-category-directory{
  margin-top: var(--spacing-2xl);
  padding-top: var(--spacing-2xl);
  border-top: 1px solid var(--color-line);
  scroll-margin-top: 100px;
}
.shop-category-directory--front{
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
  padding-bottom: var(--spacing-2xl);
}
.shop-page .shop-layout{ display: none; }
.shop-page .shop-layout.is-visible{ display: grid; }
.shop-category-directory--front[hidden]{ display: none; }
.shop-mode-switch{
  display: none;
  gap: .55rem;
  margin: 0 0 var(--spacing-lg);
  padding-bottom: var(--spacing-md);
  border-bottom: 1px solid var(--color-line);
}
.shop-page.is-catalog .shop-mode-switch{ display: flex; }
.shop-mode-switch a{
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .65rem .9rem;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  color: var(--color-text-light);
  font-size: .82rem;
  font-weight: 600;
}
.shop-mode-switch a:hover,
.shop-mode-switch a.is-active{
  border-color: var(--color-action);
  background: rgba(255,90,47,.1);
  color: var(--color-action);
}
.shop-mode-switch .icon{ width: 16px; height: 16px; }
.shop-category-directory__grid{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--color-line);
  background: var(--color-line);
}
.shop-category-directory__item{
  overflow: hidden;
  min-height: 142px;
  border: 0;
  border-radius: 0;
  background: var(--color-surface);
  transition: background .2s var(--ease), box-shadow .2s var(--ease);
}
.shop-category-directory__image{
  display: block;
  width: 100%;
  height: 86px;
  object-fit: cover;
  border-bottom: 1px solid rgba(147,171,227,.14);
}
.shop-category-directory__item summary{
  display: block;
  min-height: 70px;
  padding: .95rem .7rem 1.1rem;
  color: var(--color-heading);
  cursor: pointer;
  font-size: .88rem;
  font-weight: 600;
  list-style: none;
  text-align: center;
}
.shop-category-directory__item summary::-webkit-details-marker{ display: none; }
.shop-category-directory__item summary::after{
  display: none;
}
.shop-category-directory__item[open]{ background: #142b67; box-shadow: inset 0 0 0 1px rgba(255,90,47,.4); }
.shop-category-directory__item[open] summary{ background: rgba(255,90,47,.08); }
.shop-category-directory__item[open] summary::after{ content: '−'; }
.shop-category-directory__item ul{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem .8rem;
  margin: 0;
  padding: 0 1rem 1rem 2rem;
  color: var(--color-text-light);
  font-size: .76rem;
  line-height: 1.3;
}
.shop-category-directory__item li::marker{ color: var(--color-action); }
.shop-filter__links:has(#shopCategoryLinks){ max-height: 440px; overflow-y: auto; padding-right: .35rem; }
.shop-filter__links:has(#shopCategoryLinks) > div{ display: flex; flex-direction: column; gap: .42rem; }
@media (max-width: 700px){
  .shop-layout{ grid-template-columns: 1fr; gap: var(--spacing-xl); }
  .shop-sidebar{ position: static; }
  .shop-filter{ display: inline-block; width: 100%; }
  .shop-catalog__heading{ display: block; }
  .shop-catalog__heading > p{ margin-top: .8rem; }
  .privacy-screen-form-section{ grid-template-columns: 1fr; gap: var(--spacing-lg); }
  .privacy-screen-form__row{ grid-template-columns: 1fr; gap: 0; }
  .shop-category-directory__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px){
  .shop-category-directory__grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .shop-product-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  .shop-category-directory__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shop-product-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
  .shop-product__image svg.icon{ width: 48px; height: 48px; }
  .shop-product h3{ font-size: .85rem; }
}

/* ---------- Interior page hero (lighter than homepage hero, no radar) ---------- */
.page-hero{
  position: relative;
  background: linear-gradient(155deg, var(--color-dark-navy) 0%, #0B1B4D 60%, #03071B 100%);
  padding: var(--spacing-xl) 0 calc(var(--spacing-xl) - .5rem);
  overflow: hidden;
}
.page-hero::before{
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(70% 90% at 85% 20%, #000 30%, transparent 85%);
  -webkit-mask-image: radial-gradient(70% 90% at 85% 20%, #000 30%, transparent 85%);
  pointer-events: none;
}
.page-hero .container{ position: relative; z-index: 1; }
.page-hero h1{ margin-bottom: var(--spacing-sm); }
.page-hero p.lede{ max-width: 640px; font-size: 1.05rem; }

.contact-shell{
  background: linear-gradient(180deg, #07111f 0%, #0d172b 100%);
  padding: 3rem 0 3.5rem;
}
.contact-shell__wrap{
  max-width: 1090px;
  margin: 0 auto;
}
.breadcrumbs--light{
  color: rgba(214, 228, 255, 0.78);
  margin-bottom: 1.5rem;
}
.breadcrumbs--light a,
.breadcrumbs--light span{ color: rgba(214, 228, 255, 0.78); }
.breadcrumbs--light .is-current{ color: #ff8a5b; }
.contact-shell__title{
  margin: 0 0 2.2rem;
  font-size: clamp(3rem, 5vw, 5rem);
  line-height: 1;
  letter-spacing: -0.06em;
  color: #f4f7ff;
  text-align: center;
}
.contact-shell__info{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
  margin: 0 auto 2.2rem;
  max-width: 100%;
}
.contact-info-item{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .9rem;
  min-height: 10.5rem;
  padding: 1rem 1.25rem;
  border: 1px solid rgba(147, 171, 227, 0.18);
  border-radius: .9rem;
  background: rgba(15, 25, 43, 0.9);
  text-align: center;
}
.contact-info-item__icon{
  width: 3.2rem;
  height: 3.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 122, 82, 0.35);
  border-radius: .8rem;
  background: rgba(255, 122, 82, 0.12);
}
.contact-info-item__icon .icon{
  width: 1.55rem;
  height: 1.55rem;
  color: #ff8a5b;
}
.contact-info-item__text p{
  margin: 0;
  color: #eaf0ff;
  font-size: 1.05rem;
  line-height: 1.5;
}
.contact-shell__divider{
  height: 1px;
  background: rgba(147, 171, 227, 0.18);
  margin: 0 0 2.2rem;
}
.contact-shell__form-wrap h2{
  margin: 0 0 1.5rem;
  font-size: clamp(2rem, 3vw, 3rem);
  color: #f4f7ff;
}
.contact-form{
  display: grid;
  gap: 1.4rem;
}
.contact-form__row{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}
.field{ display: block; }
.field--full{ width: 100%; }
.field label{
  display: block;
  margin: 0 0 .42rem;
  color: #dfe9ff;
  font-size: .9rem;
  font-weight: 600;
}
.select-wrap,
.input-wrap,
.textarea-wrap{
  position: relative;
  display: block;
}
.select-wrap select,
.input-wrap input,
.textarea-wrap textarea{
  width: 100%;
  min-height: 3.1rem;
  padding: .8rem .9rem .8rem 2.8rem;
  border: 1px solid rgba(147, 171, 227, 0.22);
  border-radius: .7rem;
  background: rgba(11, 20, 36, 0.95);
  color: #f4f7ff;
  font: inherit;
  font-size: 1rem;
  line-height: 1.4;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}
.select-wrap select{
  appearance: none;
  padding-right: 2.5rem;
  background-image: linear-gradient(45deg, transparent 50%, #f4f7ff 50%), linear-gradient(135deg, #f4f7ff 50%, transparent 50%);
  background-position: calc(100% - 18px) calc(50% - 3px), calc(100% - 12px) calc(50% - 3px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}
.input-wrap .input-icon,
.textarea-wrap .input-icon{
  position: absolute;
  left: .9rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.15rem;
  height: 1.15rem;
  color: #ff8a5b;
  opacity: .75;
}
.textarea-wrap .input-icon--textarea{
  top: 1.1rem;
  transform: none;
}
.textarea-wrap textarea{
  min-height: 11rem;
  resize: vertical;
  padding-top: 1.1rem;
}
input::placeholder,
textarea::placeholder,
select option{ color: rgba(214, 228, 255, 0.7); }
.contact-submit{
  width: 100%;
  border: 0;
  border-radius: .9rem;
  background: linear-gradient(135deg, #ff7e52 0%, #ef5d32 100%);
  color: #fff;
  min-height: 3.6rem;
  font-size: 1.1rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(239, 93, 50, 0.22);
  transition: transform .2s var(--ease), opacity .2s var(--ease), box-shadow .2s var(--ease);
}
.contact-submit:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 26px rgba(239, 93, 50, 0.28);
}
.contact-submit span{ margin-left: .45rem; }

@media (max-width: 900px){
  .contact-shell__info{ grid-template-columns: 1fr; }
  .contact-form__row{ grid-template-columns: 1fr; }
}

/* ---------- Breadcrumbs ---------- */
.breadcrumbs{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
  font-family: var(--font-mono);
  font-size: .78rem;
  letter-spacing: .02em;
  color: rgba(255,255,255,.55);
  margin-bottom: var(--spacing-md);
}
.breadcrumbs a{ color: rgba(255,255,255,.75); transition: color .2s var(--ease); }
.breadcrumbs a:hover{ color: var(--color-sky-blue); }
.breadcrumbs span[aria-hidden]{ color: rgba(255,255,255,.35); }
.breadcrumbs .is-current{ color: var(--color-sky-blue); }

/* ---------- Job listing card ---------- */
.job-card{
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  padding: var(--spacing-lg);
  transition: box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.job-card:hover{ box-shadow: var(--shadow-md); border-color: rgba(255,90,47,.2); }
.job-card__header{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--spacing-md);
  border-bottom: 1px solid var(--color-line);
  padding-bottom: var(--spacing-md);
  margin-bottom: var(--spacing-md);
}
.job-card__meta{
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: .4rem;
}
.job-tag{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-family: var(--font-mono);
  font-size: .72rem;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--color-sky-blue);
  background: rgba(255,90,47,.12);
  border: 1px solid rgba(255,90,47,.3);
  padding: .3rem .65rem;
  border-radius: 999px;
}
.job-tag svg{ width: 13px; height: 13px; }
.job-card__cols{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--spacing-lg);
}
@media (max-width: 700px){
  .job-card__cols{ grid-template-columns: 1fr; }
}
.job-card h4{
  font-family: var(--font-mono);
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--color-heading);
  margin-bottom: .6rem;
}
.job-card ul{ list-style: none; display: flex; flex-direction: column; gap: .5rem; }
.job-card ul li{
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  font-size: .92rem;
  color: var(--color-text-light);
}
.job-card ul li svg{ margin-top: .2rem; color: var(--color-sky-blue); }

.apply-panel{
  background: var(--color-mist);
  border: 1px dashed rgba(255,90,47,.35);
  border-radius: var(--radius-md);
  padding: var(--spacing-md) var(--spacing-lg);
  margin-top: var(--spacing-lg);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-md);
}
.apply-panel p{ margin: 0; color: var(--color-text); font-size: .95rem; }
.apply-panel strong{ color: var(--color-heading); }

.open-roles-empty{
  text-align: center;
  padding: var(--spacing-xl) var(--spacing-lg);
  border: 1px dashed var(--color-line);
  border-radius: var(--radius-lg);
  color: var(--color-text-light);
}

/* ---------- Footer ---------- */
footer{
  background: var(--color-dark-navy);
  color: rgba(255,255,255,.7);
  padding: var(--spacing-2xl) 0 var(--spacing-lg);
}

.footer-mega{
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr 1.3fr;
  gap: var(--spacing-lg);
  padding-bottom: var(--spacing-xl);
}

.footer-brand .logo__word{ color: #fff; }
.footer-brand__tag{
  font-family: var(--font-display);
  font-weight: 700;
  font-size: .95rem;
  color: #fff;
  margin: var(--spacing-md) 0 .5rem;
}
.footer-brand__desc{
  font-size: .85rem;
  line-height: 1.6;
  color: rgba(255,255,255,.55);
  margin-bottom: var(--spacing-md);
}
.footer-social{ display: flex; gap: .6rem; }
.footer-social__btn{
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.18);
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.7);
  transition: background .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
}
.footer-social__btn svg.icon{ width: 17px; height: 17px; }
.footer-social__btn:hover{
  background: var(--color-action);
  border-color: var(--color-action);
  color: #fff;
  transform: translateY(-2px);
}
.footer-social__btn:active{ transform: scale(.92); }

.footer-col h4{
  color: #fff;
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: var(--spacing-sm);
  padding-bottom: .5rem;
  font-family: var(--font-mono);
  font-weight: 700;
  border-bottom: 2px solid var(--color-action);
  display: inline-block;
}
.footer-col ul{ list-style: none; display: flex; flex-direction: column; gap: .55rem; margin-top: .75rem; }
.footer-col ul li a{
  color: rgba(255,255,255,.65);
  font-size: .88rem;
  transition: color .2s var(--ease), padding-left .2s var(--ease);
}
.footer-col ul li a:hover{ color: var(--color-sky-blue); padding-left: 4px; }

.footer-advisor{
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-md);
  padding: var(--spacing-md);
}
.footer-advisor h4{
  color: #fff;
  font-family: var(--font-display);
  font-size: 1rem;
  margin-bottom: .4rem;
}
.footer-advisor > p{
  font-size: .8rem;
  color: rgba(255,255,255,.55);
  line-height: 1.5;
  margin-bottom: var(--spacing-sm);
}
.footer-advisor__input{
  width: 100%;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: var(--radius-sm);
  padding: .65rem .8rem;
  color: #fff;
  font-family: var(--font-body);
  font-size: .85rem;
  margin-bottom: .6rem;
  transition: border-color .2s var(--ease), background .2s var(--ease);
}
.footer-advisor__input::placeholder{ color: rgba(255,255,255,.4); }
.footer-advisor__input:focus{
  outline: none;
  border-color: var(--color-action);
  background: rgba(255,255,255,.09);
}
select.footer-advisor__input{
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff99' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 16px;
  padding-right: 2.2rem;
}
select.footer-advisor__input option{ background: var(--color-dark-navy); color: #fff; }
.footer-advisor__btn{
  width: 100%;
  margin-top: .2rem;
  margin-bottom: .75rem;
}
.footer-advisor__note{
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .75rem;
  color: rgba(255,255,255,.45);
  margin: 0;
}
.footer-advisor__note svg.icon{ width: 13px; height: 13px; color: var(--color-sky-blue); }

.footer-divider{
  height: 1px;
  background: rgba(255,255,255,.1);
  margin: var(--spacing-md) 0;
}

.footer-contact-row{
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-lg);
  padding: var(--spacing-sm) 0;
}
.footer-contact-row a,
.footer-contact-row span{
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .85rem;
  color: rgba(255,255,255,.65);
}
.footer-contact-row a:hover{ color: var(--color-sky-blue); }
.footer-contact-row svg.icon{ width: 15px; height: 15px; color: var(--color-action); }

.footer-credentials{
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  padding: var(--spacing-sm) 0;
}
.cred-badge{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-family: var(--font-mono);
  font-size: .72rem;
  letter-spacing: .02em;
  color: rgba(255,255,255,.6);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  padding: .35rem .8rem;
}
.cred-badge svg.icon{ width: 13px; height: 13px; color: var(--color-sky-blue); }

.footer-bottom{
  padding-top: var(--spacing-lg);
  text-align: center;
  font-size: .85rem;
  color: rgba(255,255,255,.45);
}
.footer-bottom--split{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--spacing-sm);
  text-align: left;
}
.footer-bottom__links{ display: flex; gap: 1.25rem; flex-wrap: wrap; }
.footer-bottom__links a{
  font-size: .8rem;
  color: rgba(255,255,255,.55);
  transition: color .2s var(--ease);
}
.footer-bottom__links a:hover{ color: var(--color-sky-blue); }

@media (max-width: 1150px){
  .footer-mega{ grid-template-columns: 1fr 1fr 1fr; }
  .footer-brand{ grid-column: 1 / -1; }
  .footer-advisor{ grid-column: 1 / -1; max-width: 420px; }
}
@media (max-width: 700px){
  .footer-mega{ grid-template-columns: 1fr 1fr; }
  .footer-advisor{ max-width: none; }
}
@media (max-width: 480px){
  .footer-mega{ grid-template-columns: 1fr; }
}

/* ---------- Scroll-to-top ---------- */
#scrollToTop{
  transition: transform .25s var(--ease), opacity .25s var(--ease), background-color .2s var(--ease);
}
#scrollToTop:hover{ transform: translateY(-4px); background-color: var(--color-action-hover) !important; }
#scrollToTop.is-visible{ display: flex !important; }

/* ---------- Scroll reveal ---------- */
.fade-in, .slide-in-right{
  opacity: 0;
  transition: opacity .7s var(--ease), transform .7s var(--ease);
  will-change: opacity, transform;
}
.fade-in{ transform: translateY(24px); }
.slide-in-right{ transform: translateX(36px); }
.fade-in.is-visible, .slide-in-right.is-visible{
  opacity: 1;
  transform: none;
}
.is-typing::after{
  content: '';
  display: inline-block;
  width: .08em;
  height: .9em;
  margin-left: .12em;
  vertical-align: -.08em;
  background: var(--color-action);
  animation: typing-caret .75s steps(1, end) infinite;
}
.type-pending{ visibility: hidden; }
.typing-word{ display: inline-block; white-space: nowrap; }
.typing-char{
  display: inline-block;
  opacity: 0;
  transform: translateY(.18em) scale(.92);
  transition: opacity .22s var(--ease), transform .22s var(--ease);
}
.typing-char.is-visible{
  opacity: 1;
  transform: none;
}
.is-typed::after{ display: none; }
@keyframes typing-caret{
  0%, 45%{ opacity: 1; }
  46%, 100%{ opacity: 0; }
}
/* Staggered reveal for grid children */
.grid .fade-in:nth-child(2){ transition-delay: .08s; }
.grid .fade-in:nth-child(3){ transition-delay: .16s; }
.grid .fade-in:nth-child(4){ transition-delay: .24s; }
.grid .fade-in:nth-child(5){ transition-delay: .32s; }
.grid .fade-in:nth-child(6){ transition-delay: .4s; }

@media (prefers-reduced-motion: reduce){
  .fade-in, .slide-in-right{ opacity: 1; transform: none; transition: none; }
}

/* ---------- Icon defaults ---------- */
svg.icon{
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  display: inline-block;
  flex-shrink: 0;
}

/* ---------- Floating social connect widget ---------- */
:root{
  --sw-green:#25D366;
  --sw-messenger-1:#00B2FF;
  --sw-messenger-2:#006AFF;
  --sw-ig-1:#F58529;
  --sw-ig-2:#DD2A7B;
  --sw-ig-3:#8134AF;
  --sw-linkedin:#0A66C2;
}
.social-widget{
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  z-index: 150;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: .75rem;
}
.social-widget__item{
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  box-shadow: 0 6px 16px rgba(8,10,18,.25);
  opacity: 0;
  transform: translateY(12px) scale(.8);
  pointer-events: none;
  transition: opacity .22s var(--ease), transform .22s var(--ease), filter .2s var(--ease);
}
.social-widget__item svg{ width: 26px; height: 26px; }
.social-widget.is-open .social-widget__item{
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.social-widget__item:nth-child(2){ transition-delay: .03s; }
.social-widget__item:nth-child(3){ transition-delay: .06s; }
.social-widget__item:nth-child(4){ transition-delay: .09s; }
.social-widget__item--whatsapp{ background: var(--sw-green); }
.social-widget__item--messenger{ background: linear-gradient(135deg, var(--sw-messenger-1), var(--sw-messenger-2)); }
.social-widget__item--instagram{ background: linear-gradient(135deg, var(--sw-ig-1), var(--sw-ig-2) 55%, var(--sw-ig-3)); }
.social-widget__item--linkedin{ background: var(--sw-linkedin); }
.social-widget__item:hover{ filter: brightness(1.08); }

.social-widget__toggle{
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  background: var(--color-action);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 20px rgba(8,10,18,.3);
  transition: transform .25s var(--ease), background .25s var(--ease);
}
.social-widget__toggle svg{ width: 26px; height: 26px; transition: transform .25s var(--ease); }
.social-widget__toggle:active{ transform: scale(.92); }
.social-widget.is-open .social-widget__toggle{ background: var(--color-dark-navy); }

/* ---------- About page: editorial story layout ---------- */
.about-page{
  --about-ink: #f4f7ff;
  --about-muted: #c1cce2;
  --about-paper: #03071b;
  --about-line: rgba(147,171,227,.2);
  background: var(--about-paper);
  color: var(--about-ink);
}
.about-frame{
  width: min(100% - 3rem, 1120px);
  margin: 0 auto;
}
.about-intro{
  position: relative;
  min-height: 650px;
  padding: 2.25rem 0 5rem;
  overflow: hidden;
  background:
    linear-gradient(130deg, transparent 0 66%, rgba(147,171,227,.08) 66% 66.2%, transparent 66.2%),
    linear-gradient(45deg, transparent 0 78%, rgba(147,171,227,.1) 78% 78.15%, transparent 78.15%),
    var(--about-paper);
}
.about-intro::after{
  content: '';
  position: absolute;
  right: 4%;
  top: 8rem;
  width: 220px;
  height: 220px;
  border: 1px solid rgba(147,171,227,.14);
  transform: rotate(45deg);
  pointer-events: none;
}
.about-breadcrumbs{
  position: relative;
  z-index: 1;
  color: rgba(214,228,255,.62);
}
.about-breadcrumbs a,
.about-breadcrumbs .is-current{ color: rgba(214,228,255,.78); }
.about-breadcrumbs span[aria-hidden]{ color: rgba(214,228,255,.32); }
.about-intro .about-frame{ position: relative; z-index: 1; }
.about-kicker{
  margin: 0 0 1.1rem;
  color: #e35c32;
  font-family: var(--font-mono);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  line-height: 1.2;
}
.about-intro h1{
  max-width: 780px;
  margin: 5rem 0 1.5rem;
  color: var(--about-ink);
  font-size: clamp(4rem, 10vw, 8.8rem);
  line-height: .84;
  letter-spacing: -.075em;
}
.about-texture{
  color: transparent;
  background:
    linear-gradient(135deg, rgba(255,90,47,.36), transparent 48%),
    repeating-linear-gradient(115deg, #f4f7ff 0 2px, #6f83b4 2px 3px, #172754 3px 7px);
  -webkit-background-clip: text;
  background-clip: text;
}
.about-intro__copy{
  max-width: 450px;
  margin-left: 6px;
  color: var(--about-muted);
  font-size: 1.08rem;
  line-height: 1.45;
}
.about-scroll{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  margin-top: 3.5rem;
  border-radius: 50%;
  background: var(--about-ink);
  color: #fff;
  font-size: 1.4rem;
  line-height: 1;
  transition: transform .2s var(--ease), background .2s var(--ease);
}
.about-scroll:hover{ transform: translateY(3px); background: #e35c32; }
.about-principles{
  position: relative;
  padding: 7rem 0 4rem;
  overflow: hidden;
  background: #07143d;
}
.about-principles::before{
  content: '';
  position: absolute;
  left: -7rem;
  top: 8rem;
  width: 18rem;
  height: 18rem;
  border: 5rem solid rgba(255,90,47,.08);
  border-radius: 50%;
  pointer-events: none;
}
.about-principle{
  position: relative;
  display: grid;
  grid-template-columns: minmax(360px, 44%) minmax(0, 570px);
  gap: 2rem;
  justify-content: center;
  padding: 4rem 0;
  border-top: 1px solid var(--about-line);
}
.about-principle:last-child{ border-bottom: 1px solid var(--about-line); }
.about-principle__number{
  color: rgba(255,90,47,.2);
  font-family: var(--font-display);
  font-size: clamp(14rem, 25vw, 24rem);
  font-weight: 700;
  line-height: .55;
  letter-spacing: -.08em;
  overflow: hidden;
}
.about-principle h2,
.about-next h2{
  max-width: 600px;
  margin: 0 0 1rem;
  color: var(--about-ink);
  font-size: clamp(2.25rem, 5vw, 4.2rem);
  line-height: .94;
  letter-spacing: -.065em;
}
.about-principle p:not(.about-kicker){
  max-width: 500px;
  color: var(--about-muted);
  font-size: 1.03rem;
  line-height: 1.5;
}
.about-next{
  padding: 7rem 0 8rem;
  background: #050b2a;
}
.about-next__inner{ max-width: 900px; }
.about-next h2{ max-width: 720px; margin-bottom: 2.5rem; }
.about-links{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--about-line);
}
.about-links a{
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.2rem 1rem 1.2rem 0;
  border-bottom: 1px solid var(--about-line);
  color: var(--about-ink);
  font-weight: 700;
}
.about-links a + a{ padding-left: 1rem; border-left: 1px solid var(--about-line); }
.about-links a:hover{ color: #e35c32; }

@media (max-width: 700px){
  .about-frame{ width: min(100% - 2rem, 1120px); }
  .about-intro{ min-height: 600px; padding-top: 1.5rem; }
  .about-intro h1{ margin-top: 4rem; font-size: clamp(3.8rem, 18vw, 6.2rem); }
  .about-intro::after{ right: -5rem; top: 15rem; width: 170px; height: 170px; }
  .about-principles{ padding: 4rem 0 2rem; }
  .about-principle{ grid-template-columns: 1fr; gap: 1.2rem; padding: 3rem 0; }
  .about-principle__number{ font-size: clamp(12rem, 48vw, 18rem); }
  .about-links{ grid-template-columns: 1fr; }
  .about-links a + a{ padding-left: 0; border-left: 0; }
}
.social-widget.is-open .social-widget__toggle svg{ transform: rotate(135deg); }

@media (max-width: 640px){
  .social-widget{ right: 1rem; bottom: 1rem; }
  .social-widget__item{ width: 46px; height: 46px; }
  .social-widget__toggle{ width: 54px; height: 54px; }
}



