/* ============================================================
   audit.css — Formulaire d'audit IDSWORLD Digital
   Charte : fond blanc, cartes #fff, bleu #094E92 (maj 17/09/2026)
   Règle : font-family déclarée sur CHAQUE élément ; curseur NATIF.
   ============================================================ */
:root{
  --bg:#ffffff; --bg-alt:#F5F8FC; --card:#ffffff; --border:#E3E9F2;
  --accent:#094E92; --accent-dim:rgba(9,78,146,0.12);
  --accent-glow:rgba(9,78,146,0.06); --text:#1F2A37; --text-dim:#5A6673;
  --gradient:linear-gradient(135deg,#094E92 0%,#0B63B8 100%);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;}
.page{max-width:760px;margin:0 auto;padding:0 24px 60px;}

/* ---------- topbar ---------- */
.topbar{display:flex;align-items:center;gap:14px;padding:22px 0;border-bottom:1px solid var(--border);}
.logo{height:36px;width:auto;display:block;}
.topbar-label{font-family:inherit;font-size:13px;color:var(--text-dim);}

/* ---------- hero ---------- */
.hero{padding:48px 0 36px;}
.hero h1{font-family:inherit;font-size:42px;font-weight:800;letter-spacing:-0.5px;line-height:1.15;margin-bottom:16px;}
.gold{color:var(--accent);}
.hero-sub{font-family:inherit;font-size:17px;color:var(--text-dim);max-width:600px;}
.hero-sub strong{color:var(--text);}
.hero-steps{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;}
.hero-steps span{font-family:inherit;font-size:13px;color:var(--accent);background:var(--accent-dim);border:1px solid rgba(9,78,146,0.25);border-radius:999px;padding:6px 14px;}

/* ---------- sections ---------- */
.section{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:26px;margin-bottom:20px;}
.section-head{display:flex;align-items:baseline;gap:12px;margin-bottom:18px;flex-wrap:wrap;}
/* Numéro de section : chip blanc translucide, DANS le bandeau bleu */
.section-num{font-family:inherit;font-size:12px;font-weight:700;color:#fff;border:1px solid rgba(255,255,255,0.5);border-radius:6px;padding:2px 8px;margin-right:11px;display:inline-block;vertical-align:middle;}
/* Titre de section : bandeau pleine largeur, même rendu que le bouton d'envoi, numéro intégré */
.section h2{font-family:inherit;font-size:19px;font-weight:700;display:block;width:100%;background:var(--gradient);color:#fff;border-radius:10px;padding:11px 18px;box-shadow:0 8px 24px rgba(9,78,146,0.22);}
.section-sub{font-family:inherit;font-size:13px;color:var(--text-dim);width:100%;margin-top:2px;}

/* ---------- champs ---------- */
.hint{font-family:inherit;font-size:12px;color:#8B96A5;font-weight:400;}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin-bottom:12px;}
.check{display:flex;align-items:center;gap:9px;background:var(--bg-alt);border:1px solid var(--border);border-radius:8px;padding:9px 12px;cursor:pointer;font-size:13.5px;color:var(--text);transition:border-color .15s ease,background .15s ease;}
.check:hover{border-color:rgba(9,78,146,0.4);}
.check input{accent-color:var(--accent);width:16px;height:16px;flex-shrink:0;}
.check:has(input:checked){border-color:var(--accent);background:var(--accent-dim);}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.full{grid-column:1 / -1;}
.field{margin-bottom:16px;}
.field label{font-family:inherit;display:block;font-size:13px;font-weight:600;color:var(--text);margin-bottom:6px;}
.req{color:var(--accent);}
input[type="text"],input[type="email"],input[type="tel"],input[type="url"],select,textarea{
  font-family:inherit;width:100%;background:var(--bg-alt);color:var(--text);
  border:1px solid var(--border);border-radius:8px;padding:11px 13px;font-size:15px;
  transition:border-color .15s ease, box-shadow .15s ease;outline:none;
}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow);}
textarea{resize:vertical;min-height:70px;}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--accent) 50%),linear-gradient(135deg,var(--accent) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;}
::placeholder{color:#8B96A5;}
option{background:var(--card);color:var(--text);}
::selection{background:rgba(9,78,146,0.15);}

/* ---------- consentement ---------- */
.consent{display:flex;align-items:flex-start;gap:10px;background:var(--accent-dim);border:1px solid rgba(9,78,146,0.25);border-radius:10px;padding:14px 16px;margin:6px 0 22px;cursor:pointer;}
.consent input{margin-top:4px;accent-color:var(--accent);width:16px;height:16px;}
.consent span{font-family:inherit;font-size:13px;color:var(--text-dim);}

/* ---------- bouton ---------- */
.actions{text-align:center;}
.btn{font-family:inherit;font-size:16px;font-weight:700;color:#fff;background:var(--gradient);border:none;border-radius:10px;padding:14px 32px;cursor:pointer;transition:transform .12s ease, opacity .12s ease;box-shadow:0 8px 24px rgba(9,78,146,0.22);}
.btn:hover{transform:translateY(-1px);}
.btn:disabled{opacity:.55;cursor:wait;transform:none;}
.form-msg{font-family:inherit;margin-top:12px;font-size:14px;color:#e05b5b;min-height:20px;}
.form-msg.ok{color:#1E7A4A;}

/* ---------- honeypot (invisible) ---------- */
.hp{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden;}

/* ---------- confirmation ---------- */
.confirm{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:44px 28px;text-align:center;margin-top:8px;}
.confirm-icon{width:56px;height:56px;border-radius:50%;background:var(--accent-dim);border:1px solid rgba(9,78,146,0.4);color:var(--accent);font-size:26px;line-height:54px;margin:0 auto 18px;}
.confirm h2{font-family:inherit;font-size:24px;font-weight:700;margin-bottom:10px;}
.confirm p{font-family:inherit;color:var(--text-dim);max-width:460px;margin:0 auto 8px;}
.confirm-note{margin-top:16px;}
.confirm a{color:var(--accent);text-decoration:none;}
.confirm a:hover{text-decoration:underline;}

/* ---------- footer ---------- */
.footer{border-top:1px solid var(--border);margin-top:44px;padding-top:22px;text-align:center;}
.footer p{font-family:inherit;font-size:13px;color:var(--text-dim);}
.footer .footer-dim{font-size:12px;color:#8B96A5;margin-top:4px;}
.footer a{color:var(--accent);text-decoration:none;}

/* ---------- responsive ---------- */
@media(max-width:640px){
  .hero h1{font-size:32px;}
  .grid2{grid-template-columns:1fr;}
  .page{padding:0 16px 40px;}
  .section{padding:20px;}
  /* anti-zoom iOS : sous 16px, Safari iPhone zoome la page au focus d'un champ */
  input[type="text"], input[type="email"], input[type="tel"], input[type="url"], select, textarea{font-size:16px;}
}
