/* États — Padelaris Etats.dc.html (hors connexion, 404 / erreur, première saison) */
.zp-s-states h1, .zp-s-states h2, .zp-s-states h3 { color: inherit; letter-spacing: normal; }
.zp-app.zp-s-states { box-sizing: border-box; }

/* ---------- 404 / erreur serveur ---------- */
.zp-st-err-hero { --cut-h: 36px; --hero-pb: 60px; }
.zp-st-err { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; text-align: center; max-width: 390px; margin: 0 auto; padding: 56px 28px 80px; }
.zp-st-err__court { position: relative; width: 200px; height: 120px; border: 3px solid var(--zp-primary); flex: none; margin-top: 26px; }
.zp-st-err__court .net { position: absolute; left: 50%; top: -12px; bottom: -12px; width: 4px; margin-left: -2px; background: var(--zp-primary); }
.zp-st-err__court .ball { position: absolute; left: 150px; top: -26px; width: 28px; height: 28px; border-radius: 50%; background: var(--zp-accent); box-shadow: 0 0 0 2px var(--zp-primary); }
.is-server .zp-st-err__court .ball { left: 84px; top: 60px; }
.zp-st-err__code { font-family: var(--zp-display); font-weight: 800; font-size: 96px; line-height: .85; color: var(--zp-primary); }
.zp-st-err__t { font-family: var(--zp-display); font-weight: 800; font-size: 28px; line-height: normal; text-transform: uppercase; }
.zp-st-err__p { font-size: 14px; line-height: 1.55; color: var(--zp-gray); }
.zp-st-err__a { display: flex; flex-direction: column; gap: 10px; width: 100%; margin-top: 6px; }
.zp-st-err__a .zp-btn--md { padding: 15px; font-size: 15px; }
.zp-st-err__a .zp-btn--ghost.zp-btn--md { padding: 13px; }
@media (max-width: 760px) {
	.zp-st-err { min-height: calc(100vh - 96px); min-height: calc(100dvh - 96px); padding: 24px 28px; }
	.zp-st-err__court { margin-top: 0; }
}

/* ---------- Bandeau hors connexion ---------- */
.zp-st-off { flex-direction: column; }
.zp-st-off__bar { background: var(--zp-gray); color: #fff; padding: 10px 16px; display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 700; line-height: normal; }
.zp-st-off__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--zp-loss); flex: none; }
.zp-st-off__q { margin: 14px 16px 0; padding: 14px; background: #fff; border: 1.5px dashed var(--zp-gray); display: flex; gap: 12px; align-items: center; }
.zp-st-off__q[hidden] { display: none; }
.zp-st-off__ic { width: 36px; height: 36px; flex: none; display: flex; align-items: center; justify-content: center; background: var(--zp-accent); color: var(--zp-primary); font-weight: 800; }
.zp-st-off__qt { flex: 1; display: flex; flex-direction: column; gap: 2px; line-height: normal; }
.zp-st-off__qt strong { font-size: 13.5px; font-weight: 800; }
.zp-st-off__qt span { font-size: 12px; color: var(--zp-gray); line-height: 1.4; }
@media (min-width: 761px) {
	.zp-st-off__bar { padding-left: var(--zp-gutter); padding-right: var(--zp-gutter); }
	.zp-st-off__q { width: min(560px, calc(100% - 2 * var(--zp-gutter))); margin: 14px auto 0; }
}

/* ---------- États vides (première saison) ---------- */
.zp-st-empty { padding: 28px 24px; gap: 12px; }
.zp-st-empty .zp-empty__ball { margin-bottom: 0; }
.zp-st-empty .zp-empty__t { line-height: normal; color: var(--zp-primary); }
.zp-st-empty .zp-empty__p { max-width: 340px; margin: 0; line-height: 1.5; }
.zp-app .zp-st-empty__cta { font-size: 14px; padding: 12px 20px; --cut: 10px; }
.zp-st-launch { --cut-h: 36px; --hero-pb: 76px; }
.zp-st-launch__in { position: relative; display: flex; flex-direction: column; gap: 12px; padding-top: 16px; }
.zp-st-launch__e { font-size: 12px; font-weight: 800; letter-spacing: .14em; color: var(--zp-accent); text-transform: uppercase; line-height: normal; }
.zp-app .zp-st-launch__h { font-family: var(--zp-display); font-style: italic; font-weight: 800; font-size: 76px; line-height: .88; color: #fff; text-transform: uppercase; }
.zp-st-grid3 { position: relative; margin-top: -26px; padding-bottom: 56px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
@media (max-width: 760px) {
	.zp-st-launch { clip-path: none; --hero-pb: 22px; }
	.zp-st-launch__in { padding-top: 0; }
	.zp-app .zp-st-launch__h { font-size: 44px; line-height: .9; }
	.zp-st-grid3 { margin-top: 0; padding-top: 14px; padding-bottom: 24px; grid-template-columns: minmax(0, 1fr); gap: 12px; }
}
@media (min-width: 761px) and (max-width: 1100px) { .zp-st-grid3 { grid-template-columns: minmax(0, 1fr); } }
