/* Live text sits behind a genuine transparent portrait. */
.lovezy-home .site-header:not(.is-scrolled):not(.menu-open) { color: #111; }
.lovezy-home .site-header:not(.is-scrolled):not(.menu-open) a,
.lovezy-home .site-header:not(.is-scrolled):not(.menu-open) a > span,
.lovezy-home .site-header:not(.is-scrolled):not(.menu-open) #menu-toggle { color: #111; text-shadow: none; }
.lovezy-home .site-header:not(.is-scrolled):not(.menu-open) a:hover { color: #555; }
.lovezy-home .site-header:not(.is-scrolled):not(.menu-open) a[aria-current] > div { background: #111; }
.lovezy-home .site-header > div { max-width: none; padding-inline: clamp(24px, 4vw, 72px); }
.lovezy-home .site-header > div > div > a > span { font-size: 24px; letter-spacing: -.025em; }
.lovezy-hero { position: relative; isolation: isolate; height: 100svh; min-height: min(640px, 100svh); overflow: hidden; background: #dcdde0; color: #111; }
.hero-name { position: absolute; z-index: 1; top: 34%; left: 50%; transform: translate(-50%, -50%); width: max-content; margin: 0; color: #0a0a0a; font-family: 'Bebas Neue', sans-serif; font-size: clamp(120px, 24.5vw, 440px); font-weight: 700; line-height: .9; letter-spacing: -.035em; white-space: nowrap; user-select: none; }
.hero-portrait { position: absolute; z-index: 2; left: 50%; bottom: -29%; transform: translateX(-50%); width: auto; height: 132%; max-width: none; object-fit: contain; pointer-events: none; }
.hero-intro { position: absolute; z-index: 3; top: 132px; left: clamp(24px, 4vw, 72px); margin: 0; font-size: 14px; font-weight: 500; line-height: 1.7; letter-spacing: -.02em; }
.hero-orbit { position: absolute; z-index: 0; width: 670px; height: 670px; border: 1px solid rgb(17 17 17 / 20%); border-radius: 50%; pointer-events: none; }
.hero-orbit-one { top: -440px; left: -310px; }
.hero-orbit-two { bottom: -570px; right: -190px; width: 1000px; height: 1000px; transform: rotate(-15deg); }
.hero-cta-wrap { position: absolute; z-index: 4; bottom: 48px; left: 50%; transform: translateX(-50%); }
.lovezy-cta { display: inline-flex; justify-content: center; align-items: center; gap: 16px; min-height: 52px; padding: 14px 32px; border: 1px solid #e02028; border-radius: 6px; background: #e02028; color: #ffffff; font-size: 16px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; box-shadow: 0 5px 24px rgb(0 0 0 / 14%); transition: background .2s, transform .2s; }
.lovezy-cta:hover { background: #c71921; }
.lovezy-cta:active { transform: scale(.98); }
.lovezy-cta svg { transition: transform .2s; }
.lovezy-cta:hover svg { transform: translateX(4px); }
.hero-scroll { position: absolute; z-index: 3; right: clamp(24px, 4vw, 72px); bottom: 48px; display: flex; flex-direction: column; gap: 12px; align-items: flex-end; font-size: 12px; font-weight: 500; }
.hero-scroll span { font-size: 26px; line-height: 1; }
.lovezy-home .site-header a:focus-visible, .lovezy-hero a:focus-visible { outline-color: #111; }
.lovezy-home .site-header.is-scrolled a:focus-visible, .lovezy-home .site-header.menu-open a:focus-visible { outline-color: #e02028; }
@media (min-width: 1600px) { .hero-name { font-size: 25vw; } }
@media (max-width: 767px) {
  .lovezy-hero { min-height: min(620px, 100svh); }
  .hero-name { top: 37%; font-size: 31vw; letter-spacing: -.045em; }
  .hero-portrait { height: 90%; bottom: 0; }
  .hero-intro { top: 92px; font-size: 12px; }
  .hero-cta-wrap { bottom: 36px; }
  .hero-scroll { right: 20px; bottom: 110px; font-size: 10px; gap: 8px; }
  .lovezy-cta { min-height: 48px; padding: 12px 26px; font-size: 14px; }
  .hero-orbit-one { left: -470px; }
  .hero-orbit-two { right: -760px; }
}
@media (max-height: 600px) and (min-width: 768px) {
  .lovezy-hero { min-height: 480px; }
  .hero-intro { top: 100px; }
  .hero-name { top: 43%; font-size: 22vw; }
  .hero-cta-wrap, .hero-scroll { bottom: 28px; }
}

/* Independent translation preserves the portrait and heading's centering transforms. */
.hero-name{translate:calc(var(--hero-x,0px) * -.45) calc(var(--hero-y,0px) * -.45)}
.hero-portrait{translate:var(--hero-x,0px) var(--hero-y,0px)}
.hero-orbit-one{translate:calc(var(--hero-x,0px) * -.8) calc(var(--hero-y,0px) * -.8)}
.hero-orbit-two{translate:calc(var(--hero-x,0px) * .35) calc(var(--hero-y,0px) * .35)}
@media(prefers-reduced-motion:reduce){.hero-name,.hero-portrait,.hero-orbit{translate:none}}

/* Framing for the replacement portrait. */
.hero-portrait{height:110%;bottom:-16%}
@media(max-width:767px){.hero-portrait{height:88%;bottom:0}}