/* ============================================================
   Passerelle entre la charte ALOIA (app.css) et le DOM d'Elementor.
   Elementor enveloppe chaque widget dans .elementor-widget >
   .elementor-widget-container : les regles de app.css ecrites pour la
   maquette statique ne tombent pas toujours au bon endroit. Ce fichier
   ne fait que ce raccord, il n'invente aucun style.
   ============================================================ */

/* ------------------------------------------------------------------
   app.css vient de la maquette statique : ses regles de mise en page
   (display:grid, colonnes) ecrasent le display:var(--display) des
   conteneurs Elementor et cassent les largeurs reglees dans l'editeur.
   On leur rend la main ici ; app.css ne sert plus qu'a la decoration.
   ------------------------------------------------------------------ */
.e-con.hero,.e-con.studio,.e-con.event,.e-con.disc,.e-con.story,
.e-con.pagehead,.e-con.courses,.e-con.community,.e-con.faq,
.e-con.closing,.e-con.brandline,.e-con.band,.e-con.plans,
.e-con.card,.e-con.evt,.e-con.variant,.e-con.cube,.e-con.sub,
.e-con.studio-side,.e-con.studio-content,.e-con.event-panel,
.e-con.disc-body,.e-con.story-body,.e-con.pagehead-side,
.e-con.card-body,.e-con.faq-list,.e-con.anchors,.e-con.pricegroup,
.e-con.wrap,.e-con.variants,.e-con.evts,.e-con.courses-grid,
.e-con.cubes,.e-con.subs{
  display:var(--display);
  grid-template-columns:none;
}

/* Les conteneurs Elementor sont en flex via --display : on retablit les grilles
   du design. Il faut redefinir la variable, un simple display:grid ne suffit pas. */
.e-con.e-con.courses-grid,.e-con.e-con.evts,.e-con.e-con.variants,
.e-con.e-con.cubes,.e-con.e-con.subs{--display:grid}
.e-con.e-con.courses-grid{grid-template-columns:repeat(4,1fr);gap:26px}
.e-con.e-con.evts{grid-template-columns:repeat(3,1fr);gap:26px}
.e-con.e-con.variants{grid-template-columns:repeat(3,1fr);gap:20px}
.e-con.e-con.cubes{grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:18px}
.e-con.e-con.subs{grid-template-columns:repeat(auto-fit,minmax(228px,1fr));gap:18px}
.courses-grid > .e-con,.evts > .e-con,.variants > .e-con,
.cubes > .e-con,.subs > .e-con{width:auto;max-width:none}

/* ---------- Cartes de cours ---------- */
.e-con.card{
  background:var(--white);border-radius:var(--radius);overflow:hidden;
  box-shadow:0 16px 44px rgba(61,37,0,.10);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease);
}
.e-con.card:hover{transform:translateY(-10px);box-shadow:0 30px 66px rgba(61,37,0,.18)}
.card .card-img{aspect-ratio:5/7;overflow:hidden;width:100%}
.card .card-img .elementor-widget-container,
.card .card-img figure,
.card .card-img .elementor-image{height:100%;margin:0}
.card .card-img img{
  width:100%;height:100%;object-fit:cover;object-position:center bottom;
  transition:transform .7s var(--ease);
}
.card .card-img img[src*="cours-prive"]{object-position:center 70%}
.e-con.card:hover .card-img img{transform:scale(1.07)}
.e-con.card-body{gap:12px}
.card-body .elementor-widget-heading{margin:0}

/* Boutons : la classe du design s'applique au widget, le style est sur le <a>. */
.card-btn .elementor-button{
  padding:12px 24px;font-size:12px;letter-spacing:.12em;border-radius:50px;
}
.btn-hero .elementor-button{
  padding:21px 44px;font-size:15px;box-shadow:0 16px 40px rgba(61,37,0,.35);
}
@media (max-width:760px){
  .btn-hero .elementor-button{padding:17px 30px;font-size:13.5px}
}

/* ---------- Hero ---------- */
.hero .hero-logo img{filter:drop-shadow(0 18px 50px rgba(0,0,0,.45))}
.hero .hero-tagline p{
  margin:0;font-weight:600;letter-spacing:.3em;
  font-size:clamp(11px,1.6vw,14px);text-transform:uppercase;
}
@media (max-width:760px){.hero .hero-logo img{filter:none}}

/* ---------- Bande signature ---------- */
.brandline .elementor-heading-title{
  font-size:clamp(24px,4.6vw,56px);line-height:1.06;font-weight:800;
}
.brandline .dots::before,.brandline .dots::after{background:var(--brown)}

/* ---------- Bloc concept / recit ---------- */
.studio-lead p{margin:0;font-weight:600;font-size:clamp(19px,2.2vw,25px);line-height:1.4}
.story-strong p{margin:0;font-weight:700;font-size:clamp(17px,2vw,21px);line-height:1.45}

/* ---------- Bloc evenement ---------- */
.event-place p{margin:0;font-weight:700;font-size:13px;letter-spacing:.14em}
.event-note p{margin:0;max-width:46ch}

/* ---------- Cartes communaute ---------- */
.e-con.evt{
  background:var(--white);border-radius:var(--radius);
  box-shadow:0 14px 38px rgba(61,37,0,.09);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease);
}
.e-con.evt:hover{transform:translateY(-8px);box-shadow:0 26px 54px rgba(61,37,0,.15)}
.evt .elementor-heading-title{letter-spacing:.16em}

/* ---------- Textes centres ---------- */
.community-intro p{margin:0;max-width:70ch;margin-inline:auto}
.community-note p{margin:0;font-weight:600;font-size:15px}

/* ---------- FAQ ---------- */
.faq-list .elementor-accordion .elementor-accordion-item{
  background:var(--cream);border:2px solid transparent;border-radius:20px;
  margin-bottom:14px;overflow:hidden;
}
.faq-list .elementor-accordion .elementor-tab-title{
  border:0;padding:20px 26px;font-weight:600;font-size:17.5px;
}
.faq-list .elementor-accordion .elementor-tab-title.elementor-active{border:0}
.faq-list .elementor-accordion-item:has(.elementor-active){border-color:var(--yellow)}
.faq-list .elementor-tab-content{border:0;padding:0 26px 20px;color:var(--brown-soft);font-size:16px}
.faq-list .elementor-accordion-icon{color:var(--brown)}

/* ---------- Pages interieures ---------- */
.pagehead-lead p{margin:0;font-weight:600;font-size:clamp(18px,2.1vw,24px);line-height:1.4}
.pricegroup-sub p{margin:0;font-weight:700;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase}
.band-lead p{margin:0;font-weight:600;font-size:clamp(18px,2.1vw,23px);line-height:1.45}
.band-note p{margin:0;font-size:15px}
.disc-meta p{margin:0}

/* Les pastilles d'ancres et les pilules d'info sont rendues en HTML brut. */
.anchors-inner a,.disc-meta li{text-decoration:none}

/* ---------- Adaptations ---------- */
@media (max-width:1100px){
  .e-con.e-con.courses-grid{grid-template-columns:repeat(2,1fr)}
  .e-con.e-con.variants{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .e-con.e-con.evts{grid-template-columns:1fr;max-width:460px;margin-inline:auto}
}
@media (max-width:760px){
  .e-con.e-con.courses-grid{grid-template-columns:1fr;gap:20px}
  .e-con.e-con.variants{grid-template-columns:1fr}
  .e-con.e-con.cubes{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
}

/* L'accordeon herite de la typo globale "Titres" (majuscules, 800) : on
   revient a l'intitule de question de la maquette. */
.faq-list .elementor-accordion .elementor-tab-title,
.faq-list .elementor-accordion .elementor-tab-title .elementor-accordion-title,
.faq-list .elementor-accordion .elementor-tab-title a{
  font-family:var(--font);font-size:17.5px;font-weight:600;line-height:1.5;
  text-transform:none;letter-spacing:0;color:var(--brown);
}
.faq-list .elementor-accordion .elementor-tab-title.elementor-active,
.faq-list .elementor-accordion .elementor-tab-title.elementor-active .elementor-accordion-title{
  color:var(--brown);
}
.faq-list .elementor-accordion .elementor-accordion-icon{color:var(--brown);width:auto}
.faq-list .elementor-accordion .elementor-tab-content p{margin:0}