/* ═══════════════════════════════════════════════════════════
   Randozone — Hero 5 : Minimal centré
   Composition centrée dans un cadre fin, allure magazine.
   Classe principale : .rz-hero-centered
   ═══════════════════════════════════════════════════════════ */

/* ── Tokens ── */
:root {
  --hv-ink:          var(--rz-ink);
  --hv-ink-soft:     var(--rz-inksoft);
  --hv-primary:      var(--rz-primary);
  --hv-primary-dark: #0f4f86;
  --hv-surface:      var(--rz-surface);
  --hv-surface-2:    var(--rz-surface-2);
  --hv-line:         var(--rz-border);
}

/* ── Éléments partagés hv-* ── */
.hv-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .72rem; font-weight: 700; letter-spacing: .15em;
  text-transform: uppercase; color: var(--hv-primary);
}
.hv-eyebrow.pill {
  background: color-mix(in oklch, var(--hv-primary) 10%, white);
  border: 1px solid color-mix(in oklch, var(--hv-primary) 20%, white);
  border-radius: 999px; padding: .36rem .8rem;
}
.hv-title {
  font-family: 'Work Sans', system-ui, sans-serif;
  font-weight: 700; letter-spacing: -.022em; line-height: 1.02;
  color: var(--hv-ink); margin: .7rem 0 0;
}
.hv-sub {
  font-family: 'Work Sans', system-ui, sans-serif;
  font-style: italic; font-size: clamp(1.05rem, 2.2vw, 1.3rem);
  line-height: 1.3; color: var(--hv-ink-soft); margin: .55rem 0 0;
}
.hv-chips { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.4rem; }
.hv-chip {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .86rem; font-weight: 600; color: var(--hv-ink);
  background: var(--hv-surface); border: 1px solid var(--hv-line);
  border-radius: 999px; padding: .45rem .9rem;
}
.hv-chip i { color: var(--hv-primary); font-size: 1rem; }
.hv-chip .rz-ico { color: var(--hv-primary); }
.hv-chip .k { color: var(--hv-ink-soft); font-weight: 500; }
.hv-meta {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .72rem; font-weight: 600; color: var(--hv-ink-soft);
  background: var(--hv-surface-2); border: 1px solid var(--hv-line);
  border-radius: 999px; padding: .3rem .7rem; white-space: nowrap;
}
.hv-meta i { color: var(--hv-primary); }
.hv-meta .rz-ico { color: var(--hv-primary); }

/* ── Hero centré ── */
.rz-hero-centered {
  background: var(--hv-surface);
  border: 1px solid var(--hv-line);
  border-radius: 22px;
  padding: 2.6rem 2rem 2.4rem;
  box-shadow: 0 24px 60px -44px rgba(20, 40, 80, .55);
}
.rz-hero-centered .hv-frame {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.rz-hero-centered .hv-rule {
  display: flex; align-items: center; gap: .7rem;
  color: var(--hv-primary); margin-bottom: .2rem;
}
.rz-hero-centered .hv-rule .ln {
  width: 34px; height: 1px;
  background: color-mix(in oklch, var(--hv-primary) 45%, white);
}
.rz-hero-centered .hv-title { margin-top: .5rem; }
.rz-hero-centered .hv-chips { justify-content: center; margin-top: 1.5rem; }

.rz-hero-centered .hv-title .lt { color: var(--hv-primary); }

@media (max-width: 760px) {
  .rz-hero-centered { padding: 2rem 1.2rem; }
}
