/* =========================================================
   SAD V22 — Mobile finishing and readability pass
   Cible : iPhone/Android 360–430px, petits écrans, tablette, desktop resize.
   Cette couche vient après V21 et ne supprime aucun contenu.
   ========================================================= */
:root{
  --sad-readable-max: 68ch;
  --sad-mobile-bottom-safe: calc(104px + env(safe-area-inset-bottom));
}
html{scroll-behavior:smooth}
body{font-kerning:normal;text-rendering:optimizeLegibility}
p,li,.lead,.muted,.notice,.warning,.callout{max-width:var(--sad-readable-max)}
.card p,.human p,.notice p,.warning p,.callout p,.photo-card p,.support-mode p,.final-donation-card p,.continuity-card p{max-width:none}
.navlinks a,.btn{-webkit-tap-highlight-color:rgba(129,83,51,.14)}
.btn:focus-visible,.navlinks a:focus-visible,.nav-toggle:focus-visible{outline:3px solid rgba(129,83,51,.38);outline-offset:3px}
@media (max-width:1024px){
  .hero-grid{align-items:start}
  .hero .card{max-width:760px;margin-inline:auto}
  .path-grid,.signal-grid,.gift-grid,.support-modes{align-items:stretch}
  .cta-strip,.conversion-nudge{align-items:start}
}
@media (min-width:681px) and (max-width:1024px){
  :root{--rt-space-x:clamp(20px,4vw,34px)}
  header .wrap nav{gap:12px}
  .brand img{height:50px !important;max-width:min(390px,46vw) !important}
  .navlinks a{font-size:.88rem;padding-inline:8px}
  .hero{padding:52px 0 44px}
  .hero-visual img{max-height:360px}
  .micro-don-row{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
  .sticky-support{width:min(900px,calc(100% - 32px));border-radius:26px}
}
@media (max-width:820px){
  :root{--rt-space-x:clamp(12px,4vw,16px)}
  html{font-size:16px;scroll-padding-top:88px}
  body{line-height:1.58;padding-bottom:var(--sad-mobile-bottom-safe)}
  p,li,.lead,.muted,.notice,.warning,.row,.doccap,.sharebox{overflow-wrap:break-word;word-break:normal;hyphens:auto}
  h1,h2,h3,h4,.brand,.pill,.tag,.amount,.btn,.navlinks a{overflow-wrap:normal;hyphens:none}
  .topbar{padding:6px 0;font-size:.76rem;line-height:1.28;text-align:center}
  .topbar .wrap{width:min(100% - 24px,680px) !important}
  header{position:sticky !important;top:0;z-index:120;padding:8px 0;box-shadow:0 10px 28px rgba(36,29,24,.08)}
  header .wrap nav{gap:8px}
  .brand img{height:40px !important;max-width:min(238px,68vw) !important;border-radius:8px}
  .nav-toggle{min-width:42px;min-height:42px;padding:0 12px;background:#fffdf9}
  body.nav-open{overflow:hidden}
  body.nav-open .navlinks{max-height:calc(100vh - 96px);overflow:auto;overscroll-behavior:contain}
  .navlinks a{min-height:46px;padding:11px 12px;border-radius:16px;font-size:.94rem;box-shadow:0 6px 18px rgba(31,42,48,.04)}
  .navlinks a[href*="contribuer"]{font-size:.96rem}
  .hero{padding:30px 0 32px}
  .hero-grid{gap:16px}
  .hero .badge{font-size:.78rem;line-height:1.25;margin-bottom:12px;padding:6px 10px}
  .hero-logo{margin-bottom:12px}.hero-logo img{width:86px !important;max-width:32% !important;border-radius:12px}
  h1{font-size:clamp(1.95rem,8.8vw,2.7rem) !important;line-height:1.075 !important;letter-spacing:-.045em;margin-bottom:14px}
  h2{font-size:clamp(1.46rem,6.4vw,2rem) !important;line-height:1.12 !important;letter-spacing:-.035em;margin-bottom:14px}
  h3{font-size:1.08rem;line-height:1.26}
  .lead{font-size:1rem !important;line-height:1.58;margin-bottom:14px}
  section{padding:38px 0}.soft{background:rgba(255,255,255,.52)}
  .card,.human,.notice,.warning,.callout,.final-donation-card,.continuity-card,.tension-box,.support-mode,.path-step,.signal,.gift-card{padding:16px;border-radius:20px}
  .notice,.warning{line-height:1.5}
  .brand-stamp{display:flex;width:100%;border-radius:17px;padding:7px 10px;gap:8px;margin-bottom:12px}
  .brand-stamp img{height:22px;max-width:112px}.brand-stamp span{font-size:.76rem;line-height:1.15}
  .hook-line{font-size:.95rem;line-height:1.48;padding:12px;border-radius:18px}
  .hero-proof .lead{font-size:.96rem !important;line-height:1.55}
  .amount{font-size:1.82rem !important;line-height:1.05}.meter{height:11px;margin:10px 0}
  .micro-don-row{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:8px !important}.micro-don-row div{padding:10px 8px;border-radius:15px}.micro-don-row strong{font-size:.98rem}.micro-don-row span{font-size:.78rem}
  .grid-2,.grid-3,.grid-4,.kpi,.flow,.path-grid,.signal-grid,.diagram-grid-2x2,.photo-grid,.gift-grid,.support-modes,.amount-pills,.final-checklist,.grid-2-illus{gap:12px !important}
  .path-step .num,.num{width:31px;height:31px;margin-bottom:8px}
  .cta-row{gap:8px;margin-top:16px}.btn{min-height:44px;padding:12px 13px;border-radius:16px;font-size:.96rem;line-height:1.18}.btn.primary{border-radius:999px}
  .hero-visual{padding:6px;border-radius:19px}.hero-visual img{max-height:225px;object-fit:cover;object-position:center}.illus-wide{border-radius:20px}.side-visual,.photo-card,.diagram-card,.piece-card,.thumb-card{border-radius:20px}
  .photo-card img{max-height:210px;object-fit:cover}.diagram-card{padding:12px}.diagram-card img{border-radius:15px}
  .row{padding:10px 0}.row strong{font-size:.84rem;color:#6b5240}.tablelike{gap:0}
  .cta-strip,.conversion-nudge{padding:16px;border-radius:20px;gap:12px}.cta-strip .cta-row,.conversion-nudge .cta-row{width:100%}
  .callout{padding:20px}.callout .logo-lockup img{width:160px;max-width:70%}.callout .illus-wide{margin:14px 0 16px !important}.callout .muted{line-height:1.56}
  .sharebox{min-height:150px;font-size:.94rem;line-height:1.5;border-radius:16px}
  .pieces-frame{padding:8px}.pieces-frame .thumb img,.piece-thumb img{max-height:64vh}
  .lightbox{padding:10px}.lightbox img{max-width:96vw;max-height:78vh}.lightbox .caption{font-size:.78rem;line-height:1.25}.lightbox .close{min-width:44px;min-height:44px}
  .sticky-support{position:fixed !important;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));width:auto !important;margin:0 !important;border-radius:22px;padding:8px;z-index:180;display:grid !important;grid-template-columns:1fr;gap:7px;box-shadow:0 20px 60px rgba(36,29,24,.22);background:rgba(255,253,250,.97)}
  .sticky-support span{font-size:.78rem;line-height:1.2;padding:0;text-align:center}.sticky-support .cta-row{display:grid !important;grid-template-columns:1fr 1fr;gap:8px !important;width:100%;margin:0}.sticky-support .btn{width:100%;min-height:40px;padding:9px 6px;font-size:.82rem;border-radius:14px}.sticky-support .btn.primary{border-radius:999px}.sticky-support .btn.secondary{background:#fff7ed;color:#5b3b10}
  footer{padding-bottom:calc(var(--sad-mobile-bottom-safe) + 22px)}.footer-brand{gap:8px}.footer-brand img{width:min(190px,70vw)}
}
@media (max-width:430px){
  body{line-height:1.56}
  .brand img{height:38px !important;max-width:min(224px,66vw) !important}
  h1{font-size:clamp(1.84rem,8.5vw,2.36rem) !important}.hero{padding-top:26px}.hero-logo img{width:76px !important}.brand-stamp span{font-size:.72rem}.hook-line{font-size:.92rem}
  .photo-card img,.hero-visual img{max-height:205px}.amount-pills{grid-template-columns:repeat(2,minmax(0,1fr)) !important}.amount-pills span{text-align:center}
}
@media (max-width:370px){
  :root{--sad-mobile-bottom-safe:calc(76px + env(safe-area-inset-bottom))}
  .topbar{font-size:.72rem}.brand img{max-width:204px !important}.nav-toggle{min-width:40px;min-height:40px}
  .sticky-support span{display:none}.sticky-support{grid-template-columns:1fr}.sticky-support .btn{font-size:.78rem;min-height:38px}.btn{font-size:.93rem}
  .micro-don-row{grid-template-columns:1fr !important}
}
@media (orientation:landscape) and (max-height:520px){
  body{padding-bottom:0}.sticky-support{position:static !important;margin:12px auto !important;width:min(100% - 24px,680px) !important}.topbar{display:none}header{position:static !important}.hero{padding:24px 0}.hero-visual img{max-height:65vh}
}