/* ═══ Héros éditorial épuré (template-parts/horizon-hero.php) — blanc, noir, touches volt ═══ */
.hzh { --ink: #1d1d1f; --mute: #6e6e73; --line: #e8e8ed; --volt: #D4FF00;
  position: relative; background: #fff; color: var(--ink); min-height: min(860px, 100svh); padding: 130px clamp(20px, 4vw, 56px) 40px; overflow: hidden; font-family: Inter, var(--font-body), sans-serif; }
.hzh__quote { position: relative; z-index: 6; max-width: 400px; }
.hzh__quote p { margin: 0; font: 600 clamp(1.5rem, 2.3vw, 1.9rem)/1.18 Inter, var(--font-body), sans-serif; letter-spacing: -.022em; color: var(--ink); text-transform: none; }
.hzh__quote mark { background: linear-gradient(transparent 62%, var(--volt) 62%, var(--volt) 90%, transparent 90%); color: inherit; padding: 0; }
.hzh__quote > span { display: block; margin-top: 14px; font-size: .95rem; color: var(--mute); }
.hzh__ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin-top: 22px; }
.hzh__btn { background: var(--ink); color: #fff; border-radius: 999px; padding: 11px 20px; font-weight: 600; font-size: .95rem; text-decoration: none; transition: opacity .2s; }
.hzh__btn:hover { opacity: .85; color: #fff; }
.hzh__link { color: var(--ink); font-weight: 500; text-decoration: none; }
.hzh__link:hover { text-decoration: underline; }
.hzh__num { position: absolute; right: clamp(20px, 4vw, 56px); top: 120px; text-align: right; z-index: 1; }
.hzh__num b { display: block; font: 900 italic clamp(8rem, 14vw, 12rem)/.85 'Kanit', var(--font-display), sans-serif; color: #f0f0f2; letter-spacing: -.03em; }
.hzh__num span { font-size: .9rem; color: var(--mute); }

.hzh__stage { position: absolute; left: 0; right: 0; bottom: 0; top: 0; z-index: 2; pointer-events: none; }
.hzh__label { position: absolute; left: clamp(20px, 4vw, 62px); top: 48%; font-size: .82rem; font-weight: 600; color: var(--mute); }
.hzh__big { position: absolute; left: 0; right: 0; top: 51%; text-align: center; white-space: nowrap; font: 900 italic clamp(6rem, 17.5vw, 16rem)/.8 'Kanit', var(--font-display), sans-serif; text-transform: uppercase; letter-spacing: -.01em; color: var(--ink); }
.hzh__player { position: absolute; left: 50%; bottom: -7%; width: min(80vw, 1150px); transform: translateX(-50%); z-index: 3; }
.hzh__tag { position: absolute; right: clamp(20px, 4.8vw, 70px); top: 45%; z-index: 4; background: var(--ink); color: #fff; font: 900 italic clamp(1.8rem, 3.2vw, 2.9rem)/1 'Kanit', var(--font-display), sans-serif; text-transform: uppercase; padding: 8px 40px 6px 28px; transform: rotate(-8deg); clip-path: polygon(0 0, 100% 0, 94% 100%, 0 100%); }
.hzh__tag i { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: var(--volt); margin-right: 14px; vertical-align: middle; }

.hzh__card { position: absolute; bottom: 40px; z-index: 8; border-radius: 20px; }
.hzh__lb { left: clamp(20px, 4vw, 56px); width: 330px; background: rgba(255,255,255,.86); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border: 1px solid var(--line); padding: 18px 20px; box-shadow: 0 10px 40px rgba(0,0,0,.06); }
.hzh__lb h2 { display: flex; justify-content: space-between; margin: 0 0 8px; font: 600 13px Inter, sans-serif; color: var(--ink); text-transform: none; letter-spacing: 0; }
.hzh__lb h2 span { color: var(--mute); font-weight: 400; }
.hzh__r { display: grid; grid-template-columns: 22px 1fr 24px; gap: 8px; align-items: center; padding: 7px 0; border-top: 1px solid #f0f0f2; font-size: 14px; color: var(--mute); }
.hzh__r b { font-weight: 600; color: var(--mute); }
.hzh__r em { font-style: normal; font-size: 10px; font-weight: 600; text-align: center; }
.hzh__gold { display: inline-block; width: 6px; height: 6px; background: #D4FF00; border-radius: 50%; margin-left: 7px; vertical-align: middle; }
.hzh__lb p { margin: 8px 0 0; font-size: 12px; color: var(--mute); }
.hzh__lb p i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--volt); border: 1px solid var(--ink); margin-right: 6px; vertical-align: middle; }
.hzh__nx { right: clamp(20px, 4vw, 56px); width: 340px; background: var(--ink); color: #fff; padding: 20px 22px; text-decoration: none; display: grid; gap: 4px; transition: transform .2s; }
.hzh__nx:hover { transform: translateY(-3px); color: #fff; }
.hzh__nx-t, .hzh__nx-b { display: flex; justify-content: space-between; font-size: 13px; color: #a1a1a6; }
.hzh__nx-t em { font-style: normal; color: var(--volt); font-weight: 600; }
.hzh__nx > b { margin-top: 10px; font: 900 italic 30px/1.1 'Kanit', var(--font-display), sans-serif; text-transform: uppercase; color: #fff; }
.hzh__nx-b strong { color: #fff; font-weight: 600; }

/* En-tête de l'accueil : clair et léger (comme le hero) */
.hz-home .hdr, .hz-home .hdr.hdr--overlay:not(.is-solid) { background: rgba(255,255,255,.82); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); color: #1d1d1f; box-shadow: none; }
.hz-home .hdr .hdr__logo, .hz-home .hdr--overlay:not(.is-solid) .hdr__logo { filter: invert(1) !important; }
.hz-home .hdr--overlay:not(.is-solid) .hdr__nav { background: transparent; }
.hz-home .hdr .hdr__nav a, .hz-home .hdr--overlay:not(.is-solid) .hdr__nav a { color: #424245; font-weight: 400; text-transform: none; letter-spacing: 0; font-size: 14px; }
.hz-home .hdr .hdr__nav a:hover { color: #1d1d1f; }
.hz-home .hdr .hdr__icon, .hz-home .hdr--overlay:not(.is-solid) .hdr__icon { background: transparent; color: #1d1d1f; }
.hz-home .hdr .hdr__pill, .hz-home .hdr--overlay:not(.is-solid) .hdr__pill { background: #1d1d1f; color: #fff; border-color: #1d1d1f; box-shadow: none; }
.hz-home .hdr--overlay:not(.is-solid) .hdr__toggle { background: #f0f0f2; color: #1d1d1f; }

/* Tablette et mobile : tout s'empile */
@media (max-width: 1000px) {
  .hzh { min-height: 0; padding: 104px 20px 28px; display: grid; gap: 16px; }
  .hzh__quote { max-width: none; }
  .hzh__num { position: static; text-align: left; display: flex; align-items: baseline; gap: 10px; order: 3; }
  .hzh__num b { font-size: 3.4rem; color: #1d1d1f; } .hzh__num span { font-size: .85rem; }
  .hzh__stage { position: relative; order: 2; height: 118vw; max-height: 760px; margin: 4px -20px 0; }
  .hzh__label { top: 0; left: 20px; }
  .hzh__big { top: 14%; font-size: 23vw; }
  .hzh__player { width: 78vw; max-width: 560px; left: 50%; bottom: 0; }
  .hzh__tag { top: 7%; right: 14px; font-size: 1.5rem; padding: 6px 28px 4px 18px; }
  .hzh__card { position: static; width: auto; order: 4; }
  .hzh__nx { order: 5; }
  .hzh__nx:hover { transform: none; }
}

/* Photo de pickleball en transparence (remplace la joueuse détourée) */
.hzh__photo { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: 70% 40%; background-repeat: no-repeat; opacity: .32; filter: grayscale(1); pointer-events: none; }
.hzh::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,.55) 38%, rgba(255,255,255,0) 70%), linear-gradient(0deg, #fff 0%, rgba(255,255,255,0) 30%); }
.hzh__quote, .hzh__num, .hzh__stage, .hzh__card { z-index: 2; }
.hzh__num b { color: rgba(240,240,242,.85); }
@media (max-width: 1000px) {
  .hzh__photo { background-position: 60% 30%; opacity: .28; }
  .hzh::before { background: linear-gradient(180deg, rgba(255,255,255,.75) 0%, rgba(255,255,255,.35) 45%, #fff 100%); }
  .hzh__stage { height: auto; min-height: 0; padding: 30px 0 10px; }
  .hzh__label { position: static; padding: 0 20px; }
  .hzh__big { position: relative; top: auto; margin-top: 10px; }
  .hzh__tag { top: 0; }
}
@media (max-width: 1000px) { .hzh__num b { color: #1d1d1f; } .hzh__tag { top: auto; bottom: -38px; right: 16px; } .hzh__stage { padding-bottom: 48px; } }
@media (max-width: 1000px) { .hzh__tag { bottom: -14px; } .hzh__num { margin-top: 18px; } }
