/* === Thème (variables) === */
:root{
  --primary:#3b82f6; --primary-hover:#2563eb;
  --secondary:#f3f4f6; --secondary-hover:#e5e7eb;
  --text:#111827; --text-light:#6b7280;
  --bg:#ffffff; --border:#e5e7eb;
  --error:#ef4444; --success:#10b981;
  --radius:12px; --shadow:0 1px 3px rgba(0,0,0,.1); --shadow-md:0 4px 6px -1px rgba(0,0,0,.1);
  --transition:all .2s ease-in-out;
}

[data-theme="dark"]{
  --primary:#60a5fa; --primary-hover:#3b82f6;
  --secondary:#374151; --secondary-hover:#4b5563;
  --text:#f9fafb; --text-light:#9ca3af;
  --bg:#1f2937; --border:#374151;
  --error:#f87171; --success:#34d399;
}

/* === Base === */
*{box-sizing:border-box}
html,body{height:100%}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  color:var(--text); background:var(--bg);
  transition:var(--transition); margin:0;
}
.container{max-width:1000px;margin:0 auto;padding:1.5rem}
.page-title{
  font-size:2rem; font-weight:800; margin:0 0 1rem;
  background:linear-gradient(90deg,var(--primary),#8b5cf6);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* === Thème toggle === */
.theme-toggle{
  position:fixed; top:calc(var(--nav-height,64px) + .75rem); right:1rem;
  z-index:5001; width:2.5rem;height:2.5rem;border-radius:50%;
  display:grid;place-items:center; border:0; cursor:pointer;
  background:var(--secondary); box-shadow:var(--shadow); transition:var(--transition);
}
.theme-toggle:hover{background:var(--secondary-hover)}
@media (max-width:960px){ .theme-toggle{ top:auto; bottom:1rem; right:1rem; } }
body.menu-open .theme-toggle{ opacity:0; pointer-events:none; }

/* === WIZARD — Modern UI/UX (collant, animé, accessible) ================== */

/* En-tête du wizard : carte collante sous la nav */
.wizard-head{
  position: sticky;
  top: calc(var(--nav-height, 64px) + .75rem);
  z-index: 50;
  background:
    linear-gradient(180deg, color-mix(in oklab, var(--bg) 85%, transparent), var(--bg));
  border: 1px solid color-mix(in oklab, var(--border) 85%, transparent);
  border-radius: 16px;
  padding: 1rem 1.1rem;
  box-shadow: 0 8px 30px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: saturate(130%) blur(4px);
}

/* Progress bar : gradient + lueur + "stripes" animées */
.progress-container{
  width:100%;
  height: .6rem;
  background: color-mix(in srgb, var(--secondary) 70%, transparent);
  border-radius: 999px;
  overflow:hidden;
  margin: .75rem 0 1.1rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2);
}
.progress-bar{
  height:100%;
  background:
    linear-gradient(90deg, var(--primary), #8b5cf6) padding-box,
    repeating-linear-gradient(45deg, rgba(255,255,255,.22) 0 10px, transparent 10px 20px) border-box;
  background-size: 200% 100%, auto;
  border-right: 1px solid rgba(0,0,0,.05);
  animation: wiz-stripes 2.4s linear infinite, wiz-glow 1.8s ease-in-out infinite;
  transition: width .5s cubic-bezier(.25,.8,.25,1);
}
.progress-bar::after{
  content:"";
  position:absolute; inset: -6px -8px -6px auto;
  width: 56px; border-radius: 999px;
  background: radial-gradient(60% 60% at 0 50%, rgba(139,92,246,.35), transparent 70%);
  pointer-events:none;
}
@keyframes wiz-stripes{ to{ background-position: -200% 0, 0 0; } }
@keyframes wiz-glow{ 50%{ filter: brightness(1.06); } }

/* Steps : puces "chips" dynamiques, connectées par un rail discret */
.step-indicator{
  position: relative;
  display:flex; gap:.6rem; flex-wrap:wrap; align-items: stretch;
  padding:.25rem 0 .1rem;
}
.step-indicator::before{
  content:"";
  position:absolute; left:0; right:0; top:50%;
  height:2px; transform: translateY(-50%);
  background: linear-gradient(90deg,
    transparent 0 6%,
    color-mix(in srgb, var(--border) 70%, transparent) 6% 94%,
    transparent 94% 100%);
  pointer-events:none;
}

/* Chip */
.step{
  position:relative;
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.55rem .9rem .55rem .55rem;
  border-radius: 999px;
  background: color-mix(in oklab, var(--secondary) 86%, transparent);
  border: 1px solid var(--border);
  color: var(--text-light);
  font-weight: 600; font-size: .9rem;
  box-shadow: 0 2px 10px rgba(0,0,0,.02);
  transition: transform .18s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease, color .25s ease;
  will-change: transform, box-shadow;
}
.step:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
  border-color: color-mix(in oklab, var(--primary) 35%, var(--border));
}

/* Numéro (anneau) */
.step-number{
  position:relative;
  width: 1.65rem; height: 1.65rem;
  display:grid; place-items:center;
  border-radius: 50%;
  background: var(--bg);
  color: var(--text);
  font-size:.78rem; font-weight:800;
  box-shadow: inset 0 0 0 2px color-mix(in oklab, var(--border) 80%, transparent);
  transition: box-shadow .25s ease, background .25s ease, color .25s ease, transform .25s ease;
}

/* État actif : puce primaire + anneau pulsant */
.step.active{
  background: linear-gradient(135deg, var(--primary), #8b5cf6);
  color:#fff; border-color: transparent;
  box-shadow: 0 10px 22px rgba(99,102,241,.25);
}
.step.active .step-number{
  background: rgba(255,255,255,.18);
  color:#fff;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.35);
}
.step.active .step-number::after{
  content:"";
  position:absolute; inset:-4px;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(255,255,255,.45);
  animation: wiz-pulse 1.8s ease-out infinite;
}
@keyframes wiz-pulse{
  70%{ box-shadow: 0 0 0 8px rgba(255,255,255,.0); }
}

/* État complété : check + gradient de réussite */
.step.completed{
  background: linear-gradient(135deg, #10b981, #34d399);
  color:#fff; border-color: transparent;
  box-shadow: 0 10px 22px rgba(16,185,129,.22);
}
.step.completed .step-number{ color:transparent; background: rgba(255,255,255,.18); }
.step.completed .step-number::after{
  content:"✓"; position:absolute; inset:0; display:grid; place-items:center;
  color:#fff; font-size:.92rem; font-weight:900;
}

/* Focus clavier (a11y) */
.step:focus-visible{
  outline: 3px solid color-mix(in srgb, var(--primary) 55%, transparent);
  outline-offset: 2px;
}

/* Mobile : steps scrollables horizontalement (chips) + scrollbar masquée */
@media (max-width: 768px){
  .wizard-head{ padding: .85rem .9rem; border-radius: 14px; }
  .step-indicator{ flex-wrap: nowrap; overflow-x: auto; gap:.5rem; padding-bottom:.25rem; }
  .step{ flex: 0 0 auto; white-space: nowrap; }
  .step-indicator::-webkit-scrollbar{ height:6px; }
  .step-indicator::-webkit-scrollbar-thumb{ background: color-mix(in srgb, var(--border) 60%, transparent); border-radius: 999px; }
}

/* Réduction des animations si préférence utilisateur */
@media (prefers-reduced-motion: reduce){
  .progress-bar, .step.active .step-number::after{ animation: none !important; }
  .step, .progress-bar{ transition: none !important; }
}


/* === Messages === */
.messages-center{display:flex;justify-content:center;margin: 0 0 1rem}
.msg-stack{width:min(780px,100%);display:grid;gap:.5rem}
.msg-card{display:grid;grid-template-columns:28px 1fr auto;gap:.75rem 1rem;padding:.8rem 1rem;border:1px solid var(--border);border-radius:12px;background:var(--bg);box-shadow:var(--shadow)}
.msg-card.error{border-color:#fecaca;background:#fff1f2}
.msg-card.warning{border-color:#facc15;background:#fffbeb}
.msg-card.success{border-color:#bbf7d0;background:#ecfdf5}
.msg-card.info{border-color:#bfdbfe;background:#eff6ff}
.msg-close{align-self:start;width:32px;height:32px;border-radius:8px;border:1px solid var(--border);background:var(--secondary);cursor:pointer}
.msg-close:hover{filter:brightness(.98)}

/* === Utilitaires === */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
:focus-visible{outline:3px solid color-mix(in srgb, var(--primary) 55%, transparent); outline-offset:2px}
@media (prefers-reduced-motion: reduce){ *{animation:none!important;transition:none!important} }

/* === Footer === */
.site-footer{margin-top:4rem;background:var(--bg);border-top:1px solid var(--border);position:relative;overflow:hidden}
.footer-background{position:absolute;inset:0;background:linear-gradient(135deg, rgba(59,130,246,.03) 0%, rgba(139,92,246,.03) 100%)}
.footer-inner{max-width:1200px;margin:0 auto;padding:2.5rem 1.5rem;display:grid;gap:2rem;position:relative;z-index:1}
.footer-content{display:grid;grid-template-columns:1fr;gap:2rem}
@media (min-width:768px){ .footer-content{grid-template-columns:1fr 1fr} }

.footer-brand{display:flex;flex-direction:column;gap:.75rem}
.footer-logo{display:flex;align-items:center;gap:.75rem;font-size:1.5rem;font-weight:700;color:var(--text);text-decoration:none}
.footer-logo-icon{width:2rem;height:2rem;color:var(--primary)}
.footer-tagline{color:var(--text-light);font-size:.95rem;max-width:30ch;line-height:1.6}

.footer-social{display:flex;gap:1rem;margin-top:1rem}
.social-link{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:#8b5cf6;color:#fff;transition:var(--transition);text-decoration:none}
.social-link:hover{background:var(--primary);transform:translateY(-2px)}

.newsletter-section{position:relative}
.newsletter-card{background:var(--bg);border-radius:var(--radius);padding:1.75rem;box-shadow:var(--shadow-md);border:1px solid var(--border);transition:var(--transition)}
.newsletter-card:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.1)}
.newsletter-title{font-size:1.25rem;font-weight:600;margin-bottom:1rem;color:var(--text)}
.newsletter-desc{color:var(--text-light);font-size:.95rem;margin-bottom:1.5rem;line-height:1.6}
.nl-form{display:flex;flex-direction:column;gap:.75rem}
.nl-input-group{position:relative;display:flex}
.nl-input{flex:1;padding:.75rem 1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);font-size:.95rem;transition:var(--transition);min-width:0}
.nl-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(59,130,246,.2)}
.nl-btn{position:absolute;right:.25rem;top:.25rem;bottom:.25rem;padding:0 .75rem;border-radius:calc(var(--radius) - 2px);background:var(--primary);color:#fff;font-weight:500;font-size:.85rem;border:none;cursor:pointer;transition:var(--transition);display:flex;align-items:center;gap:.25rem}
.nl-btn:hover{background:var(--primary-hover);transform:translateY(-1px)}
.nl-btn-icon{width:.9rem;height:.9rem}
.nl-help{font-size:.85rem;color:var(--error);min-height:1.25rem;padding:0 .25rem}

.footer-bottom{grid-column:1 / -1;border-top:1px solid var(--border);padding-top:1.5rem;display:flex;flex-direction:column;gap:1rem;text-align:center;font-size:.85rem;color:var(--text-light)}
@media (min-width:768px){ .footer-bottom{flex-direction:row;justify-content:space-between;text-align:left} }
.footer-links{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}
.footer-link{color:var(--text-light);text-decoration:none;transition:var(--transition)}
.footer-link:hover{color:var(--primary)}


/* === STEPS SUITE — Design moderne, cohérent sur toutes les étapes ======== */
/* Portée : seulement l’intérieur des formulaires d’étape (.form-step)      */

/* Conteneur d’étape */
.form-step{
  --card-bg: color-mix(in oklab, var(--bg) 93%, transparent);
  background: var(--card-bg);
  border: 1px solid color-mix(in oklab, var(--border) 80%, transparent);
  border-radius: 16px;
  padding: 1.25rem;
  box-shadow: 0 10px 25px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.04);
  animation: step-in .28s ease-out both;
}
@keyframes step-in{ from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none} }

/* Titres & textes d’aide */
.form-step h2{ font-size:1.4rem; margin: .25rem 0 .35rem; letter-spacing:.2px; }
.form-step h3{ font-size:1.15rem; margin: 0 0 .5rem; }
.form-step .helptext{ color: var(--text-light); font-size:.95rem; margin:.25rem 0 1rem; }

/* Cartes génériques à l’intérieur d’une step (contacts, signature, etc.) */
.form-step .card{
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 1rem;
  box-shadow: var(--shadow);
}
.form-step .card + .card{ margin-top:1rem; }

/* Grilles rapides */
.form-step .grid, .form-step .grid-container{ display:grid; gap:1rem; }
.form-step .grid.two, .form-step .grid-2, .form-step .grid-container{ grid-template-columns: 1fr 1fr; }
.form-step .grid.three, .form-step .grid-3{ grid-template-columns: repeat(3, 1fr); }
@media (max-width: 768px){ .form-step .grid-3{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px){
  .form-step .grid-container, .form-step .grid-2, .form-step .grid.two,
  .form-step .grid-3, .form-step .grid.three{ grid-template-columns: 1fr; }
}

/* Groupes de champs */
.form-step .form-group{ margin-bottom: 1rem; }
.form-step label{
  display:block; font-weight:600; margin-bottom:.45rem;
}
.form-step .required::after{ content:" *"; color:var(--error); }

/* Inputs — style uniforme */
.form-step input[type="text"],
.form-step input[type="email"],
.form-step input[type="tel"],
.form-step input[type="date"],
.form-step input[type="number"],
.form-step input[type="password"],
.form-step textarea,
.form-step select{
  appearance:none;
  width:100%;
  padding:.7rem .9rem;
  border:1px solid var(--border);
  border-radius:12px;
  background: var(--bg);
  color:var(--text);
  font: inherit;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease, transform .06s ease;
  box-shadow: 0 1px 0 rgba(0,0,0,.01);
}
.form-step textarea{ min-height: 120px; resize: vertical; }

/* Focus / hover */
.form-step input:focus,
.form-step select:focus,
.form-step textarea:focus{
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(59,130,246,.18);
}

/* Select custom (flèche) */
.form-step select{
  background-image:
    linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%),
    linear-gradient(to right, transparent, transparent);
  background-position:
    calc(100% - 18px) calc(50% - 3px),
    calc(100% - 13px) calc(50% - 3px),
    calc(100% - 2.2rem) 0;
  background-size: 6px 6px, 6px 6px, 1px 100%;
  background-repeat: no-repeat;
  padding-right: 2.6rem;
  color: inherit;
}
.form-step select:focus{ color: inherit; }

/* Cases à cocher et radios (look propre par défaut) */
.form-step .checkbox-label,
.form-step .radio-label{
  display:flex; align-items:center; gap:.55rem; cursor:pointer; user-select:none;
}
.form-step input[type="checkbox"],
.form-step input[type="radio"]{ accent-color: var(--primary); }

/* Erreurs Django */
.form-step .error-message,
.form-step .errorlist{
  border:1px solid #fecaca; background:#fff1f2; color:#7f1d1d;
  border-radius: 12px; padding:.6rem .75rem; margin:.5rem 0 1rem;
  list-style: none;
}
.form-step .errorlist li{ margin:.15rem 0; }

/* Alerte info (documents, etc.) */
.form-step .info-card{
  background: linear-gradient(135deg, rgba(59,130,246,.08), rgba(139,92,246,.08));
  border:1px solid color-mix(in oklab, var(--primary) 35%, var(--border));
  border-radius:12px; padding:.75rem 1rem;
}

/* Actions (précédent / suivant) */
.form-step .actions{
  display:flex; gap:.6rem; justify-content: space-between; align-items:center; margin-top:1.25rem;
  padding-top: 1rem; border-top:1px solid var(--border);
}
.form-step .actions .btn{ min-width: 150px; }

/* Boutons (si non définis globalement) */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.45rem;
  padding:.72rem 1rem; font-weight:600; border-radius:12px; border:1px solid transparent;
  cursor:pointer; transition: transform .06s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease;
}
.btn svg{ flex:0 0 auto }
.btn-primary{
  background: linear-gradient(135deg, var(--primary), #8b5cf6);
  color:#fff; box-shadow: 0 10px 22px rgba(99,102,241,.22);
}
.btn-primary:hover{ filter: brightness(1.02); transform: translateY(-1px); }
.btn-primary:active{ transform: translateY(0); }
.btn-secondary{
  background: color-mix(in oklab, var(--secondary) 92%, transparent);
  color: var(--text);
  border-color: var(--border);
}
.btn-secondary:hover{ background: var(--secondary-hover); }
.btn-sm{ padding:.45rem .65rem; font-size:.88rem; border-radius:10px; }
.btn-xs{ padding:.25rem .5rem; font-size:.78rem; border-radius:10px; }

/* Chips / badges */
.badge{ display:inline-flex; align-items:center; gap:.35rem; padding:.25rem .6rem; border-radius:999px; font-size:.8rem;
  background: color-mix(in srgb, var(--secondary) 80%, transparent); border:1px solid var(--border); }
.chip{ display:inline-flex; align-items:center; gap:.35rem; padding:.2rem .5rem; border-radius:999px; font-size:.8rem; border:1px solid var(--border); }

/* Inline states utiles */
.status-badge{ border-radius:999px; padding:.35rem .6rem; font-weight:600; }
.status-ok, .status-valide{ background: rgba(16,185,129,.12); color:#10b981; }
.status-warn{ background: rgba(234,179,8,.14); color:#b45309; }
.status-bad, .status-error{ background: rgba(239,68,68,.14); color:#dc2626; }

/* Prévisualisation des inputs désactivés */
.form-step input[disabled],
.form-step select[disabled],
.form-step textarea[disabled]{
  opacity:.75; cursor:not-allowed; background: color-mix(in oklab, var(--bg) 90%, transparent);
}

/* Petites animations de liste (ex: contacts/documents) */
.form-step .list-animate > *{ animation: item-in .18s ease both; }
@keyframes item-in{ from{opacity:0; transform: translateY(4px)} to{opacity:1; transform:none} }

/* === Spécifiques à certaines steps ====================================== */

/* Step “Passager_Choix” — switch déjà présent : juste des micro-effets */
.toggle-switch-custom{ box-shadow: inset 0 0 0 2px color-mix(in oklab, var(--border) 90%, transparent); }
.checkbox-label input[type="checkbox"]:checked + .toggle-switch-custom{ box-shadow:none; }

/* Step “Documents” — petits ajustements visuels si tu utilises .file-upload */
.file-upload-btn{ transition: border-color .2s ease, background .25s ease, transform .08s ease; }
.file-upload-btn:hover{ transform: translateY(-1px); }
.file-meta .btn-ghost{ background: transparent; border-color: var(--border); }
.inline-warning{ border-radius: 8px; }

/* Step “Infos Médicales” — harmonise les alertes */
.alert{ border-radius:12px; }
.alert-error{ background:#fff1f2; border:1px solid #fecaca; color:#7f1d1d; }

/* Step “Décharge” — rendu scroll plus doux */
.terms-scroll{ scrollbar-width: thin; }
.terms-scroll::-webkit-scrollbar{ height:8px; width:8px; }
.terms-scroll::-webkit-scrollbar-thumb{ background: color-mix(in srgb, var(--border) 70%, transparent); border-radius: 999px; }

/* Réduction des animations si préféré */
@media (prefers-reduced-motion: reduce){
  .form-step{ animation: none !important; }
}

/* === Back to top === */
.back-top{
  position: fixed;
  right: 1rem;
  bottom: 1.25rem;
  z-index: 5002;
  width: 3.1rem; height: 3.1rem;
  border: 0; border-radius: 999px;
  display: grid; place-items: center;
  background: var(--bg);
  color: var(--text);
  box-shadow: var(--shadow-md);
  cursor: pointer;
  transition: transform .25s ease, box-shadow .25s ease, opacity .25s ease, filter .25s ease;
  /* état masqué par défaut (on enlève hidden en JS) */
  opacity: 0; transform: translateY(12px) scale(.9);
}

/* Anneau de progression (conic-gradient + masque) */
.back-top::before{
  content: "";
  position: absolute; inset: -4px; border-radius: inherit;
  background:
    conic-gradient(color-mix(in oklab, var(--primary) 85%, #8b5cf6) var(--p, 0%), rgba(127,127,127,.18) 0);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 6px), #000 calc(100% - 6px));
          mask: radial-gradient(farthest-side, transparent calc(100% - 6px), #000 calc(100% - 6px));
  transition: opacity .25s ease;
}
[data-theme="dark"] .back-top::before{
  background:
    conic-gradient(color-mix(in oklab, var(--primary) 85%, #8b5cf6) var(--p, 0%), rgba(255,255,255,.14) 0);
}

.back-top svg{ pointer-events:none; }

/* état affiché (géré par JS via data-show) */
.back-top[data-show="1"]{ opacity: 1; transform: translateY(0) scale(1); }

.back-top:hover{
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 10px 15px -3px rgba(0,0,0,.12), 0 4px 6px -4px rgba(0,0,0,.08);
  filter: brightness(1.02);
}
.back-top:active{ transform: translateY(0) scale(.98); }
.back-top:focus-visible{
  outline: 0;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 35%, transparent), var(--shadow-md);
}

/* Évite le chevauchement avec le bouton thème sur mobile (ton toggle passe en bas à droite <960px) */
@media (max-width: 960px){
  .back-top{ bottom: 4.25rem; } /* remonte au-dessus du theme-toggle */
}

/* Respecte la réduction des mouvements */
@media (prefers-reduced-motion: reduce){
  .back-top, .back-top::before{ transition: none !important; }
}


/* === Wizard Shell : header + form fusionnés en un bloc =================== */
/* Cap du wizard : même largeur que .container, fond verre + sticky */
.wizard-head{
  position: sticky;
  top: calc(var(--nav-height, 64px) + .5rem);
  z-index: 60;
  background: color-mix(in oklab, var(--bg) 86%, transparent);
  backdrop-filter: saturate(120%) blur(6px);
  border: 1px solid var(--border);
  border-bottom: none;                 /* ← soudé au form */
  border-radius: 16px 16px 0 0;        /* cap arrondi */
  box-shadow: 0 14px 28px rgba(0,0,0,.08);
  padding: .9rem 1rem 1rem;
  max-width: 1000px;
  margin: 0 auto;
}

.wizard-head .page-title{ margin: .25rem 0 .6rem; }
.wizard-head .progress-container{
  margin: .25rem 0 1rem;
  height: 8px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--secondary) 92%, transparent);
  overflow: hidden;
}
.wizard-head .progress-bar{ height: 100%; }

/* Les pastilles d'étapes viennent s’asseoir juste sous la barre */
.wizard-head .step-indicator{
  margin: 0;
  padding: 0;
}

/* Le formulaire “prend la suite” du cap, sans rupture visuelle */
.wizard-head + .container{ padding-top: 0; }
.wizard-head + .container .form-step{
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  margin-top: -1px; /* joint propre, pas de liseré */
}

/* Bonus : faire “respirer” le bloc complet */
.form-step{
  border-top: 1px solid var(--border); /* assure la couture avec le header */
  box-shadow: 0 18px 48px rgba(0,0,0,.10);
}

/* Mobile : compacité */
@media (max-width: 768px){
  .wizard-head{ padding: .7rem .75rem .85rem; border-radius: 14px 14px 0 0; }
  .wizard-head .page-title{ font-size: 1.25rem; }
  .wizard-head .progress-container{ margin-bottom: .85rem; }
}

.wizard-head .progress-container{ margin-bottom: .9rem; }
.wizard-head .step-indicator{ padding-top: .1rem; }

/* 1) NE PAS masquer horizontalement tout le document */
html,body{ overflow-x: visible; }      /* ou supprime la règle si tu l'as ajoutée */

/* 2) Corrige le débordement uniquement dans la nav */
.site-nav, .site-nav-wrap { overflow-x: clip; }   /* confine le header sans toucher au reste */

/* 3) Sur mobile, fais rétrécir le brand au lieu de pousser la page */
@media (max-width: 960px){
  .site-nav { gap: .5rem; }
  .nav-left { flex: 1 1 auto; min-width: 0; }
  .brand { min-width: 0; }
  .brand-name{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 65vw;   /* laisse la place au burger */
  }
}

/* 4) Par sécurité, évite que les enfants de grilles soient “trop larges” */
.charts-grid, .chart-card, .chart-container, .table-card { min-width: 0; }

/* 33 880 47 04 */