/* =========================================================
   SWIFT ACT v4 - Module & Component Styles
   Organized by section. Every value below MUST trace back to
   a var(--sa-*) token defined in style.css - never a raw hex/px.
   ========================================================= */

/* ---------- Shared section/typography helpers ---------- */
.sa-eyebrow-badge {
  display: inline-block;
  background: var(--sa-accent);
  color: var(--sa-accent-fg);
  font-size: var(--sa-text-xs);
  font-weight: var(--sa-fw-semibold);
  letter-spacing: var(--sa-tracking-wider);
  text-transform: uppercase;
  padding: var(--sa-space-2) var(--sa-space-4);
  border-radius: var(--sa-radius-full);
  margin-bottom: var(--sa-space-4);
}
.sa-eyebrow {
  display: block;
  color: var(--sa-accent);
  font-weight: var(--sa-fw-bold);
  text-transform: uppercase;
  letter-spacing: var(--sa-tracking-wide);
  font-size: var(--sa-text-sm);
  margin-bottom: var(--sa-space-2);
}
.sa-section__intro { max-width: 60rem; margin-bottom: var(--sa-space-10); }
.sa-section__description { color: var(--sa-gray-text); font-size: var(--sa-text-lg); margin-top: var(--sa-space-4); }
.sa-section__intro--center { margin-inline: auto; text-align: center; }
.sa-section__heading {
  font-size: var(--sa-text-4xl);
  font-weight: var(--sa-fw-semibold);
  text-transform: uppercase;
  letter-spacing: 0.1em; /* 3.6px at the correct 36px size, confirmed via Figma export */
  line-height: 1.111; /* 40px at 36px */
  color: var(--sa-blue); /* default on white/muted backgrounds; overridden per section background below */
  margin-bottom: var(--sa-space-5);
}
.sa-section__heading--center { text-align: center; }
.sa-section__subheading { color: var(--sa-gray-text); font-size: var(--sa-text-xl); font-weight: var(--sa-fw-normal); }
.sa-section--bg-navy .sa-section__heading,
.sa-section--bg-gradient-blue .sa-section__heading { color: var(--sa-white); }
.sa-section--bg-navy .sa-section__subheading,
.sa-section--bg-gradient-blue .sa-section__subheading { color: rgba(255,255,255,0.9); }
.sa-link-arrow { display: inline-flex; align-items: center; gap: var(--sa-space-2); color: var(--sa-accent); font-weight: var(--sa-fw-semibold); font-size: var(--sa-text-base); }
.sa-tag { display: inline-block; background: var(--sa-muted); color: var(--sa-foreground); font-size: var(--sa-text-xs); padding: var(--sa-space-1) var(--sa-space-3); border-radius: var(--sa-radius-full); margin-right: var(--sa-space-2); margin-bottom: var(--sa-space-2); }
.sa-tag--accent { background: var(--sa-accent); color: var(--sa-accent-fg); }
.sa-empty-state { padding: var(--sa-space-8); text-align: center; color: var(--sa-blue); background: var(--sa-muted); border-radius: var(--sa-radius); }
.sa-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: var(--sa-space-2); list-style: none; padding-block: var(--sa-space-4); font-size: var(--sa-text-sm); color: var(--sa-blue); }
.sa-breadcrumbs li:not(:last-child)::after { content: '/'; margin-left: var(--sa-space-2); color: var(--sa-border); }

/* ---------- HEADER / NAV ---------- */
.sa-header { position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 100; background: var(--sa-navy); transition: background-color var(--sa-duration-slow) var(--sa-ease), box-shadow var(--sa-duration-slow) var(--sa-ease); }
/* WP admin bar is also fixed at top:0 with higher stacking, so logged-in users
   need the header pushed down by its height - otherwise it hides underneath
   and the true content gets an unwanted gap equal to the admin bar's height.
   This never affects actual site visitors (no admin bar = no .admin-bar class). */
body.admin-bar .sa-header { top: 32px; }
@media screen and (max-width: 782px) {
  body.admin-bar .sa-header { top: 46px; } /* WP shrinks the admin bar on smaller screens */
}
.sa-header.is-scrolled { background: var(--sa-white); box-shadow: var(--sa-shadow-md); }
.sa-main { padding-top: 80px; } /* header is position:fixed (out of normal flow) - this prevents content starting underneath it */
.sa-header.is-scrolled .sa-nav__menu > li > a { color: var(--sa-navy); }
.sa-header.is-scrolled .sa-nav__menu > li.current-menu-item > a,
.sa-header.is-scrolled .sa-nav__menu > li.current-menu-ancestor > a { color: var(--sa-blue); }
.sa-header.is-scrolled .sa-nav__menu > li:last-child > a { color: var(--sa-accent); }
.sa-header.is-scrolled .sa-header__toggle-bar { background: var(--sa-navy); }
.sa-header.is-scrolled .sa-logo { color: var(--sa-blue); }
img.sa-logo__img--dark { display: none; }
.sa-header.is-scrolled img.sa-logo__img--dark { display: block; }
.sa-header.is-scrolled .sa-logo:has(.sa-logo__img--dark) img.sa-logo__img--light { display: none; }
.sa-header__inner { display: flex; align-items: center; justify-content: space-between; height: 80px; padding: 16px 48px; }
.sa-logo { display: inline-flex; align-items: center; gap: var(--sa-space-3); color: var(--sa-white); }
.sa-logo__mark { width: 2rem; height: 2rem; flex-shrink: 0; }
.sa-logo__img { max-height: 3rem; width: auto; display: block; }
.sa-logo__text { font-size: var(--sa-text-xl); font-weight: var(--sa-fw-medium); color: inherit; }
.sa-logo__text strong { font-weight: var(--sa-fw-bold); }

.sa-header__toggle { display: none; flex-direction: column; gap: 4px; background: none; border: none; cursor: pointer; padding: var(--sa-space-2); }
.sa-header__toggle-bar { width: 22px; height: 2px; background: var(--sa-white); }

.sa-nav__menu { display: flex; align-items: center; gap: var(--sa-space-8); list-style: none; }
.sa-nav__menu > li { position: relative; }
.sa-nav__menu > li > a {
  color: var(--sa-white);
  font-family: var(--sa-font-family);
  font-size: 1rem; /* 16px, confirmed via Figma dev-mode */
  font-weight: var(--sa-fw-normal); /* client review: remove bold from menu items */
  line-height: 1.5rem; /* 24px = 150%, confirmed via Figma dev-mode */
  padding-block: var(--sa-space-2);
  display: inline-flex;
  align-items: center;
  gap: var(--sa-space-1);
  transition: color var(--sa-duration-slow) var(--sa-ease);
}
.sa-nav__menu > li.current-menu-item > a,
.sa-nav__menu > li.current-menu-ancestor > a { color: var(--sa-blue); } /* client review: active page highlighted in blue instead of bold */
.sa-nav__menu > li:last-child > a { color: var(--sa-accent); } /* Talents styled orange per Figma */
.sa-nav__menu li.menu-item-has-children > a::after {
  content: '';
  width: 8px; height: 8px;
  margin-left: var(--sa-space-1);
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  display: inline-block;
  opacity: 0.8;
}
.sa-nav__menu .sub-menu li.menu-item-has-children > a::after { transform: rotate(-45deg) translateY(2px); } /* nested flyout points right */

/* Level 1 flyout (Services / Industries / Newsroom) */
.sa-nav__menu .sub-menu {
  display: none;
  position: absolute; top: 100%; left: 0;
  background: var(--sa-white);
  border-radius: var(--sa-radius);
  box-shadow: var(--sa-shadow-lg);
  min-width: 16rem;
  padding: var(--sa-space-2);
  list-style: none;
  z-index: 10;
}
.sa-nav__menu > li:hover > .sub-menu,
.sa-nav__menu > li:focus-within > .sub-menu { display: block; }
.sa-nav__menu .sub-menu li:hover > .sub-menu,
.sa-nav__menu .sub-menu li:focus-within > .sub-menu { display: block; }
.sa-nav__menu .sub-menu li { position: relative; }
.sa-nav__menu .sub-menu a {
  display: block;
  color: var(--sa-foreground);
  font-size: var(--sa-text-sm);
  padding: var(--sa-space-3) var(--sa-space-4);
  border-radius: var(--sa-radius-xs);
}
.sa-nav__menu .sub-menu li:hover > a { background: var(--sa-muted); color: var(--sa-blue); }

/* Level 2 nested flyout (Cybersecurity -> CRA / Penetration Testing) - opens to the right.
   margin-left is intentionally 0: any real gap here is dead space the mouse
   has to cross, which loses :hover and closes the menu before reaching the
   child items. Keeping the boxes edge-to-edge fixes that at the root instead
   of papering over it with a JS hover-delay timer. */
.sa-nav__menu .sub-menu .sub-menu {
  top: 0;
  left: 100%;
  margin-left: 0;
}

@media (max-width: 1200px) {
  .sa-header__toggle { display: flex; }
  .sa-nav { position: fixed; inset: 0 0 0 auto; width: 85%; max-width: 22rem; background: var(--sa-navy); transform: translateX(100%); transition: transform var(--sa-duration-fast) var(--sa-ease); overflow-y: auto; padding: var(--sa-space-20) var(--sa-space-6) var(--sa-space-6); }
  .sa-nav.is-open { transform: translateX(0); }
  .sa-nav__menu { flex-direction: column; align-items: flex-start; gap: var(--sa-space-2); width: 100%; }
  .sa-nav__menu .sub-menu { position: static; box-shadow: none; background: transparent; width: 100%; margin-left: var(--sa-space-4); }
  .sa-nav__menu .sub-menu .sub-menu { margin-left: var(--sa-space-8); }
  .sa-nav__menu .sub-menu a { color: var(--sa-white); }
  .sa-nav__menu > li:hover > .sub-menu { display: none; } /* mobile uses tap-toggle via JS instead of hover */
  .sa-nav__menu > li.is-open > .sub-menu { display: block; }
}

/* ---------- HERO ---------- */
.sa-hero--gradient_simple { background: linear-gradient(120deg, var(--sa-navy) 0%, var(--sa-blue) 100%); color: var(--sa-white); padding-block: var(--sa-space-16); }
/* ---------- HERO: universal full-viewport sizing (applies to every variant/page) ----------
   Client requirement: every hero fills the full screen on load, at any viewport
   size, consistently. Replaces the per-page min-heights previously tuned from
   Figma component exports - those were correct for a static mockup capture but
   not for "always exactly fills the screen" behavior across arbitrary real
   viewport sizes. 80px = the fixed header's own height (see .sa-header__inner). */
.sa-hero { min-height: calc(100vh - 80px); display: flex; align-items: center; }

.sa-hero--full_navy {
  color: var(--sa-white);
  padding-block: var(--sa-space-16);
  position: relative;
  overflow: hidden;
  /* Exact gradient confirmed via Figma code export - not an approximation */
  background: var(--sa-gradient-diagonal);
}
.sa-hero--full_navy::before,
.sa-hero--full_navy::after {
  content: ''; position: absolute; width: 24rem; height: 24rem; border-radius: 50%;
  background: var(--sa-accent); opacity: 0.1; filter: blur(64px); pointer-events: none;
}
.sa-hero--full_navy::before { top: 0; right: 15%; }
.sa-hero--full_navy::after { top: 30%; left: 0; background: var(--sa-blue); }
.sa-hero--full_navy .sa-hero__inner { position: relative; z-index: 1; width: 100%; }
.sa-hero--gradient_simple .sa-hero__inner { width: 100%; } /* matches the full_navy treatment above - this was the actual missing piece causing the different computed margin between Homepage and Newsroom */
.sa-hero__inner { display: grid; grid-template-columns: 1fr; gap: var(--sa-space-10); align-items: center; }
.sa-hero--full_navy .sa-hero__inner { grid-template-columns: 1.1fr 1fr; align-items: stretch; }
.sa-hero--no-media .sa-hero__inner { grid-template-columns: 1fr; justify-items: start; }
.sa-hero--gradient_simple .sa-hero__inner { justify-items: start; } /* gradient_simple (Blogs/Contact/Newsroom) never gets the no-media class above since that's gated to full_navy only - this is the actual fix for these pages' left-alignment */
.sa-hero__content { text-align: left; }
.sa-hero--no-media .sa-hero__content { max-width: 56rem; margin-inline: 0 auto; }
.sa-hero--gradient_simple .sa-hero__content { width: fit-content; max-width: 100%; margin-inline: 0; margin-left: 0 !important; } /* forces left position unambiguously - justify-items alone left room for grid-stretch edge cases */
.sa-hero__heading { font-size: var(--sa-text-5xl); line-height: var(--sa-leading-tight); margin-bottom: var(--sa-space-5); }
.sa-hero--gradient_simple .sa-hero__heading { font-size: var(--sa-text-4xl); }
.sa-hero--gradient_simple .sa-hero__heading--default { font-size: var(--sa-text-6xl); line-height: var(--sa-leading-tight); font-weight: var(--sa-fw-medium); }
.sa-hero--gradient_simple .sa-hero__heading--uppercase { font-size: var(--sa-text-5xl); line-height: 1; }
.sa-hero__kicker { font-size: var(--sa-text-4xl); font-weight: var(--sa-fw-medium); color: var(--sa-white); line-height: 1.25; margin-bottom: var(--sa-space-3); }
.sa-hero__subtext { font-size: var(--sa-text-xl); opacity: 0.9; max-width: 40rem; margin-bottom: var(--sa-space-8); line-height: var(--sa-leading-relaxed); }
.sa-hero__subtext p { margin-bottom: var(--sa-space-4); }
.sa-hero__subtext p:last-child { margin-bottom: 0; }
.sa-hero--headingstyle-uppercase .sa-hero__subtext { font-size: var(--sa-text-base); line-height: 1.625; }
.sa-hero__subtext--compact { font-size: var(--sa-text-lg); line-height: 1.625; }
.sa-hero__stats { display: flex; gap: var(--sa-space-8); margin-bottom: var(--sa-space-8); }
.sa-hero__stat { display: flex; flex-direction: column; }
.sa-hero__stat-value { font-size: var(--sa-text-3xl); font-weight: var(--sa-fw-normal); line-height: var(--sa-leading-tight); color: var(--sa-accent); }
.sa-hero__stat-label { font-size: var(--sa-text-sm); line-height: var(--sa-leading-base); color: var(--sa-hero-stat-label); }
.sa-hero--full_navy .sa-hero__heading--default { font-weight: var(--sa-fw-medium); }
.sa-hero--full_navy.sa-hero--headingstyle-default .sa-btn { font-size: var(--sa-text-base); font-weight: var(--sa-fw-normal); padding-inline: var(--sa-space-8); padding-block: var(--sa-space-4); }
.sa-hero__media { height: 100%; min-width: 0; }
body.page-slug-medical-2 .sa-hero__media,
body.page-slug-medical .sa-hero__media { min-height: 31.25rem; } /* 500px, per client spec (504x500) */
.sa-hero__media img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--sa-radius-xl); box-shadow: var(--sa-shadow-2xl); }

/* Heading style variants - see hero.php notes */
.sa-hero__heading--accent { color: var(--sa-accent); }
.sa-hero__heading--uppercase { font-size: var(--sa-text-5xl); font-weight: var(--sa-fw-bold); line-height: 1; text-transform: uppercase; letter-spacing: var(--sa-tracking-wide); }

/* Background style variants */
.sa-hero--bg-horizontal {
  background: linear-gradient(90deg, #071A39 0%, #1774B9 100%); /* fallback for browsers without OKLab interpolation support */
  background: var(--sa-gradient-horizontal);
  padding-block: var(--sa-space-10);
}
.sa-hero--bg-horizontal::before, .sa-hero--bg-horizontal::after { display: none; }
.sa-hero--gradient_simple.sa-hero--bg-horizontal { padding-block: var(--sa-space-24); }
.sa-hero--gradient_simple.sa-hero--bg-horizontal.sa-hero--headingstyle-uppercase { padding-block: var(--sa-space-20); }

/* Framed media (CRA SECURE-A graphic) */
.sa-hero__media--framed {
  display: flex; align-items: center; justify-content: center;
  padding: var(--sa-space-12);
  background: rgba(255,255,255,0.10);
  backdrop-filter: blur(8px);
  border: 2px solid rgba(255,255,255,0.20);
  border-radius: var(--sa-radius-2xl);
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
  height: auto; /* overrides .sa-hero__media's height:100% - this box should hug its logo's own size, not stretch to match the text column */
  width: fit-content; /* grid items default to stretching to fill their column's full width - this was the remaining source of "too much padding" around the logo */
  max-width: 100%;
  align-self: center;
  justify-self: center;
  overflow: hidden; /* safety net so an oversized logo file crops cleanly to the box's rounded corners instead of spilling out messily */
}
.sa-hero__media--framed img {
  width: 1000px; /* explicit base width matching Figma's w-[1000px] - keeps scaling consistent regardless of the uploaded file's native resolution; the global "img { max-width:100% }" reset (style.css) always caps this down responsively */
  height: auto;
  max-width: 100%;
  min-width: 0;
  object-fit: contain;
  border-radius: 0;
  box-shadow: none;
}

/* ---------- ICON CARD GRID ---------- */
.sa-icon-card-grid__grid { display: grid; gap: var(--sa-space-6); grid-template-columns: repeat(3, 1fr); }
.sa-icon-card-grid__grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.sa-icon-card-grid__grid--cols-4 { grid-template-columns: repeat(4, 1fr); }
.sa-icon-card-grid__grid--cols-5 { grid-template-columns: repeat(5, 1fr); }
.sa-icon-card-grid__grid--cols-5 .sa-icon-card { padding: var(--sa-space-6); text-align: center; }
.sa-icon-card-grid__grid--cols-5 .sa-icon-card:hover { transform: scale(1.05); box-shadow: var(--sa-shadow-lg); }
.sa-icon-card-grid__grid--cols-5 .sa-icon-card__icon { margin-inline: auto; }
.sa-icon-card-grid__grid--cols-5 .sa-icon-card__title { font-size: var(--sa-text-xl); font-weight: var(--sa-fw-semibold); line-height: var(--sa-leading-snug); }
.sa-icon-card-grid__grid--icon_badge { gap: var(--sa-space-8); } /* 32px - confirmed via Figma export, wider than the default 24px */
.sa-icon-card-grid__grid--cols-6 { grid-template-columns: repeat(6, 1fr); }
.sa-icon-card-grid__grid--icon_inline { gap: var(--sa-space-8); } /* 32px - confirmed via Figma export */
.sa-icon-card { display: block; background: var(--sa-white); border: 1px solid var(--sa-border); border-radius: var(--sa-radius-2xl); padding: var(--sa-space-8); transition: all var(--sa-duration-fast) var(--sa-ease); }
.sa-icon-card--linked:hover { box-shadow: var(--sa-shadow-lg); transform: translateY(-2px); }
.sa-icon-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 4rem; height: 4rem; background: var(--sa-blue); border-radius: var(--sa-radius-full); margin-bottom: var(--sa-space-4); box-shadow: var(--sa-shadow-md); }
.sa-icon-card__icon img { filter: brightness(0) invert(1); width: 1.75rem; height: 1.75rem; }

/* ---------- ICON CARD GRID: icon_inline style (Why Swift Act) ---------- */
.sa-icon-card-inline {
  display: flex; align-items: flex-start; gap: var(--sa-space-4);
  background: var(--sa-white);
  border-radius: 0.875rem; /* 14px */
  padding: var(--sa-space-8);
  box-shadow: 0 4px 6px -4px rgba(0,0,0,0.1), 0 10px 15px -3px rgba(0,0,0,0.1);
  transition: all var(--sa-duration-fast) var(--sa-ease);
}
.sa-icon-card-inline:hover { box-shadow: var(--sa-shadow-lg); transform: translateY(-2px); }
.sa-icon-card-inline__icon { flex-shrink: 0; width: 2rem; height: 2rem; margin-top: 0.25rem; }
.sa-icon-card-inline__icon img { width: 100%; height: 100%; object-fit: contain; }
.sa-icon-card-inline__title { font-size: var(--sa-text-xl); font-weight: var(--sa-fw-bold); color: var(--sa-navy); line-height: var(--sa-leading-relaxed); transition: color var(--sa-duration-fast) var(--sa-ease); }
.sa-icon-card-inline__text { font-size: var(--sa-text-sm); color: var(--sa-gray-text); margin-top: var(--sa-space-2); }

/* icon_inline modifiers: orange circular icon + gray card background (FS/QE services) */
.sa-icon-card-grid__grid--cardbg-muted .sa-icon-card-inline { background: var(--sa-muted); }
.sa-icon-card-grid__grid--iconbg-orange .sa-icon-card-inline__icon {
  width: 4rem; height: 4rem; margin-top: 0;
  background: var(--sa-accent); border-radius: var(--sa-radius-full);
  display: flex; align-items: center; justify-content: center;
  transition: background var(--sa-duration-fast) var(--sa-ease);
}
.sa-icon-card-grid__grid--iconbg-orange .sa-icon-card-inline__icon img { filter: brightness(0) invert(1); width: 2rem; height: 2rem; transition: filter var(--sa-duration-fast) var(--sa-ease); }
.sa-icon-card-grid__grid--iconbg-orange .sa-icon-card-inline { align-items: center; cursor: pointer; }
.sa-icon-card-grid__grid--iconbg-orange .sa-icon-card-inline__title { font-size: var(--sa-text-lg); }

/* compact size: Manufacturing sub-process cards - smaller icon, tighter padding, single-line feel */
.sa-icon-card-grid__grid--size-compact { grid-template-columns: repeat(2, 1fr); max-width: 42rem; margin-inline: auto; }
.sa-icon-card-grid__grid--size-compact .sa-icon-card-inline { padding: var(--sa-space-4) var(--sa-space-5); }
.sa-icon-card-grid__grid--size-compact .sa-icon-card-inline__icon { width: 2.5rem; height: 2.5rem; }
.sa-icon-card-grid__grid--size-compact .sa-icon-card-inline__icon img { width: 1.25rem; height: 1.25rem; }
.sa-icon-card-grid__grid--size-compact .sa-icon-card-inline__title { font-size: var(--sa-text-base); font-weight: var(--sa-fw-semibold); }
/* Zoom + blue highlight, per confirmed design: card turns blue, icon circle
   turns white with the icon re-colored orange (an approximate CSS filter
   recolor - exact hex match isn't guaranteed this way, but it's very close;
   flag it if it looks off and we can revisit with an SVG-based approach) */
.sa-icon-card-grid__grid--iconbg-orange .sa-icon-card-inline:hover {
  background: var(--sa-blue);
  transform: scale(1.04);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.2), 0 8px 10px -6px rgba(0,0,0,0.15);
}
.sa-icon-card-grid__grid--iconbg-orange .sa-icon-card-inline:hover .sa-icon-card-inline__icon { background: var(--sa-white); }
.sa-icon-card-grid__grid--iconbg-orange .sa-icon-card-inline:hover .sa-icon-card-inline__icon img {
  filter: brightness(0) saturate(100%) invert(48%) sepia(96%) saturate(1946%) hue-rotate(346deg) brightness(101%) contrast(101%);
}
.sa-icon-card-grid__grid--iconbg-orange .sa-icon-card-inline:hover .sa-icon-card-inline__title { color: var(--sa-white); }

/* ---------- ICON CARD GRID: standard_badge style (Industries & Standards) ---------- */
.sa-icon-card-grid__grid--standard_badge { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sa-space-6); }
.sa-standard-badge {
  transition: all var(--sa-duration-fast) var(--sa-ease);
  width: 14.75rem; min-height: 180px; padding: var(--sa-space-6);
  background: var(--sa-muted);
  box-shadow: 0 2px 4px -2px rgba(0,0,0,0.1), 0 4px 6px -1px rgba(0,0,0,0.1);
  border-radius: var(--sa-radius-2xl);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--sa-space-4);
}
.sa-standard-badge__icon { width: 3rem; height: 3rem; background: var(--sa-accent); border-radius: 0.875rem; display: flex; align-items: center; justify-content: center; }
.sa-standard-badge__icon img { filter: brightness(0) invert(1); width: 24px; height: 24px; }
.sa-standard-badge__label { text-align: center; color: #6A7282; font-size: 0.75rem; font-weight: var(--sa-fw-bold); text-transform: uppercase; letter-spacing: 0.6px; }
.sa-standard-badge__pill { background: var(--sa-gradient-diagonal); border-radius: 0.875rem; padding: var(--sa-space-2) var(--sa-space-3); display: flex; align-items: center; justify-content: center; gap: var(--sa-space-2); max-width: 100%; box-sizing: border-box; flex-wrap: wrap; }
.sa-standard-badge__prefix { color: var(--sa-accent); font-size: 0.6875rem; font-weight: var(--sa-fw-bold); text-transform: uppercase; letter-spacing: 1.1px; }
.sa-standard-badge__number { color: var(--sa-white); font-size: 1.125rem; font-weight: var(--sa-fw-black); letter-spacing: 0.45px; }
.sa-standard-badge:hover { transform: scale(1.05); box-shadow: 0 20px 25px -5px rgba(0,0,0,0.15), 0 8px 10px -6px rgba(0,0,0,0.1); position: relative; z-index: 2; }
.sa-icon-card__title { font-size: var(--sa-text-lg); margin-bottom: var(--sa-space-2); }
.sa-icon-card__text { font-size: var(--sa-text-sm); color: var(--sa-gray-text); line-height: var(--sa-leading-relaxed); }
.sa-icon-card__link { display: inline-flex; align-items: center; gap: var(--sa-space-2); margin-top: var(--sa-space-3); color: var(--sa-accent); font-weight: var(--sa-fw-semibold); }
.sa-icon-card__arrow { display: inline-flex; }

@media (max-width: 900px) { .sa-icon-card-grid__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .sa-icon-card-grid__grid { grid-template-columns: 1fr; } }

/* ---------- IMAGE + TEXT BLOCK ---------- */
.sa-image-text-block__section-heading { margin-bottom: var(--sa-space-16); }
.sa-image-text-block__inner { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sa-space-12); align-items: center; }
.sa-image-text-block__inner:has(.sa-image-text-block__icon-grid) { align-items: start; }
.sa-image-text-block[id] { scroll-margin-top: 6rem; }
#sa-anchor-rapid-prototyping { min-height: 26.25rem; display: grid; align-content: center; } /* 420px */
#sa-anchor-development { min-height: 34.375rem; display: grid; align-content: center; } /* 550px */
#sa-anchor-continuous-quality { min-height: 26.25rem; display: grid; align-content: center; } /* 420px */
#sa-anchor-manufacturing { min-height: 28.5rem; display: grid; align-content: center; } /* 456px */
.sa-icon-card-grid[id] { scroll-margin-top: 6rem; }
.sa-image-text-block--right .sa-image-text-block__media { order: 2; }
.sa-image-text-block--narrow .sa-image-text-block__inner { grid-template-columns: 0.6fr 1fr; }
.sa-image-text-block__media { position: relative; }
.sa-image-text-block__media img { border-radius: var(--sa-radius-2xl); transition: transform var(--sa-duration-fast) var(--sa-ease); }
.sa-image-text-block__media { overflow: hidden; border-radius: var(--sa-radius-2xl); }
.sa-image-text-block__media:has(.sa-image-text-block__icon-grid) { overflow: visible; border-radius: 0; background: none; box-shadow: none; }
.sa-image-text-block__media--hover-zoom:hover img { transform: scale(1.05); }
.sa-image-text-block__icon-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sa-space-4); width: 100%; }
.sa-image-text-block__icon-grid .sa-icon-card-inline { padding: var(--sa-space-4) var(--sa-space-5); }
.sa-image-text-block__icon-grid .sa-icon-card-inline__icon { width: 2.5rem; height: 2.5rem; }
.sa-image-text-block__icon-grid .sa-icon-card-inline__icon img { width: 1.25rem; height: 1.25rem; }
.sa-image-text-block__icon-grid .sa-icon-card-inline__title { font-size: var(--sa-text-sm); font-weight: var(--sa-fw-semibold); }
.sa-image-text-block__badge { position: absolute; top: var(--sa-space-4); right: var(--sa-space-4); background: var(--sa-accent); width: 2.75rem; height: 2.75rem; border-radius: var(--sa-radius-full); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.sa-image-text-block--left .sa-image-text-block__badge { left: var(--sa-space-4); right: auto; } /* left-image cards: badge in the upper-left corner */
.sa-image-text-block--right .sa-image-text-block__badge { right: var(--sa-space-4); left: auto; } /* right-image cards: badge in the upper-right corner (matches the existing default, made explicit) */
.sa-image-text-block__badge img { width: 1.5rem !important; height: 1.5rem !important; max-width: 1.5rem; max-height: 1.5rem; object-fit: contain; flex-shrink: 0; } /* 24x24, was overflowing past the circle entirely - overflow:hidden above plus !important here guarantees this can't recur regardless of the source image's own dimensions */
.sa-image-text-block__logos { display: flex; align-items: center; gap: var(--sa-space-8); margin-bottom: var(--sa-space-6); }
.sa-image-text-block__logos img { height: auto; max-height: 4rem; width: auto; max-width: 20rem; object-fit: contain; border-radius: var(--sa-radius); }
.sa-image-text-block__video { position: relative; width: 100%; aspect-ratio: 16/9; border-radius: var(--sa-radius-2xl); overflow: hidden; background: var(--sa-navy); }
.sa-image-text-block__video iframe, .sa-image-text-block__video video { width: 100%; height: 100%; border: 0; display: block; }
.sa-image-text-block__heading {
  font-size: var(--sa-text-4xl);
  font-weight: var(--sa-fw-semibold);
  color: var(--sa-blue);
  text-transform: uppercase;
  letter-spacing: var(--sa-tracking-widest);
  line-height: 1.111; /* 40px at 36px */
  margin-bottom: var(--sa-space-5);
}
.sa-image-text-block__tagline { font-size: var(--sa-text-2xl); font-weight: var(--sa-fw-semibold); color: var(--sa-accent); margin-bottom: var(--sa-space-2); }
.sa-image-text-block__checklist { margin-top: var(--sa-space-4); }
.sa-image-text-block__checklist-label { display: block; color: var(--sa-accent); font-size: var(--sa-text-sm); font-weight: var(--sa-fw-semibold); text-transform: uppercase; letter-spacing: 0.35px; margin-bottom: var(--sa-space-3); }
.sa-image-text-block__checklist ul { list-style: none; display: flex; flex-direction: column; gap: var(--sa-space-2); }
.sa-image-text-block__checklist li { display: flex; align-items: center; gap: var(--sa-space-3); color: var(--sa-text-body); font-size: var(--sa-text-base); }
.sa-image-text-block__checklist-icon { flex-shrink: 0; width: 20px; height: 20px; }
.sa-image-text-block__checklist-dot { flex-shrink: 0; width: 8px; height: 8px; border-radius: var(--sa-radius-full); background: var(--sa-accent); }
.sa-image-text-block__checklist li strong { color: var(--sa-blue); font-weight: var(--sa-fw-bold); }
.sa-image-text-block__text { color: var(--sa-text-body); font-size: var(--sa-text-lg); line-height: var(--sa-leading-relaxed); }

/* compact style: partnership rows (Cybersecurity/Pen Testing) - confirmed via
   Figma inspector: 24px/700/navy heading (not uppercase), 16px/#4A5565 body */
.sa-image-text-block--style-compact .sa-image-text-block__heading {
  font-size: var(--sa-text-2xl);
  font-weight: var(--sa-fw-bold);
  color: var(--sa-navy);
  text-transform: none;
  letter-spacing: normal;
  line-height: 1.333; /* 32px at 24px */
}
.sa-image-text-block--style-compact .sa-image-text-block__text {
  color: var(--sa-gray-text);
  font-size: var(--sa-text-base);
  line-height: 1.625; /* 26px at 16px */
}

@media (max-width: 900px) { .sa-image-text-block__inner, .sa-image-text-block--narrow .sa-image-text-block__inner { grid-template-columns: 1fr; } .sa-image-text-block--right .sa-image-text-block__media { order: 0; } }

.sa-image-text-block__inner--card {
  background: var(--sa-white);
  border-radius: 0.875rem; /* 14px - confirmed via Figma export */
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25); /* confirmed via Figma export */
  overflow: hidden;
  gap: 0;
  align-items: stretch;
}
.sa-image-text-block__inner--card .sa-image-text-block__content { padding: var(--sa-space-12); }
.sa-image-text-block__inner--card .sa-image-text-block__media img { border-radius: 0; height: 100%; }

/* ---------- CAPABILITY SHOWCASE (Penetration Testing) ---------- */
.sa-capability-showcase__subheading { text-align: center; font-size: var(--sa-text-2xl); font-weight: var(--sa-fw-semibold); color: var(--sa-navy); margin-top: var(--sa-space-4); }
.sa-capability-showcase__row { display: flex; gap: var(--sa-space-8); align-items: stretch; margin-top: var(--sa-space-16); }
.sa-capability-showcase__card { flex: 0 0 18rem; background: var(--sa-muted); border-radius: var(--sa-radius-2xl); box-shadow: var(--sa-shadow-md); padding: var(--sa-space-6); color: var(--sa-foreground); font-size: var(--sa-text-xl); line-height: var(--sa-leading-relaxed); }
.sa-capability-showcase__image { flex: 1; width: 100%; object-fit: contain; border-radius: var(--sa-radius-2xl); }
@media (max-width: 900px) { .sa-capability-showcase__row { flex-direction: column; } .sa-capability-showcase__card { flex-basis: auto; } }

/* ---------- PROCESS STEPS ---------- */
.sa-process-steps__row { display: flex; flex-wrap: wrap; gap: var(--sa-space-6); align-items: stretch; justify-content: center; position: relative; z-index: 1; }
.sa-process-steps--arrow_chain .sa-process-steps__row { flex-wrap: nowrap; }
@media (max-width: 900px) { .sa-process-steps--arrow_chain .sa-process-steps__row { flex-wrap: nowrap; overflow-x: auto; padding-bottom: var(--sa-space-4); } }
.sa-process-steps__step { flex: 1 1 12rem; text-align: center; background: var(--sa-white); border-radius: var(--sa-radius-2xl); box-shadow: 0 4px 6px -4px rgba(0,0,0,0.1), 0 10px 15px -3px rgba(0,0,0,0.1); padding: var(--sa-space-6); transition: all var(--sa-duration-fast) var(--sa-ease); }
.sa-process-steps__step:hover { transform: scale(1.05); box-shadow: 0 20px 25px -5px rgba(0,0,0,0.15), 0 8px 10px -6px rgba(0,0,0,0.1); position: relative; z-index: 2; }
.sa-process-steps__icon, .sa-process-steps__number { display: inline-flex; align-items: center; justify-content: center; width: 4rem; height: 4rem; background: var(--sa-accent); color: var(--sa-white); border-radius: 0.875rem; margin-bottom: var(--sa-space-3); font-weight: var(--sa-fw-bold); }
.sa-process-steps__title { font-size: var(--sa-text-sm); font-weight: var(--sa-fw-semibold); text-transform: uppercase; color: var(--sa-navy); letter-spacing: 0.35px; }
.sa-process-steps__arrow { align-self: center; color: var(--sa-accent); font-size: var(--sa-text-xl); }
.sa-process-steps--split { position: relative; background: var(--sa-muted); }
.sa-process-steps--split::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 140px; background: var(--sa-blue); z-index: 0; }
.sa-process-steps--split .sa-section__heading { position: relative; z-index: 1; color: var(--sa-white); }
.sa-process-steps__cta { display: flex; justify-content: center; margin-top: var(--sa-space-8); position: relative; z-index: 1; }

/* ---------- STAT COUNTERS ---------- */
.sa-stat-counters__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sa-space-4); }
.sa-stat-counters__item {
  background: var(--sa-gradient-diagonal);
  color: var(--sa-white);
  border-radius: var(--sa-radius-2xl);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);
  padding: var(--sa-space-8);
  text-align: center;
}
.sa-stat-counters__number { display: block; font-size: var(--sa-text-6xl); font-weight: var(--sa-fw-normal); color: var(--sa-accent); line-height: 1; }
.sa-stat-counters__label { font-size: var(--sa-text-xl); font-weight: var(--sa-fw-semibold); margin-top: var(--sa-space-4); display: block; }
@media (max-width: 700px) { .sa-stat-counters__grid { grid-template-columns: repeat(2, 1fr); } }

/* ---------- TIMELINE ---------- */
.sa-timeline--circular_years .sa-section__heading { text-transform: none; letter-spacing: normal; color: var(--sa-navy); font-size: var(--sa-text-5xl); font-weight: var(--sa-fw-bold); line-height: 1; margin-bottom: 0; }
.sa-timeline--circular_years .sa-timeline__track { margin-top: var(--sa-space-20); }
.sa-timeline__marker { display: inline-flex; align-items: center; justify-content: center; width: 3.5rem; height: 3.5rem; border-radius: var(--sa-radius-full); background: var(--sa-blue); color: var(--sa-white); font-weight: var(--sa-fw-bold); margin-bottom: var(--sa-space-3); }
.sa-timeline--circular_years .sa-timeline__track { display: flex; align-items: flex-start; justify-content: center; gap: 0; }
.sa-timeline--circular_years .sa-timeline__item { flex: 0 0 7.3rem; text-align: center; display: flex; flex-direction: column; align-items: center; }
.sa-timeline__above { min-height: 6rem; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: var(--sa-space-1); margin-bottom: var(--sa-space-2); }
.sa-timeline__eyebrow { color: var(--sa-blue); font-size: 0.6875rem; font-weight: var(--sa-fw-bold); text-transform: uppercase; letter-spacing: var(--sa-tracking-wider); line-height: 1.25; }
.sa-timeline__location { color: var(--sa-timeline-location); font-size: 0.625rem; font-weight: var(--sa-fw-medium); line-height: 1.25; display: inline-flex; flex-direction: column; align-items: center; gap: 0.125rem; }
.sa-timeline__location svg { width: 0.75rem; height: 0.75rem; }
.sa-timeline--circular_years .sa-timeline__marker {
  width: 4.875rem; height: 4.875rem; font-size: 0.975rem; line-height: 1.5; border: 2.4px solid var(--sa-white);
  box-shadow: 0 0 20px rgba(0,0,0,0.2); margin-bottom: 0;
}
.sa-timeline__item--navy .sa-timeline__marker { background: var(--sa-navy); box-shadow: 0 0 20px rgba(7,26,57,0.35); }
.sa-timeline__item--blue .sa-timeline__marker { background: var(--sa-blue); box-shadow: 0 0 20px rgba(23,116,185,0.4); }
.sa-timeline__item--orange .sa-timeline__marker { background: var(--sa-accent); box-shadow: 0 0 20px rgba(242,107,33,0.4); }
.sa-timeline__marker--icon { background: var(--sa-white) !important; box-shadow: var(--sa-shadow-md) !important; padding: var(--sa-space-2); }
.sa-timeline__marker--icon img { width: 100%; height: 100%; object-fit: contain; }
.sa-timeline__connector { flex: 0 0 2.125rem; display: flex; flex-direction: column; align-items: center; }
.sa-timeline__connector-spacer { height: 6rem; }
.sa-timeline__connector-line { height: 4.875rem; display: flex; align-items: center; justify-content: center; gap: 0; }
.sa-timeline__connector-line span { width: 0.75rem; height: 2px; background: var(--sa-border-light); }
.sa-timeline__connector-line svg { width: 0.75rem; height: 0.75rem; color: #9CA3AF; }
.sa-timeline--circular_years .sa-timeline__image { display: block; margin: var(--sa-space-2) auto 0; max-width: 5.5rem; max-height: 2.5rem; width: auto; height: auto; object-fit: contain; }
.sa-timeline__card {
  margin-top: var(--sa-space-2);
  width: calc(100% + 0.725rem);
  margin-left: -0.3625rem;
  background: var(--sa-white);
  border-left: 0.8px solid #F3F4F6;
  border-right: 0.8px solid #F3F4F6;
  border-bottom: 0.8px solid #F3F4F6;
  border-top: 1.6px solid #F3F4F6;
  border-radius: var(--sa-radius-2xl);
  box-shadow: var(--sa-shadow-sm);
  padding: var(--sa-space-3) var(--sa-space-2);
  text-align: left;
}
.sa-timeline__card .sa-timeline__title { text-align: center; font-size: 0.8125rem; font-weight: var(--sa-fw-bold); line-height: 1.3; margin-bottom: var(--sa-space-1); }
.sa-timeline__item--navy .sa-timeline__title { color: var(--sa-navy); }
.sa-timeline__item--blue .sa-timeline__title { color: var(--sa-blue); }
.sa-timeline__item--orange .sa-timeline__title { color: var(--sa-accent); }
.sa-timeline__bullets { list-style: none; }
.sa-timeline__bullets li { position: relative; padding-left: var(--sa-space-3); color: var(--sa-gray-text); font-size: var(--sa-text-xs); line-height: var(--sa-leading-snug); margin-bottom: var(--sa-space-1); }
.sa-timeline__bullets li::before { content: ''; position: absolute; left: 0; top: 0.5em; width: 0.25rem; height: 0.25rem; border-radius: var(--sa-radius-full); background: currentColor; }
.sa-timeline__item--navy .sa-timeline__bullets li::before { background: var(--sa-navy); }
.sa-timeline__item--blue .sa-timeline__bullets li::before { background: var(--sa-blue); }
.sa-timeline__item--orange .sa-timeline__bullets li::before { background: var(--sa-accent); }
@media (max-width: 1100px) { .sa-timeline--circular_years .sa-timeline__track { overflow-x: auto; padding-bottom: var(--sa-space-4); } }
.sa-timeline--linear_numbered .sa-timeline__track { display: flex; gap: var(--sa-space-6); position: relative; }
/* Single continuous line spanning from the center of the first marker to
   the center of the last marker - drawn once on the track, not per-item.
   The earlier approach drew a separate repeating gradient behind each
   item, which produced a visually broken "double bump" pattern (blue
   appearing twice) instead of one smooth orange-blue-orange arc. Math
   below assumes exactly 3 equal-width items (this variant's only current
   use, the CRA timeline) - center of item N of 3 sits at (2N-1)/6 of the
   track width, so the line spans from 1/6 to 5/6 (inset 16.667% each
   side). If a 4th step is ever added here, these two percentages need
   recalculating for 4 equal items (1/8 and 7/8).
*/
.sa-timeline--linear_numbered .sa-timeline__track::before {
  content: '';
  position: absolute;
  top: 3.25rem; /* 52px - confirmed via Figma export */
  left: 16.667%;
  right: 16.667%;
  height: 2px;
  background: linear-gradient(90deg, var(--sa-accent) 0%, var(--sa-blue) 50%, var(--sa-accent) 100%);
  z-index: 0;
}
.sa-timeline--linear_numbered .sa-timeline__item {
  flex: 1; position: relative;
  display: flex; flex-direction: column; align-items: center;
}
/* Connecting line: drawn from the PREVIOUS item's marker center to this
   item's marker center (the "left:-50%; width:100%" trick spans exactly
   one flex track width when items are equal flex:1). Kept as repeated
   per-segment gradients rather than one absolutely-positioned line
   spanning exact pixel coordinates - the original Figma export computed
   that for a fixed 3-item/1280px layout, which doesn't hold up if an
   editor ever adds a 4th timeline step. */
/* Connecting line now drawn once on .sa-timeline__track::before (above),
   not per-item - see that rule's comment for why. */
.sa-timeline--linear_numbered .sa-timeline__marker {
  position: relative; z-index: 1;
  background: var(--sa-gradient-diagonal);
  border: 4px solid var(--sa-accent);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);
  margin-bottom: var(--sa-space-6);
  font-size: var(--sa-text-lg); font-weight: var(--sa-fw-black); color: var(--sa-white);
  transition: transform var(--sa-duration-fast) var(--sa-ease);
}
.sa-timeline--linear_numbered .sa-timeline__item:hover .sa-timeline__marker { transform: scale(1.1); }
.sa-timeline--linear_numbered .sa-timeline__item:hover .sa-timeline__body { transform: scale(1.05); box-shadow: 0 25px 50px -12px rgba(0,0,0,0.35); }
.sa-timeline--linear_numbered .sa-timeline__body {
  width: 100%;
  background: var(--sa-gradient-diagonal);
  border-radius: var(--sa-radius-2xl);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);
  padding: var(--sa-space-6);
  text-align: center;
  display: flex; flex-direction: column; align-items: center;
  transition: all var(--sa-duration-fast) var(--sa-ease);
}
.sa-timeline--linear_numbered .sa-timeline__date { text-transform: uppercase; font-weight: var(--sa-fw-bold); letter-spacing: 0.3px; border-radius: 10px; }
.sa-timeline--linear_numbered .sa-timeline__title { color: var(--sa-white); font-weight: var(--sa-fw-bold); margin-bottom: var(--sa-space-2); }
.sa-timeline--linear_numbered .sa-timeline__text { color: rgba(255,255,255,0.7); font-size: var(--sa-text-sm); }
@media (max-width: 700px) {
  .sa-timeline--linear_numbered .sa-timeline__track { flex-direction: column; }
  .sa-timeline--linear_numbered .sa-timeline__track::before { display: none; }
}
.sa-timeline__date { display: inline-block; background: var(--sa-accent); color: var(--sa-white); font-size: var(--sa-text-xs); padding: var(--sa-space-1) var(--sa-space-3); border-radius: var(--sa-radius-full); margin-bottom: var(--sa-space-2); }

/* ---------- TEAM GRID ---------- */
.sa-team-grid__track { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sa-space-6); }
.sa-team-card { background: var(--sa-white); border-radius: var(--sa-radius-2xl); overflow: hidden; text-align: left; height: 33.75rem; box-shadow: var(--sa-shadow-lg); display: flex; flex-direction: column; transition: all var(--sa-duration-fast) var(--sa-ease); }
.sa-team-card:hover { box-shadow: var(--sa-shadow-2xl); transform: translateY(-4px); }
.sa-team-card__photo img { transition: filter var(--sa-duration-fast) var(--sa-ease); }
.sa-team-card:hover .sa-team-card__photo img { filter: brightness(1.1); }
.sa-team-card__photo img { width: 100%; aspect-ratio: 3 / 4; height: auto; object-fit: cover; object-position: top center; }
.sa-team-card__body { padding: var(--sa-space-6); display: flex; flex-direction: column; flex: 1; }
.sa-team-card__name { font-size: var(--sa-text-xl); font-weight: var(--sa-fw-semibold); line-height: var(--sa-leading-snug); color: var(--sa-navy); margin-bottom: var(--sa-space-2); }
.sa-team-card__role { color: var(--sa-gray-text); font-size: var(--sa-text-base); line-height: var(--sa-leading-relaxed); margin-bottom: var(--sa-space-4); flex: 1; }
.sa-team-card__linkedin { display: inline-flex; align-items: center; gap: var(--sa-space-2); color: var(--sa-blue); font-size: var(--sa-text-base); font-weight: var(--sa-fw-normal); }
.sa-team-card__linkedin svg { width: 1.25rem; height: 1.25rem; }
@media (max-width: 900px) { .sa-team-grid__track { grid-template-columns: repeat(2, 1fr); } }

/* ---------- LOGO GRID ---------- */
.sa-logo-grid__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--sa-space-10); }
#sa-anchor-regulatory-compliance-support .sa-section__subheading { color: var(--sa-accent); font-weight: var(--sa-fw-semibold); font-size: var(--sa-text-2xl); }
#sa-anchor-regulatory-compliance-support .sa-logo-grid__row { max-width: 65.9375rem; min-height: 9rem; margin-inline: auto; gap: var(--sa-space-12); padding-top: var(--sa-space-12); }
#sa-anchor-regulatory-compliance-support { padding-bottom: var(--sa-space-12); min-height: 27rem; display: flex; flex-direction: column; justify-content: center; }
#sa-anchor-our-medical-track-record { padding-top: var(--sa-space-12); }
.sa-logo-grid { padding-block: var(--sa-space-20); }
.sa-logo-grid__description { max-width: 65.9375rem; min-height: 6.5rem; margin: var(--sa-space-8) auto 0; text-align: center; font-size: var(--sa-text-lg); font-weight: var(--sa-fw-normal); color: var(--sa-text-body); }
.sa-logo-grid__item img { max-height: 56px; width: auto; transition: all var(--sa-duration-fast) var(--sa-ease); }
.sa-logo-grid__item:hover img { transform: scale(1.05); }
.sa-logo-grid--certification .sa-logo-grid__item img { max-height: 112px; }

/* ---------- CTA BANNER ---------- */
.sa-cta-banner { padding-block: var(--sa-space-16); text-align: center; }
.sa-cta-banner--navy { background: var(--sa-navy); color: var(--sa-white); }
.sa-cta-banner--gradient {
  background: linear-gradient(135deg, #071a39 0%, #0a2448 50%, #1774b9 100%); /* fallback for browsers without OKLab interpolation support */
  background: linear-gradient(to bottom right in oklab, #071a39, #0a2448, #1774b9); /* confirmed exact value via figma.site inspect */
  color: var(--sa-white);
}
.sa-cta-banner--light { background: var(--sa-muted); color: var(--sa-foreground); }
.sa-cta-banner__heading { font-size: var(--sa-text-4xl); margin-bottom: var(--sa-space-3); }
.sa-cta-banner__heading--large { font-size: 3rem; line-height: 1.25; }
.sa-cta-banner__subtext { margin-bottom: var(--sa-space-6); opacity: 0.9; }
.sa-cta-banner__subtext a { color: var(--sa-accent); font-weight: var(--sa-fw-semibold); text-decoration: underline; opacity: 1; }
#sa-anchor-turn-your-idea-into-a-product { min-height: 20.75rem; display: flex; align-items: center; justify-content: center; }
#sa-anchor-turn-your-idea-into-a-product .sa-btn { padding: 1.25rem 3rem; gap: var(--sa-space-3); min-height: 4.25rem; }

/* ---------- POST GRID / POST CARD ---------- */
.sa-post-grid__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 380px)); justify-content: center; gap: var(--sa-space-6); }
.sa-post-grid__grid--cols-2 { grid-template-columns: repeat(2, minmax(320px, 34rem)); }
.sa-post-grid__grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
.sa-post-grid__grid--cols-6, .sa-post-grid__grid--cols-8 { grid-template-columns: repeat(3, 1fr); }
.sa-post-card {
  display: block;
  background: var(--sa-white);
  border-radius: var(--sa-radius-2xl);
  border: 1.6px solid var(--sa-muted);
  overflow: hidden;
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);
  transition: all 0.3s var(--sa-ease);
}
.sa-post-card:hover { border-color: var(--sa-blue); }
.sa-post-card:hover .sa-post-card__title { color: var(--sa-blue); }
.sa-post-card__image { position: relative; height: 224px; overflow: hidden; }
.sa-post-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s var(--sa-ease); }
.sa-post-card:hover .sa-post-card__image img { transform: scale(1.08); }
.sa-post-card__image-fallback { width: 100%; height: 100%; background: var(--sa-muted); }
.sa-post-card__image-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(7,26,57,0.8) 0%, rgba(7,26,57,0) 100%); pointer-events: none; }
.sa-post-card__date { position: absolute; left: var(--sa-space-4); bottom: var(--sa-space-4); color: var(--sa-white); font-size: var(--sa-text-sm); }
.sa-post-card__body { padding: var(--sa-space-6); }
.sa-post-card__title { font-size: var(--sa-text-xl); line-height: var(--sa-leading-snug); margin-bottom: var(--sa-space-2); transition: color 0.3s var(--sa-ease); }
.sa-post-card__excerpt { font-size: var(--sa-text-base); line-height: var(--sa-leading-relaxed); color: var(--sa-gray-text); margin-bottom: var(--sa-space-3); }
.sa-post-grid__view-all { text-align: center; margin-top: var(--sa-space-8); }
.sa-post-grid__header { display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; gap: var(--sa-space-6); margin-bottom: var(--sa-space-8); }
.sa-post-grid__header--left { justify-content: space-between; text-align: left; }
.sa-post-grid__header--left .sa-section__heading { text-align: left; }
.sa-post-grid__header-text { max-width: 42rem; }
.sa-post-grid__subheading { color: var(--sa-gray-text); font-size: var(--sa-text-lg); margin-top: var(--sa-space-2); }
.sa-post-grid { padding-block: var(--sa-space-20); }
.sa-post-grid__count { color: var(--sa-gray-text); font-size: var(--sa-text-base); margin-top: var(--sa-space-2); }
.sa-post-grid__category-filter { position: relative; flex-shrink: 0; }
.sa-post-grid__category-select {
  appearance: none; -webkit-appearance: none;
  background: var(--sa-white);
  border: 1px solid var(--sa-border);
  border-radius: var(--sa-radius);
  padding: var(--sa-space-3) var(--sa-space-10) var(--sa-space-3) var(--sa-space-5);
  font-family: var(--sa-font-family);
  font-size: var(--sa-text-sm);
  color: var(--sa-foreground);
  cursor: pointer;
}
.sa-post-grid__category-filter::after {
  content: ''; position: absolute; right: var(--sa-space-4); top: 45%;
  width: 0.5rem; height: 0.5rem;
  border-right: 2px solid var(--sa-foreground); border-bottom: 2px solid var(--sa-foreground);
  transform: translateY(-50%) rotate(45deg);
  pointer-events: none;
}
@media (max-width: 900px) { .sa-post-grid__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .sa-post-grid__grid { grid-template-columns: 1fr; } }

/* ---------- FILTER BAR ---------- */
.sa-filter-bar { padding-block: var(--sa-space-12); }
.sa-filter-bar > .sa-container { width: 100%; } /* same fix pattern as the hero container - was missing this, causing the same unwanted auto-margin */
.sa-filter-bar__card { width: 100%; }
.sa-filter-bar--full .sa-filter-bar__card { max-width: 56rem; margin-inline: auto; text-align: center; padding: var(--sa-space-10) var(--sa-space-8); }
.sa-filter-bar__heading { color: var(--sa-navy); font-size: var(--sa-text-lg); font-weight: var(--sa-fw-semibold); line-height: 1.75rem; margin-bottom: 0; }
.sa-filter-bar__search { position: relative; margin-top: var(--sa-space-3); }
.sa-filter-bar__search-icon { position: absolute; left: var(--sa-space-4); top: 50%; transform: translateY(-50%); color: var(--sa-placeholder); width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.sa-filter-bar__input { width: 100%; height: 59.2px; border: 1.6px solid var(--sa-border-light); background: var(--sa-white); border-radius: var(--sa-radius); padding: var(--sa-space-4) var(--sa-space-4) var(--sa-space-4) var(--sa-space-12); font-size: var(--sa-text-base); font-family: var(--sa-font-family); line-height: 1.5; }
.sa-filter-bar__input::placeholder { color: var(--sa-placeholder); }
.sa-filter-bar--simple .sa-filter-bar__columns { grid-template-columns: 1fr; margin-top: var(--sa-space-8); }
.sa-filter-bar__topics-label { display: block; color: var(--sa-navy); font-size: var(--sa-text-lg); font-weight: var(--sa-fw-semibold); line-height: 1.75rem; margin-bottom: var(--sa-space-4); }
.sa-filter-bar__icon { width: 3rem; height: 3rem; border-radius: var(--sa-radius-full); background: var(--sa-blue); color: var(--sa-white); display: flex; align-items: center; justify-content: center; margin: 0 auto var(--sa-space-4); }
.sa-filter-bar__icon--square { width: 4rem; height: 4rem; border-radius: var(--sa-radius-2xl); }
.sa-filter-bar--full .sa-filter-bar__heading { font-size: var(--sa-text-2xl); }
.sa-filter-bar__subtext { color: var(--sa-gray-text); margin-bottom: var(--sa-space-6); }
.sa-filter-bar__columns { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sa-space-6); text-align: left; margin-bottom: var(--sa-space-8); }
.sa-filter-bar__checklist { display: flex; flex-direction: column; gap: var(--sa-space-3); }
.sa-filter-bar__checklist--row { flex-direction: row; flex-wrap: wrap; gap: var(--sa-space-6); }
.sa-filter-checkbox { display: flex; align-items: center; gap: var(--sa-space-3); font-size: var(--sa-text-base); font-weight: var(--sa-fw-medium); color: var(--sa-navy); cursor: pointer; }
.sa-filter-checkbox input[type="checkbox"] { width: 1.25rem; height: 1.25rem; accent-color: var(--sa-blue); cursor: pointer; }
.sa-filter-bar__apply { display: inline-flex; align-items: center; gap: var(--sa-space-2); }
@media (max-width: 700px) { .sa-filter-bar__columns { grid-template-columns: 1fr; } }

/* ---------- LOCATIONS MAP ---------- */
.sa-locations-map__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--sa-space-8); align-items: stretch; }
.sa-locations-map__map { background: var(--sa-border); border-radius: var(--sa-radius-2xl); height: 100%; min-height: 29.24rem; max-width: 38.769rem; overflow: hidden; z-index: 0; } /* 620.31x467.86 */
.sa-locations-map__map .leaflet-popup-content-wrapper { border-radius: var(--sa-radius); font-family: var(--sa-font-family); }
.sa-locations-map__list { display: flex; flex-direction: column; gap: var(--sa-space-4); }
.sa-locations-map__item { display: flex; gap: var(--sa-space-3); background: var(--sa-white); border-radius: var(--sa-radius); padding: var(--sa-space-4); border-left: 3px solid var(--sa-accent); min-height: 7rem; align-items: center; } /* 112px tall */
.sa-locations-map__flag { flex-shrink: 0; margin-top: 0.2rem; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,0.08); }
.sa-locations-map__address { font-size: var(--sa-text-sm); color: var(--sa-blue); }
.sa-locations-map__phone { font-size: var(--sa-text-sm); color: var(--sa-accent); font-weight: var(--sa-fw-semibold); }
@media (max-width: 900px) { .sa-locations-map__grid { grid-template-columns: 1fr; } }

/* ---------- RICH TEXT ---------- */
.sa-rich-text--center .sa-rich-text__inner { text-align: center; max-width: 48rem; margin-inline: auto; }
.sa-rich-text__inner { line-height: var(--sa-leading-relaxed); color: var(--sa-blue); }
.sa-rich-text--normal .sa-rich-text__inner { color: var(--sa-text-body); font-size: var(--sa-text-xl); font-weight: var(--sa-fw-normal); }
.sa-rich-text--quote .sa-rich-text__inner {
  background: var(--sa-muted);
  border-radius: 0.875rem;
  padding: var(--sa-space-8);
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
  text-align: center;
  max-width: 56rem;
  margin-inline: auto;
  color: var(--sa-navy);
  font-size: var(--sa-text-xl);
  line-height: var(--sa-leading-relaxed);
}
.sa-rich-text--icon_statement { position: relative; background: var(--sa-muted); overflow: hidden; }
.sa-rich-text--icon_statement::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 11.25rem; background: var(--sa-blue); z-index: 0; }
.sa-rich-text--icon_statement .sa-section__heading { position: relative; z-index: 1; color: var(--sa-white); }
.sa-rich-text--icon_statement .sa-rich-text__inner { position: relative; z-index: 1; }
.sa-rich-text__card {
  max-width: 56rem; margin-inline: auto; margin-top: var(--sa-space-8);
  background: var(--sa-white);
  border-radius: var(--sa-radius-2xl);
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
  padding: var(--sa-space-10);
  display: flex; flex-direction: column; align-items: center;
}
.sa-rich-text__card-icon {
  width: 4rem; height: 4rem; background: var(--sa-accent); border-radius: var(--sa-radius-full);
  display: flex; align-items: center; justify-content: center; margin-bottom: var(--sa-space-6);
}
.sa-rich-text__card-icon img { filter: brightness(0) invert(1); width: 2rem; height: 2rem; }
.sa-rich-text__card .sa-rich-text__inner { text-align: center; color: var(--sa-text-body); font-size: var(--sa-text-xl); line-height: var(--sa-leading-relaxed); }
.sa-rich-text__card .sa-rich-text__inner strong { color: var(--sa-navy); }

/* ---------- SINGLE POST / PRESS RELEASE ---------- */
.sa-single-post__header { padding-block: var(--sa-space-12); }
.sa-single-post__header h1 { font-size: var(--sa-text-4xl); margin-top: var(--sa-space-3); }
.sa-single-post__meta { display: flex; gap: var(--sa-space-3); align-items: center; font-size: var(--sa-text-sm); }
.sa-single-post__thumb { margin-top: calc(var(--sa-space-8) * -1); position: relative; }
.sa-single-post__thumb img { border-radius: var(--sa-radius-2xl); box-shadow: var(--sa-shadow-lg); }
.sa-single-post__content { max-width: 48rem; margin-inline: auto; padding-block: var(--sa-space-12); line-height: var(--sa-leading-relaxed); }
.sa-single-post__content p { margin-bottom: var(--sa-space-4); }

/* ---------- FOOTER ---------- */
.sa-footer { background: var(--sa-navy); color: var(--sa-white); padding-block: var(--sa-space-16) var(--sa-space-6); }
.sa-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: var(--sa-space-8); margin-bottom: var(--sa-space-10); }
.sa-footer__tagline { margin-top: var(--sa-space-4); opacity: 0.7; font-size: var(--sa-text-sm); max-width: 20rem; }
.sa-footer__heading { color: var(--sa-accent); font-family: var(--sa-font-family); font-size: 1.25rem; /* 20px */ font-style: normal; font-weight: var(--sa-fw-semibold); /* 600 */ line-height: 1.75rem; /* 28px = 140% */ margin-bottom: var(--sa-space-4); }
.sa-footer__links { list-style: none; display: flex; flex-direction: column; gap: var(--sa-space-3); }
.sa-footer__links a { opacity: 0.8; font-size: var(--sa-text-sm); }
.sa-footer__links a:hover { opacity: 1; }
.sa-footer__bottom { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid rgba(255,255,255,0.1); padding-top: var(--sa-space-6); font-size: var(--sa-text-xs); opacity: 0.7; }
@media (max-width: 900px) { .sa-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .sa-footer__grid { grid-template-columns: 1fr; } .sa-footer__bottom { flex-direction: column; gap: var(--sa-space-3); text-align: center; } }

/* ---------- ICONS (mail / phone / social) ---------- */
/* Shape comes from inline SVG (see swiftact_icon() in inc/helpers.php) -
   these rules only handle sizing/spacing/color, so there's no CSS-only
   failure mode where the icon shape itself fails to render. */
.sa-icon { width: 1.1rem; height: 1.1rem; color: currentColor; margin-right: var(--sa-space-2); }
.sa-footer__contact .sa-icon { margin-right: var(--sa-space-2); }
.sa-footer__social { display: flex; gap: var(--sa-space-4); list-style: none; align-items: center; }
.sa-footer__social .sa-icon { width: 1.375rem; height: 1.375rem; margin-right: 0; }

/* ---------- LOGO GRID: real carousel (Our Clients) - replaces the old CSS-only
   marquee, which could never support functional/synced pagination dots ---------- */
.sa-logo-grid__carousel { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sa-space-4); }
.sa-logo-grid__viewport { overflow: hidden; flex: 1; }
.sa-logo-grid__track { display: flex; gap: var(--sa-space-10); transition: transform 0.4s var(--sa-ease); }
.sa-logo-grid__track .sa-logo-grid__item {
  flex-shrink: 0;
  /* Fixed, EQUAL width per slide. 175px so that exactly 5 items fit inside
     the 1056px viewport (1184px container − 2×48px arrows − 2×16px gaps):
     5 × 175px + 4 × 40px gap = 875 + 160 = 1035px ≤ 1056px ✅ */
  width: 175px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sa-logo-grid__carousel .sa-logo-grid__item img {
  max-height: 56px;
  max-width: 162px;
  width: auto;
  object-fit: contain;
}
@media (min-width: 640px) {
  .sa-logo-grid__carousel .sa-logo-grid__item img { max-height: 80px; }
}
@media (min-width: 768px) {
  .sa-logo-grid__carousel .sa-logo-grid__item img { max-height: 110px; }
}
.sa-logo-grid__arrow {
  flex-shrink: 0;
  width: 3rem; height: 3rem; /* 48px — increased from 40px to match Figma */
  border-radius: var(--sa-radius-full);
  border: none;
  background: var(--sa-blue); /* solid blue — was white with hover-blue */
  color: var(--sa-white);     /* white arrow — was blue */
  box-shadow: var(--sa-shadow-sm);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: var(--sa-text-lg);
  transition: all var(--sa-duration-fast) var(--sa-ease);
}
.sa-logo-grid__arrow:hover { background: var(--sa-navy); color: var(--sa-white); } /* darker navy on hover */
.sa-logo-grid__arrow:disabled { opacity: 0.35; cursor: default; }
.sa-logo-grid__arrow:disabled:hover { background: var(--sa-blue); color: var(--sa-white); }

/* ---------- ICON CARD GRID: navy/glass variant ---------- */
.sa-icon-card-grid--navy .sa-section__heading { color: var(--sa-accent); }
.sa-icon-card-grid--navy .sa-section__subheading { color: rgba(255,255,255,0.85); }
.sa-icon-card-grid--navy .sa-icon-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  text-align: center;
}
.sa-icon-card-grid--navy .sa-icon-card__icon { background: transparent; margin-inline: auto; width: 3rem; height: 3rem; }
.sa-icon-card-grid--navy .sa-icon-card__icon img { width: 3rem; height: 3rem; filter: brightness(0) saturate(100%) invert(46%) sepia(97%) saturate(1747%) hue-rotate(346deg) brightness(101%) contrast(94%); }
.sa-icon-card-grid--navy .sa-icon-card__title { color: var(--sa-white); }
.sa-icon-card-grid--navy .sa-icon-card__text { color: rgba(255,255,255,0.75); }

/* ---------- ICON CARD GRID: photo_card style (Homepage "Our Services") ---------- */
.sa-icon-card-grid__grid--photo_card { align-items: start; }
.sa-photo-card { display: block; }
.sa-photo-card__media {
  display: block;
  position: relative;
  aspect-ratio: 330 / 248; /* confirmed via Figma export */
  border-radius: var(--sa-radius-2xl);
  overflow: hidden;
  background: var(--sa-muted); /* graceful placeholder until the real photo is uploaded */
  box-shadow: var(--sa-shadow-md);
  margin-bottom: var(--sa-space-4);
}
.sa-photo-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--sa-duration-fast) var(--sa-ease); }
.sa-photo-card:hover .sa-photo-card__media img { transform: scale(1.05); }
.sa-photo-card__media::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(7,26,57,0.6) 0%, rgba(7,26,57,0.2) 50%, transparent 100%);
}
.sa-photo-card__badge {
  position: absolute; top: var(--sa-space-4); left: var(--sa-space-4); z-index: 2;
  width: 3rem; height: 3rem;
  background: var(--sa-accent);
  border-radius: var(--sa-radius-full);
  display: flex; align-items: center; justify-content: center;
  box-shadow: var(--sa-shadow-lg);
}
.sa-photo-card__badge img { width: 24px; height: 24px; filter: brightness(0) invert(1); }
.sa-photo-card__title { display: block; text-align: center; font-size: var(--sa-text-lg); font-weight: var(--sa-fw-semibold); color: var(--sa-navy); }
.sa-photo-card--linked:hover .sa-photo-card__media { box-shadow: var(--sa-shadow-lg); transform: translateY(-2px); transition: all var(--sa-duration-fast) var(--sa-ease); }

/* ---------- ICON CARD GRID: icon_badge style (Industries page cards) ---------- */
.sa-badge-card {
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  background: var(--sa-white);
  border-radius: 0.875rem; /* 14px - confirmed via Figma export */
  padding: var(--sa-space-8);
  height: 17.75rem; /* 284px - confirmed via Figma export, keeps cards uniform even when titles wrap to different line counts */
  box-shadow: 0 4px 6px -4px rgba(0,0,0,0.1), 0 10px 15px -3px rgba(0,0,0,0.1);
  transition: all var(--sa-duration-fast) var(--sa-ease);
  cursor: default; /* non-linked cards (div) show default cursor */
}
.sa-badge-card--linked { cursor: pointer; }
.sa-badge-card:hover { box-shadow: var(--sa-shadow-lg); transform: translateY(-2px); }
.sa-badge-card__icon {
  width: 7rem; height: 7rem; /* 112px - confirmed via Figma export */
  border-radius: var(--sa-radius-full); /* circular - the confirmed default; Homepage's Our Industries gets its own scoped square override below */
  background: linear-gradient(90deg, #071a39, #1774b9); /* fallback for browsers without OKLab interpolation support */
  background: var(--sa-gradient-horizontal); /* same gradient as the hero banner, per confirmation */
  display: flex; align-items: center; justify-content: center;
  margin-bottom: var(--sa-space-4);
  transition: transform var(--sa-duration-fast) var(--sa-ease);
}
.sa-badge-card:hover .sa-badge-card__icon { transform: scale(1.08); }
.sa-badge-card__icon img { width: 60%; height: 60%; object-fit: contain; }
.sa-badge-card__title { font-size: var(--sa-text-xl); font-weight: var(--sa-fw-bold); color: var(--sa-navy); line-height: 1.4; }
body.page-slug-homepage .sa-badge-card__icon { border-radius: var(--sa-radius-2xl); } /* Homepage's Our Industries confirmed-correct square look, scoped so it can never again leak onto other pages sharing this card style */
#sa-anchor-our-industries .sa-badge-card__title { font-size: 0.875rem; font-weight: var(--sa-fw-semibold); } /* 14px SemiBold, not bold */
#sa-anchor-our-industries .sa-badge-card { padding: var(--sa-space-6); } /* 24px padding, confirmed */
#sa-anchor-our-industries .sa-badge-card__icon { width: 4rem; height: 4rem; } /* 64x64, confirmed */

/* ---------- ICON CARD GRID: split background (Our Industries) ---------- */
.sa-icon-card-grid--split { position: relative; background: var(--sa-muted); overflow: hidden; }
.sa-icon-card-grid--split::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 230px;
  background: var(--sa-blue); z-index: 0;
}
.sa-icon-card-grid--split .sa-container { position: relative; z-index: 1; }
.sa-icon-card-grid--split .sa-section__heading { color: var(--sa-white); }
.sa-icon-card-grid--split .sa-section__subheading { color: rgba(255,255,255,0.9); }

/* ---------- ICON CARD GRID: closing text (kept inside the section, not spilling into the next one) ---------- */
.sa-icon-card-grid__closing { text-align: center; max-width: 56rem; margin: var(--sa-space-12) auto 0; color: var(--sa-gray-text); font-size: var(--sa-text-xl); }
.sa-icon-card-grid--navy .sa-icon-card-grid__closing { color: rgba(255,255,255,0.85); }

/* ---------- LOGO GRID: hover zoom (Partnerships logos read as too small at rest) ---------- */
.sa-logo-grid__item img { transition: all var(--sa-duration-fast) var(--sa-ease); }
.sa-logo-grid__item:hover img { transform: scale(1.35); }

/* ---------- LOGO GRID: pagination dots (decorative, see template note) ---------- */
.sa-logo-grid__dots { display: flex; justify-content: center; gap: var(--sa-space-2); margin-top: var(--sa-space-8); width: 100%; }
.sa-logo-grid__dot { width: 8px; height: 8px; padding: 0; border: none; border-radius: 50%; background: var(--sa-blue); opacity: 0.25; cursor: pointer; transition: all var(--sa-duration-fast) var(--sa-ease); }
.sa-logo-grid__dot:hover { opacity: 0.6; }
.sa-logo-grid__dot.is-active { opacity: 1; background: var(--sa-accent); width: 20px; border-radius: var(--sa-radius-full); }

/* ---------- HERO GALLERY SLIDER ---------- */
.sa-hero__slider { position: relative; }
.sa-hero__slider-track { position: relative; width: 100%; height: 100%; }
.sa-hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 0.6s var(--sa-ease); }
.sa-hero__slide.is-active { opacity: 1; position: relative; }
.sa-hero__slide img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--sa-radius-xl); box-shadow: var(--sa-shadow-2xl); }
.sa-hero__slider-dots { position: absolute; bottom: var(--sa-space-4); left: 0; right: 0; display: flex; justify-content: center; gap: var(--sa-space-2); z-index: 2; }
.sa-hero__slider-dot { width: 0.5rem; height: 0.5rem; border-radius: var(--sa-radius-full); background: rgba(255,255,255,0.5); border: none; cursor: pointer; padding: 0; transition: background var(--sa-duration-fast) var(--sa-ease); }
.sa-hero__slider-dot.is-active { background: var(--sa-accent); }

/* ---------- CONTACT FORM ---------- */
.sa-container--narrow { max-width: 56rem; }
.sa-contact-form__card { padding: var(--sa-space-12); box-shadow: var(--sa-shadow-xl); border-radius: var(--sa-radius-xl); }
.sa-contact-form__form { width: 100%; }
.sa-contact-form__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sa-space-6); margin-bottom: var(--sa-space-6); }
.sa-contact-form__field { display: flex; flex-direction: column; gap: var(--sa-space-2); }
.sa-contact-form__field--full { grid-column: 1 / -1; }
.sa-contact-form__field label { font-size: var(--sa-text-sm); font-weight: var(--sa-fw-semibold); color: var(--sa-navy); }
.sa-contact-form__field input,
.sa-contact-form__field select,
.sa-contact-form__field textarea {
  border: 0.8px solid var(--sa-border-light);
  border-radius: var(--sa-radius);
  padding: var(--sa-space-3) var(--sa-space-4);
  font-family: var(--sa-font-family);
  font-size: var(--sa-text-base);
  color: var(--sa-foreground);
  background: var(--sa-white);
}
.sa-contact-form__field textarea { min-height: 11rem; resize: vertical; }
.sa-contact-form__submit { width: 100%; justify-content: center; font-size: var(--sa-text-base); font-weight: var(--sa-fw-semibold); padding-inline: var(--sa-space-8); padding-block: var(--sa-space-4); min-height: 3.5rem; }
.sa-contact-form__notice { padding: var(--sa-space-4); border-radius: var(--sa-radius); margin-bottom: var(--sa-space-6); font-weight: var(--sa-fw-medium); }
.sa-contact-form__notice--success { background: rgba(23,116,185,0.1); color: var(--sa-blue); }
.sa-contact-form__notice--error { background: rgba(242,107,33,0.1); color: var(--sa-accent); }
@media (max-width: 700px) { .sa-contact-form__grid { grid-template-columns: 1fr; } .sa-contact-form__field--half { grid-column: 1 / -1; } }

/* ---------- GRADIENT PANEL (Mission/Vision) ---------- */
.sa-icon-card-grid__grid--gradient_panel { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sa-space-12); } /* 48px gap */
.sa-icon-card-grid:has(.sa-icon-card-grid__grid--gradient_panel) { min-height: 27.8125rem; display: grid; align-content: center; padding-block: var(--sa-space-16); } /* 445px total section height */
.sa-gradient-panel { width: 31.475rem; height: 17.8125rem; padding: var(--sa-space-10); border-radius: var(--sa-radius-xl); box-shadow: var(--sa-shadow-2xl); color: var(--sa-white); } /* 503.6x285 */
.sa-gradient-panel--blue { background: var(--sa-gradient-horizontal); }
.sa-gradient-panel--orange { background: linear-gradient(135deg, var(--sa-accent) 0%, #D45A18 100%); }
.sa-gradient-panel__header { display: flex; align-items: center; gap: var(--sa-space-4); margin-bottom: var(--sa-space-6); }
.sa-gradient-panel__icon { width: 4rem; height: 4rem; flex-shrink: 0; background: rgba(255,255,255,0.2); border-radius: var(--sa-radius-2xl); display: flex; align-items: center; justify-content: center; }
.sa-gradient-panel__icon img { width: 2rem; height: 2rem; filter: brightness(0) invert(1); }
.sa-gradient-panel__title { font-size: var(--sa-text-3xl); font-weight: var(--sa-fw-semibold); line-height: 1.2; }
.sa-gradient-panel__text { font-size: var(--sa-text-lg); line-height: var(--sa-leading-relaxed); color: rgba(255,255,255,0.9); }
@media (max-width: 800px) { .sa-icon-card-grid__grid--gradient_panel { grid-template-columns: 1fr; } }

/* ---------- ICON ACCENT (orange variant for icon_plain/icon_badge circles) ---------- */
.sa-icon-card-grid__grid--iconaccent-orange .sa-icon-card__icon,
.sa-icon-card-grid__grid--iconaccent-orange .sa-badge-card__icon { background: var(--sa-accent); }

/* ---------- TIMELINE ITEM IMAGE (extendable, add more items anytime in wp-admin) ---------- */
.sa-timeline__image { display: block; margin: var(--sa-space-2) auto; max-width: 4rem; max-height: 2rem; object-fit: contain; }

/* ---------- TEAM CAROUSEL ---------- */
.sa-team-grid .sa-section__heading { margin-bottom: var(--sa-space-16); }
.sa-team-grid__carousel { display: flex; align-items: center; gap: var(--sa-space-4); }
.sa-team-grid__viewport { flex: 1; overflow: hidden; }
.sa-team-grid__track { display: flex; gap: var(--sa-space-6); transition: transform 0.4s var(--sa-ease); }
.sa-team-grid__track .sa-team-card { flex: 0 0 calc((100% - 3 * var(--sa-space-6)) / 4); }
.sa-team-grid__arrow { flex-shrink: 0; width: 2.5rem; height: 2.5rem; border-radius: var(--sa-radius-full); border: none; background: var(--sa-white); box-shadow: var(--sa-shadow-md); color: var(--sa-blue); font-size: var(--sa-text-lg); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.sa-team-grid__arrow:hover { background: var(--sa-blue); color: var(--sa-white); }
.sa-team-grid__dots { display: flex; justify-content: center; gap: var(--sa-space-2); margin-top: var(--sa-space-6); }
.sa-team-grid__dot { width: 0.75rem; height: 0.75rem; border-radius: var(--sa-radius-full); background: var(--sa-border); border: none; cursor: pointer; padding: 0; }
.sa-team-grid__dot.is-active { background: var(--sa-accent); }

/* ---------- CRA PAGE: specific overrides per client's exact Figma spec (Bold, not the sitewide SemiBold default) ---------- */
#sa-anchor-cra-with-swift-act .sa-section__heading,
#sa-anchor-cra-timeline .sa-section__heading { font-weight: var(--sa-fw-bold); }
#sa-anchor-ready-for-a-demo .sa-cta-banner__heading { font-weight: var(--sa-fw-bold); margin-bottom: 0; } /* margin-bottom:0 removes base 12px so heading→subtext gap = padding-top only = 24px exactly */
#sa-anchor-cra-timeline { padding-top: var(--sa-space-20); padding-bottom: 0; padding-inline: var(--sa-space-12); min-height: 19.59rem; } /* 313.5px content area, 80px top padding, 48px L/R */
#sa-anchor-cra-timeline .sa-section__heading { max-width: 65.9375rem; margin-inline: auto; margin-bottom: var(--sa-space-16); } /* 1055.2px text box — 64px gap between heading and timeline track (was base 20px) */
#sa-anchor-cra-timeline + .sa-rich-text--quote { padding-top: var(--sa-space-8); padding-bottom: var(--sa-space-20); padding-inline: var(--sa-space-12); min-height: 14.125rem; display: grid; align-content: center; } /* padding-inline: 48px matches the timeline section above — both now have section+container double-padding so quote inner aligns with timeline track */
#sa-anchor-cra-timeline + .sa-rich-text--quote .sa-rich-text__inner { max-width: 65.9375rem; } /* 1055.2px — aligned with CRA timeline width above; overrides base 56rem (896px) */
#sa-anchor-ready-for-a-demo { min-height: 21.25rem; padding-block: var(--sa-space-20); padding-inline: var(--sa-space-12); display: flex; align-items: center; justify-content: center; } /* 340px, 80px T/B, 48px L/R */
#sa-anchor-ready-for-a-demo .sa-btn { min-width: 14.625rem; min-height: 3.5rem; font-weight: var(--sa-fw-semibold); font-size: var(--sa-text-base); } /* 234x56 */
#sa-anchor-ready-for-a-demo .sa-cta-banner__subtext { max-width: 65.9375rem; min-height: 5.25rem; margin-inline: auto; padding-top: var(--sa-space-6); padding-bottom: var(--sa-space-8); margin-bottom: 0; font-size: var(--sa-text-xl); font-weight: var(--sa-fw-normal); } /* 24px top (title→subtitle) / 32px bottom (subtitle→button); margin-bottom:0 removes base 24px that was stacking on padding-bottom */

/* ---------- FUSA PAGE: exact Figma dimensions ---------- */
#sa-anchor-our-track-record { min-height: 27rem; padding-block: var(--sa-space-20); padding-inline: var(--sa-space-12); display: flex; flex-direction: column; justify-content: center; } /* 432px, 80/48 padding */
#sa-anchor-our-track-record .sa-stat-counters__grid { gap: var(--sa-space-8); } /* 32px — overrides base 16px (var(--sa-space-4)) */
#sa-anchor-industries-and-standards .sa-section__subheading { font-weight: var(--sa-fw-normal); font-size: var(--sa-text-xl); } /* 20px regular */
body.page-slug-functional-safety-2 #sa-anchor-industries-and-standards .sa-section__subheading,
body.page-slug-functional-safety #sa-anchor-industries-and-standards .sa-section__subheading { text-transform: uppercase; } /* all-caps — scoped to FuSa only; Pen Testing's same-named section unaffected */
#sa-anchor-industries-and-standards .sa-standard-badge__pill { width: 11.75rem; min-height: 2.75rem; } /* 188x44 */
#sa-anchor-industries-and-standards .sa-standard-badge__prefix { min-width: 1.375rem; min-height: 1.0625rem; } /* 22x17 */
#sa-anchor-industries-and-standards .sa-standard-badge__number { min-width: 3.625rem; min-height: 1.75rem; font-family: var(--sa-font-family); font-size: 1.125rem; } /* 58x28, 18px */

/* ---------- QUALITY ENGINEERING: "Our Quality Engineering Services" - center the orphaned last row ----------
   Real fix this time (an earlier response described this but never actually
   wrote it into the CSS - the card grid was still a strict CSS grid, which
   always left-aligns an incomplete final row). Switching this specific
   instance to flexbox+wrap+center achieves the "freeform, centered" layout
   the client's Figma shows, without touching the shared grid system used
   elsewhere on other pages. */
#sa-anchor-our-quality-engineering-services { min-height: 40.25rem; padding-block: var(--sa-space-20); padding-inline: var(--sa-space-12); } /* 644px, 80/48 padding */
#sa-anchor-our-quality-engineering-services .sa-icon-card-grid__grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#sa-anchor-our-quality-engineering-services .sa-icon-card-grid__grid > * {
  flex: 0 0 20.48rem; /* 327.73px flex-basis - must match the real card width, since flex-basis (not width) governs sizing in a flex row */
}

/* ---------- QUALITY ENGINEERING: "Why Our Approach Works" ----------
   Real layering bug: the blue band (::before, position:absolute, z-index:0)
   was outranking the plain static .sa-rich-text__card, which had no
   position/z-index of its own to compete in the same stacking layer -
   position+z-index always beats static content regardless of DOM order.
   Giving the card its own position+z-index fixes this properly. */
.sa-rich-text--icon_statement .sa-rich-text__card { position: relative; z-index: 2; }
#sa-anchor-why-our-approach-works { min-height: 27.09375rem; } /* 433.5px */
#sa-anchor-why-our-approach-works .sa-container { max-width: 65.9375rem; padding-top: 0; padding-bottom: 0; } /* 1055.2 wide - no extra top padding here, that was incorrectly pushing the heading down; the section's own 48px padding is the only top spacing before the heading now */
#sa-anchor-why-our-approach-works::before { height: 14rem; } /* extended so the card's natural position overlaps into the blue band, matching the Figma reference - was 11.25rem */
#sa-anchor-why-our-approach-works .sa-rich-text__card { max-width: 56rem; min-height: 16.625rem; margin: 0 auto; position: relative; z-index: 3; } /* 896x266, natural position - no risk of clipping the heading */

/* ---------- QUALITY ENGINEERING: closing CTA ---------- */
#sa-anchor-lets-turn-your-processes-into-measurable-engineering-excellence { min-height: 26.25rem; padding-block: var(--sa-space-20); display: flex; align-items: center; justify-content: center; } /* 420px, 80px T/B */
#sa-anchor-lets-turn-your-processes-into-measurable-engineering-excellence .sa-cta-banner__inner { max-width: 56rem; } /* 896px content wrapper */

/* ---------- HOMEPAGE: "Why Swift Act" exact height ----------
   Scoped by page slug, not just the heading's anchor id - "Why Swift Act"
   is reused as a heading on other pages too (Pen Testing, Cybersecurity),
   so an anchor-id-only selector would incorrectly apply this Homepage-only
   height everywhere that heading appears. */
body.page-slug-homepage #sa-anchor-why-swift-act { min-height: 40rem; } /* 640px */

/* ---------- HOMEPAGE: "Our Industries" card exact size ---------- */
#sa-anchor-our-industries .sa-badge-card { width: 9.74rem; height: 10.1875rem; } /* 155.86x163 */

/* ---------- CYBERSECURITY: "Get Started" CTA button exact size ---------- */
#sa-anchor-start-your-cybersecurity-journey-with-our-experts .sa-cta-banner__heading { font-weight: var(--sa-fw-medium); } /* Medium 36px */
#sa-anchor-start-your-cybersecurity-journey-with-our-experts .sa-cta-banner__subtext { font-size: var(--sa-text-xl); font-weight: var(--sa-fw-normal); } /* "Contact us at" → Regular 20px; "cra@swift-act.com" <a> → SemiBold already set by base .sa-cta-banner__subtext a rule */
#sa-anchor-start-your-cybersecurity-journey-with-our-experts .sa-btn { min-width: 11.9375rem; min-height: 3.5rem; padding: var(--sa-space-4) var(--sa-space-8); font-size: var(--sa-text-base); font-weight: var(--sa-fw-semibold); gap: var(--sa-space-3); } /* 191x56, 16/32 padding, SemiBold 16px, 12px gap */
#sa-anchor-start-your-cybersecurity-journey-with-our-experts .sa-btn .sa-icon { width: 1.25rem; height: 1.25rem; } /* arrow: 20x20 */

/* ---------- CONTACT US: hero is a fixed-height exception, not full-viewport ----------
   Resolves the tension between "every hero fills the screen" (the sitewide
   rule) and this specific page's Figma, which shows a short, compact hero
   (428px) with content near the top, not vertically centered in a full
   screen. Client confirmed: short-content heroes (no stats/image/button)
   should keep their natural Figma height instead of stretching full-screen. */
body.page-slug-contact-us .sa-hero { min-height: 26.75rem; } /* 428px, overrides the sitewide 100vh rule for this page only */

/* ---------- HOMEPAGE: "Our Locations" map section - exact Figma dimensions (revised) ---------- */
#sa-anchor-our-locations { min-height: 48.49rem; padding-block: var(--sa-space-20); padding-inline: var(--sa-space-12); } /* 775.86px, 80/48 padding */
#sa-anchor-our-locations .sa-section__intro { min-height: 5.25rem; max-width: 65.9375rem; margin-inline: auto; } /* 1055.2x84 */
#sa-anchor-our-locations .sa-locations-map__grid { max-width: 65.9375rem; min-height: 33.24rem; margin: 0 auto; padding-top: var(--sa-space-16); gap: 2rem; } /* 1055.2x531.86, 64px top padding, 32px gap */
#sa-anchor-our-locations .sa-locations-map__list { min-height: 29.25rem; gap: 0.75rem; } /* height/gap only - width now fills its real grid column instead of a fixed isolated-frame measurement */

/* ---------- CRA PAGE: "CRA with Swift Act" icon styling (scoped, not shared with Homepage's icon_badge instance) ---------- */
#sa-anchor-cra-with-swift-act .sa-badge-card__icon { border: 3px solid var(--sa-blue); transition: all var(--sa-duration-fast) var(--sa-ease); }
#sa-anchor-cra-with-swift-act .sa-badge-card:hover .sa-badge-card__icon { border-color: var(--sa-accent); filter: brightness(1.15); transform: scale(1.05); }

/* ---------- PENETRATION TESTING PAGE ---------- */
body.page-slug-penetration-testing .sa-hero__media { min-height: 31.25rem; } /* 500px (504 width already matches shared 2-col hero layout) */
body.page-slug-penetration-testing .sa-hero__content { min-height: 31.25rem; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; } /* 504x500 text box - align-items:flex-start prevents the CTA button from stretching full-width */
body.page-slug-penetration-testing .sa-hero__content > * { align-self: stretch; } /* heading/subtext still span full width */
body.page-slug-penetration-testing .sa-hero__content .sa-btn { align-self: flex-start; min-width: 11.5625rem; min-height: 3.5rem; } /* 185x56, hugs its label and aligns with the text column */
body.page-slug-penetration-testing .sa-hero__heading { font-size: var(--sa-text-6xl); font-weight: var(--sa-fw-bold); } /* 60px Bold */
body.page-slug-penetration-testing .sa-hero__subtext { font-weight: var(--sa-fw-normal); } /* 20px Regular - size already matches the shared default */
body.page-slug-penetration-testing .sa-section__heading,
body.page-slug-penetration-testing .sa-image-text-block__heading { font-weight: var(--sa-fw-bold); } /* Bold 36px - sitewide default is SemiBold, this page wants Bold like CRA */

/* ---------- PENETRATION TESTING: closing CTA button exact size ---------- */
#sa-anchor-ready-to-strengthen-your-security-posture .sa-btn { padding: 1rem 2rem; min-height: 3.5rem; width: fit-content; } /* 187 Hug x 56, 16px T/B, 32px L/R padding */

/* ---------- PENETRATION TESTING: closing CTA "Contact Us" button ---------- */
#sa-anchor-ready-to-strengthen-your-security-posture .sa-btn { min-width: 11.6875rem; padding: var(--sa-space-4) var(--sa-space-8); } /* 187x56, 16px T/B, 32px L/R padding */

/* ---------- PENETRATION TESTING: "Contact Us" button text spec (both instances) ---------- */
body.page-slug-penetration-testing .sa-btn { font-family: var(--sa-font-family); font-weight: var(--sa-fw-semibold); font-size: var(--sa-text-base); } /* Montserrat SemiBold 16px */

/* ---------- PENETRATION TESTING: "Ready to strengthen your security posture?" section exact dimensions ---------- */
#sa-anchor-ready-to-strengthen-your-security-posture { min-height: 18rem; padding-block: var(--sa-space-20); padding-inline: var(--sa-space-12); } /* 288px, 80px T/B, 48px L/R */
#sa-anchor-ready-to-strengthen-your-security-posture .sa-cta-banner__heading { max-width: 66rem; min-height: 4.5rem; margin-inline: auto; padding-bottom: var(--sa-space-8); font-weight: var(--sa-fw-bold); } /* 1056x72 text box, 32px bottom padding, Bold */

/* ---------- FUNCTIONAL SAFETY: hero ---------- */
body.page-slug-functional-safety .sa-hero__heading { font-weight: var(--sa-fw-bold); } /* Bold 60px - size already matches the shared full_navy+default 60px */
body.page-slug-functional-safety .sa-hero__media { min-height: 31.25rem; } /* 500px (503.6 width already matches shared 2-col hero layout) */
body.page-slug-functional-safety .sa-hero__content .sa-btn { font-family: var(--sa-font-family); font-weight: var(--sa-fw-semibold); font-size: var(--sa-text-base); padding: var(--sa-space-4) var(--sa-space-8); align-self: flex-start; } /* SemiBold 16px, 16px T/B / 32px L/R padding */

/* ---------- FUNCTIONAL SAFETY: "End-to-End Functional Safety Support" ---------- */
#sa-anchor-end-to-end-functional-safety-support { min-height: 18.8125rem; padding-block: var(--sa-space-8); padding-inline: var(--sa-space-12); } /* 301px total, 32px T/B, 48px L/R */
#sa-anchor-end-to-end-functional-safety-support::before { height: 9.155rem; } /* 146.48px = 32px section top-padding + 114.48px Figma blue content band — ::before starts at position:0 so must include padding offset */
#sa-anchor-end-to-end-functional-safety-support .sa-section__heading { max-width: 65.9375rem; min-height: 2.5rem; margin-inline: auto; margin-bottom: 0; font-weight: var(--sa-fw-semibold); } /* margin-bottom:0 overrides base 20px — without this, cards start 9px BELOW the blue band (no overlap); with 0, cards start 42px inside the blue band */
#sa-anchor-end-to-end-functional-safety-support .sa-process-steps__row { max-width: 65.95rem; min-height: 12.3125rem; margin-inline: auto; padding-top: var(--sa-space-8); gap: var(--sa-space-3); } /* 1055.2x197, 32px internal top gap — row padding provides visual space between heading and card tops */
#sa-anchor-end-to-end-functional-safety-support .sa-process-steps__arrow { width: 2.5rem; font-size: 1.5rem; text-align: center; flex-shrink: 0; } /* 40x24 — centered in the 64px gap between cards */
#sa-anchor-end-to-end-functional-safety-support .sa-process-steps__step { width: 9.990625rem; height: 10.3125rem; padding: var(--sa-space-3); box-sizing: border-box; } /* 159.85x165 exactly */
#sa-anchor-end-to-end-functional-safety-support .sa-process-steps__icon { width: 4rem; height: 4rem; margin-bottom: var(--sa-space-4); } /* 64px orange container + 16px bottom gap = 80px total */
#sa-anchor-end-to-end-functional-safety-support .sa-process-steps__icon img { width: 1.667rem; height: 1.667rem; } /* 26.67x26.67px — Figma icon size inside the 64px orange square */
#sa-anchor-end-to-end-functional-safety-support .sa-process-steps__title { font-size: 0.875rem; font-weight: var(--sa-fw-semibold); text-transform: uppercase; } /* SemiBold 14px, all caps */

/* ---------- FUNCTIONAL SAFETY: "Our Services" ----------
   Scoped by BOTH page-slug and anchor id, since "Our Services" is reused
   as a heading on Homepage and Cybersecurity too - anchor id alone would
   leak this page's specific sizing onto those. */
body.page-slug-functional-safety #sa-anchor-our-services .sa-section__subheading { text-transform: uppercase; } /* size/weight already match the shared 20px Regular default */
body.page-slug-functional-safety #sa-anchor-our-services .sa-icon-card-grid__grid { grid-template-columns: repeat(3, 20.65rem); gap: var(--sa-space-8); max-width: 65.95rem; margin: var(--sa-space-16) auto 0; } /* 3x330.4 + 2x32 gap = 1055.2 total, 64px top margin only */
body.page-slug-functional-safety #sa-anchor-our-services .sa-icon-card-inline { width: 20.65rem; height: 7rem; padding: var(--sa-space-6) var(--sa-space-5); box-sizing: border-box; } /* 330.4x112 exactly */
body.page-slug-functional-safety #sa-anchor-our-services .sa-icon-card-inline__title { font-size: 1.125rem; font-weight: var(--sa-fw-semibold); } /* SemiBold 18px */

/* ---------- QUALITY ENGINEERING: hero ---------- */
body.page-slug-quality-engineering .sa-hero__heading { font-size: 3.0625rem; font-weight: var(--sa-fw-bold); } /* Bold 49px */
body.page-slug-quality-engineering .sa-hero__subtext { font-weight: var(--sa-fw-normal); } /* Regular 20px - size already matches shared default */
body.page-slug-quality-engineering .sa-hero__content .sa-btn { font-family: var(--sa-font-family); font-weight: var(--sa-fw-semibold); font-size: var(--sa-text-base); min-width: 16.6875rem; min-height: 3.5rem; padding: var(--sa-space-4) var(--sa-space-8); align-self: flex-start; } /* SemiBold 16px, 267x56, 16px T/B / 32px L/R padding */

/* ---------- QUALITY ENGINEERING: "Our Quality Engineering Services" - refine to exact spec ---------- */
body.page-slug-quality-engineering #sa-anchor-our-quality-engineering-services { padding-block: var(--sa-space-20); }
body.page-slug-quality-engineering #sa-anchor-our-quality-engineering-services .sa-section__subheading { text-transform: uppercase; } /* size/weight already match the shared 20px Regular default */
body.page-slug-quality-engineering #sa-anchor-our-quality-engineering-services .sa-icon-card-grid__grid { max-width: 65.95rem; min-height: 20rem; margin-inline: auto; padding-top: var(--sa-space-16); } /* 1055.2x320 total, 64px top padding included within it (border-box is global) */
body.page-slug-quality-engineering #sa-anchor-our-quality-engineering-services .sa-icon-card-inline { width: 20.48rem; min-height: 7rem; padding: var(--sa-space-6); box-sizing: border-box; } /* 327.73x112, 24px padding all around */
body.page-slug-quality-engineering #sa-anchor-our-quality-engineering-services .sa-icon-card-inline__title { font-size: 1.125rem; font-weight: var(--sa-fw-semibold); } /* SemiBold 18px */

/* ---------- QUALITY ENGINEERING: "Why Our Approach Works" - correct padding to all sides, on the section itself ---------- */
#sa-anchor-why-our-approach-works { min-height: 27.09375rem; box-sizing: border-box; padding: var(--sa-space-12); } /* 433.5px total, 48px padding all around, border-box so padding doesn't add on top */
#sa-anchor-why-our-approach-works .sa-container { max-width: 65.9375rem; padding-inline: 0; } /* 1055.2 wide - padding now lives on the section, not duplicated here */
body.page-slug-quality-engineering #sa-anchor-why-our-approach-works .sa-section__heading { margin-bottom: var(--sa-space-8); } /* 32px gap between heading and text card — overrides base 20px */

/* ---------- QUALITY ENGINEERING: closing CTA exact spec ---------- */
#sa-anchor-lets-turn-your-processes-into-measurable-engineering-excellence .sa-cta-banner__heading { font-weight: var(--sa-fw-bold); } /* Bold 36px - size already matches shared default */
#sa-anchor-lets-turn-your-processes-into-measurable-engineering-excellence .sa-cta-banner__subtext { font-size: var(--sa-text-xl); font-weight: var(--sa-fw-normal); } /* Regular 20px */
#sa-anchor-lets-turn-your-processes-into-measurable-engineering-excellence .sa-btn { min-width: 15rem; min-height: 4.25rem; padding: var(--sa-space-5) var(--sa-space-10); font-weight: var(--sa-fw-bold); font-size: 1.125rem; } /* 240x68 (revised from 86), 20px T/B / 40px L/R padding, Bold 18px text */

/* ---------- QUALITY ENGINEERING: 5 service detail sections (Gap Analysis, Process Definition, Process Management, Quality Recovery, Assessment Support) ---------- */
body.page-slug-quality-engineering #sa-anchor-gap-analysis,
body.page-slug-quality-engineering #sa-anchor-process-definition,
body.page-slug-quality-engineering #sa-anchor-process-management,
body.page-slug-quality-engineering #sa-anchor-quality-recovery,
body.page-slug-quality-engineering #sa-anchor-assessment-support {
  min-height: 33.60625rem; /* 537.7px */
  padding-block: var(--sa-space-20); /* 80px T/B */
}
body.page-slug-quality-engineering #sa-anchor-gap-analysis .sa-image-text-block__media img,
body.page-slug-quality-engineering #sa-anchor-process-definition .sa-image-text-block__media img,
body.page-slug-quality-engineering #sa-anchor-process-management .sa-image-text-block__media img,
body.page-slug-quality-engineering #sa-anchor-quality-recovery .sa-image-text-block__media img,
body.page-slug-quality-engineering #sa-anchor-assessment-support .sa-image-text-block__media img {
  width: 31.475rem; height: 23.60625rem; /* 503.6x377.7 */
}
body.page-slug-quality-engineering #sa-anchor-gap-analysis .sa-image-text-block__text,
body.page-slug-quality-engineering #sa-anchor-process-definition .sa-image-text-block__text,
body.page-slug-quality-engineering #sa-anchor-process-management .sa-image-text-block__text,
body.page-slug-quality-engineering #sa-anchor-quality-recovery .sa-image-text-block__text,
body.page-slug-quality-engineering #sa-anchor-assessment-support .sa-image-text-block__text {
  font-size: var(--sa-text-xl); font-weight: var(--sa-fw-normal); /* Regular 20px, was 18px */
}
body.page-slug-quality-engineering #sa-anchor-gap-analysis .sa-image-text-block__heading,
body.page-slug-quality-engineering #sa-anchor-process-definition .sa-image-text-block__heading,
body.page-slug-quality-engineering #sa-anchor-process-management .sa-image-text-block__heading,
body.page-slug-quality-engineering #sa-anchor-quality-recovery .sa-image-text-block__heading,
body.page-slug-quality-engineering #sa-anchor-assessment-support .sa-image-text-block__heading { margin-bottom: var(--sa-space-4); } /* 16px heading→tagline gap — base is 20px */
body.page-slug-quality-engineering #sa-anchor-gap-analysis .sa-image-text-block__tagline,
body.page-slug-quality-engineering #sa-anchor-process-definition .sa-image-text-block__tagline,
body.page-slug-quality-engineering #sa-anchor-process-management .sa-image-text-block__tagline,
body.page-slug-quality-engineering #sa-anchor-quality-recovery .sa-image-text-block__tagline,
body.page-slug-quality-engineering #sa-anchor-assessment-support .sa-image-text-block__tagline { margin-bottom: var(--sa-space-6); } /* 24px tagline→paragraph gap — base is 8px */

/* ========== NEWSROOM OVERVIEW PAGE ========== */

/* ---------- Hero ---------- */
body.page-slug-newsroom .sa-hero { min-height: 20.71875rem; } /* 331.5px total */
body.page-slug-newsroom .sa-hero .sa-hero__heading { margin-bottom: var(--sa-space-8); } /* 32px gap between "Newsroom" title and subtitle — overrides base 20px */
body.page-slug-newsroom .sa-hero .sa-hero__subtext { max-width: 62.5625rem; } /* 1001px Hug — overrides base 40rem (640px) that was forcing subtitle to wrap */
/* Title (Medium 60), Subtitle (Regular 20), and left-alignment already match the shared gradient_simple+default hero defaults - no override needed */

/* ---------- Intro paragraph ---------- */
body.page-slug-newsroom .sa-rich-text--normal { min-height: 14.125rem; padding-block: var(--sa-space-16); display: flex; align-items: flex-start; } /* 226px, 64px T/B padding, top-aligned */
/* Text is already Regular 20px via the shared .sa-rich-text--normal default */

/* ---------- Blogs section ---------- */
body.page-slug-newsroom #sa-anchor-blogs { min-height: 59.324rem; padding-block: var(--sa-space-20); padding-inline: var(--sa-space-12); box-sizing: border-box; } /* 949.19px, 80px T/B, 48px L/R */
body.page-slug-newsroom #sa-anchor-blogs .sa-post-grid__header-text { max-width: 65.95rem; min-height: 6.45rem; } /* 1055.2x103.2 title container */
/* Title already SemiBold 36 via shared default; subtitle already Regular 18 via shared default */
body.page-slug-newsroom #sa-anchor-blogs .sa-post-grid__category-select { min-width: 11.7rem; min-height: 3.2rem; padding: var(--sa-space-3) var(--sa-space-6); text-align: left; font-weight: var(--sa-fw-medium); font-size: var(--sa-text-base); border: 2px solid var(--sa-blue); } /* All Categories: 187.2x51.2, 12/24 padding, Medium 16, blue border */
body.page-slug-newsroom #sa-anchor-blogs .sa-btn { min-width: 13.0625rem; min-height: 3.5rem; padding: var(--sa-space-4) var(--sa-space-8); text-align: left; font-weight: var(--sa-fw-normal); font-size: var(--sa-text-base); } /* View All Blogs: 209x56, 16/32 padding, Regular 16 */

/* ---------- Press Releases section ---------- */
body.page-slug-newsroom #sa-anchor-press-releases { min-height: 59.524rem; padding-block: var(--sa-space-20); padding-inline: var(--sa-space-12); box-sizing: border-box; } /* 952.39px, 80px T/B, 48px L/R */
body.page-slug-newsroom #sa-anchor-press-releases .sa-post-grid__header-text { max-width: 65.95rem; min-height: 6.45rem; } /* 1055.2x103.2 title container */
body.page-slug-newsroom #sa-anchor-press-releases .sa-post-grid__category-select { min-width: 9.2rem; min-height: 3.2rem; padding: var(--sa-space-3) var(--sa-space-6); text-align: left; font-weight: var(--sa-fw-medium); font-size: var(--sa-text-base); border: 2px solid var(--sa-blue); } /* All Types: 147.2x51.2, 12/24 padding, Medium 16, blue border */
body.page-slug-newsroom #sa-anchor-press-releases .sa-btn { min-width: 17.5rem; min-height: 3.5rem; padding: var(--sa-space-4) var(--sa-space-8); text-align: left; font-weight: var(--sa-fw-normal); font-size: var(--sa-text-base); } /* View All Press Releases: 280x56, 16/32 padding, Regular 16 */

/* ---------- "Discover Content" search box ---------- */
body.page-slug-newsroom .sa-filter-bar--full { min-height: 42.5rem; padding-block: var(--sa-space-20); box-sizing: border-box; display: flex; align-items: center; } /* 680px, 80px T/B */
body.page-slug-newsroom .sa-filter-bar--full .sa-filter-bar__card { width: 50rem; max-width: 50rem; min-height: 32.5rem; padding: var(--sa-space-8); box-sizing: border-box; } /* 800x520, 32px padding all around (revised from 896x520/48px) */
body.page-slug-newsroom .sa-filter-bar--full .sa-filter-bar__heading { max-width: 46rem; min-height: 2.25rem; margin-inline: auto; } /* Title row: 736x36 */
body.page-slug-newsroom .sa-filter-bar--full .sa-filter-bar__subtext { max-width: 46rem; min-height: 2.75rem; margin: 0 auto; padding-top: var(--sa-space-4); box-sizing: border-box; } /* Subtitle row: 736x44, 16px top padding */
body.page-slug-newsroom .sa-filter-bar--full .sa-filter-bar__columns { max-width: 46rem; min-height: 13rem; margin: 0 auto; padding-top: var(--sa-space-8); box-sizing: border-box; } /* Topics Grid: 736x208, 32px top padding */
body.page-slug-newsroom .sa-filter-bar--full .sa-filter-bar__apply { margin-top: var(--sa-space-8); } /* 32px gap above the button, separating it from the last topic - button's own size (set separately) is untouched here */
body.page-slug-newsroom .sa-filter-bar--full .sa-filter-bar__heading { font-size: var(--sa-text-3xl); font-weight: var(--sa-fw-semibold); } /* SemiBold 30px */
body.page-slug-newsroom .sa-filter-bar--full .sa-filter-bar__subtext { font-size: var(--sa-text-lg); font-weight: var(--sa-fw-normal); } /* Regular 18px */
body.page-slug-newsroom .sa-filter-bar__apply { min-width: 12.6875rem; min-height: 3.5rem; padding: var(--sa-space-4) var(--sa-space-10); font-weight: var(--sa-fw-medium); font-size: var(--sa-text-base); } /* ~203x56 (spec said "2013" wide - treating as a typo, this is my best estimate; flag if you meant something else), 16/40 padding, Medium 16 */

/* ========== BLOGS PAGE ========== */

/* ---------- Hero ---------- */
body.page-slug-blogs .sa-hero { min-height: 18rem; } /* 288px total, 80px padding already matches the shared uppercase-heading-style default */
body.page-slug-press-releases .sa-hero { min-height: 18rem; } /* 288px - matches Blogs, was previously missing an explicit height entirely */

/* ---------- Search Bar ---------- */
body.page-slug-blogs .sa-filter-bar--simple { min-height: 16.6rem; padding-inline: var(--sa-space-12); box-sizing: border-box; } /* 265.6px (revised from 361.6), 48px L/R padding only */
body.page-slug-blogs .sa-filter-bar--simple .sa-filter-bar__search { max-width: 61.95rem; } /* 991.2px wide */
body.page-slug-blogs .sa-filter-bar--simple .sa-filter-bar__checklist--row { gap: 5.625rem; } /* 90px horizontal gap between topic pills */
body.page-slug-blogs .sa-filter-bar--simple .sa-filter-bar__column--full-width { max-width: 61.95rem; min-height: 6.4rem; padding-top: var(--sa-space-8); box-sizing: border-box; } /* Topic Frame: 991.2x102.4, 32px top padding */
/* "Topics" label (SemiBold 18) and individual topic pills (Medium 16) already match the shared defaults */

/* ========== NEWSROOM / BLOGS / PRESS RELEASES: strip all component-level margins ==========
   These pages were given padding-only specs (no margins at any section). The
   shared components (hero heading, section heading, subheadings, filter bar
   text) carry their own default margins for general sitewide use, which were
   adding extra space on top of the specified padding on these three pages.
   Zeroing them out here so padding is the only spacing mechanism, exactly as
   specified - without touching the shared defaults other (non-frozen) pages
   still rely on. */
body.page-slug-newsroom .sa-hero__heading,
body.page-slug-blogs .sa-hero__heading,
body.page-slug-press-releases .sa-hero__heading,
body.page-slug-newsroom .sa-hero__subtext,
body.page-slug-blogs .sa-hero__subtext,
body.page-slug-press-releases .sa-hero__subtext,
body.page-slug-newsroom .sa-section__heading,
body.page-slug-blogs .sa-section__heading,
body.page-slug-press-releases .sa-section__heading,
body.page-slug-newsroom .sa-post-grid__subheading,
body.page-slug-blogs .sa-post-grid__subheading,
body.page-slug-press-releases .sa-post-grid__subheading,
body.page-slug-newsroom .sa-post-grid__count,
body.page-slug-blogs .sa-post-grid__count,
body.page-slug-press-releases .sa-post-grid__count,
body.page-slug-newsroom .sa-filter-bar__subtext,
body.page-slug-blogs .sa-filter-bar__subtext,
body.page-slug-press-releases .sa-filter-bar__subtext,
body.page-slug-newsroom .sa-filter-bar__heading,
body.page-slug-blogs .sa-filter-bar__heading,
body.page-slug-press-releases .sa-filter-bar__heading,
body.page-slug-newsroom .sa-rich-text__inner,
body.page-slug-newsroom .sa-cta-banner__heading,
body.page-slug-blogs .sa-cta-banner__heading,
body.page-slug-press-releases .sa-cta-banner__heading {
  margin: 0;
}

/* ---------- INDUSTRIES OVERVIEW PAGE ---------- */
body.page-slug-industries .sa-image-text-block { min-height: 35rem; padding-top: var(--sa-space-20); padding-bottom: 0; padding-inline: var(--sa-space-12); box-sizing: border-box; } /* 560px, 80px top padding only, 48px L/R */
body.page-slug-industries .sa-image-text-block__inner { gap: var(--sa-space-12); align-items: center; } /* 48px gap; text column vertically centered against the image */
body.page-slug-industries .sa-image-text-block__text { max-width: 37.725rem; min-height: 2.5rem; text-align: left; } /* Paragraph box: 603.6x40, left-aligned text */
body.page-slug-industries .sa-image-text-block__media { width: 31.475rem; max-width: 100%; } /* matches the image's own width so the badge's positioning container doesn't expand past the grid column */
body.page-slug-industries .sa-image-text-block__media img { width: 100%; max-width: none; height: 25rem; object-fit: cover; } /* 503.6x400 - width:100% of the now-correctly-sized container above */
/* Title (SemiBold 36), paragraph (Regular 18), and "Learn More" link (SemiBold 16) already match the shared defaults */

/* ---------- AUTOMOTIVE PAGE ---------- */
body.page-slug-automotive .sa-hero__media { min-height: 31.25rem; } /* 500px (504 width already matches shared 2-col hero layout) */
body.page-slug-automotive-2 .sa-hero__heading,
body.page-slug-automotive .sa-hero__heading { font-size: 3.375rem; font-weight: var(--sa-fw-bold); } /* Bold 54px — both slugs covered */
body.page-slug-automotive-2 .sa-hero__subtext,
body.page-slug-automotive .sa-hero__subtext { font-size: var(--sa-text-lg); font-weight: var(--sa-fw-normal); } /* Regular 18px */

/* "Ready to accelerate your next automotive project?" CTA */
#sa-anchor-ready-to-accelerate-your-next-automotive-project .sa-cta-banner__heading { font-weight: var(--sa-fw-semibold); } /* SemiBold - size already matches the shared "large" 48px modifier */
#sa-anchor-ready-to-accelerate-your-next-automotive-project .sa-cta-banner__subtext { font-size: var(--sa-text-xl); font-weight: var(--sa-fw-normal); } /* Regular 20px */
#sa-anchor-ready-to-accelerate-your-next-automotive-project .sa-btn { min-width: 16.875rem; min-height: 4.25rem; padding: var(--sa-space-5) var(--sa-space-12); font-weight: var(--sa-fw-semibold); font-size: 1.125rem; gap: var(--sa-space-2); } /* 270x68, 20px T/B / 48px L/R padding, SemiBold 18px text */
#sa-anchor-ready-to-accelerate-your-next-automotive-project .sa-btn .sa-icon { width: 1.5rem; height: 1.5rem; } /* both mail and arrow icons: 24x24 */

/* ========== MEDICAL PAGE ========== */

/* ---------- Hero ---------- */
body.page-slug-medical-2 .sa-hero__heading,
body.page-slug-medical .sa-hero__heading { font-size: 3.75rem; font-weight: var(--sa-fw-bold); } /* "From Idea to Market": Bold 60px */
body.page-slug-medical-2 .sa-hero__subtext,
body.page-slug-medical .sa-hero__subtext { margin-top: var(--sa-space-6); } /* 24px space from the title */
body.page-slug-medical-2 .sa-hero__content,
body.page-slug-medical .sa-hero__content { display: flex; flex-direction: column; justify-content: center; align-self: center; } /* vertically centers itself within the taller image column */
body.page-slug-medical-2 .sa-hero__content,
body.page-slug-medical .sa-hero__content { width: 31.4375rem; height: 23.34375rem; } /* Text box: 503x373.5 - supersedes the earlier incorrect per-element width */
body.page-slug-medical-2 .sa-hero__media img,
body.page-slug-medical .sa-hero__media img { width: 31.475rem; } /* 503.6 wide (500px height already set above) */
/* Kicker (Medium 36) and subtext (Regular 20) already match the shared defaults */

/* ---------- Domains intro subheading ---------- */
#sa-anchor-our-engineering-capabilities-cover-the-following-domains .sa-section__subheading { font-weight: var(--sa-fw-semibold); font-size: 1.25rem; } /* SemiBold 20px */

/* ---------- "Our Medical Engineering Services" ---------- */
#sa-anchor-our-medical-engineering-services { min-height: 24.3125rem; padding: var(--sa-space-8) var(--sa-space-12); box-sizing: border-box; display: flex; flex-direction: column; } /* 389px total, 32px T/B, 48px L/R */
#sa-anchor-our-medical-engineering-services::before { height: 9.725rem; } /* blue band: 155.6px, overriding the shared 140px default (scoped to Medical only) */
#sa-anchor-our-medical-engineering-services .sa-container { text-align: center; display: flex; flex-direction: column; height: 100%; }
#sa-anchor-our-medical-engineering-services .sa-section__heading { max-width: 65.9375rem; min-height: 2.5rem; margin: 0 auto; text-align: center !important; } /* Title container: 1055.2x40 */
#sa-anchor-our-medical-engineering-services .sa-process-steps__row { max-width: 65.9375rem; min-height: 12.3125rem; margin: 0 auto; padding-top: var(--sa-space-8); box-sizing: border-box; align-items: center; } /* Cards block: 1055.2x197, includes its own 32px top gap before the 165px card row */
#sa-anchor-our-medical-engineering-services .sa-process-steps__step { width: 10.3125rem; height: 10.3125rem; } /* 165x165 */
#sa-anchor-our-medical-engineering-services .sa-process-steps__arrow { width: 2.5rem; padding-inline: var(--sa-space-2); font-size: 1.5rem; line-height: 1; display: inline-flex; align-items: center; justify-content: center; } /* 40 Hug x 24, 8px L/R padding, sized to approximate a 24px icon */
#sa-anchor-our-medical-engineering-services .sa-process-steps__cta { margin-top: var(--sa-space-8); } /* 32px gap before the button */
#sa-anchor-our-medical-engineering-services .sa-process-steps__cta .sa-btn { min-width: 25.0625rem; min-height: 3.5rem; padding: var(--sa-space-4) var(--sa-space-8); font-weight: var(--sa-fw-medium); font-size: var(--sa-text-base); gap: var(--sa-space-3); } /* 401x56, 16/32 padding, Medium 16px text, 12px icon gap */
#sa-anchor-our-medical-engineering-services .sa-process-steps__cta .sa-icon { width: 1.25rem; height: 1.25rem; } /* button arrow: 20x20 */

/* ---------- Domain detail sections: tagline box + paragraph ---------- */
#sa-anchor-rapid-prototyping .sa-image-text-block__tagline,
#sa-anchor-development .sa-image-text-block__tagline,
#sa-anchor-continuous-quality .sa-image-text-block__tagline {
  width: 15.75rem; min-height: 2rem; box-sizing: border-box; /* 252x32 */
}
#sa-anchor-manufacturing .sa-image-text-block__tagline {
  width: 31.1625rem; min-height: 5rem; padding-top: var(--sa-space-4); box-sizing: border-box; font-size: var(--sa-text-2xl); font-weight: var(--sa-fw-semibold);
} /* 498.6x80, 16px top padding to space it from the section title, SemiBold 24px */
#sa-anchor-rapid-prototyping .sa-image-text-block__text,
#sa-anchor-development .sa-image-text-block__text,
#sa-anchor-continuous-quality .sa-image-text-block__text,
#sa-anchor-manufacturing .sa-image-text-block__text {
  font-size: var(--sa-text-xl); font-weight: var(--sa-fw-normal); /* Regular 20px, was 18px */
}
/* Title (SemiBold 36) already matches the shared default */

/* ---------- Closing CTA "Turn Your Idea into a Product" ---------- */
#sa-anchor-turn-your-idea-into-a-product .sa-cta-banner__heading { font-weight: var(--sa-fw-semibold); margin-bottom: var(--sa-space-8); } /* SemiBold - size already matches the shared "large" 48px modifier; 32px gap to subtitle */
#sa-anchor-turn-your-idea-into-a-product .sa-cta-banner__subtext { font-size: var(--sa-text-xl); font-weight: var(--sa-fw-normal); } /* Regular 20px */
#sa-anchor-turn-your-idea-into-a-product .sa-btn { font-weight: var(--sa-fw-semibold); font-size: 1.125rem; } /* SemiBold 18px text - size/padding already match from earlier work */
#sa-anchor-turn-your-idea-into-a-product .sa-btn .sa-icon { width: 1.5rem; height: 1.5rem; } /* mail + arrow icons: 24x24, matching Automotive's style */

/* ========== FIXED HERO HEIGHTS (per-page, replacing viewport-fill behavior) ==========
   Client decision: instead of every hero filling the screen (which looked
   wrong on very large monitors), each page now gets its own fixed height
   matching Figma exactly. Short-content pages (Contact Us, Newsroom, Blogs,
   Press Releases) are untouched per client instruction - they keep their
   existing fixed heights from earlier work.
   Each page is scoped to both its real slug and a "-2" variant as a safety
   net, since we discovered Medical's live page slug was silently "medical-2"
   due to a duplicate-page collision - applying this defensively to all 11
   pages here costs nothing if unused, but avoids repeating that same
   multi-round debugging session if any other page has the same hidden issue. */
body.page-slug-homepage-2 .sa-hero,
body.page-slug-homepage .sa-hero { min-height: 33.5rem; } /* 536px */
body.page-slug-about-us-2 .sa-hero,
body.page-slug-about-us .sa-hero { min-height: 33.03125rem; } /* 528.5px */
body.page-slug-about-us-2 .sa-hero .sa-hero__heading,
body.page-slug-about-us .sa-hero .sa-hero__heading { font-weight: var(--sa-fw-medium); } /* Medium — overrides base Bold */
#sa-anchor-our-core-values .sa-section__subheading { margin-bottom: var(--sa-space-16); } /* 64px gap between subheading text and cards grid — base has no explicit margin-bottom */

/* ---------- ABOUT US: "The Journey of Excellence" — timeline image sizing ---------- */
#sa-anchor-the-journey-of-excellence .sa-timeline__image-slot { height: 4rem; display: flex; align-items: center; justify-content: center; margin-top: var(--sa-space-2); } /* fixed-height slot renders on ALL items — cards align at same Y regardless of image presence */
#sa-anchor-the-journey-of-excellence .sa-timeline__image { max-width: 9rem; max-height: 4rem; margin: 0; } /* 144x64 — slot handles vertical positioning; width/height:auto (base) keeps aspect ratio intact */
#sa-anchor-the-journey-of-excellence .sa-timeline__item--navy .sa-timeline__card { border-top: 3px solid var(--sa-navy); }
#sa-anchor-the-journey-of-excellence .sa-timeline__item--blue .sa-timeline__card { border-top: 3px solid var(--sa-blue); }
#sa-anchor-the-journey-of-excellence .sa-timeline__item--orange .sa-timeline__card { border-top: 3px solid var(--sa-accent); } /* colored top border matches the year circle color per item */
body.page-slug-services-2 .sa-hero,
body.page-slug-services .sa-hero { min-height: 37.25rem; } /* 596px */
body.page-slug-cybersecurity-2 .sa-hero,
body.page-slug-cybersecurity .sa-hero { min-height: 41.25rem; } /* 660px */
body.page-slug-cybersecurity-2 .sa-hero .sa-btn,
body.page-slug-cybersecurity .sa-hero .sa-btn { min-width: 11.5625rem; min-height: 3.5rem; padding: var(--sa-space-4) var(--sa-space-8); font-size: var(--sa-text-base); font-weight: var(--sa-fw-semibold); gap: var(--sa-space-3); } /* 185x56, 16/32 padding, SemiBold 16px, 12px gap */
body.page-slug-cybersecurity-2 .sa-hero .sa-btn .sa-icon,
body.page-slug-cybersecurity .sa-hero .sa-btn .sa-icon { width: 1.25rem; height: 1.25rem; } /* arrow: 20x20 */
body.page-slug-cybersecurity-2 #sa-anchor-explore-our-latest-news .sa-post-grid__grid,
body.page-slug-cybersecurity #sa-anchor-explore-our-latest-news .sa-post-grid__grid { grid-template-columns: repeat(auto-fit, minmax(300px, 380px)); justify-content: center; } /* auto-fit centers cards regardless of count — 3 articles = 3 columns, 2 articles = 2 centered, never left-aligned with empty slot */
body.page-slug-cra-2 .sa-hero,
body.page-slug-cra .sa-hero { min-height: 32.875rem; } /* 526px */
body.page-slug-penetration-testing-2 .sa-hero,
body.page-slug-penetration-testing .sa-hero { min-height: 41.25rem; } /* 660px */
body.page-slug-industries-2 .sa-hero,
body.page-slug-industries .sa-hero { min-height: 39.90625rem; } /* 638.5px */
body.page-slug-medical-2 .sa-hero,
body.page-slug-medical .sa-hero { min-height: 41.25rem; } /* 660px */
body.page-slug-automotive-2 .sa-hero,
body.page-slug-automotive .sa-hero { min-height: 48.484375rem; } /* 775.75px */
body.page-slug-functional-safety-2 .sa-hero,
body.page-slug-functional-safety .sa-hero { min-height: 44.78125rem; } /* 716.5px */
body.page-slug-quality-engineering-2 .sa-hero,
body.page-slug-quality-engineering .sa-hero { min-height: 46.1325rem; } /* 738.12px */

/* ---------- PENETRATION TESTING: "Security Through Collaboration" - full section rebuild ---------- */
#sa-anchor-security-through-collaboration { min-height: 44.37375rem; padding-block: var(--sa-space-20); padding-inline: 0; box-sizing: border-box; } /* 709.98px tall, 80px T/B — .sa-container already supplies 48px L/R */
#sa-anchor-security-through-collaboration .sa-section__heading { font-weight: var(--sa-fw-bold); } /* Bold 36px - size already matches the shared default */
#sa-anchor-security-through-collaboration .sa-image-text-block__inner { width: 100%; min-height: 31.87375rem; margin-top: var(--sa-space-16); box-sizing: border-box; grid-template-columns: 23fr 21fr; } /* 64px external gap between heading and card; 23:21 ratio fills any container width edge-to-edge */
#sa-anchor-security-through-collaboration .sa-image-text-block__content,
#sa-anchor-security-through-collaboration .sa-image-text-block__media { min-width: 0; } /* prevent CSS Grid's implicit min-width:auto from overriding column tracks */
#sa-anchor-security-through-collaboration .sa-image-text-block__content { width: 100%; box-sizing: border-box; } /* inherits base --card padding (48px all sides) — no override needed */
#sa-anchor-security-through-collaboration .sa-image-text-block__heading { font-size: 1.5rem; font-weight: var(--sa-fw-bold); margin-top: var(--sa-space-6); margin-bottom: 0; text-transform: none; letter-spacing: normal; color: #000000; } /* Bold 24px, black, 24px gap from logos */
#sa-anchor-security-through-collaboration .sa-image-text-block__text { font-size: var(--sa-text-base); font-weight: var(--sa-fw-normal); margin-top: var(--sa-space-4); } /* Regular 16px, 16px gap from heading */
#sa-anchor-security-through-collaboration .sa-image-text-block__media { width: 100%; max-width: none; border-radius: 0; } /* border-radius:0 overrides base __media rounded corners — image flush with card right/top/bottom edges */
#sa-anchor-security-through-collaboration .sa-image-text-block__media img { width: 100%; max-width: none; height: 100%; object-fit: cover; display: block; } /* fills __media container completely — flush top/right/bottom with card frame */

/* ---------- HOMEPAGE: "Partnerships" icons ----------
   Scoped to this section's own anchor id, not the shared .sa-logo-grid--static
   class, since "Certifications & Standards" (also on Homepage) uses the same
   style and must stay untouched. */
#sa-anchor-partnerships .sa-logo-grid__row { gap: var(--sa-space-6); } /* 24px gap between icons */
#sa-anchor-partnerships .sa-logo-grid__item { width: 8.125rem; height: 6.25rem; padding: 0.375rem; box-sizing: border-box; display: flex; align-items: center; justify-content: center; } /* 130x100 container (118x88 icon + 6px padding all around) */
#sa-anchor-partnerships .sa-logo-grid__item img { width: 7.375rem; height: 5.5rem; max-width: none; max-height: none; object-fit: contain; } /* pure icon size: 118x88 */