/* veryfreePDF — styles partagés (landing + pages outils) */
:root {
  --bg:#f7f7f9; --surface:#fff; --ink:#16161a; --muted:#5b5b66; --faint:#9a9aa6;
  --border:#e6e6ec; --accent:#4f46e5; --accent2:#8b5cf6; --accent-soft:#eef0fe;
  --ok:#16a34a; --danger:#dc2626;
  --r:16px; --r-sm:10px;
  --shadow:0 1px 2px rgba(20,20,40,.05), 0 12px 32px -14px rgba(20,20,60,.18);
  --shadow-lg:0 24px 60px -24px rgba(30,20,80,.35);
}
@media (prefers-color-scheme: dark) {
  :root { --bg:#0b0b0e; --surface:#141419; --ink:#f2f2f5; --muted:#a2a2ad; --faint:#6b6b76;
    --border:#26262e; --accent:#7c74ff; --accent2:#a78bfa; --accent-soft:#1b1b2b; }
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); line-height:1.55;
  font-family:ui-sans-serif,-apple-system,"SF Pro Text","Segoe UI",Inter,Roboto,sans-serif;
  -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }
svg.ic { width:18px; height:18px; stroke:currentColor; stroke-width:1.8; fill:none;
  stroke-linecap:round; stroke-linejoin:round; flex:none; }
.wrap { max-width:1080px; margin:0 auto; padding:0 22px; }

/* ---- Header ---- */
header.site { position:sticky; top:0; z-index:30; backdrop-filter:blur(14px);
  background:color-mix(in srgb, var(--surface) 82%, transparent); border-bottom:1px solid var(--border); }
header.site .wrap { display:flex; align-items:center; gap:10px; height:60px; }
.brand { display:flex; align-items:center; gap:9px; margin-right:auto; font-weight:750; font-size:17px; letter-spacing:-.2px; }
.brand .mark { width:32px; height:32px; border-radius:9px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--accent),var(--accent2)); color:#fff; }
.brand .mark svg.ic { width:17px; height:17px; }
.brand b { color:var(--accent); }
.lang-sw { font-size:12.5px; color:var(--muted); display:flex; gap:2px; }
.lang-sw a { padding:5px 9px; border-radius:8px; font-weight:600; }
.lang-sw a.on { color:var(--accent); background:var(--accent-soft); }
.lang-sw a:hover:not(.on) { background:var(--accent-soft); }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:620; font-size:14.5px;
  padding:11px 20px; border-radius:99px; border:1px solid transparent; transition:.15s; }
.btn.primary { background:linear-gradient(135deg,var(--accent),var(--accent2)); color:#fff;
  box-shadow:0 8px 24px -8px color-mix(in srgb,var(--accent) 70%,transparent); border:none; }
.btn.primary:hover { transform:translateY(-1px); }
.btn.primary:disabled { opacity:.5; transform:none; cursor:default; }
.btn.ghost { background:var(--surface); border-color:var(--border); color:var(--ink); }
.btn.ghost:hover { border-color:var(--accent); color:var(--accent); }
.btn.big { font-size:16.5px; padding:15px 30px; }

/* ---- Hero outil ---- */
.tool-hero { text-align:center; padding:46px 0 10px; }
.tool-hero .tico { width:58px; height:58px; margin:0 auto 16px; border-radius:16px; display:grid; place-items:center;
  background:var(--accent-soft); color:var(--accent); }
.tool-hero .tico svg.ic { width:28px; height:28px; }
.tool-hero h1 { font-size:clamp(27px,4.6vw,42px); letter-spacing:-1px; margin:0 0 10px; font-weight:800; }
.tool-hero p { font-size:clamp(15px,2vw,17.5px); color:var(--muted); max-width:640px; margin:0 auto; }

/* ---- Zone de travail ---- */
#ws { max-width:860px; margin:30px auto 10px; padding:0 22px; }
.dropzone { border:2px dashed color-mix(in srgb,var(--accent) 35%, var(--border)); border-radius:var(--r);
  background:var(--surface); padding:52px 24px; text-align:center; cursor:pointer; transition:.15s; }
.dropzone:hover, .dropzone.over { border-color:var(--accent); background:var(--accent-soft); }
.dropzone .dz-ic { width:52px; height:52px; margin:0 auto 14px; border-radius:14px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--accent),var(--accent2)); color:#fff; }
.dropzone .dz-ic svg.ic { width:25px; height:25px; }
.dropzone strong { font-size:17px; display:block; margin-bottom:4px; }
.dropzone span { font-size:13px; color:var(--muted); }
.dz-note { text-align:center; font-size:12.5px; color:var(--faint); margin-top:12px;
  display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.dz-note em { font-style:normal; display:inline-flex; align-items:center; gap:5px; }
.dz-note svg.ic { width:13px; height:13px; color:var(--accent); }

.filelist { display:flex; flex-direction:column; gap:8px; margin:16px 0; }
.file-row { display:flex; align-items:center; gap:12px; background:var(--surface);
  border:1px solid var(--border); border-radius:var(--r-sm); padding:10px 14px; }
.file-row .fic { width:34px; height:34px; border-radius:9px; display:grid; place-items:center;
  background:var(--accent-soft); color:var(--accent); flex:none; }
.file-row .fname { flex:1; min-width:0; font-size:14px; font-weight:560;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.file-row .fmeta { font-size:12px; color:var(--muted); white-space:nowrap; }
.file-row button.frm { border:none; background:transparent; color:var(--faint); padding:6px; border-radius:7px; }
.file-row button.frm:hover { color:var(--danger); background:color-mix(in srgb,var(--danger) 10%, transparent); }
.file-row .fmove { display:flex; flex-direction:column; gap:1px; }
.file-row .fmove button { border:none; background:transparent; color:var(--faint); padding:1px 5px; border-radius:5px; }
.file-row .fmove button:hover { color:var(--accent); background:var(--accent-soft); }
.file-row img.fthumb { width:40px; height:52px; object-fit:contain; background:#fff;
  border:1px solid var(--border); border-radius:5px; flex:none; }

.opts { background:var(--surface); border:1px solid var(--border); border-radius:var(--r);
  padding:18px 20px; margin:14px 0; display:flex; flex-wrap:wrap; gap:16px 26px; align-items:center; }
.opts label { display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--muted); font-weight:550; }
.opts input[type=text], .opts input[type=number], .opts input[type=password], .opts select {
  font:inherit; font-size:13.5px; padding:8px 10px; border:1px solid var(--border);
  border-radius:var(--r-sm); background:var(--bg); color:var(--ink); outline:none; }
.opts input:focus, .opts select:focus { border-color:var(--accent); }
.opts input[type=number] { width:76px; }
.opts input[type=color] { width:32px; height:32px; padding:0; border:1px solid var(--border);
  border-radius:8px; background:none; cursor:pointer; }
.opts input[type=range] { accent-color:var(--accent); }
.opts input[type=checkbox], .opts input[type=radio] { accent-color:var(--accent); width:15px; height:15px; }
.opts .seg { display:inline-flex; background:var(--bg); border:1px solid var(--border); border-radius:99px; padding:3px; }
.opts .seg button { border:none; background:transparent; color:var(--muted); font-size:13px; font-weight:600;
  padding:7px 15px; border-radius:99px; }
.opts .seg button.on { background:var(--surface); color:var(--accent); box-shadow:var(--shadow); }

.runbar { display:flex; justify-content:center; margin:22px 0 8px; }
.progress { display:none; align-items:center; gap:12px; justify-content:center; margin:14px 0;
  font-size:13.5px; color:var(--muted); }
.progress.on { display:flex; }
.spinner { width:18px; height:18px; border-radius:50%; border:2.5px solid var(--accent-soft);
  border-top-color:var(--accent); animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

.result { display:none; text-align:center; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--r); padding:30px 22px; margin:18px 0; box-shadow:var(--shadow); }
.result.on { display:block; }
.result .rok { width:52px; height:52px; margin:0 auto 12px; border-radius:50%; display:grid; place-items:center;
  background:color-mix(in srgb,var(--ok) 14%, transparent); color:var(--ok); }
.result h3 { margin:0 0 6px; font-size:18px; }
.result p { margin:0 0 18px; font-size:13.5px; color:var(--muted); }
.result .again { display:block; margin-top:14px; font-size:13px; color:var(--accent); cursor:pointer; }

/* ---- Aperçu interactif (signature, rogner, censurer, formulaires…) ---- */
.preview-wrap { position:relative; margin:16px auto; width:fit-content; max-width:100%;
  box-shadow:var(--shadow-lg); border-radius:4px; background:#fff; }
.preview-wrap canvas.pg { display:block; max-width:100%; border-radius:4px; }
.preview-wrap .ov { position:absolute; inset:0; }
.pgnav { display:flex; align-items:center; justify-content:center; gap:10px; margin:10px 0; font-size:13px; color:var(--muted); }
.pgnav button { border:1px solid var(--border); background:var(--surface); color:var(--ink);
  border-radius:8px; padding:6px 10px; display:inline-flex; }
.pgnav button:disabled { opacity:.4; }

/* ---- Grille de pages (organiser) ---- */
.pgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:12px; margin:16px 0; }
.pcard { position:relative; background:var(--surface); border:1.5px solid var(--border); border-radius:12px;
  padding:8px; cursor:grab; transition:.12s; }
.pcard:hover { border-color:var(--accent); box-shadow:var(--shadow); }
.pcard.drag { opacity:.4; }
.pcard img { width:100%; aspect-ratio:3/4; object-fit:contain; background:#fff; border-radius:6px; }
.pcard .pn { text-align:center; font-size:11.5px; color:var(--muted); margin-top:5px; font-weight:600; }
.pcard .pact { position:absolute; top:5px; right:5px; display:none; gap:3px; }
.pcard:hover .pact { display:flex; }
.pcard .pact button { width:24px; height:24px; padding:0; display:grid; place-items:center;
  border:none; border-radius:7px; background:var(--surface); color:var(--muted); box-shadow:var(--shadow); }
.pcard .pact button:hover { color:var(--accent); }
.pcard .pact button.del:hover { color:var(--danger); }
.pcard .pact svg.ic { width:13px; height:13px; }

/* ---- Passerelle publicitaire ---- */
#dlg-ad { width:min(92vw,520px); border:none; border-radius:var(--r); padding:22px;
  background:var(--surface); color:var(--ink); box-shadow:var(--shadow-lg); position:relative; }
#dlg-ad::backdrop { background:rgba(8,8,12,.55); backdrop-filter:blur(3px); }
#dlg-ad .ad-close { position:absolute; top:12px; right:12px; width:30px; height:30px; padding:0;
  border:none; background:transparent; color:var(--muted); border-radius:8px; display:flex; align-items:center; justify-content:center; }
#dlg-ad .ad-close:hover { background:var(--accent-soft); color:var(--accent); }
#dlg-ad .ad-head { display:flex; gap:12px; align-items:flex-start; margin:2px 0 16px; }
#dlg-ad .ad-mark { width:38px; height:38px; flex:none; border-radius:10px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--accent),var(--accent2)); color:#fff; }
#dlg-ad .ad-head strong { font-size:15px; }
#dlg-ad .ad-head p { margin:5px 0 0; font-size:12.5px; color:var(--muted); line-height:1.5; }
#ad-slot { min-height:250px; display:flex; align-items:center; justify-content:center;
  border:1px dashed var(--border); border-radius:var(--r-sm); background:var(--bg); overflow:hidden; margin-bottom:16px; }
#ad-slot .ad-ph { text-align:center; color:var(--muted); font-size:13px; padding:20px; }
.ad-foot { display:flex; align-items:center; justify-content:space-between; gap:12px; }
#ad-status { font-size:12.5px; color:var(--muted); }
#ad-status b { color:var(--accent); font-variant-numeric:tabular-nums; }

/* ---- Sections SEO ---- */
section.block { padding:44px 0 10px; }
.h2 { text-align:center; font-size:clamp(21px,3vw,28px); letter-spacing:-.5px; margin:0 0 26px; font-weight:760; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; counter-reset:s; }
.step { text-align:center; padding:6px; }
.step .n { counter-increment:s; width:40px; height:40px; margin:0 auto 12px; border-radius:50%;
  display:grid; place-items:center; font-weight:750; color:#fff; background:linear-gradient(135deg,var(--accent),var(--accent2)); }
.step .n::before { content:counter(s); }
.step h3 { margin:0 0 5px; font-size:15px; }
.step p { margin:0; font-size:13px; color:var(--muted); }
.privacy-note { background:var(--surface); border:1px solid var(--border); border-radius:var(--r);
  padding:26px 28px; display:flex; gap:20px; align-items:center; box-shadow:var(--shadow); }
.privacy-note .big { width:54px; height:54px; flex:none; border-radius:15px; display:grid; place-items:center;
  background:var(--accent-soft); color:var(--accent); }
.privacy-note .big svg.ic { width:26px; height:26px; }
.privacy-note h2 { margin:0 0 5px; font-size:17px; }
.privacy-note p { margin:0; color:var(--muted); font-size:13.5px; }
.faq { max-width:760px; margin:0 auto; }
.faq details { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-sm);
  padding:14px 18px; margin-bottom:10px; }
.faq summary { font-weight:620; font-size:14.5px; cursor:pointer; }
.faq details p { margin:10px 0 0; font-size:13.5px; color:var(--muted); }

/* ---- Grille d'outils ---- */
.tools-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(215px,1fr)); gap:13px; margin:8px 0 30px; }
.tcard { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:16px; transition:.14s; position:relative; }
.tcard:hover { border-color:color-mix(in srgb,var(--accent) 45%,transparent); transform:translateY(-2px); box-shadow:var(--shadow); }
.tcard .ti { width:36px; height:36px; border-radius:10px; display:grid; place-items:center;
  background:var(--accent-soft); color:var(--accent); margin-bottom:10px; }
.tcard h3 { margin:0 0 4px; font-size:14.5px; }
.tcard p { margin:0; font-size:12px; color:var(--muted); line-height:1.45; }
.tcard .new { position:absolute; top:12px; right:12px; font-size:9.5px; font-weight:750; letter-spacing:.4px;
  color:#fff; background:linear-gradient(135deg,var(--accent),var(--accent2)); border-radius:99px; padding:3px 8px; }
.hub-hero { text-align:center; padding:52px 0 26px; }
.hub-hero h1 { font-size:clamp(28px,5vw,46px); letter-spacing:-1.2px; margin:0 0 12px; font-weight:800; }
.hub-hero h1 .grad { background:linear-gradient(135deg,var(--accent),var(--accent2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hub-hero p { font-size:clamp(15px,2.2vw,18px); color:var(--muted); max-width:640px; margin:0 auto; }
.hub-note { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-top:16px; font-size:13px; color:var(--faint); }
.hub-note em { font-style:normal; display:inline-flex; align-items:center; gap:6px; }
.hub-note svg.ic { width:14px; height:14px; color:var(--accent); }

footer.site { border-top:1px solid var(--border); padding:26px 0; color:var(--faint); font-size:12.5px; margin-top:40px; }
footer.site .wrap { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:center; }
footer.site a:hover { color:var(--accent); }

#status { position:fixed; bottom:22px; left:50%; transform:translateX(-50%) translateY(6px);
  background:var(--ink); color:var(--bg); border-radius:99px; padding:9px 20px; font-size:12.5px; font-weight:500;
  opacity:0; pointer-events:none; transition:.18s; z-index:60; box-shadow:var(--shadow-lg);
  max-width:86%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#status.show { opacity:1; transform:translateX(-50%) translateY(0); }

@media (max-width:720px) { .steps { grid-template-columns:1fr; } .privacy-note { flex-direction:column; text-align:center; } }

/* ---- Scanner de documents ---- */
#scan-app { max-width:620px; margin:26px auto; padding:0 18px; text-align:center; }
.sc-step { display:flex; flex-direction:column; align-items:center; }
.sc-step[hidden] { display:none; }
.sc-hint { font-size:12.5px; color:var(--faint); max-width:420px; margin-top:16px; }
.sc-title { font-weight:700; font-size:15px; margin:0 0 10px; }
.sc-videowrap { width:100%; border-radius:var(--r); overflow:hidden; background:#000; box-shadow:var(--shadow-lg); }
.sc-videowrap video { width:100%; display:block; max-height:70vh; object-fit:cover; }
.sc-cambar { display:flex; align-items:center; justify-content:center; gap:34px; padding:18px 0 6px; width:100%; position:relative; }
#sc-shutter { width:66px; height:66px; border-radius:50%; border:4px solid var(--surface); background:linear-gradient(135deg,var(--accent),var(--accent2));
  box-shadow:0 0 0 3px var(--accent), 0 10px 26px -8px color-mix(in srgb,var(--accent) 70%,transparent); padding:0; }
#sc-shutter span { display:block; }
#sc-shutter:active { transform:scale(.93); }
.sc-round { width:46px; height:46px; border-radius:50%; border:1px solid var(--border); background:var(--surface); color:var(--muted);
  display:grid; place-items:center; padding:0; }
.sc-count { position:absolute; right:12px; font-weight:700; color:var(--accent); background:var(--accent-soft);
  min-width:30px; height:30px; border-radius:99px; display:grid; place-items:center; font-size:13px; padding:0 8px; }
.sc-count:empty { display:none; }
.sc-canvaswrap { width:100%; display:flex; justify-content:center; }
#sc-canvas, #sc-result { max-width:100%; height:auto; border-radius:10px; box-shadow:var(--shadow-lg); touch-action:none; }
.sc-actions { display:flex; gap:12px; justify-content:center; margin-top:16px; flex-wrap:wrap; }
.sc-filters { display:flex; gap:6px; justify-content:center; margin-top:14px; background:var(--surface);
  border:1px solid var(--border); border-radius:99px; padding:4px; }
.sc-filters button { border:none; background:transparent; color:var(--muted); font-size:13px; font-weight:600;
  padding:8px 14px; border-radius:99px; }
.sc-filters button.on { background:var(--accent-soft); color:var(--accent); }
.sc-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); gap:10px; width:100%; margin-bottom:16px; }
#scan-app .result, #scan-app .progress { width:100%; }

/* ---- Mobile ---- */
@media (max-width:640px) {
  header.site .wrap { height:52px; gap:6px; padding:0 12px; }
  .brand { font-size:14.5px; }
  .brand .mark { width:28px; height:28px; }
  header.site .btn.ghost { padding:8px 12px; font-size:12.5px; }
  .wrap { padding:0 14px; }
  .tool-hero { padding:26px 0 4px; }
  .tool-hero .tico { width:46px; height:46px; margin-bottom:10px; }
  #ws { padding:0 12px; margin-top:16px; }
  .dropzone { padding:34px 14px; }
  .opts { padding:13px 14px; gap:12px 16px; }
  .btn.big { width:100%; justify-content:center; }
  .runbar .btn { width:100%; }
  .steps { grid-template-columns:1fr; gap:14px; }
  .tools-grid { grid-template-columns:repeat(2,1fr); gap:9px; }
  .tcard { padding:12px; }
  .tcard h3 { font-size:13px; }
  .tcard p { font-size:10.5px; }
  .hub-hero { padding:30px 0 14px; }
  section.block { padding:30px 0 6px; }
  #dlg-ad { padding:16px; }
  footer.site .wrap { flex-direction:column; text-align:center; }
  .sc-actions .btn { flex:1; min-width:130px; }
}

/* ---- Mur anti-adblock ---- */
.ad-wall { text-align:center; padding:22px 16px; display:flex; flex-direction:column; align-items:center; gap:8px; }
.ad-wall .aw-ic { width:44px; height:44px; border-radius:12px; display:grid; place-items:center;
  background:color-mix(in srgb,var(--danger) 12%, transparent); color:var(--danger); }
.ad-wall strong { font-size:15px; }
.ad-wall p { margin:0; font-size:12.5px; color:var(--muted); max-width:340px; line-height:1.5; }
.ad-wall .aw-hint { font-size:11.5px; color:var(--faint); }
.ad-wall #ad-retry { margin-top:8px; }
.ad-wall .aw-bypass { margin-top:6px; font-size:11.5px; color:var(--faint); cursor:pointer; text-decoration:underline; }
.ad-wall .aw-bypass:hover { color:var(--accent); }

/* ---- Scanner : enchaîner avec un autre outil ---- */
.sc-next { margin-top:22px; width:100%; border-top:1px solid var(--border); padding-top:16px; }
.sc-next-title { display:block; font-size:12.5px; color:var(--muted); font-weight:600; margin-bottom:10px; }
.sc-next-row { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }
.sc-next-row .btn { padding:9px 14px; font-size:13px; }