.story-home { width: 100%; overflow-x: clip; }
.story-home a { color: inherit; text-decoration: none; }

/* Live-forensic header architecture: fixed overlay, 101px desktop / 72.5625px below 1280. */
.story-ee72-shell.home .story-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 40;
  width: 100%;
  height: var(--ref-header-height-desktop);
  color: #fff;
  pointer-events: none;
}
.story-ee72-shell.home .story-header-rail {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  width: 100%;
  height: var(--ref-header-height-desktop);
  padding: 20px var(--ref-shell-inset) 0;
}
.story-ee72-shell.home .story-primary-nav { display: none; }
.story-ee72-shell.home .story-brand-region { justify-self: start; }
.story-ee72-shell.home .story-brand {
  position: absolute;
  top: 40px;
  left: 40px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 128px;
  height: 36px;
  font-size: var(--ref-brand-desktop-size);
  line-height: var(--ref-brand-desktop-line);
  letter-spacing: var(--ref-brand-desktop-tracking);
}
.story-ee72-shell.home .story-brand-image--supplied {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: brightness(0) invert(1);
  transition: filter 300ms cubic-bezier(.4, 0, 1, 1);
}
.story-ee72-shell.home .story-header.is-dark-context .story-brand-image--supplied {
  filter: brightness(0);
}
.story-ee72-shell.home .story-header-actions {
  position: absolute;
  top: 29.5px;
  right: 40px;
  justify-self: end;
}
.story-ee72-shell.home .screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.story-search {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  height: 42px;
}
.story-search-field { display: block; }
.story-ee72-shell.home .story-search input {
  width: 0;
  min-width: 0;
  height: 24px;
  padding: 0 0 3px;
  border: 0 !important;
  border-bottom: 1px solid currentColor !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0;
  background: transparent !important;
  color: inherit;
  font-family: var(--font-primary);
  font-size: var(--ref-search-size);
  line-height: var(--ref-search-line) !important;
  font-weight: var(--ref-search-weight);
  letter-spacing: normal;
  word-spacing: 0;
  appearance: none;
  opacity: 0;
  transition: width var(--ref-search-duration) var(--motion-ease-basic), opacity var(--ref-search-duration) var(--motion-ease-basic);
}
.story-ee72-shell.home .story-search.is-open input { width: 166px; opacity: 1; }
.story-search-toggle {
  display: grid;
  place-items: center;
  width: 40px;
  height: 42px;
  padding: 0;
  color: inherit;
  cursor: pointer;
}
.story-search-icon {
  position: relative;
  display: block;
  width: 12px;
  height: 12px;
  border: 1px solid currentColor;
  border-radius: 50%;
}
.story-search-icon::after {
  content: "";
  position: absolute;
  right: -4px;
  bottom: -2px;
  width: 5px;
  height: 1px;
  background: currentColor;
  transform: rotate(45deg);
  transform-origin: left center;
}

/* Hero height follows the rendered half-column, avoiding scrollbar-inclusive vw drift. */
.story-home-lead {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  margin: 0;
  background: #050505;
}
.story-home-lead-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 0 50px;
  background: #050505;
  color: #fff;
  text-align: center;
}
.story-home-lead > .story-home-media { aspect-ratio: 755 / 892; }
.story-home-lead h1 {
  width: 100%;
  max-width: var(--ref-hero-measure);
  margin: 0;
  font-family: var(--font-primary);
  font-size: var(--ref-hero-size);
  line-height: var(--ref-hero-line);
  font-weight: var(--ref-hero-weight);
  letter-spacing: normal !important;
  text-align: center;
  text-transform: none;
}
.story-home-meta,
.story-home-deck {
  font-family: var(--font-primary);
  font-size: var(--ref-meta-size);
  line-height: var(--ref-meta-line);
  font-weight: var(--ref-meta-weight);
  letter-spacing: normal;
  word-spacing: 0;
  text-transform: uppercase;
}
.story-home-lead .story-home-meta {
  width: 100%;
  max-width: var(--ref-hero-measure);
  margin: var(--ref-hero-meta-gap) 0 0;
  font-weight: var(--ref-hero-weight);
}
.story-home-media {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #e7e5e1;
}
.story-home-image,
.story-home-media-fallback {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
}
.story-home-image { object-fit: cover; object-position: center; }
.story-home-media-fallback { background: #e7e5e1; }

/* Paired modules split at the measured 640px threshold. */
.story-home-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; margin: 0; }
.story-home-card { display: flex; flex-direction: column; min-width: 0; margin: 0; }
.story-home-card > .story-home-media { height: auto; aspect-ratio: 120 / 121; }
.story-home-card-copy {
  width: 100%;
  min-height: 244px;
  margin: 0;
  padding: var(--ref-caption-pad-top) var(--ref-caption-pad-x) var(--ref-caption-pad-bottom);
  background: #fff;
  color: var(--ref-ink);
}
.story-home-card h2,
.story-home-full h2,
.story-home-carousel h2 {
  margin: 0;
  font-family: var(--font-primary);
  font-size: var(--ref-story-title-size);
  line-height: var(--ref-story-title-line);
  font-weight: var(--ref-story-title-weight);
  letter-spacing: normal !important;
  text-transform: uppercase;
}
.story-home-card .story-home-deck,
.story-home-card .story-home-meta,
.story-home-full .story-home-deck,
.story-home-carousel .story-home-deck { margin: var(--ref-caption-gap) 0 0; }

/* Live EE72 editorial hierarchy: excerpts are uppercase and clamp at two lines. */
.story-home-deck {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.story-home-card-copy > h2,
.story-home-card-copy > .story-home-deck,
.story-home-card-copy > .story-home-meta { max-width: var(--ref-story-measure); }

.story-home-full { width: 100%; margin: 0; background: #fff; }
.story-home-full > .story-home-media { height: auto; aspect-ratio: 1920 / 999; }
.story-home-full-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 203px;
  margin: 0;
  padding: var(--ref-caption-pad-top) var(--ref-caption-pad-x) var(--ref-feature-pad-bottom);
  text-align: center;
  color: var(--ref-ink);
}
.story-home-full h2,
.story-home-full .story-home-deck {
  width: 100%;
  max-width: var(--ref-feature-measure);
  margin-right: auto;
  margin-left: auto;
}

/* Independently authored centered multi-panel carousel matching the measured live system. */
.story-home-carousel {
  position: relative;
  width: 100%;
  height: calc(100vh - 90px);
  min-height: 710px;
  max-height: 910px;
  margin: 0;
  overflow: hidden;
  background: #050505;
  color: #fff;
  touch-action: pan-y;
}
.story-home-carousel-viewport,
.story-home-carousel-track,
.story-home-carousel-slide { width: 100%; height: 100%; }
.story-home-carousel-viewport { overflow: hidden; }
.story-home-carousel-track {
  display: flex;
  transform: translate3d(0, 0, 0);
  transition: transform var(--ref-content-duration) var(--motion-ease-basic);
  will-change: transform;
}
.story-home-carousel-track.is-jump { transition: none; }
.story-home-carousel-slide { position: relative; flex: 0 0 100%; width: 100%; min-width: 0; overflow: hidden; }
.story-home-carousel-slide > .story-home-media { position: absolute; inset: 0; }
.story-home-carousel-shade { position: absolute; inset: 0; z-index: 1; background: rgba(0, 0, 0, 0.42); transition: background-color var(--ref-content-duration) var(--motion-ease-in-out); }
.story-home-carousel-slide.is-active .story-home-carousel-shade { background: rgba(0, 0, 0, 0.18); }
.story-home-carousel-copy {
  position: absolute;
  right: 40px;
  bottom: var(--ref-feature-pad-bottom);
  left: 40px;
  z-index: 2;
  color: #fff;
  text-align: center;
  opacity: 0;
  transform: translateY(var(--motion-carousel-copy-offset));
  transition: opacity var(--ref-content-duration) var(--ref-ease-standard), transform var(--ref-content-duration) var(--ref-ease-standard);
  transition-delay: 0s;
}
.story-home-carousel-slide.is-active .story-home-carousel-copy { opacity: 1; transform: translateY(0); transition-delay: var(--motion-delay-carousel-copy); }
.story-home-carousel-control {
  position: absolute;
  top: 50%;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 80px;
  height: 80px;
  color: #fff;
  font-size: var(--ref-control-type-size);
  cursor: pointer;
  transform: translateY(-50%);
}
.story-home-carousel-control--previous { left: 0; }
.story-home-carousel-control--next { right: 0; }
.story-home-carousel-pagination {
  position: absolute;
  right: 20px;
  bottom: 40px;
  left: 20px;
  z-index: 3;
  display: flex;
  gap: 2px;
}
.story-home-carousel-pagination button { flex: 1; height: 20px; padding: 9px 0; cursor: pointer; }
.story-home-carousel-pagination span { display: block; width: 100%; height: 2px; background: rgba(255,255,255,.4); }
.story-home-carousel-pagination button[aria-current="true"] span { background: #fff; }

/* Fixed navigation is separate from the document footer; visibility is driven
   by the runtime controller's body classes (see EE72_STATE_MACHINE.md). */
.story-bottom-nav {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  width: 100%;
  height: 91px;
  border-top: 1px solid rgba(0,0,0,.2);
  background: #fff;
  color: #000;
  transform: translateY(0);
  transition: transform 0.5s ease-in-out;
}
/* Hidden (pushed off bottom) — down-scroll, or up-scroll at the page bottom. */
body.is-scrolled-up.story-ee72-shell.is-at-bottom .story-bottom-nav,
body.is-scrolled-down.story-ee72-shell .story-bottom-nav {
  transform: translateY(100%);
}
/* Visible during the 500 ms slow-scroll grace window while still scrolling down. */
body.is-scrolled-down.story-ee72-shell.delay-reached .story-bottom-nav {
  transform: none;
}
.story-bottom-nav-inner { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 0 40px; gap: 20px; }
.story-bottom-nav-primary { min-width: 0; }
.story-bottom-nav-list,
.story-bottom-nav .story-nav-list { display: flex; align-items: center; gap: 20px; margin: 0; padding: 0; list-style: none; font-size: var(--ref-nav-size); line-height: var(--ref-nav-line); font-weight: var(--ref-nav-active-weight); letter-spacing: normal; word-spacing: 0; text-transform: uppercase; }
.story-bottom-nav-secondary { max-width: 50%; }
.story-bottom-nav-list--secondary { justify-content: flex-end; font-weight: var(--ref-nav-weight); }

/*
 * Live EE72 keeps each paired module in the viewport above the fixed bottom
 * navigation while the following editorial surface progresses over it. The
 * runtime controller (assets/js/runtime.js) derives the mode and offsets from
 * measured module/viewport/navigation heights; no scroll position is calculated.
 *
 * - SHORT mode (pairHeight <= viewportHeight - navHeight): native CSS sticky
 *   via the .story-parallax class (position: sticky; top: 0).
 * - TALL mode: the controller writes inline position: sticky / top per frame.
 *   Pairs sit at position: relative in the flow until pinned.
 */
.story-home > .story-home-pair {
  position: relative;
  isolation: isolate;
  z-index: 1;
}
.story-home > .story-home-pair.story-parallax {
  position: sticky;
  top: 0;
}
.story-home > .story-home-full,
.story-home > .story-home-carousel {
  position: relative;
  isolation: isolate;
  z-index: 1;
}

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

@media (min-width: 1024px) and (max-width: 1279px) {
  .story-home-lead > .story-home-media { aspect-ratio: 1 / 1; }
  .story-home-lead h1 { max-width: 100%; }
  .story-home-card-copy > h2,
  .story-home-card-copy > .story-home-deck,
  .story-home-card-copy > .story-home-meta { max-width: var(--ref-story-measure-tablet); }
  .story-home-full-copy > h2,
  .story-home-full-copy > .story-home-deck { max-width: var(--ref-feature-measure-tablet); }
}

@media (min-width: 640px) and (max-width: 1023px) {
  .story-home-card-copy > h2,
  .story-home-card-copy > .story-home-deck,
  .story-home-card-copy > .story-home-meta { max-width: var(--ref-story-measure-tablet); }
  .story-home-full-copy > h2,
  .story-home-full-copy > .story-home-deck { max-width: var(--ref-feature-measure-tablet); }
}

@media (min-width: 640px) {
  .story-home-carousel-slide { flex-basis: 69%; width: 69%; }
  .story-home-carousel-pagination { right: 25%; left: 25%; }
}

@media (min-width: 834px) {
  .story-home-carousel-copy { bottom: 92px; }
  .story-home-carousel-control { width: 94px; }
  .story-home-carousel-pagination { bottom: 60px; }
}

@media (min-width: 1024px) {
  .story-home-carousel-slide { flex-basis: 762px; width: 762px; }
  .story-home-carousel-copy { right: auto; left: 50%; width: min(var(--ref-carousel-measure-laptop), calc(100% - 80px)); transform: translate(-50%, var(--motion-carousel-copy-offset)); }
  .story-home-carousel-slide.is-active .story-home-carousel-copy { transform: translate(-50%, 0); }
}

@media (min-width: 1280px) {
  .story-home-carousel-copy { bottom: 122px; width: min(var(--ref-story-measure), calc(100% - 80px)); }
  .story-home-carousel-pagination { right: 35%; left: 35%; }
}

@media (max-width: 1279px) {
  .story-ee72-shell.home .story-header { height: var(--ref-header-height-compact); }
  .story-ee72-shell.home .story-header-rail {
    grid-template-columns: 1fr auto 1fr;
    height: var(--ref-header-height-compact);
    padding: 0 20px;
  }
  .story-ee72-shell.home .story-menu-toggle { display: block; justify-self: start; color: inherit; }
  .story-ee72-shell.home .story-brand-region { justify-self: center; }
  .story-ee72-shell.home .story-brand {
    top: 20px;
    left: 50%;
    justify-content: center;
    width: 94px;
    height: 25px;
    font-size: var(--ref-brand-compact-size);
    line-height: var(--ref-brand-compact-line);
    transform: translateX(-50%);
  }
  .story-ee72-shell.home .story-header-actions { top: 15.28125px; right: 20px; justify-self: end; }
  .story-home-lead-copy { padding-top: 0; }
  .story-home-card > .story-home-media { aspect-ratio: 119 / 120; }
  .story-home-card-copy { min-height: 224px; padding: 20px 20px var(--ref-caption-pad-bottom); }
  .story-home-full-copy { min-height: 243px; padding: var(--ref-caption-pad-top) 20px var(--ref-feature-pad-bottom); }
  .story-home-carousel { height: 710px; min-height: 710px; max-height: none; }
  .story-bottom-nav { height: 65px; }
  .story-bottom-nav-inner { padding: 0 20px; }
  .story-bottom-nav-secondary { display: none; }
  .story-bottom-nav-primary { width: 100%; overflow-x: auto; scrollbar-width: none; }
  .story-bottom-nav-primary::-webkit-scrollbar { display: none; }
  .story-bottom-nav-list,
  .story-bottom-nav .story-nav-list { width: max-content; min-width: 100%; justify-content: center; }
  .story-ee72-shell.home .story-footer { height: 64px; }
}

@media (max-width: 1023px) {
  .story-home-lead {
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(290px, 1fr);
    min-height: calc(100vh - var(--ref-nav-height-mobile));
  }
  .story-home-lead > .story-home-media { grid-row: 1; aspect-ratio: 1 / 1; }
  .story-home-lead-copy { grid-row: 2; min-height: 290px; }
  .story-home-lead h1 { max-width: var(--ref-hero-measure); }
  .story-ee72-shell.home .story-footer { font-size: var(--ref-footer-size-compact); line-height: var(--ref-meta-line); }
}

@media (max-width: 639px) {
  .story-home-lead { grid-template-rows: auto minmax(0, 1fr); min-height: 936px; }
  .story-home-lead > .story-home-media { aspect-ratio: 393 / 480; }
  .story-home-lead-copy { min-height: 0; padding: 0 20px; }
  .story-home-lead h1 { max-width: none; }
  .story-home-pair { grid-template-columns: 1fr; gap: 12px; }
  .story-home-card > .story-home-media,
  .story-home-full > .story-home-media { aspect-ratio: 393 / 480; }
  .story-home-card-copy { min-height: 204px; padding: 20px 20px var(--ref-caption-pad-bottom); }
  .story-home-full-copy { min-height: 248px; padding: 20px 20px var(--ref-feature-pad-bottom); text-align: left; align-items: flex-start; }
  .story-home-carousel { width: 100%; height: auto; min-height: 0; aspect-ratio: 3 / 4; }
  .story-home-carousel-copy { right: 40px; bottom: var(--ref-feature-pad-bottom); left: 40px; }
  .story-home-carousel-control { display: none; }
  .story-bottom-nav { height: 80px; }
  .story-ee72-shell.home .story-footer { height: 79px; min-height: 79px; }
}

@media (max-width: 399px) {
  .story-home-lead { min-height: 921px; }
  .story-home-full-copy { min-height: 264px; }
}

@media (max-width: 375px) {
  .story-home-full-copy { min-height: 308px; }
}

@media (hover: hover) {
  .story-home-carousel-control:hover,
  .story-home-carousel-pagination button:hover { background-color: rgba(255,255,255,.08); }
}

@media (prefers-reduced-motion: reduce) {
  .story-home-carousel-track,
  .story-home-carousel-copy,
  .story-home-carousel-shade,
  .story-bottom-nav,
  .story-search input { transition-duration: 0.01ms !important; }
}