/* Shared public Hero: the VPC composition, with subject-specific artwork.
   No JavaScript, framework or portal dependency. */
body.brand-hero-page { --bg: #080f18; background: var(--bg); color: var(--text, #f3f7fd); }
:root[data-theme="light"] body.brand-hero-page { --bg: #f3f7fc; background: var(--bg); }
body.brand-hero-page::before, body.brand-hero-page::after { display: none; }
body.brand-hero-page .brand-hero {
  --hero-wash: #080f18;
  --hero-wash-solid: #080f18f5;
  --hero-wash-mid: #080f1880;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: 650px;
  margin: 0;
  padding: 0;
  background: var(--bg, #080f18);
  border: 0;
  border-bottom: 1px solid var(--line);
}
body.brand-hero-page .brand-hero::before { display: none; }
body.brand-hero-page .brand-hero::after {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  z-index: -1;
  height: auto;
  width: auto;
  max-width: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: none;
  opacity: 1;
  filter: none;
  mask-image: none;
  pointer-events: none;
  background:
    linear-gradient(90deg, var(--hero-wash) 5%, var(--hero-wash) 24%, var(--hero-wash-solid) 40%, var(--hero-wash-mid) 59%, transparent 83%),
    linear-gradient(0deg, var(--hero-wash), transparent 30%);
}
body.brand-hero-page .brand-hero__art {
  position: absolute;
  inset: 0 0 0 36%;
  z-index: -2;
  display: block;
  width: auto;
  max-width: none;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
  opacity: 1;
}
body.brand-hero-page .brand-hero__art::before { display: none; }
body.brand-hero-page .brand-hero__art picture { display: block; width: 100%; height: 100%; }
body.brand-hero-page .brand-hero__art img {
  display: block;
  width: 100%; height: 100%; max-height: none;
  object-fit: cover; object-position: 55% 50%;
  border: 0; border-radius: 0; background: transparent;
}
body.brand-hero-page .brand-hero__inner {
  width: min(1360px, calc(100% - 80px));
  margin-inline: auto;
  padding-block: 76px 82px;
}
body.brand-hero-page .brand-hero__copy { position: relative; z-index: 1; width: min(720px, 56%); min-width: 0; }
body.brand-hero-page .brand-hero h1 {
  max-width: none;
  margin: 24px 0 0;
  font-family: var(--sans, Inter, sans-serif);
  font-size: clamp(40px, 4.35vw, 66px);
  font-weight: 650;
  font-style: normal;
  line-height: 1.08;
  letter-spacing: -.045em;
  text-wrap: balance;
  hyphens: none;
  overflow-wrap: normal;
  word-break: normal;
  color: var(--text);
}
body.brand-hero-page .brand-hero h1 em,
body.brand-hero-page .brand-hero h1 .accent-line { color: var(--accent); font-style: normal; }
body.brand-hero-page .brand-hero__copy > :is(.kicker, .eyebrow, .pf-kicker) {
  margin: 0;
  color: var(--accent);
  font: 650 11px/1.6 var(--sans, Inter, sans-serif);
  letter-spacing: .16em;
  text-transform: uppercase;
}
body.brand-hero-page .brand-hero__copy > :is(.hero-lead, .pf-hero__lead, .pf-case-hero__lead),
body.brand-hero-page .brand-hero__copy > p:not(.kicker, .eyebrow, .pf-kicker) {
  max-width: 570px;
  margin: 26px 0 0;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.75;
  text-wrap: pretty;
}
body.brand-hero-page .brand-hero :is(.hero-actions, .pf-hero__actions) { margin-top: 30px; gap: 12px; }
body.brand-hero-page .brand-hero :is(.button, .btn) { min-height: 50px; padding: 14px 22px; font-size: 14px; }
body.brand-hero-page .brand-hero :is(.button.ghost, .btn-secondary, .btn-ghost) { background-color: var(--bg); }
body.brand-hero-page .brand-hero .pf-customer-link { margin-top: 16px; }
body.brand-hero-page .brand-hero--home { margin-top: 92px; min-height: 650px; }
body.brand-hero-page .brand-hero--home .brand-hero__art { left: 31%; }
body.brand-hero-page .brand-hero--home .brand-hero__art img { object-position: 58% 50%; }
body.brand-hero-page .brand-hero--compact { min-height: 450px; }
body.brand-hero-page .brand-hero--contacts .brand-hero__art img { object-position: 50% 27%; }
body.brand-hero-page .brand-hero--case .brand-hero__art { opacity: .8; }
@media (min-width: 781px) {
  body.brand-hero-page .brand-hero--case::after {
    background: linear-gradient(90deg, var(--hero-wash) 5%, var(--hero-wash) 34%, var(--hero-wash-solid) 48%, var(--hero-wash-mid) 66%, transparent 90%),
      linear-gradient(0deg, var(--hero-wash), transparent 30%);
  }
}
body.brand-hero-page .brand-hero--case .brand-hero__art img { object-position: center top; }
body.brand-hero-page .brand-hero--case h1 { font-size: clamp(38px, 4.2vw, 62px); }
body.brand-hero-page .brand-hero--case .pf-hero__actions .button { min-height: 44px; padding: 11px 16px; }

/* Former side panels become an open explanatory strip below the artwork. */
.brand-hero-page .brand-hero-notes { padding-block: 30px; border-bottom: 1px solid var(--line); background: var(--bg); }
.brand-hero-page .brand-hero-notes > .shell { width: min(1360px, calc(100% - 80px)); margin-inline: auto; }
body.brand-hero-page .brand-hero-notes .hero-aside {
  display: block; width: auto; max-width: none; min-height: 0;
  margin: 0; padding: 0; border: 0; border-radius: 0;
  background: transparent; box-shadow: none; overflow: visible;
}
.brand-hero-page .brand-hero-notes :is(.engine-head, .engine-topology, .engine-telemetry, .engine-state, .engine-result) { display: none; }
body.brand-hero-page .brand-hero-notes .engine-summary { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); align-items: start; gap: 40px; padding: 0; border: 0; }
body.brand-hero-page .brand-hero-notes .engine-summary strong { font: 600 22px/1.35 var(--sans, Inter, sans-serif); max-width: 450px; letter-spacing: -.025em; }
body.brand-hero-page .brand-hero-notes .engine-summary p { margin: 0; max-width: 760px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.brand-hero-page .brand-hero-notes--portfolio .pf-hero__aside { display: grid; grid-template-columns: .85fr 1.3fr 1fr; gap: 36px; padding: 0; border: 0; }
.brand-hero-page .brand-hero-notes--portfolio .pf-hero__aside > .pf-index { margin: 0; grid-column: auto; }
.brand-hero-page .brand-hero-notes--portfolio .pf-mini-facts { margin: 0; }
.brand-hero-page .brand-hero-notes--case .pf-shell { width: 100%; }
.brand-hero-page .brand-hero-notes--case .pf-facts { margin: 0; }
.brand-hero-page .brand-hero-diagram { margin: 0 0 30px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; transform: none; }
.brand-hero-page .brand-hero-diagram::before { display: none; }
.brand-hero-page .brand-hero-diagram .pf-pacs-scene { min-height: 0; }
body.brand-hero-page.access-body .access-main { display: block; padding: 0; }
.brand-hero-page .access-layout { display: block; max-width: 840px; margin-block: 56px; }
.brand-hero-page .brand-hero--error { min-height: 100vh; }
.brand-hero-page .brand-hero--error .error-logo { display: block; width: 188px; height: auto; margin-bottom: 50px; }
.brand-hero-page .brand-hero--error .btn { margin-top: 28px; }
.brand-hero-page .brand-hero--error .hero-actions .btn { margin-top: 0; }

:root[data-theme="light"] body.brand-hero-page .brand-hero {
  --hero-wash: #f3f7fc;
  --hero-wash-solid: #f3f7fcf5;
  --hero-wash-mid: #f3f7fc85;
}
:root[data-theme="light"] body.brand-hero-page .brand-hero__art { opacity: .85; }
:root[data-theme="light"] body.brand-hero-page .brand-hero--case .brand-hero__art { opacity: 1; }
:root[data-theme="light"] .brand-hero-page .brand-hero--error .error-logo { content: url("/assets/images/home-blue/logo-light.svg"); }

@media (min-width: 1921px) {
  body.brand-hero-page .brand-hero { min-height: 700px; }
  body.brand-hero-page .brand-hero__art { left: max(36%, calc(50% - 160px)); }
}
@media (max-width: 1100px) {
  body.brand-hero-page .brand-hero { min-height: 580px; }
  body.brand-hero-page .brand-hero__copy { width: 61%; }
  body.brand-hero-page .brand-hero h1 { font-size: clamp(38px, 4.7vw, 52px); }
  body.brand-hero-page .brand-hero__art { left: 30%; }
  body.brand-hero-page .brand-hero--compact { min-height: 410px; }
}
@media (max-width: 780px) {
  body.brand-hero-page .brand-hero { min-height: 0; display: block; }
  body.brand-hero-page .brand-hero__inner { width: calc(100% - 40px); padding-block: 48px 220px; }
  body.brand-hero-page .brand-hero__copy { width: 100%; max-width: 650px; }
  body.brand-hero-page .brand-hero h1 { font-size: clamp(38px, 6.4vw, 52px); }
  body.brand-hero-page .brand-hero__art,
  body.brand-hero-page .brand-hero--home .brand-hero__art { inset: auto 0 0 12%; height: 350px; opacity: .85; }
  body.brand-hero-page .brand-hero__art img { object-position: center 55%; }
  body.brand-hero-page .brand-hero::after {
    background: linear-gradient(180deg, var(--hero-wash) 0%, var(--hero-wash) calc(100% - 280px), var(--hero-wash-solid) calc(100% - 240px), transparent calc(100% - 100px)),
      linear-gradient(90deg, var(--hero-wash), transparent 65%),
      linear-gradient(0deg, var(--hero-wash), transparent 22%);
  }
  body.brand-hero-page .brand-hero__copy > :is(.hero-lead, .pf-hero__lead, .pf-case-hero__lead),
  body.brand-hero-page .brand-hero__copy > p:not(.kicker, .eyebrow, .pf-kicker) { max-width: 610px; font-size: 16px; line-height: 1.7; }
  body.brand-hero-page .brand-hero--home { margin-top: 78px; }
  body.brand-hero-page .brand-hero--compact .brand-hero__inner { padding-bottom: 150px; }
  body.brand-hero-page .brand-hero--compact .brand-hero__art { height: 270px; }
  body.brand-hero-page .brand-hero--compact::after { background: linear-gradient(180deg, var(--hero-wash) 20%, var(--hero-wash-solid) calc(100% - 180px), transparent 90%), linear-gradient(0deg, var(--hero-wash), transparent 40%); }
  .brand-hero-page .brand-hero-notes > .shell { width: calc(100% - 40px); }
  body.brand-hero-page .brand-hero-notes .engine-summary { grid-template-columns: 1fr; gap: 14px; }
  .brand-hero-page .brand-hero-notes--portfolio .pf-hero__aside { grid-template-columns: 1fr; gap: 22px; }
  .brand-hero-page .access-layout { width: calc(100% - 40px); }
}
@media (max-width: 540px) {
  body.brand-hero-page .brand-hero__inner { width: calc(100% - 40px); padding-top: 38px; padding-bottom: 220px; }
  body.brand-hero-page .brand-hero h1,
  body.brand-hero-page .brand-hero--case h1 { font-size: clamp(34px, 9.5vw, 44px); line-height: 1.12; margin-top: 20px; letter-spacing: -.045em; text-wrap: pretty; }
  body.brand-hero-page .brand-hero__copy > :is(.hero-lead, .pf-hero__lead, .pf-case-hero__lead),
  body.brand-hero-page .brand-hero__copy > p:not(.kicker, .eyebrow, .pf-kicker) { margin-top: 22px; font-size: 15px; }
  body.brand-hero-page .brand-hero__art { height: 310px; }
  body.brand-hero-page .brand-hero :is(.hero-actions, .pf-hero__actions) { margin-top: 26px; }
  body.brand-hero-page .brand-hero .hero-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  body.brand-hero-page .brand-hero :is(.button, .btn) { padding-inline: 16px; font-size: 13px; }
  body.brand-hero-page .brand-hero--case .pf-hero__actions { display: flex; flex-wrap: wrap; }
  body.brand-hero-page .brand-hero--case .pf-hero__actions .button { width: auto; }
  body.brand-hero-page .brand-hero--case .pf-hero__actions .button:first-child { width: 100%; }
  .brand-hero-page .brand-hero-notes { padding-block: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .brand-hero-page .brand-hero, .brand-hero-page .brand-hero * { animation: none !important; transition: none !important; }
}
