/* Preserve the monumental brand; give the opening a direct commercial path. */
.homepage-hero { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; min-height: 100svh; width: 100%; padding: max(8.5rem, calc(var(--site-header-height,88px) + 2rem)) 3rem 1.75rem; overflow: hidden; background: #f5f7fa; text-align: center; color: #003b6d; }
#hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); pointer-events: none; }
#hero-overlay { position: absolute; inset: 0; background: rgb(255 255 255 / 88%); pointer-events: none; }
.hero-content { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; width: 100%; margin-block: auto; padding-block: 2rem 3rem; }
.hero-number { margin: 0; font-size: clamp(7rem,18vw,22rem); font-weight: 800; line-height: .8; letter-spacing: -.04em; }
.hero-number.text-metal-gold { background-image: linear-gradient(135deg,#8a7028 10%,#80641c 50%,#6e5621 90%); }
.hero-motto { margin-top: 2rem; max-width: 100%; font-size: .875rem; font-weight: 700; line-height: 1.7; letter-spacing: .16em; text-wrap: balance; }
.hero-description { max-width: 48ch; margin-top: 1rem; font-size: 1rem; line-height: 1.7; color: #365e80; text-wrap: balance; }
.hero-actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 1rem 1.75rem; margin-top: 2rem; }
.hero-quote { display: inline-flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 56px; padding: 1rem 1.5rem; border-radius: 2px; background: #003b6d; color: #fff; font-size: .875rem; font-weight: 600; text-align: left; transition: background-color 180ms; }
.hero-quote:hover { background: #005da9; }
.hero-quote:active { background: #003b6d; }
.hero-quote > svg { flex-shrink: 0; }
.hero-film { display: inline-flex; align-items: center; justify-content: center; gap: .75rem; min-height: 48px; color: #003b6d; font-size: .875rem; font-weight: 500; }
.hero-play-icon { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; border: 1px solid rgb(0 59 109 / 60%); border-radius: 50%; transition: border-color 180ms,background-color 180ms; }
.hero-play-icon svg { margin-left: 2px; }
.hero-film:hover .hero-play-icon, .hero-film:focus-visible .hero-play-icon { border-color: #80641c; background: #fff; }
.hero-film[hidden], .hero-bg-toggle[hidden], .hero-bg-toggle svg[hidden] { display: none; }
.hero-footer { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: end; gap: 2rem; width: 100%; max-width: 90rem; }
.hero-facts { justify-self: start; text-align: left; font-size: .75rem; line-height: 1.8; color: #365e80; }
.hero-facts strong { color: #003b6d; font-weight: 600; }
.hero-facts > p + p { margin-top: .25rem; }
.hero-history { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .625rem; min-height: 44px; padding: .5rem; color: #365e80; font-size: .75rem; line-height: 1.5; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.hero-history:hover { color: #003b6d; }
.hero-tools { justify-self: end; display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end; min-height: 4.5rem; }
.hero-operation { display: inline-flex; align-items: center; justify-content: flex-end; gap: .5rem; color: #365e80; font-size: .75rem; line-height: 1.5; font-weight: 600; }
.hero-operation > span { width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background: #25d366; }
.hero-bg-toggle { display: inline-flex; align-items: center; justify-content: flex-end; gap: .5rem; min-height: 44px; padding-inline: .25rem; color: #365e80; font-size: .75rem; line-height: 1.5; }
.hero-bg-toggle:hover { color: #003b6d; }
@media (max-width: 63.999rem) {
  .homepage-hero { padding-inline: 2rem; }
  .hero-tools { min-height: 0; }
  .hero-bg-toggle { display: none; }
}
@media (max-width: 47.999rem) {
  .homepage-hero { padding: max(7.5rem, calc(var(--site-header-height,88px) + 1.5rem)) 1.5rem 1.5rem; }
  .hero-content { padding-block: 1.5rem 2rem; }
  .hero-number { font-size: min(30vw,10rem); }
  .hero-motto { margin-top: 1.5rem; font-size: .8125rem; letter-spacing: .12em; }
  .hero-description { font-size: .9375rem; max-width: 34ch; }
  .hero-actions { flex-direction: column; width: 100%; gap: .75rem; margin-top: 1.5rem; }
  .hero-quote { width: min(100%,20rem); }
  .hero-footer { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 1rem; }
  .hero-history { grid-column: 1 / -1; grid-row: 1; justify-self: center; }
  .hero-facts, .hero-tools { grid-row: 2; }
}

/* Preserve the opening's hierarchy when landscape height is limited. */
@media (orientation: landscape) and (min-width: 30rem) and (max-height: 32rem) {
  .homepage-hero { padding-top: calc(var(--site-header-height,88px) + .5rem); padding-bottom: 1rem; }
  .hero-content { padding-block: .5rem 1.5rem; }
  .hero-number { font-size: clamp(4.5rem,20svh,7rem); }
  .hero-motto { margin-top: .75rem; line-height: 1.5; }
  .hero-description { margin-top: .5rem; line-height: 1.5; }
  .hero-actions { flex-direction: row; gap: .75rem 1.5rem; margin-top: .75rem; }
  .hero-quote { width: auto; }
}