@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

/* Design partagé entre toutes les pages de protocole-chargement.fr */
:root{
  --ink:#16244b;          /* texte principal (bleu nuit) */
  --brand:#1d3979;        /* boutons, titres */
  --brand-hover:#2a4aa0;
  --brand-ink:#ffffff;    /* texte sur fond brand */
  --accent:#3558e8;       /* bleu vif : liens, focus, progression */
  --accent-ink:#ffffff;
  --accent-2:#5a3fd0;     /* indigo, fin des dégradés */
  --tint:#eef2ff;         /* fond des pastilles / états sélectionnés */
  --paper:#f4f7fd;
  --paper-raised:#ffffff;
  --line:#dde4f2;
  --muted:#5a6788;
  --ok:#17805a;
  --go:#14855d;           /* bouton « go » (générer le PDF) */
  --go-hover:#0f6f4c;
  --warn:#b42318;
  --warn-bg:#fdecea;
  --note-bg:#fff8e5;      /* bloc « attention » (jaune doux) */
  --note-line:#f1d27a;
  --shadow:0 1px 2px rgba(22,36,75,.05), 0 10px 30px -12px rgba(22,36,75,.18);
  --shadow-btn:0 8px 18px -8px rgba(29,57,121,.65);
  --radius:16px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#e9eefc; --brand:#4f6bf0; --brand-hover:#6580ff; --brand-ink:#ffffff;
    --accent:#86a0ff; --accent-ink:#0e1426; --accent-2:#a58bff; --tint:#1c2547;
    --paper:#0e1426; --paper-raised:#161d34; --line:#27304f; --muted:#9aa7cb;
    --ok:#5fcf9f; --go:#1f9d6e; --go-hover:#27b27e; --warn:#ff9b8f; --warn-bg:#3a1f24;
    --note-bg:#2b2410; --note-line:#6b5a1f;
    --shadow:0 1px 2px rgba(0,0,0,.3), 0 10px 30px -12px rgba(0,0,0,.5);
    --shadow-btn:0 8px 18px -8px rgba(79,107,240,.6);
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --ink:#e9eefc; --brand:#4f6bf0; --brand-hover:#6580ff; --brand-ink:#ffffff;
  --accent:#86a0ff; --accent-ink:#0e1426; --accent-2:#a58bff; --tint:#1c2547;
  --paper:#0e1426; --paper-raised:#161d34; --line:#27304f; --muted:#9aa7cb;
  --ok:#5fcf9f; --go:#1f9d6e; --go-hover:#27b27e; --warn:#ff9b8f; --warn-bg:#3a1f24;
  --note-bg:#2b2410; --note-line:#6b5a1f;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 10px 30px -12px rgba(0,0,0,.5);
  --shadow-btn:0 8px 18px -8px rgba(79,107,240,.6);
  color-scheme: dark;
}

*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
[hidden]{display:none !important;}
html{background:var(--paper); -webkit-text-size-adjust:100%;}
body{
  background:var(--paper); color:var(--ink);
  font-family:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  margin:0; line-height:1.55; -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:"Inter", system-ui, sans-serif; color:var(--brand); text-wrap:balance; margin:0; letter-spacing:-0.02em; line-height:1.15;}
.mono{font-family:"IBM Plex Mono", ui-monospace, monospace;}
a{color:inherit}
p{margin:0}
img,svg{max-width:100%}
input[type="checkbox"], input[type="radio"]{accent-color:var(--accent);}

.wrap{max-width:1120px; margin:0 auto; padding-inline:20px;}
.wrap-narrow{max-width:760px; margin:0 auto; padding-inline:20px;}
.band{padding-block:80px;}
.band-raised{background:var(--paper-raised); border-block:1px solid var(--line);}

/* Nav */
header.nav{
  position:sticky; top:env(safe-area-inset-top,0px); z-index:20;
  background:color-mix(in srgb, var(--paper-raised) 86%, transparent);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-row{display:flex; align-items:center; justify-content:space-between; gap:16px; padding-block:14px;}
.brand{display:flex; align-items:center; gap:10px; font-weight:800; font-size:1.08rem; letter-spacing:-0.01em; text-decoration:none; color:var(--brand);}
.brand svg{flex:none; color:var(--accent);}
.nav-links{display:flex; align-items:center; gap:28px; font-size:0.92rem; font-weight:500;}
.nav-links a{text-decoration:none; color:var(--muted);}
.nav-links a:hover{color:var(--brand);}
@media (max-width:720px){ .nav-links a:not(.btn){display:none} }
.nav-links a.btn-primary{color:var(--brand-ink);}
.nav-links a.btn-primary:hover{color:var(--brand-ink);}
@media (max-width:560px){
  .nav-row{gap:10px;}
  .brand{font-size:0.98rem; min-width:0;}
  .nav-links{min-width:0;}
  .nav-links .btn{white-space:normal; text-align:center; line-height:1.15; padding:8px 14px; font-size:0.82rem;}
}

/* Boutons */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 22px; border-radius:999px; font-weight:600; font-size:0.94rem;
  text-decoration:none; border:1px solid transparent; cursor:pointer; font-family:inherit;
  white-space:nowrap; max-width:100%;
  transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease, border-color .15s ease;
}
.btn-primary{background:var(--brand); color:var(--brand-ink); box-shadow:var(--shadow-btn);}
.btn-primary:hover{background:var(--brand-hover); transform:translateY(-1px);}
.btn-primary:active{transform:translateY(0);}
.btn-primary:disabled{opacity:0.45; cursor:not-allowed; transform:none; box-shadow:none;}
.btn-go{background:var(--go); color:#fff; box-shadow:0 8px 18px -8px rgba(20,133,93,.7);}
.btn-go:hover{background:var(--go-hover); transform:translateY(-1px);}
.btn-go:disabled{opacity:0.45; cursor:not-allowed; transform:none; box-shadow:none;}
.btn-ghost{background:var(--paper-raised); color:var(--brand); border-color:var(--line);}
.btn-ghost:hover{border-color:var(--accent); color:var(--accent);}
.btn:focus-visible, a:focus-visible, summary:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 45%, transparent); outline-offset:2px;}
.link-arrow{font-size:0.95rem; font-weight:600; text-decoration:none; color:var(--accent); border-bottom:1px solid color-mix(in srgb, var(--accent) 35%, transparent);}
.link-arrow:hover{border-color:var(--accent);}
@media (max-width:560px){
  .btn{white-space:normal; text-align:center; justify-content:center; line-height:1.25;}
}
@media (prefers-reduced-motion: reduce){ .btn{transition:none;} .btn-primary:hover{transform:none;} }

/* Hero (landing) */
.hero{
  padding-block:64px 88px;
  background:
    radial-gradient(900px 420px at 88% -8%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 70%),
    radial-gradient(700px 380px at -6% 8%, color-mix(in srgb, var(--accent-2) 10%, transparent), transparent 70%);
}
.hero-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center;}
@media (max-width:880px){ .hero-grid{grid-template-columns:1fr;} }
.eyebrow{display:inline-flex; align-items:center; gap:9px; padding:8px 14px 8px 10px; border-radius:14px; background:var(--tint); border:1px solid color-mix(in srgb, var(--accent) 22%, var(--line)); font-size:0.82rem; font-weight:600; line-height:1.35; color:var(--accent); margin-bottom:22px; max-width:100%;}
.eyebrow .ico-check{flex:none; width:20px; height:20px; color:var(--go);}
.eyebrow .mono{color:var(--brand); font-weight:600; white-space:nowrap;}
.hero h1{font-size:clamp(2.1rem, 4.6vw, 3.3rem); font-weight:800;}
.hero h1 em{font-style:normal; background:linear-gradient(90deg, var(--accent), var(--accent-2)); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;}
.hero p.lede{margin-top:20px; font-size:1.1rem; color:var(--muted); max-width:48ch;}
.price-line{margin-top:16px; font-size:1rem; color:var(--muted);}
.price-line strong{font-size:1.2rem; color:var(--brand);}
.cta-row{display:flex; align-items:center; gap:22px; margin-top:28px; flex-wrap:wrap;}

.facts{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:44px;}
.fact{background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:18px 18px;}
.fact .fact-ico{display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:12px; background:var(--tint); color:var(--accent); margin-bottom:12px;}
.fact .fact-ico svg{width:20px; height:20px;}
.fact .num{font-weight:800; font-size:1.35rem; color:var(--brand); letter-spacing:-0.02em;}
.fact .label{font-size:0.84rem; color:var(--muted); margin-top:4px;}
@media (max-width:560px){ .facts{grid-template-columns:1fr;} }

/* Carte héro : dégradé bleu → indigo, maquette blanche dedans */
.illu-card{
  background:linear-gradient(145deg, var(--accent) 0%, var(--accent-2) 100%);
  border-radius:28px; padding:22px; position:relative;
  box-shadow:0 30px 60px -28px rgba(53,88,232,.6);
}
.illu-badge{margin-top:16px; display:flex; align-items:center; justify-content:center; gap:10px; padding:12px 16px; border-radius:14px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35); color:#fff; font-size:0.9rem; font-weight:600; text-align:center;}
.illu-badge .tick{flex:none; display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:#fff; color:var(--go);}
.illu-badge .tick svg{width:14px; height:14px;}
.mock-window{background:var(--paper-raised); border:0; border-radius:16px; overflow:hidden; box-shadow:0 14px 30px -16px rgba(10,20,60,.5);}
.mock-topbar{display:flex; align-items:center; gap:7px; padding:11px 14px; border-bottom:1px solid var(--line); background:var(--paper);}
.mock-dot{width:9px; height:9px; border-radius:50%; background:var(--line);}
.mock-title{margin-left:8px; font-family:"IBM Plex Mono", monospace; font-size:0.74rem; color:var(--muted);}
.mock-body{padding:22px;}
.mock-progress{height:7px; border-radius:999px; background:var(--tint); overflow:hidden; margin-bottom:22px;}
.mock-progress-fill{height:100%; width:62%; background:linear-gradient(90deg, var(--accent), var(--accent-2)); border-radius:999px;}
.mock-group + .mock-group{margin-top:18px;}
.mock-group-title{font-size:0.76rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:0.05em; margin-bottom:9px;}
.mock-chips{display:flex; flex-wrap:wrap; gap:8px;}
.mock-chip{font-size:0.84rem; font-weight:500; padding:6px 12px; border-radius:999px; border:1px solid color-mix(in srgb, var(--accent) 22%, var(--line)); background:var(--tint); color:var(--brand);}
.mock-chip-pending{color:var(--muted); background:transparent; border-style:dashed;}
.mock-divider{height:1px; background:var(--line); margin:20px 0 16px;}
.mock-result{display:flex; align-items:center; gap:9px; font-size:0.88rem; font-weight:600; color:var(--ok);}
.mock-result .tick{flex:none; display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; background:var(--ok); color:#fff;}
.mock-result .tick svg{width:12px; height:12px;}

/* Section headers */
.section-head{max-width:62ch; margin-bottom:48px;}
.kicker{font-size:0.8rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--accent); font-weight:700; margin-bottom:12px;}
.section-head h2{font-size:clamp(1.6rem,2.8vw,2.2rem); font-weight:800;}
.section-head p{margin-top:14px; color:var(--muted); font-size:1.04rem;}

/* Steps (landing "comment ça marche") */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media (max-width:820px){ .steps{grid-template-columns:1fr;} }
.steps .step{background:var(--paper-raised); border:1px solid var(--line); border-radius:20px; padding:26px; box-shadow:var(--shadow);}
.step .step-head{display:flex; align-items:center; gap:12px;}
.step .step-ico{display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px; border-radius:14px; background:var(--tint); color:var(--accent);}
.step .step-ico svg{width:24px; height:24px;}
.step .step-count{font-size:0.78rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted);}
.step h3{font-size:1.15rem; margin-top:16px; font-weight:700;}
.step p{margin-top:10px; color:var(--muted); font-size:0.96rem;}

/* Legal callout */
.legal-grid{display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:start;}
@media (max-width:820px){ .legal-grid{grid-template-columns:1fr;} }
.legal-card{background:var(--tint); border:1px solid color-mix(in srgb, var(--accent) 20%, var(--line)); border-left:4px solid var(--accent); border-radius:14px; padding:24px 26px; font-size:0.92rem; color:var(--muted);}
.legal-card .cite-head{color:var(--brand); font-weight:700; margin-bottom:8px; font-size:0.9rem;}
.legal-card .mono{display:block; margin-bottom:10px; color:var(--ink); font-size:0.82rem;}

/* Comparison table */
.table-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper-raised); box-shadow:var(--shadow);}
table{width:100%; border-collapse:collapse; font-size:0.94rem; min-width:560px;}
th,td{padding:15px 18px; text-align:left; border-bottom:1px solid var(--line);}
thead th{font-size:0.8rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--muted); font-weight:700; background:var(--paper);}
tbody tr:last-child td{border-bottom:none;}
td.col-us{font-weight:600; color:var(--brand);}
.check{color:var(--ok); font-weight:700;}
.dash{color:var(--muted);}
th.col-us-head{color:var(--accent);}

/* Pricing cards */
.pricing-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
@media (max-width:820px){ .pricing-grid{grid-template-columns:1fr;} }
.price-card{border:1px solid var(--line); border-radius:24px; padding:30px; background:var(--paper-raised); box-shadow:var(--shadow);}
.price-card.highlight{border-color:var(--accent); box-shadow:0 0 0 1px var(--accent), 0 24px 48px -24px rgba(53,88,232,.45); background:linear-gradient(180deg, var(--tint), var(--paper-raised) 38%);}
.price-card .amount{font-weight:800; font-size:2.4rem; color:var(--brand); letter-spacing:-0.03em;}
.price-card .tag{display:inline-block; font-size:0.74rem; font-weight:700; color:var(--accent); background:var(--tint); padding:4px 11px; border-radius:999px; text-transform:uppercase; letter-spacing:0.05em; margin-bottom:12px;}
.price-card ul{list-style:none; margin:20px 0 0; padding:0; display:flex; flex-direction:column; gap:11px; font-size:0.93rem; color:var(--muted);}
.price-card li{display:flex; gap:10px;}
.price-card li::before{content:"✓"; color:var(--accent); font-weight:800; flex:none;}
.price-card .btn{margin-top:24px; width:100%; justify-content:center;}
.price-note{margin-top:16px; font-size:0.82rem; color:var(--muted);}

/* FAQ */
.faq{display:flex; flex-direction:column; gap:12px; max-width:760px;}
details{border:1px solid var(--line); border-radius:14px; background:var(--paper-raised); padding:17px 22px; box-shadow:0 1px 2px rgba(22,36,75,.04); transition:box-shadow .15s ease, border-color .15s ease;}
details:hover{box-shadow:var(--shadow);}
details[open]{border-color:color-mix(in srgb, var(--accent) 35%, var(--line));}
details summary{cursor:pointer; font-weight:600; color:var(--brand); list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px;}
details summary::-webkit-details-marker{display:none;}
details summary::after{content:"+"; font-size:1.3rem; font-weight:500; color:var(--accent); line-height:1;}
details[open] summary::after{content:"–";}
details p{margin-top:12px; color:var(--muted); font-size:0.95rem;}

/* Final CTA band */
.cta-band{background:linear-gradient(135deg, var(--brand) 0%, #3a3fb8 100%); color:#fff; border-radius:28px; padding:52px 40px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; box-shadow:0 30px 60px -30px rgba(29,57,121,.7);}
.cta-band h2{color:#fff; font-size:clamp(1.5rem,2.8vw,2rem);}
.cta-band .btn-primary{background:#fff; color:var(--brand); box-shadow:0 10px 24px -12px rgba(0,0,0,.5);}
.cta-band .btn-primary:hover{background:#f1f4ff;}

/* Footer */
footer{padding-block:52px; border-top:1px solid var(--line); background:var(--paper-raised);}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px;}
@media (max-width:720px){ .footer-grid{grid-template-columns:1fr 1fr;} }
.footer-grid h4{font-size:0.8rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--muted); margin-bottom:12px;}
.footer-grid a{display:block; font-size:0.9rem; text-decoration:none; color:var(--ink); margin-bottom:8px;}
.footer-grid a:hover{color:var(--accent);}
.footer-bottom{margin-top:36px; padding-top:20px; border-top:1px solid var(--line); font-size:0.8rem; color:var(--muted); display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;}
.disclaimer{font-size:0.82rem; color:var(--muted); max-width:46ch; margin-top:10px;}

/* ---- Wizard (gratuit.html / commencer.html) ---- */
.wizard-wrap{padding-block:28px 64px;}
.notice{font-size:0.86rem; color:var(--muted); border:1px solid color-mix(in srgb, var(--accent) 20%, var(--line)); background:var(--tint); border-radius:12px; padding:12px 16px; margin-bottom:24px;}
.notice a{color:var(--accent); font-weight:600;}
.progress-track{scroll-margin-top:84px; height:8px; border-radius:999px; background:var(--line); overflow:hidden; margin-bottom:8px;}
.progress-fill{height:100%; background:linear-gradient(90deg, var(--accent), var(--accent-2)); border-radius:999px; transition:width 0.3s ease; width:14%;}
.step-label{font-size:0.8rem; font-weight:600; color:var(--muted); margin-bottom:28px;}
.card{background:var(--paper-raised); border:1px solid var(--line); border-radius:24px; padding:34px; box-shadow:var(--shadow);}
@media (max-width:560px){ .card{padding:22px;} }
.step-title{font-size:1.5rem; font-weight:800; color:var(--brand); letter-spacing:-0.02em; margin-bottom:6px;}
.step-sub{color:var(--muted); font-size:0.95rem; margin-bottom:26px;}
.field{margin-bottom:20px;}
.field label{display:block; font-size:0.88rem; font-weight:600; color:var(--ink); margin-bottom:7px;}
.field > label.group-label{display:flex; align-items:center; gap:9px; font-size:0.78rem; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; color:var(--brand); padding-bottom:9px; margin-bottom:13px; border-bottom:2px solid var(--tint);}
.field > label.group-label::before{content:""; width:4px; height:14px; border-radius:2px; background:linear-gradient(180deg, var(--accent), var(--accent-2)); flex:none;}
.field-group{margin-top:30px;}
.field .hint{display:block; font-weight:400; color:var(--muted); font-size:0.82rem; margin-top:4px;}
input[type="text"], input[type="tel"], input[type="email"], textarea{
  width:100%; font:inherit; font-size:0.96rem; padding:12px 14px; border-radius:12px;
  border:1px solid var(--line); background:var(--paper-raised); color:var(--ink);
  transition:border-color .15s ease, box-shadow .15s ease;
}
input::placeholder, textarea::placeholder{color:color-mix(in srgb, var(--muted) 70%, transparent);}
textarea{resize:vertical; min-height:76px; font-family:inherit;}
input:focus, textarea:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 18%, transparent);}
.radio-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
@media (max-width:520px){ .radio-grid{grid-template-columns:1fr;} }
.opt{border:1px solid var(--line); border-radius:12px; padding:13px 15px; display:flex; align-items:flex-start; gap:10px; cursor:pointer; font-size:0.93rem; background:var(--paper-raised); transition:border-color .15s ease, background-color .15s ease;}
.opt:hover{border-color:color-mix(in srgb, var(--accent) 45%, var(--line));}
.opt:has(input:checked){border-color:var(--accent); background:var(--tint); box-shadow:0 0 0 1px var(--accent) inset;}
.opt input{margin-top:3px;}
.toggle-row{display:flex; gap:10px;}
.toggle-row .opt{flex:1; justify-content:center; text-align:center; font-weight:600;}
.chip-grid{display:flex; flex-wrap:wrap; gap:9px;}
.chip{border:1px solid var(--line); border-radius:999px; padding:9px 15px; font-size:0.88rem; font-weight:500; cursor:pointer; background:var(--paper-raised); position:relative; transition:background-color .15s ease, border-color .15s ease;}
.chip:hover{border-color:var(--accent);}
.chip:has(input:checked){background:var(--brand); color:var(--brand-ink); border-color:var(--brand);}
.chip input{position:absolute; opacity:0; width:0; height:0;}
.checklist{display:flex; flex-direction:column; gap:10px;}
.check-row{display:flex; align-items:flex-start; gap:10px; font-size:0.93rem;}
.check-row input{margin-top:3px;}
.warning{border:1px solid color-mix(in srgb, var(--warn) 55%, var(--line)); background:var(--warn-bg); color:var(--warn); border-radius:12px; padding:16px 18px; font-size:0.9rem; margin:18px 0; display:none;}
.warning.visible{display:block;}
.warning strong{display:block; margin-bottom:6px;}
.warning label{display:flex; gap:8px; margin-top:12px; font-weight:600; cursor:pointer; align-items:flex-start;}
.note-info{display:none; border:1px solid color-mix(in srgb, var(--accent) 28%, var(--line)); border-left:4px solid var(--accent); background:var(--tint); color:var(--ink); border-radius:12px; padding:14px 16px; font-size:0.9rem; margin:18px 0;}
.note-info.visible{display:block;}
.note-info strong{display:block; color:var(--brand); margin-bottom:4px;}
.nav-row-wizard{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; margin-top:30px; gap:12px;}
.nav-row-wizard .btn, .upsell .btn{white-space:normal; text-align:center; justify-content:center; line-height:1.25;}
@media (max-width:520px){
  .nav-row-wizard{flex-wrap:wrap-reverse;}
  .nav-row-wizard .btn{flex:1 1 auto;}
}
.summary dl{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.4fr); gap:10px 16px; font-size:0.9rem;}
.summary dt{color:var(--muted); overflow-wrap:anywhere;}
.summary dd{margin:0; text-align:justify; hyphens:auto; -webkit-hyphens:auto; overflow-wrap:break-word;}
@media (max-width:520px){
  .summary dl{grid-template-columns:minmax(0,1fr); gap:2px 0;}
  .summary dd{margin-bottom:12px;}
}
.summary h3{font-size:0.82rem; text-transform:uppercase; letter-spacing:0.07em; margin:24px 0 10px; color:var(--accent);}
.summary h3:first-child{margin-top:0;}
.status-msg{margin-top:14px; font-size:0.86rem;}
.status-ok{color:var(--ok);}
.status-err{color:var(--warn);}
.status-msg.status-ok{background:color-mix(in srgb, var(--ok) 10%, var(--paper-raised)); border:1px solid color-mix(in srgb, var(--ok) 35%, var(--line)); border-radius:12px; padding:12px 16px;}
.status-msg.status-err{background:var(--warn-bg); border:1px solid var(--warn); border-radius:12px; padding:12px 16px;}

/* Après génération du PDF gratuit : blocs distincts (bravo / attention / la suite) */
.upsell{display:none; margin-top:14px;}
.upsell.visible{display:block;}
.upsell .ub{border:1px solid var(--line); border-radius:16px; padding:18px 20px; margin-top:12px; font-size:0.93rem; background:var(--paper-raised);}
.upsell .ub > strong{display:block; font-size:1rem; color:var(--brand); margin-bottom:6px;}
.upsell .ub p{margin:0; color:var(--muted);}
.upsell .ub-bravo{border-left:4px solid var(--ok);}
.upsell .ub-attn{background:var(--note-bg); border-color:var(--note-line); border-left:4px solid var(--note-line);}
.upsell .ub-attn p{color:var(--ink);}
.upsell .ub-next{box-shadow:var(--shadow);}
.upsell .ub-next ol{margin:8px 0 0 18px; padding:0; line-height:1.65; color:var(--muted);}
.upsell .ub-next .btn{display:flex; width:100%; margin-top:18px;}

/* Pages de résultat (merci / transporteur) */
.center-card{max-width:560px; margin:48px auto; padding-inline:20px;}
.result-card{background:var(--paper-raised); border:1px solid var(--line); border-radius:24px; padding:36px; text-align:center; box-shadow:var(--shadow);}
.result-card h1{font-size:1.6rem; margin-bottom:10px;}
.result-card p{color:var(--muted); margin-top:10px;}
.link-box{display:flex; gap:8px; margin-top:20px; align-items:center;}
.link-box input{flex:1; font-family:"IBM Plex Mono",monospace; font-size:0.82rem;}
.qr-box{margin-top:20px; display:flex; justify-content:center;}
.qr-box img{border-radius:12px; border:1px solid var(--line);}
.spinner{width:24px; height:24px; border-radius:50%; border:3px solid var(--line); border-top-color:var(--accent); animation:spin 0.8s linear infinite; margin:20px auto;}
@keyframes spin{to{transform:rotate(360deg);}}
.hazmat-fields{display:none; margin-top:18px;}
.hazmat-fields.visible{display:block;}
.hazmat-fields .note-info{margin:14px 0;}
.field-error{display:none; color:var(--warn); font-size:0.85rem; font-weight:600; margin-top:8px;}
.field-error.visible{display:block;}