/* =====================================================================
   Tuina & Qigong à Caen — feuille de styles du site public.
   Design repris du mini-site « site_php_qigong » (charte or / serif),
   porté sur les composants du moteur (topbar, header, sections,
   témoignages, formulaires, admin-bar…).
   ===================================================================== */

/* ---------- Design tokens ---------- */
:root{
  --bg:    #ffffff;
  --paper-2:#faf8f4;
  --gold:  #B5894E;
  --gold-2:#9C6F3C;
  --ink:   #494641;   /* texte principal */
  --ink2:  #6E6A64;   /* texte secondaire */
  --line:  #DEDCD8;   /* filets */
  --jade:  #5e7d62;
  --dark:  #2b2925;   /* footer / blocs sombres */

  --maxw: 1100px;
  --maxw-content: 1040px;
  --maxw-intro: 760px;

  --font-title: 'Alegreya Sans SC', Arial, sans-serif;
  --font-body:  'Raleway', Arial, sans-serif;
  --font-cn:    'Ma Shan Zheng','Alegreya Sans SC',cursive,sans-serif;
}
@supports (color: oklch(0 0 0)){
  :root{ --gold:oklch(0.64 0.085 72); --gold-2:oklch(0.56 0.09 60); --ink:oklch(0.34 0.006 60); --ink2:oklch(0.46 0.006 60); --line:oklch(0.88 0.004 60); }
}

/* ---------- Reset ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:121%}
body{background:var(--bg);color:var(--ink);font-family:var(--font-body);font-weight:300;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--font-title);font-weight:400;line-height:1.18}
.cor{font-family:var(--font-title)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.tag,.kick{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.18em;font-size:1.0625rem;font-weight:400;color:var(--gold-2)}
[data-ztxt$=".kick"]{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.18em;font-size:1.0625rem;font-weight:400;color:var(--gold-2)}
[data-ztxt$=".kick"]{text-align:center}
[data-ztxt$=".kick"] *{font:inherit;color:inherit;letter-spacing:inherit;margin:0}

/* ---------- Top bar ---------- */
.topbar{background:var(--paper-2);border-bottom:1px solid var(--line);font-size:0.8438rem;color:var(--ink2)}
.topbar .w{max-width:var(--maxw);margin:0 auto;padding:7px 24px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.topbar .l{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.08em}
.topbar .r{display:flex;align-items:center;gap:14px}
.topbar .r a{color:var(--ink2);transition:color .3s}
.topbar .r a:hover{color:var(--gold-2)}
.topbar .tb-fb{display:inline-flex;color:var(--gold-2)}

/* ---------- Header / nav ---------- */
header.site{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.1) blur(6px);border-bottom:1px solid var(--line);overflow:visible}
.nav{max-width:var(--maxw);margin:0 auto;padding:14px 24px;display:flex;align-items:center;position:relative}
.nav ul{list-style:none;display:flex;align-items:center;gap:clamp(14px,2.4vw,34px)}
.nav ul.l{justify-content:flex-end;flex:1;min-width:0;margin:0;padding-right:80px}
.nav ul.r{justify-content:flex-start;flex:1;min-width:0;margin:0;padding-left:80px}
.nav .lk{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.1em;font-size:1.125rem;font-weight:400;color:var(--ink);position:relative;padding-bottom:4px;transition:color .3s;white-space:nowrap}
.nav .lk::after{content:"";position:absolute;left:50%;right:50%;bottom:0;height:1px;background:var(--gold);transition:left .3s,right .3s}
.nav .lk:hover,.nav .lk.active{color:var(--gold-2)}
.nav .lk:hover::after,.nav .lk.active::after{left:0;right:0}
.logo-square{display:flex;flex-direction:column;align-items:center;line-height:1;padding:0;z-index:5;position:absolute;left:50%;top:6px;transform:translateX(-50%)}
.logo-gly{font-family:var(--font-cn);font-size:2.25rem;color:var(--gold);line-height:1}
.logo-img{display:block;height:125px;width:auto;margin:0 0 -55px;position:relative}
.logo-nom{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.22em;font-size:0.8125rem;color:var(--ink2);margin-top:2px}
.burger{display:none;background:none;border:0;font-size:1.625rem;color:var(--ink);cursor:pointer}
.mobile-menu{display:none}

@media(max-width:860px){
  .nav ul.l,.nav ul.r{display:none}
  .nav{display:flex;grid-template-columns:none;justify-content:space-between}
  .burger{display:block}
  .mobile-menu{display:block;max-height:0;overflow:hidden;transition:max-height .35s ease;background:var(--paper-2);border-bottom:1px solid var(--line)}
  header.site.menu-open .mobile-menu{max-height:60vh}
  .mobile-menu ul{list-style:none;padding:10px 24px}
  .mobile-menu li{padding:11px 0;border-bottom:1px solid var(--line)}
  .mobile-menu a{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.12em;font-size:1.125rem}
}

/* ---------- Boutons ---------- */
.btn{display:inline-block;font-family:var(--font-title);font-variant:small-caps;letter-spacing:.13em;font-size:1.0625rem;padding:11px 28px;border-radius:2px;border:1px solid transparent;cursor:pointer;transition:all .3s}
.btn-p,.btn-blue{background:var(--gold);color:#fff}
.btn-p:hover,.btn-blue:hover{background:var(--gold-2)}
.btn-o,.btn-o-d{background:transparent;color:var(--gold-2);border-color:var(--gold)}
.btn-o:hover,.btn-o-d:hover{background:var(--gold);color:#fff}

/* ---------- HERO accueil (bandeau vidéo masqué + portrait) ---------- */
.hero{position:relative;display:flex;flex-direction:column;align-items:center;padding:0 0 6px}
.hero .title,.hero h1{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.16em;font-weight:400;font-size:clamp(26px,4vw,48px);color:var(--gold);text-align:center;margin:clamp(18px,4vh,38px) 0 clamp(10px,2vh,18px);padding:0 16px}
.hero [data-ztxt="hero.accueil.titre"]{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.16em;font-weight:400;font-size:clamp(26px,4vw,48px);color:var(--gold);text-align:center;margin:clamp(18px,4vh,38px) 0 clamp(10px,2vh,18px);padding:0 16px;line-height:1.1}
.hero [data-ztxt="hero.accueil.titre"] h1,.hero [data-ztxt="hero.accueil.titre"] h2,.hero [data-ztxt="hero.accueil.titre"] p{font:inherit;color:inherit;margin:0;letter-spacing:inherit}
.hero .kick{display:block;text-align:center;margin-top:clamp(16px,3vh,28px)}
.ribbon-wrap{position:relative;width:100%;margin-top:clamp(6px,1.4vh,18px)}
.ribbon{
  --ribbon-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 260' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0' stop-color='black'/%3E%3Cstop offset='0.13' stop-color='white'/%3E%3Cstop offset='0.87' stop-color='white'/%3E%3Cstop offset='1' stop-color='black'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23g)' d='M0,30C480,24,660,80,800,80C940,80,1120,24,1600,30L1600,232C1120,228,980,150,800,150C620,150,480,228,0,232Z'/%3E%3C/svg%3E");
  position:relative;width:100%;height:clamp(220px,23vw,340px);overflow:hidden;
  background-image:var(--poster,none);background-size:cover;background-position:center;background-color:oklch(0.66 0.02 230);
  -webkit-mask-image:var(--ribbon-mask);mask-image:var(--ribbon-mask);
  -webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}
.ribbon video,.ribbon iframe{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;object-fit:cover;border:0;pointer-events:none}
.ribbon iframe{width:max(100%,177.78vh);height:max(100%,56.25vw);aspect-ratio:16/9;min-width:100%;min-height:100%}
.ribbon .media{position:absolute;inset:0;filter:saturate(.92)}
.yt-bg{position:absolute;inset:0}
.ribbon-poster{position:absolute;inset:0;z-index:3;background-image:var(--poster,none);background-size:cover;background-position:center;transition:opacity .8s ease;pointer-events:none}
.ribbon-poster.gone{opacity:0}
/* Poster hero responsive : sert la variante WebP adaptee au viewport (LCP mobile allege) */
@media (max-width:520px){.ribbon,.ribbon-poster{background-image:var(--poster-480,var(--poster))!important}}
@media (min-width:521px) and (max-width:880px){.ribbon,.ribbon-poster{background-image:var(--poster-768,var(--poster))!important}}
@media (min-width:1100px){.ribbon,.ribbon-poster{background-image:var(--poster-1400,var(--poster))!important}}
@media(max-width:760px){
  .ribbon{height:clamp(120px,30vw,180px)}
  .portrait{width:clamp(108px,26vw,150px);height:clamp(108px,26vw,150px);box-shadow:0 8px 22px -8px rgba(40,40,60,.45),0 0 0 4px var(--bg)}
  .hero .title,.hero h1{margin:clamp(12px,3vh,22px) 0 clamp(6px,1.5vh,12px)}
}
@media(max-width:460px){
  .ribbon{height:104px}
  .portrait{width:96px;height:96px}
}
.ribbon .media::before,.ribbon .media::after{content:"";position:absolute;inset:-20%}
.ribbon .media::before{background:radial-gradient(40% 70% at 20% 40%, oklch(0.78 0.04 150 / .9), transparent 60%),radial-gradient(45% 80% at 60% 60%, oklch(0.72 0.06 70 / .85), transparent 62%),radial-gradient(50% 90% at 85% 45%, oklch(0.74 0.03 150 / .85), transparent 60%),linear-gradient(100deg, oklch(0.60 0.02 250), oklch(0.80 0.03 120) 40%, oklch(0.70 0.06 70) 70%, oklch(0.66 0.02 230));background-size:200% 200%;animation:flow 34s ease-in-out infinite}
.ribbon .media::after{background:radial-gradient(30% 60% at 35% 70%, oklch(0.96 0.01 120 / .6), transparent 60%),radial-gradient(26% 50% at 70% 35%, oklch(0.94 0.01 90 / .5), transparent 60%);background-size:170% 170%;mix-blend-mode:screen;animation:flow2 26s ease-in-out infinite}
@keyframes flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes flow2{0%,100%{background-position:100% 0%}50%{background-position:0% 100%}}
.portrait{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:4;width:clamp(150px,15.5vw,224px);height:clamp(150px,15.5vw,224px);border-radius:50%;overflow:hidden;background:radial-gradient(circle at 50% 38%, oklch(0.9 0.008 70), oklch(0.82 0.01 65));box-shadow:0 10px 34px -10px rgba(40,40,60,.45), 0 0 0 6px var(--bg)}
.portrait img{width:100%;height:100%;object-fit:cover}

/* ---------- Sections génériques ---------- */
section{position:relative}
.intro{text-align:center;max-width:var(--maxw-intro);margin:clamp(20px,4vh,40px) auto 0;padding:0 24px}
.intro .lead-q,.intro h2{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.06em;font-size:clamp(22px,2.6vw,32px);color:var(--ink);line-height:1.25}
.intro p{font-weight:300;font-size:clamp(16px,1.4vw,19px);color:var(--ink2);margin-top:clamp(16px,3vh,26px);line-height:1.75}
.intro .lead,.lead{font-style:italic}
.sig{display:block;margin-top:1.4rem;color:var(--gold-2);font-variant:small-caps;letter-spacing:.12em}
.intro-cta,.cta,.intro-rond{margin-top:clamp(20px,4vh,34px);display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.intro-rond{display:block}

/* Ornement */
.ornament{display:flex;align-items:center;justify-content:center;gap:16px;margin:clamp(28px,5vh,52px) auto 0;color:var(--gold);max-width:300px}
.ornament .ln{flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--line))}
.ornament .ln.r{background:linear-gradient(90deg,var(--line),transparent)}
.ornament .dot{font-size:1.125rem}

/* En-tête de section */
.h,.ps-head,.cadre .head{max-width:var(--maxw-content);margin:clamp(40px,7vh,80px) auto 0;padding:0 24px;text-align:center}
.h h2,.ps-head h2,.cadre h2{font-variant:small-caps;letter-spacing:.06em;font-size:clamp(24px,3vw,38px);color:var(--ink);margin-top:.3rem}
.h{display:flex;flex-direction:column;align-items:center;gap:.2rem}

/* ---------- Piliers / trésors (精 气 神 ou 5 piliers) ---------- */
.piliers-section,.voies,.tem,.traite,.cadre,.def,.rdv{padding-left:24px;padding-right:24px}
.ps-grid,.pillars{max-width:var(--maxw-content);margin:clamp(30px,5vh,60px) auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(28px,4vw,56px);text-align:center}
.ps-card,.pillar{display:flex;flex-direction:column;align-items:center;padding:8px}
.ps-gly,.pillar .gl,.gly{font-family:var(--font-cn);font-size:3.25rem;color:var(--gold);line-height:1.05}
.ps-nom,.pillar h3{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.1em;font-size:1.375rem;margin:12px 0 8px;color:var(--ink)}
.ps-sous,.pillar p{font-weight:300;font-size:0.9688rem;color:var(--ink2);line-height:1.7;max-width:32ch;margin:0 auto}
@media(max-width:760px){.ps-grid,.pillars{grid-template-columns:1fr;gap:40px}}

/* Grilles de cartes (voies / traités / témoignages accueil) */
.vgrid,.tr-grid,.tgrid{max-width:var(--maxw-content);margin:clamp(28px,5vh,56px) auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,34px)}
.vgrid{grid-template-columns:repeat(2,minmax(0,360px));justify-content:center;margin-bottom:100px}
@media(max-width:820px){.vgrid,.tr-grid,.tgrid{grid-template-columns:1fr}}
.vcard,.tr-card,.tcard{border:1px solid var(--line);border-radius:4px;padding:28px 24px;background:var(--bg);transition:box-shadow .3s,transform .3s;text-align:left}
.vcard{position:relative}
.vcard-img{position:absolute;top:18px;right:18px;width:84px;z-index:2}
.vcard-img .vc-img,.vcard-img .zone-img{width:84px;aspect-ratio:1/1;margin:0;overflow:hidden}
.vcard .gly{padding-right:96px}
.vcard:hover,.tr-card:hover{box-shadow:0 14px 40px -22px rgba(40,40,40,.4);transform:translateY(-3px)}
.vcard h3,.tr-card h3{font-variant:small-caps;letter-spacing:.05em;font-size:1.3125rem;margin:.4rem 0 .5rem}
.vcard p,.tr-card p{font-weight:300;color:var(--ink2);font-size:0.9688rem;line-height:1.7}
.tr-card .ic,.vcard .gly{font-size:1.875rem;color:var(--gold)}
.tr-lire,.ro{display:block;margin-top:.8rem;color:var(--gold-2);font-variant:small-caps;letter-spacing:.08em;font-size:0.9375rem}
.tcard{background:var(--paper-2)}
.tcard .qmark{font-family:var(--font-title);font-size:2.5rem;color:var(--gold);line-height:.4}
.tcard p{font-style:italic;color:var(--ink);margin:.6rem 0}
.tcard .meta{margin-top:1rem}
.tcard .soin{font-variant:small-caps;letter-spacing:.08em;color:var(--gold-2);font-size:0.875rem}
.tcard .who{color:var(--ink2);font-size:0.875rem}

/* Bloc « def » (image + texte) */
.def-in,.cadre-in,.contact-grid{max-width:var(--maxw-content);margin:clamp(40px,7vh,80px) auto 0}
.def-in{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(28px,5vw,56px);align-items:center}
@media(max-width:760px){.def-in{grid-template-columns:1fr}}
.def-in h2{font-variant:small-caps;font-size:clamp(22px,2.6vw,32px);margin-bottom:.6rem}
.def-in p{font-weight:300;color:var(--ink2);margin-bottom:.8rem}
.who{color:var(--gold-2);font-variant:small-caps;letter-spacing:.08em}

/* Cadre / engagements */
.cadre-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:var(--maxw-content);margin:clamp(24px,4vh,40px) auto 0}
@media(max-width:680px){.cadre-grid{grid-template-columns:1fr}}
.eng{display:flex;gap:16px;align-items:flex-start;border:1px solid var(--line);border-radius:4px;padding:20px}
.eng .no{font-family:var(--font-title);font-size:1.75rem;color:var(--gold);line-height:1}
.eng p{font-weight:300;color:var(--ink2);font-size:0.9688rem}
.note{max-width:var(--maxw-intro);margin:1.6rem auto 0;text-align:center;font-style:italic;color:var(--ink2);font-size:0.9062rem}

/* Bloc RDV */
.rdv{margin-top:clamp(46px,8vh,90px)}
.rdv-in{max-width:var(--maxw-content);margin:0 auto;background:var(--dark);color:#f3efe8;border-radius:6px;padding:clamp(28px,4vw,46px);display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.rdv-in h3{font-variant:small-caps;letter-spacing:.06em;font-size:1.625rem;color:#fff}
.rdv-in p{font-weight:300;color:#cfc8bb;margin-top:.4rem}
.rdv-in .num{font-family:var(--font-title);font-size:1.875rem;color:var(--gold)}

/* Bandeau infos (Où / Séances / Contact) */
.info{max-width:var(--maxw-content);margin:clamp(40px,7vh,90px) auto 0;padding:clamp(28px,4vw,44px) 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:center;gap:clamp(30px,7vw,90px);flex-wrap:wrap;text-align:center}
.info .blk .k{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.16em;font-size:0.9375rem;color:var(--gold-2)}
.info .blk .v{font-weight:300;font-size:1.0625rem;color:var(--ink);margin-top:6px;line-height:1.6}

/* ---------- Hero des pages intérieures ---------- */
.page-hero{position:relative;overflow:hidden;background:var(--paper-2);border-bottom:1px solid var(--line);padding:clamp(48px,8vh,92px) 0 clamp(46px,7vh,78px);text-align:center}
.page-hero .wrap{max-width:var(--maxw-intro)}
.page-hero h1{font-variant:small-caps;letter-spacing:.1em;font-size:clamp(28px,4vw,46px);color:var(--gold);margin:.4rem 0}
.page-hero .lead{font-weight:300;color:var(--ink2);font-size:clamp(16px,1.5vw,19px)}
.hero-img-wrap{display:flex;justify-content:center;margin-bottom:1rem}

/* Fil d'Ariane */
.breadcrumb{font-size:0.8125rem;color:var(--ink2);font-variant:small-caps;letter-spacing:.06em;margin-bottom:1rem}
.breadcrumb a{color:var(--gold-2)}
.breadcrumb .bc-cur{color:var(--ink)}
.breadcrumb-dark{margin-top:1rem}

/* ---------- Contenu éditorial / prose / pages légales ---------- */
.page,.prose,.legal{max-width:var(--maxw-intro);margin:clamp(30px,6vh,64px) auto 0;padding:0 24px}
.prose h1,.legal h1,.page h1{font-variant:small-caps;letter-spacing:.1em;font-size:clamp(26px,3.4vw,42px);color:var(--gold);text-align:center;margin-bottom:clamp(18px,4vh,36px)}
.prose h2,.legal h2,.page h2{font-variant:small-caps;letter-spacing:.06em;font-size:clamp(20px,2.4vw,28px);color:var(--ink);margin:1.6em 0 .5em}
.prose p,.legal p,.page p{font-weight:300;font-size:clamp(16px,1.3vw,18px);color:var(--ink2);margin-bottom:1em}
.prose ul,.legal ul,.page ul{margin:0 0 1em 1.4em;color:var(--ink2);font-weight:300}
.prose li,.legal li{margin-bottom:.4em}
.prose .lead,.page .lead{font-style:italic;font-size:clamp(17px,1.6vw,21px);color:var(--ink)}

/* ---------- Tableau horaires/tarifs ---------- */
.table{max-width:var(--maxw-content);margin:clamp(24px,4vh,46px) auto 0;width:calc(100% - 48px)}
.table .row{display:grid;grid-template-columns:160px 1fr auto;gap:24px;align-items:baseline;padding:18px 6px;border-bottom:1px solid var(--line)}
.table .row .day{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.1em;color:var(--gold-2);font-size:1rem}
.table .row .name{font-size:1.125rem;color:var(--ink)}
.table .row .name small{display:block;font-size:0.875rem;color:var(--ink2);font-weight:300;margin-top:2px}
.table .row .time{font-weight:300;color:var(--ink)}
@media(max-width:620px){.table .row{grid-template-columns:1fr;gap:4px}}

/* ---------- Tableau planning des cours ---------- */
.planning-wrap{padding-top:clamp(20px,3.5vh,40px)}
.planning{width:100%;max-width:760px;margin:0 auto;border-collapse:collapse;font-size:1.0625rem}
.planning thead th{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.12em;font-size:0.9375rem;color:var(--gold-2);text-align:left;font-weight:400;padding:0 16px 12px;border-bottom:2px solid var(--gold)}
.planning thead th:last-child{text-align:right}
.planning tbody td,.planning tbody th{padding:15px 16px;border-bottom:1px solid var(--line);vertical-align:middle}
.planning .pl-jour{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.08em;font-size:1.25rem;color:var(--gold);text-align:left;font-weight:400;white-space:nowrap;border-bottom:1px solid var(--line);background:var(--paper-2)}
.planning .pl-disc .pl-nom{font-size:1.0625rem;color:var(--ink)}
.planning .pl-disc small{display:block;font-size:0.8438rem;color:var(--ink2);font-weight:300;margin-top:2px}
.planning .pl-mode{display:inline-block;margin-left:8px;font-size:0.6875rem;font-variant:small-caps;letter-spacing:.06em;padding:2px 8px;border-radius:999px;vertical-align:middle}
.planning .pl-mode.presentiel{background:oklch(0.92 0.04 150);color:oklch(0.40 0.08 150)}
.planning .pl-mode.visio{background:oklch(0.92 0.03 250);color:oklch(0.42 0.09 255)}
.planning .pl-heure{text-align:right;font-weight:300;color:var(--ink);white-space:nowrap}
.planning.tarifs .pl-heure{font-weight:400;color:var(--gold-2);font-size:1.0625rem}
.tarifs-extra{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:760px;margin:28px auto 0}
.tarifs-extra .te-card{border:1px solid var(--line);border-radius:6px;padding:20px 22px;background:var(--paper-2)}
.tarifs-extra .te-t{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.08em;font-size:1.1875rem;color:var(--gold);margin-bottom:.4rem}
.tarifs-extra .te-card p{font-weight:300;color:var(--ink2);margin:0}
.tarifs-note{max-width:760px;margin:22px auto 0;font-size:0.875rem;font-style:italic;color:var(--ink2);text-align:center}
.videos-wrap{padding-top:clamp(20px,3.5vh,40px)}
.vid-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,32px);max-width:var(--maxw-content);margin:clamp(24px,4vh,40px) auto 0}
.vid figure,.vid{margin:0}
.vid-frame{position:relative;width:100%;aspect-ratio:16/9;border-radius:8px;overflow:hidden;box-shadow:0 14px 40px -20px rgba(40,40,60,.5);background:var(--paper-2)}
.vid-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid figcaption{margin-top:.7rem;text-align:center;font-family:var(--font-title);font-variant:small-caps;letter-spacing:.06em;font-size:1.0625rem;color:var(--ink2)}
.ci-perm{margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--line)}
.ci-note{margin-top:1rem;font-size:0.85rem;font-style:italic;color:var(--ink2)}
@media(max-width:680px){.vid-grid{grid-template-columns:1fr}}
@media(max-width:560px){.tarifs-extra{grid-template-columns:1fr}}
@media(max-width:560px){
  .planning{font-size:0.9688rem}
  .planning thead th,.planning tbody td,.planning tbody th{padding:11px 9px}
  .planning .pl-jour{font-size:1.0625rem}
  .planning .pl-mode{display:none}
}

/* ---------- Témoignages (liste + single) ---------- */
.tem-list{padding-top:clamp(24px,4vh,40px)}
.temoi-avert,.temoi-avert{font-size:0.8438rem;color:var(--ink2);font-style:italic;max-width:var(--maxw-intro);margin:0 auto 1.4rem;text-align:center}
.proposer{text-align:center;margin:1.2rem auto;display:flex;flex-direction:column;align-items:center;gap:.6rem}
.tem-search{display:flex;gap:10px;max-width:620px;margin:1.4rem auto;flex-wrap:wrap;justify-content:center}
.tem-search input{flex:1;min-width:220px;font-family:var(--font-body);border:1px solid var(--line);border-radius:2px;padding:11px 14px}
.tem-search input:focus{outline:none;border-color:var(--gold)}
.tem-search button{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.1em;background:var(--gold);color:#fff;border:0;border-radius:2px;padding:11px 22px;cursor:pointer}
.tem-search-reset{align-self:center;color:var(--ink2);font-size:0.8125rem}
.tem-search-info{text-align:center;color:var(--ink2);font-size:0.875rem}
.filtres{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:1.4rem auto;max-width:var(--maxw-content)}
.filtre{border:1px solid var(--line);border-radius:30px;padding:6px 16px;font-variant:small-caps;letter-spacing:.05em;font-size:0.875rem;color:var(--ink2);transition:all .3s}
.filtre:hover,.filtre.on{background:var(--gold);color:#fff;border-color:var(--gold)}
.filtre span{opacity:.7;font-size:0.75rem}
.tcards{max-width:var(--maxw-content);margin:1.6rem auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:820px){.tcards{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.tcards{grid-template-columns:1fr}}
.tc{border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--bg);display:flex;flex-direction:column;transition:box-shadow .3s,transform .3s}
.tc:hover{box-shadow:0 14px 40px -22px rgba(40,40,40,.4);transform:translateY(-3px)}
.tc-img img{width:100%;height:180px;object-fit:cover}
.tc-body{padding:20px 22px;display:flex;flex-direction:column;gap:.4rem}
.tc-type{font-variant:small-caps;letter-spacing:.06em;color:var(--gold-2);font-size:0.8125rem}
.tc-titre{font-size:1.25rem;color:var(--ink);line-height:1.25}
.tc-date{font-size:0.8125rem;color:var(--ink2)}
.tc-extrait{font-weight:300;color:var(--ink2);font-size:0.9375rem;line-height:1.6}
.tc-lire{color:var(--gold-2);font-variant:small-caps;letter-spacing:.06em;font-size:0.875rem;margin-top:.3rem}
.pagination{display:flex;gap:8px;justify-content:center;margin:2.4rem 0}
.pagination a{border:1px solid var(--line);border-radius:3px;padding:7px 13px;color:var(--ink2)}
.pagination a.on{background:var(--gold);color:#fff;border-color:var(--gold)}
.tem-single{max-width:var(--maxw-intro);padding-top:clamp(24px,5vh,48px)}
.retour{display:inline-block;margin:.6rem 0 1rem;color:var(--gold-2);font-variant:small-caps;letter-spacing:.06em}
.ts-type{margin-bottom:.4rem}
.ts-titre{font-size:clamp(26px,3.4vw,40px);color:var(--gold);font-variant:small-caps;letter-spacing:.04em}
.ts-date{color:var(--ink2);font-size:0.875rem;margin:.3rem 0 1rem}
.ts-img{margin:1.2rem 0}
.ts-img img{width:100%;border-radius:6px}
.ts-contenu{font-weight:300;color:var(--ink);font-size:1.0625rem;line-height:1.8}
.ts-contenu p{margin-bottom:1em}
.ts-foot{display:flex;gap:14px;justify-content:space-between;flex-wrap:wrap;margin-top:2.4rem;padding-top:1.4rem;border-top:1px solid var(--line)}

/* ---------- Formulaires ---------- */
.form{display:flex;flex-direction:column;gap:16px;max-width:560px;margin:0 auto}
.form label{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.08em;font-size:1rem;color:var(--ink);display:block}
.form input,.form textarea,.form select{width:100%;font-family:var(--font-body);font-size:1rem;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:2px;padding:12px 14px;margin-top:6px;transition:border-color .3s}
.form input:focus,.form textarea:focus,.form select:focus{outline:none;border-color:var(--gold)}
.form textarea{min-height:150px;resize:vertical}
.form button{align-self:flex-start}
.cf-ok{background:#eef6ee;border:1px solid #cfe3cf;color:#3c6b40;padding:16px 18px;border-radius:3px;max-width:620px;margin:0 auto}
.cf-err{background:#fbeeee;border:1px solid #e6cccc;color:#9c3b3b;padding:14px 18px;border-radius:3px;max-width:620px;margin:0 auto 1rem}
.cf-sub{color:var(--ink2);font-size:0.875rem;margin-bottom:1rem}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,56px)}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr}}
.ci-card{border:1px solid var(--line);border-radius:4px;padding:24px;margin-bottom:20px}
.ci-coord-row{display:flex;gap:30px;flex-wrap:wrap}
.ci-coord-col{flex:1;min-width:160px}
.ci-t{font-variant:small-caps;letter-spacing:.1em;color:var(--gold-2);font-size:0.9375rem;margin-bottom:.4rem}
.ci-num{font-family:var(--font-title);font-size:1.5rem;color:var(--gold)}
.ci-adr{color:var(--ink);line-height:1.6}
.ci-note{font-size:0.8125rem;color:var(--ink2);margin-top:.5rem}
.ci-itin{color:var(--gold-2);font-size:0.875rem}
.ci-map{border:1px solid var(--line);border-radius:4px;overflow:hidden;margin-bottom:20px}
.ci-map iframe{width:100%;height:260px;border:0;display:block}
.ci-map-link{display:block;text-align:center;padding:8px;font-size:0.8125rem;color:var(--gold-2);background:var(--paper-2)}
.horaires{list-style:none}
.horaires li{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-bottom:1px solid var(--line);font-weight:300;color:var(--ink)}
.ci-rappel{background:var(--paper-2);border-left:3px solid var(--gold);padding:14px 18px;font-size:0.875rem;color:var(--ink2);border-radius:0 4px 4px 0}
.contact-form h2{font-variant:small-caps;font-size:1.625rem;color:var(--ink);margin-bottom:.4rem}

/* ---------- Footer ---------- */
footer.site{background:var(--dark);color:#cfc8bb;margin-top:clamp(50px,8vh,100px);padding:clamp(34px,5vh,52px) 24px 22px;position:relative}
footer.site::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--jade),var(--gold))}
footer.site .fin{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:clamp(30px,5vw,56px)}
@media(max-width:760px){footer.site .fin{grid-template-columns:1fr;gap:26px}}
footer.site h4{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.12em;font-size:1.25rem;color:#fff;margin-bottom:.5rem}
footer.site .fin > div > p{font-size:.86rem;line-height:1.6;color:#a9a298}
footer.site .col-t{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.12em;color:var(--gold);font-size:.92rem;margin-bottom:.6rem}
footer.site ul{list-style:none}
footer.site li{padding:4px 0;font-weight:300;font-size:.9rem}
footer.site a{transition:color .25s}
footer.site a:hover{color:#fff}

/* Bandeau partenaire / crédit */
.foot-part{max-width:var(--maxw);margin:clamp(22px,3vh,32px) auto 0;padding-top:1rem;border-top:1px solid rgba(255,255,255,.10);display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.foot-part .fp-sep{flex:1}
.foot-part .fp-medinat{display:inline-flex;align-items:center;gap:.5rem;color:#b8b1a6;font-size:.82rem;font-variant:small-caps;letter-spacing:.08em}
.foot-part .fp-medinat svg{color:var(--jade)}
.foot-part .fp-medinat:hover{color:#fff}
.foot-part .fp-credit{display:inline-flex;align-items:center;gap:.6rem;color:#b8b1a6;font-family:var(--font-title);font-variant:small-caps;letter-spacing:.1em;font-size:.92rem;transition:color .25s}
.foot-part .fp-credit:hover{color:#fff}
.foot-part .fp-credit svg{display:block;flex:none}
footer.site .fb{max-width:var(--maxw);margin:1rem auto 0;font-size:.78rem;color:#8c857b;text-align:center}
footer.site .fb a{color:inherit}
footer.site .fb a:hover{color:var(--gold)}

/* ---------- Zones éditables (admin) ---------- */
.zone-img.ronde{border-radius:50%;overflow:hidden}
.zone-img.normale{border-radius:0!important}
.zone-img.ronde{border-radius:50%!important}
.zone-img.avec-bordure{box-shadow:0 0 0 6px var(--bg),0 10px 30px -12px rgba(0,0,0,.3)}
.zone-img img{width:100%;height:100%;object-fit:cover}
.ronde,.hero-img{border-radius:50%;overflow:hidden}
.hero-img{width:clamp(120px,14vw,180px);height:clamp(120px,14vw,180px)}
.intro-rond .zone-img,.pont-rond .zone-img{width:clamp(120px,14vw,170px);aspect-ratio:1/1;margin:0 auto;overflow:hidden}
/* --- Édition live des zones image : bouton toujours visible et cliquable --- */
.zone-img.is-editable{overflow:visible}
.zone-img.is-editable.ronde img,.zone-img.is-editable.ronde .zone-vide{border-radius:50%}
.zone-img.is-editable{position:relative}
.zone-img .zone-btn{position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);z-index:20;white-space:nowrap;background:var(--gold);color:#fff;border:0;border-radius:999px;padding:6px 14px;font-size:0.8125rem;font-family:var(--font-body);cursor:pointer;box-shadow:0 4px 14px -4px rgba(0,0,0,.4);opacity:.92;transition:opacity .2s,background .2s}
.zone-img .zone-btn:hover{opacity:1;background:var(--gold-2)}
.zone-vide{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:120px;background:var(--paper-2);color:var(--ink2);font-size:0.85rem;border:1px dashed var(--line)}
.hero-img-wrap .zone-img.is-editable{margin-bottom:22px}
.zone-vide{display:inline-flex;align-items:center;justify-content:center;min-height:60px;color:var(--ink2);border:1px dashed var(--line);font-size:0.8125rem;padding:8px 14px;border-radius:4px}
.sec-editable{outline:1px dashed rgba(181,137,78,.22);outline-offset:-1px}
.is-editable{cursor:pointer}

/* ---------- Admin bar ---------- */
.adminbar{position:fixed;bottom:0;left:0;right:0;z-index:9998;background:var(--dark);color:#f3efe8;display:flex;align-items:center;gap:14px;padding:8px 16px;font-size:0.8125rem;font-family:var(--font-body)}
.adminbar a,.adminbar .btn-mini{color:#f3efe8}
.ab-dot{width:9px;height:9px;border-radius:50%;background:var(--jade);display:inline-block}
.ab-hint{color:#b9b3a6}
.zpick,.zpick-box{font-family:var(--font-body)}

/* ---------- Cookie banner ---------- */
.cookie-banner[hidden]{display:none!important}
.cookie-banner{position:fixed;bottom:14px;left:14px;right:14px;max-width:560px;margin:0 auto;background:#fff;border:1px solid var(--line);box-shadow:0 14px 40px -18px rgba(0,0,0,.4);border-radius:6px;padding:16px 20px;display:flex;gap:16px;align-items:center;justify-content:space-between;z-index:9990;flex-wrap:wrap}
.cookie-banner p{font-size:0.875rem;color:var(--ink2);font-weight:300;flex:1;min-width:220px}
.cookie-banner a{color:var(--gold-2)}

/* ---------- Reveal au scroll ---------- */
/* Visible par défaut (incassable). L'animation n'est qu'un plus. */
.rv,.reveal{opacity:1;transform:none}
/* Si JS actif : on part masqué puis on révèle via .in, AVEC une animation
   CSS de secours qui rend visible toute seule même si .in n'arrive jamais. */
html.js .rv,html.js .reveal{opacity:0;transform:translateY(20px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);animation:revealSafety .01s linear 2.4s forwards}
html.js .rv.in,html.js .reveal.in{opacity:1;transform:none;animation:none}
@keyframes revealSafety{to{opacity:1;transform:none}}
.d1{transition-delay:.05s}.d2{transition-delay:.16s}.d3{transition-delay:.27s}
@media (prefers-reduced-motion:reduce){
  html.js .rv,html.js .reveal{opacity:1;transform:none;transition:none;animation:none}
  .ribbon .media::before,.ribbon .media::after{animation:none}
}

/* Divers */
.grain{display:none}
.pont-rond{display:flex;justify-content:center;margin:clamp(30px,5vh,60px) auto}

/* alternance sections */
body > section:nth-of-type(even):not(.page-hero){background:#f3ece0}
body > section{position:relative}

/* Wrapper des zones de texte editables : neutre (n'ajoute ni marge ni cadre cote visiteur) */
.zone-txt{margin:0;padding:0}
.zone-txt>*:last-child{margin-bottom:0}

/* ===== Slider (carrousel) — repris de tuinaloygue ===== */
.sl-zone{position:relative;margin:2rem auto}
.sl-track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding-bottom:.4rem}
.sl-track::-webkit-scrollbar{height:6px}
.sl-track::-webkit-scrollbar-thumb{background:#0002;border-radius:6px}
.sl-item{flex:0 0 clamp(260px,70%,640px);scroll-snap-align:center;position:relative;border-radius:12px;overflow:hidden;background:#0001}
.sl-item img{width:100%;height:clamp(220px,42vh,440px);object-fit:cover;display:block}
.sl-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;z-index:2}
.sl-nav:hover{background:rgba(0,0,0,.7)}
.sl-prev{left:8px}
.sl-next{right:8px}
.gal-link{display:block;width:100%;height:100%}


/* =====================================================================
   REFONTE 2026 — diaporamas hero pastel, accents jade, footer, espacements
   (bloc additionnel ; n'écrase rien au-dessus)
   ===================================================================== */

/* ---- Variable jade claire dérivée (accents discrets) ---- */
:root{ --jade-2:#7d9a80; --jade-soft:rgba(94,125,98,.10); }
@supports (color: oklch(0 0 0)){
  :root{ --jade:oklch(0.55 0.05 150); --jade-2:oklch(0.66 0.045 150); }
}

/* ---- Bandeaux beige : plus de respiration interne en bas ---- */
.planning-wrap,.videos-wrap{padding-bottom:clamp(34px,5vh,58px)}
.tarifs-note{margin-bottom:clamp(6px,2vh,18px)}
/* sections beige alternées : padding interne haut/bas (le texte ne touche plus le bord) */
body > section:nth-of-type(even):not(.page-hero){padding-top:clamp(30px,5vh,56px);padding-bottom:clamp(34px,6vh,64px)}

/* =====================================================================
   Diaporama d'arrière-plan des hero (pages intérieures, pas l'accueil)
   Alimenté par un slider éditable en admin : [slider:hero-xxx]
   Les images défilent en fondu ; un voile clair garde le texte lisible.
   ===================================================================== */
.page-hero .wrap{position:relative;z-index:2}
/* --hero-img-op : opacité des images (0–1) · --hero-fond : couleur d'arrière-plan
   Tous deux pilotés en admin (slider hero), jamais cuits dans les fichiers images. */
.page-hero.has-bg{background:var(--hero-fond,#ece6da)}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
/* le fond coloré occupe toute la zone, derrière les images */
.hero-bg::before{content:"";position:absolute;inset:0;z-index:0;background:var(--hero-fond,#ece6da)}
.hero-bg .hb-slide{position:absolute;inset:0;z-index:1;background-size:cover;background-position:center;opacity:0;transform:scale(1.06);transition:opacity 1.6s ease, transform 8s ease;will-change:opacity,transform;mix-blend-mode:multiply}
/* l'image visible prend l'opacité réglée (effet pastel = transparence sur le fond) */
.hero-bg .hb-slide.on{opacity:var(--hero-img-op,.55);transform:scale(1)}
@media (prefers-reduced-motion:reduce){
  .hero-bg .hb-slide{transition:opacity .4s ease;transform:none}
  .hero-bg .hb-slide.on{transform:none}
}
/* le bouton d'admin du slider hero, repositionné proprement dans le hero */
.page-hero .hero-bg-admin{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);z-index:5}

/* =====================================================================
   Accents jade discrets (animations, traits, liens)
   ===================================================================== */
/* soulignés de navigation : dégradé or → jade au survol */
.nav .lk::after{background:linear-gradient(90deg,var(--gold),var(--jade-2))}
/* ornement central : un point jade */
.ornament .dot{color:var(--jade)}
/* filets d'ornement teintés jade en leur centre */
.ornament .ln{background:linear-gradient(90deg,transparent,var(--jade-soft) 60%,var(--line))}
.ornament .ln.r{background:linear-gradient(90deg,var(--line),var(--jade-soft) 40%,transparent)}
/* liseré jade sous les titres de section H2 (prose) — trait fin animé */
.prose h2{position:relative}
.prose h2::after{content:"";display:block;width:0;height:2px;margin-top:.32em;
  background:linear-gradient(90deg,var(--jade),transparent);transition:width 1s cubic-bezier(.2,.8,.2,1)}
html.js .prose h2.in::after,.no-js .prose h2::after{width:64px}
.prose h2::after{width:64px} /* repli si pas d'observer */
/* puces de liste : marqueur jade */
.prose ul li::marker,.legal ul li::marker{color:var(--jade)}
/* citations / leads : barre latérale jade très douce */
.prose .lead{border-left:2px solid var(--jade-soft);padding-left:1rem}
/* petites pastilles d'info & cartes : survol qui révèle un trait jade */
.te-card,.tarifs-extra .te-card{position:relative;transition:box-shadow .35s,transform .35s}
.te-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--jade);opacity:0;transition:opacity .35s}
.te-card:hover{transform:translateY(-2px);box-shadow:0 14px 38px -24px rgba(40,40,40,.4)}
.te-card:hover::before{opacity:.8}
/* badge présentiel : aligné sur le jade de la charte */
.planning .pl-mode.presentiel{background:var(--jade-soft);color:var(--jade)}

/* =====================================================================
   Sous-sections de contenu réutilisables (cours indiv/collectifs,
   tuina pédiatrique, déroulement de séance, programme condensé)
   ===================================================================== */
/* duo de cartes (cours particuliers vs collectifs) */
.duo-cards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,34px);max-width:var(--maxw-content);margin:clamp(20px,3.5vh,38px) auto 0}
@media(max-width:720px){.duo-cards{grid-template-columns:1fr}}
.duo-card{border:1px solid var(--line);border-radius:8px;padding:26px 26px 28px;background:var(--bg);position:relative;overflow:hidden}
.duo-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--gold),var(--jade))}
.duo-card h3{font-variant:small-caps;letter-spacing:.05em;font-size:1.3125rem;color:var(--ink);margin-bottom:.5rem}
.duo-card .dc-gly{font-family:var(--font-cn);font-size:2rem;color:var(--jade);line-height:1;margin-bottom:.4rem}
.duo-card p{font-weight:300;color:var(--ink2);font-size:1rem;line-height:1.7;margin-bottom:.6rem}
.duo-card ul{margin:.2rem 0 0 1.2em;color:var(--ink2);font-weight:300}
.duo-card li{margin-bottom:.35em}

/* bloc déroulement (image douce + texte) */
.deroule{display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(24px,4vw,48px);align-items:center;max-width:var(--maxw-content);margin:clamp(26px,4vh,46px) auto 0}
@media(max-width:760px){.deroule{grid-template-columns:1fr}}
.deroule-steps{counter-reset:etape;list-style:none;margin:0}
.deroule-steps li{position:relative;padding-left:2.6rem;margin-bottom:1.05rem;font-weight:300;color:var(--ink2);line-height:1.65}
.deroule-steps li::before{counter-increment:etape;content:counter(etape);position:absolute;left:0;top:-2px;
  width:1.9rem;height:1.9rem;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-title);font-size:1rem;color:#fff;background:var(--jade)}
.deroule-steps li b{color:var(--ink)}

/* encart pédiatrique */
.ped-box{max-width:var(--maxw-content);margin:clamp(26px,4vh,46px) auto 0;background:var(--jade-soft);
  border:1px solid rgba(94,125,98,.18);border-radius:10px;padding:clamp(22px,3vw,34px)}
.ped-box h2{margin-top:0;color:var(--jade)}
.ped-box p{color:var(--ink2);font-weight:300}
.ped-box .ped-gly{font-family:var(--font-cn);font-size:2.4rem;color:var(--jade);line-height:1;float:right;margin:0 0 .4rem 1rem}

/* programme des cours condensé (discret) sur la page Qigong */
.cours-mini{max-width:680px;margin:clamp(24px,4vh,40px) auto 0;border:1px solid var(--line);border-radius:8px;background:var(--paper-2);overflow:hidden}
.cours-mini summary{cursor:pointer;list-style:none;padding:16px 22px;font-family:var(--font-title);font-variant:small-caps;letter-spacing:.08em;font-size:1.0625rem;color:var(--gold-2);display:flex;align-items:center;justify-content:space-between}
.cours-mini summary::-webkit-details-marker{display:none}
.cours-mini summary::after{content:"+";font-size:1.3rem;color:var(--jade);transition:transform .3s}
.cours-mini[open] summary::after{content:"−"}
.cours-mini .cm-body{padding:0 22px 20px}
.cours-mini table{width:100%;border-collapse:collapse;font-size:.97rem}
.cours-mini th,.cours-mini td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--line);font-weight:300;color:var(--ink2)}
.cours-mini th.cm-jour{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.06em;color:var(--jade);white-space:nowrap}
.cours-mini td.cm-h{text-align:right;white-space:nowrap;color:var(--ink)}
.cours-mini .cm-note{margin-top:.9rem;font-size:.84rem;font-style:italic;color:var(--ink2)}

/* =====================================================================
   Footer — refonte (plus aéré, accents jade, partenaires + crédit)
   ===================================================================== */
footer.site{background:var(--dark);color:#cfc8bb;margin-top:clamp(50px,8vh,100px);padding:clamp(48px,7vh,80px) 24px 26px;position:relative}
footer.site .fb{margin-top:1.6rem;padding-top:1.2rem}
footer.site .fb a:hover{color:var(--jade-2)}


/* =====================================================================
   PRÉSENTATION — système unifié (largeur unique, alternation, cartes nettes)
   ===================================================================== */

/* 1) Largeur unique pour tous les conteneurs de contenu */
.prose,.legal,.page{max-width:var(--maxw-content);padding:clamp(34px,5vh,56px) 24px}
.prose > p,.prose > .zone-txt,.legal > p,.page > p{max-width:74ch;margin-left:auto;margin-right:auto}

/* 2) Alternance blanc / beige propre, pilotée au niveau des sections */
body > section{background:#fff}
body > section.page-hero{background:var(--paper-2)}
body > section:nth-of-type(even):not(.page-hero){background:#f4ede1}
/* espacement interne homogène pour toutes les sections de contenu */
body > section:not(.page-hero){padding-top:clamp(36px,6vh,68px);padding-bottom:clamp(36px,6vh,68px)}

/* 3) Cartes : fond net + ombre douce, AUCUNE bordure (fin du carré-dans-carré) */
.duo-card,.tarifs-extra .te-card,.ped-box{border:0!important}
.duo-card{background:#fff;border-radius:16px;box-shadow:0 20px 46px -30px rgba(40,40,40,.4);padding:30px 30px 26px}
.duo-card::before{width:0} /* on retire le liseré qui faisait doublon */
.duo-cards{align-items:start;gap:clamp(22px,3vw,38px)}

/* encart pédiatrique : tuile jade douce, sans bord dur */
.ped-box{background:linear-gradient(180deg,#eef3ec,#e7efe6);border-radius:18px;box-shadow:0 20px 50px -34px rgba(94,125,98,.6);padding:clamp(26px,3.4vw,40px)}

/* déroulé : image + étapes, alignés haut */
.deroule{align-items:start;gap:clamp(26px,4vw,52px)}
.deroule-img .zone-img{width:100%;max-width:320px;aspect-ratio:4/5;border-radius:16px;overflow:hidden;margin:0 auto;box-shadow:0 22px 52px -32px rgba(40,40,40,.5)}
.deroule-img .zone-img.ronde{border-radius:16px!important}

/* tarifs : carte blanche posée sur le beige, planning lisible */
.tarifs-extra .te-card{background:#fff;border-radius:14px;box-shadow:0 16px 40px -30px rgba(40,40,40,.35)}
.planning{max-width:none}
.planning-wrap .planning{background:#fff;border-radius:16px;padding:10px 22px 6px;box-shadow:0 18px 46px -32px rgba(40,40,40,.4);max-width:820px;margin:0 auto}

/* 4) En-têtes de section centrés + filet jade discret */
.prose > .zone-txt[data-ztxt$=".titre"], .prose h2{position:relative}
.prose h2{text-align:left}
.prose h2::after{content:"";display:block;width:54px;height:2px;margin-top:.3em;background:linear-gradient(90deg,var(--jade),transparent)}

/* 5) Hero plus aéré, texte bien centré quelle que soit la hauteur réglée */
.page-hero .wrap{max-width:var(--maxw-intro)}
.page-hero{padding:clamp(54px,9vh,104px) 0 clamp(50px,8vh,90px)}

/* 6) Listes internes des cartes : puces jade, pas de cadre */
.duo-card ul{list-style:none;margin:.4rem 0 0;padding:0}
.duo-card li{position:relative;padding-left:1.4em;margin-bottom:.5em;line-height:1.55}
.duo-card li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--jade)}

/* 7) Responsive : piles propres */
@media(max-width:760px){.duo-cards,.deroule{grid-template-columns:1fr}.deroule-img .zone-img{max-width:260px}}

/* 8) En mode admin, on atténue les contours d'édition pour ne pas alourdir */
body.is-admin .zone-txt.is-txt-editable{outline:1px dashed rgba(94,125,98,.25);outline-offset:3px}

/* CORRECTIF alternance : on cible par classe (fiable) plutôt que nth-of-type */
body > section:nth-of-type(even):not(.page-hero){background:#fff}
body > section.prose{background:#fff}
body > section.planning-wrap,body > section.videos-wrap{background:#f4ede1}
body > section.wrap.planning-wrap{background:#f4ede1}

/* =====================================================================
   BANDES alternées (texte + image) — système de mise en page éditorial
   ===================================================================== */
.band{width:100%;padding:clamp(40px,6.5vh,80px) 24px}
.band-w{max-width:var(--maxw-content);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:center}
.band-txt{max-width:60ch}
.band-txt h2{font-variant:small-caps;letter-spacing:.05em;font-size:clamp(22px,2.6vw,32px);color:var(--ink);margin:0 0 .6rem;position:relative}
.band-txt h2::after{content:"";display:block;width:54px;height:2px;margin-top:.4rem;background:linear-gradient(90deg,var(--jade),transparent)}
.band-txt p{font-weight:300;color:var(--ink2);font-size:clamp(16px,1.25vw,18px);line-height:1.8;margin:0 0 .9rem}
.band-txt .kick{display:block;margin-bottom:.3rem;color:var(--gold-2)}
.band-img{margin:0}
.band-img .zone-img,.band-illu{width:100%;aspect-ratio:4/3;border-radius:18px;overflow:hidden;box-shadow:0 26px 56px -34px rgba(40,40,40,.55)}
.band-illu{background-size:cover;background-position:center}
/* alternance de fond */
.band:nth-of-type(odd){background:#fff}
.band.alt{background:#f4ede1}
.band.jade{background:linear-gradient(180deg,#eef3ec,#e6efe4)}
/* image à droite par défaut, à gauche quand .band.flip */
.band.flip .band-txt{order:2}
.band.flip .band-img{order:1}
/* pleine largeur (sans image) pour intro / tarifs */
.band.solo .band-w{grid-template-columns:1fr;max-width:var(--maxw-intro);text-align:center}
.band.solo .band-txt{max-width:none}
.band.solo .band-txt h2::after{margin-left:auto;margin-right:auto}
.band.solo .band-txt p{margin-left:auto;margin-right:auto;max-width:62ch}
@media(max-width:760px){
  .band-w{grid-template-columns:1fr;gap:26px}
  .band.flip .band-txt{order:1}.band.flip .band-img{order:2}
  .band-img .zone-img,.band-illu{aspect-ratio:16/10}
}
/* liste à puces jade dans les bandes */
.band-txt ul{list-style:none;margin:.2rem 0 1rem;padding:0}
.band-txt li{position:relative;padding-left:1.4em;margin-bottom:.5em;color:var(--ink2);font-weight:300;line-height:1.6}
.band-txt li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--jade)}
.band .ts-foot{justify-content:center;border:0;margin-top:1.4rem;padding:0}

/* Image de bande : illustration pastel par défaut, photo par-dessus si ajoutée */
.band-illu-wrap{position:relative;width:100%;aspect-ratio:4/3;border-radius:18px;overflow:hidden;
  background:var(--illu) center/cover no-repeat,#eef3ec;box-shadow:0 26px 56px -34px rgba(40,40,40,.55)}
.band-illu-wrap .zone-img{position:absolute;inset:0;width:100%;height:100%;border-radius:18px;margin:0}
.band-illu-wrap .zone-img.normale,.band-illu-wrap .zone-img.ronde{border-radius:18px!important}
.band-illu-wrap .zone-img img{width:100%;height:100%;object-fit:cover}
/* quand la zone est vide chez le visiteur, zone_image n'affiche rien → l'illustration reste visible */
.band-illu-wrap .zone-vide{display:none}
@media(max-width:760px){.band-illu-wrap{aspect-ratio:16/10}}

/* Page praticienne : portrait & diplômes */
.prat-portrait{width:100%;max-width:360px;margin:0 auto}
.prat-portrait .zone-img{width:100%;aspect-ratio:4/5;border-radius:18px;overflow:hidden;box-shadow:0 26px 56px -32px rgba(40,40,40,.55);margin:0}
.prat-portrait .zone-img.ronde,.prat-portrait .zone-img.normale{border-radius:18px!important}
.prat-portrait .zone-img img{width:100%;height:100%;object-fit:cover}
.diplomes{list-style:none;margin:1.4rem 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.7rem 2rem;max-width:880px;margin-left:auto;margin-right:auto}
.diplomes li{display:flex;gap:.9rem;align-items:baseline;font-weight:300;color:var(--ink2);line-height:1.5;padding-bottom:.7rem;border-bottom:1px solid var(--line)}
.diplomes .dp-an{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.04em;color:var(--jade);font-size:1.05rem;min-width:3.2em}
@media(max-width:680px){.diplomes{grid-template-columns:1fr}}

/* Diplômes : plus compact et discret */
.diplomes{gap:.2rem 2.4rem;max-width:840px;font-size:.92rem}
.diplomes li{gap:.7rem;padding:.5rem 0;line-height:1.4;font-size:.92rem}
.diplomes li::before{content:none}
.diplomes .dp-an{color:var(--jade);font-size:.92rem;min-width:3em;font-weight:400}

/* Diplômes : une seule colonne, lignes serrées, peu de retours */
.diplomes{grid-template-columns:1fr!important;gap:0!important;max-width:680px}
.diplomes li{padding:.42rem 0;line-height:1.35;align-items:baseline}
.diplomes .dp-an{min-width:3.4em;flex:none}

/* ===== Ajustements mobile : topbar + footer centrés ===== */
@media(max-width:680px){
  /* Topbar : texte centré, téléphone dessous et centré */
  .topbar .w{flex-direction:column;align-items:center;gap:4px;text-align:center}
  .topbar .l{text-align:center}
  .topbar .r{justify-content:center}

  /* Footer : tout centré, police réduite */
  footer.site{text-align:center}
  footer.site .fin{text-align:center}
  footer.site .col-t{text-align:center}
  footer.site ul{text-align:center}
  footer.site h4{font-size:1.1rem}
  footer.site .fin > div > p{font-size:.8rem}
  footer.site li{font-size:.84rem}
  .foot-part{flex-direction:column;align-items:center;gap:.6rem;text-align:center}
  .foot-part .fp-sep{display:none}
  .foot-part .fp-medinat,.foot-part .fp-credit{font-size:.8rem}
  footer.site .fb{font-size:.72rem}
}

/* =====================================================================
   Robustesse des titres éditables : le STYLE du titre est porté par la
   zone elle-même (data-ztxt). Ainsi, même si la balise <h1>/<h2> interne
   est perdue lors d'une édition, le texte garde l'aspect d'un titre.
   ===================================================================== */
/* Titres de hero (H1) */
.page-hero [data-ztxt$=".hero.titre"],
.page-hero [data-ztxt$=".hero.titre"] h1,
.page-hero [data-ztxt$=".hero.titre"] h2{
  font-family:var(--font-title);font-variant:small-caps;letter-spacing:.1em;
  font-size:clamp(28px,4vw,46px);color:var(--gold);margin:.3rem 0;line-height:1.12}
.page-hero [data-ztxt$=".hero.titre"] *{font:inherit;letter-spacing:inherit;margin:0}

/* Sous-titres / accroches (lead) */
.page-hero [data-ztxt$=".hero.lead"],
.page-hero [data-ztxt$=".hero.lead"] p{
  font-weight:300;font-style:italic;color:var(--ink2);font-size:clamp(16px,1.5vw,19px);margin:0}

/* Titres de section (H2) portés par les zones .titre dans les bandes/prose */
.band-txt [data-ztxt$=".titre"],
.band-txt [data-ztxt$=".titre"] h2,
.prose [data-ztxt$=".titre"],
.prose [data-ztxt$=".titre"] h2{
  font-family:var(--font-title);font-variant:small-caps;letter-spacing:.05em;
  font-size:clamp(22px,2.6vw,32px);color:var(--ink);line-height:1.2;margin:0 0 .5rem}
.band-txt [data-ztxt$=".titre"] *,
.prose [data-ztxt$=".titre"] *{font:inherit;letter-spacing:inherit;margin:0}
/* on garde le filet jade sous le titre, même sans <h2> interne */
.band-txt [data-ztxt$=".titre"]::after{content:"";display:block;width:54px;height:2px;margin-top:.4rem;background:linear-gradient(90deg,var(--jade),transparent)}

/* ===== Hero pages intérieures : zone plus large ===== */
.page-hero .wrap{max-width:var(--maxw-content)!important}
.page-hero .breadcrumb,.page-hero [data-ztxt$=".hero.lead"]{max-width:760px;margin-left:auto;margin-right:auto}

/* Outils admin posés sur le hero (curseur hauteur + bouton images) */
.hero-admin-tools{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);z-index:30;display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center;background:rgba(43,41,37,.82);backdrop-filter:blur(4px);padding:8px 14px;border-radius:999px;box-shadow:0 6px 20px -8px rgba(0,0,0,.5)}
.hero-admin-tools .gal-btn{background:var(--gold);color:#fff;border:0;border-radius:999px;padding:6px 14px;font-size:.8rem;font-family:var(--font-body);cursor:pointer}
.hero-admin-tools .gal-btn:hover{background:var(--gold-2)}
.hero-admin-tools .hat-h{display:inline-flex;align-items:center;gap:8px;color:#f3efe8;font-size:.8rem}
.hero-admin-tools .hat-hv{color:#fff;min-width:4.2em;display:inline-block}
.hero-admin-tools .hat-hr{width:130px}

/* ===== CORRECTIF filets de titre (éviter doublons / mauvais centrage) ===== */
/* on ne garde le filet QUE sur le <h2>, pas aussi sur la zone éditable */
.band-txt [data-ztxt$=".titre"]::after,
.prose [data-ztxt$=".titre"]::after{content:none!important}
/* le filet du h2 : centré dans les bandes solo (titre centré), à gauche sinon */
.band.solo .band-txt h2{position:relative}
.band.solo .band-txt h2::after{margin-left:auto;margin-right:auto}
.band.solo .band-txt{text-align:center}
/* dans une bande solo, titre + filet bien centrés et au-dessus du texte */
.band.solo .band-txt h2::after{width:54px}

/* ===== CORRECTIF forme ronde dans les bandes ===== */
/* si l'image de bande est ronde, on la rend vraiment circulaire */
.band-illu-wrap:has(.zone-img.ronde){border-radius:50%;aspect-ratio:1/1;background-color:transparent}
.band-illu-wrap .zone-img.ronde{border-radius:50%!important;aspect-ratio:1/1}
.band-illu-wrap .zone-img.ronde img{border-radius:50%}
/* repli pour navigateurs sans :has — la zone ronde force au moins l'image en cercle */
.band-illu-wrap .zone-img.ronde,.band-illu-wrap .zone-img.ronde img{border-radius:50%!important}


/* ===== Image de bande : le wrapper pilote forme ET taille ===== */
/* l'image remplit toujours son cadre ; la TAILLE est portée par le wrapper */
.band-illu-wrap .zone-img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;aspect-ratio:auto!important;margin:0!important;transform:none!important}
.band-illu-wrap .zone-img img{width:100%!important;height:100%!important;object-fit:cover}
/* la taille réglée (data-taille en px) fixe la largeur max du cadre */
.band-illu-wrap{margin-left:auto;margin-right:auto}
.band-illu-wrap[data-tw]{max-width:var(--tw)}
/* forme ronde : cercle parfait ; normal : rectangle arrondi */
.band-illu-wrap:has(.zone-img.ronde){border-radius:50%;aspect-ratio:1/1}
.band-illu-wrap:has(.zone-img.normale){border-radius:18px;aspect-ratio:4/3}
.band-illu-wrap .zone-img.ronde img{border-radius:50%}
.band-illu-wrap .zone-btn{bottom:8px}


/* Édition admin des vidéos (sous chaque iframe) */
.vid-admin{margin-top:.7rem;display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:rgba(94,125,98,.08);border:1px dashed rgba(94,125,98,.35);border-radius:10px;padding:10px}
.vid-admin input{flex:1;min-width:140px;font-family:var(--font-body);font-size:.85rem;border:1px solid var(--line);border-radius:6px;padding:7px 10px}
.vid-admin input:focus{outline:none;border-color:var(--jade)}
.vid-admin .va-save{background:var(--jade);color:#fff;border:0;border-radius:6px;padding:7px 14px;font-size:.82rem;cursor:pointer;white-space:nowrap}
.vid-admin .va-save:hover{background:var(--jade-2,#4d6a51)}
.vid-admin .va-status{font-size:.8rem;color:var(--jade);min-width:5em}

/* =====================================================================
   Images flottantes (décorations libres) — pose libre d'images
   semi-transparentes derrière le contenu, déplaçables + réglables en
   admin (taille / opacité). Reproduction de la fonction du site salsa.
   ===================================================================== */
.deco-layer{position:absolute;left:0;top:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:visible}
/* la couche doit couvrir TOUTE la hauteur du document : on ancre sur <body> */
body{position:relative}
.deco-item{position:absolute;transform:translate(-50%,-50%);border-radius:50%;
  background-size:cover;background-position:center}
.deco-item{--rot:0deg}
.deco-item.has-rot{background-image:none !important}
.deco-item.has-rot::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background-image:var(--bg);background-size:var(--bgsize,cover);background-position:var(--bgpos,center);background-repeat:no-repeat;
  transform:rotate(var(--rot));transform-origin:center}
/* page : le contenu reste au-dessus des décorations visiteur (z-index:1).
   On élève seulement les conteneurs de contenu, SANS toucher au header sticky
   ni aux barres admin (qui ont déjà leur propre position/z-index). */
.topbar,main,.wrap,footer.site,section{position:relative;z-index:2}
/* --- mode admin : couche au-dessus du contenu pour pouvoir saisir les items --- */
.deco-admin{z-index:30;pointer-events:none;height:100%}
.deco-admin .deco-item{pointer-events:auto;cursor:grab;
  outline:1px dashed rgba(181,137,78,.6);box-shadow:0 0 0 1px rgba(255,255,255,.4)}
.deco-admin .deco-item:hover{outline-color:var(--jade)}
.deco-admin .deco-item.dragging{cursor:grabbing;outline:1px solid var(--jade)}
.deco-admin .deco-item.sel{outline:1px solid var(--jade)}
/* mini-barre par item (admin) */
.deco-ctrl{position:absolute;top:-40px;left:50%;transform:translateX(-50%);display:none;
  gap:6px;align-items:center;white-space:nowrap;background:rgba(32,38,43,.96);
  border:1px solid rgba(181,137,78,.6);border-radius:6px;padding:5px 8px;z-index:9300;
  box-shadow:0 8px 24px rgba(0,0,0,.35)}
.deco-admin .deco-item.sel .deco-ctrl{display:flex}
.deco-ctrl .dc-lbl{color:#cbb98a;font-size:11px;letter-spacing:.04em}
.deco-ctrl input[type=range]{width:74px;accent-color:var(--gold);cursor:pointer;vertical-align:middle}
.deco-ctrl button.dc-del{background:none;border:1px solid rgba(181,137,78,.55);color:#e7c878;
  cursor:pointer;border-radius:4px;padding:3px 8px;font-size:12px;line-height:1}
.deco-ctrl button.dc-del:hover{background:var(--gold);color:#20262b}

/* bouton « + Image flottante » dans la barre admin + sa modale médiathèque */
.adminbar .ab-deco-btn{margin-left:.6rem;background:transparent;border:1px solid var(--gold);
  color:#e7c878;cursor:pointer;border-radius:5px;padding:3px 11px;font:inherit;font-size:.85rem;
  letter-spacing:.02em;transition:background .2s,color .2s}
.adminbar .ab-deco-btn:hover{background:var(--gold);color:#20262b}
.decopick{position:fixed;inset:0;z-index:9400;display:none;align-items:center;justify-content:center;
  background:rgba(20,24,26,.78);padding:2rem}
.decopick.on{display:flex}
.decopick-box{background:#fff;border-radius:12px;max-width:760px;width:100%;max-height:82vh;
  overflow:auto;box-shadow:0 24px 70px rgba(0,0,0,.45)}
.decopick-head{display:flex;align-items:center;justify-content:space-between;
  padding:1rem 1.2rem;border-bottom:1px solid var(--line,#e7e1d6)}
.decopick-head b{font-size:1.05rem}
.decopick-close{background:none;border:0;font-size:1.6rem;line-height:1;cursor:pointer;color:#888}
.decopick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:.6rem;padding:1.1rem}
.decopick-grid .mediatile{padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;
  cursor:pointer;background:#0001;aspect-ratio:1}
.decopick-grid .mediatile img{width:100%;height:100%;object-fit:cover;display:block}
.decopick-grid .mediatile:hover{border-color:var(--gold)}

/* header au-dessus des décorations sans casser son position:sticky */
header.site{z-index:50}

/* ===== Grille d'articles en cartes (4 par ligne) ===== */
.articles-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:26px;
  margin:8px 0 36px;
}
.article-card{
  display:flex;flex-direction:column;
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  text-decoration:none;color:inherit;
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  height:100%;
}
.article-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 30px -18px rgba(43,41,37,.45);
  border-color:var(--gold);
}
.article-img{
  position:relative;
  aspect-ratio:3/2;
  overflow:hidden;
  background:var(--paper-2);
}
.article-img img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transition:transform .6s ease;
}
.article-card:hover .article-img img{transform:scale(1.05)}
.article-img-vide{
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--paper-2),#f1ece3);
}
.article-img-vide .cor{
  font-family:var(--font-cn);
  font-size:2.8rem;color:var(--gold);
  opacity:.55;
}
.article-body{
  display:flex;flex-direction:column;
  flex:1 1 auto;
  padding:18px 18px 20px;
}
.article-meta{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin-bottom:10px;
}
.article-cat,.article-badge{
  font-family:var(--font-title);font-variant:small-caps;
  letter-spacing:.1em;font-size:.8125rem;
  color:var(--gold-2);
  border:1px solid var(--line);
  border-radius:999px;
  padding:2px 11px;
}
.article-badge{color:var(--jade)}
.article-date{
  font-size:.8125rem;color:var(--ink2);
  margin-left:auto;
}
.article-body h2{
  font-size:1.18rem;
  line-height:1.25;
  margin:0 0 9px;
  color:var(--ink);
}
.article-body p{
  font-size:.94rem;
  color:var(--ink2);
  margin:0 0 16px;
  line-height:1.55;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.article-lien{
  margin-top:auto;
  font-family:var(--font-title);font-variant:small-caps;
  letter-spacing:.08em;font-size:.95rem;
  color:var(--gold-2);
}
.articles-note{
  font-size:.875rem;color:var(--ink2);
  text-align:center;margin-top:8px;
}
@media (max-width:1040px){
  .articles-grid{grid-template-columns:repeat(3,1fr);gap:22px}
}
@media (max-width:760px){
  .articles-grid{grid-template-columns:repeat(2,1fr);gap:18px}
}
@media (max-width:480px){
  .articles-grid{grid-template-columns:1fr;gap:18px}
}

/* ===== Neutralisation des styles .prose hérités dans les cartes ===== */
.prose .articles-grid{max-width:none}
.prose .article-card h2{
  text-align:left;
  font-variant:normal;
  letter-spacing:0;
  font-size:1.18rem;
  color:var(--ink);
  margin:0 0 9px;
}
.prose .article-card h2::after{display:none;content:none;width:0}
.prose .article-card p{
  max-width:none;
  margin:0 0 16px;
  font-size:.94rem;
  color:var(--ink2);
  text-align:left;
}
.prose .articles-note{max-width:none}

/* Élargit la zone des cartes au-delà du conteneur prose étroit */
@media (min-width:1041px){
  section.prose .articles-grid{
    width:min(var(--maxw),100vw - 48px);
    margin-left:50%;
    transform:translateX(-50%);
  }
}

/* ===== "À lire aussi" : cartes (4 par ligne), même style que la liste ===== */
.articles-lies{margin:40px auto 12px}
.articles-lies .section-t{
  text-align:center;
  font-variant:small-caps;letter-spacing:.06em;
  color:var(--gold);
  margin-bottom:26px;
}
.lies-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:26px;
}
.lie-card{
  display:flex;flex-direction:column;
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  text-decoration:none;color:inherit;
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  height:100%;
}
.lie-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 30px -18px rgba(43,41,37,.45);
  border-color:var(--gold);
}
.lie-img{
  position:relative;
  aspect-ratio:3/2;
  overflow:hidden;
  background:var(--paper-2);
}
.lie-img img{
  width:100%;height:100%;
  object-fit:cover;display:block;
  transition:transform .6s ease;
}
.lie-card:hover .lie-img img{transform:scale(1.05)}
.lie-img-vide{
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--paper-2),#f1ece3);
}
.lie-img-vide .cor{
  font-family:var(--font-cn);
  font-size:2.8rem;color:var(--gold);opacity:.55;
}
.lie-body{
  display:flex;flex-direction:column;flex:1 1 auto;
  padding:16px 16px 18px;
}
.lie-cat{
  font-family:var(--font-title);font-variant:small-caps;
  letter-spacing:.1em;font-size:.8125rem;
  color:var(--gold-2);
  border:1px solid var(--line);
  border-radius:999px;
  padding:2px 11px;
  align-self:flex-start;
  margin-bottom:10px;
}
.lie-body h3{
  font-size:1.1rem;line-height:1.25;
  margin:0 0 8px;color:var(--ink);
}
.lie-body p{
  font-size:.9rem;color:var(--ink2);
  margin:0;line-height:1.55;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
@media (max-width:1040px){
  .lies-grid{grid-template-columns:repeat(3,1fr);gap:22px}
}
@media (max-width:760px){
  .lies-grid{grid-template-columns:repeat(2,1fr);gap:18px}
}
@media (max-width:480px){
  .lies-grid{grid-template-columns:1fr;gap:18px}
}

/* ===== En-tête d'article avec image à la une : 2 colonnes (titre / image) ===== */
.page-hero-article{text-align:left}
.page-hero-article .wrap{
  max-width:var(--maxw);
  display:grid;
  grid-template-columns:1fr minmax(220px,300px);
  align-items:center;
  gap:clamp(28px,5vw,64px);
}
.page-hero-article .hero-art-txt{min-width:0}
.page-hero-article .hero-art-txt .breadcrumb{text-align:left}
.page-hero-article .hero-art-txt .kick{display:block;text-align:left}
.page-hero-article .hero-art-txt h1{
  text-align:left;
  margin:.3rem 0;
}
.page-hero-article .hero-art-txt .lead{text-align:left}
.page-hero-article .hero-art-img{
  width:100%;
  justify-self:end;
}
.page-hero-article .hero-art-img .zone-img{
  width:100%;
  max-width:300px;
  aspect-ratio:1/1;
  margin:0 0 0 auto;
  overflow:hidden;
  box-shadow:0 22px 52px -30px rgba(40,40,40,.5);
}
.page-hero-article .hero-art-img .zone-img img{
  width:100%;height:100%;object-fit:cover;
}
@media (max-width:760px){
  .page-hero-article{text-align:center}
  .page-hero-article .wrap{
    grid-template-columns:1fr;
    gap:24px;
  }
  .page-hero-article .hero-art-txt{order:1}
  .page-hero-article .hero-art-img{order:2;justify-self:center}
  .page-hero-article .hero-art-txt .breadcrumb{text-align:center}
  .page-hero-article .hero-art-txt h1,
  .page-hero-article .hero-art-txt .kick,
  .page-hero-article .hero-art-txt .lead{text-align:center}
  .page-hero-article .hero-art-img .zone-img{
    max-width:200px;margin:0 auto;
  }
}

/* ===== HERO compact : ecritures rapprochees du creux du ruban ===== */
.hero-compact{padding-top:0}
.hero-compact .kick{margin-top:clamp(8px,1.6vh,16px);margin-bottom:clamp(-26px,-3vw,-10px)}
.hero-compact .ribbon-wrap{margin-top:0}
.hero-compact .title,.hero-compact h1{margin:clamp(-30px,-3.4vw,-12px) 0 clamp(6px,1.2vh,12px)!important}
.hero-compact .kick,.hero-compact .title,.hero-compact h1,.hero-compact [data-ztxt="hero.accueil.titre"]{position:relative;z-index:5}
/* HERO compact : version mobile sans superposition */
@media(max-width:760px){
  .hero-compact .kick{margin-top:14px!important;margin-bottom:54px!important;position:relative;z-index:6}
  .hero-compact .ribbon-wrap{margin-top:0}
  .hero-compact .title,.hero-compact h1,.hero-compact [data-ztxt="hero.accueil.titre"]{margin:54px 0 14px!important;position:relative;z-index:6}
}
@media(max-width:460px){
  .hero-compact .kick{margin-top:12px!important;margin-bottom:46px!important}
  .hero-compact .title,.hero-compact h1,.hero-compact [data-ztxt="hero.accueil.titre"]{margin:46px 0 12px!important}
}

/* ===================================================================
   FOOTER PRO — structure commune (kungfu/taiji), couleurs qigong
   =================================================================== */
footer.site{background:var(--dark);color:#cfc8bb;margin-top:clamp(50px,8vh,100px);padding:0;position:relative}
footer.site::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--jade),var(--gold))}
footer.site .foot-wrap{max-width:var(--maxw);margin:0 auto;padding:54px clamp(20px,4vw,40px) 26px;
  display:grid;grid-template-columns:1.1fr 1.2fr 1.1fr;gap:0;align-items:start}
footer.site .foot-col{padding:4px clamp(20px,2.6vw,40px);position:relative}
footer.site .foot-col+.foot-col::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:1px;
  background:linear-gradient(180deg,transparent,rgba(181,137,78,.42) 18%,rgba(181,137,78,.42) 82%,transparent)}
/* marque */
footer.site .foot-col--brand{display:flex;flex-direction:column;gap:7px}
footer.site .foot-logo{width:72px;height:72px;object-fit:contain;margin-bottom:6px}
footer.site .foot-logo--white{filter:brightness(0) invert(1)}
footer.site .foot-name{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.06em;font-size:1.5rem;color:#fff;line-height:1}
footer.site .foot-master{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.04em;font-weight:400;font-size:1.15rem;color:#8fb295;line-height:1.1}
footer.site .foot-tag{font-family:var(--font-body);text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;color:#b9b3a6}
footer.site .foot-since{color:#8c857b;font-size:.8rem;font-family:var(--font-body)}
/* titres colonne */
footer.site .foot-h{font-family:var(--font-title);font-variant:small-caps;letter-spacing:.14em;font-size:.92rem;
  color:var(--gold);margin:0 0 14px;padding-bottom:9px;border-bottom:1px solid rgba(181,137,78,.22)}
/* coordonnées */
footer.site .foot-addr{font-style:normal;color:#cfc8bb;font-family:var(--font-body);font-size:.92rem;line-height:1.5;margin-bottom:10px}
footer.site .foot-tel{display:inline-block;font-family:var(--font-title);font-variant:small-caps;letter-spacing:.04em;font-size:1.5rem;color:#fff;text-decoration:none;transition:color .25s}
footer.site .foot-tel:hover{color:var(--gold)}
footer.site .foot-hours{margin:10px 0 0;color:#8c857b;font-size:.72rem;line-height:1.55;font-family:var(--font-body)}
/* liens / réseaux */
footer.site .foot-social{display:inline-flex;gap:14px;margin-bottom:16px}
footer.site .foot-social a{color:#b9b3a6;display:inline-flex;transition:color .25s,transform .25s}
footer.site .foot-social a:hover{color:var(--jade);transform:translateY(-2px)}
footer.site .foot-partners{display:flex;flex-direction:column;gap:9px;list-style:none}
footer.site .foot-partners a{color:#b9b3a6;font-family:var(--font-body);font-size:.88rem;text-decoration:none;transition:color .25s,padding .25s}
footer.site .foot-partners a:hover{color:var(--gold);padding-left:5px}
/* barre bas */
footer.site .foot-bottom{max-width:var(--maxw);margin:0 auto;padding:16px clamp(20px,4vw,40px) 30px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;
  border-top:1px solid rgba(181,137,78,.14)}
footer.site .foot-credit{color:#8c857b;font-size:.78rem;font-family:var(--font-body)}
footer.site .foot-made{color:#6f6960;font-size:.74rem;font-family:var(--font-body)}
footer.site .foot-made a{color:#b9b3a6;text-decoration:none;border-bottom:1px solid rgba(181,137,78,.3);transition:color .25s,border-color .25s}
footer.site .foot-made a:hover{color:var(--gold);border-color:var(--gold)}
@media(max-width:860px){
  footer.site .foot-wrap{grid-template-columns:1fr;padding-top:40px}
  footer.site .foot-col{padding:26px 0;text-align:left}
  footer.site .foot-col+.foot-col::before{left:0;right:0;top:0;bottom:auto;width:auto;height:1px;
    background:linear-gradient(90deg,transparent,rgba(181,137,78,.4) 20%,rgba(181,137,78,.4) 80%,transparent)}
  footer.site .foot-bottom{flex-direction:column;align-items:flex-start;gap:6px}
}
/* === Vidéo YouTube responsive (insérée via l'éditeur) === */
.article-contenu figure.video-embed,
.prose figure.video-embed{ margin:1.8rem auto; max-width:560px; width:100%; }
.article-contenu figure.video-embed .ve-frame,
.prose figure.video-embed .ve-frame{
  position:relative; width:100%; aspect-ratio:16/9;
  background:#000; border-radius:8px; overflow:hidden;
}
.article-contenu figure.video-embed[data-orient="port"] .ve-frame,
.prose figure.video-embed[data-orient="port"] .ve-frame{
  aspect-ratio:9/16; max-width:360px; margin:0 auto;
}
.article-contenu figure.video-embed iframe,
.prose figure.video-embed iframe{
  position:absolute; inset:0; width:100%; height:100%; border:0; display:block; margin:0; border-radius:0;
}
@supports not (aspect-ratio:1){
  .article-contenu figure.video-embed .ve-frame,
  .prose figure.video-embed .ve-frame{ height:0; padding-bottom:56.25%; }
  .article-contenu figure.video-embed[data-orient="port"] .ve-frame,
  .prose figure.video-embed[data-orient="port"] .ve-frame{ padding-bottom:177.78%; }
}
@media (max-width:680px){
  .article-contenu figure.video-embed,
  .prose figure.video-embed{ max-width:100% !important; }
}
/* Vidéo : alignement dans le texte */
.article-contenu figure.video-embed.align-center,
.prose figure.video-embed.align-center{ margin-left:auto; margin-right:auto; }
.article-contenu figure.video-embed.align-left,
.prose figure.video-embed.align-left{ float:left; margin:.4rem 1.8rem 1.2rem 0; }
.article-contenu figure.video-embed.align-right,
.prose figure.video-embed.align-right{ float:right; margin:.4rem 0 1.2rem 1.8rem; }
@media (max-width:680px){
  .article-contenu figure.video-embed.align-left,
  .article-contenu figure.video-embed.align-right,
  .prose figure.video-embed.align-left,
  .prose figure.video-embed.align-right{ float:none; margin:1.5rem auto; }
}

/* ---- Formats images d'article (rendu public : miroir de wysiwyg-imgedit.css, ciblé .article-contenu/.prose) ---- */
.article-contenu figure.art-img,
.prose figure.art-img{ margin:1.4rem 0; max-width:100%; display:block; }
.article-contenu figure.art-img img,
.prose figure.art-img img{ display:block; width:100%; height:auto; border-radius:4px; }
.article-contenu figure.art-img.size-s,
.prose figure.art-img.size-s{ width:38%; }
.article-contenu figure.art-img.size-m,
.prose figure.art-img.size-m{ width:60%; }
.article-contenu figure.art-img.size-l,
.prose figure.art-img.size-l{ width:85%; }
.article-contenu figure.art-img.size-full,
.prose figure.art-img.size-full{ width:100%; }
.article-contenu figure.art-img.shape-round img,
.prose figure.art-img.shape-round img{ aspect-ratio:1; object-fit:cover; border-radius:50%; }
.article-contenu figure.art-img.shape-square img,
.prose figure.art-img.shape-square img{ aspect-ratio:1; object-fit:cover; border-radius:8px; }
.article-contenu figure.art-img.shape-original img,
.prose figure.art-img.shape-original img{ aspect-ratio:auto; border-radius:4px; }
.article-contenu figure.art-img.align-center,
.prose figure.art-img.align-center{ margin-left:auto; margin-right:auto; }
.article-contenu figure.art-img.align-left,
.prose figure.art-img.align-left{ float:left; margin:.4rem 1.5rem 1rem 0; }
.article-contenu figure.art-img.align-right,
.prose figure.art-img.align-right{ float:right; margin:.4rem 0 1rem 1.5rem; }
.article-contenu figure.art-img.is-bw img,
.prose figure.art-img.is-bw img{ filter:grayscale(1); }
.article-contenu figure.art-img figcaption,
.prose figure.art-img figcaption{ font-size:.85rem; color:var(--ink2,#666); margin-top:.4rem; text-align:center; }
.article-contenu::after,.prose::after{ content:""; display:block; clear:both; }
@media (max-width:680px){
  .article-contenu figure.art-img.size-s,.article-contenu figure.art-img.size-m,.article-contenu figure.art-img.size-l,
  .prose figure.art-img.size-s,.prose figure.art-img.size-m,.prose figure.art-img.size-l{ width:100%; float:none; margin:1.5rem auto; }
  .article-contenu figure.art-img.align-left,.article-contenu figure.art-img.align-right,
  .prose figure.art-img.align-left,.prose figure.art-img.align-right{ float:none; margin:1.5rem auto; }
}

/* ---- Recadrage image (zoom/position/rotation) : rendu public ---- */
.article-contenu figure.art-img.has-crop,
.prose figure.art-img.has-crop{ overflow:hidden; }
.article-contenu figure.art-img.has-crop img,
.prose figure.art-img.has-crop img{ transform-origin:center center; will-change:transform; }
.article-contenu figure.art-img.shape-original.has-crop img,
.prose figure.art-img.shape-original.has-crop img{ aspect-ratio:4/3; object-fit:cover; }
