/* Company metrics: four columns on desktop, two on smaller screens. */
.facts-bar .facts-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.facts-bar .fact {
  gap: 16px;
}
@media (max-width: 1199px) {
  .facts-bar .facts-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 28px;
  }
  .facts-bar .fact:nth-child(2n) { border-right: 0; }
}

/* Full panorama beneath a navy mask that deepens toward the copy. */
@media (max-width: 479px) {
  /* Stacked news cards need the link to follow the image's own height. */
  #update .news-image-link { height: auto; }
}

#about {
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: center;
  padding-block: 64px;
  background: #071f3b;
  color: #fff;
}
#about .about-backdrop {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
#about .about-backdrop > img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left center;
}
#about .about-backdrop::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,
    rgba(7,31,59,.28) 0%,
    rgba(7,31,59,.34) 28%,
    rgba(7,31,59,.70) 48%,
    rgba(7,31,59,.95) 66%,
    #071f3b 92%);
}
#about .about-grid {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 56px;
}
#about .about-copy { grid-column: 2; min-width: 0; max-width: 530px; }
#about .eyebrow { color: #9dceef; font-size: 11px; letter-spacing: .18em; }
#about .about-copy .section-title {
  margin-top: 20px;
  color: #fff;
  font-size: clamp(34px, 2.9vw, 44px);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .01em;
}
#about .section-title span { display: block; }
#about .about-copy p { margin: 20px 0; color: #cad8e6; font-size: 16px; line-height: 1.9; text-wrap: pretty; }
#about .about-tags {
  margin: 28px 0 18px;
  padding-top: 22px;
  border-top: 1px solid rgba(202,216,230,.2);
  gap: 12px 28px;
}
#about .about-tags span { color: #d5e5f1; border-left-color: #74b7e6; font-size: 13px; }
#about .text-link {
  color: #fff;
  border-bottom-color: rgba(157,206,239,.45);
  padding-block: 10px;
  gap: 36px;
  transition: color .2s, border-color .2s;
}
#about .text-link:hover { color: #9dceef; border-bottom-color: #9dceef; }
#about .text-link:focus-visible { outline: 2px solid #9dceef; outline-offset: 6px; }
@media (max-width: 1023px) {
  #about .about-grid { grid-template-columns: .65fr 1fr; gap: 32px; }
  #about .about-backdrop::after {
    background: linear-gradient(90deg,
      rgba(7,31,59,.34) 0%,
      rgba(7,31,59,.65) 25%,
      rgba(7,31,59,.96) 48%,
      #071f3b 88%);
  }
}
@media (max-width: 767px) {
  #about { padding-block: 48px; }
  #about .about-grid { grid-template-columns: 1fr; gap: 0; }
  #about .about-copy { grid-column: 1; max-width: none; }
  #about .about-backdrop > img { object-position: center top; }
  #about .about-backdrop::after {
    background: linear-gradient(90deg,
      rgba(7,31,59,.74) 0%,
      rgba(7,31,59,.92) 55%,
      #071f3b 100%);
  }
  #about .about-copy .section-title { font-size: clamp(28px, 7.7vw, 38px); }
  #about .about-tags { gap: 12px 24px; }
}

/* The page stays still while the two panels slide within one stage. */
.home-intro { background: #071f3b; color: #fff; }
.home-intro .intro-panel { min-height: calc(100svh - var(--header)); }
.home-intro .hero-content { padding-block: 56px 64px; }

/* Brand values on the left; transparent brush lettering on the right. */
#intro-brand .hero-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  align-items: center;
  gap: clamp(32px, 5vw, 80px);
}
.hero-main { min-width: 0; }
#intro-brand::before {
  background:
    linear-gradient(0deg, rgba(4,23,43,.64), rgba(4,23,43,0) 62%),
    linear-gradient(90deg, rgba(4,28,55,.96) 0%, rgba(4,33,62,.85) 34%, rgba(4,33,62,.32) 75%, rgba(4,33,62,.12));
}
.hero-calligraphy {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(14px, 2vw, 28px);
  width: min(100%, 620px);
  justify-self: end;
  opacity: .7;
  pointer-events: none;
}
.hero-calligraphy-line {
  display: block;
  position: relative;
  overflow: hidden;
  /* Crop the transparent canvas in CSS, preserving the source PNG's alpha. */
}
.hero-calligraphy-line img {
  position: absolute;
  top: 50%;
  max-width: none;
  height: auto;
  transform: translateY(-50%);
  filter: brightness(0) invert(.8);
}
.hero-calligraphy-line:first-child { width: 95.495495%; aspect-ratio: 1060 / 140; }
.hero-calligraphy-line:first-child img { width: 204.716981%; left: 0; }
.hero-calligraphy-line:last-child { aspect-ratio: 1110 / 140; }
.hero-calligraphy-line:last-child img { width: 195.495495%; right: 0; }
@media print {
  .hero-calligraphy { opacity: 1; }
  .hero-calligraphy-line img { filter: none; }
}
@media (max-width: 767px) {
  #intro-brand .hero-content { grid-template-columns: 1fr; gap: 40px; }
  #intro-brand::before {
    background:
      linear-gradient(0deg, rgba(4,23,43,.64), rgba(4,23,43,0) 62%),
      linear-gradient(90deg, #041c37ed, #04213eb8 65%, #04213e75);
  }
  .hero-calligraphy { gap: 6px; width: min(100%, 430px); }
}

.home-intro.is-switch-enhanced { height: var(--intro-height); overflow-anchor: none; }
.is-switch-enhanced .intro-stage {
  position: relative;
  height: 100%;
  overflow: hidden;
  isolation: isolate;
}
.is-switch-enhanced .intro-panel {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  scrollbar-width: thin;
  align-items: safe center;
  transition: transform 760ms cubic-bezier(.22,.68,.2,1);
}
.is-switch-enhanced #intro-brand { transform: translateY(calc(var(--intro-index, 0) * -100%)); }
.is-switch-enhanced #about { transform: translateY(calc((1 - var(--intro-index, 0)) * 100%)); }
@media (prefers-reduced-motion: reduce) {
  .is-switch-enhanced .intro-panel { transition: none; }
}
@media print {
  .home-intro.is-switch-enhanced { height: auto; }
  .is-switch-enhanced .intro-stage { height: auto; overflow: visible; }
  .home-intro .intro-panel { position: relative; height: auto; min-height: 0; overflow: visible; transform: none !important; }
}