/* Rise by Hawa — charte : crème chaud, vert profond (logo), doré doux, beige rosé */
:root{
  --creme:#F7F2EA; --creme-2:#EFE7DB; --beige-rose:#F0DFD6; --blanc:#FFFDF9;
  --vert:#0E2A18; --vert-2:#1E5631; --vert-3:#E4ECE3;
  --or:#B8924A; --or-2:#9C7A38; --or-clair:#E6D3A8;
  --encre:#22271F; --doux:#5E6659; --ligne:#E2D8C8;
  --rouge:#A4452C; --rouge-bg:#F7E4DD; --vert-ok:#2F6B3F; --vert-ok-bg:#E1EEDF;
  --r:14px; --r-petit:9px;
  --ombre:0 10px 30px rgba(14,42,24,.08);
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Jost",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 80px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--creme);color:var(--encre);font-family:var(--sans);font-weight:300;font-size:1rem;line-height:1.65}
img{max-width:100%;height:auto}
a{color:var(--vert-2)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;color:var(--vert);line-height:1.15;margin:0 0 .6em}
h1{font-size:clamp(2.2rem,6vw,3.6rem)}
h2{font-size:clamp(1.75rem,4.2vw,2.5rem)}
h3{font-size:1.4rem}
p{margin:0 0 1em}
strong,b{font-weight:500}
.conteneur{width:100%;max-width:72rem;margin:0 auto;padding:0 1.25rem}
.etroit{max-width:44rem}
.section{padding:clamp(3rem,8vw,5.5rem) 0}
.section-rose{background:var(--beige-rose)}
.section-vert{background:var(--vert);color:#DCE4DA}
.section-vert h2,.section-vert h3{color:#F4EFE4}
.intro{max-width:40rem;color:var(--doux);font-size:1.06rem}
.centre{text-align:center}.centre .intro{margin-left:auto;margin-right:auto}
.muted{color:var(--doux)}
.petit{font-size:.88rem}

/* ---------- en-tête ---------- */
.entete{position:sticky;top:0;z-index:40;background:rgba(247,242,234,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--ligne);padding-top:env(safe-area-inset-top,0px);margin-top:calc(-1 * env(safe-area-inset-top,0px))}
.entete-in{max-width:72rem;margin:0 auto;padding:.6rem 1.25rem;display:flex;align-items:center;gap:1rem}
.marque{display:flex;align-items:center;gap:.65rem;text-decoration:none;color:var(--vert);font-family:var(--serif);font-size:1.35rem;font-weight:600;margin-right:auto}
.marque img{border-radius:50%;width:42px;height:42px}
.nav{display:flex;align-items:center;gap:.2rem;flex-wrap:wrap}
.nav a{color:var(--encre);text-decoration:none;padding:.45rem .7rem;border-radius:2rem;font-size:.95rem;font-weight:400;white-space:nowrap}
.nav a:hover{background:var(--creme-2)}
.nav a.actif{color:var(--vert-2);background:var(--vert-3)}
.nav a.btn{margin-left:.4rem}
.burger{display:none;background:none;border:1px solid var(--ligne);color:var(--vert);width:44px;height:44px;border-radius:50%;font-size:1.1rem;cursor:pointer}
@media (max-width:1180px){
  .burger{display:inline-flex;align-items:center;justify-content:center}
  .nav{position:absolute;left:0;right:0;top:100%;background:var(--creme);border-bottom:1px solid var(--ligne);flex-direction:column;align-items:stretch;padding:.75rem 1.25rem 1.25rem;display:none;box-shadow:var(--ombre)}
  .nav.ouvert{display:flex}
  .nav a{padding:.8rem .9rem;border-radius:var(--r-petit)}
  .nav a.btn{margin:.5rem 0 0}
}

/* onglets bas (espace, mobile) */
.onglets{display:none}
@media (max-width:760px){
  .mode-espace .onglets{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--blanc);border-top:1px solid var(--ligne);padding-bottom:env(safe-area-inset-bottom,0px)}
  .onglets a{flex:1;display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.55rem .25rem;text-decoration:none;color:var(--doux);font-size:.72rem;position:relative}
  .onglets a i{font-size:1.15rem}
  .onglets a.actif{color:var(--vert-2)}
  .onglets .pastille{position:absolute;top:.15rem;left:calc(50% + .45rem)}
  .mode-espace main{padding-bottom:calc(5rem + env(safe-area-inset-bottom,0px))}
}
.pastille{display:inline-flex;min-width:1.25rem;height:1.25rem;padding:0 .35rem;border-radius:1rem;background:var(--or);color:#fff;font-size:.7rem;font-weight:500;align-items:center;justify-content:center;font-style:normal}

/* ---------- boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--sans);font-size:.98rem;font-weight:400;line-height:1.2;padding:.8rem 1.4rem;border-radius:2rem;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:background-color .2s,color .2s,border-color .2s;min-height:44px}
.btn-or{background:var(--or);color:#fff;border-color:var(--or)}
.btn-or:hover{background:var(--or-2);border-color:var(--or-2)}
.btn-vert{background:var(--vert);color:#F4EFE4;border-color:var(--vert)}
.btn-vert:hover{background:var(--vert-2)}
.btn-ligne{background:transparent;color:var(--vert);border-color:var(--vert)}
.btn-ligne:hover{background:var(--vert);color:#F4EFE4}
.btn-danger{background:transparent;color:var(--rouge);border-color:var(--rouge)}
.btn-danger:hover{background:var(--rouge);color:#fff}
.btn-petit{padding:.5rem 1rem;font-size:.88rem;min-height:38px}
.btn-lien{background:none;border:0;color:var(--vert-2);padding:.3rem;cursor:pointer;font:inherit;text-decoration:underline}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.actions{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
:focus-visible{outline:2px solid var(--or);outline-offset:3px}

/* ---------- formulaires ---------- */
.form{display:grid;gap:1.1rem}
.form-2{display:grid;gap:1.1rem}
@media (min-width:640px){.form-2{grid-template-columns:1fr 1fr}}
.champ{display:flex;flex-direction:column;gap:.35rem}
.champ label,.label{font-size:.9rem;font-weight:400;color:var(--vert)}
.champ small{color:var(--doux);font-size:.82rem}
input[type=text],input[type=email],input[type=password],input[type=tel],input[type=url],input[type=number],input[type=search],textarea,select{
  width:100%;font:inherit;font-weight:400;color:var(--encre);background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r-petit);padding:.75rem .9rem;min-height:46px;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
textarea{min-height:130px;resize:vertical;line-height:1.55}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--or);box-shadow:0 0 0 3px rgba(184,146,74,.2)}
select{padding-right:2.6rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%231E5631' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;cursor:pointer}
.case{display:flex;align-items:flex-start;gap:.7rem;cursor:pointer;padding:.7rem .85rem;border:1px solid var(--ligne);border-radius:var(--r-petit);background:var(--blanc);transition:border-color .2s,background-color .2s}
.case:hover{border-color:var(--or-clair)}
.case input{appearance:none;-webkit-appearance:none;flex:none;width:1.25rem;height:1.25rem;margin:.15rem 0 0;border:1.5px solid var(--vert-2);border-radius:5px;background:#fff;display:grid;place-content:center;cursor:pointer}
.case input[type=radio]{border-radius:50%}
.case input::before{content:"";width:.65rem;height:.65rem;transform:scale(0);transition:transform .12s;background:var(--vert-2);border-radius:2px}
.case input[type=radio]::before{border-radius:50%}
.case input:checked::before{transform:scale(1)}
.case:has(input:checked){border-color:var(--vert-2);background:var(--vert-3)}
.case.juste{border-color:var(--vert-ok);background:var(--vert-ok-bg)}
.case.faux{border-color:var(--rouge);background:var(--rouge-bg)}
.fichier{position:relative;display:flex;align-items:center;gap:.75rem;border:1px dashed var(--or);border-radius:var(--r-petit);padding:.85rem 1rem;background:var(--blanc);cursor:pointer;color:var(--doux)}
.fichier input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.fichier i{color:var(--or);font-size:1.2rem}
.fichier:focus-within{box-shadow:0 0 0 3px rgba(184,146,74,.25)}

/* ---------- toasts / modal ---------- */
.toasts{position:fixed;z-index:80;left:50%;transform:translateX(-50%);top:calc(env(safe-area-inset-top,0px) + 76px);display:flex;flex-direction:column;gap:.5rem;width:min(92vw,28rem);pointer-events:none}
.toast{display:flex;gap:.65rem;align-items:flex-start;padding:.85rem 1rem;border-radius:var(--r-petit);background:var(--blanc);border:1px solid var(--ligne);box-shadow:var(--ombre);font-size:.95rem;pointer-events:auto;transition:opacity .4s,transform .4s}
.toast i{margin-top:.2rem}
.toast-ok i{color:var(--vert-ok)}.toast-erreur{border-color:#E6BFB2}.toast-erreur i{color:var(--rouge)}.toast-info i{color:var(--or)}
.toast.parti{opacity:0;transform:translateY(-8px)}
.modal{position:fixed;inset:0;z-index:90;background:rgba(14,42,24,.45);display:flex;align-items:center;justify-content:center;padding:1.25rem}
.modal[hidden]{display:none}
.modal-boite{background:var(--blanc);border-radius:var(--r);padding:1.5rem;width:min(100%,24rem);box-shadow:0 20px 60px rgba(0,0,0,.25)}
.modal-texte{font-family:var(--serif);font-size:1.35rem;color:var(--vert);margin:0 0 1.25rem}
.modal-actions{display:flex;gap:.6rem;justify-content:flex-end;flex-wrap:wrap}

/* ---------- blocs ---------- */
.bloc{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r);padding:clamp(1.1rem,3vw,1.75rem)}
.bloc+.bloc{margin-top:1.25rem}
.bloc-rose{background:var(--beige-rose);border-color:transparent}
.alerte{padding:.9rem 1.1rem;border-radius:var(--r-petit);background:var(--creme-2);border-left:3px solid var(--or);margin:0 0 1.25rem}
.alerte-ok{background:var(--vert-ok-bg);border-color:var(--vert-ok)}
.alerte-erreur{background:var(--rouge-bg);border-color:var(--rouge)}
.badge{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;font-weight:400;padding:.2rem .65rem;border-radius:1rem;background:var(--creme-2);color:var(--vert)}
.badge-ok{background:var(--vert-ok-bg);color:var(--vert-ok)}
.badge-attente{background:#F6EBD3;color:#80621F}
.badge-non{background:var(--rouge-bg);color:var(--rouge)}
.barre{height:8px;border-radius:8px;background:var(--creme-2);overflow:hidden}
.barre span{display:block;height:100%;background:linear-gradient(90deg,var(--vert-2),var(--or));border-radius:8px}
.grille{display:grid;gap:1.25rem}
@media (min-width:640px){.grille-2{grid-template-columns:repeat(2,1fr)}.grille-3{grid-template-columns:repeat(2,1fr)}}
@media (min-width:960px){.grille-3{grid-template-columns:repeat(3,1fr)}.grille-4{grid-template-columns:repeat(4,1fr)}}
@media (min-width:640px) and (max-width:959px){.grille-4{grid-template-columns:repeat(2,1fr)}}
.vide{text-align:center;padding:2.5rem 1rem;color:var(--doux)}
.vide i{font-size:2rem;color:var(--or);margin-bottom:.75rem;display:block}

/* ---------- accueil ---------- */
.hero{padding:clamp(3rem,9vw,6.5rem) 0 clamp(3rem,7vw,5rem);position:relative;overflow:hidden}
.hero-in{display:grid;gap:2.5rem;align-items:center}
@media (min-width:900px){.hero-in{grid-template-columns:1.15fr .85fr}}
.hero h1{font-size:clamp(2.6rem,7vw,4.6rem);font-weight:500;letter-spacing:-.01em}
.hero h1 span{display:block;font-style:italic;font-weight:400;color:var(--vert-2)}
.hero .intro{font-size:1.12rem;margin-bottom:1.75rem}
.medaillon{justify-self:center;width:min(78vw,23rem);aspect-ratio:1;border-radius:50%;position:relative}
.medaillon img{width:100%;height:100%;border-radius:50%;object-fit:cover;box-shadow:0 30px 70px rgba(14,42,24,.25)}
.medaillon::after{content:"";position:absolute;inset:-14px;border:1px solid var(--or);border-radius:50%;opacity:.55}
.axes{display:grid;gap:1px;background:var(--ligne);border:1px solid var(--ligne);border-radius:var(--r);overflow:hidden}
@media (min-width:640px){.axes{grid-template-columns:repeat(2,1fr)}}
@media (min-width:960px){.axes{grid-template-columns:repeat(4,1fr)}}
.axe{background:var(--blanc);padding:1.5rem 1.35rem}
.axe i{color:var(--or);font-size:1.35rem;margin-bottom:.8rem;display:block}
.axe h3{font-size:1.25rem;margin-bottom:.35rem}
.axe p{font-size:.93rem;color:var(--doux);margin:0}
.hawa{display:grid;gap:2rem;align-items:center}
@media (min-width:860px){.hawa{grid-template-columns:.8fr 1.2fr;gap:3.5rem}}
.hawa-photo{aspect-ratio:4/5;border-radius:200px 200px var(--r) var(--r);background:var(--creme-2) center/cover;display:flex;align-items:center;justify-content:center;color:var(--or);font-size:3rem}
.titres{display:flex;flex-wrap:wrap;gap:.45rem;margin:1rem 0 1.25rem}
.temoignage{background:var(--blanc);border-radius:var(--r);padding:1.5rem;border:1px solid var(--ligne)}
.temoignage p{font-family:var(--serif);font-size:1.25rem;line-height:1.45;color:var(--vert)}
.temoignage span{color:var(--doux);font-size:.9rem}
.etapes{display:grid;gap:1rem;counter-reset:e}
@media (min-width:760px){.etapes{grid-template-columns:repeat(3,1fr)}}
.etape{counter-increment:e;padding:1.25rem 0 0;border-top:1px solid rgba(230,211,168,.4)}
.etape::before{content:counter(e);font-family:var(--serif);font-size:2.2rem;color:var(--or-clair);display:block;line-height:1;margin-bottom:.5rem}

/* ---------- formations ---------- */
.carte-formation{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
.couv{display:flex;align-items:center;justify-content:center;aspect-ratio:16/10;background:linear-gradient(135deg,var(--vert) 0%,var(--vert-2) 100%) center/cover;color:var(--or-clair);font-size:2.4rem;text-decoration:none}
.carte-corps{padding:1.25rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.carte-corps h3{margin:0;font-size:1.35rem}
.carte-corps h3 a{color:inherit;text-decoration:none}
.carte-corps p{color:var(--doux);font-size:.94rem;margin:0;flex:1}
.carte-corps .btn{align-self:flex-start;margin-top:.5rem}
.carte-meta{display:flex;gap:1rem;flex-wrap:wrap;font-size:.88rem;color:var(--vert-2);font-weight:400}
.fiche{display:grid;gap:2rem}
@media (min-width:900px){.fiche{grid-template-columns:1fr 20rem;align-items:start}.fiche aside{position:sticky;top:6rem}}
.fiche-infos{list-style:none;margin:0 0 1.25rem;padding:0;display:grid;gap:.65rem}
.fiche-infos li{display:flex;gap:.65rem;align-items:baseline}
.fiche-infos i{color:var(--or);width:1.1rem}
.prix{font-family:var(--serif);font-size:2.2rem;color:var(--vert);line-height:1;margin:0 0 1rem}

/* plan de cours */
.plan{display:grid;gap:1rem}
.plan-module h3{font-size:1.15rem;margin:0 0 .5rem;display:flex;justify-content:space-between;gap:1rem}
.plan-lecons{list-style:none;margin:0;padding:0;border:1px solid var(--ligne);border-radius:var(--r-petit);background:var(--blanc);overflow:hidden}
.plan-lecons li+li{border-top:1px solid var(--ligne)}
.plan-lecons a,.plan-lecons span.l{display:flex;align-items:center;gap:.75rem;padding:.8rem 1rem;color:var(--encre);text-decoration:none}
.plan-lecons a:hover{background:var(--creme)}
.plan-lecons i.t{color:var(--or);width:1.1rem;text-align:center}
.plan-lecons .etat{margin-left:auto;color:var(--ligne)}
.plan-lecons .fait .etat{color:var(--vert-ok)}
.plan-lecons .courant{background:var(--vert-3)}

/* ---------- espace ---------- */
.espace{padding:clamp(1.5rem,4vw,2.5rem) 0 3rem}
.espace-titre{display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-end;justify-content:space-between;margin-bottom:1.5rem}
.espace-titre h1{font-size:clamp(1.9rem,5vw,2.6rem);margin:0}
.fil{font-size:.88rem;color:var(--doux);margin-bottom:.4rem}
.fil a{color:var(--doux)}
.cours-carte{display:flex;flex-direction:column;gap:.75rem}
.cours-carte h3{margin:0}
.stats{display:grid;gap:1rem;grid-template-columns:repeat(2,1fr)}
@media (min-width:760px){.stats{grid-template-columns:repeat(4,1fr)}}
.stat{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r);padding:1.1rem}
.stat b{display:block;font-family:var(--serif);font-size:2.1rem;color:var(--vert);font-weight:500;line-height:1.1}
.stat span{color:var(--doux);font-size:.88rem}

.lecteur{display:grid;gap:1.5rem}
@media (min-width:1000px){.lecteur{grid-template-columns:1fr 19rem;align-items:start}.lecteur aside{position:sticky;top:6rem;max-height:calc(100vh - 7rem);overflow:auto}}
.video{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#000}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
audio{width:100%;margin:.5rem 0}
.pdf-cadre{width:100%;height:75vh;border:1px solid var(--ligne);border-radius:var(--r);background:#fff}
.contenu{font-size:1.04rem;line-height:1.75}
.contenu p{max-width:68ch}
.nav-lecon{display:flex;justify-content:space-between;gap:.75rem;flex-wrap:wrap;margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid var(--ligne)}
.question{margin-bottom:1.5rem}
.question h3{font-family:var(--sans);font-weight:400;font-size:1.05rem;color:var(--encre)}
.question .cases{display:grid;gap:.5rem}

/* tables */
.tableau-wrap{overflow-x:auto;border:1px solid var(--ligne);border-radius:var(--r);background:var(--blanc)}
table{width:100%;border-collapse:collapse;font-size:.93rem}
th,td{padding:.75rem .9rem;text-align:left;border-bottom:1px solid var(--ligne);vertical-align:middle}
th{font-weight:400;color:var(--doux);background:var(--creme);white-space:nowrap}
tr:last-child td{border-bottom:0}
td .actions{gap:.4rem;flex-wrap:nowrap}

/* éditeur de cours */
.module-edit{border:1px solid var(--ligne);border-radius:var(--r);background:var(--blanc);margin-bottom:1rem;overflow:hidden}
.module-tete{display:flex;gap:.6rem;align-items:center;padding:.8rem 1rem;background:var(--creme-2);flex-wrap:wrap}
.module-tete form{display:flex;gap:.5rem;flex:1;min-width:14rem}
.module-tete input{min-height:40px;padding:.5rem .75rem}
.lecon-ligne{display:flex;align-items:center;gap:.75rem;padding:.7rem 1rem;border-top:1px solid var(--ligne);flex-wrap:wrap}
.lecon-ligne .t{color:var(--or);width:1.2rem;text-align:center}
.lecon-ligne .titre{flex:1;min-width:10rem}
.choix-ligne{display:flex;gap:.6rem;align-items:center}
.choix-ligne input[type=text]{flex:1}

/* messagerie */
.fils{display:grid;gap:1.25rem}
@media (min-width:900px){.fils{grid-template-columns:18rem 1fr}}
.fils-liste{list-style:none;margin:0;padding:0;background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r);overflow:hidden;align-self:start}
.fils-liste li+li{border-top:1px solid var(--ligne)}
.fils-liste a{display:block;padding:.85rem 1rem;color:var(--encre);text-decoration:none}
.fils-liste a.actif{background:var(--vert-3)}
.fils-liste small{display:block;color:var(--doux)}
.conversation{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r);display:flex;flex-direction:column;min-height:420px}
.bulles{flex:1;padding:1.1rem;display:flex;flex-direction:column;gap:.65rem;max-height:60vh;overflow-y:auto}
.bulle{max-width:82%;padding:.7rem .95rem;border-radius:16px 16px 16px 4px;background:var(--creme-2);align-self:flex-start;white-space:pre-wrap;word-wrap:break-word}
.bulle.moi{align-self:flex-end;background:var(--vert);color:#EEF2EC;border-radius:16px 16px 4px 16px}
.bulle small{display:block;opacity:.65;font-size:.74rem;margin-top:.25rem}
.composer{display:flex;gap:.6rem;padding:.85rem;border-top:1px solid var(--ligne)}
.composer textarea{min-height:48px;height:48px;flex:1}

/* méditations */
.medit{display:flex;gap:1rem;align-items:flex-start}
.medit .rond{flex:none;width:52px;height:52px;border-radius:50%;background:var(--vert);color:var(--or-clair);display:flex;align-items:center;justify-content:center;font-size:1.2rem}
.medit h3{font-size:1.2rem;margin:0 0 .2rem}
.filtres{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.25rem}
.filtres a{padding:.45rem .95rem;border-radius:2rem;border:1px solid var(--ligne);text-decoration:none;color:var(--encre);font-size:.9rem;background:var(--blanc)}
.filtres a.actif{background:var(--vert);border-color:var(--vert);color:#F4EFE4}

/* auth */
.auth{min-height:calc(100vh - 160px);display:flex;align-items:center;justify-content:center;padding:2.5rem 1.25rem}
.auth .bloc{width:min(100%,26rem)}
.auth h1{font-size:2.1rem;text-align:center}
.auth .logo-auth{display:block;width:84px;height:84px;border-radius:50%;margin:0 auto 1rem}

/* pied */
.pied{background:var(--vert);color:#B9C6B8;padding:3rem 0 1.25rem}
.pied-in{max-width:72rem;margin:0 auto;padding:0 1.25rem;display:grid;gap:2rem}
@media (min-width:760px){.pied-in{grid-template-columns:1.4fr 1fr auto}}
.pied-marque{font-family:var(--serif);font-size:1.6rem;color:#F4EFE4;margin-bottom:.4rem}
.pied nav{display:flex;flex-direction:column;gap:.45rem}
.pied a{color:#DCE4DA;text-decoration:none}
.pied a:hover{color:var(--or-clair)}
.reseaux{display:flex;gap:.6rem}
.reseaux a{width:42px;height:42px;border-radius:50%;border:1px solid rgba(230,211,168,.4);display:flex;align-items:center;justify-content:center}
.pied-bas{max-width:72rem;margin:2rem auto 0;padding:1.25rem 1.25rem 0;border-top:1px solid rgba(255,255,255,.1);font-size:.85rem}
.mode-espace .pied{display:none}

/* certificat (impression) */
.certif-page{background:#E9E4DA;min-height:100vh;padding:2rem 1rem;display:flex;flex-direction:column;align-items:center;gap:1rem}
.certif{width:min(100%,960px);aspect-ratio:1.414;background:var(--blanc);position:relative;padding:5% 7%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.15)}
.certif::before{content:"";position:absolute;inset:2.2%;border:1px solid var(--or)}
.certif::after{content:"";position:absolute;inset:3.2%;border:3px double var(--vert)}
.certif img{width:14%;border-radius:50%;margin-bottom:2%}
.certif .c-titre{font-family:var(--serif);font-size:clamp(1.4rem,4.2vw,2.8rem);color:var(--vert);letter-spacing:.06em;margin:0}
.certif .c-sous{color:var(--doux);font-size:clamp(.75rem,1.6vw,1rem);margin:1.5% 0 3%}
.certif .c-nom{font-family:var(--serif);font-style:italic;font-size:clamp(1.8rem,5.5vw,3.6rem);color:var(--vert-2);margin:0;border-bottom:1px solid var(--or-clair);padding:0 4% .5%}
.certif .c-form{font-family:var(--serif);font-size:clamp(1.1rem,2.8vw,1.8rem);color:var(--vert);margin:2% 0 0}
.certif .c-bas{display:flex;justify-content:space-between;width:100%;margin-top:5%;font-size:clamp(.65rem,1.3vw,.88rem);color:var(--doux);position:relative;z-index:1}
.certif .c-sig{font-family:var(--serif);font-size:clamp(1rem,2.4vw,1.5rem);color:var(--vert);font-style:italic}
@media print{
  @page{size:A4 landscape;margin:0}
  .certif-page{background:none;padding:0}
  .no-print{display:none!important}
  .certif{width:100%;box-shadow:none;height:100vh;aspect-ratio:auto}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ===================== v0.2 ===================== */
:root{--bande:#F0DFD6;--bande-clair:#F7ECE6;--pente:34px}

/* ---- En-tête en bande trapézoïdale : v1 au repos, v2 au défilement ---- */
.entete{background:transparent;border-bottom:0;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0 clamp(.5rem,2vw,1.25rem);transition:padding .45s cubic-bezier(.2,.7,.2,1)}
.entete::before{content:"";position:absolute;left:clamp(.5rem,2vw,1.25rem);right:clamp(.5rem,2vw,1.25rem);top:0;bottom:0;background:var(--bande);
  clip-path:polygon(0 0,100% 0,calc(100% - var(--pente)) 100%,var(--pente) 100%);
  transition:clip-path .5s cubic-bezier(.2,.7,.2,1),box-shadow .4s,top .45s cubic-bezier(.2,.7,.2,1);z-index:-1}
.entete-in{padding:.55rem calc(var(--pente) + 1rem);position:relative}
body.defile .entete{padding-top:10px}
body.defile .entete::before{top:10px;clip-path:polygon(var(--pente) 0,calc(100% - var(--pente)) 0,100% 100%,0 100%)}
body.defile .entete{filter:drop-shadow(0 8px 18px rgba(14,42,24,.12))}
.entete .nav a{color:var(--vert)}
.entete .nav a:hover{background:rgba(255,253,249,.45)}
.entete .nav a.actif{background:var(--creme);color:var(--vert-2)}
.entete .nav a.btn-or{background:var(--vert);border-color:var(--vert);color:#F4EFE4}
.entete .nav a.btn-or:hover{background:var(--vert-2)}
.entete .nav a.btn-ligne{border-color:var(--vert)}
.burger{border-color:rgba(14,42,24,.25);background:rgba(255,253,249,.35)}
@media (max-width:1180px){
  :root{--pente:22px}
  .entete-in{padding:.5rem calc(var(--pente) + .6rem)}
  .nav{left:clamp(.5rem,2vw,1.25rem);right:clamp(.5rem,2vw,1.25rem);top:calc(100% + 6px);background:var(--bande-clair);border:0;border-radius:var(--r)}
  .nav a.actif{background:var(--creme)}
}

/* ---- Logo qui monte et descend au-dessus d'un nuage ----
   En haut du mouvement le logo est entièrement visible ; en bas il se pose dans le nuage. */
.nuage-scene{justify-self:center;position:relative;width:min(84vw,27rem);padding:calc(1.5rem + 22%) 0 1rem}
.nuage-balance{position:relative;transform-origin:50% 80%;animation:dandine 9s ease-in-out infinite}
.nuage-scene .medaillon{width:78%;margin:0 auto;position:relative;z-index:1;animation:emerge 6.5s cubic-bezier(.45,.05,.35,1) infinite;will-change:transform}
.nuage-scene .medaillon::after{inset:-12px}
.nuage{display:block;width:118%;margin:-20% 0 0 -9%;position:relative;z-index:2;pointer-events:none;filter:drop-shadow(0 22px 30px rgba(14,42,24,.14))}
.nuage-petit{position:absolute;width:30%;opacity:.85;pointer-events:none;filter:drop-shadow(0 10px 14px rgba(14,42,24,.08))}
.nuage-petit.n1{top:4%;left:-14%;animation:derive 11s ease-in-out infinite}
.nuage-petit.n2{top:26%;right:-16%;width:22%;animation:derive 13s ease-in-out -4s infinite reverse}
@keyframes emerge{
  0%,100%{transform:translateY(0)}
  38%,62%{transform:translateY(-31%)}
}
@keyframes dandine{
  0%,100%{transform:rotate(-1deg)}
  50%{transform:rotate(1deg)}
}
@keyframes derive{0%,100%{transform:translate(0,0)}50%{transform:translate(14px,-6px)}}
@media (prefers-reduced-motion:reduce){.nuage-balance,.nuage-petit{animation:none}.nuage-scene .medaillon{animation:none;transform:translateY(-31%)}}

/* ---- Chargeur AJAX ---- */
.chargeur{position:fixed;top:0;left:0;height:3px;width:0;z-index:100;background:linear-gradient(90deg,var(--vert-2),var(--or));transition:width .3s,opacity .4s;opacity:0}
.chargeur.actif{opacity:1}
main.sortie{opacity:.55;transition:opacity .15s}
.progression-envoi{height:6px;border-radius:6px;background:var(--creme-2);overflow:hidden;margin-top:.5rem}
.progression-envoi span{display:block;height:100%;width:0;background:var(--or);transition:width .2s}

/* ---- Modes de paiement ---- */
.moyen{display:flex;align-items:center;gap:.8rem;padding:.75rem .85rem;border:1px solid var(--ligne);border-radius:var(--r-petit);background:var(--blanc);cursor:pointer;margin-bottom:.5rem;transition:border-color .2s,background-color .2s}
.moyen input{position:absolute;opacity:0;pointer-events:none}
.moyen:has(input:checked){border-color:var(--vert-2);background:var(--vert-3);box-shadow:0 0 0 1px var(--vert-2)}
.moyen:has(input:focus-visible){outline:2px solid var(--or);outline-offset:2px}
.moyen b{display:block;font-weight:500;color:var(--vert)}
.moyen small{display:block;color:var(--doux);font-size:.8rem;line-height:1.35}
.mp-logo{flex:none;width:46px;height:32px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:.85rem;color:#fff}
.mp-wave{background:#1DC8F2}
.mp-om{background:#FF7900}
.mp-visa{background:#1A1F71;font-size:1.4rem}

/* ---- Super admin ---- */
.admin-onglets{display:flex;gap:.35rem;overflow-x:auto;padding:.3rem;margin:0 0 1.75rem;background:var(--blanc);border:1px solid var(--ligne);border-radius:2rem;scrollbar-width:none}
.admin-onglets::-webkit-scrollbar{display:none}
.admin-onglets a{white-space:nowrap;padding:.5rem .95rem;border-radius:2rem;text-decoration:none;color:var(--encre);font-size:.9rem;display:inline-flex;align-items:center;gap:.4rem}
.admin-onglets a.actif{background:var(--vert);color:#F4EFE4}
.graph{display:flex;align-items:flex-end;gap:.6rem;height:170px;padding:1rem 0 0}
.graph div{flex:1;display:flex;flex-direction:column;align-items:center;gap:.35rem;height:100%;justify-content:flex-end}
.graph i{display:block;width:100%;max-width:46px;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,var(--or),var(--vert-2));min-height:3px}
.graph small{font-size:.72rem;color:var(--doux)}
.journal-ligne{display:flex;gap:.8rem;padding:.6rem 0;border-bottom:1px solid var(--ligne);font-size:.9rem}
.journal-ligne time{color:var(--doux);white-space:nowrap;font-size:.82rem;min-width:7.5rem}
.filtres-form{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.filtres-form select,.filtres-form input{max-width:14rem;min-height:40px;padding-top:.45rem;padding-bottom:.45rem}
.nuage svg,.nuage-petit svg{display:block;width:100%;height:auto}

.marque span{white-space:nowrap}
@media (min-width:1181px){.nav{flex-wrap:nowrap}.nav a{padding:.45rem .6rem;font-size:.93rem}}
@media (max-width:640px){:root{--pente:16px}}

/* ===================== v0.3 (front HTML + API) ===================== */
.spa-section{display:none}
.spa-section.active{display:block;animation:apparait .25s ease}
@keyframes apparait{from{opacity:0}to{opacity:1}}
.sq{background:linear-gradient(90deg,var(--creme-2) 25%,#F4EEE4 50%,var(--creme-2) 75%);background-size:200% 100%;animation:brille 1.2s infinite;border-radius:var(--r)}
@keyframes brille{to{background-position:-200% 0}}
.toast.toast-ok i{color:var(--vert-ok)}
.btn-petit.actif-filtre{background:var(--vert);color:#F4EFE4}
@media (prefers-reduced-motion:reduce){.spa-section.active{animation:none}.sq{animation:none}}
.hawa-photo.sans-photo{background:radial-gradient(110% 90% at 50% 30%,#1E5631,#0E2A18) center/cover}
.hawa-photo.sans-photo::after{content:"";position:absolute;inset:25%;background:url('../img/logo.webp') center/contain no-repeat;opacity:.5}
.hawa-photo{position:relative;overflow:hidden}
[hidden]{display:none!important}

/* ---- Menu : jamais d'éléments qui se chevauchent ----
   La marque ne rétrécit pas ; si les liens ne tiennent pas sur une ligne, core.js replie le menu (classe menu-replie). */
.marque{flex:none}
.nav{margin-left:auto;min-width:0}
body.mode-espace .entete-in{max-width:none}
.nav a .nav-lib-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nav a.nav-icone{padding-left:.65rem;padding-right:.65rem}
body.menu-replie .burger{display:inline-flex;align-items:center;justify-content:center}
body.menu-replie .nav{position:absolute;left:clamp(.5rem,2vw,1.25rem);right:clamp(.5rem,2vw,1.25rem);top:calc(100% + 6px);background:var(--bande-clair);border:0;border-radius:var(--r);
  flex-direction:column;align-items:stretch;padding:.75rem 1.25rem 1.25rem;display:none;box-shadow:var(--ombre);flex-wrap:nowrap}
body.menu-replie .nav.ouvert{display:flex}
body.menu-replie .nav a{padding:.8rem .9rem;border-radius:var(--r-petit);font-size:.98rem}
body.menu-replie .nav a.btn{margin:.5rem 0 0}
body.menu-replie .nav a .nav-lib-cache{position:static;width:auto;height:auto;clip:auto}
@media (max-width:1180px){.nav a .nav-lib-cache{position:static;width:auto;height:auto;clip:auto}}