@charset "UTF-8";
/* Home — hero (Figma home-hero 1440 / 1920 / 2560, nodes 40000089:2964, 40000210:2876, 40000210:2887)
   All wide-screen dimensions scale from the 1440px frame (× viewport / 1440). */
:root {
  --hero-max-width: var(--layout-max-width);
  --hero-font-display: var(--font-display);
  --hero-font-body: var(--font-display);
}

.page--home .page {
  padding: 0 !important;
}

.hero-banner {
  position: relative;
  width: 100%;
  max-width: none;
  margin-inline: auto;
  min-height: clamp(800px, 55.556vw, 1422.222px);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background-color: transparent !important;
}

.hero-banner__media {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background-color: transparent !important;
}

.hero-banner__bg,
.hero-banner__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--hero-bg-pos, center);
  display: block;
}

@media (max-width: 719px) {
  .hero-banner__bg,
  .hero-banner__video {
    object-position: var(--hero-bg-pos-mobile, var(--hero-bg-pos, center));
  }
}

/* GHOST: Direct unblock for now — leave video visible under reduced motion until static picture fallbacks are implemented.
@media (prefers-reduced-motion: reduce) {
  .hero-banner__video {
    display: none;
  }
}
*/


/* Horizontal wash: subtle dark left fade, clears mid-right */
.hero-banner__gradient {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.2) 30%, rgba(0, 0, 0, 0) 64%);
}

/* Product Graphic Overlay (layers above bg/video/gradient, behind content panel) */
.hero-banner__product-graphic {
  position: absolute;
  top: 50%;
  right: clamp(10px, 4vw, 80px);
  transform: translateY(-45%);
  z-index: 2;
  pointer-events: none;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  max-width: clamp(320px, 52vw, 950px);
}

.hero-banner__product-graphic-img {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
}

@media (max-width: 768px) {
  .hero-banner__product-graphic {
    position: relative;
    z-index: 2;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: calc(var(--site-header-height, 64px) + 80px);
    padding-bottom: 20px;
    margin: 0 auto;
    width: calc(100% - 40px);
    max-width: 480px;
    top: auto;
    left: auto;
    right: auto;
    transform: none;
  }
}

/* Card Layout (Default Style) */
.hero-banner__inner {
  position: relative;
  z-index: 3;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  padding: calc(40px + var(--site-header-height, 80px)) 40px 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}

.hero-banner__inner .content-slot {
  width: 100%;
}

.hero-banner__inner .content-panel {
  width: 100%;
  max-width: 100%;
  padding: clamp(20px, 4vw, 40px);
}

/* Default card layout title inside panel */
.hero-banner__inner .content-panel .hero-banner__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  text-transform: none;
  font-size: clamp(1.75rem, 2.5vw, 2.5rem);
  line-height: 1.25;
  color: #fff;
}

/* Lede description inside panel */
.hero-banner__lede {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.2;
  letter-spacing: 0;
  color: #fff;
  max-width: 100%;
}

/* Breadcrumb style and crumbs */
.hero-banner__breadcrumb,
.quantum-rx-hero-banner__breadcrumb {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25em;
  max-width: 510px;
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.5;
  letter-spacing: 0;
  color: #fff;
  text-transform: uppercase;
}

.hero-banner__crumb,
.quantum-rx-hero-banner__crumb {
  color: inherit;
  text-decoration: none;
  transition: color 0.15s ease;
}

.hero-banner__crumb:hover,
.hero-banner__crumb:focus-visible,
.quantum-rx-hero-banner__crumb:hover,
.quantum-rx-hero-banner__crumb:focus-visible {
  color: var(--color-brand-red);
}

.hero-banner__breadcrumb-sep,
.quantum-rx-hero-banner__breadcrumb-sep {
  font-weight: 500;
}

/* Full Page Hero Style (Modifier Option used on Home) */
.hero-banner--full-page .hero-banner__inner {
  max-width: 680px;
  gap: 24px;
}

.hero-banner--full-page .hero-banner__title {
  margin: 0;
  font-family: var(--hero-font-display);
  font-weight: 300;
  font-size: clamp(2.25rem, 4vw + 1rem, 4.25rem);
  line-height: 1.2;
  letter-spacing: 0;
  color: #fff;
}

.hero-banner--full-page .hero-banner__sub {
  margin: 0;
  font-family: var(--hero-font-body);
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.2;
  letter-spacing: 0;
  color: #fff;
}

/* Base CTA Button Styles */
.hero-banner__cta,
.hero__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 136px;
  padding: 8px 12px;
  font-family: var(--hero-font-display);
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.5rem;
  color: #fff;
  text-decoration: none;
  border-radius: 2px;
  transition: opacity 0.15s ease;
}

.hero-banner__cta-icon-img,
.hero__cta-icon-img {
  display: block;
  width: auto !important;
  height: 16px;
  aspect-ratio: 9 / 16;
}

/* Title Band Hero Style (Modifier Option used on Locations & Events) */
.hero-banner--title-band {
  min-height: clamp(280px, 27.778vw, 400px);
}

.hero-banner--title-band-tall {
  min-height: clamp(700px, 48.611vw, 1244.444px);
}

.hero-banner--title-band .hero-banner__gradient {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%);
}

.hero-banner--title-band .hero-banner__inner {
  max-width: none;
  padding: calc(40px + var(--site-header-height, 80px)) 40px 40px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-end;
  gap: 0;
}

.hero-banner--title-band .hero-banner__title-wrap {
  box-sizing: border-box;
  width: 100%;
  padding: 24px;
}

.hero-banner--title-band .hero-banner__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.25rem, 3.5vw + 1rem, 3.625rem);
  line-height: 1.2;
  letter-spacing: 0;
  color: #fff;
}

@media (min-width: 1440px) {
  .hero-banner--title-band {
    min-height: clamp(400px, 27.778vw, 711.111px);
  }
  .hero-banner--title-band-tall {
    min-height: clamp(700px, 48.611vw, 1244.444px);
  }
  .hero-banner--title-band .hero-banner__inner {
    padding: calc(clamp(40px, 2.778vw, 71.111px) + var(--site-header-height, 80px)) clamp(40px, 2.778vw, 71.111px) clamp(40px, 2.778vw, 71.111px);
  }
  .hero-banner--title-band .hero-banner__title-wrap {
    padding: clamp(24px, 1.667vw, 42.667px);
  }
  .hero-banner--title-band .hero-banner__title {
    font-size: clamp(3.625rem, 4.028vw, 6.444rem);
  }
}

@media (max-width: 1023px) {
  .hero-banner--title-band {
    min-height: clamp(280px, 50vw, 420px);
  }
  .hero-banner--title-band-tall {
    min-height: clamp(480px, 65vh, 700px);
    min-height: clamp(480px, 65dvh, 700px);
  }
  .hero-banner--title-band .hero-banner__inner {
    padding-top: calc(40px + var(--site-header-height, 80px));
    padding-bottom: 40px;
    padding-inline: 40px;
  }
}

@media (max-width: 719px) {
  .hero-banner--title-band .hero-banner__inner {
    padding: calc(28px + var(--site-header-height, 80px)) 24px 40px;
  }
  .hero-banner--title-band .hero-banner__title-wrap {
    padding: 0;
  }
  .hero-banner--title-band .hero-banner__title {
    font-size: clamp(2rem, 8vw, 2.75rem);
  }
}

@media (min-width: 1024px) {
  .hero-banner__inner .content-slot {
    width: 50% !important;
    max-width: 50% !important;
  }
}

/* Wide screens: scale hero from 1440px baseline through 2560px */
@media (min-width: 1440px) {
  .hero-banner__inner {
    padding: calc(clamp(40px, 2.778vw, 71.111px) + var(--site-header-height, 80px)) clamp(40px, 2.778vw, 71.111px) clamp(40px, 2.778vw, 71.111px);
  }
  .hero-banner__inner .content-panel {
    gap: clamp(16px, 1.111vw, 28.444px);
    padding: clamp(40px, 2.778vw, 71.111px);
    border-width: clamp(0.5px, 0.035vw, 0.889px);
    -webkit-backdrop-filter: blur(clamp(20px, 1.389vw, 35.556px)) saturate(1.15);
    backdrop-filter: blur(clamp(20px, 1.389vw, 35.556px)) saturate(1.15);
  }
  .hero-banner__inner .content-panel .hero-banner__title {
    font-size: clamp(3rem, 3.333vw, 5.333rem);
  }
  .hero-banner__lede {
    font-size: clamp(1.25rem, 1.389vw, 2.222rem);
  }
  
  /* Full page hero overrides on min-width 1440px */
  .hero-banner--full-page .hero-banner__inner {
    max-width: clamp(680px, 47.222vw, 1208.889px);
    gap: clamp(24px, 1.667vw, 42.667px);
  }
  .hero-banner--full-page .hero-banner__title {
    font-size: clamp(4.25rem, 4.722vw, 7.556rem);
  }
  .hero-banner--full-page .hero-banner__sub {
    font-size: clamp(1.25rem, 1.389vw, 2.222rem);
  }
  .hero-banner .hero-banner__cta,
  .hero .hero__cta {
    gap: clamp(8px, 0.556vw, 14.222px);
    min-width: clamp(136px, 9.444vw, 241.778px);
    padding: clamp(8px, 0.556vw, 14.222px) clamp(12px, 0.833vw, 21.333px);
    font-size: clamp(1rem, 1.111vw, 1.7775rem);
    line-height: clamp(1.5rem, 1.667vw, 2.667rem);
  }
  .hero-banner .hero-banner__cta-icon-img,
  .hero .hero__cta-icon-img {
    height: clamp(16px, 1.111vw, 28.444px);
  }
}
.hero-banner__cta:hover,
.hero__cta:hover {
  opacity: 0.9;
}

.hero-banner__cta:focus-visible,
.hero__cta:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.hero-banner__cta-icon,
.hero__cta-icon {
  display: flex;
  flex-shrink: 0;
  line-height: 0;
}

/* Hero mobile/tablet: full-bleed scrim (Figma home-hero-mobile), full viewport height for full-page and default card heroes */
@media (max-width: 1023px) {
  .hero-banner:not(.hero-banner--title-band) {
    min-height: 100vh;
    min-height: 100dvh;
  }
  .hero-banner__gradient {
    left: calc(50% - 50vw);
    width: 100vw;
    right: auto;
    background: rgba(0, 0, 0, 0.5);
  }
  .hero-banner__inner {
    padding-top: calc(40px + var(--site-header-height, 80px));
    padding-bottom: 40px;
    padding-left: 40px;
    padding-right: 40px;
    gap: 24px;
  }
}
@media (max-width: 719px) {
  .hero-banner__inner {
    padding: calc(28px + var(--site-header-height, 80px)) 24px 40px;
    gap: 0;
  }
  
  /* Default card panel mobile style overrides */
  .hero-banner__inner .content-panel {
    gap: 24px;
    padding: 20px;
  }
  .hero-banner__inner .content-panel__title--display {
    font-size: 2.25rem;
    line-height: 1.2;
  }
  .hero-banner__lede {
    font-size: 1.125rem;
    line-height: 1.35;
  }

  /* Full Page style mobile overrides */
  .hero-banner--full-page .hero-banner__inner {
    gap: 24px;
  }
  .hero-banner--full-page .hero-banner__sub {
    font-size: 1.125rem;
  }
}
/* Configurable Right-Side Image Layout in Hero Block */
.hero-banner__right-image {
  display: none;
}

@media (min-width: 1024px) {
  .hero-banner__inner--has-right-image {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    max-width: none !important;
    width: 100% !important;
  }

  .hero-banner__inner--has-right-image .content-slot {
    width: auto !important;
    flex: 0 1 auto !important;
  }

  .hero-banner__right-image {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-end !important;
    align-self: stretch !important;
    flex: 1 !important;
    padding-left: clamp(20px, 3vw, 40px) !important;
  }

  .hero-banner__right-image img,
  .hero-banner__right-image-img {
    max-width: 100% !important;
    max-height: clamp(300px, 31.25vw, 450px) !important;
    height: auto !important;
    object-fit: contain !important;
  }
}



/* Home — feature intro (Figma home-feature-intro 1440 / 1920 / 2560, nodes 40000211:2898, 40000211:2911, 40000211:2924)
   Inner width is --pattern-block-width (aligned with page pattern) up to ~1920; wider viewports grow the row
   fluidly (× viewport / 1440) while flex overlap fractions stay fixed. */
.home-feature-intro {
  /* Figma frame 1440: feature row is 1020px inset (210px each side); flex % below are of this width (850 + 510 − 340). */
  --home-feature-intro-row-max: 1020px;
  --feature-intro-media-flex: 83.333333%;
  --feature-intro-overlap-flex: 33.333333%;
  --feature-intro-card-flex: 50%;
  --feature-intro-chamfer: clamp(14px, 2.8vw, 36px);
  position: relative;
  width: 100%;
  max-width: var(--hero-max-width);
  margin-inline: auto;
  padding: clamp(72px, 10vw, 120px) 0;
  box-sizing: border-box;
}

.home-feature-intro__inner {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--pattern-block-width);
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 24px);
}

@media (min-width: 1230px) {
  .home-feature-intro__inner {
    /* Flush with outer pattern lines once there is room for the full grid width */
    padding-inline: 0;
  }
}
.home-feature-intro__row {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: flex-start;
  width: 100%;
  max-width: var(--home-feature-intro-row-max);
  margin-inline: auto;
  min-width: 0;
  gap: 0;
}

.home-feature-intro__media-wrap {
  flex: 0 1 var(--feature-intro-media-flex);
  min-width: 0;
  margin-right: calc(var(--feature-intro-overlap-flex) * -1);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
}

/* Figma feature-content-media-wrap: 600px tall column for an 850px-wide frame; video is 476.25px with space below before row baseline.
   ≥720px: same band as desktop (tablet retains horizontal overlap layout; phone stacks ≤719px). */
@media (min-width: 720px) {
  .home-feature-intro__media-wrap {
    aspect-ratio: 850/600;
  }
}
.home-feature-intro__video-shell,
.home-feature-ground__video-shell {
  position: relative;
  width: 100%;
  flex-shrink: 0;
  aspect-ratio: 850/476.25;
  overflow: hidden;
  -webkit-clip-path: polygon(0 0, calc(100% - var(--feature-intro-chamfer)) 0, 100% var(--feature-intro-chamfer), 100% 100%, var(--feature-intro-chamfer) 100%, 0 calc(100% - var(--feature-intro-chamfer)));
  clip-path: polygon(0 0, calc(100% - var(--feature-intro-chamfer)) 0, 100% var(--feature-intro-chamfer), 100% 100%, var(--feature-intro-chamfer) 100%, 0 calc(100% - var(--feature-intro-chamfer)));
}

.home-feature-intro__video,
.home-feature-ground__video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Intro row flex basis — panel chrome lives on `.content-panel` in `shared.css` */
.home-feature-intro__row > .content-panel {
  flex: 0 0 var(--feature-intro-card-flex);
  max-width: var(--feature-intro-card-flex);
}

.home-feature-intro__title {
  margin: 0;
  font-family: var(--hero-font-display);
  font-weight: 300;
  font-size: clamp(1.75rem, 3vw + 1rem, 2.5rem);
  line-height: 1.2;
  letter-spacing: 0;
  color: #fff;
  overflow-wrap: break-word;
  /* Figma feature-heading (40000211:2904): hand-set title case — not CSS capitalize */
  text-transform: none;
}

.home-feature-intro__title-line {
  display: block;
}

/* Wide screens: scale intro band from 1440px baseline through 2560px (Figma home-feature-intro-1920 / -2560). */
@media (min-width: 1440px) {
  .home-feature-intro {
    max-width: none;
    width: 100%;
    padding: clamp(120px, 8.333vw, 213.333px) 0;
    --feature-intro-chamfer: clamp(36px, 2.5vw, 64px);
  }
  .home-feature-intro__inner {
    max-width: max(var(--pattern-block-width), min(70.833vw, 1813.333px));
  }
  .home-feature-intro__row {
    max-width: clamp(1020px, 70.833vw, 1813.333px);
  }
  .home-feature-intro__title {
    font-size: clamp(2.5rem, 2.778vw, 4.444rem);
  }
  .home-feature-intro__row > .content-panel {
    gap: clamp(16px, 1.111vw, 28.444px);
    padding: clamp(40px, 2.778vw, 71.111px);
    border-width: clamp(0.5px, 0.0347vw, 0.889px);
    -webkit-backdrop-filter: blur(clamp(20px, 1.389vw, 35.556px)) saturate(1.15);
    backdrop-filter: blur(clamp(20px, 1.389vw, 35.556px)) saturate(1.15);
  }
  .home-feature-intro .content-panel__body {
    font-size: clamp(1rem, 1.111vw, 1.7775rem);
  }
  .home-feature-intro .hero__cta {
    gap: clamp(8px, 0.556vw, 14.222px);
    min-width: clamp(136px, 9.444vw, 241.778px);
    padding: clamp(8px, 0.556vw, 14.222px) clamp(12px, 0.833vw, 21.333px);
    font-size: clamp(1rem, 1.111vw, 1.7775rem);
    line-height: clamp(1.5rem, 1.667vw, 2.667rem);
  }
  .home-feature-intro .hero__cta-icon-img {
    height: clamp(16px, 1.111vw, 28.444px);
  }
}
/* Desktop / tablet headline (Figma home-feature-intro desktop) */
.home-feature-intro__title-bridge--mobile {
  display: none;
}

@media (max-width: 719px) {
  .home-feature-intro__title-bridge--desktop {
    display: none;
  }
  .home-feature-intro__title-bridge--mobile {
    display: block;
  }
  /* Figma home-feature-intro-mobile (node 40000123:2129): py 40px, px 20px;
     Phone / small viewports only — tablet portrait+ uses desktop band layout (≥720px). */
  .home-feature-intro {
    padding: 40px 0;
  }
  .home-feature-intro__inner {
    padding-inline: 20px;
  }
  .home-feature-intro__row {
    flex-direction: column;
    align-items: stretch;
    max-width: none;
    margin-inline: 0;
  }
  .home-feature-intro__media-wrap {
    position: relative;
    z-index: 0;
    flex: 0 1 auto;
    width: 100%;
    aspect-ratio: unset;
    margin-right: 0;
    margin-bottom: -20px;
  }
  /* Figma Subtract frame: 202px tall, full content width; card overlaps 20px */
  .home-feature-intro__video-shell {
    max-width: 100%;
    aspect-ratio: unset;
    height: 202px;
  }
  .home-feature-intro__row > .content-panel {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    max-width: none;
    width: 100%;
    gap: 24px;
    padding: 20px;
  }
  /* Figma H5 mobile: 24px / 1.2, sentence case — intro block only */
  .home-feature-intro .home-feature-intro__title {
    font-size: 1.5rem;
    text-transform: none;
  }
}
/* GHOST: Direct unblock for now — leave video visible under reduced motion until static picture fallbacks are implemented.
@media (prefers-reduced-motion: reduce) {
  .home-feature-intro__video,
  .home-feature-ground__video {
    display: none;
  }
  .home-feature-intro__video-shell,
  .home-feature-ground__video-shell {
    min-height: 200px;
    background: #1a1b22 center/cover no-repeat url("../public/images/home/hero-bg.webp");
  }
}
*/
/* Home — feature intelligence (Figma home-feature-intelligence 1440 / 1920 / 2560,
   nodes 40000059:2036, 40000212:2948, 40000212:2959)
   Full-bleed video; card uses `.content-panel`. Card left edge = 4th pattern line;
   from 1440px, section insets + `align-items: flex-end` keep that anchor as the card grows. */
.home-feature-intelligence {
  position: relative;
  width: 100%;
  max-width: var(--hero-max-width);
  margin-inline: auto;
  box-sizing: border-box;
  min-height: 700px;
  padding: clamp(48px, 8vw, 80px) 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.home-feature-intelligence__media {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.home-feature-intelligence__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Section-local vertical grid: above video, below content (see z-index stack). */
.home-feature-intelligence__pattern {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: 100%;
  pointer-events: none;
  overflow: hidden;
  opacity: 0.5;
}

.home-feature-intelligence__inner {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: var(--pattern-block-width);
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 24px);
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  min-height: 0;
  min-width: 0;
}

.home-feature-intelligence__card {
  width: 100%;
  max-width: 680px;
}

@media (min-width: 1230px) {
  .home-feature-intelligence__inner {
    padding-left: calc( 3 * (var(--pattern-line-width) + var(--pattern-line-gap)) );
    padding-right: 0;
  }
}
/* Wide screens: scale intelligence band from 1440px baseline through 2560px. */
@media (min-width: 1440px) {
  .home-feature-intelligence {
    max-width: none;
    width: 100%;
    min-height: clamp(700px, 48.611vw, 1244.444px);
    padding: clamp(80px, 5.556vw, 142.222px) 0;
    border-top-width: clamp(0.5px, 0.0694vw, 1.778px);
  }
  .home-feature-intelligence__inner {
    max-width: none;
    padding-left: clamp(210px, 14.583vw, 373.333px);
    padding-right: clamp(210px, 14.583vw, 373.333px);
    align-items: flex-end;
  }
  .home-feature-intelligence__card {
    max-width: clamp(680px, 47.222vw, 1208.889px);
  }
  .home-feature-intelligence .home-feature-intro__title {
    font-size: clamp(2.5rem, 2.778vw, 4.444rem);
  }
  .home-feature-intelligence .content-panel {
    gap: clamp(16px, 1.111vw, 28.444px);
    padding: clamp(40px, 2.778vw, 71.111px);
    border-width: clamp(0.5px, 0.0347vw, 0.889px);
    -webkit-backdrop-filter: blur(clamp(20px, 1.389vw, 35.556px)) saturate(1.15);
    backdrop-filter: blur(clamp(20px, 1.389vw, 35.556px)) saturate(1.15);
  }
  .home-feature-intelligence .content-panel__body {
    font-size: clamp(1rem, 1.111vw, 1.7775rem);
  }
  .home-feature-intelligence .hero__cta {
    gap: clamp(8px, 0.556vw, 14.222px);
    min-width: clamp(136px, 9.444vw, 241.778px);
    padding: clamp(8px, 0.556vw, 14.222px) clamp(12px, 0.833vw, 21.333px);
    font-size: clamp(1rem, 1.111vw, 1.7775rem);
    line-height: clamp(1.5rem, 1.667vw, 2.667rem);
  }
  .home-feature-intelligence .hero__cta-icon-img {
    height: clamp(16px, 1.111vw, 28.444px);
  }
}
/* Phone-only: full-width card over video; tablet+ keeps desktop rail + 680px card cap */
@media (max-width: 719px) {
  .home-feature-intelligence {
    min-height: min(700px, 100dvh);
  }
  .home-feature-intelligence__inner {
    justify-content: flex-end;
    padding-left: clamp(16px, 4vw, 24px);
    padding-right: clamp(16px, 4vw, 24px);
  }
  .home-feature-intelligence__card {
    max-width: none;
  }
}
/* GHOST: Direct unblock for now — leave video visible under reduced motion until static picture fallbacks are implemented.
@media (prefers-reduced-motion: reduce) {
  .home-feature-intelligence__video {
    display: none;
  }
  .home-feature-intelligence__media {
    background: #1a1b22 center/cover no-repeat url("../public/images/home/hero-bg.webp");
  }
}
*/
/* Home — feature ground (Figma home-feature-ground 1440 / 1920 / 2560, nodes 40000067:2071, 40000214:3134, 40000214:3149;
   mobile 40000123:2144)
   Inner width is --pattern-block-width up to ~1920; wider viewports grow the row fluidly (× viewport / 1440)
   while flex overlap fractions stay fixed. Card 680 + media 850 − overlap 510 at 1440 baseline. */
.home-feature-ground {
  /* Percentages are of the 1020px row: 680/1020, 850/1020, 510/1020 */
  --home-feature-ground-row-max: 1020px;
  --feature-ground-card-flex: 66.666667%;
  --feature-ground-media-flex: 83.333333%;
  --feature-ground-overlap-flex: 50%;
  --feature-intro-chamfer: clamp(14px, 2.8vw, 36px);
  position: relative;
  width: 100%;
  max-width: var(--hero-max-width);
  margin-inline: auto;
  padding: clamp(72px, 10vw, 120px) 0;
  box-sizing: border-box;
}

.home-feature-ground__inner {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--pattern-block-width);
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 24px);
}

@media (min-width: 1230px) {
  .home-feature-ground__inner {
    padding-inline: 0;
  }
}
.home-feature-ground__row {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: flex-start;
  width: 100%;
  max-width: var(--home-feature-ground-row-max);
  margin-inline: auto;
  min-width: 0;
  gap: 0;
  isolation: isolate;
}

.home-feature-ground__row > .content-panel {
  flex: 0 0 var(--feature-ground-card-flex);
  max-width: none;
  width: auto;
  margin-right: calc(var(--feature-ground-overlap-flex) * -1);
  z-index: 2;
}

.home-feature-ground__media-wrap {
  flex: 0 0 var(--feature-ground-media-flex);
  min-width: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
}

/* Figma feature-ground-media-container: 724px tall vs 850px wide; video frame top-aligned in column.
   Nudge card up vs video frame overlap per art direction. Tablet+ matches desktop band. */
@media (min-width: 720px) {
  .home-feature-ground__media-wrap {
    aspect-ratio: 850/724;
  }
  .home-feature-ground__row > .content-panel {
    transform: translateY(clamp(-80px, -3.125vw, -45px));
  }
}
/* Wide screens: scale ground band from 1440px baseline through 2560px (Figma home-feature-ground-1920 / -2560). */
@media (min-width: 1440px) {
  .home-feature-ground {
    max-width: none;
    width: 100%;
    padding: clamp(120px, 8.333vw, 213.333px) 0;
    --feature-intro-chamfer: clamp(36px, 2.5vw, 64px);
  }
  .home-feature-ground__inner {
    max-width: max(var(--pattern-block-width), min(70.833vw, 1813.333px));
  }
  .home-feature-ground__row {
    max-width: clamp(1020px, 70.833vw, 1813.333px);
  }
  .home-feature-ground .home-feature-intro__title {
    font-size: clamp(2.5rem, 2.778vw, 4.444rem);
  }
  .home-feature-ground__row > .content-panel {
    gap: clamp(16px, 1.111vw, 28.444px);
    padding: clamp(40px, 2.778vw, 71.111px);
    border-width: clamp(0.5px, 0.0347vw, 0.889px);
    -webkit-backdrop-filter: blur(clamp(20px, 1.389vw, 35.556px)) saturate(1.15);
    backdrop-filter: blur(clamp(20px, 1.389vw, 35.556px)) saturate(1.15);
  }
  .home-feature-ground .content-panel__body {
    font-size: clamp(1rem, 1.111vw, 1.7775rem);
  }
  .home-feature-ground .hero__cta {
    gap: clamp(8px, 0.556vw, 14.222px);
    min-width: clamp(136px, 9.444vw, 241.778px);
    padding: clamp(8px, 0.556vw, 14.222px) clamp(12px, 0.833vw, 21.333px);
    font-size: clamp(1rem, 1.111vw, 1.7775rem);
    line-height: clamp(1.5rem, 1.667vw, 2.667rem);
  }
  .home-feature-ground .hero__cta-icon-img {
    height: clamp(16px, 1.111vw, 28.444px);
  }
}
/* Figma home-feature-ground-mobile (node 40000123:2144): py 40px px 20px; media first, 202px
   video, −20px overlap; card gap 24px, padding 20px; title H5 24px / Magistral Book. */
@media (max-width: 719px) {
  .home-feature-ground {
    padding: 40px 0;
  }
  .home-feature-ground__inner {
    padding-inline: 20px;
  }
  .home-feature-ground__row {
    flex-direction: column;
    align-items: stretch;
    max-width: none;
    margin-inline: 0;
  }
  .home-feature-ground__media-wrap {
    order: -1;
    position: relative;
    z-index: 0;
    flex: 0 1 auto;
    width: 100%;
    aspect-ratio: unset;
    margin-bottom: -20px;
  }
  .home-feature-ground__row > .content-panel {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-bottom: 0;
    transform: none;
    gap: 24px;
    padding: 20px;
  }
  /* Figma Subtract / video block: 202px tall, full content width */
  .home-feature-ground__video-shell {
    max-width: 100%;
    aspect-ratio: unset;
    height: 202px;
  }
  .home-feature-ground .home-feature-intro__title {
    font-size: 1.5rem;
    font-weight: 400;
    text-transform: none;
  }
}
/* Home — milestones / articles (Figma home-milestones 1440 / 1920 / 2560,
   nodes 40000070:2100, 40000215:3222, 40000215:3280)
   Inner width is --pattern-block-width up to ~1920; wider viewports grow the rail fluidly (× viewport / 1440)
   so 50/50 featured and three-up cards stay aligned with the vertical pattern. */
.home-milestones {
  --home-milestones-content-max: 1020px;
  width: 100%;
  max-width: var(--hero-max-width);
  margin-inline: auto;
  padding: clamp(48px, 6vw, 80px) 0;
  box-sizing: border-box;
}

.home-milestones__inner {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--pattern-block-width);
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 24px);
}

.home-milestones__header,
.home-milestones__grid {
  width: 100%;
  max-width: var(--home-milestones-content-max);
  margin-inline: auto;
  box-sizing: border-box;
}

@media (min-width: 1230px) {
  .home-milestones__inner {
    padding-inline: 0;
  }
}
.home-milestones__header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}

.home-milestones__title {
  margin: 0;
  font-family: var(--hero-font-display);
  font-weight: 300;
  font-size: clamp(2rem, 2.5vw + 1rem, 3rem);
  line-height: 1.2;
  letter-spacing: 0;
  color: #fff;
}

.home-milestones__grid {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
}

/* Featured row: 510 + 510 @ 1020 — 50 / 50 */
.home-milestones__featured {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  width: 100%;
  min-height: 300px;
  border: 1px solid #3e3e3e;
  box-sizing: border-box;
  background-color: #101115;
}

.home-milestones__featured-media {
  position: relative;
  flex: 1 1 50%;
  min-width: 0;
  min-height: 200px;
  overflow: hidden;
}

.home-milestones__featured-img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 4px;
}

.home-milestones__featured-media wistia-player {
  position: absolute;
  inset: 0;
  display: block;
  width: 100% !important;
  height: 100% !important;
  border-radius: 4px;
}

.home-milestones__featured-content {
  flex: 1 1 50%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
  padding: clamp(24px, 4vw, 40px);
  box-sizing: border-box;
  background-color: #101115;
  border-left: 0.5px solid #3e3e3e;
}

.home-milestones__article-top {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}

.home-milestones__meta {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5rem;
  color: #808080;
}

.home-milestones__meta-date {
  flex-shrink: 0;
  text-align: right;
}

.home-milestones__headline {
  margin: 0;
  font-family: var(--hero-font-display);
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.75rem;
  letter-spacing: 0;
  color: #fff;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  overflow: hidden;
}

.home-milestones__headline--featured {
  font-size: 1.5rem;
  line-height: 2rem;
}

/* Column flex stretches `.hero__cta` to full width; left-align control + label (not centered). */
.home-milestones__featured-content .hero__cta,
.home-milestones__card .hero__cta {
  align-self: flex-start;
  justify-content: flex-start;
}

/* Three-up row: 340 + 340 + 340 @ 1020 — collapse shared borders */
.home-milestones__row {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  width: 100%;
  margin-top: -1px;
}

.home-milestones__card {
  flex: 1 1 33.333333%;
  min-width: 0;
  min-height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
  margin: 0 0 0 -1px;
  padding: clamp(24px, 4vw, 40px);
  box-sizing: border-box;
  background-color: #101115;
  border: 1px solid #3e3e3e;
}

.home-milestones__card:first-child {
  margin-left: 0;
}

.home-milestones__card .home-milestones__article-top {
  gap: 20px;
}

/* Phone-only stack; tablet+ keeps desktop 50/50 featured + three-up row */
@media (max-width: 719px) {
  .home-milestones__featured {
    flex-direction: column;
    min-height: 0;
  }
  .home-milestones__featured-media {
    aspect-ratio: 510/300;
    min-height: 0;
  }
  .home-milestones__featured-content {
    border-left: none;
    border-top: 0.5px solid #3e3e3e;
  }
  .home-milestones__row {
    flex-direction: column;
    margin-top: -1px;
  }
  .home-milestones__card {
    flex: 1 1 auto;
    margin-left: 0;
    margin-top: -1px;
    min-height: 0;
  }
}
/* Wide screens: scale milestones band from 1440px baseline through 2560px (Figma home-milestones-1920 / -2560). */
@media (min-width: 1440px) {
  .home-milestones {
    max-width: none;
    width: 100%;
    padding: clamp(80px, 5.556vw, 142.222px) 0;
  }
  .home-milestones__inner {
    max-width: max(var(--pattern-block-width), min(70.833vw, 1813.333px));
  }
  .home-milestones__header,
  .home-milestones__grid {
    max-width: clamp(1020px, 70.833vw, 1813.333px);
  }
  .home-milestones__header {
    gap: clamp(16px, 1.111vw, 28.444px) clamp(24px, 1.667vw, 42.667px);
    margin-bottom: clamp(40px, 2.778vw, 71.111px);
  }
  .home-milestones__title {
    font-size: clamp(3rem, 3.333vw, 5.333rem);
  }
  .home-milestones__featured {
    min-height: clamp(300px, 20.833vw, 533.333px);
    border-width: clamp(1px, 0.0694vw, 1.778px);
  }
  .home-milestones__featured-img {
    border-radius: clamp(4px, 0.278vw, 7.111px);
  }
  .home-milestones__featured-content {
    gap: clamp(24px, 1.667vw, 42.667px);
    padding: clamp(40px, 2.778vw, 71.111px);
    border-left-width: clamp(0.5px, 0.0347vw, 0.889px);
  }
  .home-milestones__article-top {
    gap: clamp(10px, 0.694vw, 17.778px);
  }
  .home-milestones__meta {
    font-size: clamp(1rem, 1.111vw, 1.7775rem);
    line-height: clamp(1.5rem, 1.667vw, 2.667rem);
  }
  .home-milestones__headline--featured {
    font-size: clamp(1.5rem, 1.667vw, 2.667rem);
    line-height: clamp(2rem, 2.222vw, 3.556rem);
  }
  .home-milestones__headline:not(.home-milestones__headline--featured) {
    font-size: clamp(1.25rem, 1.389vw, 2.222rem);
    line-height: clamp(1.75rem, 1.944vw, 3.111rem);
  }
  .home-milestones__row {
    min-height: clamp(300px, 20.833vw, 533.333px);
  }
  .home-milestones__card {
    min-height: clamp(300px, 20.833vw, 533.333px);
    gap: clamp(24px, 1.667vw, 42.667px);
    padding: clamp(40px, 2.778vw, 71.111px);
    border-width: clamp(1px, 0.0694vw, 1.778px);
  }
  .home-milestones__card .home-milestones__article-top {
    gap: clamp(20px, 1.389vw, 35.556px);
  }
  .home-milestones .hero__cta {
    gap: clamp(8px, 0.556vw, 14.222px);
    min-width: clamp(136px, 9.444vw, 241.778px);
    padding: clamp(8px, 0.556vw, 14.222px) clamp(12px, 0.833vw, 21.333px);
    font-size: clamp(1rem, 1.111vw, 1.7775rem);
    line-height: clamp(1.5rem, 1.667vw, 2.667rem);
  }
  .home-milestones .hero__cta-icon-img {
    height: clamp(16px, 1.111vw, 28.444px);
    width: auto;
  }
}
/* Tablet: smaller display headings for bands below the hero (layout stays desktop-style ≥720px).
   Hero `.hero__title` keeps full desktop clamp on tablet. */
@media (min-width: 720px) and (max-width: 1023px) {
  .home-feature-intro__title {
    font-size: clamp(1.375rem, 1.65vw + 0.7rem, 1.875rem);
  }
  .home-milestones__title {
    font-size: clamp(1.5rem, 1.9vw + 0.75rem, 2.25rem);
  }
}

/* ==========================================================================
   26. Kratos Advantages Icon Grid Block
   ========================================================================== */
.advantages-icon-grid {
  width: 100%;
  padding: clamp(48px, 10vw, 80px) 0;
  position: relative;
  z-index: 2;
}
.advantages-icon-grid__inner {
  max-width: var(--pattern-block-width);
  margin-inline: auto;
  padding: 0 clamp(20px, 5vw, 40px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(32px, 5vw, 40px);
}
.advantages-icon-grid__header {
  text-align: center;
  margin-bottom: 0;
}
.advantages-icon-grid__title {
  font-family: var(--font-display);
  font-size: 2.5rem;
  font-weight: 300;
  line-height: 1.2;
  color: var(--wp--preset--color--white);
  margin: 0;
  letter-spacing: 0.05em;
}
.advantages-icon-grid__lead {
  margin: 16px 0 0 0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  letter-spacing: 0;
  color: var(--wp--preset--color--white);
  max-width: min(850px, 100%);
  text-align: center;
}
@media (min-width: 1024px) {
  .advantages-icon-grid__lead {
    font-size: clamp(1rem, 1.111vw, 1.7775rem);
  }
}
.advantages-icon-grid__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px 48px;
}
.advantages-icon-grid__item {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}
.advantages-icon-grid__icon-wrap {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.advantages-icon-grid__icon {
  width: 100%;
  height: auto;
  display: block;
}
.advantages-icon-grid__text {
  margin: 0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1.125rem;
  line-height: 1.5;
  color: var(--wp--preset--color--white);
  font-weight: 400;
}
@media (max-width: 767px) {
  .advantages-icon-grid {
    padding: 48px 0;
  }
  .advantages-icon-grid__header {
    margin-bottom: 32px;
  }
  .advantages-icon-grid__title {
    font-size: 1.875rem;
  }
  .advantages-icon-grid__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* ==========================================================================
   27. Kratos Resource Featured Grid Block
   ========================================================================== */
.resource-featured-grid {
  width: 100%;
  padding: clamp(48px, 10vw, 80px) 0;
  position: relative;
  z-index: 2;
}
.resource-featured-grid__inner {
  max-width: var(--pattern-block-width);
  margin-inline: auto;
  padding: 0 clamp(20px, 5vw, 40px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: clamp(32px, 5vw, 40px);
  position: relative;
  z-index: 3;
}
.resource-featured-grid__header {
  text-align: center;
  margin-bottom: 0;
}
.resource-featured-grid__section-title {
  font-family: var(--font-display);
  font-size: 2.25rem;
  font-weight: 300;
  line-height: 1.2;
  color: var(--wp--preset--color--white);
  margin: 0;
}
.resource-featured-grid__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-bottom: 0;
}
.resource-featured-grid__card {
  padding: 0;
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.resource-featured-grid__card.content-panel,
.resource-featured-grid__featured.content-panel {
  background-color: #101115;
}
.resource-featured-grid__video-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.resource-featured-grid__featured-video-container {
  display: flex;
  flex-direction: row;
  width: 100%;
}
.resource-featured-grid__video-trigger {
  display: block;
  width: 100%;
  height: 100%;
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  position: relative;
  text-align: left;
}
.resource-featured-grid__featured-video-container .resource-featured-grid__video-trigger {
  width: 100%;
  height: 100%;
}
.resource-featured-grid__media-wrap {
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  background-color: #000;
  border-bottom: 0.5px solid #3e3e3e;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.resource-featured-grid__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.resource-featured-grid__card-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: 12px;
}
.resource-featured-grid__tag {
  font-family: var(--font-display);
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--wp--preset--color--brand-red);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.resource-featured-grid__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1.4;
  color: var(--wp--preset--color--white);
  flex-grow: 1;
}
.resource-featured-grid__cta {
  margin-top: auto;
  align-self: flex-start;
}
.resource-featured-grid__featured-wrap {
  width: 100%;
}
.resource-featured-grid__featured {
  display: flex;
  flex-direction: row;
  padding: 0;
  overflow: hidden;
}
.resource-featured-grid__featured-media {
  flex: 0 0 45%;
  width: 45%;
  overflow: hidden;
  background-color: #000;
  border-right: 0.5px solid #3e3e3e;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.resource-featured-grid__featured-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Image Fit settings for resource-featured-grid cards */
.resource-featured-grid__img--cover,
.resource-featured-grid__featured-img--cover {
  object-fit: cover !important;
  width: 100% !important;
  height: 100% !important;
}
.resource-featured-grid__img--contain,
.resource-featured-grid__featured-img--contain {
  object-fit: contain !important;
  width: 100% !important;
  height: 100% !important;
}
.resource-featured-grid__img--fill,
.resource-featured-grid__featured-img--fill {
  object-fit: fill !important;
  width: 100% !important;
  height: 100% !important;
}
.resource-featured-grid__img--fit-width,
.resource-featured-grid__featured-img--fit-width {
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}
.resource-featured-grid__img--fit-height,
.resource-featured-grid__featured-img--fit-height {
  width: auto !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: contain !important;
}
.resource-featured-grid__featured-body {
  flex: 1;
  padding: 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
  align-items: flex-start;
}
@media (max-width: 767px) {
  .resource-featured-grid {
    padding: 48px 0;
  }
  .resource-featured-grid__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .resource-featured-grid__featured {
    flex-direction: column;
  }
  .resource-featured-grid__featured-media {
    width: 100%;
    border-right: none;
    border-bottom: 0.5px solid #3e3e3e;
    aspect-ratio: 16/9;
  }
  .resource-featured-grid__featured-body {
    padding: 24px;
  }
}

/* Standardized Image Fit Utility Modifiers */
.split-layout-video-bg__right-img--contain,
.media-text-overlap__img--contain,
.media-text-overlap-reversed__img--contain,
.product-grid-6-col__shot-img--contain,
.split-bullets-resource-grid__img--contain,
.commercial-solutions-services__img--contain {
  object-fit: contain !important;
  width: 100%;
  height: 100%;
}

.split-layout-video-bg__right-img--fill,
.media-text-overlap__img--fill,
.media-text-overlap-reversed__img--fill,
.product-grid-6-col__shot-img--fill,
.split-bullets-resource-grid__img--fill,
.commercial-solutions-services__img--fill {
  object-fit: fill !important;
  width: 100%;
  height: 100%;
}

