/* =================================================================
   DAR EL OUD ETTOUNSI — style cinématographique « patrimonial »
   Charte : Midnight · Albâtre · Gingembre (Padauk décoratif, Palissandre pied de page)
   Typo : Bebas Neue (titres) · Inter (corps) · Amiri (arabe)
   ================================================================= */

:root{
  --midnight:#081F2C;
  --albatre:#FAFFF5;
  --gingembre:#FEFFD6;
  --padauk:#7D4045;
  --palissandre:#1B1210;

  --midnight-2:#0d2a3c;            /* variante claire pour survols */
  --albatre-soft:rgba(250,255,245,.72);
  --albatre-faint:rgba(250,255,245,.45);
  --maxw:1320px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* Police arabe de marque (charte) — titres arabes sur toutes les langues */
@font-face{
  font-family:'Arabswell';
  src:url('../assets/fonts/arabswell_1.ttf') format('truetype');
  font-display:swap;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--midnight);
  color:var(--albatre);
  font-family:'Inter',system-ui,sans-serif;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  zoom:1.08;           /* agrandissement global du site (~108%) */
}
img{display:block;max-width:100%}
/* Dissuasion du téléchargement des médias (photos, audio, vidéo) */
img,picture,video,audio{-webkit-user-drag:none;-khtml-user-drag:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 48px}
.ar{font-family:'Amiri',serif}

/* libellé en lettres espacées */
.eyebrow{
  font-family:'Inter',sans-serif;font-size:.72rem;font-weight:600;
  letter-spacing:.34em;text-transform:uppercase;color:var(--gingembre);
}

/* ---------- BOUTONS ---------- */
.btn{
  display:inline-flex;align-items:center;gap:9px;cursor:pointer;
  font-family:'Inter',sans-serif;font-size:.92rem;font-weight:600;
  letter-spacing:.02em;padding:14px 30px;border-radius:3px;
  border:1.5px solid transparent;transition:.25s var(--ease);
}
.btn-solid{background:var(--gingembre);color:var(--midnight);border-color:var(--gingembre)}
.btn-solid:hover{background:#fff;border-color:#fff;transform:translateY(-2px)}
.btn-ghost{background:rgba(250,255,245,.04);color:var(--albatre);border-color:rgba(250,255,245,.55)}
.btn-ghost:hover{background:rgba(250,255,245,.12);border-color:var(--albatre);transform:translateY(-2px)}

/* =================================================================
   EN-TÊTE
   ================================================================= */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 48px;
  background:transparent;
  transition:background .4s var(--ease),padding .4s var(--ease),border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
.site-header.scrolled{
  background:rgba(8,31,44,.82);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  padding:12px 48px;
  border-bottom:1px solid rgba(250,255,245,.08);
}
.site-header .logo{height:88px;width:auto;transition:height .4s var(--ease)}
.site-header.scrolled .logo{height:66px}

.nav{display:flex;align-items:center;gap:19px}
.nav a{
  font-size:.86rem;font-weight:500;letter-spacing:.03em;color:var(--albatre);
  position:relative;padding:4px 0;transition:color .2s;white-space:nowrap;
}
.nav a::after{content:"";position:absolute;left:0;bottom:-3px;height:2px;width:0;background:var(--gingembre);transition:width .25s var(--ease)}
.nav a:hover{color:var(--gingembre)}
.nav a:hover::after,.nav a.active::after{width:100%}
.nav a.btn-eleve{
  background:var(--gingembre);color:var(--midnight);
  font-weight:700;font-size:.86rem;letter-spacing:.02em;
  padding:10px 20px;border-radius:3px;transition:.25s var(--ease);white-space:nowrap;
}
.nav a.btn-eleve::after{display:none}
.nav a.btn-eleve:hover{background:#fff;color:var(--midnight);transform:translateY(-2px)}

/* Menu déroulant « Le malouf » (injecté par main.js) */
.nav-malouf{position:relative;display:flex;align-items:center}
.malouf-caret{font-size:.7em;opacity:.85;margin-inline-start:3px}
.malouf-menu{
  position:absolute;top:100%;left:0;margin-top:8px;min-width:212px;
  display:none;flex-direction:column;
  background:rgba(8,31,44,.97);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(250,255,245,.12);border-radius:8px;padding:8px 6px;
  box-shadow:0 22px 50px -18px rgba(0,0,0,.7);z-index:200;
}
.malouf-menu::before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px}
.nav-malouf:hover .malouf-menu{display:flex}
.malouf-menu a{padding:8px 16px;font-size:.85rem;white-space:nowrap;border-radius:4px}
.malouf-menu a::after{display:none}
.malouf-menu a:hover{color:var(--gingembre);background:rgba(250,255,245,.06)}
html[dir="rtl"] .malouf-menu{left:auto;right:0}

/* groupe de droite + sélecteur de langue */
.header-right{display:flex;align-items:center;gap:20px}
.lang{display:inline-flex;align-items:center;gap:7px;font-size:.82rem;font-weight:600;white-space:nowrap}
.lang a{color:var(--albatre-soft);transition:color .2s}
.lang a.on{color:var(--gingembre)}
.lang a:hover{color:var(--gingembre)}
.lang .sep{color:rgba(250,255,245,.28)}

.burger{display:none;flex-direction:column;gap:6px;background:none;border:0;cursor:pointer;padding:6px;z-index:120}
.burger span{display:block;width:26px;height:2px;background:var(--albatre);transition:.3s}

/* =================================================================
   HERO
   ================================================================= */
.hero{position:relative;min-height:calc(100vh / 1.08);display:flex;align-items:flex-end;overflow:hidden;padding-top:150px}
.hero-bg{position:absolute;inset:0;z-index:1}
.hero-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center;opacity:0;transition:opacity 1.6s ease-in-out}
.hero-bg img.active{opacity:1;animation:kenburns 8s ease-out both}
@keyframes kenburns{from{transform:scale(1.07)}to{transform:scale(1)}}
/* deux dégradés Midnight : vertical + horizontal */
.hero::before{
  content:"";position:absolute;inset:0;z-index:2;
  background:
    linear-gradient(to right, var(--midnight) 8%, rgba(8,31,44,.65) 42%, rgba(8,31,44,0) 78%),
    linear-gradient(to bottom, rgba(8,31,44,.55) 0%, rgba(8,31,44,0) 30%, rgba(8,31,44,.85) 88%, var(--midnight) 100%);
}
.medaillon{
  position:absolute;top:-40px;right:-60px;z-index:2;
  width:540px;max-width:46vw;opacity:.07;pointer-events:none;
  animation:float 16s ease-in-out infinite;
}
@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(22px) rotate(4deg)}}

.hero-content{position:relative;z-index:3;width:100%;padding:0 48px 92px;max-width:var(--maxw);margin:0 auto}
.hero-inner{max-width:680px;animation:rise 1s var(--ease) both}
@keyframes rise{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
.hero .eyebrow{display:block;margin-bottom:16px}
.hero-ar{font-family:'Arabswell','Amiri',serif;font-size:clamp(1.9rem,3.6vw,2.9rem);color:var(--gingembre);margin-bottom:10px;line-height:1.5;text-align:left;direction:rtl;margin-left:1em}
.hero h1{
  font-family:'Bebas Neue',sans-serif;font-weight:400;color:var(--albatre);
  font-size:clamp(2.8rem,5vw,4.6rem);line-height:.96;letter-spacing:.01em;margin-bottom:22px;
}
.hero p{font-size:1.18rem;color:var(--albatre-soft);max-width:520px;margin-bottom:34px;font-weight:300}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}

/* =================================================================
   RANGÉES / CARROUSELS
   ================================================================= */
.row{padding:46px 0}
.row:first-of-type{padding-top:72px}
.row-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:22px}
.row-head h2{
  font-family:'Bebas Neue',sans-serif;font-weight:400;letter-spacing:.02em;
  font-size:clamp(1.7rem,3vw,2.4rem);color:var(--albatre);
}
.seeall{font-size:.82rem;font-weight:600;letter-spacing:.06em;color:var(--gingembre);white-space:nowrap;transition:.2s}
.seeall:hover{opacity:.7}

.track{
  display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;
  max-width:var(--maxw);margin:0 auto;
  padding:6px 48px 18px;
  scrollbar-width:none;-ms-overflow-style:none;
}
.track::-webkit-scrollbar{display:none}

.card{
  position:relative;flex:0 0 320px;scroll-snap-align:start;
  border-radius:6px;overflow:hidden;background:var(--midnight-2);
  cursor:pointer;transition:transform .4s var(--ease),box-shadow .4s var(--ease);
  box-shadow:0 0 0 rgba(0,0,0,0);
}
.card:hover{transform:translateY(-8px);box-shadow:0 26px 50px -22px rgba(0,0,0,.8)}
.card .thumb{position:relative;height:210px;overflow:hidden}
.card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.card:hover .thumb img{transform:scale(1.09)}
.card .thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(8,31,44,0) 35%,rgba(8,31,44,.9) 100%)}
.card .body{padding:16px 18px 20px}
.card-title{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:1.4rem;letter-spacing:.02em;color:var(--albatre);line-height:1.05}
.card-sub{font-size:.84rem;color:var(--gingembre);margin-top:4px;font-weight:500}

/* Grille de cartes (cliquables, sans défilement horizontal) — pages instruments */
.icards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;max-width:var(--maxw);margin:0 auto;padding:6px 24px}
.icards .card{flex:none}
.tag{
  position:absolute;top:12px;left:12px;z-index:2;
  background:var(--padauk);color:var(--gingembre);
  font-size:.64rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  padding:5px 10px;border-radius:2px;
}

/* =================================================================
   MANIFESTE
   ================================================================= */
.manifest{padding:120px 0;text-align:center;position:relative}
.manifest::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(125,64,69,.16),transparent 62%)}
.manifest .inner{position:relative;z-index:2;max-width:880px;margin:0 auto}
.manifest-ar{font-family:'Arabswell','Amiri',serif;font-size:clamp(2rem,4vw,3rem);color:var(--gingembre);margin-bottom:14px}
.manifest h2{
  font-family:'Bebas Neue',sans-serif;font-weight:400;letter-spacing:.01em;
  font-size:clamp(2.4rem,5vw,4rem);line-height:1;color:var(--albatre);margin-bottom:24px;
}
.manifest p{font-size:1.16rem;color:var(--albatre-soft);font-weight:300;max-width:680px;margin:0 auto 56px}
.stats{display:flex;justify-content:center;gap:64px;flex-wrap:wrap}
.stat .num{font-family:'Bebas Neue',sans-serif;font-size:3.6rem;line-height:1;color:var(--gingembre)}
.stat .lbl{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:var(--albatre-faint);margin-top:8px}

/* =================================================================
   PIED DE PAGE
   ================================================================= */
.site-footer{background:var(--palissandre);padding:72px 0 32px;margin-top:40px}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:48px}
.footer-brand .logo{height:92px;margin-bottom:18px}
.footer-brand p{color:var(--albatre-faint);font-weight:300;font-size:.92rem;max-width:300px}
.footer-col h4{font-family:'Inter',sans-serif;font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gingembre);margin-bottom:16px}
.footer-col ul{list-style:none;display:grid;gap:11px}
.footer-col a{color:var(--albatre-soft);font-size:.92rem;transition:color .2s}
.footer-col a:hover{color:var(--gingembre)}
.footer-bottom{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  margin-top:54px;padding-top:24px;border-top:1px solid rgba(250,255,245,.1);
  font-size:.82rem;color:var(--albatre-faint);
}

/* ---------- révélation discrète au défilement ---------- */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* =================================================================
   RESPONSIVE
   ================================================================= */
/* Le menu complet (8 liens) bascule en burger dès qu'il devient trop large */
@media(max-width:1200px){
  .nav,.btn-eleve{display:none}
  .burger{display:flex;z-index:300}
  .nav.open{
    display:flex;flex-direction:column;align-items:flex-start;gap:22px;
    position:fixed;inset:0;background:var(--midnight);
    padding:96px 32px;z-index:200;overflow-y:auto;
  }
  .nav.open a{font-size:1.4rem}
  .nav.open a.btn-eleve{display:inline-flex;margin-top:8px;font-size:1.1rem}
  body.menu-open{overflow:hidden}
  body.menu-open .wa-btn,body.menu-open .cbot-btn,body.menu-open .cbot-panel{display:none}
  .burger.is-open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .burger.is-open span:nth-child(2){opacity:0}
  .burger.is-open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  /* « Le malouf » déplié dans le menu burger */
  .nav.open .nav-malouf{flex-direction:column;align-items:flex-start;gap:14px;width:100%}
  .nav.open .malouf-menu{position:static;display:flex;margin:0;padding:0;padding-inline-start:18px;border:none;background:none;box-shadow:none;min-width:0;gap:13px}
  .nav.open .malouf-menu::before{display:none}
  .nav.open .malouf-menu a{font-size:1.05rem;padding:0}
}
@media(max-width:860px){
  .wrap,.hero-content{padding-left:24px;padding-right:24px}
  .site-header,.site-header.scrolled{padding:14px 24px}
  .site-header .logo,.site-header.scrolled .logo{height:54px}
  .medaillon{display:none}
  .hero{min-height:calc(88vh / 1.08)}
  .hero-content{padding-bottom:64px}
  .hero-bg img{object-position:65% center}
  .track{padding-left:24px;padding-right:24px}
  .card{flex-basis:260px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
  .stats{gap:36px}
}
@media(max-width:520px){
  .footer-grid{grid-template-columns:1fr}
  .card{flex-basis:230px}
  .hero h1{font-size:clamp(3rem,13vw,4.4rem)}
}

/* =================================================================
   PAGES INTÉRIEURES (thème sombre cinématographique)
   ================================================================= */
.page-banner{position:relative;min-height:56vh;display:flex;align-items:flex-end;overflow:hidden;padding-top:150px}
.page-banner .bg{position:absolute;inset:0;z-index:1}
.page-banner .bg img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
.page-banner::before{content:"";position:absolute;inset:0;z-index:2;
  background:
    linear-gradient(to right, var(--midnight) 6%, rgba(8,31,44,.55) 48%, rgba(8,31,44,.15) 100%),
    linear-gradient(to bottom, rgba(8,31,44,.45) 0%, rgba(8,31,44,0) 32%, var(--midnight) 100%);}
.page-banner .inner{position:relative;z-index:3;width:100%;max-width:var(--maxw);margin:0 auto;padding:0 48px 60px}
.breadcrumb{font-size:.8rem;color:var(--albatre-faint);margin-bottom:14px;letter-spacing:.04em}
.breadcrumb a{color:var(--gingembre)}
.page-banner .eyebrow{display:block;margin-bottom:12px}
.page-banner .ar{font-family:'Amiri',serif;color:var(--gingembre);font-size:clamp(1.4rem,2.6vw,2rem);margin-bottom:6px}
.page-banner h1{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:clamp(2.8rem,6.4vw,5.2rem);line-height:.94;letter-spacing:.01em;color:var(--albatre)}
.page-banner .intro{margin-top:18px;color:var(--albatre-soft);font-weight:300;font-size:1.12rem;max-width:600px}

.sec{padding:84px 0}
.sec.alt{background:#0b2433}
.sec .lead{max-width:760px;margin-bottom:42px}
.sec .lead .eyebrow{display:block;margin-bottom:12px}
.sec h2{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:clamp(2rem,4vw,3.2rem);line-height:1;letter-spacing:.01em;color:var(--albatre);margin-bottom:18px}
.sec h2 .accent{color:var(--gingembre)}
.sec p{color:var(--albatre-soft);font-weight:300;margin-bottom:16px}
.sec h3{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:1.7rem;letter-spacing:.02em;color:var(--albatre);margin-bottom:8px}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid rgba(250,255,245,.12);padding-bottom:16px;margin-bottom:36px}
.sec-head h2{margin:0}

.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.split + .split{margin-top:74px}
.split .media{border-radius:6px;overflow:hidden;aspect-ratio:4/3;background:var(--midnight-2)}
.split .media img{width:100%;height:100%;object-fit:cover}
.split.media-right .media{order:2}

.feature-list{list-style:none;display:grid;gap:18px;margin-top:8px}
.feature-list li{padding-left:30px;position:relative;color:var(--albatre-soft);font-weight:300}
.feature-list li::before{content:"";position:absolute;left:0;top:.5em;width:10px;height:10px;border:2px solid var(--gingembre);transform:rotate(45deg)}
.feature-list b{display:block;font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:1.2rem;letter-spacing:.02em;color:var(--albatre)}

.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.panel{background:var(--midnight-2);border:1px solid rgba(250,255,245,.08);border-radius:6px;padding:30px 28px;transition:transform .3s var(--ease),border-color .3s var(--ease)}
.panel:hover{transform:translateY(-5px);border-color:rgba(254,255,214,.34)}
.panel .cat{color:var(--gingembre);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;display:block;margin-bottom:10px}
.panel h3{margin-bottom:8px}
.panel p{color:var(--albatre-soft);font-weight:300;font-size:.96rem;margin:0}

.tarifs{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.tarif{position:relative;background:var(--midnight-2);border:1px solid rgba(250,255,245,.1);border-radius:6px;padding:36px 28px;display:flex;flex-direction:column}
.tarif.featured{border-color:var(--gingembre)}
.tarif .badge{position:absolute;top:-12px;left:28px;background:var(--gingembre);color:var(--midnight);font-size:.64rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:5px 12px;border-radius:2px}
.tarif h3{font-family:'Bebas Neue',sans-serif;font-size:1.8rem;color:var(--albatre);margin-bottom:2px}
.tarif .sub{color:var(--albatre-faint);font-size:.84rem}
.tarif .price{font-family:'Bebas Neue',sans-serif;font-size:3rem;color:var(--gingembre);line-height:1;margin:16px 0}
.tarif .price small{font-family:'Inter',sans-serif;font-size:.78rem;color:var(--albatre-faint)}
.tarif ul{list-style:none;display:grid;gap:11px;margin:16px 0 28px}
.tarif li{color:var(--albatre-soft);font-weight:300;font-size:.94rem;padding-left:22px;position:relative}
.tarif li::before{content:"—";position:absolute;left:0;color:var(--gingembre)}
.tarif .btn{margin-top:auto;justify-content:center}

.form{display:grid;gap:20px;max-width:680px}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.field{display:flex;flex-direction:column;gap:7px}
.field label{font-size:.82rem;font-weight:600;letter-spacing:.02em;color:var(--albatre)}
.field input,.field select,.field textarea{font-family:'Inter',sans-serif;font-size:1rem;padding:13px 15px;border-radius:4px;border:1px solid rgba(250,255,245,.18);background:rgba(250,255,245,.05);color:var(--albatre)}
.field input::placeholder,.field textarea::placeholder{color:var(--albatre-faint)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gingembre);background:rgba(250,255,245,.08)}
.field select option{color:#111;background:#fff}
.field textarea{min-height:130px;resize:vertical}
.form-note{font-size:.82rem;color:var(--albatre-faint)}

.shop{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.product{background:var(--midnight-2);border:1px solid rgba(250,255,245,.08);border-radius:6px;overflow:hidden;display:flex;flex-direction:column;transition:transform .3s var(--ease),border-color .3s var(--ease)}
.product:hover{transform:translateY(-5px);border-color:rgba(254,255,214,.34)}
.product .pimg{aspect-ratio:1;overflow:hidden;background:var(--midnight)}
.product .pimg img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.product:hover .pimg img{transform:scale(1.06)}
.product .pbody{padding:18px 20px 22px;display:flex;flex-direction:column;gap:6px;flex:1}
.product .cat{color:var(--gingembre);font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.product h3{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:1.35rem;letter-spacing:.02em;color:var(--albatre)}
.product .pr{color:var(--albatre);font-weight:600;font-size:.96rem}
.product .btn{margin-top:8px;justify-content:center}
.shop-note{font-size:.9rem;color:var(--albatre-soft);background:var(--midnight-2);border:1px solid rgba(250,255,245,.1);border-radius:6px;padding:18px 22px;line-height:1.6}
.shop-note a{color:var(--gingembre)}

.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:start}
.info-list{list-style:none;display:grid;gap:24px}
.info-list .k{color:var(--gingembre);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:5px}
.info-list .v{font-size:1.04rem;color:var(--albatre)}
.info-list a{color:var(--gingembre)}
.map{aspect-ratio:16/10;border-radius:6px;overflow:hidden;border:1px solid rgba(250,255,245,.12);margin-top:36px}
.map iframe{width:100%;height:100%;border:0;filter:grayscale(.4) brightness(.85) contrast(1.05)}

.lessons{display:grid;border-top:1px solid rgba(250,255,245,.12);margin-top:8px}
.lesson{display:grid;grid-template-columns:54px 1fr auto;gap:22px;align-items:center;padding:20px 0;border-bottom:1px solid rgba(250,255,245,.12)}
.lesson .no{font-family:'Bebas Neue',sans-serif;font-size:1.8rem;color:var(--gingembre);line-height:1}
.lesson h4{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:1.3rem;letter-spacing:.02em;color:var(--albatre)}
.lesson .meta{color:var(--albatre-faint);font-size:.86rem}
.lesson .lock{font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--albatre-faint);white-space:nowrap}
.lesson .lock.free{color:var(--gingembre)}
/* Leçons en accordéon (espace élève) */
.lesson-acc{border-bottom:1px solid rgba(250,255,245,.12)}
.lesson-head{width:100%;display:grid;grid-template-columns:54px 1fr auto;gap:22px;align-items:center;padding:20px 0;background:none;border:0;color:inherit;cursor:pointer;text-align:left;font:inherit}
.lesson-head .no{font-family:'Bebas Neue',sans-serif;font-size:1.8rem;color:var(--gingembre);line-height:1}
.lesson-head .lh-main{display:flex;flex-direction:column;gap:3px}
.lesson-head .lh-title{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:1.3rem;letter-spacing:.02em;color:var(--albatre)}
.lesson-head .meta{color:var(--albatre-faint);font-size:.86rem}
.lesson-head .chev{color:var(--gingembre);font-size:1.2rem;transition:transform .25s}
.lesson-acc.open .chev{transform:rotate(180deg)}
.lesson-acc.open .lesson-head{background:rgba(250,255,245,.02)}
.lesson-body{display:none;padding:4px 0 24px;padding-inline-start:76px}
.lesson-acc.open .lesson-body{display:block}
.lesson-sec{margin-bottom:18px}
.lesson-sec h5{color:var(--gingembre);font-size:.72rem;font-weight:700;letter-spacing:.1em;margin-bottom:8px}
.lesson-sec .txt{white-space:pre-wrap;color:var(--albatre-soft);font-weight:300;line-height:1.7}
@media(max-width:560px){
  .lesson-head{grid-template-columns:38px 1fr auto;gap:12px}
  .lesson-body{padding-inline-start:0}
}

.cta-band{padding:104px 0;text-align:center;position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(125,64,69,.2),transparent 60%)}
.cta-band .inner{position:relative;z-index:2;max-width:780px;margin:0 auto;padding:0 24px}
.cta-band .ar{font-family:'Amiri',serif;color:var(--gingembre);font-size:1.6rem;margin-bottom:12px}
.cta-band h2{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:clamp(2.2rem,4.6vw,3.6rem);line-height:1;color:var(--albatre);margin-bottom:16px}
.cta-band p{color:var(--albatre-soft);font-weight:300;max-width:500px;margin:0 auto 30px}

@media(max-width:860px){
  .page-banner .inner{padding-left:24px;padding-right:24px}
  .grid-3,.tarifs,.shop{grid-template-columns:1fr 1fr}
  .grid-2,.split,.contact-grid,.form .row{grid-template-columns:1fr}
  .split{gap:34px}
  .split.media-right .media{order:-1}
  .map{margin-top:0}
}
@media(max-width:520px){
  .grid-3,.tarifs,.shop{grid-template-columns:1fr}
  .lesson{grid-template-columns:40px 1fr;gap:14px}
  .lesson .lock{grid-column:2;margin-top:4px}
}

/* ===== équipe (maîtres) ===== */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.member{background:var(--midnight-2);border:1px solid rgba(250,255,245,.08);border-radius:6px;overflow:hidden;transition:transform .3s var(--ease),border-color .3s var(--ease)}
.member:hover{transform:translateY(-5px);border-color:rgba(254,255,214,.34)}
.member .mimg{aspect-ratio:4/5;overflow:hidden;background:var(--midnight)}
.member .mimg img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.member:hover .mimg img{transform:scale(1.05)}
.member .mbody{padding:18px 20px 22px}
.member h3{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:1.5rem;letter-spacing:.02em;color:var(--albatre)}
.member .role{color:var(--gingembre);font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin:4px 0 10px}
.member p{color:var(--albatre-soft);font-weight:300;font-size:.92rem;margin:0}

/* ===== agenda ===== */
.agenda-list{display:grid;border-top:1px solid rgba(250,255,245,.12)}
.event{display:grid;grid-template-columns:108px 1fr auto;gap:28px;align-items:center;padding:24px 0;border-bottom:1px solid rgba(250,255,245,.12);transition:background .25s}
.event:hover{background:rgba(250,255,245,.03)}
.event .date{text-align:center;border-right:1px solid rgba(250,255,245,.14);padding-right:22px}
.event .date .d{font-family:'Bebas Neue',sans-serif;font-size:2.8rem;line-height:.9;color:var(--gingembre)}
.event .date .m{font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--albatre-faint);margin-top:4px}
.event .cat{color:var(--gingembre);font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:5px}
.event h3{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:1.5rem;letter-spacing:.02em;color:var(--albatre);line-height:1}
.event .place{color:var(--albatre-faint);font-size:.9rem;margin-top:4px}
.event .go{color:var(--gingembre);font-size:.86rem;font-weight:600;white-space:nowrap}
@media(max-width:860px){
  .team{grid-template-columns:1fr 1fr}
  .event{grid-template-columns:80px 1fr;gap:18px}
  .event .go{display:none}
}
@media(max-width:520px){.team{grid-template-columns:1fr}}

/* ===== Espace élève — page de connexion ===== */
.auth{position:relative;min-height:calc(100vh / 1.08);display:flex;align-items:center;justify-content:center;padding:150px 24px 80px;overflow:hidden}
.auth .bg{position:absolute;inset:0;z-index:1}
.auth .bg img{width:100%;height:100%;object-fit:cover;opacity:.22}
.auth .bg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(8,31,44,.5),var(--midnight) 78%)}
.auth-card{position:relative;z-index:2;width:100%;max-width:430px;background:rgba(13,42,60,.82);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(250,255,245,.12);border-radius:10px;padding:46px 40px}
.auth-card .eyebrow{display:block;margin-bottom:12px}
.auth-card h1{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:2.5rem;letter-spacing:.02em;color:var(--albatre);line-height:1;margin-bottom:8px}
.auth-card .sub{color:var(--albatre-soft);font-size:.96rem;font-weight:300;margin-bottom:28px}
.auth-card form{display:grid;gap:18px}
.auth-card .btn{width:100%;justify-content:center;margin-top:6px}
.auth-links{display:flex;justify-content:space-between;align-items:center;font-size:.84rem}
.auth-links label{display:flex;align-items:center;gap:7px;font-weight:400;color:var(--albatre-soft)}
.auth-links input[type=checkbox]{width:auto}
.auth-links a{color:var(--gingembre)}
.auth-note{margin-top:16px;font-size:.78rem;color:var(--albatre-faint);text-align:center}
.auth-alt{text-align:center;margin-top:24px;padding-top:20px;border-top:1px solid rgba(250,255,245,.1);font-size:.92rem;color:var(--albatre-faint)}
.auth-alt a{color:var(--gingembre);font-weight:600}
@media(max-width:520px){
  .auth{padding:112px 14px 56px}
  .auth-card{padding:30px 18px}
  .auth-card h1{font-size:2.1rem}
  .auth-links{flex-direction:column;align-items:flex-start;gap:11px}
}

/* ===== Chatbot FAQ ===== */
.cbot-btn{position:fixed;bottom:24px;right:24px;z-index:300;width:60px;height:60px;border-radius:50%;background:var(--gingembre);color:var(--midnight);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px -8px rgba(0,0,0,.65);transition:transform .25s var(--ease)}
.cbot-btn:hover{transform:scale(1.07)}
.cbot-btn svg{width:28px;height:28px}
.cbot-btn .ic-close{display:none}
.cbot-btn.open .ic-chat{display:none}
.cbot-btn.open .ic-close{display:block}
html[dir="rtl"] .cbot-btn{right:auto;left:24px}

.cbot-panel{position:fixed;bottom:98px;right:24px;z-index:300;width:372px;max-width:calc(100vw - 36px);height:526px;max-height:calc(100vh - 140px);background:var(--midnight-2);border:1px solid rgba(250,255,245,.14);border-radius:14px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 64px -18px rgba(0,0,0,.72);opacity:0;transform:translateY(16px) scale(.98);pointer-events:none;transition:opacity .25s var(--ease),transform .25s var(--ease)}
.cbot-panel.open{opacity:1;transform:none;pointer-events:auto}
html[dir="rtl"] .cbot-panel{right:auto;left:24px}

.cbot-head{background:var(--midnight);padding:15px 18px;display:flex;align-items:center;gap:11px;border-bottom:1px solid rgba(250,255,245,.1)}
.cbot-head .dot{width:9px;height:9px;border-radius:50%;background:#57d38c;flex-shrink:0}
.cbot-head .ttl{font-family:'Bebas Neue',sans-serif;font-size:1.25rem;letter-spacing:.03em;color:var(--albatre);line-height:1}
.cbot-head .sub{font-size:.7rem;color:var(--albatre-faint)}
.cbot-head .x{margin-left:auto;background:none;border:none;color:var(--albatre-soft);cursor:pointer;font-size:1.4rem;line-height:1;padding:0 4px}
html[dir="rtl"] .cbot-head .x{margin-left:0;margin-right:auto}

.cbot-body{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:11px}
.cbot-msg{max-width:85%;padding:11px 14px;border-radius:15px;font-size:.92rem;line-height:1.55}
.cbot-msg.bot{align-self:flex-start;background:rgba(250,255,245,.08);color:var(--albatre);border-bottom-left-radius:4px}
.cbot-msg.user{align-self:flex-end;background:var(--gingembre);color:var(--midnight);border-bottom-right-radius:4px}
.cbot-msg a{color:var(--gingembre);font-weight:600}
.cbot-msg.user a{color:var(--midnight)}
html[dir="rtl"] .cbot-msg.bot{border-bottom-left-radius:15px;border-bottom-right-radius:4px}
html[dir="rtl"] .cbot-msg.user{border-bottom-right-radius:15px;border-bottom-left-radius:4px}

.cbot-chips{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 12px}
.cbot-chip{background:rgba(250,255,245,.07);border:1px solid rgba(250,255,245,.16);color:var(--albatre-soft);font-size:.8rem;padding:7px 13px;border-radius:20px;cursor:pointer;transition:.2s;font-family:'Inter',sans-serif}
.cbot-chip:hover{background:var(--gingembre);color:var(--midnight);border-color:var(--gingembre)}

.cbot-input{display:flex;gap:8px;padding:12px;border-top:1px solid rgba(250,255,245,.1)}
.cbot-input input{flex:1;background:rgba(250,255,245,.06);border:1px solid rgba(250,255,245,.16);border-radius:22px;padding:11px 16px;color:var(--albatre);font-family:'Inter',sans-serif;font-size:.92rem}
.cbot-input input::placeholder{color:var(--albatre-faint)}
.cbot-input input:focus{outline:none;border-color:var(--gingembre)}
.cbot-input button{background:var(--gingembre);color:var(--midnight);border:none;border-radius:50%;width:42px;height:42px;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.cbot-input button svg{width:18px;height:18px}
html[dir="rtl"] .cbot-input button svg{transform:scaleX(-1)}

@media(max-width:520px){
  .cbot-panel{bottom:86px;right:12px;left:12px;width:auto;max-width:none;height:72vh}
  html[dir="rtl"] .cbot-panel{right:12px;left:12px}
  .cbot-btn{bottom:18px;right:18px}
  html[dir="rtl"] .cbot-btn{right:auto;left:18px}
}

/* ===== Bouton flottant WhatsApp (coin opposé au chatbot) ===== */
.wa-btn{position:fixed;bottom:24px;left:24px;z-index:250;width:58px;height:58px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px -8px rgba(0,0,0,.55);transition:transform .25s var(--ease)}
.wa-btn:hover{transform:scale(1.07)}
.wa-btn svg{width:32px;height:32px;fill:#fff}
html[dir="rtl"] .wa-btn{left:auto;right:24px}
@media(max-width:520px){
  .wa-btn{bottom:18px;left:18px;width:52px;height:52px}
  html[dir="rtl"] .wa-btn{left:auto;right:18px}
}

/* ===== Étapes « Comment ça marche » ===== */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px}
.step{background:rgba(250,255,245,.04);border:1px solid rgba(250,255,245,.1);border-radius:14px;padding:30px 26px}
.step .step-n{font-family:'Bebas Neue',sans-serif;font-size:1.5rem;width:46px;height:46px;border-radius:50%;background:var(--gingembre);color:var(--midnight);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.step h3{font-size:1.25rem;margin-bottom:8px}
.step p{color:var(--albatre-soft);font-size:.98rem}
@media(max-width:820px){.steps{grid-template-columns:1fr}}

/* ===== FAQ (accordéon natif) ===== */
.faq{max-width:880px;margin:30px auto 0}
.faq-q{background:rgba(250,255,245,.04);border:1px solid rgba(250,255,245,.1);border-radius:12px;margin-bottom:12px;overflow:hidden}
.faq-q summary{cursor:pointer;list-style:none;padding:18px 22px;font-weight:600;font-size:1.05rem;display:flex;align-items:center;justify-content:space-between;gap:14px}
.faq-q summary::-webkit-details-marker{display:none}
.faq-q summary::after{content:"+";font-size:1.6rem;line-height:1;color:var(--gingembre);transition:transform .2s var(--ease);flex-shrink:0}
.faq-q[open] summary::after{transform:rotate(45deg)}
.faq-q .faq-a{padding:0 22px 18px;color:var(--albatre-soft);line-height:1.7}
.faq-q .faq-a a{color:var(--gingembre);font-weight:600}

/* ===== Espace élève + : emploi du temps, factures, messagerie ===== */
.sched{display:flex;flex-direction:column;gap:10px}
.sched-row{display:grid;grid-template-columns:130px 140px 1fr;gap:12px;align-items:center;background:rgba(250,255,245,.04);border:1px solid rgba(250,255,245,.1);border-radius:10px;padding:14px 18px}
.sched-day{font-weight:700;color:var(--gingembre)}
.sched-time{color:var(--albatre-soft)}
.sched-extra{color:var(--albatre-faint)}

/* Assiduité */
.att-summary{display:flex;flex-wrap:wrap;align-items:center;gap:24px;background:rgba(250,255,245,.04);border:1px solid rgba(250,255,245,.1);border-radius:14px;padding:18px 22px;margin-bottom:18px}
.att-rate{text-align:center}
.att-rate-n{font-family:'Bebas Neue',sans-serif;font-size:2.6rem;line-height:1}
.att-rate-l{font-size:.82rem;color:var(--albatre-soft)}
.att-counts{display:flex;flex-wrap:wrap;gap:18px;color:var(--albatre-soft);font-size:.9rem}
.att-counts b{font-size:1.15rem}
.att-list{display:flex;flex-direction:column;gap:8px}
.att-row{display:flex;align-items:center;gap:12px;background:rgba(250,255,245,.03);border:1px solid rgba(250,255,245,.08);border-radius:10px;padding:11px 16px}
.att-date{font-weight:600;min-width:104px}
.att-course{flex:1;color:var(--albatre-soft);font-size:.9rem;min-width:0}
.att-badge{border:1px solid;border-radius:20px;padding:2px 12px;font-size:.8rem;font-weight:600}
.att-note{color:var(--albatre-faint);font-size:.85rem}
@media(max-width:620px){.sched-row{grid-template-columns:1fr;gap:4px}}

.inv-amount{font-size:1.5rem;color:var(--gingembre);font-weight:700;margin:6px 0}
.panel.inv-paid .cat{color:#9fe0c0}
.panel.inv-unpaid .cat{color:#ffcf8f}
.panel.inv-cancel .cat{color:var(--albatre-faint)}

.msg-box{max-height:440px;overflow-y:auto;background:rgba(8,31,44,.4);border:1px solid rgba(250,255,245,.1);border-radius:12px;padding:16px;margin-bottom:14px}
.msgs{display:flex;flex-direction:column;gap:10px}
.msg{max-width:80%;padding:11px 15px;border-radius:14px}
.msg .msg-b{white-space:pre-wrap;line-height:1.5}
.msg .msg-t{font-size:.72rem;color:var(--albatre-faint);margin-top:5px}
.msg.them{align-self:flex-start;background:rgba(250,255,245,.08);border-bottom-left-radius:4px}
.msg.me{align-self:flex-end;background:var(--gingembre);color:var(--midnight);border-bottom-right-radius:4px}
.msg.me .msg-t{color:rgba(8,31,44,.6)}
html[dir="rtl"] .msg.them{align-self:flex-end;border-bottom-left-radius:14px;border-bottom-right-radius:4px}
html[dir="rtl"] .msg.me{align-self:flex-start;border-bottom-right-radius:14px;border-bottom-left-radius:4px}
.msg-form{display:flex;gap:10px;align-items:flex-end}
.msg-form textarea{flex:1;background:rgba(250,255,245,.06);border:1px solid rgba(250,255,245,.16);border-radius:10px;padding:12px 14px;color:var(--albatre);font-family:'Inter',sans-serif;font-size:.95rem;resize:vertical}
.msg-form textarea:focus{outline:none;border-color:var(--gingembre)}

/* ===== Messagerie directe (style Messenger) ===== */
.dm{display:flex;height:calc(100vh - 210px);min-height:430px;border:1px solid rgba(250,255,245,.1);border-radius:14px;overflow:hidden;background:rgba(8,31,44,.4)}
.dm-list{width:310px;flex-shrink:0;border-right:1px solid rgba(250,255,245,.1);overflow-y:auto}
.dm-search{position:sticky;top:0;z-index:2;background:var(--midnight-2);padding:10px;border-bottom:1px solid rgba(250,255,245,.1);display:flex;gap:8px;align-items:center}
.dm-search input{flex:1;min-width:0;background:rgba(250,255,245,.06);border:1px solid rgba(250,255,245,.16);border-radius:20px;padding:9px 16px;color:var(--albatre);font-family:'Inter',sans-serif;font-size:.9rem}
.dm-search input:focus{outline:none;border-color:var(--gingembre)}
.dm-newgrp{flex-shrink:0;width:40px;height:40px;border-radius:50%;border:1px solid rgba(250,255,245,.16);background:rgba(250,255,245,.06);color:var(--albatre);font-size:.85rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
.dm-newgrp:hover{border-color:var(--gingembre);background:rgba(231,160,82,.15)}
.dm-av-grp{background:var(--midnight-2);border:1.5px solid var(--gingembre)}
.dm-av-grp i{font-size:1.2rem}
.dm-from{display:block;font-size:.72rem;font-weight:700;color:var(--gingembre);margin-bottom:2px;font-style:normal}
.dm-leave{margin-left:auto;background:none;border:none;color:var(--albatre-faint);font-size:1.2rem;cursor:pointer;line-height:1}
.dm-leave:hover{color:var(--padauk)}
.grp-modal{position:fixed;inset:0;z-index:1000;background:rgba(8,12,18,.72);display:flex;align-items:center;justify-content:center;padding:18px}
.grp-card{background:var(--midnight-2);border:1px solid rgba(250,255,245,.14);border-radius:16px;width:100%;max-width:420px;max-height:84vh;overflow:auto;padding:20px}
.grp-card h3{margin:0 0 14px}
.grp-card>input{width:100%;background:rgba(250,255,245,.06);border:1px solid rgba(250,255,245,.16);border-radius:10px;padding:10px 14px;color:var(--albatre);font-family:'Inter',sans-serif;font-size:.95rem;margin-bottom:14px}
.grp-card>input:focus{outline:none;border-color:var(--gingembre)}
.grp-sub{font-size:.8rem;color:var(--albatre-faint);margin-bottom:8px;font-weight:600}
.grp-list{max-height:46vh;overflow:auto;border:1px solid rgba(250,255,245,.1);border-radius:10px}
.grp-opt{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid rgba(250,255,245,.06);cursor:pointer;font-size:.92rem}
.grp-opt:last-child{border-bottom:none}
.grp-opt input{width:18px;height:18px;accent-color:var(--gingembre)}
.grp-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}
.dm-contact{display:flex;align-items:center;gap:11px;width:100%;background:none;border:none;border-bottom:1px solid rgba(250,255,245,.06);color:var(--albatre);text-align:left;padding:12px 14px;cursor:pointer;font-family:'Inter',sans-serif}
.dm-contact:hover,.dm-contact.active{background:rgba(250,255,245,.07)}
.dm-av{position:relative;overflow:hidden;width:44px;height:44px;border-radius:50%;background:var(--gingembre);color:var(--midnight);display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0;font-style:normal}
.dm-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dm-c-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.dm-c-name{font-weight:600;font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-c-last{font-size:.8rem;color:var(--albatre-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-unread{background:var(--padauk);color:#fff;border-radius:11px;min-width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-style:normal;flex-shrink:0;font-weight:700}
.dm-chat{flex:1;display:flex;flex-direction:column;min-width:0}
.dm-empty{margin:auto;color:var(--albatre-faint)}
.dm-head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid rgba(250,255,245,.1);font-weight:600}
.dm-back{display:none;background:none;border:none;color:var(--albatre);font-size:1.4rem;cursor:pointer;line-height:1}
.dm-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:8px}
.dm-b{max-width:78%;padding:9px 13px;border-radius:15px;font-size:.92rem;line-height:1.45;white-space:pre-wrap;word-break:break-word}
.dm-b.them{align-self:flex-start;background:rgba(250,255,245,.1);border-bottom-left-radius:4px}
.dm-b.me{align-self:flex-end;background:var(--gingembre);color:var(--midnight);border-bottom-right-radius:4px}
.dm-t{display:block;font-size:.64rem;opacity:.6;margin-top:3px}
.dm-form{display:flex;gap:8px;padding:12px;border-top:1px solid rgba(250,255,245,.1)}
.dm-form textarea{flex:1;background:rgba(250,255,245,.06);border:1px solid rgba(250,255,245,.16);border-radius:20px;padding:10px 16px;color:var(--albatre);font-family:'Inter',sans-serif;font-size:.92rem;resize:none}
.dm-form textarea:focus{outline:none;border-color:var(--gingembre)}
html[dir="rtl"] .dm-b.them{align-self:flex-end;border-bottom-left-radius:15px;border-bottom-right-radius:4px}
html[dir="rtl"] .dm-b.me{align-self:flex-start;border-bottom-right-radius:15px;border-bottom-left-radius:4px}
html[dir="rtl"] .dm-back{transform:scaleX(-1)}
@media(max-width:760px){
  .dm{height:calc(100vh - 200px);min-height:340px}
  .dm-list{width:100%}
  .dm-chat{display:none}
  .dm.chat-open .dm-list{display:none}
  .dm.chat-open .dm-chat{display:flex}
  .dm-back{display:block}
}

/* ===== Dossiers (sous-sections : leçons / partitions / paroles) ===== */
.folder{border:1px solid rgba(250,255,245,.1);border-radius:12px;margin-bottom:14px;overflow:hidden;background:rgba(250,255,245,.02)}
.folder-head{display:flex;align-items:center;gap:10px;width:100%;background:rgba(250,255,245,.04);border:none;color:var(--albatre);font-family:'Inter',sans-serif;font-size:1.02rem;font-weight:600;padding:14px 18px;cursor:pointer;text-align:left}
.folder-head:hover{background:rgba(250,255,245,.07)}
.folder-ic{font-size:1.1rem}
.folder-name{flex:1}
.folder-count{background:rgba(250,255,245,.12);color:var(--albatre-soft);border-radius:11px;min-width:24px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:.78rem;padding:0 7px}
.folder-head .chev{transition:transform .25s var(--ease);color:var(--gingembre)}
.folder.open .folder-head .chev{transform:rotate(180deg)}
.folder-body{display:none;padding:16px 18px}
.folder.open .folder-body{display:block}
html[dir="rtl"] .folder-head{text-align:right}

/* ===== LMS — espace élève en application ===== */
body.lms{overflow-x:hidden}
body.lms .cbot-btn,body.lms .cbot-panel,body.lms .wa-btn,body.lms .pwa-install,body.lms .pwa-iostip{display:none !important}
.lms-shell{display:flex;height:100vh;overflow:hidden}
.lms-side{width:250px;flex-shrink:0;background:var(--midnight-2);border-right:1px solid rgba(250,255,245,.08);display:flex;flex-direction:column;padding:22px 16px;position:sticky;top:0;height:100vh}
.lms-brand{display:block;text-align:center;margin-bottom:16px}
.lms-brand img{height:76px;width:auto;display:inline-block}
.lms-menu{display:flex;flex-direction:column;gap:4px}
.lms-link{display:flex;align-items:center;gap:12px;background:none;border:none;color:var(--albatre-soft);font-family:'Inter',sans-serif;font-size:.98rem;font-weight:500;padding:12px 14px;border-radius:10px;cursor:pointer;text-align:left;transition:.2s}
.ms{font-family:'Material Symbols Rounded';font-weight:normal;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;direction:ltr;font-variation-settings:'FILL' 1,'wght' 500,'GRAD' 0,'opsz' 24}
.lms-link .ic{width:26px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--gingembre)}
.lms-link .ic .ms{font-size:24px}
.lms-link.active .ic{color:var(--midnight)}
.lms-side .lms-menu{overflow-y:auto}
.lms-link:hover{background:rgba(250,255,245,.05);color:var(--albatre)}
.lms-link.active{background:var(--gingembre);color:var(--midnight);font-weight:700}
.lms-back{margin-top:auto;color:var(--albatre-faint);font-size:.85rem;text-decoration:none;padding:12px 14px}
.lms-back:hover{color:var(--gingembre)}
.lms-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;margin-left:auto;background:var(--padauk);color:#fff;border-radius:9px;font-size:.7rem;font-style:normal;font-weight:700}
.lms-badge[hidden]{display:none}
html[dir="rtl"] .lms-link .lms-badge{margin-left:0;margin-right:auto}

.lms-main{flex:1;display:flex;flex-direction:column;min-width:0;min-height:100vh}
.lms-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 30px;border-bottom:1px solid rgba(250,255,245,.08);position:sticky;top:0;background:rgba(8,31,44,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:10}
.lms-htitle{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:1.9rem;letter-spacing:.02em;color:var(--albatre);line-height:1}
.lms-who{font-size:.82rem;color:var(--albatre-faint);max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lms-body{flex:1;padding:26px 30px 44px;overflow-y:auto}
.lms-panel{animation:lmsfade .3s var(--ease)}
@keyframes lmsfade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.lms-hello{font-family:'Bebas Neue',sans-serif;font-size:2.3rem;color:var(--albatre);letter-spacing:.02em}
.lms-hello b{color:var(--gingembre);font-weight:400}
.lms-sub{color:var(--albatre-soft);margin:4px 0 22px}
.lms-announce{background:linear-gradient(135deg,rgba(254,255,214,.13),rgba(125,64,69,.16));border:1px solid rgba(254,255,214,.35);border-radius:14px;padding:16px 20px;margin-bottom:22px}
.lms-announce-h{color:var(--gingembre);font-weight:700;margin-bottom:6px}
.lms-announce-b{color:var(--albatre);line-height:1.55;white-space:pre-wrap}
.lms-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:26px}
.lms-card{text-align:left;background:rgba(250,255,245,.04);border:1px solid rgba(250,255,245,.1);border-radius:14px;padding:18px 20px;cursor:pointer;color:var(--albatre);font-family:'Inter',sans-serif;transition:.2s}
.lms-card:hover{transform:translateY(-3px);border-color:rgba(254,255,214,.4)}
.lms-card.warn{border-color:rgba(255,180,120,.45)}
.lms-card-h{font-size:.9rem;color:var(--albatre-soft);margin-bottom:8px}
.lms-card-b{font-size:1.05rem;line-height:1.4}
.lms-card-b b{color:var(--gingembre)}
.lms-quick{display:flex;flex-wrap:wrap;gap:10px}
.lms-q{background:rgba(250,255,245,.06);border:1px solid rgba(250,255,245,.14);color:var(--albatre-soft);border-radius:22px;padding:10px 18px;cursor:pointer;font-family:'Inter',sans-serif;font-size:.9rem;transition:.2s}
.lms-q:hover{background:var(--gingembre);color:var(--midnight)}

.lms-prof{display:flex;align-items:center;gap:18px}
.lms-avatar{position:relative;overflow:hidden;width:78px;height:78px;border-radius:50%;background:var(--gingembre);color:var(--midnight);display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:2.1rem;flex-shrink:0}
.lms-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lms-prof-name{font-size:1.3rem;font-weight:600}
.lms-prof-mail{color:var(--albatre-soft);font-size:.92rem;word-break:break-all}
.lms-prof-lvl{color:var(--albatre-soft);font-size:.92rem;margin-top:4px}
.lms-prof-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.lms-settings{margin-top:8px;max-width:540px}
.lms-set-title{font-size:1.05rem;font-weight:700;margin:26px 0 4px;color:var(--albatre)}
.lms-set-row{display:flex;align-items:center;gap:14px;padding:14px 2px;border-top:1px solid rgba(250,255,245,.08)}
.lms-set-row .ti{flex:1;min-width:0}
.lms-set-row .ti b{display:block;font-size:.95rem}
.lms-set-row .ti span{color:var(--albatre-faint);font-size:.83rem}
.lms-set-form{margin:6px 0 8px;display:flex;flex-direction:column;gap:10px}
.lms-set-form input{background:rgba(250,255,245,.06);border:1px solid rgba(250,255,245,.16);border-radius:10px;padding:11px 14px;color:var(--albatre);font-family:'Inter',sans-serif;font-size:.95rem;width:100%;box-sizing:border-box}
.lms-set-form input:focus{outline:none;border-color:var(--gingembre)}
.lms-set-form .row2{display:flex;gap:10px;flex-wrap:wrap}
.lms-set-msg{font-size:.85rem;margin-top:2px}
.lms-set-msg.ok{color:#7fe0a8}.lms-set-msg.err{color:#ff9a9a}
.pdf-modal{position:fixed;inset:0;z-index:1200;background:rgba(5,9,14,.86);display:flex;flex-direction:column;padding:16px}
.pdf-modal-head{display:flex;align-items:center;gap:10px;color:var(--albatre);padding:0 2px 12px}
.pdf-modal-head h3{flex:1;margin:0;font-size:1.02rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pdf-modal-head a,.pdf-modal-head button{background:rgba(250,255,245,.1);border:1px solid rgba(250,255,245,.22);color:var(--albatre);border-radius:9px;padding:9px 15px;cursor:pointer;font-family:'Inter',sans-serif;font-size:.9rem;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.pdf-modal-head a:hover,.pdf-modal-head button:hover{border-color:var(--gingembre)}
.pdf-zoom{display:flex;align-items:center;gap:6px}
.pdf-zoom .pdf-zo{padding:6px 13px;font-size:1.15rem;line-height:1;font-weight:700}
.pdf-zlvl{min-width:46px;text-align:center;font-size:.85rem;opacity:.85}
.pdf-scroll{flex:1;overflow:auto;border-radius:12px;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y pinch-zoom;display:flex;justify-content:center}
.pdf-pages{display:flex;flex-direction:column;align-items:center;gap:12px;padding:6px 0;transform-origin:top center;will-change:transform}
.pdf-cv{background:#fff;border-radius:6px;box-shadow:0 6px 22px rgba(0,0,0,.45);max-width:100%}
.pdf-load{color:var(--albatre);opacity:.7;padding:30px;font-size:1.4rem}
.pdf-frame{flex:1;border:none;border-radius:12px;background:#fff;width:100%}
@media(max-width:560px){.pdf-modal{padding:8px}.pdf-modal-head{gap:6px;flex-wrap:wrap}.pdf-modal-head h3{flex:1 1 100%;font-size:.92rem;order:-1}.pdf-modal-head a,.pdf-modal-head button{padding:7px 11px}}
.stu-card{background:linear-gradient(135deg,#0c2a38,#163f52);border:1px solid rgba(231,160,82,.4);border-radius:20px;padding:22px;max-width:430px;box-shadow:0 18px 50px rgba(0,0,0,.4);color:var(--albatre)}
.stu-card-top{display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(231,160,82,.25);padding-bottom:15px;margin-bottom:18px}
.stu-logo{width:46px;height:46px;object-fit:contain;flex-shrink:0}
.stu-inst{font-family:'Bebas Neue',sans-serif;font-size:1.4rem;letter-spacing:.04em;color:var(--gingembre);line-height:1}
.stu-subt{font-size:.74rem;color:var(--albatre-soft);text-transform:uppercase;letter-spacing:.2em;margin-top:3px}
.stu-card-body{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.stu-photo{position:relative;width:84px;height:84px;border-radius:14px;overflow:hidden;background:var(--gingembre);color:var(--midnight);display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:2.3rem;flex-shrink:0;border:2px solid rgba(231,160,82,.5)}
.stu-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stu-info{flex:1;min-width:150px}
.stu-name{font-size:1.3rem;font-weight:700;margin-bottom:5px}
.stu-meta{font-size:.88rem;color:var(--albatre-soft);margin-top:2px}
.stu-badge{display:inline-block;margin-top:11px;font-size:.74rem;font-weight:700;padding:4px 12px;border-radius:20px}
.stu-badge.ok{background:rgba(125,224,168,.18);color:#9fe7be;border:1px solid rgba(125,224,168,.4)}
.stu-badge.off{background:rgba(255,200,120,.15);color:#ffce8a;border:1px solid rgba(255,200,120,.4)}
.stu-qr{flex-shrink:0;margin-inline-start:auto}
.stu-qr img{width:100px;height:100px;border-radius:10px;background:#fff;padding:6px;display:block}
.carte-page{background:radial-gradient(circle at 50% -10%,#0e3242,#071821 75%);min-height:100vh;margin:0;font-family:'Inter',sans-serif}
.carte-wrap{max-width:520px;margin:0 auto;padding:42px 18px 60px;text-align:center}
.carte-wrap .stu-card{margin:0 auto;text-align:left}
.carte-brand img{width:60px;margin-bottom:28px}
.carte-foot{margin-top:26px;color:var(--albatre-faint);font-size:.85rem}
.carte-foot a,.carte-brand{color:var(--gingembre);text-decoration:none}
.carte-loading,.carte-err{color:var(--albatre-soft);padding:40px}
.cic{color:var(--gingembre);font-size:21px;flex-shrink:0}
.lms-card-h{display:flex;align-items:center;gap:9px}
.lms-q{display:inline-flex;align-items:center;gap:9px}

.lms-tabbar{display:none}

@media(max-width:880px){
  .lms-side{display:none}
  .lms-shell{display:block;height:auto;overflow:visible}
  .lms-main{min-height:auto}
  .lms-head{padding:16px 18px;padding-top:max(16px,env(safe-area-inset-top))}
  .lms-htitle{font-size:1.6rem}
  .lms-body{padding:18px 16px calc(88px + env(safe-area-inset-bottom));overflow:visible}
  .lms-hello{font-size:2rem}
  .lms-tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:300;background:rgba(8,31,44,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid rgba(250,255,245,.1);padding:8px 4px calc(8px + env(safe-area-inset-bottom))}
  .lms-tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;color:var(--albatre-faint);font-family:'Inter',sans-serif;font-size:.66rem;cursor:pointer;padding:4px 2px;position:relative}
  .lms-tab .ic{height:26px;display:flex;align-items:center;justify-content:center;color:var(--gingembre)}
  .lms-tab .ic .ms{font-size:26px}
  .lms-tab.active{color:var(--gingembre)}
  .lms-tab .lms-badge{position:absolute;top:-3px;left:calc(50% + 6px);margin:0}
}

/* ===== PWA : bouton « Installer » + astuce iOS ===== */
.pwa-install{position:fixed;left:50%;transform:translateX(-50%);bottom:22px;z-index:240;background:var(--gingembre);color:var(--midnight);border:none;border-radius:26px;padding:12px 22px;font-family:'Inter',sans-serif;font-weight:700;font-size:.9rem;cursor:pointer;box-shadow:0 14px 34px -10px rgba(0,0,0,.65);display:inline-flex;align-items:center;gap:8px}
.pwa-install:hover{background:#fff;transform:translateX(-50%) translateY(-2px)}
.pwa-iostip{position:fixed;left:16px;right:16px;bottom:18px;z-index:240;background:rgba(8,31,44,.97);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--albatre);border:1px solid rgba(250,255,245,.16);border-radius:12px;padding:13px 16px;display:flex;align-items:center;gap:12px;font-size:.9rem;line-height:1.5;box-shadow:0 18px 44px -16px rgba(0,0,0,.7);max-width:520px;margin:0 auto}
.pwa-iostip button{margin-inline-start:auto;background:none;border:none;color:var(--albatre-soft);font-size:1.5rem;line-height:1;cursor:pointer;flex-shrink:0;padding:0 4px}
body.menu-open .pwa-install,body.menu-open .pwa-iostip{display:none}

/* ===== Lisibilité mobile : titres qui ne débordent jamais ===== */
.hero h1, .page-banner h1, .sec h2, .cta-band h2, .manifest h2, .sec-head h2 { overflow-wrap:break-word; }
@media(max-width:560px){
  .page-banner h1{font-size:clamp(1.9rem,8.4vw,2.9rem);line-height:1.04}
  .hero h1{font-size:clamp(2.2rem,10vw,3.6rem)}
  .sec h2,.cta-band h2,.manifest h2{font-size:clamp(1.7rem,7vw,2.5rem)}
  .sec-head h2,.feat .head h2,.agenda .head h2,.gallery .head h2{font-size:1.55rem}
  .page-banner .intro,.hero p{font-size:1.04rem}
  .row-head h2{font-size:1.5rem}
}