.brand { display: inline-flex; gap: 9px; align-items: center; color: var(--cream); font-size: 1.2rem; font-weight: 900; letter-spacing: -.06em; text-decoration: none; }
.brand img { width: 34px; height: 34px; object-fit: contain; }
.brand b { font: inherit; }
.nav-links { display: flex; gap: 22px; align-items: center; }
.nav-link { color: #f9d8a8; font-weight: 800; text-decoration: none; }
.nav-link:hover, .nav-link:focus-visible, .invite-button:focus-visible, .text-link:focus-visible, .brand:focus-visible { color: var(--orange-light); outline: 2px solid var(--orange-light); outline-offset: 3px; }

.site-footer { display: flex; flex-wrap: wrap; gap: 18px 28px; justify-content: center; width: min(1160px, calc(100% - 48px)); margin: 0 auto; padding: 0 0 56px; }
.site-footer a { color: #f9d8a8; font-weight: 800; text-decoration: none; }
.site-footer a:hover, .site-footer a:focus-visible { color: var(--orange-light); outline: 2px solid var(--orange-light); outline-offset: 3px; }
.site-footer__note { flex: 1 0 100%; margin: 8px 0 0; color: #cda980; font-size: .78rem; font-weight: 700; text-align: center; }

.eyebrow { display: flex; gap: 10px; align-items: center; color: var(--orange-light); font-size: .78rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.eyebrow span { display: block; width: 22px; height: 2px; background: currentColor; }
h1 { max-width: 620px; margin: 16px 0 22px; font-size: clamp(3.5rem, 7vw, 6.3rem); line-height: .91; letter-spacing: -.075em; }
h1 em { color: var(--orange); font-style: normal; text-shadow: 0 8px 32px rgba(255, 104, 13, .25); }
.intro { max-width: 475px; color: #f0cf9d; font-size: clamp(1rem, 1.6vw, 1.15rem); font-weight: 700; line-height: 1.65; }
.invite-button { display: inline-flex; gap: 10px; align-items: center; margin-top: 17px; padding: 15px 21px; border-radius: 14px; color: #231008; background: linear-gradient(135deg, #ffad47, #ff7317); box-shadow: 0 13px 28px rgba(203, 69, 5, .25); font-weight: 900; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.invite-button:hover { transform: translateY(-3px); box-shadow: 0 17px 35px rgba(255, 111, 12, .36); }

.logo-glow { position: absolute; z-index: 0; inset: 50% auto auto 50%; width: min(44vw, 520px); aspect-ratio: 1; border-radius: 50%; background: #ff7011; filter: blur(75px); opacity: .2; transform: translate(-50%, -50%); pointer-events: none; }
.logo-frame picture { position: relative; z-index: 1; display: block; width: min(480px, 100%); }
.logo-frame img { display: block; width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 25px 30px rgba(0, 0, 0, .4)); }

.paw { position: absolute; z-index: -1; color: var(--orange); font-size: 5rem; opacity: .055; }
.paw-one { right: 4%; top: 8%; transform: rotate(25deg); }
.paw-two { bottom: 5%; left: 42%; transform: rotate(-33deg); }
.stripe { position: absolute; z-index: -1; width: 45vw; height: 13vw; border: 24px solid rgba(255, 116, 20, .045); border-radius: 50%; transform: rotate(-31deg); }
.stripe-one { right: -18%; bottom: 7%; }
.stripe-two { left: -30%; top: 19%; }

@media (max-width: 760px) {
  .eyebrow { justify-content: center; }
  .intro { margin-inline: auto; }
  .logo-glow { width: 75vw; }
  .nav-links { gap: 16px; }
  .site-footer { width: min(100% - 36px, 540px); padding-bottom: 40px; }
}
