/* Fauna Morocco — Donation pop-up component (2026-08-14)
   Namespaced under .fmd-ov to avoid collisions. Requires fonts.css + Font Awesome. */
.fmd-ov{--ocre:#C06A2C;--ocre-deep:#9E5220;--ink:#211E19;--muted:#8A8378;--paper:#faf6ee;--beige:#EBE1D0;--line:#E4DBCE;--sable:#f0c9a0;
  position:fixed;inset:0;z-index:100000;display:flex;overflow:auto;padding:24px;background:rgba(6,6,6,.74);backdrop-filter:blur(3px);
  font-family:'Lato',Helvetica,Arial,sans-serif;line-height:1.55}
.fmd-ov[hidden]{display:none}
.px-cover{position:fixed;inset:0;background:#0a0a0a;z-index:100001}
.fmd-ov *{box-sizing:border-box}
.fmd-wrap{margin:auto;width:100%;max-width:1020px;display:flex;flex-direction:column;align-items:center;gap:14px}
.fmd-close{position:fixed;top:18px;right:22px;z-index:5;width:38px;height:38px;padding:0;border:none;background:none;cursor:pointer;line-height:0;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45))}
.fmd-modal{position:relative;width:100%;border-radius:20px;overflow:hidden;background:#0d0d0d;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.fmd-modal>.fmd-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%}
.fmd-modal>.fmd-scrim{position:absolute;inset:0;background:linear-gradient(to top right,rgba(0,0,0,.85),rgba(0,0,0,.28) 32%,rgba(0,0,0,0) 58%),linear-gradient(90deg,rgba(0,0,0,.34),rgba(0,0,0,.12) 55%,rgba(0,0,0,.5))}
.fmd-inner{position:relative;display:grid;grid-template-columns:1.35fr .82fr;min-height:560px}

/* colonne récit */
.fmd-story{padding:48px 34px 40px 44px;display:flex;flex-direction:column;color:#F4EFE6}
.fmd-story>*{max-width:440px}
.fmd-eyebrow{font-family:'Lato';font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:var(--sable)}
.fmd-story h2{font-family:'Oswald',sans-serif;font-weight:700;color:#fff;font-size:2.3rem;line-height:1.05;text-transform:uppercase;margin:0 0 6px;text-shadow:0 2px 18px rgba(0,0,0,.55)}
.fmd-lead{color:#F4EFE6;font-size:15.5px;margin:0;text-shadow:0 1px 10px rgba(0,0,0,.5)}
.fmd-lead b{color:#fff}
.fmd-lead-m{display:none}
.fmd-next{margin-top:auto;margin-bottom:26px}
.fmd-next .fmd-head{display:flex;align-items:baseline;margin-bottom:4px}
.fmd-next .fmd-eyebrow{margin:0;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.fmd-next .fmd-when{color:#e2d9ca;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin:0 0 0 7px;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.fmd-next .fmd-nt{font-family:'Oswald',sans-serif;font-weight:700;color:#F4EFE6;text-transform:uppercase;font-size:2rem;line-height:1;margin:0 0 10px;text-shadow:0 2px 14px rgba(0,0,0,.6)}
.fmd-next .fmd-nd{margin:0 0 18px;color:#f4efe6;font-size:15.5px;line-height:1.5;text-shadow:0 1px 10px rgba(0,0,0,.6)}
.fmd-next .fmd-nd b{color:#fff}
.fmd-next .fmd-nd .fmd-hl{color:var(--ocre)}
.fmd-track{height:8px;border-radius:999px;background:rgba(255,255,255,.28);overflow:hidden;display:flex;margin-bottom:8px;box-shadow:0 1px 8px rgba(0,0,0,.4)}
.fmd-track .fmd-done{height:100%;background:#d7cfc0}
.fmd-track .fmd-nx{height:100%;background:var(--ocre);border-left:2px solid #fff}
.fmd-cap{margin-top:9px;font-size:12.5px;color:#eee4d4;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.fmd-cap b{font-family:'Oswald',sans-serif;font-weight:700;color:#fff}

/* colonne formulaire */
.fmd-formwrap{display:flex;align-items:center;padding:22px 40px 22px 12px}
.fmd-form{width:100%;background:#fff;border-radius:16px;padding:22px 20px;box-shadow:0 20px 50px rgba(0,0,0,.4)}
.fmd-rhead{display:flex;align-items:center;gap:8px;font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;color:var(--ink);font-size:1.05rem;margin-bottom:16px}
.fmd-rhead i{color:var(--ocre)}
.fmd-toggle{display:flex;background:#f2ebde;border-radius:10px;padding:4px;margin-bottom:13px}
.fmd-toggle button{position:relative;flex:1;background:none;border:none;color:#8a8378;font-family:'Lato';font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;padding:9px;border-radius:7px;cursor:pointer}
.fmd-toggle button.on{background:var(--ocre);color:#fff}
.fmd-mtag{position:absolute;top:-9px;left:50%;transform:translateX(-50%);white-space:nowrap;background:var(--ocre);color:#fff;font-weight:700;font-size:8.5px;letter-spacing:.03em;text-transform:uppercase;padding:2px 8px;border-radius:999px;display:inline-flex;align-items:center;gap:4px;box-shadow:0 2px 8px rgba(0,0,0,.22)}
.fmd-mtag i{font-size:8px;color:#fff}
.fmd-impact{display:flex;align-items:center;gap:9px;margin:0 0 12px;padding:9px 13px;background:var(--beige);border-radius:999px;color:var(--ocre-deep);font-size:12.5px;font-weight:700}
.fmd-impact i{color:var(--ocre);font-size:14px}
.fmd-amts{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:10px}
.fmd-amts button{position:relative;background:#fff;border:1.5px solid var(--line);border-radius:10px;color:var(--ink);font-family:'Oswald',sans-serif;font-weight:600;font-size:1.05rem;padding:12px 4px;cursor:pointer;transition:.15s}
.fmd-amts button:hover{border-color:var(--ocre)}
.fmd-amts button.on{border-color:var(--ocre);background:rgba(192,106,44,.1);color:var(--ocre-deep)}
.fmd-oth{display:flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--line);border-radius:10px;padding:0 13px;margin-bottom:12px}
.fmd-oth input{flex:1;background:none;border:none;color:var(--ink);font-family:'Oswald',sans-serif;font-weight:600;font-size:1rem;padding:12px 0;outline:none;min-width:0}
.fmd-oth input::placeholder{color:var(--muted);font-family:'Lato';font-weight:400;font-size:12.5px}
.fmd-oth .fmd-cur{color:var(--muted);font-size:12.5px;font-weight:700}
.fmd-btn{display:block;width:100%;text-align:center;text-decoration:none;box-sizing:border-box;background:var(--ocre);color:#fff;border:none;font-family:'Lato';font-weight:700;font-size:15px;padding:14px;border-radius:11px;cursor:pointer;margin-bottom:9px}
.fmd-btn:hover{background:var(--ocre-deep)}
.fmd-secure{display:flex;align-items:center;justify-content:center;gap:8px;color:var(--muted);font-size:10.5px}
.fmd-secure .fmd-meth{display:flex;align-items:center;gap:7px;font-size:17px;color:#b3a894}
.fmd-twint{height:9px;width:auto;vertical-align:middle;color:inherit}
.fmd-trust{text-align:center;color:var(--muted);font-size:10.5px;margin-top:7px}
.fmd-faq{width:100%;margin:0 auto;text-align:center;position:relative}
.fmd-faq-row{display:flex;flex-wrap:nowrap;justify-content:center;gap:22px;width:fit-content;max-width:100%;margin:0 auto}
.fmd-q{white-space:nowrap;background:none;border:none;cursor:pointer;color:rgba(245,239,230,.6);font-family:'Lato';font-size:12px;padding:0;border-bottom:1px solid transparent;text-decoration:none}
.fmd-q:hover{color:#fff;border-color:rgba(255,255,255,.4)}
.fmd-q.on{color:#fff;border-color:var(--sable)}
.fmd-faq-ans{position:absolute;left:0;right:0;top:100%;margin:12px auto 0;max-width:100%;text-align:left;color:rgba(245,239,230,.82);font-size:12.5px;line-height:1.55;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.fmd-faq-ans[hidden]{display:none}
@media(max-width:640px){.fmd-faq-row{flex-wrap:wrap;gap:8px 16px}.fmd-q{white-space:normal}}

/* paiement Payrexx intégré (iframe) */
.fmd-pay{display:none}
.fmd-form.paying .fmd-select{display:none}
.fmd-form.paying .fmd-pay{display:block}
.fmd-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;font-size:13px;color:var(--ink)}
.fmd-summary b{font-family:'Oswald',sans-serif;font-weight:700}
.fmd-back{background:none;border:none;color:var(--ocre);font-family:'Lato';font-weight:700;font-size:12px;cursor:pointer;padding:2px 4px}
.fmd-back:hover{color:var(--ocre-deep)}
.fmd-frame{width:100%;height:540px;border:0;border-radius:10px;background:#fff;display:block}

/* ===== MOBILE — piste A : bulle arrondie (photo en haut + formulaire, comme desktop, empilé) ===== */
@media(max-width:720px){
  .fmd-ov{padding:16px}
  .fmd-wrap{margin:auto;max-width:430px;gap:14px}
  .fmd-modal{border-radius:20px}
  .fmd-inner{grid-template-columns:1fr;min-height:0}
  .fmd-modal>.fmd-bg{inset:0 0 auto 0;height:330px;object-position:50% 55%}
  .fmd-modal>.fmd-scrim{inset:0 0 auto 0;height:330px;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.1) 34%,rgba(0,0,0,.5) 60%,rgba(0,0,0,.88))}
  .fmd-story{min-height:330px;padding:26px 20px 20px}
  .fmd-story h2{font-size:clamp(1.45rem,6.6vw,1.85rem);white-space:nowrap;letter-spacing:-.01em;line-height:1;margin-bottom:0}
  .fmd-lead{display:none}
  .fmd-lead-m{display:block;color:#f0e8da;font-weight:400;font-size:13.5px;line-height:1.5;margin:9px 0 0;text-shadow:0 1px 10px rgba(0,0,0,.7)}
  .fmd-next{margin-top:auto;margin-bottom:0}
  .fmd-next .fmd-head{margin-bottom:8px}
  .fmd-next .fmd-nt{font-size:1.4rem;margin:0 0 8px}
  .fmd-next .fmd-nd{font-size:13.5px;color:#f0e8da;line-height:1.55}
  .fmd-track,.fmd-cap{display:none}
  .fmd-formwrap{display:block;background:#fff;padding:20px 18px 22px}
  .fmd-form{margin:0;border-radius:0;padding:0;box-shadow:none;background:transparent}
  .fmd-faq{padding:4px 4px 2px;background:transparent;max-width:none}
  .fmd-faq-ans{position:static}
  .fmd-close{top:26px;right:26px;width:38px;height:38px}
}