body.is-site-intro-active { overflow: hidden; }

.site-intro {
  --intro-logo-size: clamp(220px, 34vw, 390px);
  --intro-origin-offset: clamp(40px, 6.1vw, 70px);
  --intro-fill-radius: 100vmax;
  position: fixed;
  z-index: 10000;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #181a1d;
  opacity: 1;
  visibility: visible;
}

.site-intro-fill {
  position: absolute;
  z-index: 0;
  inset: 0;
  background: var(--page-background);
  clip-path: circle(0 at 50% calc(50% - var(--intro-origin-offset)));
  will-change: clip-path;
}

.site-intro-logo {
  position: relative;
  z-index: 1;
  width: var(--intro-logo-size);
  height: var(--intro-logo-size);
  display: block;
  object-fit: contain;
  opacity: 0;
  backface-visibility: hidden;
  will-change: opacity;
}

.site-intro.is-ready .site-intro-logo { animation: site-intro-logo-enter .3s ease-out .02s forwards; }
.site-intro.is-ready .site-intro-fill { animation: site-intro-background-fill .85s cubic-bezier(.68, 0, .24, 1) .1s forwards; }
.site-intro.is-exiting { opacity: 0; pointer-events: none; visibility: hidden; }

@keyframes site-intro-logo-enter {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes site-intro-background-fill {
  from { clip-path: circle(0 at 50% calc(50% - var(--intro-origin-offset))); }
  to { clip-path: circle(var(--intro-fill-radius) at 50% calc(50% - var(--intro-origin-offset))); }
}

.home-main { width: 100%; max-width: var(--content-wide); margin: 0 auto; padding: 24px 32px 36px; }
.home-hero { position: relative; isolation: isolate; min-height: min(740px, calc(100dvh - 136px)); display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr); align-items: end; gap: clamp(32px, 6vw, 88px); padding: clamp(48px, 8vw, 112px); overflow: hidden; border-radius: var(--radius-panel); background-color: #17191c; background-image: linear-gradient(90deg, rgba(13, 14, 16, .94) 0%, rgba(13, 14, 16, .86) 42%, rgba(13, 14, 16, .7) 70%, rgba(13, 14, 16, .8) 100%), linear-gradient(0deg, rgba(13, 14, 16, .9), rgba(13, 14, 16, .38) 62%), url("/assets/greatfurnace-volcano-dragon-background.png"); background-position: center; background-repeat: no-repeat; background-size: cover; box-shadow: inset 0 0 0 1px rgba(255, 255, 240, .08); }
.home-hero::after { position: absolute; z-index: -1; inset: 0; content: ""; background: radial-gradient(circle at 76% 54%, rgba(212, 126, 66, .12), transparent 34%); pointer-events: none; }
.home-hero-content { max-width: 720px; align-self: center; }
.home-hero h1 { max-width: 720px; margin-bottom: var(--space-4); font-size: clamp(3.4rem, 6vw, 6.4rem); line-height: .9; text-wrap: balance; }
.home-subtitle { max-width: 660px; margin-bottom: var(--space-4); color: var(--cream); font: 500 clamp(1.25rem, 2.2vw, 2rem)/1.2 var(--font-display); letter-spacing: -.02em; text-wrap: balance; }
.home-lead { max-width: 660px; margin-bottom: var(--space-7); color: var(--text-subtle); font-size: clamp(.95rem, 1.5vw, 1.2rem); line-height: 1.65; }
.home-primary-actions, .home-auth-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.home-text-link { padding: 7px 4px; color: var(--text-subtle); font-size: var(--control-font-size); text-decoration-color: rgba(196, 199, 206, .48); }
.home-text-link:hover { color: var(--text); text-decoration-color: currentColor; }
.home-searches { display: grid; gap: var(--space-4); align-self: end; }
.home-search-card { display: grid; gap: var(--space-4); padding: var(--space-5); border-radius: var(--radius-panel); background: rgba(27, 29, 33, .86); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), var(--menu-shadow); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.home-search-heading { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: start; gap: var(--space-3); }
.home-search-heading > .lucide-icon { width: 22px; height: 22px; margin-top: 2px; color: var(--accent-pale); }
.home-search-heading h2 { margin: 0 0 4px; font: 600 1rem/1.25 var(--font-body); letter-spacing: 0; }
.home-search-heading p { margin: 0; color: var(--text-muted); font-size: .72rem; line-height: 1.45; }
.home-search-card .search-control { width: 100%; }
.home-feedback { margin: var(--space-4) 0 0; color: var(--danger); }

@media (max-width: 900px) {
  .home-hero { min-height: auto; grid-template-columns: minmax(0, 1fr); padding: clamp(38px, 8vw, 72px); background-position: 66% center; }
  .home-hero-content { padding: 28px 0 46px; }
  .home-searches { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 640px) {
  .home-main { padding: 14px 14px 28px; }
  .home-hero { gap: var(--space-6); padding: 32px 20px 22px; }
  .home-hero h1 { font-size: clamp(2.65rem, 13vw, 4.2rem); }
  .home-subtitle { font-size: clamp(1.15rem, 6vw, 1.55rem); }
  .home-searches { grid-template-columns: minmax(0, 1fr); }
  .home-primary-actions { align-items: stretch; flex-direction: column; }
  .home-primary-actions > .button, .home-auth-actions { width: 100%; }
  .home-auth-actions .button { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
  .site-intro.is-ready .site-intro-logo, .site-intro.is-ready .site-intro-fill { animation-duration: 1ms; animation-delay: 0ms; }
}