/* Harmony Properties Version 23 — immersive bilingual homepage hero. */
.home-hero {
  position: relative;
  display: grid;
  min-height: clamp(580px, 72vh, 720px);
  overflow: hidden;
  color: #fff;
  background: var(--navy);
  isolation: isolate;
}

.home-hero__media,
.home-hero__overlay {
  position: absolute;
  inset: 0;
}

.home-hero__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 54% 48%;
}

.home-hero__overlay {
  z-index: 1;
  background: linear-gradient(
    90deg,
    rgba(5, 38, 77, .97) 0%,
    rgba(5, 38, 77, .9) 29%,
    rgba(5, 38, 77, .62) 47%,
    rgba(5, 38, 77, .18) 70%,
    rgba(5, 38, 77, .04) 100%
  );
}

.home-hero__inner {
  position: relative;
  z-index: 2;
  display: flex;
  width: 100%;
  align-items: center;
  padding-top: clamp(64px, 8vh, 96px);
  padding-bottom: clamp(64px, 8vh, 96px);
}

.home-hero__content {
  width: min(100%, 610px);
}

.home-hero__eyebrow {
  margin: 0 0 18px;
  color: var(--orange);
  font-size: .86rem;
  font-weight: 700;
  letter-spacing: .11em;
  line-height: 1.2;
  text-transform: uppercase;
}

.home-hero h1 {
  max-width: 610px;
  margin: 0;
  color: #fff;
  font-size: clamp(3.625rem, 5vw, 4.5rem);
  font-weight: 700;
  letter-spacing: -.035em;
  line-height: 1.01;
  text-wrap: balance;
}

.home-hero h1 sup {
  position: relative;
  top: -.06em;
  margin-inline-start: .05em;
  font-size: .34em;
  line-height: 0;
  vertical-align: super;
}

.home-hero__summary {
  max-width: 560px;
  margin: 26px 0 0;
  color: rgba(255, 255, 255, .9);
  font-size: clamp(1.08rem, 1.35vw, 1.24rem);
  line-height: 1.65;
}

.home-hero__actions {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 34px;
  flex-wrap: wrap;
}

.home-hero .button {
  min-height: 54px;
  padding-inline: 28px;
}

.home-hero .button--orange {
  color: #fff;
  background: var(--orange);
  border-color: var(--orange);
}

.home-hero .button--orange:hover {
  color: #fff;
  background: #e94f00;
  border-color: #e94f00;
}

.home-hero__secondary {
  color: #fff;
  background: rgba(5, 38, 77, .18);
  border-color: rgba(255, 255, 255, .78);
  backdrop-filter: blur(3px);
}

.home-hero__secondary:hover {
  color: var(--navy);
  background: #fff;
  border-color: #fff;
}

.home-hero__trust {
  margin: 22px 0 0;
  color: rgba(255, 255, 255, .82);
  font-size: .94rem;
  font-weight: 600;
  line-height: 1.55;
}

@media (prefers-reduced-motion: no-preference) {
  .home-hero__eyebrow,
  .home-hero h1,
  .home-hero__summary,
  .home-hero__actions,
  .home-hero__trust {
    animation: hp-v23-hero-enter .34s cubic-bezier(.22, .8, .3, 1) both;
  }

  .home-hero h1 { animation-delay: .04s; }
  .home-hero__summary { animation-delay: .08s; }
  .home-hero__actions { animation-delay: .12s; }
  .home-hero__trust { animation-delay: .16s; }
}

@keyframes hp-v23-hero-enter {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 900px) {
  .home-hero {
    min-height: clamp(540px, 68vh, 660px);
  }

  .home-hero__overlay {
    background: linear-gradient(
      90deg,
      rgba(5, 38, 77, .97) 0%,
      rgba(5, 38, 77, .89) 42%,
      rgba(5, 38, 77, .38) 72%,
      rgba(5, 38, 77, .08) 100%
    );
  }

  .home-hero__content { width: min(58%, 540px); }
  .home-hero h1 { font-size: clamp(3rem, 6.5vw, 3.8rem); }
}

@media (max-width: 767px) {
  .home-hero {
    display: block;
    min-height: 0;
    overflow: hidden;
  }

  .home-hero__media {
    position: relative;
    height: clamp(300px, 82vw, 340px);
    background: #f4f1ed;
  }

  .home-hero__media img {
    object-position: 52% 42%;
  }

  .home-hero__overlay {
    top: 0;
    bottom: auto;
    height: clamp(300px, 82vw, 340px);
    background: linear-gradient(180deg, rgba(5, 38, 77, 0) 62%, rgba(5, 38, 77, .32) 100%);
  }

  .home-hero__inner {
    display: block;
    padding-top: 30px;
    padding-bottom: 34px;
    background: var(--navy);
  }

  .home-hero__content {
    width: 100%;
    max-width: none;
  }

  .home-hero__eyebrow {
    margin-bottom: 14px;
    font-size: .78rem;
  }

  .home-hero h1 {
    max-width: 100%;
    font-size: clamp(2.25rem, 10.5vw, 2.75rem);
    line-height: 1.05;
  }

  .home-hero__summary {
    margin-top: 18px;
    font-size: 1rem;
    line-height: 1.62;
  }

  .home-hero__actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 25px;
  }

  .home-hero .button {
    width: 100%;
    min-height: 52px;
  }

  .home-hero__secondary {
    background: transparent;
  }

  .home-hero__trust {
    margin-top: 18px;
    font-size: .88rem;
  }
}