/*
  CloudPilot - enterprise SaaS (light)
  Accent #2563EB | Surfaces white on soft grey-blue | Footer dark navy
*/

:root {
  --color-bg: #f4f7fc;
  --color-bg-muted: #eef2f8;
  --color-surface: #ffffff;
  --color-text: #0f172a;
  --color-text-muted: #64748b;
  --color-accent: #2563eb;
  --color-accent-hover: #1d4ed8;
  --color-accent-subtle: rgba(37, 99, 235, 0.08);
  --color-accent-ring: rgba(37, 99, 235, 0.2);
  --color-border: #e2e8f0;
  --color-footer-bg: #0b1220;
  --color-footer-text: #94a3b8;
  --color-footer-heading: #f1f5f9;
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-card: 0 4px 6px -1px rgba(15, 23, 42, 0.06),
    0 10px 25px -5px rgba(15, 23, 42, 0.08);
  --shadow-card-hover: 0 12px 32px -8px rgba(15, 23, 42, 0.12),
    0 4px 12px -2px rgba(37, 99, 235, 0.08);
  --shadow-browser: 0 24px 48px -12px rgba(15, 23, 42, 0.18),
    0 0 0 1px rgba(15, 23, 42, 0.06);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, sans-serif;
  --container: 1160px;
  --header-height: 72px;
  /* Notch / home indicator (iOS); used with viewport-fit=cover if added to meta */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --header-total-height: calc(var(--header-height) + var(--safe-top));
  --space-xs: 0.375rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 2.75rem;
  --space-3xl: 4rem;
  --space-4xl: 5.5rem;
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  /* Page intro / hero alignment (top-level + inner pages) */
  --page-intro-pt: clamp(2.5rem, 4.25vw, var(--space-4xl));
  --page-intro-pb: var(--space-2xl);
  --page-intro-measure: 38rem;
  --page-intro-lead-max: 36rem;
  --page-intro-support-max: 34rem;
}

@media (max-width: 767px) {
  :root {
    --page-intro-pt: clamp(1.6rem, 5vw + 1rem, 2.5rem);
    --page-intro-pb: var(--space-xl);
  }
}

.page-intro,
.page-hero {
  padding-block: var(--page-intro-pt) var(--page-intro-pb);
  border-bottom: 1px solid var(--color-border);
  position: relative;
}

.page-intro__inner {
  max-width: var(--page-intro-measure);
}

.page-intro__copy {
  max-width: var(--page-intro-measure);
}

.page-intro .section-label {
  display: block;
  margin-bottom: var(--space-xs);
}

.page-intro__grid,
.hero__grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2xl);
  align-items: center;
}

.page-intro__grid > *,
.hero__grid > * {
  min-width: 0;
}

@media (min-width: 1024px) {
  .page-intro__grid,
  .hero__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
    gap: var(--space-3xl);
  }
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--color-text);
  background: var(--color-bg);
  background-image: linear-gradient(180deg, #f8fafc 0%, var(--color-bg) 35%, #e8eef7 100%);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  overflow-wrap: break-word;
}

img,
svg {
  display: block;
  max-width: 100%;
}

a {
  color: var(--color-accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}

a:hover {
  color: var(--color-accent-hover);
}

.container {
  width: 100%;
  max-width: var(--container);
  min-width: 0;
  margin-inline: auto;
  padding-inline: max(var(--space-md), var(--safe-left)) max(var(--space-md), var(--safe-right));
}

@media (min-width: 480px) {
  .container {
    padding-inline: max(var(--space-lg), var(--safe-left)) max(var(--space-lg), var(--safe-right));
  }
}

@media (min-width: 768px) {
  .container {
    padding-inline: max(var(--space-xl), var(--safe-left)) max(var(--space-xl), var(--safe-right));
  }
}

/* --- Header --- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  padding-top: var(--safe-top);
  height: var(--header-total-height);
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(226, 232, 240, 0.92);
  transition:
    box-shadow 0.24s var(--ease),
    background 0.24s var(--ease),
    border-color 0.24s var(--ease);
}

.site-header--scrolled {
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow:
    0 4px 28px -10px rgba(15, 23, 42, 0.1),
    0 1px 0 rgba(15, 23, 42, 0.04);
  border-bottom-color: rgba(226, 232, 240, 0.98);
}

.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--header-height);
  gap: clamp(1rem, 3vw, 2.25rem);
}

@media (min-width: 768px) {
  .site-header__inner {
    gap: clamp(1.35rem, 3.5vw, 2.75rem);
  }
}

.logo {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  flex-shrink: 0;
  color: var(--color-text);
  text-decoration: none;
  font-weight: 700;
  font-size: 1.0625rem;
  letter-spacing: -0.022em;
  line-height: 1.15;
}

.logo:hover {
  color: var(--color-text);
  text-decoration: none;
}

.logo:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 3px;
  border-radius: var(--radius-sm);
}

.logo span {
  white-space: nowrap;
  color: var(--color-text);
  padding-top: 0.06em;
}

.logo__img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  flex-shrink: 0;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.nav-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  color: var(--color-text);
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition: background 0.15s var(--ease), border-color 0.15s var(--ease), box-shadow 0.15s var(--ease);
}

.nav-toggle:hover {
  background: var(--color-bg-muted);
  border-color: #cbd5e1;
}

.nav-toggle:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.nav-toggle__bars {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 20px;
}

.nav-toggle__bars span {
  display: block;
  height: 2px;
  background: currentColor;
  border-radius: 1px;
  transition: transform 0.2s, opacity 0.2s;
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(2) {
  opacity: 0;
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
}

@media (min-width: 768px) {
  .nav-toggle {
    display: none;
  }
}

.nav {
  display: none;
  position: absolute;
  top: var(--header-total-height);
  left: 0;
  right: 0;
  flex-direction: column;
  gap: 0.25rem;
  padding: var(--space-md) max(var(--space-lg), var(--safe-left)) max(var(--space-xl), var(--safe-bottom));
  max-height: min(32rem, calc(100vh - var(--header-total-height) - var(--space-md)));
  max-height: min(32rem, calc(100dvh - var(--header-total-height) - var(--space-md)));
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  background: rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--color-border);
  box-shadow: 0 16px 40px -18px rgba(15, 23, 42, 0.15);
}

.nav--open {
  display: flex;
}

@media (min-width: 768px) {
  .nav {
    display: flex;
    position: static;
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: flex-end;
    flex: 1;
    min-width: 0;
    gap: 0.0625rem 0.28rem;
    padding: 0;
    max-height: none;
    overflow: visible;
    overscroll-behavior: auto;
    -webkit-overflow-scrolling: auto;
    background: transparent;
    border: none;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

.nav__link {
  display: block;
  padding: 0.5rem 0.65rem;
  color: #4a5f76;
  text-decoration: none;
  font-weight: 500;
  font-size: 0.9375rem;
  letter-spacing: -0.01em;
  line-height: 1.25;
  border-radius: 999px;
  transition:
    color 0.18s var(--ease),
    background 0.18s var(--ease),
    box-shadow 0.18s var(--ease);
}

@media (max-width: 767px) {
  .nav__link {
    padding: 0.65rem 0.85rem;
    border-radius: var(--radius-md);
    min-height: 2.75rem;
    display: flex;
    align-items: center;
  }
}

.nav__link:hover {
  background: rgba(37, 99, 235, 0.07);
  color: var(--color-text);
  text-decoration: none;
}

.nav__link[aria-current="page"] {
  font-weight: 600;
  color: var(--color-accent-hover);
  background: rgba(37, 99, 235, 0.1);
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.2);
}

.nav__link[aria-current="page"]:hover {
  background: rgba(37, 99, 235, 0.13);
  color: var(--color-accent-hover);
}

.nav__link:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.nav__dropdown-wrap {
  position: relative;
}

@media (max-width: 767px) {
  .nav__dropdown-wrap {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }
}

.nav__dropdown {
  list-style: none;
  margin: 0;
  padding: 0;
}

@media (min-width: 768px) {
  .nav__dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    min-width: 17.5rem;
    padding: var(--space-sm);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card-hover);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    pointer-events: none;
    transition: opacity 0.18s var(--ease), transform 0.18s var(--ease),
      visibility 0.18s var(--ease);
    z-index: 200;
  }

  .nav__dropdown::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    height: 12px;
  }

  .nav__dropdown-wrap:hover .nav__dropdown,
  .nav__dropdown-wrap:focus-within .nav__dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }
}

@media (max-width: 767px) {
  .nav__dropdown {
    padding: 0 0 var(--space-xs) var(--space-md);
    margin-top: -0.25rem;
  }
}

.nav__dropdown-link {
  display: flex;
  align-items: center;
  padding: var(--space-sm) var(--space-md);
  color: var(--color-text-muted);
  text-decoration: none;
  font-weight: 500;
  font-size: 0.875rem;
  border-radius: var(--radius-sm);
  transition: color 0.15s var(--ease), background 0.15s var(--ease);
}

@media (max-width: 767px) {
  .nav__dropdown-link,
  .nav__dropdown-sub-link {
    min-height: 2.75rem;
  }
}

.nav__dropdown-link:hover {
  background: rgba(37, 99, 235, 0.07);
  color: var(--color-text);
  text-decoration: none;
}

.nav__dropdown-link[aria-current="page"] {
  font-weight: 600;
  color: var(--color-accent-hover);
  background: rgba(37, 99, 235, 0.1);
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.2);
}

.nav__dropdown-link:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

/* Platform dropdown: Resilience nested submenu (desktop hover bridge + mobile stack) */
.nav__dropdown-item--submenu {
  position: relative;
}

.nav__dropdown-link--has-sub {
  position: relative;
  padding-right: 2rem;
}

.nav__dropdown-chevron {
  position: absolute;
  right: 0.65rem;
  top: 50%;
  width: 0.3125rem;
  height: 0.3125rem;
  margin-top: -0.125rem;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg);
  opacity: 0.45;
  pointer-events: none;
}

@media (min-width: 768px) {
  .nav__dropdown-sub {
    list-style: none;
    margin: 0;
    padding: var(--space-sm);
    position: absolute;
    left: 100%;
    top: 0;
    min-width: 14rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card-hover);
    opacity: 0;
    visibility: hidden;
    transform: translateX(-6px);
    pointer-events: none;
    transition: opacity 0.18s var(--ease), transform 0.18s var(--ease),
      visibility 0.18s var(--ease);
    z-index: 210;
  }

  /* Invisible hover bridge so the pointer can move into the submenu without closing */
  .nav__dropdown-sub::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 100%;
    width: 12px;
  }

  .nav__dropdown-item--submenu:hover .nav__dropdown-sub,
  .nav__dropdown-item--submenu:focus-within .nav__dropdown-sub {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    pointer-events: auto;
  }
}

@media (max-width: 767px) {
  .nav__dropdown-link--has-sub {
    padding-right: var(--space-md);
  }

  .nav__dropdown-chevron {
    position: static;
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.35rem;
    margin-top: 0;
    transform: rotate(45deg);
    opacity: 0.4;
  }

  .nav__dropdown-sub {
    list-style: none;
    margin: 0;
    padding: 0 0 var(--space-xs) var(--space-md);
  }
}

.nav__dropdown-sub-link {
  display: flex;
  align-items: center;
  padding: var(--space-sm) var(--space-md);
  color: var(--color-text-muted);
  text-decoration: none;
  font-weight: 500;
  font-size: 0.875rem;
  border-radius: var(--radius-sm);
  transition: color 0.15s var(--ease), background 0.15s var(--ease);
}

.nav__dropdown-sub-link:hover {
  background: rgba(37, 99, 235, 0.07);
  color: var(--color-text);
  text-decoration: none;
}

.nav__dropdown-sub-link[aria-current="page"] {
  font-weight: 600;
  color: var(--color-accent-hover);
  background: rgba(37, 99, 235, 0.1);
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.2);
}

.nav__dropdown-sub-link:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.nav__cta {
  margin-top: var(--space-md);
  flex-shrink: 0;
  align-self: stretch;
  text-align: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.6rem 1.2rem;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: var(--radius-md);
}

@media (min-width: 768px) {
  .nav__cta {
    margin-top: 0;
    margin-left: 1.125rem;
    align-self: center;
    min-height: 2.375rem;
    height: 2.375rem;
    padding: 0 1.2rem;
    line-height: 1.2;
  }
}

/* --- Buttons --- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
  padding: 0.625rem 1.25rem;
  font-family: inherit;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.25;
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s var(--ease), color 0.2s var(--ease), border-color 0.2s
      var(--ease),
    box-shadow 0.2s var(--ease), transform 0.15s var(--ease);
}

.btn:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.btn--primary {
  background: var(--color-accent);
  color: #fff;
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.25);
}

.btn--primary:hover {
  background: var(--color-accent-hover);
  color: #fff;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35);
  text-decoration: none;
  transform: translateY(-1px);
}

.nav__cta.btn--primary {
  box-shadow:
    0 1px 2px rgba(37, 99, 235, 0.24),
    0 2px 8px rgba(37, 99, 235, 0.14);
}

.nav__cta.btn--primary:hover {
  transform: translateY(-0.5px);
  box-shadow:
    0 2px 8px rgba(37, 99, 235, 0.3),
    0 6px 18px rgba(37, 99, 235, 0.22);
}

.btn--secondary {
  background: var(--color-surface);
  color: var(--color-text);
  border-color: var(--color-border);
  box-shadow: var(--shadow-sm);
}

.btn--secondary:hover {
  background: var(--color-bg-muted);
  border-color: #cbd5e1;
  color: var(--color-text);
  text-decoration: none;
}

.btn--lg {
  padding: 0.875rem 1.5rem;
  font-size: 1rem;
}

/* --- Typography --- */
.page-title {
  margin: 0 0 var(--space-md);
  font-size: clamp(2rem, 4vw + 1rem, 2.75rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.15;
  color: var(--color-text);
}

.lead {
  margin: 0;
  font-size: 1.125rem;
  color: var(--color-text-muted);
  max-width: 42rem;
}

.section-label {
  display: block;
  margin-bottom: var(--space-sm);
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-accent);
}

.section-title {
  margin: 0 0 var(--space-lg);
  font-size: clamp(1.5rem, 2vw + 1rem, 2rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: var(--color-text);
}

/* --- Sections --- */
.section {
  padding-block: var(--space-3xl);
}

@media (max-width: 767px) {
  .section {
    padding-block: var(--space-2xl);
  }
}

.section--tight {
  padding-block: var(--space-2xl);
}

.section--surface {
  background: var(--color-surface);
  border-block: 1px solid var(--color-border);
}

.section--muted {
  background: var(--color-bg-muted);
  border-block: 1px solid var(--color-border);
}

.section--accent-tint {
  background: linear-gradient(180deg, #f0f4fc 0%, var(--color-bg) 100%);
  border-block: 1px solid var(--color-border);
}

.section__intro {
  max-width: 40rem;
  margin-bottom: var(--space-2xl);
}

.section__intro--center {
  margin-inline: auto;
  text-align: center;
}

.section__intro--center .lead {
  margin-inline: auto;
}

.section__intro .lead {
  margin-top: var(--space-md);
}

.text-center {
  text-align: center;
}

.text-center .lead {
  margin-inline: auto;
}

.section__link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: var(--space-xl);
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  color: var(--color-accent);
}

.section__link:hover {
  color: var(--color-accent-hover);
  text-decoration: none;
}

.section__link--platform {
  margin-top: 0;
  padding: 0.65rem 1.15rem;
  border-radius: var(--radius-md);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-sm);
  transition:
    border-color 0.2s var(--ease),
    box-shadow 0.2s var(--ease),
    color 0.2s var(--ease),
    background 0.2s var(--ease);
}

.section__link--platform:hover {
  border-color: var(--color-accent-ring);
  box-shadow: var(--shadow-card);
  background: var(--color-bg-muted);
  color: var(--color-accent-hover);
}

/* --- Homepage / About / Platform hero (2-column) --- */
.hero--home::before,
.hero--about::before,
.hero--platform::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse 70% 50% at 85% 15%,
    rgba(37, 99, 235, 0.06),
    transparent
  );
  pointer-events: none;
}

.hero__title {
  margin: 0 0 var(--space-lg);
  font-size: clamp(1.75rem, 3.1vw + 0.55rem, 2.35rem);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.14;
  color: var(--color-text);
}

.hero__sub {
  margin: 0 0 var(--space-xl);
  font-size: clamp(1.0625rem, 1.2vw + 0.85rem, 1.2rem);
  line-height: 1.65;
  color: var(--color-text-muted);
  max-width: var(--page-intro-lead-max);
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
}

.hero__proof {
  margin: var(--space-lg) 0 0;
  font-size: 0.875rem;
  color: var(--color-text-muted);
  line-height: 1.5;
  max-width: 32rem;
}

/* --- Hero product screenshot --- */
.hero__product-shot {
  border-radius: var(--radius-xl);
  overflow: hidden;
  line-height: 0;
  background: #0b1220;
  box-shadow: var(--shadow-browser);
  border: 1px solid var(--color-border);
  transition: box-shadow 0.3s var(--ease), transform 0.3s var(--ease);
}

.hero__product-shot:hover {
  box-shadow: 0 28px 56px -12px rgba(15, 23, 42, 0.2), 0 0 0 1px rgba(15, 23, 42, 0.06);
  transform: translateY(-2px);
}

.hero__product-img {
  width: 100%;
  height: auto;
  display: block;
  vertical-align: top;
}

/* --- Hero screenshot slideshow --- */
.hero-slideshow {
  position: relative;
}

.hero-slideshow__viewport {
  position: relative;
  border-radius: inherit;
}

.hero-slideshow__slides {
  position: relative;
  aspect-ratio: 1024 / 682;
  background: #0b1220;
}

.hero-slideshow__slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: top center;
  opacity: 0;
  transition: opacity 0.65s ease;
  z-index: 0;
}

.hero-slideshow__slide--active {
  opacity: 1;
  z-index: 1;
}

.hero-slideshow__btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  border: 1px solid var(--color-border);
  background: rgba(255, 255, 255, 0.94);
  color: var(--color-text);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  box-shadow: var(--shadow-card);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.28s var(--ease), visibility 0.28s var(--ease),
    background 0.2s var(--ease), border-color 0.2s var(--ease), color 0.2s var(--ease);
}

.hero-slideshow__btn:hover {
  background: var(--color-surface);
  border-color: var(--color-accent-ring);
  color: var(--color-accent);
}

.hero-slideshow__btn:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.hero-slideshow__btn--prev {
  left: var(--space-md);
}

.hero-slideshow__btn--next {
  right: var(--space-md);
}

.hero-slideshow:hover .hero-slideshow__btn,
.hero-slideshow:focus-within .hero-slideshow__btn {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* Touch: prev/next always available (no hover) */
@media (hover: none) and (pointer: coarse) {
  .hero-slideshow__btn {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-slideshow__slide {
    transition-duration: 0.01ms;
  }
}

/* --- Capability cards (compact) --- */
.cap-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
  box-shadow: var(--shadow-card);
  transition: box-shadow 0.25s var(--ease), border-color 0.25s var(--ease),
    transform 0.2s var(--ease);
  height: 100%;
}

.cap-card:hover {
  box-shadow: var(--shadow-card-hover);
  border-color: var(--color-accent-ring);
  transform: translateY(-3px);
}

.cap-card__icon {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  background: var(--color-accent-subtle);
  color: var(--color-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--space-md);
}

.cap-card__title {
  margin: 0 0 var(--space-sm);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text);
}

.cap-card__body {
  margin: 0;
  font-size: 0.9375rem;
  color: var(--color-text-muted);
  line-height: 1.6;
}

.capabilities__footer {
  text-align: center;
  margin-top: var(--space-xl);
}

/* --- Compare section --- */
.compare-block {
  display: grid;
  gap: var(--space-2xl);
}

@media (min-width: 900px) {
  .compare-block {
    grid-template-columns: 1fr 1.15fr;
    align-items: start;
    gap: var(--space-3xl);
  }
}

.compare-block__intro .section-title {
  margin-bottom: var(--space-md);
}

.compare-block__intro .lead {
  max-width: 36rem;
}

.compare-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
}

@media (max-width: 599px) {
  .compare-split {
    grid-template-columns: 1fr;
  }
}

.compare-panel {
  padding: var(--space-xl);
}

.compare-panel--without {
  background: var(--color-bg-muted);
}

.compare-panel--with {
  background: var(--color-surface);
  border-left: 1px solid var(--color-border);
}

@media (max-width: 599px) {
  .compare-panel--with {
    border-left: none;
    border-top: 1px solid var(--color-border);
  }
}

.compare-panel__label {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: var(--space-lg);
  color: var(--color-text-muted);
}

.compare-panel--with .compare-panel__label {
  color: var(--color-accent);
}

.compare-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.compare-list li {
  display: flex;
  gap: var(--space-sm);
  align-items: flex-start;
  font-size: 0.875rem;
  color: var(--color-text-muted);
  margin-bottom: var(--space-md);
  line-height: 1.45;
}

.compare-list li:last-child {
  margin-bottom: 0;
}

.compare-list__mark {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  margin-top: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.65rem;
  font-weight: 700;
}

.compare-panel--without .compare-list__mark {
  background: #cbd5e1;
  color: #64748b;
}

.compare-panel--with .compare-list__mark {
  background: var(--color-accent-subtle);
  color: var(--color-accent);
}

.compare-list__mark--minus {
  border-radius: 6px;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  font-size: 0.8rem;
  font-weight: 800;
  line-height: 1;
}

.compare-panel--without .compare-list__mark--minus {
  background: #ffe4e6;
  color: #be123c;
}

.compare-list__mark--check {
  border-radius: 50%;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1;
}

.compare-panel--with .compare-list__mark--check {
  background: var(--color-accent-subtle);
  color: var(--color-accent-hover);
}

/* --- Audience / who it's for --- */
.audience-grid {
  display: grid;
  gap: var(--space-lg);
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .audience-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.audience-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
  box-shadow: var(--shadow-card);
  transition: box-shadow 0.25s var(--ease), border-color 0.25s var(--ease);
}

.audience-card:hover {
  box-shadow: var(--shadow-card-hover);
  border-color: var(--color-accent-ring);
}

.audience-card__icon {
  width: 44px;
  height: 44px;
  margin-bottom: var(--space-md);
  color: var(--color-accent);
}

.audience-card h3 {
  margin: 0 0 var(--space-sm);
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-text);
}

.audience-card p {
  margin: 0;
  font-size: 0.9375rem;
  color: var(--color-text-muted);
  line-height: 1.6;
}

/* --- About page: abstract product preview --- */
.about-preview {
  border-radius: inherit;
  overflow: hidden;
  background: var(--color-surface);
  min-height: 220px;
  display: flex;
  flex-direction: column;
}

.about-preview__toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  background: #f1f5f9;
  border-bottom: 1px solid var(--color-border);
}

.about-preview__dots {
  display: flex;
  gap: 6px;
}

.about-preview__dots span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #cbd5e1;
}

.about-preview__dots span:first-child {
  background: #f87171;
}

.about-preview__dots span:nth-child(2) {
  background: #fbbf24;
}

.about-preview__dots span:nth-child(3) {
  background: #34d399;
}

.about-preview__url {
  flex: 1;
  min-width: 8rem;
  font-size: 0.625rem;
  font-weight: 500;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  color: var(--color-text-muted);
  padding: 0.35rem 0.75rem;
  background: #fff;
  border-radius: 6px;
  border: 1px solid var(--color-border);
  text-align: center;
  letter-spacing: 0.01em;
}

.about-preview__status {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-left: auto;
  flex-shrink: 0;
  font-size: 0.5625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #15803d;
}

.about-preview__status-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.35);
}

.about-preview__body {
  flex: 1;
  display: grid;
  grid-template-columns: 5.75rem 1fr;
  min-height: 200px;
}

.about-preview__sidebar {
  background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
  padding: var(--space-sm) var(--space-sm) var(--space-md);
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.about-preview__sidebar-label {
  font-size: 0.5625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #64748b;
  margin-bottom: 2px;
  padding-left: 2px;
}

.about-preview__nav-item {
  min-height: 0;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
  padding: 0.35rem 0.4rem;
  font-size: 0.5625rem;
  font-weight: 600;
  line-height: 1.25;
  color: #94a3b8;
}

.about-preview__nav-item span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.about-preview__nav-item--active {
  background: rgba(37, 99, 235, 0.32);
  color: #e0e7ff;
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.45);
}

.about-preview__main {
  padding: var(--space-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  background: linear-gradient(180deg, #fafbfc 0%, #f1f5f9 100%);
}

.about-preview__kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

@media (max-width: 420px) {
  .about-preview__kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.about-preview__kpi {
  min-height: 2.75rem;
  border-radius: var(--radius-sm);
  background: #fff;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-sm);
  padding: 0.35rem 0.4rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  min-width: 0;
}

.about-preview__kpi-label {
  font-size: 0.5625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
  line-height: 1.2;
}

.about-preview__kpi-value {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--color-text);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.about-preview__kpi:nth-child(1) {
  background: linear-gradient(135deg, #eff6ff 0%, #fff 100%);
  border-color: rgba(37, 99, 235, 0.2);
}

.about-preview__kpi:nth-child(1) .about-preview__kpi-value {
  color: var(--color-accent);
}

.about-preview__context-chain {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 6px;
  padding: var(--space-sm) var(--space-md);
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}

.about-preview__context-pill {
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--color-text);
  padding: 0.2rem 0.45rem;
  border-radius: 6px;
  background: var(--color-bg-muted);
  border: 1px solid #e2e8f0;
  letter-spacing: -0.01em;
}

.about-preview__context-pill--policy {
  background: rgba(37, 99, 235, 0.08);
  border-color: rgba(37, 99, 235, 0.22);
  color: var(--color-accent-hover);
}

.about-preview__context-arrow {
  width: 0.5rem;
  height: 0.5rem;
  flex-shrink: 0;
  border-right: 1.5px solid #94a3b8;
  border-top: 1.5px solid #94a3b8;
  transform: rotate(45deg);
  opacity: 0.65;
}

.about-preview__chart-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-height: 0;
}

.about-preview__chart-label {
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-muted);
  padding-left: 2px;
}

.about-preview__signals {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: var(--space-md);
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  flex: 1;
  min-height: 0;
}

.about-preview__signal {
  display: grid;
  grid-template-columns: minmax(0, 7.75rem) 1fr;
  align-items: center;
  gap: var(--space-sm);
}

@media (max-width: 380px) {
  .about-preview__signal {
    grid-template-columns: 1fr;
    gap: 0.35rem;
  }
}

.about-preview__signal-name {
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--color-text-muted);
  letter-spacing: 0.02em;
}

.about-preview__signal-track {
  display: block;
  height: 7px;
  background: #e2e8f0;
  border-radius: 999px;
  overflow: hidden;
}

.about-preview__signal-fill {
  display: block;
  height: 100%;
  width: 76%;
  border-radius: inherit;
  background: linear-gradient(90deg, #93c5fd, var(--color-accent));
}

.about-preview__signal:nth-child(2) .about-preview__signal-fill {
  width: 88%;
}

.about-preview__signal:nth-child(3) .about-preview__signal-fill {
  width: 94%;
}

.about-preview__chart {
  flex: 1;
  min-height: 88px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 6px;
  padding: var(--space-md);
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}

.about-preview__bar {
  flex: 1;
  border-radius: 4px 4px 0 0;
  background: linear-gradient(180deg, #93c5fd 0%, var(--color-accent) 100%);
  opacity: 0.85;
  min-height: 28%;
  animation: about-bar 4.5s ease-in-out infinite;
}

.about-preview__bar:nth-child(2) {
  animation-delay: 0.15s;
  min-height: 55%;
}

.about-preview__bar:nth-child(3) {
  animation-delay: 0.3s;
  min-height: 42%;
}

.about-preview__bar:nth-child(4) {
  animation-delay: 0.45s;
  min-height: 68%;
}

.about-preview__bar:nth-child(5) {
  animation-delay: 0.6s;
  min-height: 38%;
}

@keyframes about-bar {
  0%,
  100% {
    opacity: 0.75;
    transform: scaleY(1);
  }
  50% {
    opacity: 1;
    transform: scaleY(1.04);
  }
}

@media (prefers-reduced-motion: reduce) {
  .about-preview__bar {
    animation: none;
  }
}

@media (min-width: 768px) {
  .about-preview {
    min-height: 280px;
  }

  .about-preview__body {
    min-height: 260px;
  }

  .about-preview__chart {
    min-height: 140px;
  }
}

/* --- About page: principles (compact cards) --- */
.principle-grid {
  display: grid;
  gap: var(--space-md);
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .principle-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .principle-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-lg);
  }
}

.principle-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  box-shadow: var(--shadow-sm);
  transition:
    box-shadow 0.22s var(--ease),
    border-color 0.22s var(--ease),
    transform 0.2s var(--ease);
  height: 100%;
}

.principle-card:hover {
  box-shadow: var(--shadow-card);
  border-color: var(--color-accent-ring);
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  .principle-card:hover {
    transform: none;
  }
}

.principle-card__index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  margin: 0 0 var(--space-sm);
  border-radius: var(--radius-sm);
  background: var(--color-accent-subtle);
  color: var(--color-accent);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.principle-card h3 {
  margin: 0 0 var(--space-xs);
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--color-text);
  letter-spacing: -0.01em;
}

.principle-card p {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.55;
  color: var(--color-text-muted);
}

.about-prose {
  max-width: 40rem;
}

.about-prose h2 {
  margin: 0 0 var(--space-md);
  font-size: clamp(1.25rem, 1.5vw + 1rem, 1.5rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.about-prose p {
  margin: 0 0 var(--space-lg);
  font-size: 1.0625rem;
  line-height: 1.68;
  color: var(--color-text-muted);
}

.about-prose p:last-child {
  margin-bottom: 0;
}

.about-prose strong {
  color: var(--color-text);
  font-weight: 600;
}

/* --- Final CTA --- */
.final-cta {
  padding-block: var(--space-3xl);
  text-align: center;
  background: linear-gradient(180deg, var(--color-surface) 0%, var(--color-bg-muted) 100%);
  border-block: 1px solid var(--color-border);
}

.final-cta h2 {
  margin: 0 0 var(--space-md);
  font-size: clamp(1.5rem, 2.5vw + 0.5rem, 2rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.final-cta p {
  margin: 0 0 var(--space-xl);
  color: var(--color-text-muted);
  max-width: 32rem;
  margin-inline: auto;
  font-size: 1.0625rem;
}

.final-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  justify-content: center;
  align-items: center;
}

/* --- Card grid (inner pages) --- */
.card-grid {
  display: grid;
  gap: var(--space-lg);
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .card-grid--2 {
    grid-template-columns: repeat(2, 1fr);
  }

  .card-grid--3 {
    grid-template-columns: repeat(2, 1fr);
  }

  .card-grid--4 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .card-grid--3 {
    grid-template-columns: repeat(3, 1fr);
  }

  .card-grid--4 {
    grid-template-columns: repeat(4, 1fr);
  }
}

.section__actions {
  margin-top: var(--space-2xl);
  text-align: center;
}

.card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
  box-shadow: var(--shadow-card);
  transition: box-shadow 0.25s var(--ease), border-color 0.25s var(--ease);
}

.card:hover {
  box-shadow: var(--shadow-card-hover);
  border-color: var(--color-accent-ring);
}

a.card.card--link {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

a.card.card--link:hover {
  color: inherit;
  text-decoration: none;
}

a.card.card--link .card__title {
  color: var(--color-text);
  transition: color 0.15s var(--ease);
}

a.card.card--link:hover .card__title {
  color: var(--color-accent);
}

a.card.card--link:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.card__icon {
  width: 44px;
  height: 44px;
  margin-bottom: var(--space-md);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
  background: var(--color-accent-subtle);
  color: var(--color-accent);
}

.card__title {
  margin: 0 0 var(--space-sm);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text);
}

.card__body {
  margin: 0;
  font-size: 0.9375rem;
  color: var(--color-text-muted);
}

.card__list {
  margin: var(--space-md) 0 0;
  padding-left: 1.125rem;
  color: var(--color-text-muted);
  font-size: 0.9375rem;
}

.card__list li {
  margin-bottom: var(--space-xs);
}

.cta-band {
  margin-top: var(--space-2xl);
  padding: var(--space-2xl);
  background: var(--color-surface);
  color: var(--color-text);
  border-radius: var(--radius-lg);
  text-align: center;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
}

.cta-band h2 {
  margin: 0 0 var(--space-md);
  font-size: clamp(1.35rem, 2vw + 1rem, 1.75rem);
}

.cta-band p {
  margin: 0 0 var(--space-xl);
  color: var(--color-text-muted);
  max-width: 36rem;
  margin-inline: auto;
}

.cta-band .btn--primary:hover {
  transform: translateY(-1px);
}

.cta-band .btn--secondary {
  background: var(--color-bg-muted);
  border-color: var(--color-border);
}

.cta-band__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  justify-content: center;
}

.page-hero {
  background: transparent;
}

.module-back {
  margin: 0 0 var(--space-md);
  font-size: 0.9375rem;
}

.module-back a {
  font-weight: 500;
}

.module-highlights {
  max-width: 40rem;
}

.module-highlights .card__list {
  margin-top: var(--space-md);
}

.prose {
  max-width: 42rem;
  min-width: 0;
}

.prose pre {
  overflow-x: auto;
  max-width: 100%;
}

.prose p {
  margin: 0 0 var(--space-lg);
  color: var(--color-text-muted);
}

.prose p:last-child {
  margin-bottom: 0;
}

.prose strong {
  color: var(--color-text);
}

.prose h2 {
  margin: var(--space-2xl) 0 var(--space-md);
  font-size: 1.25rem;
  color: var(--color-text);
}

.prose h2:first-child {
  margin-top: 0;
}

.steps {
  counter-reset: step;
  display: grid;
  gap: var(--space-lg);
}

.step {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-lg);
  padding: var(--space-xl);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

.step::before {
  counter-increment: step;
  content: counter(step);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius-sm);
  background: var(--color-accent);
  color: #fff;
  font-weight: 700;
  font-size: 0.9375rem;
}

.step h3 {
  margin: 0 0 var(--space-xs);
  font-size: 1.0625rem;
  color: var(--color-text);
}

.step p {
  margin: 0;
  font-size: 0.9375rem;
  color: var(--color-text-muted);
}

.form label {
  color: var(--color-text);
}

.form input,
.form textarea {
  background: var(--color-surface);
  color: var(--color-text);
  border-color: var(--color-border);
}

.form input:focus,
.form textarea:focus {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px var(--color-accent-subtle);
}

.form input::placeholder,
.form textarea::placeholder {
  color: #94a3b8;
}

/* --- Contact page (enterprise conversion) --- */
body.page-contact {
  background-image: linear-gradient(180deg, #f8fafc 0%, #eef2f8 40%, #e8eef7 100%);
}

.contact-section {
  padding: var(--page-intro-pt) 0 calc(var(--space-3xl) + 0.5rem + var(--safe-bottom));
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.65) 0%, var(--color-bg-muted) 55%);
  border-bottom: 1px solid var(--color-border);
}

@media (min-width: 768px) {
  .contact-section {
    padding: var(--page-intro-pt) 0 calc(var(--space-3xl) + 1rem + var(--safe-bottom));
  }
}

.contact-shell {
  max-width: var(--container);
  min-width: 0;
  margin-inline: auto;
}

.contact-grid {
  display: grid;
  gap: var(--space-2xl);
  align-items: start;
  min-width: 0;
}

@media (min-width: 960px) {
  .contact-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 28rem);
    gap: clamp(2rem, 4.5vw, 3.25rem);
    align-items: start;
  }
}

.contact-intro-block {
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
  max-width: var(--page-intro-measure);
}

@media (min-width: 960px) {
  .contact-intro-block {
    padding-top: 0.25rem;
  }
}

.section-label--contact {
  display: block;
  margin-bottom: var(--space-xs);
}

.contact-intro__title {
  margin: 0 0 var(--space-sm);
  font-size: clamp(1.9rem, 3vw + 1rem, 2.45rem);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.14;
  color: var(--color-text);
}

.contact-intro__lead {
  margin: 0 0 var(--space-md);
  font-size: 1.0625rem;
  line-height: 1.58;
  color: #526177;
  max-width: var(--page-intro-lead-max);
}

.contact-intro__secondary {
  margin: 0 0 var(--space-xl);
  font-size: 0.9375rem;
  line-height: 1.58;
  color: var(--color-text-muted);
  max-width: var(--page-intro-support-max);
  padding-bottom: var(--space-lg);
  border-bottom: 1px solid rgba(226, 232, 240, 0.95);
}

.contact-trust {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  max-width: 31rem;
}

.contact-trust__item {
  display: flex;
  gap: var(--space-md);
  align-items: flex-start;
  font-size: 0.9375rem;
  line-height: 1.52;
  color: var(--color-text);
}

.contact-trust__text {
  padding-top: 0.125rem;
}

.contact-trust__text strong {
  font-weight: 700;
  color: var(--color-text);
}

.contact-trust__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius-md);
  background: linear-gradient(145deg, var(--color-accent-subtle) 0%, rgba(37, 99, 235, 0.06) 100%);
  color: var(--color-accent);
  border: 1px solid rgba(37, 99, 235, 0.12);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.contact-trust__icon svg {
  display: block;
}

.contact-next {
  padding: var(--space-lg) var(--space-xl);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

.contact-next__title {
  margin: 0 0 var(--space-md);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.contact-next__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.contact-next__list li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-md);
  margin: 0;
}

.contact-next__num {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  background: var(--color-accent-subtle);
  color: var(--color-accent);
  font-size: 0.8125rem;
  font-weight: 800;
}

.contact-next__body {
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.45;
  color: var(--color-text);
  padding-top: 0.2rem;
}

.contact-rail {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.contact-form-card {
  background: linear-gradient(180deg, #ffffff 0%, #fafbfd 100%);
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: var(--radius-xl);
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 12px 40px -12px rgba(15, 23, 42, 0.12),
    0 0 0 1px rgba(255, 255, 255, 0.6) inset;
  padding: var(--space-xl);
  transition: box-shadow 0.28s var(--ease), border-color 0.28s var(--ease);
  scroll-margin-top: calc(var(--header-total-height) + var(--space-md));
}

@media (min-width: 768px) {
  .contact-form-card {
    padding: var(--space-2xl);
  }
}

.contact-form-card:focus-within {
  box-shadow:
    0 4px 12px rgba(15, 23, 42, 0.06),
    0 20px 50px -14px rgba(37, 99, 235, 0.16);
  border-color: rgba(37, 99, 235, 0.22);
}

.contact-form-card__header {
  margin-bottom: var(--space-xl);
  padding-bottom: var(--space-lg);
  border-bottom: 1px solid var(--color-border);
}

.contact-form-card__title {
  margin: 0 0 var(--space-sm);
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: var(--color-text);
}

.contact-form-card__lede {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--color-text-muted);
  max-width: 28rem;
}

.form--contact {
  max-width: none;
  width: 100%;
}

.form--contact .form__group {
  margin-bottom: var(--space-lg);
}

.form--contact label {
  display: block;
  margin-bottom: 0.4rem;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--color-text);
}

.form--contact .form__group--error label {
  color: #b91c1c;
}

.form--contact input,
.form--contact textarea,
.form--contact .form__select {
  width: 100%;
  min-height: 3rem;
  padding: 0.7rem 1rem;
  font-family: inherit;
  font-size: 0.9375rem;
  line-height: 1.45;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: #ffffff;
  color: var(--color-text);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition:
    border-color 0.15s var(--ease),
    box-shadow 0.15s var(--ease);
}

.form--contact .form__select {
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.85rem center;
  padding-right: 2.5rem;
  color: var(--color-text);
}

.form--contact .form__select:invalid {
  color: #94a3b8;
}

.form--contact textarea {
  min-height: 9.5rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  resize: vertical;
}

.form--contact input:hover,
.form--contact textarea:hover,
.form--contact .form__select:hover {
  border-color: #cbd5e1;
}

.form--contact input:focus,
.form--contact textarea:focus,
.form--contact .form__select:focus {
  outline: none;
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px var(--color-accent-subtle);
}

.form--contact input:focus-visible,
.form--contact textarea:focus-visible,
.form--contact .form__select:focus-visible {
  outline: none;
}

.form--contact .form__group--error input,
.form--contact .form__group--error textarea,
.form--contact .form__group--error .form__select {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
}

.form__error {
  display: block;
  margin-top: var(--space-xs);
  font-size: 0.8125rem;
  font-weight: 500;
  color: #b91c1c;
}

.form--contact--success {
  padding: var(--space-md) var(--space-lg);
  margin-bottom: var(--space-lg);
  font-size: 0.9375rem;
  font-weight: 500;
  color: #166534;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: var(--radius-md);
}

.form--contact input::placeholder,
.form--contact textarea::placeholder {
  color: #a8b3c4;
  opacity: 1;
}

.form-contact__submit {
  margin-top: var(--space-md);
  padding-top: var(--space-lg);
  border-top: 1px solid rgba(226, 232, 240, 0.9);
}

.form-contact__helper {
  margin: var(--space-md) 0 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--color-text-muted);
  text-align: center;
}

.form-contact__privacy {
  margin: var(--space-sm) 0 0;
  font-size: 0.75rem;
  line-height: 1.5;
  color: #94a3b8;
  text-align: center;
}

.btn--contact-submit {
  width: 100%;
  max-width: 100%;
  margin-top: 0;
  padding: 0.9rem 1.5rem;
  font-size: 1rem;
  font-weight: 700;
  border-radius: var(--radius-md);
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.28), 0 1px 2px rgba(15, 23, 42, 0.06);
}

.btn--contact-submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.35), 0 2px 6px rgba(15, 23, 42, 0.08);
}

.btn--contact-submit:active {
  transform: translateY(0);
}

.contact-alt {
  padding: var(--space-md) var(--space-lg);
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

.contact-alt__label {
  margin: 0 0 var(--space-sm);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.contact-alt__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-lg);
}

.contact-alt__link {
  font-size: 0.9375rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--color-accent);
}

.contact-alt__link:hover {
  color: var(--color-accent-hover);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.contact-support-strip {
  padding: var(--space-xl) 0 var(--space-2xl);
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border);
}

.contact-support-strip__inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  align-items: flex-start;
  padding: var(--space-lg) var(--space-xl);
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.04) 0%, rgba(248, 250, 252, 0.9) 100%);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

@media (min-width: 768px) {
  .contact-support-strip__inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-xl);
    padding: var(--space-xl) var(--space-2xl);
  }
}

.contact-support-strip__title {
  margin: 0 0 var(--space-xs);
  font-size: 1.0625rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.contact-support-strip__lede {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--color-text-muted);
  max-width: 32rem;
}

.contact-support-strip__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  flex-shrink: 0;
}

.contact-support-strip__actions .btn {
  padding: 0.65rem 1.15rem;
  font-size: 0.9375rem;
  font-weight: 600;
}

body.page-contact .site-footer {
  margin-top: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

body.page-contact .site-footer__grid {
  padding-top: var(--space-md);
  gap: var(--space-xl) var(--space-2xl);
}

@media (min-width: 768px) {
  body.page-contact .site-footer__grid {
    gap: var(--space-xl) var(--space-3xl);
  }
}

body.page-contact .site-footer__tagline {
  max-width: 22rem;
  line-height: 1.55;
}

body.page-contact .site-footer h3 {
  margin-top: 0;
  margin-bottom: var(--space-sm);
}

body.page-contact .site-footer li {
  margin-bottom: var(--space-xs);
}

body.page-contact .site-footer__bottom {
  margin-top: var(--space-xl);
  padding-top: var(--space-lg);
}

/* --- Thank-you page --- */
.thank-you-main {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.thank-you-section {
  flex: 1;
  padding: var(--space-xl) 0 var(--space-2xl);
  background: var(--color-bg-muted);
  border-top: 1px solid var(--color-border);
  display: flex;
  align-items: center;
}

@media (min-width: 768px) {
  .thank-you-section {
    padding: var(--space-2xl) 0 var(--space-3xl);
  }
}

.thank-you-inner {
  width: 100%;
  max-width: 36rem;
  margin-inline: auto;
}

.thank-you-card {
  background: #ffffff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  padding: var(--space-xl);
  text-align: center;
}

@media (min-width: 768px) {
  .thank-you-card {
    padding: var(--space-2xl);
  }
}

.thank-you-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  margin: 0 auto var(--space-lg);
  border-radius: 999px;
  background: var(--color-accent-subtle);
  color: var(--color-accent);
}

.thank-you-title {
  margin: 0 0 var(--space-md);
  font-size: clamp(1.65rem, 3vw + 1rem, 2.15rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: var(--color-text);
}

.thank-you-lead {
  margin: 0 0 var(--space-xl);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--color-text-muted);
}

.thank-you-actions {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  align-items: stretch;
}

@media (min-width: 420px) {
  .thank-you-actions {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }

  .thank-you-actions .btn {
    flex: 1 1 auto;
    min-width: 12rem;
  }
}

/* --- Footer (dark) --- */
.site-footer {
  margin-top: auto;
  padding-block: var(--space-2xl);
  padding-bottom: calc(var(--space-2xl) + var(--safe-bottom));
  background: var(--color-footer-bg);
  border-top: none;
}

.site-footer__grid {
  display: grid;
  gap: var(--space-2xl);
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .site-footer__grid {
    grid-template-columns: 1.2fr 1fr 1fr;
    align-items: start;
  }
}

.site-footer__brand {
  font-weight: 700;
  font-size: 1rem;
  margin-bottom: var(--space-sm);
  color: var(--color-footer-heading);
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
}

.site-footer__brand-wrap {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: var(--space-sm);
}

.site-footer__brand-wrap .logo__img {
  width: 36px;
  height: 36px;
}

.site-footer__tagline {
  margin: 0;
  font-size: 0.875rem;
  color: var(--color-footer-text);
  max-width: 20rem;
  line-height: 1.55;
}

.site-footer h3 {
  margin: 0 0 var(--space-md);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-footer-heading);
}

.site-footer ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-footer li {
  margin-bottom: var(--space-sm);
}

.site-footer a {
  color: var(--color-footer-text);
  text-decoration: none;
  font-size: 0.9375rem;
}

.site-footer a:hover {
  color: #fff;
}

.site-footer__bottom {
  margin-top: var(--space-2xl);
  padding-top: var(--space-xl);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 0.8125rem;
  color: var(--color-footer-text);
}

.page-about .site-footer {
  padding-block: calc(var(--space-2xl) + 0.35rem);
}

.page-about .site-footer__grid {
  gap: var(--space-xl);
}

@media (min-width: 768px) {
  .page-about .site-footer__grid {
    grid-template-columns: 1.28fr 0.95fr 0.88fr;
    column-gap: var(--space-2xl);
  }
}

.page-about .site-footer__tagline {
  max-width: 22rem;
  line-height: 1.55;
}

.page-about .site-footer h3 {
  margin-bottom: var(--space-md);
  letter-spacing: 0.07em;
}

.page-about .site-footer li {
  margin-bottom: 0.55rem;
}

.page-about .site-footer__bottom {
  margin-top: calc(var(--space-2xl) + 0.25rem);
}

.layout {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

main {
  flex: 1;
}

.form {
  max-width: 32rem;
}

.form__group {
  margin-bottom: var(--space-lg);
}

.form__hint {
  margin-top: var(--space-md);
  font-size: 0.875rem;
  color: var(--color-text-muted);
}

.why-grid {
  display: grid;
  gap: var(--space-xl);
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .why-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.why-item {
  padding: var(--space-lg);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-sm);
}

.why-item h3 {
  margin: 0 0 var(--space-sm);
  font-size: 1.0625rem;
  color: var(--color-text);
}

.why-item p {
  margin: 0;
  font-size: 0.9375rem;
  color: var(--color-text-muted);
}

.hero {
  padding-block: var(--space-4xl) var(--space-3xl);
  border-bottom: 1px solid var(--color-border);
}

.hero__inner {
  max-width: 720px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Case studies: equal-height cards, modal */
.card-grid--equal-rows .card {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.card-grid--equal-rows .card__actions {
  margin-top: auto;
  padding-top: var(--space-md);
}

.case-modal {
  max-width: 54rem;
  width: calc(100vw - 2rem);
  max-height: min(92vh, 62rem);
  margin: auto;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-browser);
  color: var(--color-text);
}

.case-modal::backdrop {
  background: rgba(15, 23, 42, 0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.case-modal__shell {
  display: flex;
  flex-direction: column;
  max-height: min(92vh, 62rem);
}

.case-modal__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
  padding: var(--space-lg) var(--space-lg) var(--space-sm);
  border-bottom: 1px solid var(--color-border);
  flex-shrink: 0;
}

.case-modal__title {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  padding-right: var(--space-sm);
}

.case-modal__close {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  margin: -0.25rem -0.25rem 0 0;
  padding: 0;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 1.75rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s var(--ease), color 0.15s var(--ease);
}

.case-modal__close:hover {
  background: var(--color-bg-muted);
  color: var(--color-text);
}

.case-modal__body {
  overflow-y: auto;
  padding: var(--space-lg);
  font-size: 0.9375rem;
  color: var(--color-text-muted);
}

.case-modal__body p {
  margin: 0 0 var(--space-md);
}

.case-modal__body p:last-child {
  margin-bottom: 0;
}

/* --- Module landing heroes (FinOps, CMDB, etc.) --- */
.module-hero--finops,
.module-hero--cmdb,
.module-hero--vault,
.module-hero--monitoring,
.module-hero--cloud-control,
.module-hero--resilience {
  padding-block: var(--space-3xl) var(--space-2xl);
  border-bottom: 1px solid var(--color-border);
  position: relative;
  overflow: visible;
  background: var(--color-surface);
}

.module-hero--finops::before,
.module-hero--cmdb::before,
.module-hero--vault::before,
.module-hero--monitoring::before,
.module-hero--cloud-control::before,
.module-hero--resilience::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse 65% 55% at 92% 8%,
    rgba(37, 99, 235, 0.07),
    transparent 58%
  );
  pointer-events: none;
}

.module-hero__grid {
  position: relative;
  display: grid;
  gap: var(--space-2xl);
  align-items: center;
}

@media (min-width: 1024px) {
  .module-hero__grid {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.2fr);
    gap: var(--space-3xl);
    align-items: start;
  }

  .module-finops {
    --module-product-nudge: calc(var(--space-lg) + 0.5in);
  }

  /* translateX aligns hero + “Why FinOps” shots without shrinking grid cells. */
  .module-finops .module-hero__visual,
  .module-finops .module-finops-why .module-split__visual-col {
    transform: translateX(var(--module-product-nudge));
  }

  .module-finops .module-finops-why .module-split,
  .module-finops .module-finops-mcp .module-split,
  .module-finops .module-finops-practical .module-split {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.2fr);
    gap: var(--space-3xl);
    align-items: start;
  }

  .module-cmdb,
  .module-vault,
  .module-monitoring,
  .module-cloud-control,
  .module-resilience {
    --module-landing-hero-nudge: calc(var(--space-lg) + 0.65in);
  }

  .module-cmdb {
    --module-landing-hero-scale: 1.07;
  }

  .module-vault {
    --module-landing-hero-scale: 1.36;
  }

  .module-monitoring {
    --module-landing-hero-scale: 1.05;
  }

  .module-cloud-control {
    /* Hero visual scaled up ~1in on typical desktop vs previous 1.05 baseline */
    --module-landing-hero-scale: 1.22;
  }

  .module-resilience {
    --module-landing-hero-scale: 1.05;
  }

  .module-cmdb .module-hero__visual {
    transform: translateX(var(--module-landing-hero-nudge))
      scale(var(--module-landing-hero-scale));
  }

  .module-monitoring .module-hero__visual,
  .module-cloud-control .module-hero__visual,
  .module-resilience .module-hero__visual {
    transform: translateX(var(--module-landing-hero-nudge))
      scale(var(--module-landing-hero-scale));
  }

  .module-vault .module-hero__visual {
    transform: translateX(var(--module-landing-hero-nudge)) translateY(0.75in)
      scale(var(--module-landing-hero-scale));
  }

  .module-cmdb .module-cmdb-why .module-split,
  .module-cmdb .module-cmdb-practical .module-split,
  .module-vault .module-vault-why .module-split,
  .module-vault .module-vault-practical .module-split,
  .module-monitoring .module-monitoring-servicemap .module-split,
  .module-monitoring .module-monitoring-livemode .module-split,
  .module-cloud-control .module-cloud-control-drift .module-split,
  .module-cloud-control .module-cloud-control-coverage .module-split,
  .module-resilience .module-resilience-projects .module-split,
  .module-resilience .module-resilience-maintenance .module-split,
  .module-resilience .module-cyber-exercises-plan .module-split,
  .module-resilience .module-cyber-exercises-run .module-split {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.2fr);
    gap: var(--space-3xl);
    align-items: start;
  }

  .module-vault .module-vault-why .module-split__visual-col {
    transform: translateX(calc(var(--space-lg) + 0.38in));
  }

  .module-cmdb .module-cmdb-why .module-split__visual-col,
  .module-monitoring .module-monitoring-servicemap .module-split__visual-col,
  .module-cloud-control .module-cloud-control-drift .module-split__visual-col,
  .module-resilience .module-resilience-projects .module-split__visual-col,
  .module-resilience .module-cyber-exercises-plan .module-split__visual-col {
    transform: translateX(calc(var(--space-lg) + 0.38in));
  }

  .module-cmdb .module-cmdb-practical .module-split__visual-col--lead,
  .module-vault .module-vault-practical .module-split__visual-col--lead,
  .module-monitoring .module-monitoring-livemode .module-split__visual-col--lead,
  .module-cloud-control .module-cloud-control-coverage .module-split__visual-col--lead,
  .module-resilience .module-resilience-maintenance .module-split__visual-col--lead,
  .module-resilience .module-cyber-exercises-run .module-split__visual-col--lead {
    transform: translateX(-0.5in) scale(1.14);
  }
}

/* Resilience: Cyber Exercises teaser (main Resilience page entry point) */
.module-resilience-cyber-teaser {
  padding-block: var(--space-xl) var(--space-2xl);
}

.module-resilience-cyber-teaser__inner {
  max-width: 42rem;
}

.module-resilience-cyber-teaser__title {
  margin: 0 0 var(--space-sm);
  font-size: clamp(1.125rem, 0.35vw + 1rem, 1.35rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.module-resilience-cyber-teaser__body {
  margin: 0 0 var(--space-md);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--color-text-muted);
}

.module-resilience-cyber-teaser__link {
  font-weight: 600;
  color: var(--color-accent);
  text-decoration: none;
}

.module-resilience-cyber-teaser__link:hover {
  text-decoration: underline;
  color: var(--color-accent-hover);
}

.module-resilience-cyber-teaser__cta {
  margin: 0;
}

.module-resilience-how__intro .module-resilience-how__lead {
  margin-top: var(--space-md);
  max-width: 40rem;
  margin-inline: auto;
}

.module-hero__copy {
  max-width: 36rem;
}

.module-hero__copy .module-back {
  margin-bottom: var(--space-md);
}

.module-hero__title {
  margin: 0 0 var(--space-lg);
  font-size: clamp(2rem, 3.5vw + 1rem, 2.75rem);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.12;
  color: var(--color-text);
}

.module-hero__lead {
  margin: 0 0 var(--space-xl);
  font-size: clamp(1.05rem, 0.6vw + 0.95rem, 1.2rem);
  line-height: 1.65;
  color: var(--color-text-muted);
}

.module-hero__cta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
}

.module-hero__figure,
.module-split__figure {
  margin: 0;
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  background: #0b1220;
  box-shadow: var(--shadow-browser);
  overflow: hidden;
  line-height: 0;
}

.module-hero__img,
.module-split__img {
  width: 100%;
  height: auto;
  display: block;
  vertical-align: top;
}

/* FinOps page: aspect ratios per screenshot */
.module-finops .module-hero__figure--finops {
  aspect-ratio: 1024 / 585;
  display: flex;
  align-items: center;
  justify-content: center;
}

.module-finops .module-split__figure--finops-cost {
  aspect-ratio: 1024 / 668;
  display: flex;
  align-items: center;
  justify-content: center;
}

.module-finops .module-split__figure--finops-practical {
  aspect-ratio: 1024 / 682;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* FinOps: MCP feature spotlight video */
.module-finops-mcp__note {
  margin: var(--space-lg) 0 0;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text-muted);
}

.module-video-spotlight {
  margin: 0;
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  background: #0b1220;
  box-shadow: var(--shadow-browser);
  overflow: hidden;
  line-height: 0;
}

.module-video-spotlight__video {
  width: 100%;
  height: auto;
  display: block;
  vertical-align: top;
}

.module-video-spotlight__caption {
  margin: var(--space-md) 0 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}

.module-finops .module-finops-mcp .module-split__copy--finops-mcp > .section-label {
  margin-bottom: var(--space-sm);
}

.module-finops .module-hero__img,
.module-finops .module-split__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

/* --- FinOps module landing polish --- */
.page-module-finops .nav__dropdown-wrap > .nav__link,
.page-module-vault .nav__dropdown-wrap > .nav__link,
.page-module-cmdb .nav__dropdown-wrap > .nav__link,
.page-module-monitoring .nav__dropdown-wrap > .nav__link,
.page-module-cloud-control .nav__dropdown-wrap > .nav__link,
.page-module-resilience .nav__dropdown-wrap > .nav__link {
  font-weight: 600;
  color: var(--color-accent-hover);
  background: rgba(37, 99, 235, 0.1);
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.2);
}

.page-module-finops .site-footer,
.page-module-vault .site-footer,
.page-module-cmdb .site-footer,
.page-module-monitoring .site-footer,
.page-module-cloud-control .site-footer,
.page-module-resilience .site-footer {
  padding-block: calc(var(--space-2xl) + 0.35rem);
}

.page-module-finops .site-footer__grid,
.page-module-vault .site-footer__grid,
.page-module-cmdb .site-footer__grid,
.page-module-monitoring .site-footer__grid,
.page-module-cloud-control .site-footer__grid,
.page-module-resilience .site-footer__grid {
  gap: var(--space-xl);
}

@media (min-width: 768px) {
  .page-module-finops .site-footer__grid,
  .page-module-vault .site-footer__grid,
  .page-module-cmdb .site-footer__grid,
  .page-module-monitoring .site-footer__grid,
  .page-module-cloud-control .site-footer__grid,
  .page-module-resilience .site-footer__grid {
    grid-template-columns: 1.28fr 0.95fr 0.88fr;
    column-gap: var(--space-2xl);
  }
}

.page-module-finops .site-footer__tagline,
.page-module-vault .site-footer__tagline,
.page-module-cmdb .site-footer__tagline,
.page-module-monitoring .site-footer__tagline,
.page-module-cloud-control .site-footer__tagline,
.page-module-resilience .site-footer__tagline {
  max-width: 22rem;
  line-height: 1.55;
}

.page-module-finops .site-footer h3,
.page-module-vault .site-footer h3,
.page-module-cmdb .site-footer h3,
.page-module-monitoring .site-footer h3,
.page-module-cloud-control .site-footer h3,
.page-module-resilience .site-footer h3 {
  margin-bottom: var(--space-md);
  letter-spacing: 0.07em;
}

.page-module-finops .site-footer li,
.page-module-vault .site-footer li,
.page-module-cmdb .site-footer li,
.page-module-monitoring .site-footer li,
.page-module-cloud-control .site-footer li,
.page-module-resilience .site-footer li {
  margin-bottom: 0.55rem;
}

.page-module-finops .site-footer__bottom,
.page-module-vault .site-footer__bottom,
.page-module-cmdb .site-footer__bottom,
.page-module-monitoring .site-footer__bottom,
.page-module-cloud-control .site-footer__bottom,
.page-module-resilience .site-footer__bottom {
  margin-top: calc(var(--space-2xl) + 0.25rem);
}

.module-finops .module-back--eyebrow,
.module-vault .module-back--eyebrow,
.module-cmdb .module-back--eyebrow,
.module-monitoring .module-back--eyebrow,
.module-cloud-control .module-back--eyebrow,
.module-resilience .module-back--eyebrow {
  margin: 0 0 var(--space-md);
}

.module-finops .module-back--eyebrow a,
.module-vault .module-back--eyebrow a,
.module-cmdb .module-back--eyebrow a,
.module-monitoring .module-back--eyebrow a,
.module-cloud-control .module-back--eyebrow a,
.module-resilience .module-back--eyebrow a {
  display: inline-block;
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-accent);
  text-decoration: none;
}

.module-finops .module-back--eyebrow a:hover,
.module-vault .module-back--eyebrow a:hover,
.module-cmdb .module-back--eyebrow a:hover,
.module-monitoring .module-back--eyebrow a:hover,
.module-cloud-control .module-back--eyebrow a:hover,
.module-resilience .module-back--eyebrow a:hover {
  color: var(--color-accent-hover);
  text-decoration: none;
}

.module-finops .module-hero__grid--finops {
  gap: clamp(var(--space-xl), 3vw, var(--space-3xl));
}

@media (min-width: 1024px) {
  .module-finops .module-hero__grid--finops {
    align-items: center;
  }
}

.module-finops .module-hero__copy--finops {
  max-width: 34rem;
}

.module-finops .module-hero__title--finops {
  margin-bottom: var(--space-md);
  font-weight: 800;
  letter-spacing: -0.038em;
  color: #0b1220;
}

.module-finops .module-hero__lead--finops {
  margin-bottom: var(--space-md);
  max-width: 33rem;
  font-size: clamp(1.03rem, 0.65vw + 0.94rem, 1.15rem);
  line-height: 1.58;
  color: #334155;
}

.module-finops .module-hero__support {
  margin: 0 0 var(--space-lg);
  max-width: 32rem;
  font-size: clamp(0.98rem, 0.55vw + 0.88rem, 1.0625rem);
  line-height: 1.55;
  color: #475569;
}

.module-vault .module-hero__grid--vault {
  gap: clamp(var(--space-xl), 3vw, var(--space-3xl));
}

@media (min-width: 1024px) {
  .module-vault .module-hero__grid--vault {
    align-items: center;
  }
}

.module-vault .module-hero__copy--vault {
  max-width: 34rem;
}

.module-vault .module-hero__title--vault {
  margin-bottom: var(--space-md);
  font-weight: 800;
  letter-spacing: -0.038em;
  color: #0b1220;
}

.module-vault .module-hero__lead--vault {
  margin-bottom: var(--space-md);
  max-width: 33rem;
  font-size: clamp(1.03rem, 0.65vw + 0.94rem, 1.15rem);
  line-height: 1.58;
  color: #334155;
}

.module-vault .module-hero__support--vault {
  margin: 0 0 var(--space-lg);
  max-width: 32rem;
  font-size: clamp(0.98rem, 0.55vw + 0.88rem, 1.0625rem);
  line-height: 1.55;
  color: #475569;
}

.module-cmdb .module-hero__grid--cmdb,
.module-monitoring .module-hero__grid--monitoring,
.module-cloud-control .module-hero__grid--cloud-control,
.module-resilience .module-hero__grid--resilience {
  gap: clamp(var(--space-xl), 3vw, var(--space-3xl));
}

@media (min-width: 1024px) {
  .module-cmdb .module-hero__grid--cmdb,
  .module-monitoring .module-hero__grid--monitoring,
  .module-cloud-control .module-hero__grid--cloud-control,
  .module-resilience .module-hero__grid--resilience {
    align-items: center;
  }
}

.module-cmdb .module-hero__copy--cmdb,
.module-monitoring .module-hero__copy--monitoring,
.module-cloud-control .module-hero__copy--cloud-control,
.module-resilience .module-hero__copy--resilience {
  max-width: 34rem;
}

.module-cmdb .module-hero__title--cmdb,
.module-monitoring .module-hero__title--monitoring,
.module-cloud-control .module-hero__title--cloud-control,
.module-resilience .module-hero__title--resilience {
  margin-bottom: var(--space-md);
  font-weight: 800;
  letter-spacing: -0.038em;
  color: #0b1220;
}

.module-cmdb .module-hero__lead--cmdb,
.module-monitoring .module-hero__lead--monitoring,
.module-cloud-control .module-hero__lead--cloud-control,
.module-resilience .module-hero__lead--resilience {
  margin-bottom: var(--space-md);
  max-width: 33rem;
  font-size: clamp(1.03rem, 0.65vw + 0.94rem, 1.15rem);
  line-height: 1.58;
  color: #334155;
}

.module-cmdb .module-hero__support--cmdb,
.module-monitoring .module-hero__support--monitoring,
.module-cloud-control .module-hero__support--cloud-control,
.module-resilience .module-hero__support--resilience {
  margin: 0 0 var(--space-lg);
  max-width: 32rem;
  font-size: clamp(0.98rem, 0.55vw + 0.88rem, 1.0625rem);
  line-height: 1.55;
  color: #475569;
}

.module-finops .module-hero__proof-strip,
.module-vault .module-hero__proof-strip,
.module-cmdb .module-hero__proof-strip,
.module-monitoring .module-hero__proof-strip,
.module-cloud-control .module-hero__proof-strip,
.module-resilience .module-hero__proof-strip {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  max-width: 36rem;
}

.module-finops .module-hero__proof-strip li,
.module-vault .module-hero__proof-strip li,
.module-cmdb .module-hero__proof-strip li,
.module-monitoring .module-hero__proof-strip li,
.module-cloud-control .module-hero__proof-strip li,
.module-resilience .module-hero__proof-strip li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
  margin: 0;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.45;
  color: #3d4e63;
}

.module-finops .module-hero__proof-dot,
.module-vault .module-hero__proof-dot,
.module-cmdb .module-hero__proof-dot,
.module-monitoring .module-hero__proof-dot,
.module-cloud-control .module-hero__proof-dot,
.module-resilience .module-hero__proof-dot {
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  margin-top: 0.4rem;
  border-radius: 50%;
  background: linear-gradient(145deg, var(--color-accent) 0%, #1d4ed8 100%);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

.module-finops .module-hero__figure--finops {
  border-radius: var(--radius-xl);
  border-color: #d1d9e6;
  box-shadow:
    0 28px 56px -16px rgba(15, 23, 42, 0.22),
    0 0 0 1px rgba(15, 23, 42, 0.07),
    0 0 48px -12px rgba(37, 99, 235, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  outline: 1px solid rgba(255, 255, 255, 0.1);
  outline-offset: -1px;
  transition: box-shadow 0.25s var(--ease), transform 0.25s var(--ease);
}

.module-finops .module-hero__figure--finops:hover {
  box-shadow:
    0 34px 68px -18px rgba(15, 23, 42, 0.24),
    0 0 0 1px rgba(37, 99, 235, 0.14),
    0 0 56px -10px rgba(37, 99, 235, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  .module-finops .module-hero__figure--finops:hover {
    transform: none;
  }
}

.module-finops .module-finops-why {
  padding-block: calc(var(--space-3xl) + 0.35rem);
  border-bottom: 1px solid rgba(226, 232, 240, 0.85);
}

.module-finops .module-split__copy--finops-why .module-split__title {
  margin-bottom: var(--space-md);
}

.module-finops .module-split__body--finops-why {
  max-width: 38rem;
  font-size: 1.03rem;
  line-height: 1.62;
  color: #475569;
}

.module-finops .module-split__visual-col {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
}

.module-finops .module-split__micro-label {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--color-accent-hover);
  padding: 0.5rem 0.85rem;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(37, 99, 235, 0.2);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  width: fit-content;
  max-width: 100%;
}

.module-finops .module-finops-why .module-split__figure {
  border-radius: var(--radius-xl);
  border-color: #cfd8e6;
  box-shadow:
    0 14px 36px -12px rgba(15, 23, 42, 0.14),
    0 0 0 1px rgba(15, 23, 42, 0.06);
}

.module-finops .module-capabilities__intro--finops {
  max-width: 44rem;
  margin-bottom: calc(var(--space-2xl) + 0.25rem);
  padding-bottom: var(--space-lg);
  border-bottom: 1px solid rgba(148, 163, 184, 0.35);
}

.module-finops .module-capabilities__intro--finops .section-title {
  margin-bottom: var(--space-md);
}

.module-finops .module-capabilities__lead {
  margin-top: var(--space-md);
  max-width: 38rem;
  font-size: 1.0625rem;
  line-height: 1.58;
  color: var(--color-text-muted);
}

.module-finops .module-feature-grid--finops {
  align-items: stretch;
}

.module-finops .module-feature-card--finops {
  display: flex;
  flex-direction: column;
  min-height: 12.5rem;
  padding: var(--space-xl);
  border-radius: var(--radius-xl);
  border-color: #d5dde8;
  box-shadow:
    0 2px 4px rgba(15, 23, 42, 0.04),
    0 12px 28px -10px rgba(15, 23, 42, 0.09);
  transition:
    box-shadow 0.22s var(--ease),
    border-color 0.22s var(--ease),
    transform 0.2s var(--ease);
}

.module-finops .module-feature-card--finops:hover {
  transform: translateY(-3px);
  border-color: var(--color-accent-ring);
  box-shadow:
    0 8px 20px rgba(15, 23, 42, 0.08),
    0 16px 36px -12px rgba(37, 99, 235, 0.12);
}

.module-finops .module-feature-card__icon {
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-md);
  background: linear-gradient(
    145deg,
    rgba(37, 99, 235, 0.12) 0%,
    rgba(37, 99, 235, 0.06) 100%
  );
  color: var(--color-accent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.module-finops .module-feature-card--finops .module-feature-card__title {
  font-size: 1.0625rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  margin-bottom: var(--space-sm);
}

.module-finops .module-feature-card--finops .module-feature-card__body {
  flex: 1;
  max-width: 22rem;
  font-size: 0.9375rem;
  line-height: 1.58;
}

@media (prefers-reduced-motion: reduce) {
  .module-finops .module-feature-card--finops:hover {
    transform: none;
  }
}

.module-finops .module-finops-practical {
  padding-block: calc(var(--space-3xl) + 0.35rem);
  border-block: 1px solid var(--color-border);
}

@media (max-width: 1023px) {
  .module-finops .module-split--finops-practical .module-split__copy--finops-practical {
    order: -1;
  }
}

.module-finops .module-split--finops-practical .module-split__title {
  margin-bottom: var(--space-md);
}

.module-finops .module-split--finops-practical .module-split__body {
  max-width: 36rem;
  font-size: 1.03rem;
  line-height: 1.6;
  color: #475569;
}

.module-finops .module-finops-practical .module-split__figure {
  border-radius: var(--radius-xl);
  border-color: #cfd8e6;
  box-shadow:
    0 18px 44px -14px rgba(15, 23, 42, 0.16),
    0 0 0 1px rgba(15, 23, 42, 0.06);
}

@media (min-width: 1024px) {
  .module-finops .module-finops-practical .module-split__figure--finops-practical {
    transform: scale(1.02);
    transform-origin: center left;
  }
}

.module-finops .module-value-list--finops {
  margin-top: var(--space-xl);
  gap: var(--space-md);
}

.module-finops .module-value-list--finops li {
  font-size: 0.96875rem;
  font-weight: 600;
  padding-left: 1.65rem;
}

.module-finops .module-value-list--finops li::before {
  top: 0.42em;
}

.module-finops .module-finops-how {
  padding-block: calc(var(--space-3xl) + 0.25rem);
  background: linear-gradient(180deg, var(--color-bg-muted) 0%, #e8edf5 100%);
  border-block: 1px solid var(--color-border);
}

.module-finops .module-finops-how__intro {
  margin-bottom: var(--space-2xl);
}

.module-finops .module-finops-how__intro .section-title {
  margin-bottom: 0;
  max-width: 32rem;
  margin-inline: auto;
}

.module-how-steps--finops,
.module-how-steps--vault,
.module-how-steps--cmdb,
.module-how-steps--monitoring,
.module-how-steps--cloud-control,
.module-how-steps--resilience {
  display: grid;
  gap: var(--space-lg);
  max-width: 960px;
  margin-inline: auto;
}

@media (min-width: 900px) {
  .module-how-steps--finops,
  .module-how-steps--vault,
  .module-how-steps--cmdb,
  .module-how-steps--monitoring,
  .module-how-steps--cloud-control,
  .module-how-steps--resilience {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-md);
    align-items: stretch;
  }
}

.module-how-step {
  display: flex;
  gap: var(--space-md);
  align-items: flex-start;
  padding: var(--space-lg);
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}

.module-how-step__num {
  flex-shrink: 0;
  width: 2.35rem;
  height: 2.35rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  font-weight: 800;
  font-size: 0.9375rem;
  color: var(--color-accent);
  background: linear-gradient(
    180deg,
    rgba(37, 99, 235, 0.1) 0%,
    rgba(37, 99, 235, 0.04) 100%
  );
  border: 1px solid var(--color-accent-ring);
}

.module-how-step__title {
  margin: 0 0 var(--space-xs);
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.module-how-step__desc {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.58;
  color: var(--color-text-muted);
}

.module-finops .final-cta--module-finops {
  position: relative;
  overflow: hidden;
  padding-block: calc(var(--space-3xl) + 0.75rem);
  background:
    radial-gradient(ellipse 85% 70% at 50% -20%, rgba(37, 99, 235, 0.11), transparent 52%),
    linear-gradient(180deg, #ffffff 0%, #eef2f9 55%, #e2e8f0 100%);
  border-top: 1px solid var(--color-border);
}

.module-finops .final-cta--module-finops::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.45) 50%, transparent 100%);
  opacity: 0.45;
  pointer-events: none;
}

.module-finops .final-cta--module-finops .final-cta__inner {
  position: relative;
  z-index: 1;
}

.module-finops .final-cta__proof-list--finops {
  list-style: none;
  margin: 0 0 var(--space-xl);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  justify-content: center;
  max-width: 52rem;
  margin-inline: auto;
}

.module-finops .final-cta__proof-list--finops li {
  margin: 0;
  padding: 0.4rem 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.module-finops .final-cta--module-finops h2 {
  font-size: clamp(1.55rem, 2.35vw + 0.72rem, 2.05rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  max-width: 26rem;
  margin-inline: auto;
  margin-bottom: var(--space-md);
}

@media (min-width: 640px) {
  .module-finops .final-cta--module-finops h2 {
    max-width: 34rem;
  }
}

.module-finops .final-cta--module-finops p {
  font-size: 1.0625rem;
  line-height: 1.62;
  max-width: 33rem;
  margin-inline: auto;
  margin-bottom: var(--space-2xl);
  color: #526177;
}

.module-finops .final-cta--module-finops .final-cta__actions {
  gap: var(--space-md) var(--space-lg);
}

.module-finops .final-cta--module-finops .btn--lg {
  min-height: 3rem;
  padding-inline: 1.65rem;
}

.module-finops .final-cta--module-finops .btn--primary {
  box-shadow:
    0 2px 6px rgba(37, 99, 235, 0.35),
    0 1px 2px rgba(15, 23, 42, 0.06);
}

.module-finops .final-cta--module-finops .btn--primary:hover {
  box-shadow:
    0 10px 28px rgba(37, 99, 235, 0.38),
    0 2px 6px rgba(15, 23, 42, 0.08);
}

.module-mockup {
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  background: linear-gradient(165deg, #f8fafc 0%, #f1f5f9 55%, #e8edf4 100%);
  box-shadow: var(--shadow-browser);
  overflow: hidden;
}

.module-mockup__chrome {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  background: #eef2f7;
  border-bottom: 1px solid var(--color-border);
}

.module-mockup__dots {
  display: flex;
  gap: 6px;
}

.module-mockup__dots span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #cbd5e1;
}

.module-mockup__dots span:first-child {
  background: #f87171;
}

.module-mockup__dots span:nth-child(2) {
  background: #fbbf24;
}

.module-mockup__dots span:nth-child(3) {
  background: #34d399;
}

.module-mockup__url {
  flex: 1;
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--color-text-muted);
  padding: 0.35rem 0.75rem;
  background: #fff;
  border-radius: 6px;
  border: 1px solid var(--color-border);
  text-align: center;
  letter-spacing: 0.02em;
}

.module-mockup__body {
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.module-mockup__kpis {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-sm);
}

@media (min-width: 420px) {
  .module-mockup__kpis {
    grid-template-columns: repeat(3, 1fr);
  }
}

.module-mockup__kpi {
  padding: var(--space-sm) var(--space-md);
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.module-mockup__kpi-label {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-muted);
}

.module-mockup__kpi-value {
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-text);
}

.module-mockup__kpi-value--ok {
  color: #15803d;
  font-size: 0.875rem;
}

.module-mockup__kpi-value--warn {
  color: #c2410c;
  font-size: 0.875rem;
}

.module-mockup__chart {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-md);
  box-shadow: var(--shadow-sm);
}

.module-mockup__chart-bars {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 6px;
  min-height: 110px;
  padding-bottom: var(--space-sm);
}

.module-mockup__bar {
  flex: 1;
  border-radius: 4px 4px 0 0;
  background: linear-gradient(180deg, #93c5fd 0%, var(--color-accent) 100%);
  min-height: 32%;
  opacity: 0.88;
}

.module-mockup__bar:nth-child(2) {
  min-height: 55%;
}

.module-mockup__bar:nth-child(3) {
  min-height: 42%;
}

.module-mockup__bar:nth-child(4) {
  min-height: 68%;
}

.module-mockup__bar:nth-child(5) {
  min-height: 38%;
}

.module-mockup__chart-legend {
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--color-text-muted);
  padding-top: var(--space-sm);
  border-top: 1px solid var(--color-border);
}

.module-mockup__rows {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.module-mockup__row {
  display: grid;
  grid-template-columns: 5rem 1fr 2.25rem;
  align-items: center;
  gap: var(--space-sm);
  font-size: 0.8125rem;
}

.module-mockup__row-label {
  font-weight: 600;
  color: var(--color-text);
}

.module-mockup__row-track {
  height: 8px;
  background: #e2e8f0;
  border-radius: 999px;
  overflow: hidden;
}

.module-mockup__row-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--color-accent), #60a5fa);
}

.module-mockup__row-pct {
  font-weight: 600;
  color: var(--color-text-muted);
  text-align: right;
}

.module-mockup--allocation .module-mockup__alloc {
  padding: var(--space-lg);
}

.module-alloc-head {
  display: grid;
  grid-template-columns: 1fr auto;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-muted);
  margin-bottom: var(--space-md);
  padding-bottom: var(--space-sm);
  border-bottom: 1px solid var(--color-border);
}

.module-alloc-row {
  display: grid;
  grid-template-columns: 6.5rem 1fr 2.5rem;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}

.module-alloc-row:last-of-type {
  margin-bottom: var(--space-md);
}

.module-alloc-row__name {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text);
}

.module-alloc-row__bar-wrap {
  height: 10px;
  background: #e2e8f0;
  border-radius: 999px;
  overflow: hidden;
}

.module-alloc-row__bar {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2563eb, #6366f1);
}

.module-alloc-row__bar--2 {
  background: linear-gradient(90deg, #4f46e5, #818cf8);
}

.module-alloc-row__bar--3 {
  background: linear-gradient(90deg, #0d9488, #2dd4bf);
}

.module-alloc-row__bar--4 {
  background: linear-gradient(90deg, #64748b, #94a3b8);
}

.module-alloc-row__val {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--color-accent);
  text-align: right;
}

.module-alloc-foot {
  margin: 0;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  padding-top: var(--space-sm);
  border-top: 1px solid var(--color-border);
}

.module-split {
  display: grid;
  gap: var(--space-2xl);
  align-items: center;
}

@media (min-width: 1024px) {
  .module-split {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-3xl);
  }
}

.module-split__title {
  margin-bottom: var(--space-lg);
}

.module-split__body {
  margin: 0;
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--color-text-muted);
}

.module-value-list {
  margin: var(--space-xl) 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.module-value-list li {
  position: relative;
  padding-left: 1.5rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-text);
}

.module-value-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: var(--color-accent);
  box-shadow: 0 0 0 3px var(--color-accent-subtle);
}

.module-capabilities__intro {
  margin-bottom: var(--space-xl);
  max-width: 40rem;
}

.module-feature-grid {
  display: grid;
  gap: var(--space-lg);
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .module-feature-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .module-feature-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-md);
  }
}

.module-feature-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
  box-shadow: var(--shadow-card);
  transition: box-shadow 0.2s var(--ease), border-color 0.2s var(--ease);
}

.module-feature-card:hover {
  box-shadow: var(--shadow-card-hover);
  border-color: var(--color-accent-ring);
}

.module-feature-card__title {
  margin: 0 0 var(--space-sm);
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.3;
  color: var(--color-text);
}

.module-feature-card__body {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text-muted);
}

.module-cta__intro .section-title {
  max-width: 28rem;
  margin-inline: auto;
}

.module-cta__intro .lead {
  max-width: 36rem;
}

/* --- Module landings: CMDB & Vault (shared layout) --- */
.module-cmdb .module-split__copy,
.module-vault .module-split__copy,
.module-monitoring .module-split__copy,
.module-cloud-control .module-split__copy,
.module-resilience .module-split__copy {
  max-width: 36rem;
}

.module-cmdb .module-capabilities__intro,
.module-vault .module-capabilities__intro,
.module-monitoring .module-capabilities__intro,
.module-cloud-control .module-capabilities__intro,
.module-resilience .module-capabilities__intro {
  max-width: 36rem;
}

.module-cmdb .module-hero__figure {
  aspect-ratio: 1024 / 658;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.module-monitoring .module-hero__figure,
.module-cloud-control .module-hero__figure,
.module-resilience .module-hero__figure {
  aspect-ratio: 1024 / 682;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.module-vault-hero__duo {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-md);
  width: 100%;
  min-width: 0;
}

@media (min-width: 640px) {
  .module-vault-hero__duo {
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
  }
}

.module-vault .module-vault-hero__duo > .module-hero__figure {
  aspect-ratio: 1024 / 998;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  line-height: 0;
}

.module-cmdb .module-hero__img,
.module-vault .module-hero__img,
.module-monitoring .module-hero__img,
.module-cloud-control .module-hero__img,
.module-resilience .module-hero__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.module-cmdb .module-split__figure,
.module-vault .module-split__figure {
  aspect-ratio: 1024 / 682;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.module-monitoring .module-split__figure--monitoring-live {
  aspect-ratio: 1024 / 682;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.module-cmdb .module-split__img,
.module-vault .module-split__img,
.module-monitoring .module-split__figure--monitoring-live .module-split__img,
.module-cloud-control .module-split__figure--cloud-control-drift .module-split__img,
.module-cloud-control .module-split__figure--cloud-control-coverage .module-split__img,
.module-resilience .module-split__figure--resilience-projects .module-split__img,
.module-resilience .module-split__figure--resilience-maintenance .module-split__img,
.module-resilience .module-split__figure--cyber-exercises-plan .module-split__img,
.module-resilience .module-split__figure--cyber-exercises-run .module-split__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.module-resilience .module-split__figure--cyber-exercises-plan {
  aspect-ratio: 1024 / 507;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.module-resilience .module-split__figure--cyber-exercises-run {
  aspect-ratio: 1024 / 687;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.module-vault .module-split__figure .vault-mock {
  flex: 1;
  align-self: stretch;
  min-height: 0;
  width: 100%;
  border: none;
  box-shadow: none;
  border-radius: 0;
}

.module-cmdb .module-feature-grid,
.module-vault .module-feature-grid,
.module-monitoring .module-feature-grid,
.module-cloud-control .module-feature-grid,
.module-resilience .module-feature-grid {
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .module-cmdb .module-feature-grid,
  .module-vault .module-feature-grid,
  .module-monitoring .module-feature-grid,
  .module-cloud-control .module-feature-grid,
  .module-resilience .module-feature-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .module-cmdb .module-feature-grid,
  .module-vault .module-feature-grid,
  .module-monitoring .module-feature-grid,
  .module-cloud-control .module-feature-grid,
  .module-resilience .module-feature-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-lg);
  }
}

/* Vault module landing (FinOps-style pattern) */
.module-vault .module-feature-grid.module-feature-grid--vault {
  align-items: stretch;
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .module-vault .module-feature-grid.module-feature-grid--vault {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .module-vault .module-feature-grid.module-feature-grid--vault {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-md);
  }
}

.module-vault .module-hero__figure--vault-panel {
  border-radius: var(--radius-xl);
  border-color: #d1d9e6;
  box-shadow:
    0 22px 48px -14px rgba(15, 23, 42, 0.18),
    0 0 0 1px rgba(15, 23, 42, 0.07),
    0 0 40px -12px rgba(37, 99, 235, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  outline: 1px solid rgba(255, 255, 255, 0.08);
  outline-offset: -1px;
}

.module-vault .module-vault-why {
  padding-block: calc(var(--space-3xl) + 0.35rem);
  border-bottom: 1px solid rgba(226, 232, 240, 0.85);
}

.module-vault .module-split__copy--vault-why .module-split__title {
  margin-bottom: var(--space-md);
}

.module-vault .module-split__body--vault-why {
  max-width: 38rem;
  font-size: 1.03rem;
  line-height: 1.62;
  color: #475569;
}

.module-vault .module-split__visual-col {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
}

.module-vault .module-split__micro-label,
.module-vault .module-split__micro-label--vault {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--color-accent-hover);
  padding: 0.5rem 0.85rem;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(37, 99, 235, 0.2);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  width: fit-content;
  max-width: 100%;
}

.module-vault .module-vault-why .module-split__figure {
  border-radius: var(--radius-xl);
  border-color: #cfd8e6;
  box-shadow:
    0 14px 36px -12px rgba(15, 23, 42, 0.14),
    0 0 0 1px rgba(15, 23, 42, 0.06);
}

.module-vault .module-capabilities__intro--vault {
  max-width: 44rem;
  margin-bottom: calc(var(--space-2xl) + 0.25rem);
  padding-bottom: var(--space-lg);
  border-bottom: 1px solid rgba(148, 163, 184, 0.35);
}

.module-vault .module-capabilities__intro--vault .section-title {
  margin-bottom: var(--space-md);
}

.module-vault .module-capabilities__lead--vault {
  margin-top: var(--space-md);
  max-width: 38rem;
  font-size: 1.0625rem;
  line-height: 1.58;
  color: var(--color-text-muted);
}

.module-vault .module-feature-card--vault {
  display: flex;
  flex-direction: column;
  min-height: 12.5rem;
  padding: var(--space-xl);
  border-radius: var(--radius-xl);
  border-color: #d5dde8;
  box-shadow:
    0 2px 4px rgba(15, 23, 42, 0.04),
    0 12px 28px -10px rgba(15, 23, 42, 0.09);
  transition:
    box-shadow 0.22s var(--ease),
    border-color 0.22s var(--ease),
    transform 0.2s var(--ease);
}

.module-vault .module-feature-card--vault:hover {
  transform: translateY(-3px);
  border-color: var(--color-accent-ring);
  box-shadow:
    0 8px 20px rgba(15, 23, 42, 0.08),
    0 16px 36px -12px rgba(37, 99, 235, 0.12);
}

.module-vault .module-feature-card--vault .module-feature-card__icon {
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-md);
  background: linear-gradient(
    145deg,
    rgba(37, 99, 235, 0.12) 0%,
    rgba(37, 99, 235, 0.06) 100%
  );
  color: var(--color-accent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.module-vault .module-feature-card--vault .module-feature-card__title {
  font-size: 1.0625rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  margin-bottom: var(--space-sm);
}

.module-vault .module-feature-card--vault .module-feature-card__body {
  flex: 1;
  max-width: 22rem;
  font-size: 0.9375rem;
  line-height: 1.58;
}

@media (prefers-reduced-motion: reduce) {
  .module-vault .module-feature-card--vault:hover {
    transform: none;
  }
}

.module-vault .module-vault-practical {
  padding-block: calc(var(--space-3xl) + 0.35rem);
  border-block: 1px solid var(--color-border);
}

@media (max-width: 1023px) {
  .module-vault .module-split--vault-practical .module-split__copy--vault-practical {
    order: -1;
  }
}

.module-vault .module-split--vault-practical .module-split__title {
  margin-bottom: var(--space-md);
}

.module-vault .module-split--vault-practical .module-split__body {
  max-width: 36rem;
  font-size: 1.03rem;
  line-height: 1.6;
  color: #475569;
}

.module-vault .module-vault-practical .module-split__figure {
  border-radius: var(--radius-xl);
  border-color: #cfd8e6;
  box-shadow:
    0 18px 44px -14px rgba(15, 23, 42, 0.16),
    0 0 0 1px rgba(15, 23, 42, 0.06);
}

@media (min-width: 1024px) {
  .module-vault .module-vault-practical .module-split__figure--vault-audit {
    transform: scale(1.02);
    transform-origin: center left;
  }
}

.module-vault .module-value-list--vault {
  margin-top: var(--space-xl);
  gap: var(--space-md);
}

.module-vault .module-value-list--vault li {
  font-size: 0.96875rem;
  font-weight: 600;
  padding-left: 1.65rem;
}

.module-vault .module-value-list--vault li::before {
  top: 0.42em;
}

.module-vault .module-vault-how {
  padding-block: calc(var(--space-3xl) + 0.25rem);
  background: linear-gradient(180deg, var(--color-bg-muted) 0%, #e8edf5 100%);
  border-block: 1px solid var(--color-border);
}

.module-vault .module-vault-how__intro {
  margin-bottom: var(--space-2xl);
}

.module-vault .module-vault-how__intro .section-title {
  margin-bottom: 0;
  max-width: 34rem;
  margin-inline: auto;
}

.module-vault .final-cta--module-vault {
  position: relative;
  overflow: hidden;
  padding-block: calc(var(--space-3xl) + 0.75rem);
  background:
    radial-gradient(ellipse 85% 70% at 50% -20%, rgba(37, 99, 235, 0.11), transparent 52%),
    linear-gradient(180deg, #ffffff 0%, #eef2f9 55%, #e2e8f0 100%);
  border-top: 1px solid var(--color-border);
}

.module-vault .final-cta--module-vault::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.45) 50%, transparent 100%);
  opacity: 0.45;
  pointer-events: none;
}

.module-vault .final-cta--module-vault .final-cta__inner {
  position: relative;
  z-index: 1;
}

.module-vault .final-cta__proof-list--vault {
  list-style: none;
  margin: 0 0 var(--space-xl);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  justify-content: center;
  max-width: 52rem;
  margin-inline: auto;
}

.module-vault .final-cta__proof-list--vault li {
  margin: 0;
  padding: 0.4rem 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.module-vault .final-cta--module-vault h2 {
  font-size: clamp(1.5rem, 2.2vw + 0.72rem, 2.05rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  max-width: 22rem;
  margin-inline: auto;
  margin-bottom: var(--space-md);
}

@media (min-width: 640px) {
  .module-vault .final-cta--module-vault h2 {
    max-width: 30rem;
  }
}

.module-vault .final-cta--module-vault p {
  font-size: 1.0625rem;
  line-height: 1.62;
  max-width: 33rem;
  margin-inline: auto;
  margin-bottom: var(--space-2xl);
  color: #526177;
}

.module-vault .final-cta--module-vault .final-cta__actions {
  gap: var(--space-md) var(--space-lg);
}

.module-vault .final-cta--module-vault .btn--lg {
  min-height: 3rem;
  padding-inline: 1.65rem;
}

.module-vault .final-cta--module-vault .btn--primary {
  box-shadow:
    0 2px 6px rgba(37, 99, 235, 0.35),
    0 1px 2px rgba(15, 23, 42, 0.06);
}

.module-vault .final-cta--module-vault .btn--primary:hover {
  box-shadow:
    0 10px 28px rgba(37, 99, 235, 0.38),
    0 2px 6px rgba(15, 23, 42, 0.08);
}

/* CMDB module landing (FinOps / Vault pattern) */
.module-cmdb .module-feature-grid.module-feature-grid--cmdb,
.module-monitoring .module-feature-grid.module-feature-grid--monitoring,
.module-cloud-control .module-feature-grid.module-feature-grid--cloud-control,
.module-resilience .module-feature-grid.module-feature-grid--resilience {
  align-items: stretch;
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .module-cmdb .module-feature-grid.module-feature-grid--cmdb,
  .module-monitoring .module-feature-grid.module-feature-grid--monitoring,
  .module-cloud-control .module-feature-grid.module-feature-grid--cloud-control,
  .module-resilience .module-feature-grid.module-feature-grid--resilience {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .module-cmdb .module-feature-grid.module-feature-grid--cmdb,
  .module-monitoring .module-feature-grid.module-feature-grid--monitoring,
  .module-resilience .module-feature-grid.module-feature-grid--resilience {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-md);
  }

  .module-cloud-control .module-feature-grid.module-feature-grid--cloud-control {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-md);
  }
}

.module-cmdb .module-hero__figure--cmdb {
  border-radius: var(--radius-xl);
  border-color: #d1d9e6;
  box-shadow:
    0 28px 56px -16px rgba(15, 23, 42, 0.22),
    0 0 0 1px rgba(15, 23, 42, 0.07),
    0 0 48px -12px rgba(37, 99, 235, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  outline: 1px solid rgba(255, 255, 255, 0.1);
  outline-offset: -1px;
  transition: box-shadow 0.25s var(--ease), transform 0.25s var(--ease);
}

.module-cmdb .module-hero__figure--cmdb:hover {
  box-shadow:
    0 34px 68px -18px rgba(15, 23, 42, 0.24),
    0 0 0 1px rgba(37, 99, 235, 0.14),
    0 0 56px -10px rgba(37, 99, 235, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  .module-cmdb .module-hero__figure--cmdb:hover {
    transform: none;
  }
}

.module-monitoring .module-hero__figure--monitoring {
  border-radius: var(--radius-xl);
  border: 1px solid #d1d9e6;
  box-shadow:
    0 28px 56px -16px rgba(15, 23, 42, 0.22),
    0 0 0 1px rgba(15, 23, 42, 0.07),
    0 0 48px -12px rgba(37, 99, 235, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  outline: 1px solid rgba(255, 255, 255, 0.1);
  outline-offset: -1px;
  transition: box-shadow 0.25s var(--ease), transform 0.25s var(--ease);
}

.module-monitoring .module-hero__figure--monitoring:hover {
  box-shadow:
    0 34px 68px -18px rgba(15, 23, 42, 0.24),
    0 0 0 1px rgba(37, 99, 235, 0.14),
    0 0 56px -10px rgba(37, 99, 235, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  .module-monitoring .module-hero__figure--monitoring:hover {
    transform: none;
  }
}

.module-cloud-control .module-hero__figure--cloud-control,
.module-resilience .module-hero__figure--resilience {
  border-radius: var(--radius-xl);
  border: 1px solid #d1d9e6;
  box-shadow:
    0 28px 56px -16px rgba(15, 23, 42, 0.22),
    0 0 0 1px rgba(15, 23, 42, 0.07),
    0 0 48px -12px rgba(37, 99, 235, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  outline: 1px solid rgba(255, 255, 255, 0.1);
  outline-offset: -1px;
  transition: box-shadow 0.25s var(--ease), transform 0.25s var(--ease);
}

.module-cloud-control .module-hero__figure--cloud-control:hover,
.module-resilience .module-hero__figure--resilience:hover {
  box-shadow:
    0 34px 68px -18px rgba(15, 23, 42, 0.24),
    0 0 0 1px rgba(37, 99, 235, 0.14),
    0 0 56px -10px rgba(37, 99, 235, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  .module-cloud-control .module-hero__figure--cloud-control:hover,
  .module-resilience .module-hero__figure--resilience:hover {
    transform: none;
  }
}

.module-cmdb .module-split__visual-col,
.module-monitoring .module-split__visual-col,
.module-cloud-control .module-split__visual-col,
.module-resilience .module-split__visual-col {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
}

.module-cmdb .module-cmdb-why,
.module-monitoring .module-monitoring-servicemap {
  padding-block: calc(var(--space-3xl) + 0.35rem);
  border-bottom: 1px solid rgba(226, 232, 240, 0.85);
}

.module-monitoring .module-monitoring-livemode {
  padding-block: calc(var(--space-3xl) + 0.35rem);
  border-block: 1px solid var(--color-border);
}

@media (max-width: 1023px) {
  .module-monitoring .module-split--monitoring-livemode .module-split__copy--monitoring-livemode {
    order: -1;
  }
}

.module-cmdb .module-split__copy--cmdb-why .module-split__title,
.module-monitoring .module-split__copy--monitoring-servicemap .module-split__title,
.module-monitoring .module-split__copy--monitoring-livemode .module-split__title,
.module-cloud-control .module-split__copy--cloud-control-drift .module-split__title,
.module-cloud-control .module-split__copy--cloud-control-coverage .module-split__title,
.module-resilience .module-split__copy--resilience-projects .module-split__title,
.module-resilience .module-split__copy--resilience-maintenance .module-split__title,
.module-resilience .module-split__copy--cyber-exercises-plan .module-split__title,
.module-resilience .module-split__copy--cyber-exercises-run .module-split__title {
  margin-bottom: var(--space-md);
}

.module-cmdb .module-split__body--cmdb-why,
.module-monitoring .module-split__body--monitoring-servicemap,
.module-monitoring .module-split__body--monitoring-livemode,
.module-cloud-control .module-split__body--cloud-control-drift,
.module-cloud-control .module-split__body--cloud-control-coverage,
.module-resilience .module-split__body--resilience-projects,
.module-resilience .module-split__body--resilience-maintenance,
.module-resilience .module-split__body--cyber-exercises-plan,
.module-resilience .module-split__body--cyber-exercises-run {
  max-width: 38rem;
  font-size: 1.03rem;
  line-height: 1.62;
  color: #475569;
}

.module-monitoring
  .module-split__body--monitoring-servicemap
  + .module-split__body--monitoring-servicemap,
.module-monitoring
  .module-split__body--monitoring-livemode
  + .module-split__body--monitoring-livemode,
.module-cloud-control
  .module-split__body--cloud-control-drift
  + .module-split__body--cloud-control-drift,
.module-cloud-control
  .module-split__body--cloud-control-coverage
  + .module-split__body--cloud-control-coverage,
.module-resilience
  .module-split__body--resilience-projects
  + .module-split__body--resilience-projects {
  margin-top: var(--space-md);
}

.module-cmdb .module-split__micro-label--cmdb,
.module-monitoring .module-split__micro-label--monitoring,
.module-cloud-control .module-split__micro-label--cloud-control,
.module-resilience .module-split__micro-label--resilience {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--color-accent-hover);
  padding: 0.5rem 0.85rem;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(37, 99, 235, 0.2);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  width: fit-content;
  max-width: 100%;
}

.module-cmdb .module-cmdb-why .module-split__figure,
.module-monitoring .module-monitoring-servicemap .module-split__figure--monitoring-servicemap,
.module-monitoring .module-monitoring-livemode .module-split__figure--monitoring-live,
.module-cloud-control .module-cloud-control-drift .module-split__figure--cloud-control-drift,
.module-resilience .module-resilience-projects .module-split__figure--resilience-projects {
  border-radius: var(--radius-xl);
  border: 1px solid var(--color-border);
  border-color: #cfd8e6;
  box-shadow:
    0 14px 36px -12px rgba(15, 23, 42, 0.14),
    0 0 0 1px rgba(15, 23, 42, 0.06);
}

.module-monitoring .module-monitoring-livemode .module-split__figure--monitoring-live {
  box-shadow:
    0 18px 44px -14px rgba(15, 23, 42, 0.16),
    0 0 0 1px rgba(15, 23, 42, 0.06);
}

@media (min-width: 1024px) {
  .module-monitoring .module-monitoring-livemode .module-split__figure--monitoring-live {
    transform: scale(1.02);
    transform-origin: center left;
  }
}

.module-cmdb .module-capabilities__intro--cmdb,
.module-monitoring .module-capabilities__intro--monitoring,
.module-cloud-control .module-capabilities__intro--cloud-control,
.module-resilience .module-capabilities__intro--resilience {
  max-width: 44rem;
  margin-bottom: calc(var(--space-2xl) + 0.25rem);
  padding-bottom: var(--space-lg);
  border-bottom: 1px solid rgba(148, 163, 184, 0.35);
}

.module-cmdb .module-capabilities__intro--cmdb .section-title,
.module-monitoring .module-capabilities__intro--monitoring .section-title,
.module-cloud-control .module-capabilities__intro--cloud-control .section-title,
.module-resilience .module-capabilities__intro--resilience .section-title {
  margin-bottom: var(--space-md);
}

.module-cmdb .module-capabilities__lead--cmdb,
.module-monitoring .module-capabilities__lead--monitoring,
.module-cloud-control .module-capabilities__lead--cloud-control,
.module-resilience .module-capabilities__lead--resilience {
  margin-top: var(--space-md);
  max-width: 38rem;
  font-size: 1.0625rem;
  line-height: 1.58;
  color: var(--color-text-muted);
}

.module-cmdb .module-feature-card--cmdb,
.module-monitoring .module-feature-card--monitoring {
  display: flex;
  flex-direction: column;
  min-height: 12.5rem;
  padding: var(--space-xl);
  border-radius: var(--radius-xl);
  border-color: #d5dde8;
  box-shadow:
    0 2px 4px rgba(15, 23, 42, 0.04),
    0 12px 28px -10px rgba(15, 23, 42, 0.09);
  transition:
    box-shadow 0.22s var(--ease),
    border-color 0.22s var(--ease),
    transform 0.2s var(--ease);
}

.module-cmdb .module-feature-card--cmdb:hover,
.module-monitoring .module-feature-card--monitoring:hover {
  transform: translateY(-3px);
  border-color: var(--color-accent-ring);
  box-shadow:
    0 8px 20px rgba(15, 23, 42, 0.08),
    0 16px 36px -12px rgba(37, 99, 235, 0.12);
}

.module-cmdb .module-feature-card--cmdb .module-feature-card__icon,
.module-monitoring .module-feature-card--monitoring .module-feature-card__icon {
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-md);
  background: linear-gradient(
    145deg,
    rgba(37, 99, 235, 0.12) 0%,
    rgba(37, 99, 235, 0.06) 100%
  );
  color: var(--color-accent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.module-cmdb .module-feature-card--cmdb .module-feature-card__title,
.module-monitoring .module-feature-card--monitoring .module-feature-card__title {
  font-size: 1.0625rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  margin-bottom: var(--space-sm);
}

.module-cmdb .module-feature-card--cmdb .module-feature-card__body,
.module-monitoring .module-feature-card--monitoring .module-feature-card__body {
  flex: 1;
  max-width: 22rem;
  font-size: 0.9375rem;
  line-height: 1.58;
}

@media (prefers-reduced-motion: reduce) {
  .module-cmdb .module-feature-card--cmdb:hover,
  .module-monitoring .module-feature-card--monitoring:hover {
    transform: none;
  }
}

.module-cmdb .module-cmdb-practical {
  padding-block: calc(var(--space-3xl) + 0.35rem);
  border-block: 1px solid var(--color-border);
}

@media (max-width: 1023px) {
  .module-cmdb .module-split--cmdb-practical .module-split__copy--cmdb-practical {
    order: -1;
  }
}

.module-cmdb .module-split--cmdb-practical .module-split__title {
  margin-bottom: var(--space-md);
}

.module-cmdb .module-split--cmdb-practical .module-split__body {
  max-width: 36rem;
  font-size: 1.03rem;
  line-height: 1.6;
  color: #475569;
}

.module-cmdb .module-cmdb-practical .module-split__figure {
  border-radius: var(--radius-xl);
  border-color: #cfd8e6;
  box-shadow:
    0 18px 44px -14px rgba(15, 23, 42, 0.16),
    0 0 0 1px rgba(15, 23, 42, 0.06);
}

@media (min-width: 1024px) {
  .module-cmdb .module-cmdb-practical .module-split__figure--cmdb-ci {
    transform: scale(1.02);
    transform-origin: center left;
  }
}

.module-cmdb .module-value-list--cmdb {
  margin-top: var(--space-xl);
  gap: var(--space-md);
}

.module-cmdb .module-value-list--cmdb li {
  font-size: 0.96875rem;
  font-weight: 600;
  padding-left: 1.65rem;
}

.module-cmdb .module-value-list--cmdb li::before {
  top: 0.42em;
}

.module-cmdb .module-cmdb-how {
  padding-block: calc(var(--space-3xl) + 0.25rem);
  background: linear-gradient(180deg, var(--color-bg-muted) 0%, #e8edf5 100%);
  border-block: 1px solid var(--color-border);
}

.module-cmdb .module-cmdb-how__intro {
  margin-bottom: var(--space-2xl);
}

.module-cmdb .module-cmdb-how__intro .section-title {
  margin-bottom: 0;
  max-width: 34rem;
  margin-inline: auto;
}

.module-monitoring .module-monitoring-how {
  padding-block: calc(var(--space-3xl) + 0.25rem);
  background: linear-gradient(180deg, var(--color-bg-muted) 0%, #e8edf5 100%);
  border-block: 1px solid var(--color-border);
}

.module-monitoring .module-monitoring-how__intro {
  margin-bottom: var(--space-2xl);
}

.module-monitoring .module-monitoring-how__intro .section-title {
  margin-bottom: 0;
  max-width: 34rem;
  margin-inline: auto;
}

.module-cmdb .final-cta--module-cmdb {
  position: relative;
  overflow: hidden;
  padding-block: calc(var(--space-3xl) + 0.75rem);
  background:
    radial-gradient(ellipse 85% 70% at 50% -20%, rgba(37, 99, 235, 0.11), transparent 52%),
    linear-gradient(180deg, #ffffff 0%, #eef2f9 55%, #e2e8f0 100%);
  border-top: 1px solid var(--color-border);
}

.module-cmdb .final-cta--module-cmdb::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.45) 50%, transparent 100%);
  opacity: 0.45;
  pointer-events: none;
}

.module-cmdb .final-cta--module-cmdb .final-cta__inner {
  position: relative;
  z-index: 1;
}

.module-cmdb .final-cta__proof-list--cmdb {
  list-style: none;
  margin: 0 0 var(--space-xl);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  justify-content: center;
  max-width: 52rem;
  margin-inline: auto;
}

.module-cmdb .final-cta__proof-list--cmdb li {
  margin: 0;
  padding: 0.4rem 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.module-cmdb .final-cta--module-cmdb h2 {
  font-size: clamp(1.5rem, 2.2vw + 0.72rem, 2.05rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  max-width: 26rem;
  margin-inline: auto;
  margin-bottom: var(--space-md);
}

@media (min-width: 640px) {
  .module-cmdb .final-cta--module-cmdb h2 {
    max-width: 34rem;
  }
}

.module-cmdb .final-cta--module-cmdb p {
  font-size: 1.0625rem;
  line-height: 1.62;
  max-width: 33rem;
  margin-inline: auto;
  margin-bottom: var(--space-2xl);
  color: #526177;
}

.module-cmdb .final-cta--module-cmdb .final-cta__actions {
  gap: var(--space-md) var(--space-lg);
}

.module-cmdb .final-cta--module-cmdb .btn--lg {
  min-height: 3rem;
  padding-inline: 1.65rem;
}

.module-cmdb .final-cta--module-cmdb .btn--primary {
  box-shadow:
    0 2px 6px rgba(37, 99, 235, 0.35),
    0 1px 2px rgba(15, 23, 42, 0.06);
}

.module-cmdb .final-cta--module-cmdb .btn--primary:hover {
  box-shadow:
    0 10px 28px rgba(37, 99, 235, 0.38),
    0 2px 6px rgba(15, 23, 42, 0.08);
}

.module-monitoring .final-cta--module-monitoring {
  position: relative;
  overflow: hidden;
  padding-block: calc(var(--space-3xl) + 0.75rem);
  background:
    radial-gradient(ellipse 85% 70% at 50% -20%, rgba(37, 99, 235, 0.11), transparent 52%),
    linear-gradient(180deg, #ffffff 0%, #eef2f9 55%, #e2e8f0 100%);
  border-top: 1px solid var(--color-border);
}

.module-monitoring .final-cta--module-monitoring::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.45) 50%, transparent 100%);
  opacity: 0.45;
  pointer-events: none;
}

.module-monitoring .final-cta--module-monitoring .final-cta__inner {
  position: relative;
  z-index: 1;
}

.module-monitoring .final-cta__proof-list--monitoring {
  list-style: none;
  margin: 0 0 var(--space-xl);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  justify-content: center;
  max-width: 52rem;
  margin-inline: auto;
}

.module-monitoring .final-cta__proof-list--monitoring li {
  margin: 0;
  padding: 0.4rem 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.module-monitoring .final-cta--module-monitoring h2 {
  font-size: clamp(1.5rem, 2.2vw + 0.72rem, 2.05rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  max-width: 26rem;
  margin-inline: auto;
  margin-bottom: var(--space-md);
}

@media (min-width: 640px) {
  .module-monitoring .final-cta--module-monitoring h2 {
    max-width: 34rem;
  }
}

.module-monitoring .final-cta--module-monitoring p {
  font-size: 1.0625rem;
  line-height: 1.62;
  max-width: 33rem;
  margin-inline: auto;
  margin-bottom: var(--space-2xl);
  color: #526177;
}

.module-monitoring .final-cta--module-monitoring .final-cta__actions {
  gap: var(--space-md) var(--space-lg);
}

.module-monitoring .final-cta--module-monitoring .btn--lg {
  min-height: 3rem;
  padding-inline: 1.65rem;
}

.module-monitoring .final-cta--module-monitoring .btn--primary {
  box-shadow:
    0 2px 6px rgba(37, 99, 235, 0.35),
    0 1px 2px rgba(15, 23, 42, 0.06);
}

.module-monitoring .final-cta--module-monitoring .btn--primary:hover {
  box-shadow:
    0 10px 28px rgba(37, 99, 235, 0.38),
    0 2px 6px rgba(15, 23, 42, 0.08);
}

/* Cloud Control module landing */
.module-cloud-control .module-cloud-control-drift,
.module-resilience .module-resilience-projects {
  padding-block: calc(var(--space-3xl) + 0.35rem);
  border-bottom: 1px solid rgba(226, 232, 240, 0.85);
}

.module-cloud-control .module-cloud-control-coverage,
.module-resilience .module-resilience-maintenance {
  padding-block: calc(var(--space-3xl) + 0.35rem);
  border-block: 1px solid var(--color-border);
}

@media (max-width: 1023px) {
  .module-cloud-control .module-split--cloud-control-coverage .module-split__copy--cloud-control-coverage,
  .module-resilience .module-split--resilience-maintenance .module-split__copy--resilience-maintenance {
    order: -1;
  }
}

.module-cloud-control .module-cloud-control-coverage .module-split__figure--cloud-control-coverage,
.module-resilience .module-resilience-maintenance .module-split__figure--resilience-maintenance {
  border-radius: var(--radius-xl);
  border: 1px solid var(--color-border);
  border-color: #cfd8e6;
  box-shadow:
    0 18px 44px -14px rgba(15, 23, 42, 0.16),
    0 0 0 1px rgba(15, 23, 42, 0.06);
}

@media (min-width: 1024px) {
  .module-cloud-control .module-cloud-control-coverage .module-split__figure--cloud-control-coverage,
  .module-resilience .module-resilience-maintenance .module-split__figure--resilience-maintenance {
    transform: scale(1.02);
    transform-origin: center left;
  }
}

.module-cloud-control .module-split__figure--cloud-control-drift {
  aspect-ratio: 1024 / 592;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.module-cloud-control .module-split__figure--cloud-control-coverage {
  aspect-ratio: 1024 / 682;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.module-resilience .module-split__figure--resilience-projects {
  aspect-ratio: 1024 / 587;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.module-resilience .module-split__figure--resilience-maintenance {
  aspect-ratio: 1024 / 584;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.module-cloud-control .module-feature-card--cloud-control,
.module-resilience .module-feature-card--resilience {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: var(--space-xl);
  border-radius: var(--radius-xl);
  border-color: #d5dde8;
  box-shadow:
    0 2px 4px rgba(15, 23, 42, 0.04),
    0 12px 28px -10px rgba(15, 23, 42, 0.09);
  transition:
    box-shadow 0.22s var(--ease),
    border-color 0.22s var(--ease),
    transform 0.2s var(--ease);
}

.module-cloud-control .module-feature-card--cloud-control:hover,
.module-resilience .module-feature-card--resilience:hover {
  transform: translateY(-3px);
  border-color: var(--color-accent-ring);
  box-shadow:
    0 8px 20px rgba(15, 23, 42, 0.08),
    0 16px 36px -12px rgba(37, 99, 235, 0.12);
}

.module-cloud-control .module-feature-card--cloud-control .module-feature-card__icon,
.module-resilience .module-feature-card--resilience .module-feature-card__icon {
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-md);
  background: linear-gradient(
    145deg,
    rgba(37, 99, 235, 0.12) 0%,
    rgba(37, 99, 235, 0.06) 100%
  );
  color: var(--color-accent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.module-cloud-control .module-feature-card--cloud-control .module-feature-card__title,
.module-resilience .module-feature-card--resilience .module-feature-card__title {
  font-size: 1.0625rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  margin-bottom: var(--space-sm);
}

.module-cloud-control .module-feature-card--cloud-control .module-feature-card__body,
.module-resilience .module-feature-card--resilience .module-feature-card__body {
  flex: 1;
  max-width: none;
  font-size: 0.9375rem;
  line-height: 1.58;
}

.module-cloud-control .module-feature-card--cloud-control .module-feature-card__body + .module-feature-card__body,
.module-resilience .module-feature-card--resilience .module-feature-card__body + .module-feature-card__body {
  margin-top: var(--space-sm);
}

@media (prefers-reduced-motion: reduce) {
  .module-cloud-control .module-feature-card--cloud-control:hover,
  .module-resilience .module-feature-card--resilience:hover {
    transform: none;
  }
}

.module-cloud-control .module-cloud-control-how,
.module-resilience .module-resilience-how {
  padding-block: calc(var(--space-3xl) + 0.25rem);
  background: linear-gradient(180deg, var(--color-bg-muted) 0%, #e8edf5 100%);
  border-block: 1px solid var(--color-border);
}

.module-cloud-control .module-cloud-control-how__intro,
.module-resilience .module-resilience-how__intro {
  margin-bottom: var(--space-2xl);
}

.module-cloud-control .module-cloud-control-how__intro .section-title,
.module-resilience .module-resilience-how__intro .section-title {
  margin-bottom: 0;
  max-width: 34rem;
  margin-inline: auto;
}

.module-cloud-control .final-cta--module-cloud-control,
.module-resilience .final-cta--module-resilience {
  position: relative;
  overflow: hidden;
  padding-block: calc(var(--space-3xl) + 0.75rem);
  background:
    radial-gradient(ellipse 85% 70% at 50% -20%, rgba(37, 99, 235, 0.11), transparent 52%),
    linear-gradient(180deg, #ffffff 0%, #eef2f9 55%, #e2e8f0 100%);
  border-top: 1px solid var(--color-border);
}

.module-cloud-control .final-cta--module-cloud-control::before,
.module-resilience .final-cta--module-resilience::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.45) 50%, transparent 100%);
  opacity: 0.45;
  pointer-events: none;
}

.module-cloud-control .final-cta--module-cloud-control .final-cta__inner,
.module-resilience .final-cta--module-resilience .final-cta__inner {
  position: relative;
  z-index: 1;
}

.module-cloud-control .final-cta__proof-list--cloud-control,
.module-resilience .final-cta__proof-list--resilience {
  list-style: none;
  margin: 0 0 var(--space-xl);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  justify-content: center;
  max-width: 52rem;
  margin-inline: auto;
}

.module-cloud-control .final-cta__proof-list--cloud-control li,
.module-resilience .final-cta__proof-list--resilience li {
  margin: 0;
  padding: 0.4rem 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.module-cloud-control .final-cta--module-cloud-control h2,
.module-resilience .final-cta--module-resilience h2 {
  font-size: clamp(1.5rem, 2.2vw + 0.72rem, 2.05rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  max-width: 26rem;
  margin-inline: auto;
  margin-bottom: var(--space-md);
}

@media (min-width: 640px) {
  .module-cloud-control .final-cta--module-cloud-control h2,
  .module-resilience .final-cta--module-resilience h2 {
    max-width: 34rem;
  }
}

.module-cloud-control .final-cta--module-cloud-control p,
.module-resilience .final-cta--module-resilience p {
  font-size: 1.0625rem;
  line-height: 1.62;
  max-width: 33rem;
  margin-inline: auto;
  margin-bottom: var(--space-2xl);
  color: #526177;
}

.module-cloud-control .final-cta--module-cloud-control .final-cta__actions,
.module-resilience .final-cta--module-resilience .final-cta__actions {
  gap: var(--space-md) var(--space-lg);
}

.module-cloud-control .final-cta--module-cloud-control .btn--lg,
.module-resilience .final-cta--module-resilience .btn--lg {
  min-height: 3rem;
  padding-inline: 1.65rem;
}

.module-cloud-control .final-cta--module-cloud-control .btn--primary,
.module-resilience .final-cta--module-resilience .btn--primary {
  box-shadow:
    0 2px 6px rgba(37, 99, 235, 0.35),
    0 1px 2px rgba(15, 23, 42, 0.06);
}

.module-cloud-control .final-cta--module-cloud-control .btn--primary:hover,
.module-resilience .final-cta--module-resilience .btn--primary:hover {
  box-shadow:
    0 10px 28px rgba(37, 99, 235, 0.38),
    0 2px 6px rgba(15, 23, 42, 0.08);
}

.cmdb-mock {
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  box-shadow: var(--shadow-browser);
  overflow: hidden;
}

.cmdb-mock .module-mockup__chrome {
  background: #eef2f7;
}

.cmdb-mock__panel {
  padding: var(--space-lg);
  background: linear-gradient(180deg, #fafbfc 0%, #f1f5f9 100%);
}

.cmdb-mock__panel--dark {
  background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
  color: #e2e8f0;
}

.cmdb-mock__panel--dark .cmdb-impact__label {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #94a3b8;
  margin: 0 0 var(--space-xs);
}

.cmdb-mock__panel--dark .cmdb-impact__root {
  margin: 0 0 var(--space-lg);
  font-size: 1.125rem;
  font-weight: 700;
  color: #f8fafc;
  font-family: ui-monospace, monospace;
}

.cmdb-impact__chain {
  list-style: none;
  margin: 0;
  padding: 0;
  border-left: 2px solid rgba(37, 99, 235, 0.5);
}

.cmdb-impact__item {
  position: relative;
  padding: var(--space-md) var(--space-md) var(--space-md) var(--space-lg);
}

.cmdb-impact__item:not(:last-child) {
  border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}

.cmdb-impact__dot {
  position: absolute;
  left: -5px;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-accent);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.25);
}

.cmdb-impact__item strong {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  color: #f1f5f9;
}

.cmdb-impact__item span {
  font-size: 0.75rem;
  color: #94a3b8;
}

.cmdb-impact__foot {
  margin: var(--space-lg) 0 0;
  padding-top: var(--space-md);
  border-top: 1px solid rgba(148, 163, 184, 0.25);
  font-size: 0.75rem;
  color: #94a3b8;
}

.cmdb-table {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: #fff;
}

.cmdb-table__row {
  display: grid;
  grid-template-columns: 1.2fr 0.9fr 1fr;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  font-size: 0.8125rem;
  align-items: center;
  border-bottom: 1px solid var(--color-border);
}

.cmdb-table__row:last-child {
  border-bottom: none;
}

.cmdb-table__row--head {
  background: #f1f5f9;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
}

.cmdb-table__mono {
  font-family: ui-monospace, monospace;
  font-weight: 600;
  color: var(--color-text);
}

.cmdb-table__links {
  color: var(--color-accent);
  font-weight: 500;
}

/* --- Vault UI mocks (platform/vault.html) --- */
.vault-mock {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  background: #0b1220;
}

.vault-mock .module-mockup__chrome {
  flex-shrink: 0;
}

.vault-mock__shell {
  display: flex;
  flex: 1;
  min-height: 0;
}

.vault-mock__sidebar {
  width: 30%;
  max-width: 11rem;
  min-width: 6.25rem;
  padding: var(--space-sm);
  border-right: 1px solid rgba(148, 163, 184, 0.14);
  background: rgba(15, 23, 42, 0.92);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.vault-mock__nav-label {
  font-size: 0.5625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
  margin: var(--space-xs) 0 4px;
  padding-left: 0.35rem;
}

.vault-mock__nav-item {
  font-size: 0.625rem;
  padding: 0.4rem 0.45rem;
  border-radius: 6px;
  color: #94a3b8;
  line-height: 1.3;
}

.vault-mock__nav-item--active {
  background: rgba(37, 99, 235, 0.22);
  color: #bfdbfe;
  font-weight: 600;
}

.vault-mock__main {
  flex: 1;
  min-width: 0;
  padding: var(--space-sm) var(--space-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.vault-mock__toolbar {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

.vault-mock__search {
  flex: 1;
  font-size: 0.625rem;
  padding: 0.4rem 0.55rem;
  border-radius: 6px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: rgba(30, 41, 59, 0.65);
  color: #64748b;
}

.vault-mock__pill {
  font-size: 0.5625rem;
  font-weight: 600;
  padding: 0.25rem 0.45rem;
  border-radius: 999px;
  background: rgba(99, 102, 241, 0.2);
  color: #c4b5fd;
  white-space: nowrap;
}

.vault-mock__list {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.vault-mock__row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.55rem;
  border-radius: 8px;
  background: rgba(30, 41, 59, 0.5);
  border: 1px solid rgba(148, 163, 184, 0.12);
}

.vault-mock__row-icon {
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 5px;
  background: linear-gradient(145deg, rgba(99, 102, 241, 0.35), rgba(37, 99, 235, 0.2));
  flex-shrink: 0;
  position: relative;
}

.vault-mock__row-icon::after {
  content: "";
  position: absolute;
  inset: 35% 28%;
  border: 1.5px solid rgba(226, 232, 240, 0.85);
  border-radius: 2px;
  border-bottom: none;
  border-right: none;
  transform: rotate(-45deg);
}

.vault-mock__row-text {
  flex: 1;
  min-width: 0;
}

.vault-mock__row-title {
  font-size: 0.6875rem;
  font-weight: 600;
  color: #e2e8f0;
  letter-spacing: -0.01em;
}

.vault-mock__row-meta {
  font-size: 0.5625rem;
  color: #64748b;
  margin-top: 1px;
}

.vault-mock--workflow .vault-mock__workflow {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-md);
  padding: var(--space-md);
  background: linear-gradient(180deg, #0f172a 0%, #0b1220 100%);
}

.vault-mock__flow-card {
  flex: 1;
  max-width: min(15rem, 46%);
  padding: var(--space-md);
  border-radius: var(--radius-md);
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: rgba(30, 41, 59, 0.55);
}

.vault-mock__flow-card--accent {
  border-color: rgba(37, 99, 235, 0.35);
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.12);
}

.vault-mock__flow-label {
  font-size: 0.5625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
  margin-bottom: var(--space-sm);
}

.vault-mock__flow-title {
  font-size: 0.75rem;
  font-weight: 700;
  color: #f1f5f9;
  margin-bottom: var(--space-xs);
}

.vault-mock__flow-meta {
  font-size: 0.625rem;
  color: #94a3b8;
  line-height: 1.45;
}

.vault-mock__flow-arrow {
  flex-shrink: 0;
  width: 1.75rem;
  height: 2px;
  background: linear-gradient(90deg, rgba(99, 102, 241, 0.2), rgba(37, 99, 235, 0.75));
  position: relative;
}

.vault-mock__flow-arrow::after {
  content: "";
  position: absolute;
  right: -2px;
  top: 50%;
  transform: translateY(-50%);
  border: 5px solid transparent;
  border-left-color: rgba(59, 130, 246, 0.85);
}

.vault-mock__chip {
  display: inline-block;
  margin-top: var(--space-sm);
  font-size: 0.5625rem;
  font-weight: 600;
  padding: 0.2rem 0.45rem;
  border-radius: 6px;
  background: rgba(34, 197, 94, 0.15);
  color: #86efac;
}

.vault-mock--modal .vault-mock__modal-wrap {
  flex: 1;
  min-height: 0;
  padding: var(--space-md);
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.97) 0%, #0b1220 100%);
}

.vault-mock__modal {
  width: 100%;
  max-width: 24rem;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: #1e293b;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.45);
  overflow: hidden;
}

.vault-mock__modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-md);
  border-bottom: 1px solid rgba(148, 163, 184, 0.15);
}

.vault-mock__modal-title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 700;
  color: #f8fafc;
  letter-spacing: -0.02em;
}

.vault-mock__modal-close {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 6px;
  border: none;
  background: rgba(51, 65, 85, 0.6);
  color: #94a3b8;
  font-size: 1rem;
  line-height: 1;
  cursor: default;
}

.vault-mock__modal-body {
  padding: var(--space-md);
}

.vault-mock__linked {
  font-size: 0.625rem;
  padding: var(--space-sm);
  border-radius: var(--radius-md);
  background: rgba(37, 99, 235, 0.12);
  border: 1px solid rgba(37, 99, 235, 0.22);
  color: #93c5fd;
  margin-bottom: var(--space-md);
  line-height: 1.5;
}

.vault-mock__linked strong {
  color: #dbeafe;
  font-weight: 600;
}

.vault-mock__field {
  margin-bottom: var(--space-md);
}

.vault-mock__field:last-of-type {
  margin-bottom: 0;
}

.vault-mock__field-label {
  display: block;
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #94a3b8;
  margin-bottom: 0.35rem;
}

.vault-mock__field-value {
  font-size: 0.8125rem;
  color: #cbd5e1;
  padding: 0.5rem 0.65rem;
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid rgba(148, 163, 184, 0.15);
  font-family: ui-monospace, monospace;
}

.vault-mock__field-mask {
  letter-spacing: 0.15em;
  color: #64748b;
}

.vault-mock__modal-foot {
  margin-top: var(--space-md);
  padding-top: var(--space-md);
  border-top: 1px solid rgba(148, 163, 184, 0.12);
  font-size: 0.625rem;
  color: #94a3b8;
  line-height: 1.55;
}

@media (max-width: 639px) {
  .vault-mock--workflow .vault-mock__workflow {
    flex-direction: column;
    gap: var(--space-sm);
  }

  .vault-mock__flow-arrow {
    width: 2px;
    height: 1.75rem;
    background: linear-gradient(180deg, rgba(99, 102, 241, 0.2), rgba(37, 99, 235, 0.75));
  }

  .vault-mock__flow-arrow::after {
    right: 50%;
    top: auto;
    bottom: -2px;
    transform: translateX(50%);
    border: 5px solid transparent;
    border-top-color: rgba(59, 130, 246, 0.85);
    border-left-color: transparent;
  }

  .vault-mock__flow-card {
    max-width: none;
  }
}

/* --- Resources page (curated resource center) --- */
body.page-resources {
  background-image: linear-gradient(180deg, #f8fafc 0%, #eef2f8 28%, #e8eef7 100%);
}

.page-hero--resources {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0%, rgba(248, 250, 252, 0.35) 100%);
}

.section-label--resources-hero {
  display: block;
  margin-bottom: var(--space-xs);
}

.page-title--resources {
  margin-bottom: var(--space-sm);
  font-weight: 800;
  letter-spacing: -0.035em;
  font-size: clamp(2rem, 3.5vw + 1rem, 2.65rem);
}

.lead--resources {
  max-width: var(--page-intro-lead-max);
  font-size: 1.0625rem;
  line-height: 1.58;
  color: #526177;
  margin-bottom: 0;
}

.page-hero__resources-support {
  margin: var(--space-md) 0 0;
  max-width: var(--page-intro-support-max);
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.55;
  color: var(--color-text-muted);
  padding-top: var(--space-md);
  border-top: 1px solid rgba(226, 232, 240, 0.9);
}

.resources-filters-wrap {
  padding-block: var(--space-lg) var(--space-md);
  background: rgba(255, 255, 255, 0.55);
  border-bottom: 1px solid var(--color-border);
}

.resource-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs) var(--space-sm);
  align-items: center;
}

.resource-filter {
  margin: 0;
  padding: 0.45rem 0.95rem;
  font-family: inherit;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text-muted);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  cursor: pointer;
  touch-action: manipulation;
  transition:
    color 0.15s var(--ease),
    background 0.15s var(--ease),
    border-color 0.15s var(--ease),
    box-shadow 0.15s var(--ease);
}

@media (max-width: 767px) {
  .resource-filter {
    min-height: 2.75rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
  }

  .resources-value-strip {
    padding: var(--space-md) var(--space-lg);
    margin-bottom: var(--space-xl);
  }

  .resources-library-section {
    padding-block: var(--space-2xl);
  }
}

.resource-filter:hover {
  color: var(--color-text);
  border-color: var(--color-accent-ring);
  background: rgba(255, 255, 255, 0.95);
}

.resource-filter:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.resource-filter--active {
  color: var(--color-accent);
  background: var(--color-accent-subtle);
  border-color: rgba(37, 99, 235, 0.32);
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.12);
}

.resources-library-section {
  padding-block: calc(var(--space-3xl) + 0.25rem);
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border-block: 1px solid var(--color-border);
}

.resources-value-strip {
  margin-bottom: var(--space-2xl);
  padding: var(--space-lg) var(--space-xl);
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.05) 0%, rgba(248, 250, 252, 0.95) 50%);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

.resources-value-strip__title {
  margin: 0 0 var(--space-md);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.resources-value-strip__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-sm);
}

@media (min-width: 640px) {
  .resources-value-strip__list {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-md) var(--space-xl);
  }
}

@media (min-width: 900px) {
  .resources-value-strip__list {
    grid-template-columns: repeat(4, 1fr);
  }
}

.resources-value-strip__list li {
  margin: 0;
  padding-left: 1.25rem;
  position: relative;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.45;
  color: var(--color-text);
}

.resources-value-strip__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-accent);
  opacity: 0.85;
}

.resource-featured {
  margin-bottom: var(--space-2xl);
}

.resource-featured__eyebrow {
  margin: 0 0 var(--space-sm);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.resource-card[hidden],
.resource-featured[hidden] {
  display: none !important;
}

.resource-grid > li:has(.resource-card[hidden]) {
  display: none !important;
}

.resource-card {
  --resource-pad: var(--space-xl);
  position: relative;
  display: flex;
  gap: var(--space-lg);
  padding: var(--resource-pad);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 8px 28px -6px rgba(15, 23, 42, 0.08);
  transition:
    box-shadow 0.28s var(--ease),
    border-color 0.28s var(--ease),
    transform 0.28s var(--ease);
}

.resource-card:hover {
  border-color: rgba(37, 99, 235, 0.22);
  box-shadow:
    0 4px 12px rgba(15, 23, 42, 0.06),
    0 16px 40px -10px rgba(37, 99, 235, 0.12);
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  .resource-card:hover {
    transform: none;
  }
}

.resource-card--featured {
  padding: 0;
  border-radius: var(--radius-xl);
  overflow: hidden;
  border-color: rgba(37, 99, 235, 0.18);
  box-shadow:
    0 4px 14px rgba(15, 23, 42, 0.06),
    0 1px 0 rgba(255, 255, 255, 0.8) inset;
}

.resource-card--featured::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--color-accent) 0%, #38bdf8 45%, rgba(37, 99, 235, 0.35) 100%);
  z-index: 1;
  pointer-events: none;
}

.resource-card__featured-inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  padding: var(--space-2xl) var(--space-xl);
}

@media (min-width: 768px) {
  .resource-card__featured-inner {
    flex-direction: row;
    align-items: flex-start;
    padding: var(--space-2xl);
    gap: var(--space-2xl);
  }
}

.resource-card__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.25rem;
  height: 3.25rem;
  border-radius: var(--radius-md);
  background: var(--color-accent-subtle);
  color: var(--color-accent);
}

.resource-card__icon--featured {
  width: 4.5rem;
  height: 4.5rem;
  border-radius: var(--radius-lg);
}

.resource-card__icon svg {
  display: block;
}

.resource-card__content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.resource-card__title {
  margin: 0 0 var(--space-sm);
  font-size: 1.125rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.28;
  color: var(--color-text);
}

.resource-card__title--featured {
  font-size: clamp(1.2rem, 1.5vw + 1rem, 1.5rem);
}

.resource-card__meta {
  margin: 0 0 var(--space-md);
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text-muted);
  letter-spacing: 0.01em;
}

.resource-card__desc {
  margin: 0 0 var(--space-lg);
  font-size: 0.9375rem;
  line-height: 1.58;
  color: var(--color-text-muted);
  max-width: 40rem;
}

.resource-card--featured .resource-card__desc {
  font-size: 1rem;
}

.resource-card__preview-note {
  margin: calc(-1 * var(--space-sm)) 0 var(--space-md);
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-accent);
  letter-spacing: 0.02em;
}

.resource-card__actions {
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-md);
  padding-top: var(--space-md);
  border-top: 1px solid rgba(226, 232, 240, 0.9);
}

.resource-card__badge {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #475569;
  padding: 0.35rem 0.65rem;
  background: var(--color-bg-muted);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}

.btn--resource-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem 1.2rem;
  font-size: 0.9375rem;
  font-weight: 700;
  text-decoration: none;
  color: var(--color-accent);
  background: var(--color-surface);
  border: 1px solid rgba(37, 99, 235, 0.35);
  border-radius: var(--radius-sm);
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.08);
  cursor: pointer;
  transition:
    background 0.15s var(--ease),
    border-color 0.15s var(--ease),
    color 0.15s var(--ease),
    box-shadow 0.15s var(--ease);
}

.btn--resource-cta:hover {
  color: #fff;
  background: var(--color-accent);
  border-color: var(--color-accent);
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35);
  text-decoration: none;
}

.btn--resource-cta:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.btn--resource-cta--primary {
  padding: 0.75rem 1.35rem;
  font-size: 1rem;
}

.resources-section-head {
  margin-bottom: var(--space-xl);
  padding-bottom: var(--space-lg);
  border-bottom: 1px solid var(--color-border);
}

.resources-section-head__title {
  margin: 0 0 var(--space-sm);
  font-size: clamp(1.25rem, 1.5vw + 1rem, 1.5rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.resources-section-head__lede {
  margin: 0;
  max-width: 36rem;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--color-text-muted);
}

.resource-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-lg);
  grid-template-columns: 1fr;
}

@media (min-width: 900px) {
  .resource-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-xl) var(--space-lg);
  }
}

.resource-page__mono {
  font-family: ui-monospace, monospace;
  font-size: 0.875em;
  color: var(--color-text);
  word-break: break-word;
}

.resource-page__empty {
  margin: var(--space-2xl) 0 0;
  padding: var(--space-xl);
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text-muted);
  text-align: center;
  background: var(--color-bg-muted);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-md);
}

.resource-page__empty[hidden] {
  display: none;
}

.final-cta--resources {
  position: relative;
  overflow: hidden;
  padding-block: calc(var(--space-3xl) + 0.75rem);
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(37, 99, 235, 0.1), transparent 55%),
    linear-gradient(180deg, #eff3fb 0%, #e2e8f4 100%);
  border-top: 1px solid var(--color-border);
  border-bottom: none;
}

.final-cta--resources::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.4) 50%, transparent 100%);
  opacity: 0.5;
  pointer-events: none;
}

.final-cta--resources .final-cta__inner {
  position: relative;
  z-index: 1;
}

.final-cta__proof-list--resources {
  list-style: none;
  margin: 0 0 var(--space-lg);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  justify-content: center;
  max-width: 50rem;
  margin-inline: auto;
}

.final-cta__proof-list--resources li {
  margin: 0;
  padding: 0.4rem 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.final-cta--resources h2 {
  font-size: clamp(1.5rem, 2.2vw + 0.65rem, 2rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  max-width: 28rem;
  margin-inline: auto;
  margin-bottom: var(--space-md);
}

.final-cta--resources p {
  font-size: 1.0625rem;
  line-height: 1.62;
  max-width: 34rem;
  margin-bottom: var(--space-2xl);
  color: #475569;
}

.final-cta--resources .final-cta__actions .btn--primary {
  box-shadow:
    0 2px 6px rgba(37, 99, 235, 0.35),
    0 1px 2px rgba(15, 23, 42, 0.06);
}

.final-cta--resources .final-cta__actions .btn--primary:hover {
  box-shadow:
    0 10px 28px rgba(37, 99, 235, 0.38),
    0 2px 6px rgba(15, 23, 42, 0.08);
}

.final-cta--resources .final-cta__actions .btn--secondary {
  background: rgba(255, 255, 255, 0.65);
  border-color: rgba(37, 99, 235, 0.22);
}

.final-cta--resources .final-cta__actions .btn--secondary:hover {
  background: #fff;
  border-color: var(--color-accent);
}

body.page-resources .site-footer {
  margin-top: 0;
}

body.page-resources .site-footer__grid {
  padding-top: var(--space-md);
  gap: var(--space-xl) var(--space-2xl);
}

@media (min-width: 768px) {
  body.page-resources .site-footer__grid {
    gap: var(--space-xl) var(--space-3xl);
  }
}

body.page-resources .site-footer__tagline {
  max-width: 22rem;
  line-height: 1.55;
}

body.page-resources .site-footer h3 {
  margin-top: 0;
  margin-bottom: var(--space-sm);
}

body.page-resources .site-footer li {
  margin-bottom: var(--space-xs);
}

body.page-resources .site-footer__bottom {
  margin-top: var(--space-xl);
  padding-top: var(--space-lg);
}

/* --- Homepage polish (.page-home only; About & inner pages unchanged) --- */
.page-home .hero--home {
  border-bottom-color: rgba(226, 232, 240, 0.85);
}

.page-home .hero--home::before {
  background:
    radial-gradient(
      ellipse 85% 55% at 88% 8%,
      rgba(37, 99, 235, 0.11),
      transparent 58%
    ),
    radial-gradient(ellipse 50% 40% at 10% 85%, rgba(37, 99, 235, 0.05), transparent 55%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, transparent 45%);
}

@media (min-width: 1024px) {
  .page-home .hero__grid {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.18fr);
    gap: clamp(2rem, 4vw, 3.25rem);
    align-items: center;
  }

  .page-home .hero__visual {
    transform: scale(1.025);
    transform-origin: center right;
  }
}

.page-home .hero__eyebrow {
  color: var(--color-accent-hover);
}

.page-home .hero__title {
  margin-bottom: var(--space-md);
  font-weight: 800;
  color: #0b1220;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.45);
}

.page-home .hero__sub {
  margin-bottom: var(--space-md);
  max-width: var(--page-intro-lead-max);
  color: #334155;
  line-height: 1.55;
}

.page-home .hero__sub--secondary {
  margin-top: 0;
  margin-bottom: var(--space-xl);
  font-size: clamp(0.98rem, 0.85vw + 0.8rem, 1.08rem);
  line-height: 1.58;
  color: #475569;
  max-width: 33rem;
}

.page-home .hero__actions {
  gap: var(--space-md) var(--space-lg);
}

.page-home .hero__trust-strip {
  margin: var(--space-xl) 0 0;
  padding: 0;
  max-width: 36rem;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.page-home .hero__trust-strip li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
  margin: 0;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.45;
  color: #3d4e63;
}

.page-home .hero__trust-dot {
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  margin-top: 0.4rem;
  border-radius: 50%;
  background: linear-gradient(145deg, var(--color-accent) 0%, #1d4ed8 100%);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

/* --- Homepage metrics strip --- */
.home-metrics-bar {
  padding-block: var(--space-md) var(--space-lg);
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border);
}

.home-metrics-bar__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-md);
  text-align: center;
}

@media (min-width: 640px) {
  .home-metrics-bar__list {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-lg);
    align-items: center;
  }

  .home-metrics-bar__list li {
    position: relative;
  }

  .home-metrics-bar__list li:not(:first-child)::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 1.75rem;
    background: var(--color-border);
  }
}

.home-metrics-bar__label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #475569;
  line-height: 1.35;
}

@media (min-width: 640px) {
  .home-metrics-bar__label {
    font-size: 0.84375rem;
  }
}

.page-home .hero__product-shot {
  box-shadow:
    0 28px 56px -16px rgba(15, 23, 42, 0.22),
    0 0 0 1px rgba(15, 23, 42, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  outline: 1px solid rgba(255, 255, 255, 0.12);
  outline-offset: -1px;
}

.page-home .hero__product-shot:hover {
  box-shadow:
    0 36px 72px -18px rgba(15, 23, 42, 0.26),
    0 0 0 1px rgba(37, 99, 235, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transform: translateY(-3px) scale(1.01);
}

@media (min-width: 1024px) {
  .page-home .hero__visual .hero__product-shot:hover {
    transform: translateY(-3px) scale(1.035);
  }
}

.page-home .section.section--muted {
  padding-block: calc(var(--space-3xl) + 0.25rem) calc(var(--space-3xl) + 0.5rem);
}

.page-home .section.section--accent-tint {
  padding-block: calc(var(--space-3xl) + 0.5rem);
}

.page-home .section.section--surface {
  padding-block: var(--space-3xl);
}

.page-home .cap-card {
  border-radius: var(--radius-xl);
  box-shadow:
    0 2px 4px rgba(15, 23, 42, 0.04),
    0 12px 28px -8px rgba(15, 23, 42, 0.09);
}

.page-home .cap-card:hover {
  transform: translateY(-4px);
}

.page-home .cap-card__icon {
  width: 52px;
  height: 52px;
  border-radius: var(--radius-lg);
  background: linear-gradient(
    145deg,
    rgba(37, 99, 235, 0.12) 0%,
    rgba(37, 99, 235, 0.06) 100%
  );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.page-home .cap-card__title {
  letter-spacing: -0.02em;
}

.page-home .home-capabilities__intro {
  margin-bottom: calc(var(--space-2xl) + 0.35rem);
  padding-bottom: var(--space-xl);
  border-bottom: 1px solid rgba(148, 163, 184, 0.38);
  max-width: 44rem;
}

.page-home .home-capabilities__intro .section-title {
  margin-bottom: var(--space-md);
}

.page-home .home-capabilities__intro .lead {
  max-width: 36rem;
  margin-inline: auto;
  line-height: 1.58;
}

.page-home .home-capabilities__grid {
  align-items: stretch;
}

.page-home .home-capabilities__grid .cap-card {
  min-height: 15.5rem;
  border-color: #d5dde8;
}

.page-home .home-capabilities__grid .cap-card__body {
  max-width: 22rem;
}

.page-home .home-capabilities__footer {
  margin-top: var(--space-2xl);
  padding-top: var(--space-md);
  border-top: 1px solid transparent;
}

.page-home .home-use-cases .card-grid {
  align-items: stretch;
}

.page-home .home-use-cases .cap-card {
  display: flex;
  flex-direction: column;
}

.page-home .home-use-cases .cap-card .btn {
  margin-top: auto;
  align-self: flex-start;
}

.page-home .home-use-cases .section__actions {
  margin-top: var(--space-3xl);
}

.page-home .compare-split {
  border-radius: var(--radius-xl);
  box-shadow:
    0 4px 6px rgba(15, 23, 42, 0.05),
    0 20px 40px -12px rgba(15, 23, 42, 0.12);
}

.page-home .compare-split--home {
  border-color: #c5ced9;
  box-shadow:
    0 1px 3px rgba(15, 23, 42, 0.06),
    0 24px 48px -14px rgba(15, 23, 42, 0.14);
}

.page-home .compare-split--home .compare-panel {
  padding: calc(var(--space-xl) + 0.15rem) var(--space-xl) calc(var(--space-xl) + 0.35rem);
}

.page-home .compare-split--home .compare-list li {
  margin-bottom: var(--space-lg);
  line-height: 1.52;
}

.page-home .compare-panel--without {
  background: linear-gradient(180deg, #e8ecf4 0%, #e2e8f0 100%);
}

.page-home .compare-panel--with {
  border-left: none;
  box-shadow: inset 4px 0 0 var(--color-accent);
  background: linear-gradient(180deg, #ffffff 0%, #fafbfd 100%);
}

@media (max-width: 599px) {
  .page-home .compare-panel--with {
    border-top: none;
    box-shadow: inset 0 4px 0 var(--color-accent);
  }
}

.page-home .compare-panel__label {
  margin-bottom: var(--space-lg);
  letter-spacing: 0.07em;
}

.page-home .compare-panel--with .compare-panel__label {
  color: var(--color-accent-hover);
}

.page-home .compare-split--home .compare-panel__label {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.85rem;
  border-radius: var(--radius-sm);
  font-size: 0.6875rem;
  margin-bottom: var(--space-xl);
  letter-spacing: 0.08em;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(100, 116, 139, 0.35);
  color: #475569;
}

.page-home .compare-split--home .compare-panel--with .compare-panel__label {
  background: rgba(37, 99, 235, 0.12);
  border-color: rgba(37, 99, 235, 0.32);
  color: #1d4ed8;
}

.page-home .compare-list li {
  font-size: 0.90625rem;
  color: #4b5569;
}

.page-home .compare-panel--without .compare-list li {
  color: #526177;
}

.page-home .audience-grid {
  gap: var(--space-xl);
  align-items: stretch;
}

.page-home .audience-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: var(--radius-xl);
  border-color: #d1d9e6;
  box-shadow:
    0 2px 6px rgba(15, 23, 42, 0.05),
    0 12px 28px -10px rgba(15, 23, 42, 0.09);
  transition:
    box-shadow 0.25s var(--ease),
    border-color 0.25s var(--ease),
    transform 0.22s var(--ease);
}

.page-home .audience-card:hover {
  transform: translateY(-4px);
}

.page-home .audience-card__icon {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  background: var(--color-accent-subtle);
  color: var(--color-accent);
  margin-bottom: var(--space-md);
}

.page-home .home-audience__intro .lead {
  max-width: 38rem;
}

.page-home .audience-card h3 {
  margin-bottom: var(--space-md);
}

.page-home .audience-card p {
  flex: 1;
  font-size: 0.9375rem;
  line-height: 1.58;
}

/* --- Homepage mid-page CTA band --- */
.home-mid-cta {
  position: relative;
  padding-block: calc(var(--space-3xl) + 0.65rem);
  background:
    radial-gradient(ellipse 110% 100% at 50% -35%, rgba(37, 99, 235, 0.22), transparent 52%),
    linear-gradient(165deg, #0f172a 0%, #1a2332 42%, #0b1220 100%);
  border-block: 1px solid rgba(15, 23, 42, 0.9);
}

.home-mid-cta__inner {
  max-width: 40rem;
  margin-inline: auto;
  text-align: center;
}

.home-mid-cta h2 {
  margin: 0 0 var(--space-md);
  font-size: clamp(1.5rem, 2.4vw + 0.55rem, 2rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #f8fafc;
}

.home-mid-cta p {
  margin: 0 0 var(--space-xl);
  color: #cbd5e1;
  font-size: 1.0625rem;
  line-height: 1.65;
}

.home-mid-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  justify-content: center;
  align-items: center;
}

.home-mid-cta .btn--primary {
  background: #fff;
  color: #0f172a;
  border-color: #fff;
  box-shadow: 0 4px 22px rgba(0, 0, 0, 0.18);
}

.home-mid-cta .btn--primary:hover {
  background: #f1f5f9;
  color: #0f172a;
}

.home-mid-cta .btn--secondary {
  background: transparent;
  color: #f8fafc;
  border-color: rgba(248, 250, 252, 0.38);
  box-shadow: none;
}

.home-mid-cta .btn--secondary:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(248, 250, 252, 0.55);
  color: #fff;
}

/* --- Homepage how it works --- */
.page-home .home-how {
  background: var(--color-surface);
}

.page-home .home-how__intro {
  margin-bottom: var(--space-2xl);
}

.page-home .home-how__intro .section-title {
  margin-bottom: 0;
}

.home-how__steps {
  display: grid;
  gap: var(--space-lg);
}

@media (min-width: 900px) {
  .home-how__steps {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-lg);
    align-items: stretch;
  }
}

.home-how__step {
  display: flex;
  gap: var(--space-md);
  align-items: flex-start;
  padding: var(--space-lg);
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  background: var(--color-bg-muted);
  box-shadow: var(--shadow-sm);
}

.home-how__num {
  flex-shrink: 0;
  width: 2.35rem;
  height: 2.35rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  font-weight: 800;
  font-size: 0.9375rem;
  color: var(--color-accent);
  background: var(--color-surface);
  border: 1px solid var(--color-accent-ring);
}

.home-how__title {
  margin: 0 0 var(--space-xs);
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.home-how__desc {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.58;
  color: var(--color-text-muted);
}

.page-home .final-cta--home-final {
  position: relative;
  overflow: hidden;
  padding-block: calc(var(--space-3xl) + 1rem);
  background:
    radial-gradient(ellipse 75% 65% at 50% 0%, rgba(37, 99, 235, 0.09), transparent 55%),
    linear-gradient(180deg, #f8fafc 0%, #eef2f8 100%);
  border-top: 1px solid var(--color-border);
  border-bottom: none;
}

.page-home .final-cta--home-final::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.45) 50%, transparent 100%);
  opacity: 0.45;
  pointer-events: none;
}

.page-home .final-cta__inner {
  position: relative;
  z-index: 1;
}

.page-home .final-cta__proof-list {
  list-style: none;
  margin: 0 0 var(--space-xl);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  justify-content: center;
  max-width: 52rem;
  margin-inline: auto;
}

.page-home .final-cta__proof-list li {
  margin: 0;
  padding: 0.4rem 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.page-home .final-cta--home-final h2 {
  font-size: clamp(1.6rem, 2.6vw + 0.6rem, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  max-width: 26rem;
  margin-inline: auto;
  margin-bottom: var(--space-md);
}

@media (min-width: 640px) {
  .page-home .final-cta--home-final h2 {
    max-width: 34rem;
  }
}

.page-home .final-cta--home-final p {
  font-size: 1.0625rem;
  line-height: 1.65;
  max-width: 34rem;
  margin-bottom: var(--space-2xl);
  color: #526177;
}

.page-home .final-cta--home-final .final-cta__actions .btn--primary {
  box-shadow:
    0 2px 6px rgba(37, 99, 235, 0.35),
    0 1px 2px rgba(15, 23, 42, 0.06);
}

.page-home .final-cta--home-final .final-cta__actions .btn--primary:hover {
  box-shadow:
    0 10px 28px rgba(37, 99, 235, 0.4),
    0 2px 6px rgba(15, 23, 42, 0.08);
}

/* --- About page polish (.about-page on main) --- */
.about-page {
  --about-section-y: var(--space-3xl);
  --about-section-y-loose: calc(var(--space-3xl) + 1.35rem);
  --about-section-y-tight: calc(var(--space-3xl) - 0.35rem);
  --about-card-lift: -3px;
  --about-card-time: 0.24s;
}

.about-page .hero--about::before {
  background:
    radial-gradient(
      ellipse 82% 52% at 90% 10%,
      rgba(37, 99, 235, 0.09),
      transparent 55%
    ),
    radial-gradient(ellipse 45% 38% at 5% 88%, rgba(37, 99, 235, 0.04), transparent 50%);
}

@media (min-width: 1024px) {
  .about-page .hero__grid {
    grid-template-columns: minmax(0, 0.93fr) minmax(0, 1.12fr);
    gap: clamp(1.75rem, 3.5vw, 3rem);
    align-items: center;
  }

  .about-page .hero__visual {
    transform: scale(1.02);
    transform-origin: center right;
  }
}

.about-page .hero__copy .section-label,
.about-page .hero__eyebrow--about {
  color: var(--color-accent-hover);
}

.about-page .hero__title--about {
  margin-bottom: var(--space-md);
  font-weight: 800;
  letter-spacing: -0.035em;
  color: #0b1220;
}

.about-page .hero__sub--about {
  margin-bottom: var(--space-md);
  max-width: 34rem;
  font-size: clamp(1.02rem, 0.95vw + 0.88rem, 1.125rem);
  line-height: 1.58;
  color: #334155;
}

.about-page .hero__sub--about-secondary {
  margin: 0 0 var(--space-xl);
  max-width: 33rem;
  font-size: clamp(0.98rem, 0.85vw + 0.82rem, 1.0625rem);
  line-height: 1.58;
  color: #475569;
}

.about-page .hero__actions {
  gap: var(--space-md) var(--space-lg);
}

.about-page .hero__visual {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-sm);
}

.about-page .hero__mock-caption {
  margin: 0;
  padding: 0 0.25rem;
  text-align: center;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #64748b;
}

.about-page .hero__product-shot {
  align-self: center;
  width: 100%;
  max-width: calc(100% - 1in);
  box-shadow:
    0 28px 56px -14px rgba(15, 23, 42, 0.22),
    0 0 0 1px rgba(15, 23, 42, 0.07),
    0 0 48px -12px rgba(37, 99, 235, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.45);
  outline: 1px solid rgba(255, 255, 255, 0.1);
  outline-offset: -1px;
  transition: box-shadow var(--about-card-time) var(--ease), transform var(--about-card-time) var(--ease);
}

.about-page .hero__product-shot:hover {
  box-shadow:
    0 34px 68px -16px rgba(15, 23, 42, 0.24),
    0 0 0 1px rgba(37, 99, 235, 0.16),
    0 0 56px -10px rgba(37, 99, 235, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
  transform: translateY(-3px);
}

@media (min-width: 1024px) {
  .about-page .hero__visual .hero__product-shot:hover {
    transform: translateY(-3px) scale(1.02);
  }
}

.about-page .about-preview__sidebar {
  border-right: 1px solid rgba(51, 65, 85, 0.75);
  background: linear-gradient(180deg, #0a0f18 0%, #1e293b 100%);
}

.about-page .about-preview__main {
  min-height: 11.5rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.about-page .section.about-why {
  padding-block: calc(var(--about-section-y) + 0.25rem) var(--about-section-y-loose);
  border-bottom: 1px solid rgba(226, 232, 240, 0.85);
}

.about-why__eyebrow {
  margin-bottom: var(--space-xs);
}

.about-why__inner {
  max-width: 58rem;
  margin-inline: auto;
}

.about-why__title {
  margin: 0 0 var(--space-md);
  font-size: clamp(1.42rem, 1.75vw + 1rem, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  color: var(--color-text);
}

.about-why__split {
  display: grid;
  gap: var(--space-lg);
  align-items: start;
}

@media (min-width: 768px) {
  .about-why__split {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    column-gap: var(--space-xl);
    row-gap: var(--space-lg);
  }
}

.about-why__narrative {
  display: block;
  min-width: 0;
  padding: var(--space-lg) var(--space-xl);
  border-radius: var(--radius-xl);
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.95) 0%, #f1f5f9 100%);
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.about-why__narrative p {
  margin: 0;
  max-width: 42ch;
  font-size: 1.03rem;
  line-height: 1.65;
  color: #475569;
}

.about-why__narrative p + p {
  margin-top: var(--space-md);
}

@media (min-width: 768px) {
  .about-why__narrative p {
    max-width: 36rem;
  }
}

.about-why__callout {
  margin: 0;
  padding: var(--space-xl);
  border: 1px solid #c7d2fe;
  border-left: 5px solid var(--color-accent);
  border-radius: var(--radius-xl);
  background: linear-gradient(155deg, #ffffff 0%, #f8fafc 40%, #eef2ff 100%);
  box-shadow:
    0 4px 6px rgba(15, 23, 42, 0.04),
    0 18px 40px -14px rgba(37, 99, 235, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.about-why__callout-title {
  margin: 0 0 var(--space-md);
  max-width: 42ch;
  font-size: clamp(1.05rem, 1vw + 0.92rem, 1.1875rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.28;
  color: #0f172a;
}

@media (min-width: 768px) {
  .about-why__callout-title {
    max-width: 36rem;
  }
}

.about-why__callout-body {
  margin: 0;
  max-width: 42ch;
  font-size: 1.02rem;
  line-height: 1.65;
  color: #475569;
}

.about-why__callout .about-why__callout-body + .about-why__callout-body {
  margin-top: var(--space-md);
}

@media (min-width: 768px) {
  .about-why__callout-body {
    max-width: 36rem;
  }
}

.about-page .section.about-mission {
  padding-block: calc(var(--about-section-y-loose) - 0.35rem);
  background:
    radial-gradient(ellipse 72% 85% at 50% 0%, rgba(37, 99, 235, 0.08), transparent 58%),
    linear-gradient(180deg, #f9fbff 0%, #f1f5f9 50%, #e8edf5 100%);
  border-block: 1px solid var(--color-border);
}

.about-mission__inner {
  max-width: 32rem;
  margin-inline: auto;
  text-align: center;
}

.about-mission__title {
  margin: 0 0 var(--space-lg);
  font-size: clamp(1.5rem, 1.9vw + 1rem, 1.95rem);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.16;
  color: #0b1220;
}

.about-mission__body {
  margin: 0 0 var(--space-lg);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: #475569;
}

.about-mission__body strong {
  color: #1e40af;
  font-weight: 700;
}

.about-mission__tags {
  margin: var(--space-md) 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-sm);
}

.about-mission__tags li {
  margin: 0;
  padding: 0.4rem 0.95rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-accent-hover);
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(37, 99, 235, 0.22);
  border-radius: 999px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.about-page .section__intro {
  margin-bottom: calc(var(--space-2xl) + 0.35rem);
  max-width: 40rem;
}

.about-page .section__intro--center {
  margin-inline: auto;
  margin-bottom: calc(var(--space-2xl) + 0.5rem);
  max-width: 44rem;
}

.about-page .section.about-delivers {
  padding-block: calc(var(--about-section-y) + 0.25rem);
  border-bottom: 1px solid rgba(226, 232, 240, 0.75);
}

.about-page .about-delivers__intro {
  padding-bottom: var(--space-lg);
  margin-bottom: calc(var(--space-2xl) + 0.15rem);
  border-bottom: 1px solid rgba(148, 163, 184, 0.35);
}

.about-page .about-delivers__intro .section-title {
  margin-bottom: var(--space-md);
}

.about-page .about-delivers__intro .lead {
  max-width: 36rem;
  line-height: 1.58;
}

.about-page .about-delivers__grid {
  align-items: stretch;
}

.about-page .about-delivers .cap-card {
  border-radius: var(--radius-xl);
  min-height: 15.5rem;
  padding: var(--space-xl);
  border-color: #d5dde8;
  box-shadow:
    0 2px 4px rgba(15, 23, 42, 0.045),
    0 12px 28px -8px rgba(15, 23, 42, 0.09),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
  transition:
    box-shadow var(--about-card-time) var(--ease),
    border-color var(--about-card-time) var(--ease),
    transform var(--about-card-time) var(--ease);
}

.about-page .about-delivers .cap-card__body {
  max-width: 22rem;
  font-size: 0.9375rem;
  line-height: 1.58;
}

.about-page .about-delivers .cap-card:hover {
  transform: translateY(var(--about-card-lift));
  border-color: var(--color-accent-ring);
  box-shadow:
    0 4px 8px rgba(15, 23, 42, 0.05),
    0 18px 38px -10px rgba(15, 23, 42, 0.13),
    inset 0 2px 0 0 var(--color-accent);
}

.about-page .about-delivers .cap-card__icon {
  width: 54px;
  height: 54px;
  border-radius: var(--radius-lg);
  background: linear-gradient(
    145deg,
    rgba(37, 99, 235, 0.12) 0%,
    rgba(37, 99, 235, 0.06) 100%
  );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.about-page .about-delivers .cap-card__title {
  letter-spacing: -0.02em;
}

@media (prefers-reduced-motion: reduce) {
  .about-page .about-delivers .cap-card:hover {
    transform: none;
  }
}

.about-page .section.about-serve {
  padding-block: calc(var(--about-section-y) + 0.35rem);
  background: var(--color-surface);
  border-block: 1px solid var(--color-border);
}

.about-page .about-serve__intro .lead {
  max-width: 38rem;
  line-height: 1.58;
}

.about-page .about-serve__grid {
  gap: var(--space-xl);
  align-items: stretch;
}

.about-page .about-serve .audience-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: var(--radius-xl);
  padding: calc(var(--space-xl) + 0.125rem);
  border-color: #d1d9e6;
  box-shadow:
    0 2px 6px rgba(15, 23, 42, 0.05),
    0 14px 32px -12px rgba(15, 23, 42, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
  transition:
    box-shadow var(--about-card-time) var(--ease),
    border-color var(--about-card-time) var(--ease),
    transform var(--about-card-time) var(--ease);
}

.about-page .about-serve .audience-card:hover {
  transform: translateY(var(--about-card-lift));
  border-color: var(--color-accent-ring);
  box-shadow:
    0 6px 12px rgba(15, 23, 42, 0.06),
    0 22px 44px -14px rgba(37, 99, 235, 0.12),
    inset 0 2px 0 0 rgba(37, 99, 235, 0.08);
}

.about-page .about-serve .audience-card__icon {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  margin-bottom: var(--space-md);
  background: linear-gradient(
    145deg,
    rgba(37, 99, 235, 0.12) 0%,
    rgba(37, 99, 235, 0.06) 100%
  );
  color: var(--color-accent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.about-page .about-serve .audience-card h3 {
  margin-bottom: var(--space-md);
  font-size: 1.0625rem;
  letter-spacing: -0.02em;
}

.about-page .about-serve .audience-card p {
  flex: 1;
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.58;
  color: var(--color-text-muted);
}

@media (prefers-reduced-motion: reduce) {
  .about-page .about-serve .audience-card:hover {
    transform: none;
  }
}

.about-page .section.about-principles {
  padding-block: calc(var(--about-section-y) + 0.15rem);
  background: linear-gradient(180deg, var(--color-bg-muted) 0%, #e8edf5 100%);
  border-block: 1px solid var(--color-border);
}

.about-page .about-principles__intro {
  margin-bottom: var(--space-2xl);
}

.about-page .about-principles__intro .lead {
  max-width: 36rem;
  line-height: 1.58;
}

.about-principles__manifesto {
  margin: 0 auto;
  padding: 0;
  list-style: none;
  max-width: 44rem;
}

.about-principle {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-lg) var(--space-xl);
  align-items: start;
  margin: 0;
  padding: var(--space-xl) 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.45);
}

.about-principle:first-child {
  padding-top: 0;
}

.about-principle:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

@media (min-width: 768px) {
  .about-principle:nth-child(even) .about-principle__copy {
    padding-left: var(--space-xl);
    margin-left: var(--space-xs);
    border-left: 2px solid rgba(37, 99, 235, 0.18);
  }
}

.about-principle__index {
  font-size: clamp(2rem, 3.5vw + 1rem, 2.85rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
  color: rgba(37, 99, 235, 0.2);
  user-select: none;
}

.about-principle__copy {
  min-width: 0;
}

.about-principle__title {
  margin: 0 0 var(--space-xs);
  font-size: clamp(1.08rem, 1.1vw + 0.95rem, 1.25rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0b1220;
}

.about-principle__body {
  margin: 0;
  font-size: 0.96875rem;
  line-height: 1.6;
  color: #475569;
  max-width: 36rem;
}

.about-page .final-cta--about {
  position: relative;
  overflow: hidden;
  padding-block: calc(var(--about-section-y-loose) + 0.5rem);
  background:
    radial-gradient(ellipse 85% 75% at 50% -15%, rgba(37, 99, 235, 0.12), transparent 52%),
    linear-gradient(180deg, #ffffff 0%, #eef2f9 52%, #e2e8f0 100%);
  border-top: 1px solid var(--color-border);
}

.about-page .final-cta--about::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.45) 50%, transparent 100%);
  opacity: 0.45;
  pointer-events: none;
}

.about-page .final-cta--about .final-cta__inner {
  position: relative;
  z-index: 1;
}

.about-page .final-cta__proof-list--about {
  list-style: none;
  margin: 0 0 var(--space-xl);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  justify-content: center;
  max-width: 52rem;
  margin-inline: auto;
}

.about-page .final-cta__proof-list--about li {
  margin: 0;
  padding: 0.4rem 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.about-page .final-cta--about h2 {
  font-size: clamp(1.55rem, 2.35vw + 0.72rem, 2.15rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  max-width: 22rem;
  margin-inline: auto;
  margin-bottom: var(--space-md);
}

@media (min-width: 640px) {
  .about-page .final-cta--about h2 {
    max-width: 30rem;
  }
}

.about-page .final-cta--about p {
  font-size: 1.0625rem;
  line-height: 1.62;
  max-width: 33rem;
  margin-inline: auto;
  margin-bottom: var(--space-2xl);
  color: #526177;
}

.about-page .final-cta--about .final-cta__actions {
  gap: var(--space-md) var(--space-lg);
}

.about-page .final-cta--about .final-cta__actions .btn--lg {
  min-height: 3rem;
  padding-inline: 1.65rem;
}

.about-page .final-cta--about .final-cta__actions .btn--primary {
  box-shadow:
    0 2px 6px rgba(37, 99, 235, 0.35),
    0 1px 2px rgba(15, 23, 42, 0.06);
}

.about-page .final-cta--about .final-cta__actions .btn--primary:hover {
  box-shadow:
    0 10px 28px rgba(37, 99, 235, 0.38),
    0 2px 6px rgba(15, 23, 42, 0.08);
}

@media (min-width: 768px) {
  .about-preview--rich .about-preview__body {
    min-height: 292px;
  }
}

/* --- Platform page --- */
.page-platform .hero--platform {
  background: var(--color-surface);
}

.page-platform .hero--platform::before {
  background:
    radial-gradient(
      ellipse 78% 55% at 88% 12%,
      rgba(37, 99, 235, 0.07),
      transparent 58%
    ),
    radial-gradient(ellipse 40% 35% at 8% 90%, rgba(37, 99, 235, 0.035), transparent 55%);
}

.page-platform .hero__title--platform {
  font-size: clamp(1.65rem, 2.8vw + 0.65rem, 2.2rem);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.14;
  margin-bottom: var(--space-md);
}

.page-platform .hero__sub--platform {
  margin-bottom: var(--space-xl);
  max-width: var(--page-intro-measure);
  font-size: clamp(1.02rem, 0.9vw + 0.88rem, 1.125rem);
  line-height: 1.68;
}

.page-platform .hero__actions {
  gap: var(--space-md) var(--space-lg);
}

@media (min-width: 1024px) {
  .page-platform .hero__grid {
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.1fr);
    gap: clamp(1.5rem, 3vw, 2.75rem);
    align-items: center;
  }
}

.platform-modules {
  padding-block: calc(var(--space-3xl) + 0.25rem);
  background: linear-gradient(180deg, #eef2f8 0%, var(--color-bg-muted) 100%);
  border-block: 1px solid var(--color-border);
}

.platform-modules__intro {
  max-width: 40rem;
  margin-bottom: calc(var(--space-2xl) + 0.25rem);
}

.platform-modules__intro .section-title {
  margin-bottom: var(--space-md);
}

.platform-modules__intro .lead {
  margin-top: var(--space-md);
}

.platform-modules__grid {
  display: grid;
  gap: var(--space-xl);
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .platform-modules__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-lg);
  }
}

.platform-module-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: calc(var(--space-xl) + 0.25rem);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  box-shadow:
    0 2px 4px rgba(15, 23, 42, 0.04),
    0 14px 32px -10px rgba(15, 23, 42, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
  text-decoration: none;
  color: inherit;
  transition:
    box-shadow 0.24s var(--ease),
    border-color 0.24s var(--ease),
    transform 0.22s var(--ease);
}

.platform-module-card:hover {
  border-color: var(--color-accent-ring);
  box-shadow:
    0 4px 12px rgba(15, 23, 42, 0.06),
    0 20px 40px -12px rgba(15, 23, 42, 0.14),
    inset 0 2px 0 0 var(--color-accent);
  transform: translateY(-3px);
  text-decoration: none;
  color: inherit;
}

.platform-module-card:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.platform-module-card__icon {
  width: 52px;
  height: 52px;
  border-radius: var(--radius-lg);
  background: linear-gradient(
    145deg,
    rgba(37, 99, 235, 0.12) 0%,
    rgba(37, 99, 235, 0.06) 100%
  );
  color: var(--color-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--space-md);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.platform-module-card__title {
  margin: 0 0 var(--space-sm);
  font-size: clamp(1.125rem, 0.5vw + 1rem, 1.25rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.25;
  color: var(--color-text);
}

.platform-module-card:hover .platform-module-card__title {
  color: var(--color-accent);
}

.platform-module-card__desc {
  margin: 0 0 var(--space-md);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-text-muted);
  line-height: 1.45;
}

.platform-module-card__list {
  margin: 0;
  padding-left: 1.15rem;
  font-size: 0.90625rem;
  line-height: 1.55;
  color: var(--color-text-muted);
}

.platform-module-card__list li {
  margin-bottom: var(--space-xs);
}

.platform-module-card__list li:last-child {
  margin-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
  .platform-module-card:hover {
    transform: none;
  }
}

.platform-modules-more {
  margin-top: calc(var(--space-2xl) + 0.25rem);
}

.platform-modules-more__label {
  margin: 0 0 var(--space-md);
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--color-accent);
}

.platform-modules-more__grid {
  display: grid;
  gap: var(--space-md);
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .platform-modules-more__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-lg);
  }
}

.platform-mini-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: var(--space-lg);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow:
    0 1px 3px rgba(15, 23, 42, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  text-decoration: none;
  color: inherit;
  transition:
    box-shadow 0.22s var(--ease),
    border-color 0.22s var(--ease),
    transform 0.2s var(--ease);
}

.platform-mini-card:hover {
  border-color: var(--color-accent-ring);
  box-shadow:
    0 4px 14px -4px rgba(15, 23, 42, 0.12),
    0 0 0 1px rgba(37, 99, 235, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
  transform: translateY(-2px);
  text-decoration: none;
  color: inherit;
}

.platform-mini-card:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.platform-mini-card__icon {
  width: 44px;
  height: 44px;
  margin-bottom: var(--space-sm);
  border-radius: var(--radius-md);
  background: linear-gradient(
    145deg,
    rgba(37, 99, 235, 0.1) 0%,
    rgba(37, 99, 235, 0.05) 100%
  );
  color: var(--color-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.platform-mini-card__title {
  margin: 0 0 var(--space-xs);
  font-size: 1.0625rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.platform-mini-card:hover .platform-mini-card__title {
  color: var(--color-accent);
}

.platform-mini-card__desc {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--color-text-muted);
}

@media (prefers-reduced-motion: reduce) {
  .platform-mini-card:hover {
    transform: none;
  }
}

.platform-showcase {
  padding-block: calc(var(--space-3xl) + 0.75rem);
  background: linear-gradient(165deg, #0f172a 0%, #0b1220 52%, #111c33 100%);
  border-block: 1px solid rgba(255, 255, 255, 0.06);
  color: #e2e8f0;
}

.platform-showcase__grid {
  display: grid;
  gap: var(--space-2xl);
  align-items: center;
  grid-template-columns: 1fr;
  grid-template-areas:
    "copy"
    "visual";
}

.platform-showcase__copy {
  grid-area: copy;
}

.platform-showcase__visual {
  grid-area: visual;
}

@media (min-width: 900px) {
  .platform-showcase__grid {
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
    grid-template-areas: "visual copy";
    gap: clamp(2rem, 4vw, 3.5rem);
  }
}

.platform-showcase .section-label,
.platform-showcase__label {
  color: #93c5fd;
}

.platform-showcase .platform-showcase__label {
  display: block;
  margin-bottom: var(--space-sm);
}

.platform-showcase__title {
  margin: 0 0 var(--space-md);
  font-size: clamp(1.5rem, 2vw + 1rem, 1.9rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  color: #f8fafc;
}

.platform-showcase__headline {
  margin: 0 0 var(--space-md);
  font-size: clamp(1.15rem, 1.1vw + 0.95rem, 1.35rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.28;
  color: #e2e8f0;
}

.platform-showcase__body {
  margin: 0 0 var(--space-lg);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: #94a3b8;
  max-width: 38rem;
}

.platform-showcase__callouts {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.platform-showcase__callouts li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
  font-size: 0.9375rem;
  font-weight: 600;
  color: #e2e8f0;
}

.platform-showcase__callout-mark {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-top: 0.45em;
  background: var(--color-accent);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.35);
}

.platform-showcase .hero__product-shot,
.platform-showcase__frame {
  border-color: rgba(148, 163, 184, 0.25);
  box-shadow:
    0 28px 56px -12px rgba(0, 0, 0, 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.06);
}

.platform-showcase .hero__product-shot:hover {
  box-shadow:
    0 32px 64px -12px rgba(0, 0, 0, 0.5),
    0 0 0 1px rgba(37, 99, 235, 0.25);
}

.platform-how {
  padding-block: var(--space-3xl);
}

.platform-how__intro {
  max-width: 40rem;
  margin-bottom: calc(var(--space-2xl) + 0.25rem);
}

.platform-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: 48rem;
  position: relative;
}

.platform-steps::before {
  content: "";
  position: absolute;
  left: calc(1.25rem - 1px);
  top: 2.25rem;
  bottom: 2.25rem;
  width: 2px;
  background: linear-gradient(180deg, var(--color-accent), rgba(37, 99, 235, 0.2));
  border-radius: 1px;
  display: none;
}

@media (min-width: 768px) {
  .platform-steps::before {
    display: block;
  }
}

.platform-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-md) var(--space-lg);
  align-items: flex-start;
  padding: var(--space-lg) 0;
  border-bottom: 1px solid var(--color-border);
}

@media (min-width: 768px) {
  .platform-step {
    gap: var(--space-lg) var(--space-xl);
    padding: var(--space-xl) 0;
  }
}

.platform-step:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.platform-step:first-child {
  padding-top: 0;
}

.platform-step__num {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius-md);
  background: var(--color-accent);
  color: #fff;
  font-weight: 800;
  font-size: 0.9375rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3);
  position: relative;
  z-index: 1;
}

.platform-step__title {
  margin: 0 0 var(--space-xs);
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.platform-step__desc {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text-muted);
  max-width: 36rem;
}

.platform-teams {
  padding-block: calc(var(--space-3xl) + 0.25rem);
}

.platform-teams__intro .lead {
  max-width: 38rem;
}

.platform-teams__grid {
  display: grid;
  gap: var(--space-lg);
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .platform-teams__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-xl);
  }
}

.platform-team-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
  box-shadow: var(--shadow-sm);
}

.platform-team-card__title {
  margin: 0 0 var(--space-sm);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.platform-team-card__body {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.62;
  color: var(--color-text-muted);
}

.platform-proof {
  padding: var(--space-xl) 0;
  background: var(--color-surface);
  border-block: 1px solid var(--color-border);
}

.platform-proof__grid {
  display: grid;
  gap: var(--space-lg);
  grid-template-columns: 1fr;
  text-align: center;
}

@media (min-width: 640px) {
  .platform-proof__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-md);
    align-items: start;
  }
}

.platform-proof__stat {
  padding: var(--space-md);
}

.platform-proof__value {
  display: block;
  font-size: clamp(1.75rem, 2.5vw + 1rem, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--color-accent);
  line-height: 1.15;
}

.platform-proof__label {
  display: block;
  margin-top: var(--space-xs);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text-muted);
  line-height: 1.45;
  max-width: 14rem;
  margin-inline: auto;
}

.final-cta--platform {
  padding-block: calc(var(--space-3xl) + 0.75rem);
  background:
    radial-gradient(ellipse 85% 75% at 50% 0%, rgba(37, 99, 235, 0.12), transparent 55%),
    linear-gradient(180deg, #1e3a8a 0%, #1d4ed8 38%, #1e40af 100%);
  border-block: 1px solid rgba(30, 58, 138, 0.5);
  color: #f1f5f9;
}

.final-cta--platform h2 {
  color: #fff;
  font-weight: 800;
  letter-spacing: -0.03em;
  font-size: clamp(1.55rem, 2.2vw + 0.75rem, 2.1rem);
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

.final-cta--platform p {
  color: rgba(241, 245, 249, 0.88);
  max-width: 38rem;
  font-size: 1.0625rem;
  line-height: 1.65;
}

.final-cta--platform .btn--primary {
  background: #fff;
  color: var(--color-accent);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
}

.final-cta--platform .btn--primary:hover {
  background: #f8fafc;
  color: var(--color-accent-hover);
}

.final-cta--platform .btn--secondary {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.35);
  color: #fff;
}

.final-cta--platform .btn--secondary:hover {
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.5);
  color: #fff;
}

/* --- Case studies (proof page) --- */
body.page-case-studies {
  background-image: linear-gradient(180deg, #f8fafc 0%, #eef2f8 28%, #e8eef7 100%);
}

.page-hero--case-studies {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0%, rgba(248, 250, 252, 0.4) 100%);
}

.page-title--case-studies {
  margin-bottom: var(--space-sm);
  font-weight: 800;
  letter-spacing: -0.035em;
  font-size: clamp(2rem, 3.5vw + 1rem, 2.65rem);
}

.lead--case-studies {
  max-width: var(--page-intro-lead-max);
  font-size: 1.0625rem;
  line-height: 1.58;
  color: #526177;
}

.page-hero__proof-line {
  margin: var(--space-md) 0 0;
  max-width: var(--page-intro-support-max);
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.55;
  color: var(--color-text-muted);
  padding-top: var(--space-md);
  border-top: 1px solid rgba(226, 232, 240, 0.9);
}

.case-studies-filters-wrap {
  padding-block: var(--space-lg) var(--space-md);
  background: rgba(255, 255, 255, 0.55);
  border-bottom: 1px solid var(--color-border);
}

.case-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs) var(--space-sm);
  align-items: center;
}

.case-filter {
  margin: 0;
  padding: 0.45rem 0.95rem;
  font-family: inherit;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text-muted);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  cursor: pointer;
  touch-action: manipulation;
  transition:
    color 0.15s var(--ease),
    background 0.15s var(--ease),
    border-color 0.15s var(--ease),
    box-shadow 0.15s var(--ease);
}

@media (max-width: 767px) {
  .case-filter {
    min-height: 2.75rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
  }
}

.case-filter:hover {
  color: var(--color-text);
  border-color: var(--color-accent-ring);
  background: rgba(255, 255, 255, 0.95);
}

.case-filter:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.case-filter--active {
  color: var(--color-accent);
  background: var(--color-accent-subtle);
  border-color: rgba(37, 99, 235, 0.32);
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.12);
}

.case-studies-section {
  padding-block: calc(var(--space-3xl) + 0.25rem);
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border-block: 1px solid var(--color-border);
}

.case-studies-value-strip {
  margin-bottom: var(--space-2xl);
  padding: var(--space-lg) var(--space-xl);
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.05) 0%, rgba(248, 250, 252, 0.95) 50%);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

@media (max-width: 767px) {
  .case-studies-value-strip {
    padding: var(--space-md) var(--space-lg);
    margin-bottom: var(--space-xl);
  }

  .case-studies-section {
    padding-block: var(--space-2xl);
  }
}

.case-studies-value-strip__title {
  margin: 0 0 var(--space-md);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.case-studies-value-strip__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-sm);
}

@media (min-width: 768px) {
  .case-studies-value-strip__list {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-md);
  }
}

.case-studies-value-strip__list li {
  margin: 0;
  padding-left: 1.25rem;
  position: relative;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-text);
}

.case-studies-value-strip__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-accent);
  opacity: 0.85;
}

/* One grid for all case cards: wrappers use display:contents so items reflow when filtering */
.case-studies-stack {
  display: grid;
  gap: var(--space-lg);
  grid-template-columns: minmax(0, 1fr);
  padding-top: var(--space-md);
  border-top: 1px solid var(--color-border);
}

@media (min-width: 768px) {
  .case-studies-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-xl) var(--space-lg);
  }
}

.case-studies-featured,
.case-studies-grid {
  display: contents;
}

/* Module filter active: same card shell and type scale as the rest of the grid */
.case-studies-stack--filtered .case-card--featured {
  padding: var(--space-xl);
  min-height: 0;
  border-radius: var(--radius-lg);
}

.case-studies-stack--filtered .case-card--featured .case-card__title {
  font-size: 1.125rem;
}

.case-studies-stack--filtered .case-card--featured .case-card__context {
  font-size: 0.9375rem;
  max-width: none;
}

/* [hidden] must win over flex/grid so filters actually hide cards */
.case-card[hidden],
.case-studies-featured[hidden] {
  display: none !important;
}

.case-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  padding: var(--space-xl);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 8px 28px -6px rgba(15, 23, 42, 0.08);
  transition:
    box-shadow 0.28s var(--ease),
    border-color 0.28s var(--ease),
    transform 0.28s var(--ease);
}

.case-card:hover {
  border-color: rgba(37, 99, 235, 0.22);
  box-shadow:
    0 4px 12px rgba(15, 23, 42, 0.06),
    0 16px 40px -10px rgba(37, 99, 235, 0.14);
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  .case-card:hover {
    transform: none;
  }
}

.case-card--featured {
  padding: var(--space-2xl) var(--space-xl);
  min-height: 26rem;
  border-radius: var(--radius-xl);
  overflow: hidden;
}

.case-card__accent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--color-accent) 0%, #38bdf8 50%, rgba(37, 99, 235, 0.35) 100%);
  opacity: 0.95;
}

.case-card--featured .case-card__category {
  margin-top: var(--space-sm);
}

.case-card__category {
  margin: 0 0 var(--space-md);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.case-card__meta {
  margin: 0 0 var(--space-lg);
  padding: var(--space-sm) 0 var(--space-md);
  border-bottom: 1px solid var(--color-border);
  display: grid;
  gap: var(--space-xs);
}

.case-card__meta-row {
  display: grid;
  grid-template-columns: 5rem 1fr;
  gap: var(--space-sm);
  align-items: baseline;
  font-size: 0.8125rem;
  line-height: 1.45;
}

.case-card__meta-row dt {
  margin: 0;
  font-weight: 700;
  color: var(--color-text-muted);
}

.case-card__meta-row dd {
  margin: 0;
  font-weight: 500;
  color: var(--color-text);
}

.case-card__title {
  margin: 0 0 var(--space-md);
  font-size: 1.125rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.3;
  color: var(--color-text);
}

.case-card--featured .case-card__title {
  font-size: clamp(1.2rem, 1.2vw + 1rem, 1.4rem);
}

.case-card__context {
  margin: 0 0 var(--space-lg);
  font-size: 0.9375rem;
  line-height: 1.58;
  color: var(--color-text-muted);
}

.case-card--featured .case-card__context {
  font-size: 1rem;
  max-width: 42rem;
}

.case-card__outcomes {
  flex: 1 1 auto;
  margin: 0 0 var(--space-xl);
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.case-card__outcomes li {
  margin: 0;
  padding-left: 1.25rem;
  position: relative;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.45;
  color: #334155;
}

.case-card__outcomes li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.48em;
  width: 5px;
  height: 5px;
  border-radius: 1px;
  background: var(--color-accent);
}

.case-card__actions {
  margin-top: auto;
  padding-top: var(--space-md);
  border-top: 1px solid rgba(226, 232, 240, 0.85);
}

.btn--case-cta {
  width: 100%;
  justify-content: center;
  padding: 0.65rem 1.15rem;
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--color-accent);
  background: var(--color-surface);
  border: 1px solid rgba(37, 99, 235, 0.35);
  border-radius: var(--radius-sm);
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.08);
  cursor: pointer;
  transition:
    background 0.15s var(--ease),
    border-color 0.15s var(--ease),
    color 0.15s var(--ease),
    box-shadow 0.15s var(--ease);
}

.btn--case-cta:hover {
  color: #fff;
  background: var(--color-accent);
  border-color: var(--color-accent);
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35);
}

.btn--case-cta:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.case-studies-empty {
  margin: var(--space-2xl) 0 0;
  padding: var(--space-xl);
  text-align: center;
  font-size: 0.9375rem;
  color: var(--color-text-muted);
  background: var(--color-bg-muted);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-md);
}

.final-cta--case-studies {
  position: relative;
  overflow: hidden;
  padding-block: calc(var(--space-3xl) + 0.75rem);
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(37, 99, 235, 0.1), transparent 55%),
    linear-gradient(180deg, #eff3fb 0%, #e2e8f4 100%);
  border-top: 1px solid var(--color-border);
  border-bottom: none;
}

.final-cta--case-studies::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.4) 50%, transparent 100%);
  opacity: 0.5;
  pointer-events: none;
}

.final-cta--case-studies .final-cta__inner {
  position: relative;
  z-index: 1;
}

.final-cta__proof-list--case-studies {
  list-style: none;
  margin: 0 0 var(--space-lg);
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  justify-content: center;
  max-width: 52rem;
  margin-inline: auto;
}

.final-cta__proof-list--case-studies li {
  margin: 0;
  padding: 0.4rem 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.final-cta--case-studies h2 {
  font-size: clamp(1.55rem, 2.4vw + 0.65rem, 2.15rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.18;
  max-width: 30rem;
  margin-inline: auto;
  margin-bottom: var(--space-md);
}

.final-cta--case-studies p {
  font-size: 1.0625rem;
  line-height: 1.62;
  max-width: 34rem;
  margin-bottom: var(--space-2xl);
  color: #475569;
}

.final-cta--case-studies .final-cta__actions .btn--primary {
  box-shadow:
    0 2px 6px rgba(37, 99, 235, 0.35),
    0 1px 2px rgba(15, 23, 42, 0.06);
}

.final-cta--case-studies .final-cta__actions .btn--primary:hover {
  box-shadow:
    0 10px 28px rgba(37, 99, 235, 0.38),
    0 2px 6px rgba(15, 23, 42, 0.08);
}

.final-cta--case-studies .final-cta__actions .btn--secondary {
  background: rgba(255, 255, 255, 0.65);
  border-color: rgba(37, 99, 235, 0.22);
}

.final-cta--case-studies .final-cta__actions .btn--secondary:hover {
  background: #fff;
  border-color: var(--color-accent);
}

body.page-case-studies .site-footer {
  margin-top: 0;
}

body.page-case-studies .site-footer__grid {
  padding-top: var(--space-md);
  gap: var(--space-xl) var(--space-2xl);
}

@media (min-width: 768px) {
  body.page-case-studies .site-footer__grid {
    gap: var(--space-xl) var(--space-3xl);
  }
}

body.page-case-studies .site-footer__tagline {
  max-width: 22rem;
  line-height: 1.55;
}

body.page-case-studies .site-footer h3 {
  margin-top: 0;
  margin-bottom: var(--space-sm);
}

body.page-case-studies .site-footer li {
  margin-bottom: var(--space-xs);
}

body.page-case-studies .site-footer__bottom {
  margin-top: var(--space-xl);
  padding-top: var(--space-lg);
}

/* --- Case study article (long-form) --- */
body.page-case-study-article {
  background-image: linear-gradient(180deg, #f8fafc 0%, #eef2f8 28%, #e8eef7 100%);
}

.case-study-article {
  padding-block: 0;
}

.page-hero--case-study-article {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0%, rgba(248, 250, 252, 0.4) 100%);
  padding-bottom: var(--space-2xl);
}

.page-case-study-article .module-back--eyebrow {
  margin: 0 0 var(--space-md);
  font-size: 0.8125rem;
  font-weight: 600;
}

.page-case-study-article .module-back--eyebrow a {
  color: var(--color-accent);
  text-decoration: none;
}

.page-case-study-article .module-back--eyebrow a:hover {
  text-decoration: underline;
}

.case-study-article__body {
  padding-block: var(--space-2xl) var(--space-3xl);
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border-block: 1px solid var(--color-border);
}

.case-study-article .prose ul.case-study-article__challenges {
  margin: 0 0 var(--space-xl);
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-md);
}

.case-study-article .prose ul.case-study-article__challenges li {
  margin: 0;
  padding: var(--space-md) var(--space-lg);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-size: 0.9375rem;
  color: var(--color-text-muted);
  line-height: 1.55;
}

.case-study-article .prose ul.case-study-article__challenges strong {
  display: block;
  margin-bottom: var(--space-xs);
  color: var(--color-text);
  font-size: 1rem;
}

.case-study-article__lead-in {
  font-weight: 500;
  color: var(--color-text);
}

.case-study-article__figure {
  margin: var(--space-xl) 0 var(--space-2xl);
  padding: var(--space-lg);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  text-align: center;
}

.case-study-article__figure img {
  max-width: min(100%, 28rem);
  height: auto;
  vertical-align: middle;
}

.case-study-article__caption {
  margin: var(--space-md) 0 0;
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  line-height: 1.5;
}

.case-study-article .prose h3 {
  margin: var(--space-xl) 0 var(--space-sm);
  font-size: 1.0625rem;
  color: var(--color-text);
}

.case-study-article .prose h2 + p + h3,
.case-study-article .prose h2 + h3 {
  margin-top: var(--space-md);
}

.case-study-article .prose ul.article-list,
.case-study-article .prose ol.article-steps {
  margin: 0 0 var(--space-lg);
  padding-left: 1.35rem;
  color: var(--color-text-muted);
  line-height: 1.55;
}

.case-study-article .prose ul.article-list li,
.case-study-article .prose ol.article-steps li {
  margin-bottom: var(--space-xs);
}

.case-study-article .prose ul.article-list li:last-child,
.case-study-article .prose ol.article-steps li:last-child {
  margin-bottom: 0;
}

.case-study-article .prose ol.article-steps {
  list-style: decimal;
}

body.page-case-study-article .site-footer {
  margin-top: 0;
}

/* --- Image lightbox (click to enlarge; homepage carousel + logos excluded in JS) --- */
.image-lightbox {
  margin: 0;
  padding: 0;
  max-width: none;
  max-height: none;
  width: min(100vw, 100%);
  height: 100%;
  border: none;
  background: transparent;
}

.image-lightbox::backdrop {
  background: rgba(15, 23, 42, 0.88);
  backdrop-filter: blur(4px);
}

.image-lightbox__shell {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  padding: var(--space-2xl) var(--space-xl);
  box-sizing: border-box;
  pointer-events: none;
}

.image-lightbox__img {
  pointer-events: auto;
  display: block;
  max-width: min(96vw, 1400px);
  max-height: min(88vh, 900px);
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: var(--radius-md);
  box-shadow:
    0 24px 64px -12px rgba(0, 0, 0, 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.08);
}

.image-lightbox__close {
  pointer-events: auto;
  position: fixed;
  top: var(--space-md);
  right: var(--space-md);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: 1.75rem;
  font-weight: 300;
  line-height: 1;
  color: #fff;
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition:
    background 0.15s var(--ease),
    border-color 0.15s var(--ease),
    transform 0.15s var(--ease);
}

.image-lightbox__close:hover {
  background: rgba(37, 99, 235, 0.9);
  border-color: rgba(255, 255, 255, 0.45);
}

.image-lightbox__close:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .image-lightbox__close {
    transition: none;
  }
}

body img:not(.logo__img):not(.hero-slideshow__slide):not([data-no-lightbox]) {
  cursor: zoom-in;
}