/* ===== PAGES PROGRAMME (galerie d'événements) + détail d'un événement =====
   Layout galerie repris du modèle "Gallery #08" : rangée de cartes (cover image),
   flèches en bas à droite, filet, puis grand numéro + grand mot "PROGRAMME".
   Tient sur un seul écran (page-gallery = height:100vh, sans scroll).

   Police d'affichage : General Sans (grotesk, AVEC chiffres).
   ⚠️ Mactis (police du logo) n'a QUE les lettres — pas de chiffres — donc on ne
   l'utilise pas ici (sinon glyphe .notdef "Timeless type"). */

:root{
  --ink:#0a0a0a;
  --paper:#ffffff;
  --accent:#5a83a2;         /* accent = même bleu que le menu (ex-orange) */
  --blue:#6b93b0;           /* bleu cassé — hover des jours (page Semaine) */
  --muted:#8a8a8a;
  --line:rgba(255,255,255,.14);
  --gutter:clamp(1.25rem, 4vw, 4rem);
}

*{ box-sizing:border-box; }
html,body{ margin:0; }

/* Fond : coup de pinceau blanc (image plein écran, derrière tout le contenu) */
.proj-bg{
  position:fixed; inset:0; z-index:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  pointer-events:none; user-select:none;
}
/* léger voile sombre AU-DESSUS du pinceau (mais sous le contenu z-index:1)
   pour garder texte + cartes lisibles. ::after = peint après l'image. */
body.page-gallery::after{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(120% 90% at 50% 45%, rgba(10,10,10,.15), rgba(10,10,10,.62));
}
/* le contenu de la galerie passe au-dessus du fond animé */
.prog-nav, .prog-main, .sem-grad{ position:relative; z-index:1; }

/* ===== Page Transitions #1 — ARRIVÉE : voile plein écran présent au chargement,
   qui se rétracte vers le haut → la page se révèle du bas vers le haut.
   Voir js/kultur-pt1-enter.js. ===== */
.pt1-boot{
  position:fixed; inset:0; z-index:100000;
  background:var(--ink);
  clip-path:inset(0% 0% 0% 0%);      /* couvre tout au départ */
  will-change:clip-path;
  pointer-events:none;
  /* Révélation auto en CSS (robuste : marche même si le JS ne tourne pas) :
     le voile se rétracte vers le haut → la page apparaît du bas vers le haut. */
  animation:pt1BootReveal .7s cubic-bezier(.65,.05,.36,1) forwards;
}
@keyframes pt1BootReveal{
  from{ clip-path:inset(0% 0% 0% 0%); }
  to{   clip-path:inset(0% 0% 100% 0%); }
}
@media (prefers-reduced-motion:reduce){
  .pt1-boot{ display:none; }
}
body{
  background:var(--ink);
  color:var(--paper);
  font-family:'Inter',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }

/* La page galerie tient sur un écran, sans scroll */
.page-gallery{ height:100vh; overflow:hidden; display:flex; flex-direction:column; }

/* ---- Barre du haut ---- */
.prog-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:clamp(1rem,2.2vw,1.6rem) var(--gutter);
  font-size:.8rem;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.prog-nav a{ transition:color .2s; }
.prog-nav a:hover{ color:var(--accent); }
.prog-brand{ font-family:'General Sans',sans-serif; font-weight:800; letter-spacing:.12em; }
.prog-nav-links{ display:flex; gap:2rem; }

/* ================= PAGE GALERIE ================= */
.prog-main{
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
  justify-content:space-between;    /* pousse le grand titre en bas */
  padding:clamp(1rem,2.5vw,2rem) var(--gutter) clamp(1.25rem,3vw,2.5rem);
  gap:clamp(1rem,2.5vw,2rem);
}

/* Rangée de cartes défilable */
.ev-row{
  display:flex;
  gap:clamp(1rem,2vw,1.8rem);
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
}
.ev-row::-webkit-scrollbar{ display:none; }

.ev-card{ flex:0 0 auto; width:clamp(190px,29vh,290px); scroll-snap-align:start; }

.ev-tile{
  position:relative;
  aspect-ratio:3/4;
  border-radius:4px;
  overflow:hidden;
  background-size:cover;
  background-position:center;
  transition:transform .35s;
}
/* Voile pour lisibilité du numéro/flèche + assombrissement léger */
.ev-tile::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,0) 30%);
  transition:background .35s;
}
.ev-card:hover .ev-tile{ transform:translateY(-6px); }
.ev-card:hover .ev-tile::after{ background:linear-gradient(180deg, rgba(90,131,162,.35) 0%, rgba(0,0,0,.15) 60%); }

.ev-idx{
  position:absolute; top:.9rem; left:1rem; z-index:2;
  font-family:'General Sans',sans-serif; font-weight:800;
  font-size:.9rem; letter-spacing:.14em; color:#fff;
}
.ev-go{
  position:absolute; top:.7rem; right:.8rem; z-index:2;
  width:36px; height:36px; border:1px solid rgba(255,255,255,.5); border-radius:50%;
  display:grid; place-items:center; transition:border-color .35s, background .35s;
}
.ev-card:hover .ev-go{ border-color:var(--accent); background:var(--accent); }
.ev-go svg{ width:15px; height:15px; stroke:#fff; fill:none; stroke-width:1.6; }

/* Légende sous la carte : titre + date (rien d'autre) */
.ev-cap{ margin-top:.75rem; }
.ev-title{
  font-family:'General Sans',sans-serif;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.02em;
  font-size:1rem;
  line-height:1.15;
}
.ev-meta{
  margin-top:.3rem;
  font-size:.76rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
  transition:color .2s;
}
.ev-card:hover .ev-meta{ color:var(--accent); }

/* Flèches de navigation (bas droite) */
.gallery-controls{ display:flex; justify-content:flex-end; gap:.9rem; }
.gc-btn{
  width:clamp(44px,4.5vw,56px); height:clamp(44px,4.5vw,56px);
  border:1px solid var(--line); border-radius:50%;
  background:none; color:var(--paper); cursor:pointer;
  display:grid; place-items:center; transition:border-color .25s, background .25s, opacity .25s;
}
.gc-btn:hover{ border-color:var(--accent); background:var(--accent); }
.gc-btn:disabled{ opacity:.3; cursor:default; }
.gc-btn:disabled:hover{ border-color:var(--line); background:none; }
.gc-btn svg{ width:19px; height:19px; stroke:currentColor; fill:none; stroke-width:1.5; }

/* Filet + grand titre bas de page */
.prog-foot-wrap{ border-top:1px solid var(--line); padding-top:clamp(1rem,2vw,1.75rem); }
.prog-foot{ display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; }
.prog-num, .prog-word{
  font-family:'General Sans',sans-serif;
  font-weight:800;
  line-height:.78;
  letter-spacing:-.01em;
  white-space:nowrap;
}
/* Taille bornée par la largeur (vw) ET la hauteur (vh) → tient toujours dans l'écran */
.prog-num{ font-size:clamp(1.6rem, 9.5vw, 7vh); }
.prog-word{ font-size:clamp(2.5rem, 13.5vw, 9.5vh); text-align:right; }

/* ===== Cube Roll : chaque lettre de PROJETS roule en cube 3D, en boucle ===== */
.prog-word.cube{ perspective:600px; }
.cube-char{
  display:inline-block; position:relative;
  transform-style:preserve-3d; will-change:transform;
  animation:cubeRoll var(--dur,6.4s) cubic-bezier(.785,.135,.15,.86) var(--delay,0s) infinite;
}
.cube-face{ display:block; backface-visibility:hidden; white-space:pre; font-style:inherit; }
.cube-char .face-front{
  position:relative; transform:translateZ(var(--d,.5em)); opacity:1;
  animation:cubeFront var(--dur,6.4s) cubic-bezier(.785,.135,.15,.86) var(--delay,0s) infinite;
}
.cube-char .face-top{
  position:absolute; inset:0; transform:rotateX(-90deg) translateZ(var(--d,.5em)); opacity:.65;
  animation:cubeTop var(--dur,6.4s) cubic-bezier(.785,.135,.15,.86) var(--delay,0s) infinite;
}
.cube-char .face-bottom{
  position:absolute; inset:0; transform:rotateX(90deg) translateZ(var(--d,.5em)); opacity:.65;
  animation:cubeBottom var(--dur,6.4s) cubic-bezier(.785,.135,.15,.86) var(--delay,0s) infinite;
}
.cube-char .face-back{
  position:absolute; inset:0; transform:rotateX(180deg) translateZ(var(--d,.5em)); opacity:0;
  animation:cubeBack var(--dur,6.4s) cubic-bezier(.785,.135,.15,.86) var(--delay,0s) infinite;
}
/* 5 points = rotation 360° complète → 0° et 360° identiques (pas de saut à la reprise) */
@keyframes cubeRoll{
  0%{ transform:rotateX(0deg); } 25%{ transform:rotateX(-90deg); }
  50%{ transform:rotateX(-180deg); } 75%{ transform:rotateX(-270deg); }
  100%{ transform:rotateX(-360deg); }
}
@keyframes cubeFront{  0%{opacity:1}   25%{opacity:.65} 50%{opacity:0}   75%{opacity:.65} 100%{opacity:1} }
@keyframes cubeTop{    0%{opacity:.65} 25%{opacity:0}   50%{opacity:.65} 75%{opacity:1}   100%{opacity:.65} }
@keyframes cubeBottom{ 0%{opacity:.65} 25%{opacity:1}   50%{opacity:.65} 75%{opacity:0}   100%{opacity:.65} }
@keyframes cubeBack{   0%{opacity:0}   25%{opacity:.65} 50%{opacity:1}   75%{opacity:.65} 100%{opacity:0} }
@media (prefers-reduced-motion:reduce){
  .cube-char, .cube-char .cube-face{ animation:none !important; }
  .cube-char .face-front{ opacity:1 !important; }
  .cube-char .face-top, .cube-char .face-bottom, .cube-char .face-back{ opacity:0 !important; }
}

/* ================= PAGE DÉTAIL (programme complet) ================= */
.ev-detail{ max-width:1120px; margin:0 auto; width:100%; padding:clamp(1.5rem,4vw,3rem) var(--gutter) clamp(4rem,8vw,7rem); }

/* ===== SEMAINE — HERO : page NOIRE, grand titre en HAUT (bicolore selon le fond),
   image (mêmes tons orange) sur toute la partie droite, 2 paragraphes titrés à gauche. ===== */
.sem-main{ width:100%; }
.sem-hero{
  position:relative;
  min-height:100vh;
  padding:clamp(5.5rem,12vh,8.5rem) var(--gutter) clamp(3rem,6vw,5rem);
  overflow:hidden;
}
/* image : toute la partie droite, pleine hauteur */
.sem-figure{
  position:absolute; top:0; right:0; bottom:0;
  width:clamp(300px,45vw,760px);
  height:100%;
  margin:0;
  overflow:hidden;
  z-index:0;
}
.sem-figure img{
  width:100%; height:100%; object-fit:cover;   /* couleurs d'origine */
}
/* Collage des photos du dossier (comme la couverture) sur toute la partie droite */
.sem-collage{
  position:absolute; inset:0;
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(.35rem,.7vw,.6rem); padding:clamp(.35rem,.7vw,.6rem);
}
.sem-col{ display:flex; flex-direction:column; gap:clamp(.35rem,.7vw,.6rem); min-height:0; }
.sem-col--mid{ margin-top:12%; }
.sem-collage img{
  width:100%; flex:1 1 0; min-height:0;
  object-fit:cover; border-radius:10px; display:block;
}
@media (max-width:760px){
  .sem-col--mid{ margin-top:0; }
  .sem-collage img{ min-height:26vw; }
}
/* grand titre plein largeur : blanc sur le noir, s'inverse sur l'image (blend) */
.sem-giant{
  position:relative; z-index:2;
  margin:0;
  /* Police du dossier : "Bagel Fat One" (titre gras arrondi de la couverture PDF) */
  font-family:'Bagel Fat One','General Sans',sans-serif; font-weight:400; text-transform:uppercase;
  font-size:clamp(2.4rem,11.2vw,9rem);
  line-height:.92; letter-spacing:0;
  color:#fff;
  mix-blend-mode:difference;           /* changement de couleur selon le fond */
}
/* Titre sur 2 lignes : « Semaine de la » puis « culture » (chaque .fx5 = une ligne) */
.sem-giant .fx5{ display:block; }
/* 2 paragraphes titrés à gauche, sous le titre (hors de l'image) */
.sem-copy{
  position:relative; z-index:1;
  width:min(46%,540px);
  margin-top:clamp(2rem,5vw,3.5rem);
  display:flex; flex-direction:column; gap:clamp(1.4rem,3vw,2.2rem);
}
.sem-eyebrow{
  color:var(--accent); font-size:.82rem; letter-spacing:.2em; text-transform:uppercase;
  font-family:'General Sans',sans-serif; font-weight:700;
}
.sem-para-title{
  font-family:'General Sans',sans-serif; font-weight:800; text-transform:uppercase;
  font-size:clamp(1rem,2vw,1.25rem); letter-spacing:.12em; color:var(--muted); margin:0 0 .6rem;
}
/* Paragraphes : même police que le reste du site (General Sans / --font-ui), plus petits */
.sem-para p{
  margin:0;
  font-family:var(--font-ui); font-weight:400; letter-spacing:.005em;
  font-size:clamp(.9rem,1vw,1.02rem); line-height:1.6; color:#d4d4d4; text-align:justify;
}
/* Tout le bloc de texte (eyebrow + paragraphes + liste) apparaît en fondu à l'arrivée
   à l'écran (classe .in ajoutée par kultur-semaine.js). */
.sem-fade{ opacity:0; transition:opacity 1s ease; }
.sem-fade.in{ opacity:1; }
@media (prefers-reduced-motion:reduce){ .sem-fade{ opacity:1; transition:none; } }
.sem-para .ev-list{ margin-top:1.1rem; }
/* Bouton billetterie : plein accent, bien visible dans le hero */
.sem-cta{
  align-self:flex-start;
  display:inline-flex; align-items:center; gap:.7rem;
  margin-top:clamp(.6rem,1.5vw,1.2rem);
  padding:clamp(.85rem,1.4vw,1.05rem) clamp(1.5rem,2.4vw,2rem);
  background:var(--accent); color:#fff;
  font-family:'General Sans',sans-serif; font-weight:700;
  font-size:clamp(.95rem,1.1vw,1.08rem); letter-spacing:.04em; text-transform:uppercase;
  text-decoration:none; border-radius:999px;
  box-shadow:0 8px 24px rgba(90,131,162,.35);
  transition:transform .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s ease, background .3s ease;
}
.sem-cta:hover{
  transform:translateY(-3px);
  background:#6f97b6;
  box-shadow:0 12px 30px rgba(90,131,162,.5);
}
.sem-cta-arrow{ transition:transform .3s cubic-bezier(.22,.61,.36,1); }
.sem-cta:hover .sem-cta-arrow{ transform:translateX(5px); }
@media (prefers-reduced-motion:reduce){
  .sem-cta, .sem-cta-arrow{ transition:none; }
  .sem-cta:hover{ transform:none; }
}
@media (max-width:760px){
  .sem-hero{ min-height:auto; padding-top:clamp(5rem,16vw,7rem); }
  .sem-figure{ position:relative; width:100%; height:auto; min-height:56vw; margin-bottom:2rem; }
  .sem-giant{ font-size:clamp(2.4rem,14vw,5rem); }
  .sem-copy{ width:100%; }
}
.ev-head{ padding:clamp(2rem,6vw,5rem) 0 clamp(2rem,5vw,3.5rem); border-bottom:1px solid var(--line); }
.ev-eyebrow{ color:var(--accent); font-size:.82rem; letter-spacing:.2em; text-transform:uppercase; margin-bottom:1.2rem; }
.ev-h1{
  font-family:'General Sans',sans-serif;
  font-weight:800; text-transform:uppercase;
  font-size:clamp(2.6rem,8vw,6rem); line-height:.92; letter-spacing:.01em; margin:0;
}
.ev-dates{ margin-top:1.4rem; color:var(--accent); font-size:clamp(1rem,2vw,1.3rem); letter-spacing:.08em; text-transform:uppercase; }
.ev-intro{ margin-top:1.6rem; max-width:60ch; font-size:1.05rem; line-height:1.6; color:#cfcfcf; }

.ev-block{ padding-top:clamp(2rem,5vw,3.5rem); }
.ev-block h2{
  font-family:'General Sans',sans-serif; font-weight:800; text-transform:uppercase;
  font-size:clamp(1.1rem,2.4vw,1.5rem); letter-spacing:.14em; color:var(--muted); margin:0 0 1.5rem;
}
.ev-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.9rem; }
.ev-list li{
  position:relative; padding-left:1.6rem; line-height:1.5;
  font-family:var(--font-ui); font-weight:400; letter-spacing:.005em;
  font-size:clamp(.9rem,1vw,1.02rem); color:#d4d4d4;
}
.ev-list li::before{ content:""; position:absolute; left:0; top:.55em; width:9px; height:9px; border-radius:50%; background:var(--accent); }

.day{ display:grid; grid-template-columns:120px 1fr; gap:1.2rem 1.8rem; padding:1.4rem 0; border-top:1px solid var(--line); }
.day:last-child{ border-bottom:1px solid var(--line); }
.day-tag{ font-family:'General Sans',sans-serif; font-weight:800; color:var(--accent); font-size:1.15rem; letter-spacing:.06em; text-transform:uppercase; }
.day-type{ font-family:'General Sans',sans-serif; font-weight:800; text-transform:uppercase; letter-spacing:.05em; font-size:1.15rem; margin-bottom:.4rem; }
.day-desc{ color:#bdbdbd; font-size:1rem; line-height:1.55; }

.ev-contact{ margin-top:clamp(2.5rem,6vw,4rem); font-size:.95rem; line-height:1.7; color:var(--muted); }
.ev-contact a{ color:var(--accent); }

@media (max-width:640px){
  .prog-foot{ flex-direction:column; align-items:flex-start; gap:.2rem; }
  .prog-word{ text-align:left; }
  .day{ grid-template-columns:1fr; gap:.4rem; }
}

/* ===== Fond dégradé orange animé (page dossier "Semaine de la Culture") =====
   Blob radial couleur marque, derrière le contenu (z-index:-1, au-dessus du fond noir).
   Dérive lente + forme (border-radius) qui vacille légèrement. */
.sem-grad{
  position:fixed;
  inset:0;
  z-index:-1;
  overflow:hidden;
  pointer-events:none;
}
.sem-grad::before{
  content:"";
  position:absolute;
  left:22%;
  top:8%;
  width:78vmax;
  height:78vmax;
  background:radial-gradient(circle at center,
    rgba(90,131,162,.50) 0%,
    rgba(90,131,162,.20) 38%,
    rgba(90,131,162,0) 68%);
  border-radius:44% 56% 62% 38% / 48% 42% 58% 52%;
  filter:blur(30px);
  will-change:transform, border-radius;
  animation:semDrift 32s ease-in-out infinite alternate,
            semMorph 19s ease-in-out infinite alternate;
}
@keyframes semDrift{
  from{ transform:translate(-8%,-6%) scale(1); }
  to{   transform:translate(11%,9%) scale(1.07); }
}
@keyframes semMorph{
  from{ border-radius:44% 56% 62% 38% / 48% 42% 58% 52%; }
  to{   border-radius:60% 40% 44% 56% / 56% 58% 42% 44%; }
}
@media (prefers-reduced-motion: reduce){
  .sem-grad::before{ animation:none; }
}

/* ===== Programme en "platine vinyle" =====
   Jours à gauche (lun–jeu) et à droite (ven–dim), disque noir au centre.
   Survol d'un jour → texte adapté dans le bandeau du bas ; le disque tourne selon
   la position de la souris (JS kultur-vinyl.js). */
/* ===== Programme "SEKO" : lignes de jours séparées par une bande, qui s'épaississent
   au survol pour révéler l'info. Fond transparent (dégradé conservé). ===== */
.seko-prog{ padding-top:clamp(3rem,7vw,5.5rem); }
.seko-prog h2{ margin-bottom:clamp(1.6rem,4vw,3rem); }
.seko-list{ list-style:none; margin:0; padding:0; }
.seko-row{
  border-top:1px solid var(--line);
  padding:clamp(1.1rem,2.6vw,2rem) 0;
  cursor:pointer;
  transition:padding .45s cubic-bezier(.76,0,.24,1);   /* même courbe fluide que la barre de menu */
}
.seko-row:last-child{ border-bottom:1px solid var(--line); }
.seko-row-head{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:baseline;
  gap:clamp(1rem,3vw,2.5rem);
}
.sr-title{
  font-family:'General Sans',sans-serif; font-weight:800; text-transform:uppercase;
  font-size:clamp(1.9rem,5.5vw,4rem); line-height:.95; letter-spacing:.01em;
  transition:color .3s ease;
}
.sr-meta{
  text-align:right; white-space:nowrap;
  font-size:.76rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
  transition:color .3s ease;
}
/* la ligne s'épaissit au survol + révèle l'info (état .is-open piloté par JS) */
.seko-row.is-open{ padding-top:clamp(1.7rem,3.6vw,3rem); padding-bottom:clamp(1.7rem,3.6vw,3rem); }
.seko-row.is-open .sr-title{ color:var(--blue); }         /* hover extend en bleu cassé */
.seko-row.is-open .sr-meta{ color:var(--blue); }
/* Zone dépliée : la hauteur est pilotée en JS (max-height inline = scrollHeight),
   ces valeurs restent des filets de sécurité si le JS ne tourne pas. */
.sr-info{
  max-height:0; opacity:0; overflow:hidden;
  transition:max-height .55s cubic-bezier(.76,0,.24,1),
             opacity .5s ease,
             margin-top .55s cubic-bezier(.76,0,.24,1);
}
.seko-row.is-open .sr-info{ max-height:1600px; opacity:1; margin-top:1.1rem; }

/* ===== Panneau coloré du jour (repris des fonds du dossier) ===== */
.sr-panel{
  border-radius:clamp(12px,1.4vw,18px);
  padding:clamp(1.1rem,2.4vw,1.9rem);
  box-shadow:0 18px 50px rgba(0,0,0,.35);
}
/* Dégradés par jour — échantillonnés depuis le dossier PDF */
.sr-panel[data-daybg="lundi"]{    background:linear-gradient(135deg,#f8ece2 0%,#f7cd97 55%,#f6b09f 100%); }
.sr-panel[data-daybg="mardi"]{    background:linear-gradient(135deg,#efe6e5 0%,#ef9f8b 42%,#a99fd6 100%); }
.sr-panel[data-daybg="mercredi"]{ background:linear-gradient(135deg,#f6efe7 0%,#ef8e8a 52%,#e199c2 100%); }
.sr-panel[data-daybg="jeudi"]{    background:linear-gradient(135deg,#17171f 0%,#3a1f3a 45%,#6a2451 100%); }
.sr-panel[data-daybg="vendredi"]{ background:linear-gradient(135deg,#1f1716 0%,#35367d 55%,#743164 100%); }
.sr-panel[data-daybg="samedi"]{   background:linear-gradient(135deg,#1d131b 0%,#3b3b79 55%,#7c6e3f 100%); }
.sr-panel[data-daybg="dimanche"]{ background:linear-gradient(135deg,#efeadd 0%,#cfbfc2 50%,#b3b2da 100%); }

/* Thème clair / sombre du texte selon le fond */
.sr-panel[data-theme="light"]{ --sp-ink:#1a1414; --sp-mut:#5a4f52; --sp-chip:rgba(0,0,0,.07); --sp-chipink:#2a2020; }
.sr-panel[data-theme="dark"]{  --sp-ink:#f4eef1; --sp-mut:rgba(244,238,241,.72); --sp-chip:rgba(255,255,255,.14); --sp-chipink:#fff; }

/* Horaires : puces */
.sr-sched{ display:flex; flex-wrap:wrap; gap:.5rem; }
.sr-slot{
  font-family:'General Sans',sans-serif; font-weight:600;
  font-size:.78rem; letter-spacing:.015em;
  padding:.42rem .78rem; border-radius:999px;
  background:var(--sp-chip); color:var(--sp-chipink);
}
.sr-note{
  margin:.9rem 0 0; max-width:70ch;
  font-family:var(--font-ui); font-style:italic; font-size:.92rem; line-height:1.55; color:var(--sp-mut);
}

/* Grille des artistes */
.sr-artists{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:clamp(1rem,1.8vw,1.5rem); margin-top:clamp(1rem,2vw,1.4rem);
}
.sr-artist{ display:flex; gap:.85rem; align-items:flex-start; }
.sr-photo{ flex:0 0 78px; width:78px; height:100px; border-radius:9px; overflow:hidden; background:var(--sp-chip); }
.sr-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
/* Carte sans photo : pas de tuile, texte pleine largeur (aucune mention) */
.sr-artist--nophoto .sr-art-body{ padding-top:.1rem; }
.sr-art-body{ min-width:0; }
.sr-art-name{
  margin:.1rem 0 .35rem; line-height:1.15;
  font-family:'General Sans',sans-serif; font-weight:700; font-size:1rem; letter-spacing:.005em; color:var(--sp-ink);
}
.sr-art-role{ display:block; font-weight:500; font-style:italic; font-size:.82rem; color:var(--sp-mut); margin-top:.12rem; }
.sr-art-bio{
  margin:0;
  font-family:var(--font-ui); font-weight:400; letter-spacing:.004em;
  font-size:.86rem; line-height:1.5; color:var(--sp-ink); opacity:.92;
}

@media (max-width:640px){
  .seko-row-head{ grid-template-columns:1fr; }
  .sr-meta{ grid-column:1; text-align:left; margin-top:.5rem; }
  .seko-row.is-open .sr-info{ max-height:3200px; }
  .sr-artists{ grid-template-columns:1fr; }
}

/* ===== Anim générique .rise : lettres montantes (comme "Notre mission" sur l'accueil) ===== */
@keyframes mtRise{
  0%{ opacity:0; transform:translateY(65%); }
  55%{ opacity:1; transform:translateY(-14%); }
  72%{ transform:translateY(5%); }
  88%{ transform:translateY(-2%); }
  100%{ opacity:1; transform:translateY(0); }
}
.rise .rw{ display:inline-flex; white-space:pre; }
.rise .letter{ display:inline-block; opacity:0; transform-origin:50% 100%; will-change:transform,opacity; }
.rise.is-rise .letter{ animation:mtRise 1.1s cubic-bezier(.25,.46,.45,.94) forwards; }
/* Paragraphes (.slide-up) : le bloc glisse depuis le bas, simple et fluide */
.slide-up{
  opacity:0; transform:translateY(34px); will-change:transform,opacity;
  transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
}
.slide-up.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .rise .letter{ opacity:1; animation:none; }
  .slide-up{ opacity:1; transform:none; transition:none; }
}

/* ============================================================
   POLICES — Aileron (titres) · Nyght Serif (paragraphes + sous-titres)
   ============================================================ */
body{ font-family:var(--font-body); }
.prog-nav{ font-family:var(--font-ui); }   /* nav en sans, pas en serif */

/* TITRES → Aileron */
.prog-brand, .ev-idx, .ev-title, .prog-num, .prog-word,
.sem-para-title, .ev-h1, .ev-block h2,
.day-tag, .day-type, .sr-title{ font-family:var(--font-title); }
/* .sem-giant garde la police du dossier (Bagel Fat One) — voir plus haut */

/* SOUS-TITRE (eyebrow) → Nyght Serif */
.sem-eyebrow{ font-family:var(--font-body); font-weight:500; }

/* ============================================================
   PAGE PROJETS — nouveau layout : fond blanc, titre animé haut-gauche,
   carousel central (cases serrées, tailles variées) qui défile à la molette,
   date+lieu à gauche, nom du projet à droite, deux traits au centre.
   ============================================================ */
body.page-projets{
  background:var(--paper); color:var(--ink);
  height:100vh; overflow:hidden;            /* la page ne défile pas */
}
.page-projets .prog-nav a{ color:var(--ink); }
.page-projets .prog-nav a:hover{ color:var(--accent); }

/* Titre "Projets" animé, haut à gauche */
.pj-title{
  position:absolute; top:clamp(4.5rem,11vh,7rem); left:var(--gutter); z-index:4;
  margin:0;
  font-family:var(--font-title); font-weight:900; text-transform:uppercase;
  font-size:clamp(2.2rem,5.5vw,5rem); line-height:.9; letter-spacing:-.02em; color:var(--ink);
}
/* reveal vertical (dévoilé haut→bas) — .in ajouté par kultur-textrise.js */
.reveal-clip{
  clip-path:inset(0 0 100% 0); -webkit-clip-path:inset(0 0 100% 0);
  will-change:clip-path;
  transition:clip-path .85s cubic-bezier(.5,0,.1,1), -webkit-clip-path .85s cubic-bezier(.5,0,.1,1);
}
.reveal-clip.in{ clip-path:inset(0 0 0 0); -webkit-clip-path:inset(0 0 0 0); }

.pj-stage{ position:absolute; inset:0; }

/* Colonnes latérales (infos du projet sélectionné) */
.pj-side--left{
  position:absolute; left:var(--gutter); top:50%; transform:translateY(-50%); z-index:4;
  width:18vw; display:flex; flex-direction:column; gap:.35rem;
}
.pj-date{
  font-family:var(--font-body); font-size:clamp(1rem,1.5vw,1.5rem); color:var(--ink);
}
.pj-place{
  font-family:var(--font-body); font-style:italic; color:var(--muted);
  font-size:clamp(.85rem,1.1vw,1.1rem);
}
.pj-name{
  position:absolute; right:var(--gutter); top:50%; transform:translateY(-50%); z-index:4;
  width:24vw; text-align:right; text-decoration:none;
  font-family:var(--font-title); font-weight:900; text-transform:uppercase;
  font-size:clamp(1.6rem,3vw,3.1rem); line-height:1.02; letter-spacing:-.01em; color:var(--ink);
  transition:color .25s;
}
.pj-name:hover{ color:var(--accent); }

/* Carousel VERTICAL central : fenêtre centrée, images qui défilent en boucle */
.pj-carousel{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:clamp(300px,36vw,480px);
  height:min(84vh,900px);
  overflow:hidden; cursor:ns-resize;
}
.pj-track{
  display:flex; flex-direction:column; align-items:center; gap:14px;   /* cases serrées */
  will-change:transform;
}
.pj-cell{
  flex:0 0 auto;
  position:relative;
  width:var(--w); height:var(--h);
  overflow:visible;                       /* les angles débordent de l'image */
  opacity:.5; filter:grayscale(1);
  transform:scale(.84); transform-origin:center center;
  transition:transform .45s cubic-bezier(.22,.61,.36,1), opacity .45s ease, filter .45s ease;
}
.pj-cell img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:3px; pointer-events:none; }
/* case au centre : mise en évidence (agrandie, nette) ; les autres rapetissent */
.pj-cell.is-sel{ opacity:1; filter:grayscale(0); transform:scale(1.12); }

/* case VIDE (projet en attente) : transparente, simple contour fin */
.pj-cell--empty{
  background:transparent;
  border:1px solid rgba(10,10,10,.28);
  border-radius:3px;
}
.pj-cell--empty.is-sel{ border-color:rgba(10,10,10,.55); background:transparent; }

/* Parenthèses au centre : deux fins arcs arrondis qui encadrent le projet sélectionné.
   Dessinés en CSS (bord fin + border-radius) → trait fin et bien arrondi. */
.pj-paren{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:11px; height:34px;               /* petits repères : juste pour signaler l'image active */
  border:2px solid transparent;
  border-radius:40px;
  pointer-events:none;
}
.pj-paren--l{ left:8px;  border-left-color:var(--ink); }
.pj-paren--r{ right:8px; border-right-color:var(--ink); }

@media (max-width:820px){
  /* date + lieu = moitié gauche ; titre = moitié droite → plus de superposition */
  .pj-side--left{ width:auto; max-width:40%; top:auto; bottom:6vh; transform:none; z-index:5; }
  .pj-name{ width:auto; max-width:52%; top:auto; bottom:6vh; transform:none; text-align:right; right:var(--gutter); left:auto; z-index:5; font-size:clamp(1.3rem,6vw,2.2rem); line-height:1.05; }
  .pj-carousel{ width:86vw; height:60vh; }
  .pj-title{ top:5.5rem; }
}