/* =========================================================
   ODTR — Adaptateur « blocs natifs → expérience cinématique ».
   Chargé sur l'accueil avec cine.css. Fait d'un bloc Bannière
   (cover) portant la classe .scene une scène de la maquette,
   et habille les boucles dynamiques (spectacles, témoignages,
   nouvelles, partenaires) rendues par Query Loop.
   ========================================================= */
main{padding:0}

/* ---------- Scènes = blocs Bannière ---------- */
.scene.wp-block-cover{min-height:100vh;min-height:100svh;scroll-snap-align:start;scroll-snap-stop:always;
  display:flex;align-items:flex-end;justify-content:flex-start;position:relative;z-index:2;
  padding:0 clamp(24px,6vw,90px) clamp(70px,12vh,140px);background:transparent}
.scene.wp-block-cover.centre{align-items:center}
.scene.wp-block-cover>.wp-block-cover__inner-container{max-width:620px;width:100%;margin:0}
.scene.scene-large>.wp-block-cover__inner-container{max-width:900px}
.scene.centre>.wp-block-cover__inner-container{margin:0 auto;text-align:center}
/* le fond du bloc = secours sans JS ; l'expérience active le remplace par le fond fixe en crossfade */
body.cine-actif .scene .wp-block-cover__image-background,
body.cine-actif .scene .wp-block-cover__background{display:none}

/* ---------- Boutons natifs dans les scènes ---------- */
.wp-block-buttons.cta-row{gap:14px;margin-top:30px}
.scene .wp-block-button__link{display:inline-flex;align-items:center;gap:10px;border:1.5px solid var(--vert);
  transition:transform .3s,background .3s,color .3s,border-color .3s}
.scene .wp-block-button__link:hover{transform:translateY(-2px)}
.scene .is-style-outline>.wp-block-button__link{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.scene .is-style-outline>.wp-block-button__link:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
.scene .btn-don>.wp-block-button__link{background:var(--rouge);border-color:var(--rouge);color:#fff;animation:donPulse 1.8s ease-in-out infinite}

/* ---------- Citations ---------- */
.scene .wp-block-quote{border-left:3px solid var(--vert);padding-left:20px;margin:22px 0;
  font-family:var(--serif);font-style:italic;font-size:clamp(1.05rem,1.6vw,1.3rem);line-height:1.5}

/* ---------- Piliers / paliers (colonnes) ---------- */
.wp-block-columns.piliers-inline{gap:30px;margin-top:24px}
.piliers-inline p{font-size:.86rem;color:rgba(255,255,255,.75);font-weight:300;margin:0}
.piliers-inline p strong{display:block;font-family:var(--serif);color:var(--vert-clair);font-size:1.15rem;font-weight:500;margin-bottom:4px}
.soutenir-scene .piliers-inline p strong{color:var(--rouge-clair)}

/* ---------- Engagement (colonnes-cartes) ---------- */
.wp-block-columns.engage-row{gap:16px;margin-top:8px}
.engage-row .wp-block-column{border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:24px;
  background:rgba(1,0,42,.3);backdrop-filter:blur(4px)}
.engage-row h3{font-size:1.15rem;margin:0 0 8px}
.engage-row p{font-size:.84rem;color:rgba(255,255,255,.78);font-weight:300;margin:0 0 16px}

/* ---------- Boucles dynamiques ---------- */
.scene ul.wp-block-post-template{list-style:none;padding:0;margin:14px 0 0}

/* cartes (spectacles / nouvelles) — fidèles aux .evt-card de la maquette :
   image plein cadre derrière, dégradé, contenu posé en bas */
.evt-q ul.wp-block-post-template{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.evt-q li{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:3/3.5;isolation:isolate;
  display:flex;flex-direction:column;justify-content:flex-end;padding:20px;
  box-shadow:0 16px 40px rgba(0,0,20,.45);transition:transform .5s;background:rgba(1,0,42,.5)}
.evt-q li:hover{transform:translateY(-6px)}
.evt-q li::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(2,0,50,.05) 32%,rgba(2,0,50,.55) 62%,rgba(2,0,45,.95))}
.evt-q li .wp-block-post-featured-image{position:absolute;inset:0;z-index:-2;margin:0}
.evt-q li .wp-block-post-featured-image a{display:block;height:100%}
.evt-q li .wp-block-post-featured-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s}
.evt-q li:hover .wp-block-post-featured-image img{transform:scale(1.07)}
.evt-q li .wp-block-post-terms{align-self:flex-start;border:1px solid rgba(195,205,131,.5);color:var(--vert-clair);
  font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:5px 11px;
  border-radius:40px;margin:0 0 12px;background:rgba(1,0,42,.35)}
.evt-q li .wp-block-post-terms a{color:inherit;text-decoration:none}
.evt-q li .wp-block-post-title{font-family:var(--serif);font-size:1.4rem;line-height:1.05;margin:0 0 8px;font-weight:400}
.evt-q li .wp-block-post-title a{text-decoration:none;color:#fff}
.evt-q li p,.evt-q li .wp-block-post-date{font-size:.78rem;color:rgba(255,255,255,.85);margin:0 0 6px;display:block}
.evt-q li .wp-block-read-more{align-self:flex-start;font-size:.66rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;background:var(--vert);color:var(--bleu);padding:8px 14px;border-radius:3px;
  text-decoration:none;margin-top:8px}

/* témoignages */
.tem-q ul.wp-block-post-template{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tem-q li{border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:26px;background:rgba(1,0,42,.34);backdrop-filter:blur(4px)}
.tem-q li .wp-block-post-excerpt,.tem-q li .wp-block-post-excerpt p{font-family:var(--serif);font-style:italic;
  font-size:1.02rem;line-height:1.45;color:#fff;margin:0}
.tem-q li .wp-block-post-title{font-family:var(--ui);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--vert-clair);margin:16px 0 0;font-weight:600}

/* partenaires (piste défilante — dupliquée par cine.js) */
.parten ul.wp-block-post-template{display:flex;gap:14px;width:max-content;margin:0}
.parten li{flex:none;display:flex;align-items:center;gap:11px;border:1px solid rgba(255,255,255,.2);border-radius:8px;
  padding:12px 20px;font-family:var(--serif);color:rgba(255,255,255,.82);font-size:.92rem;white-space:nowrap}
.parten li .wp-block-post-featured-image{margin:0}
.parten li img{width:34px;height:34px;object-fit:contain;border-radius:6px;background:#fff;padding:3px}
.parten li .wp-block-post-title{font-size:inherit;margin:0;font-weight:400;font-family:inherit}

/* ---------- En-tête cinématique (partie de modèle) ---------- */
.entete .wp-block-site-title{margin:0}
.entete .wp-block-site-title a{font-family:var(--serif);font-weight:500;font-size:1.5rem;color:#fff;
  text-decoration:none;text-shadow:0 2px 14px rgba(0,0,20,.5)}
.entete .wp-block-navigation a{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;opacity:.88}
.entete .wp-block-navigation a:hover{opacity:1}

/* ---------- Scène finale (bloc odtr/rester, markup maquette) ---------- */
.odtr-rester{width:100%}
.scene .billet{text-align:left;max-width:none}
.scene .billet h2{font-size:clamp(1.3rem,2.4vw,1.7rem)}
.parten .p img{width:34px;height:34px;object-fit:contain;border-radius:9px;background:#fff;padding:2px;flex:none}
.info-form button.btn{cursor:pointer;font-family:var(--ui)}

/* ---------- Partenaires : taille +20 % (demande client) ---------- */
.parten .p,.parten li{padding:14px 24px;font-size:1.1rem;gap:13px}
.parten .p img,.parten li img{width:41px;height:41px}
.pl-mark{width:41px;height:41px;font-size:.86rem;border-radius:11px}

/* ---------- Responsive ---------- */
@media(max-width:820px){
  .evt-q ul.wp-block-post-template,.tem-q ul.wp-block-post-template{grid-template-columns:1fr}
  .evt-q li{aspect-ratio:16/9}
}
