:root {
  --cl-ink: #0b1118;
  --cl-navy: #102a43;
  --cl-steel: #a8b2bc;
  --cl-champagne: #b79a65;
  --cl-paper: #f4f2ed;
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.home-attachment-hero {
  background: linear-gradient(180deg, #f4f8fc 0%, #ffffff 100%);
  border-bottom: 1px solid #e5edf5;
  padding: 24px 0 30px;
}

.home-attachment-hero-inner {
  display: flex;
  justify-content: center;
}

.home-attachment-hero-image {
  display: block;
  width: auto;
  max-width: 100%;
  height: min(82vh, 980px);
  object-fit: contain;
  background: #ffffff;
  box-shadow: 0 20px 58px rgba(15, 45, 80, .12);
}

.hero-banner-premium {
  min-height: 680px;
  display: flex;
  align-items: center;
  padding: 110px 0 120px;
  background-position: center;
}

.hero-banner-premium .hero-bg {
  opacity: 1;
  background: linear-gradient(90deg, rgba(7, 12, 18, .96) 0%, rgba(7, 12, 18, .82) 38%, rgba(7, 12, 18, .22) 70%, rgba(7, 12, 18, .08) 100%);
}

.hero-banner-premium::after {
  background: linear-gradient(180deg, rgba(7, 12, 18, .04), rgba(7, 12, 18, .58));
}

.hero-banner-premium .hero-content { max-width: 760px; }
.hero-banner-premium h1 {
  max-width: 720px;
  margin: 0 0 24px;
  font-size: clamp(3.1rem, 6vw, 5.75rem);
  font-weight: 760;
  line-height: .98;
  letter-spacing: -.045em;
  text-wrap: balance;
}

.hero-eyebrow {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 24px;
  color: #d5c39c;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .24em;
}
.hero-eyebrow::before { content: ""; width: 52px; height: 1px; background: #b79a65; }
.hero-banner-premium .hero-subtitle {
  max-width: 34em;
  margin-bottom: 34px;
  color: #d9e0e6;
  font-size: 1.08rem;
  line-height: 1.85;
}
.hero-banner-premium .btn { border-radius: 2px; padding: 13px 26px; letter-spacing: .06em; }
.hero-banner-premium .btn-primary { background: #b79a65; color: #0b1118; box-shadow: none; font-weight: 700; }
.hero-banner-premium .btn-secondary { border-color: rgba(255,255,255,.42); color: #f5f7f9; background: rgba(8,14,21,.3); }

.identity-strip { background: #0b1118; color: #eef2f5; border-top: 1px solid rgba(183,154,101,.45); }
.identity-grid { display: grid; grid-template-columns: repeat(3, 1fr); padding-top: 34px; padding-bottom: 36px; }
.identity-grid > div { min-height: 92px; padding: 0 32px; border-right: 1px solid rgba(168,178,188,.2); }
.identity-grid > div:first-child { padding-left: 0; }
.identity-grid > div:last-child { border-right: 0; }
.identity-grid span { display: block; color: #b79a65; font-size: .72rem; letter-spacing: .16em; }
.identity-grid strong { display: block; margin: 7px 0 4px; font-size: 1.05rem; letter-spacing: .04em; }
.identity-grid p { color: #aeb9c3; font-size: .9rem; }

@media (max-width: 820px) {
  .home-attachment-hero { padding: 12px 0 18px; }
  .home-attachment-hero-image {
    width: 100%;
    height: auto;
    box-shadow: 0 12px 34px rgba(15, 45, 80, .1);
  }
  .hero-banner-premium { min-height: 620px; padding: 84px 0 92px; background-position: 62% center; }
  .hero-banner-premium .hero-bg { background: linear-gradient(90deg, rgba(7,12,18,.96), rgba(7,12,18,.72)); }
  .hero-banner-premium h1 { font-size: clamp(2.65rem, 12vw, 4.2rem); }
  .identity-grid { grid-template-columns: 1fr; }
  .identity-grid > div { padding: 22px 0; border-right: 0; border-bottom: 1px solid rgba(168,178,188,.2); }
  .identity-grid > div:last-child { border-bottom: 0; }
}