/* ═══════════════════════════════════════════════════════════════════
   home.css — Home page specific styles
   jules.buddocloud.com/index.html
   ═══════════════════════════════════════════════════════════════════ */

/* ── HOME HERO ───────────────────────────────────────────────────── */

.home-hero {
  min-height: calc(100vh - var(--nav-height));
  position: relative;
}

.home-hero .hero-title {
  text-shadow: 0 0 60px var(--red-glow);
}

/* ── STATS BAR ───────────────────────────────────────────────────── */

.stats-bar {
  display: flex;
  gap: var(--space-8);
  padding: var(--space-6) var(--gutter);
  background: var(--bg-elevated);
  border-bottom: 1px solid var(--border);
  overflow-x: auto;
  scrollbar-width: none;
}

.stats-bar::-webkit-scrollbar {
  display: none;
}

.stat-item {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: max-content;
}

.stat-value {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-weight: var(--weight-black);
  color: var(--text-emphasis);
}

.stat-label {
  font-family: var(--font-ui);
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: var(--tracking-wider);
  color: var(--text-faint);
}

.stat-divider {
  width: 1px;
  align-self: stretch;
  background: var(--border);
  flex-shrink: 0;
}

/* ── FEATURED HERO CARD ──────────────────────────────────────────── */

.featured-hero-card {
  display: grid;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  overflow: hidden;
  transition: border-color var(--dur-base);
  text-decoration: none;
  color: inherit;
}

.featured-hero-card:hover {
  border-color: var(--red-dimmed);
}

.featured-hero-card .card-art {
  aspect-ratio: unset;
  min-height: 300px;
}

.featured-hero-card .card-body {
  padding: var(--space-8);
  justify-content: center;
  background: var(--bg-elevated);
}

.featured-hero-card .card-title {
  font-size: var(--text-3xl);
}

/* ── BENTO GRID ──────────────────────────────────────────────────── */

.bento-grid {
  display: grid;
  gap: var(--space-4);
}

.bento-card {
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  transition: border-color var(--dur-base);
}

.bento-card:hover {
  border-color: var(--border-2);
}

.bento-card--large {
  grid-column: span 2;
}

.bento-card--tall {
  grid-row: span 2;
}

/* ── EDITORIAL STATEMENT ─────────────────────────────────────────── */

.editorial-statement {
  max-width: 700px;
  margin: auto;
  text-align: center;
  padding: var(--space-12) var(--gutter);
}

.editorial-rule {
  width: 60px;
  height: 4px;
  background: var(--red-primary);
  margin: 0 auto var(--space-4);
  display: block;
  border: none;
}

.editorial-statement blockquote {
  border-left: none;
  background: none;
  padding-left: 0;
  font-size: var(--text-2xl);
  font-family: var(--font-display);
  line-height: var(--leading-headline);
  font-style: italic;
  color: var(--text-emphasis);
}

.editorial-statement p {
  font-size: var(--text-base);
  color: var(--text-secondary);
  margin-top: var(--space-4);
  line-height: var(--leading-relaxed);
}