@font-face {
  font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 500;
  font-display: swap; src: url('/brand/fonts/cormorant-garamond-latin-500.woff2') format('woff2');
}

.hero-brand { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; }
.hero-logo-stage { position: relative; width: clamp(132px, 15vw, 194px); margin: 0 0 30px; }
.hero-logo {
  display: block; width: 100%; height: auto; overflow: visible;
}
.hero-logo-line {
  stroke-dasharray: 1; stroke-dashoffset: 0;
  animation: rfx-logo-draw 11s cubic-bezier(.4,0,.2,1) infinite;
}
.hero-logo-line--lower { animation-name: rfx-logo-draw-lower; }
.hero-logo-center { transform-origin: 256px 256px; animation: rfx-logo-center 11s ease-out infinite; }
.hero-title {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(30px, 7.2vw, 104px); font-weight: 500;
  line-height: 1.08; letter-spacing: .075em; white-space: nowrap;
  color: #f3e9d4; margin: 0; padding-left: .075em;
}
.hero .hero-eyebrow { color: #c6af7e; font-weight: 500; letter-spacing: .32em; margin-bottom: 32px; }
.hero .hero-tag { font-size: 11px; letter-spacing: .26em; margin: 24px 0 30px; color: #c0b8a8; }
.hero .hero-scrim {
  background: radial-gradient(ellipse 65% 74% at 50% 45%, rgba(5,5,7,.84), rgba(5,5,7,.56) 72%, rgba(5,5,7,.9)),
    linear-gradient(to bottom, rgba(5,5,7,.5), rgba(5,5,7,.16) 48%, #050507);
}
.hero .hero-video { opacity: 0; }
.hero .hero-video.is-playing { opacity: .65; transition: opacity 900ms ease-out; }
.hero .hero-grid-lines { opacity: .4; }
.hero .hero-scroll::after { animation: none; opacity: .6; }
.hero[data-logo-paused] .hero-logo-line, .hero[data-logo-paused] .hero-logo-center,
html.rfx-intro-active .hero-logo-line, html.rfx-intro-active .hero-logo-center { animation-play-state: paused; }
/* 1.67s draw, 9s fully still, then a 0.33s fade to reset the stroke. */
@keyframes rfx-logo-draw {
  0% { stroke-dashoffset: 1; opacity: 1; }
  14.09%, 97% { stroke-dashoffset: 0; opacity: 1; }
  100% { stroke-dashoffset: 0; opacity: 0; }
}
@keyframes rfx-logo-draw-lower {
  0%, 1.09% { stroke-dashoffset: 1; opacity: 1; }
  15.18%, 97% { stroke-dashoffset: 0; opacity: 1; }
  100% { stroke-dashoffset: 0; opacity: 0; }
}
@keyframes rfx-logo-center {
  0%, 10.45% { opacity: 0; transform: scale(.92); }
  14.55%, 97% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(1); }
}
@media (max-width: 600px) {
  .hero { padding: 106px 20px 110px; }
  .hero .hero-eyebrow { font-size: 9px; letter-spacing: .2em; }
  .hero-logo-stage { margin-bottom: 26px; }
  .hero .hero-tag { max-width: 280px; line-height: 1.8; letter-spacing: .18em; }
  .hero .hero-scroll { left: 28px; bottom: 28px; transform: none; align-items: flex-start; }
  .hero .hero-scroll::after { height: 26px; }
}
@media (max-height: 650px) and (min-width: 601px) {
  .hero { padding-top: 98px; padding-bottom: 100px; }
  .hero-logo-stage { width: 112px; margin-bottom: 18px; }
  .hero-title { font-size: clamp(36px, 6vw, 76px); }
  .hero .hero-eyebrow { margin-bottom: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-logo-line, .hero-logo-center { animation: none; }
}
