/*
 * EVE AI Core — Public Hero: shared black-hero + tight-top layer (BOTH themes)
 * ---------------------------------------------------------------------------
 * Loaded on every public marketing page right after public-light.css. Unlike
 * that sheet (light-mode-only), these rules apply in BOTH themes.
 *
 * Product direction:
 *  1. The hero BACKGROUND is always pure BLACK — never the blue slate
 *     gradient (styles.css #0f1730→#141c33 + blue/purple glows) and never a
 *     navy band. Hero photos are unaffected: every photo hero paints its
 *     image on a child element (.hero-bg) or on ::before (home galaxy),
 *     which sit on top of the black band.
 *  2. The hero text box sits CLOSER to the sticky header — the shared 72px
 *     (and per-page 60–84px) top padding read as dead space.
 */

/* 1. Hero band: always black. Kills the blue gradient/radial bases painted
      on the containers themselves; child .hero-bg photos still cover it. */
.hero,
.il-hero,
.ds-hero,
.appl-hero,
.changelog-hero,
.ct-hero,
.pd-hero {
  background: #000 !important;
  background-color: #000 !important;
}

/* The styles.css aurora glow (::after — blue/purple radial, blur 8px) reads
   as a blue haze on the black band. The home page already hides its own
   ::after, so this is safe to kill globally. The ::before 5%-alpha grid is
   left alone — the home galaxy image is painted there. */
.hero::after {
  display: none !important;
}

/* 2. The gap between the sticky header and the hero content is 14px on EVERY public
      hero — glass panel or plain text, .hero or the photo-hero template. It was 44px
      here, 36px on the photo-hero wrappers and 10px on one page: three different
      values for the same piece of whitespace.

      Applied at EVERY width, not desktop-only. The old note here said mobile must not be
      forced UP — that was written when this value was 44px. At 14px the concern does not
      apply, and leaving it desktop-only left phones measuring 0px top and bottom, which
      is not "14px on all public pages". */
.hero,
.il-hero,
.ds-hero,
.appl-hero,
.changelog-hero,
.ct-hero,
.pd-hero,
/* Page-local hero containers that never used the shared .hero class and so kept their
   own spacing: 56px on /coreguard, 120px on /authority-lab and /policy-compiler, 88px
   on /demo, 40px on /cognitive-demo, 36px on the home page. */
.cg-hero,
.al-hero,
.govchat-hero,
.cog-hero,
.blog-hero,
.page-hero,
/* .ion-hero and .dp-hero-wrap measured 0/0 — they were never in any rule. .hero-zone
   measured 14/26; it holds only .hero-bg + the panel, so unlike .main-content it can
   safely take the bottom padding too. */
.ion-hero,
.dp-hero-wrap,
.hero-zone {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}

/* A binding min-height leaves dead space the padding cannot remove: /eve-core measured
   122px above AND below its copy inside a 640px hero. Letting the hero size to its
   content is what makes 14/14 true rather than nominal. Where min-height is not binding
   (content already taller) this changes nothing. */
.hero,
.il-hero,
.ds-hero,
.appl-hero,
.changelog-hero,
.ct-hero,
.pd-hero,
.cg-hero,
.al-hero,
.govchat-hero,
.cog-hero,
.blog-hero,
.page-hero,
.ion-hero,
.dp-hero-wrap,
.hero-zone {
  min-height: 0 !important;
}

/* Photo-hero template (case-study, architecture, procurement, …): the panel is not
   inside a .hero at all, it sits in the wrapper beside a > .hero-bg. Same 14px.
   `html body` because some of these wrappers are padded by page-level CSS whose load
   order against this sheet is not guaranteed — the extra specificity wins regardless. */
html body .main-content:has(> .hero-bg),
html body .ct-wrap:has(> .hero-bg) {
  padding-top: 14px !important;
}

/* Photo band wrapper (architecture / procurement / proof-sheet). Those pages put a
   FIXED-height .hero-bg directly in .main-content — the whole page column — so the
   picture ran on past the hero and the next section sat on top of it (measured 129px,
   127px and 91px of content over the image). Wrapping the band with its copy in a
   relative box lets the photo end exactly where the hero ends, at any viewport.
   .main-content keeps its own top padding at 0 here, or the 14px would be doubled. */
.eve-hero-band {
  position: relative;
  padding: 14px 0;
}

.eve-hero-band > .hero-bg {
  top: 0 !important;
  bottom: 0 !important;
  height: auto !important;
}

html body .main-content:has(> .eve-hero-band) {
  padding-top: 0 !important;
}
/* NOTE: top only. On this template the wrapper is the whole page column, not just the
   hero — .main-content holds every section below the fold too. Setting padding-bottom
   here would collapse the space above the footer on /architecture, /procurement and
   /proof-sheet. The gap under the panel on these pages is governed by the .hero-bg
   band height, not by wrapper padding. */

/* 3. Hero breadcrumbs: several pages inline slate ink (light-page design)
      but the hero band is always black - force readable light ink. */
.hero nav[aria-label="Breadcrumb"],
.hero nav[aria-label="Breadcrumb"] a { color: #9fb0c9 !important; }
.hero nav[aria-label="Breadcrumb"] span { color: #cdd6e4 !important; }
.hero nav[aria-label="Breadcrumb"] a:hover { color: #ffffff !important; }

/* 4. The frosted hero panel keeps a width cap so the PHOTO stays visible.
      Removing the cap (max-width:none) was tried and reverted: combined with the 14px
      top/bottom padding it left the panel blanketing the entire hero, so the hero photo
      was effectively invisible and the band read as a plain dark slab. The cap is what
      frames the panel against the picture.

      min() rather than the pages' flat 1400px: at 1440 a 1400px panel leaves a 20px
      sliver either side, which is not a visible margin. This keeps a proportional
      gutter at every width while never exceeding the original 1400px. */
html body .eve-hero-glass {
  max-width: min(1400px, calc(100% - 220px)) !important;
}

@media (max-width: 900px) {
  /* Phones have no room to give away — the panel keeps the full column there. */
  html body .eve-hero-glass { max-width: 100% !important; }
}