.open {
  --seed-face: var(--h5-theme-glass);
  --seed-edge: var(--h5-theme-edge);
  --seed-glow: var(--h5-theme-glow);
  --seed-shade-side: var(--h5-theme-side);
  --seed-shade-under: var(--h5-theme-under);
  --seed-core-face: var(--h5-theme-core);
  --seed-core-edge: var(--h5-theme-light);
  --icon-ink: var(--h5-theme-icon-ink);
  --stage-bloom: var(--h5-theme-bloom);
  --stage-floor: var(--h5-theme-floor);
}
.open .bit__icon {
  width: var(--h5-cube-icon-size);
  height: var(--h5-cube-icon-size);
  filter: var(--h5-cube-icon-contrast);
  fill: none;
  color: var(--icon-ink);
  stroke: currentColor;
  stroke-width: var(--h5-cube-icon-stroke);
  stroke-linecap: round;
  stroke-linejoin: round;
}
/* Highlight the individual glass cube without changing its 3D geometry. */
.open.has-firefly-cell .spin { animation-play-state: paused; }
.bit__face.is-firefly-icon-selected .bit__icon {
  opacity: var(--h8-firefly-original-icon, 1) !important;
}
.h8-cell-fireflies {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: translateZ(var(--h8-firefly-icon-plane));
  pointer-events: none;
}
.open.has-firefly-cell .bit.is-firefly-selected > .bit__face {
  background-color: var(--seed-face);
  border-color: var(--h7-cube-hover-edge);
  box-shadow: var(--h7-cube-hover-glow);
}
@media (any-hover: hover) and (any-pointer: fine) {
  .open .bit > .bit__face {
    transition: background-color var(--h7-cube-hover-duration) var(--ease-out),
      border-color var(--h7-cube-hover-duration) var(--ease-out),
      box-shadow var(--h7-cube-hover-duration) var(--ease-out);
  }
  .open .bit:hover > .bit__face {
    background-color: var(--h7-cube-hover-face);
    border-color: var(--h7-cube-hover-edge);
    box-shadow: var(--h7-cube-hover-glow);
  }
  .open .bit:hover .bit__icon { color: var(--h7-cube-hover-edge); }
}
@media (prefers-reduced-motion: reduce) {
  .open .bit > .bit__face { transition: none; }
}
.h5-hero-copy {
  --h5-nav-cyan: var(--h5-theme-colour);
  --h5-nav-ink: var(--h5-theme-light);
  --h5-copy-cta-background: var(--h5-theme-primary);
  --h5-copy-cta-ink: var(--h5-theme-primary-ink);
  --h5-copy-cta-border: var(--h5-theme-primary-border);
  --h5-copy-primary-glow: var(--h5-theme-primary-glow);
  --h5-copy-primary-hover-glow: var(--h5-theme-primary-hover);
  --h5-outline-cta-background: var(--h5-theme-outline-background);
  --h5-outline-cta-border: var(--h5-theme-outline-border);
  --h5-outline-cta-glow: var(--h5-theme-outline-glow);
  --h5-border-gradient: var(--h5-theme-border-gradient);
  position: absolute;
  top: var(--h5-copy-top);
  left: 50%;
  transform: translate(-50%, calc(var(--h5-hero-content-drop) + var(--h5-copy-drop) + var(--h7-copy-balance)));
  width: calc(100% - var(--space-6));
  max-width: var(--h5-copy-width);
  z-index: var(--z-raised);
  text-align: center;
  color: var(--h5-theme-heading);
}
.h5-hero-copy__eyebrow {
  margin: 0 0 var(--space-2); font: var(--h5-copy-eyebrow);
  letter-spacing: var(--h5-copy-tracking); color: var(--h5-theme-highlight);
}
.h5-hero-copy__eyebrow span { margin-inline: var(--space-2); }
.h5-hero-copy h1 { margin: 0; font: var(--h5-copy-title); letter-spacing: var(--tracking-tight); }
.h5-hero-copy h1 span { display: block; color: var(--h5-theme-highlight); }
.h5-hero-copy__description {
  max-width: var(--h5-copy-description-width); margin: var(--space-3) auto 0;
  font: var(--h5-copy-description); color: var(--h5-theme-description);
}
.h5-hero-copy__actions { display: flex; justify-content: center; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-4); }
.h5-hero-cta {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-4);
  min-height: var(--tap-min); padding: var(--space-3) var(--space-5);
  border: var(--h5-nav-border); border-radius: var(--radius-pill);
  font: var(--h5-copy-button); text-decoration: none;
  transition: box-shadow var(--dur-med) var(--ease-out), border-color var(--dur-med) var(--ease-out);
}
.h5-hero-cta--primary {
  background: var(--h5-copy-cta-background); color: var(--h5-copy-cta-ink);
  border: var(--h5-copy-cta-border); box-shadow: var(--h5-copy-primary-glow);
}
.h5-hero-cta--secondary { position: relative; background: var(--h5-outline-cta-background); color: var(--h5-nav-ink); border: var(--h5-outline-cta-border); box-shadow: var(--h5-outline-cta-glow); }
.h5-hero-cta:hover { border-color: var(--h5-nav-cyan); box-shadow: var(--h5-nav-glow); }
.h5-hero-cta--secondary:hover { box-shadow: var(--h5-outline-cta-glow); }
.h5-hero-cta--primary:hover { box-shadow: var(--h5-copy-primary-hover-glow); }
.h5-hero-copy .h5-hero-cta--primary {
  background:var(--h5-services-card-background);
  background-clip:padding-box;
  -webkit-backdrop-filter:var(--h5-services-blur);
  backdrop-filter:var(--h5-services-blur);
  transition:box-shadow var(--dur-med) var(--ease-out),border-color var(--dur-med) var(--ease-out),color var(--dur-med) var(--ease-out);
}
.h5-hero-copy .h5-hero-cta--primary::before {
  content:''; position:absolute; inset:0; border-radius:inherit;
  background:var(--h5-copy-cta-background); opacity:1; pointer-events:none;
  transition:opacity var(--dur-med) var(--ease-out);
}
.h5-hero-copy .h5-hero-cta--primary.is-firefly-active::before { opacity:0; }
.h5-hero-copy .h5-hero-cta--primary.is-firefly-active {
  border-color: var(--h5-theme-light);
  color: var(--h5-theme-light);
  box-shadow: var(--h5-services-card-hover-shadow);
}
.h5-hero-copy .is-firefly-active > span {
  text-shadow: var(--h8-firefly-label-shadow);
}
.h5-hero-cta:focus-visible { outline: var(--h5-nav-focus); outline-offset: var(--focus-offset); }
.open::before, .h5-backdrop {
  top: calc(var(--h5-visual-top) + var(--h5-hero-content-drop));
  bottom: calc(var(--h5-hero-content-drop) * -1);
}
.h5-hero-copy h1, .h5-hero-copy__eyebrow, .h5-hero-copy__description { text-shadow: var(--h5-theme-text-shadow); }
@media (max-width: 1100px) {
  :root { --h5-copy-top: var(--space-5); --h5-copy-drop: 0px; }
  /* Compact layouts keep copy above the image on the black page surface. */
  .h5-hero-copy {
    --h5-theme-heading: var(--h5-theme-light);
    --h5-theme-description: var(--h5-theme-light);
    --h5-theme-highlight: var(--h5-theme-colour);
    --h5-theme-text-shadow: none;
  }
}
@media (max-width: 560px) {
  .h5-hero-copy__eyebrow { letter-spacing: var(--tracking-caps); }
  .h5-hero-copy__eyebrow span { margin-inline: var(--space-1); }
  .h5-hero-copy__actions { flex-direction: column; align-items: center; gap: var(--space-3); }
  .h5-hero-cta { width: max-content; max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .h5-hero-cta { transition: none; }
  .h5-hero-copy .h5-hero-cta--primary,.h5-hero-copy .h5-hero-cta--primary::before { transition:none; }
}

.h6-fit-screen {
  --h5-copy-drop: var(--space-2);
  --h5-hero-content-drop: var(--space-3);
}
/* Keep the desktop cube prominent even when OS scaling leaves a short viewport. */
@media (min-width: 1101px) {
  .open { min-height: max(100svh, var(--h8-hero-min-height, 100svh)); }
}
@media (max-height: 900px) {
  .h6-fit-screen {
    --h5-nav-height: var(--h5-nav-height-mobile);
    --h5-copy-drop: var(--space-2);
    --h5-hero-content-drop: 0px;
    --h8-scene-gap: var(--space-2);
  }
  .h6-fit-screen .h5-hero-copy__eyebrow { margin-bottom: var(--space-1); }
  .h6-fit-screen .h5-hero-copy__description { margin-top: var(--space-2); }
  .h6-fit-screen .h5-hero-copy__actions { margin-top: var(--space-2); }
}
/* Reserve measured scene height at every width, including landscape phones. */
.h5-story .open { min-height:var(--h8-hero-min-height,100svh); }