:root {
  --hero-system-gold: #e0bd68;
  --hero-system-navy: #071731;
  --hero-system-paper: #fffdf6;
  --hero-system-copy: #dbe6ef;
}

.hero-gold-text {
  color: var(--hero-system-gold);
}

/* The Roundtables hero is the visual benchmark. Apply its button hierarchy to
   the first, page-level hero only so lower-page conversion sections retain
   their own hierarchy. */
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.primary,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.primary:visited {
  min-height: 46px;
  padding: 0 21px;
  border: 1px solid var(--hero-system-gold) !important;
  border-radius: 0;
  background: var(--hero-system-gold) !important;
  color: var(--hero-system-navy) !important;
  box-shadow: none;
  transform: none;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.primary:hover,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.primary:focus-visible,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.primary:active {
  border-color: var(--hero-system-paper) !important;
  background: var(--hero-system-paper) !important;
  color: var(--hero-system-navy) !important;
  box-shadow: 0 9px 20px rgba(0, 0, 0, 0.18);
  transform: none;
}

body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.secondary,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.secondary:visited,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.text-button,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.text-button:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 21px;
  border: 1px solid var(--hero-system-gold) !important;
  border-radius: 0;
  background: transparent !important;
  color: var(--hero-system-paper) !important;
  box-shadow: none;
  transform: none;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.secondary:hover,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.secondary:focus-visible,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.secondary:active,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.text-button:hover,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.text-button:focus-visible,
body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.text-button:active {
  border-color: var(--hero-system-gold) !important;
  background: var(--hero-system-gold) !important;
  color: var(--hero-system-navy) !important;
  transform: none;
}

body:not(.page-roundtables) main > section:first-of-type .hero-actions .button:focus-visible {
  outline: 2px solid var(--hero-system-paper);
  outline-offset: 3px;
}

/* Homepage split-panel conversion. Paint the full left side at section level
   so the navy field reaches the viewport edge and the centre seam. The
   adjacent architecture element and its 3D scene remain untouched. */
@media (min-width: 1101px) {
  .home-page .home-hero::before {
    position: absolute;
    z-index: -1;
    top: 0;
    right: 46.6%;
    bottom: 0;
    left: calc((100vw - 100%) / -2);
    display: block;
    width: auto;
    background:
      linear-gradient(135deg, rgba(18, 45, 83, 0.42), transparent 58%),
      linear-gradient(rgba(224, 189, 104, 0.032) 1px, transparent 1px),
      linear-gradient(90deg, rgba(224, 189, 104, 0.032) 1px, transparent 1px),
      var(--hero-system-navy);
    background-size: auto, 44px 44px, 44px 44px, auto;
    content: "";
    pointer-events: none;
    transform: none;
  }
}

.home-page .home-hero-copy {
  position: relative;
  isolation: isolate;
  background: transparent;
  color: var(--hero-system-paper);
}

.home-page .home-hero-copy::before,
.home-page .home-hero-copy::after {
  display: none;
  content: none;
}

@media (max-width: 1100px) {
  .home-page .home-hero-copy {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    padding: clamp(2rem, 6vw, 3.5rem);
    background:
      linear-gradient(135deg, rgba(18, 45, 83, 0.42), transparent 58%),
      linear-gradient(rgba(224, 189, 104, 0.032) 1px, transparent 1px),
      linear-gradient(90deg, rgba(224, 189, 104, 0.032) 1px, transparent 1px),
      var(--hero-system-navy);
    background-size: auto, 44px 44px, 44px 44px, auto;
  }
}

@media (max-width: 560px) {
  .home-page .home-hero-copy {
    padding: 1.75rem 1.25rem 2rem;
  }
}

.home-page .home-hero-copy .eyebrow,
.home-page .home-hero-copy .hero-gold-text {
  color: var(--hero-system-gold);
}

.home-page .home-hero-copy h1 {
  color: var(--hero-system-paper);
}

.home-page .home-hero-copy > p:not(.eyebrow) {
  color: var(--hero-system-copy);
}

.home-page .home-hero .hero-positioning-grid {
  color: rgba(255, 253, 246, 0.82);
}

.home-page .home-hero .hero-positioning-token:not(:last-child)::after {
  color: var(--hero-system-gold);
}

@media (max-width: 480px) {
  body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.primary,
  body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.secondary,
  body:not(.page-roundtables) main > section:first-of-type .hero-actions .button.text-button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.page-roundtables) main > section:first-of-type .hero-actions .button {
    transition: none;
  }
}