/* hero-centered — manifest hero. Şəkil yoxdur, tipoqrafiya işi görür.
   Mərkəzləşdirmə burada bilərəkdən seçilib: mesaj tək obyektdir. */

.hero-centered {
  padding: var(--space-20) var(--space-5) var(--space-24);
  background: var(--bg);
  position: relative;
  overflow: hidden;
}

.hero-centered__inner {
  max-width: var(--container-content);
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: var(--z-raised);
}

.hero-centered__title {
  font-family: var(--font-display);
  font-size: var(--size-3xl);
  font-weight: var(--weight-bold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  margin: 0;
  text-wrap: balance;
}

.hero-centered__accent { color: var(--primary); }

.hero-centered__subtitle {
  margin: var(--space-6) auto 0;
  max-width: 52ch;
  font-size: var(--size-md);
  line-height: var(--leading-normal);
  color: var(--text-muted);
  text-wrap: pretty;
}

.hero-centered__actions {
  margin-top: var(--space-8);
  display: flex;
  justify-content: center;
}

.hero-centered__btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  background: var(--primary);
  color: var(--on-primary);
  font: inherit;
  font-size: var(--size-md);
  font-weight: var(--weight-semibold);
  text-decoration: none;
  padding: var(--space-3) var(--space-6);
  border-radius: var(--radius-md);
  white-space: nowrap;
  transition: background var(--duration-fast) var(--ease-out-quart),
              transform var(--duration-fast) var(--ease-out-quart);
}

.hero-centered__btn:hover { background: var(--primary-hover); }
.hero-centered__btn:active { transform: translateY(1px); }
.hero-centered__btn .icon { width: 1em; height: 1em; }

/* CTA altındakı TƏK qısa sətir — yalnız manifest hero-da icazəlidir. */
.hero-centered__note {
  margin: var(--space-4) 0 0;
  font-size: var(--size-sm);
  color: var(--text-subtle);
}

/* Fon: brend çalarında yumşaq radial sahə. Dekorativ qradient mətn və ya
   mesh DEYİL — yalnız mərkəzə fokus verən bir işıq. */
.hero-centered__glow {
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 26rem;
  background: radial-gradient(
    60% 100% at 50% 0%,
    var(--primary-subtle) 0%,
    transparent 70%
  );
  pointer-events: none;
}

@media (min-width: 64rem) {
  .hero-centered { padding: var(--space-24) var(--space-5) var(--space-32); }
  .hero-centered__title { font-size: var(--size-4xl); }
  [data-skin="neutral-pro"] .hero-centered__title { font-size: var(--size-5xl); }
}

@media (prefers-reduced-motion: no-preference) {
  .hero-centered__title,
  .hero-centered__subtitle,
  .hero-centered__actions,
  .hero-centered__note {
    animation: hero-centered-rise var(--duration-slower) var(--ease-out-expo) both;
  }
  .hero-centered__subtitle { animation-delay: 70ms; }
  .hero-centered__actions { animation-delay: 140ms; }
  .hero-centered__note { animation-delay: 200ms; }
}

@keyframes hero-centered-rise {
  from { opacity: 0; transform: translateY(0.75rem); }
  to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-centered__btn { transition: none; }
}