/* =====================================================================
   KEWOS — EMPLOYÉ MODÈLE
   Direction artistique : le dossier RH contre la scène.
   Papier listing, tampons administratifs et lumière de salle.
   ===================================================================== */

/* ------------------------------ 1. Tokens ------------------------------ */
:root{
  --encre:      #0F3043;   /* bleu pétrole, texte et fonds sombres */
  --papier:     #EDEBE3;   /* papier bureau, légèrement grisé    */
  --listing:    #DDE5D9;   /* bande vert pâle du papier listing  */
  --tampon:     #DF8038;   /* orange, accent unique               */
  --tampon-vif: #EA9257;   /* survol des boutons                  */
  --tampon-doux:#F0A868;   /* variante lisible sur fond sombre    */
  --scene:      #0B0E13;   /* noir de salle                      */
  --encre-60:   rgba(15,48,67,.60);
  --encre-30:   rgba(15,48,67,.30);
  --encre-14:   rgba(15,48,67,.14);

  --display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --texte:   "Archivo", "Helvetica Neue", Arial, sans-serif;
  --machine: "Courier Prime", "Courier New", monospace;
  --comic:   "Bangers", "Archivo", cursive;

  --wrap: 1180px;
  --pad: clamp(1.25rem, 5vw, 3rem);
  --rythme: clamp(4.5rem, 10vw, 9rem);
  --radius: 18px;

  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-liquide: cubic-bezier(.34,1.4,.5,1);
}

/* ------------------------------ 2. Base ------------------------------ */
*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--papier);
  color:var(--encre);
  font-family:var(--texte);
  font-variation-settings:"wdth" 100;
  font-size:clamp(1rem, .96rem + .2vw, 1.075rem);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
.nowrap{ white-space:nowrap; }
a{ color:inherit; }
button{ font:inherit; color:inherit; }

:focus-visible{
  outline:2px solid var(--tampon);
  outline-offset:3px;
  border-radius:4px;
}

.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--encre); color:var(--papier); padding:.8rem 1.2rem;
}
.skip:focus{ left:1rem; top:1rem; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }

/* ------------------------------ 3. Typographie ------------------------------ */
h1,h2,h3{
  font-family:var(--display);
  font-weight:800;
  font-variation-settings:"wdth" 112;
  line-height:.95;
  letter-spacing:-.018em;
  margin:0;
  text-wrap:balance;
}

.section-title{
  font-size:clamp(2.1rem, 1.2rem + 3.4vw, 3.9rem);
  margin-bottom:.7em;
  color:var(--tampon);
}

.section-head{
  display:flex; flex-wrap:wrap; align-items:flex-end;
  justify-content:space-between; gap:1rem 3rem;
  margin-bottom:clamp(2rem,5vw,3.4rem);
}
.section-head .section-title{ margin-bottom:0; }
.section-note{
  margin:0; max-width:42ch;
  color:var(--encre-60);
  font-size:.95rem;
}
.section-note a{ color:var(--tampon); text-underline-offset:.22em; }

.prose p{ max-width:62ch; }
.prose-out{ font-weight:600; }

/* ------------------------------ 4. Verre liquide ------------------------------ */
/* Une seule recette, réutilisée : flou + saturation, arête haute éclairée,
   et un reflet spéculaire qui suit le curseur (variables --mx / --my). */
.glass{
  position:relative;
  isolation:isolate;
  background:rgba(15,48,67,.52);
  -webkit-backdrop-filter:blur(20px) saturate(185%);
  backdrop-filter:blur(20px) saturate(185%);
  border:1px solid rgba(255,255,255,.13);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 1px 0 0 rgba(255,255,255,.09),
    inset -1px 0 0 rgba(255,255,255,.09),
    inset 0 -1px 0 rgba(255,255,255,.05),
    0 24px 48px -28px rgba(0,0,0,.75);
}
.glass::after{
  content:"";
  position:absolute; inset:0; border-radius:inherit;
  pointer-events:none; z-index:2;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,0%),
              rgba(255,255,255,.20), rgba(255,255,255,0) 62%);
  opacity:var(--sheen,0);
  transition:opacity .4s var(--ease-out);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .glass{ background:rgba(15,48,67,.92); }
}

/* ------------------------------ 5. Boutons ------------------------------ */
.btn{
  --lift:0;
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5em;
  padding:.78em 1.5em;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:700;
  font-size:.95rem;
  letter-spacing:.005em;
  text-decoration:none;
  cursor:pointer;
  transform:translateY(var(--lift));
  transition:transform .35s var(--ease-liquide), background-color .3s, color .3s, box-shadow .35s, border-color .3s;
}
.btn-lg{ padding:.95em 1.9em; font-size:1.02rem; }

.btn-solid{
  background:var(--tampon);
  color:#FBF6EE;
  box-shadow:0 12px 26px -16px rgba(223,128,56,.9);
}
.btn-solid:hover,.btn-solid:focus-visible{
  --lift:-2px;
  background:var(--tampon-vif);
  box-shadow:0 20px 34px -18px rgba(223,128,56,.95);
}

.btn-glass{
  background:rgba(255,255,255,.10);
  -webkit-backdrop-filter:blur(16px) saturate(170%);
  backdrop-filter:blur(16px) saturate(170%);
  border-color:rgba(255,255,255,.28);
  color:#FBF6EE;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 18px 34px -24px rgba(0,0,0,.8);
}
.btn-glass:hover,.btn-glass:focus-visible{
  --lift:-2px;
  background:rgba(255,255,255,.19);
  border-color:rgba(255,255,255,.45);
}

.btn-line{
  padding:.5em 1.15em;
  border-color:var(--encre-30);
  background:transparent;
  font-size:.88rem;
}
.btn-line:hover,.btn-line:focus-visible{
  background:var(--encre);
  border-color:var(--encre);
  color:var(--papier);
}

/* Lien à pastille de verre : la pastille se matérialise autour du mot au survol. */
.link-glass{
  display:inline-block;
  padding:.16em .62em;
  margin:-.16em -.62em;
  border-radius:999px;
  border:1px solid transparent;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:.22em;
  transition:background-color .35s var(--ease-out),
             border-color .35s var(--ease-out),
             box-shadow .35s var(--ease-out),
             text-decoration-color .3s,
             transform .45s var(--ease-liquide);
}
.link-glass:hover,.link-glass:focus-visible{
  transform:translateY(-1px);
  text-decoration-color:transparent;
  background:rgba(15,48,67,.07);
  border-color:rgba(15,48,67,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95);
  -webkit-backdrop-filter:blur(14px) saturate(180%);
  backdrop-filter:blur(14px) saturate(180%);
}
.videos .link-glass:hover,.videos .link-glass:focus-visible,
.alerte .link-glass:hover,.alerte .link-glass:focus-visible{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.32);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}

/* ------------------------------ 5b. Écran de choix (versus) ------------------------------ */
html.versus-locked,html.versus-locked body{ overflow:hidden; height:100%; }

.versus{
  position:fixed; inset:0; z-index:400;
  background:var(--scene);
  opacity:1;
  transition:opacity .6s var(--ease-out);
}
.versus.is-leaving{ opacity:0; pointer-events:none; }
.versus[hidden]{ display:none; }

.versus-inner{ position:relative; width:100%; height:100%; }

.versus-kicker{
  position:absolute; top:clamp(1.3rem,4vw,2.6rem); left:0; right:0; z-index:2;
  margin:0; text-align:center;
  font-family:var(--machine);
  font-size:.78rem; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(246,242,234,.65);
}

.versus-choices{ position:relative; display:flex; width:100%; height:100%; }

.versus-choice{
  position:relative;
  flex:1;
  display:flex; flex-direction:column; align-items:center; justify-content:flex-end;
  margin:0; padding:0 1.5rem clamp(3rem,10vw,6rem);
  border:0; border-right:1px solid rgba(255,255,255,.14);
  background:none; cursor:pointer;
  overflow:hidden; isolation:isolate;
  color:#F6F2EA; text-align:center;
  -webkit-tap-highlight-color:transparent;
}
.versus-acting{ border-right:0; }

.versus-choice img{
  position:absolute; inset:0; z-index:-2;
  width:100%; height:100%; object-fit:cover;
  object-position:center 18%;
  transform:scale(1.03);
  transition:transform 1.4s var(--ease-out);
}
.versus-choice::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(to top, rgba(11,14,19,.94) 12%, rgba(11,14,19,.25) 55%, rgba(11,14,19,.55) 100%);
}
.versus-choice:hover img,.versus-choice:focus-visible img{
  transform:scale(1);
}

.versus-label{
  display:block;
  font-family:var(--display); font-weight:900;
  font-variation-settings:"wdth" 122;
  text-transform:uppercase;
  font-size:clamp(1.8rem, 1rem + 3.4vw, 3.4rem);
  letter-spacing:-.02em;
  transition:transform .6s var(--ease-out), color .4s ease;
}
.versus-choice:hover .versus-label,.versus-choice:focus-visible .versus-label{
  transform:translateY(-6px);
  color:var(--tampon);
}
.versus-sub{
  display:block; margin-top:.5rem;
  font-family:var(--machine); font-size:.85rem;
  color:rgba(246,242,234,.65);
}

.versus-vs{
  position:absolute; top:50%; left:50%; z-index:3;
  transform:translate(-50%,-50%) rotate(-10deg);
  display:grid; place-items:center;
  width:clamp(3.8rem, 2.2vw + 3rem, 5.6rem); height:clamp(3.8rem, 2.2vw + 3rem, 5.6rem);
  border-radius:999px;
  border:3px solid var(--tampon);
  background:rgba(11,14,19,.75);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  box-shadow:0 14px 30px -10px rgba(0,0,0,.6);
  color:var(--tampon);
  font-family:var(--comic); font-weight:400;
  font-size:clamp(2.1rem, 1.6vw + 1.6rem, 3.1rem);
  line-height:1;
  letter-spacing:.03em;
  -webkit-text-stroke:1.5px var(--encre);
  paint-order:stroke fill;
  cursor:default;
  transition:transform .9s var(--ease-out);
}
/* Tour complet au survol de la pastille : -10deg + 360 = 350deg, elle retombe
   donc exactement dans son inclinaison d'origine. */
.versus-vs:hover{
  transform:translate(-50%,-50%) rotate(350deg);
}

.versus-skip{
  position:absolute; bottom:clamp(1.1rem,4vw,2rem); left:50%; z-index:2;
  transform:translateX(-50%);
  background:none; border:0;
  color:rgba(246,242,234,.55);
  font-size:.85rem;
  text-decoration:underline; text-underline-offset:.22em;
  cursor:pointer; padding:.5rem .7rem;
}
.versus-skip:hover,.versus-skip:focus-visible{ color:#F6F2EA; }

@media (max-width:720px){
  .versus-choices{ flex-direction:column; }
  .versus-choice{
    border-right:0; border-bottom:1px solid rgba(255,255,255,.14);
    padding-bottom:2.2rem; justify-content:center;
  }
  .versus-acting{ border-bottom:0; }
  .versus-vs{ width:3.6rem; height:3.6rem; font-size:1.7rem; }
}

/* Pas de survol au tactile : les photos restent en couleur, pas de version ternie. */
@media (hover:none){
  .versus-choice img{ transform:none; }
}

@media (prefers-reduced-motion:reduce){
  .versus,.versus-choice img,.versus-label{ transition-duration:.01ms !important; }
}

/* ------------------------------ 6. En-tête ------------------------------ */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:100;
  padding:clamp(.7rem,2vw,1.15rem) var(--pad);
  pointer-events:none;
}
.header-inner{
  pointer-events:auto;
  max-width:var(--wrap); margin-inline:auto;
  display:flex; align-items:center; gap:1rem;
  padding:.55rem .6rem .55rem 1.35rem;
  border-radius:999px;
  transition:padding .4s var(--ease-out), background-color .4s;
}
.site-header.is-scrolled .header-inner{ background:rgba(15,48,67,.72); }

.wordmark{
  font-family:var(--display);
  font-weight:900;
  font-variation-settings:"wdth" 122;
  font-size:1.22rem;
  letter-spacing:.02em;
  text-transform:uppercase;
  text-decoration:none;
  color:#F6F2EA;
  margin-right:auto;
}

.nav{
  position:relative;
  display:flex; align-items:center; gap:.15rem;
}
.nav a{
  position:relative; z-index:1;
  padding:.55rem .95rem;
  border-radius:999px;
  font-size:.92rem;
  font-weight:500;
  color:rgba(246,242,234,.78);
  text-decoration:none;
  transition:color .3s;
  white-space:nowrap;
}
.nav a:hover,.nav a:focus-visible,.nav a.is-current{ color:#FFF; }

/* La pastille de verre qui glisse d'un lien à l'autre */
.nav-pill{
  position:absolute; top:0; left:0; z-index:0;
  height:100%; width:0;
  border-radius:999px;
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(12px) saturate(200%) brightness(1.1);
  backdrop-filter:blur(12px) saturate(200%) brightness(1.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(255,255,255,.12);
  opacity:0;
  transform:translateX(0) scaleX(.7);
  transform-origin:left center;
  transition:transform .5s var(--ease-liquide), width .5s var(--ease-liquide), opacity .3s ease;
  pointer-events:none;
}
.nav.pill-on .nav-pill{ opacity:1; }

.header-cta{ padding:.62em 1.25em; font-size:.9rem; }

.burger{
  display:none;
  width:44px; height:38px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(255,255,255,.08);
  cursor:pointer;
  padding:0;
  flex-direction:column; align-items:center; justify-content:center; gap:5px;
}
.burger span{
  display:block; width:17px; height:1.5px; background:#F6F2EA; border-radius:2px;
  transition:transform .35s var(--ease-out), opacity .25s;
}
.burger[aria-expanded="true"] span:first-child{ transform:translateY(3.25px) rotate(45deg); }
.burger[aria-expanded="true"] span:last-child{ transform:translateY(-3.25px) rotate(-45deg); }

.menu-mobile{
  pointer-events:auto;
  max-width:var(--wrap); margin:.6rem auto 0;
  border-radius:22px;
  padding:.8rem;
  display:flex; flex-direction:column; gap:.15rem;
}
.menu-mobile[hidden]{ display:none; }
.menu-mobile a{
  padding:.85rem 1rem;
  border-radius:14px;
  color:rgba(246,242,234,.85);
  text-decoration:none;
  font-weight:500;
}
.menu-mobile a:hover{ background:rgba(255,255,255,.1); color:#fff; }
.menu-mobile .btn{ margin-top:.4rem; justify-content:center; }
.menu-mobile .btn:hover{ background:var(--tampon-vif); }

/* ------------------------------ 7. Hero ------------------------------ */
.hero{
  position:relative;
  min-height:100svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  background:var(--scene);
  color:#F6F2EA;
  overflow:hidden;
  padding:0 0 clamp(1rem,3vw,2rem);
}
.hero-media{ position:absolute; inset:0; }
.hero-media img{
  width:100%; height:100%;
  object-fit:cover; object-position:center 28%;
  opacity:0;
  transform:scale(1.06);
  transition:opacity 1.4s ease, transform 2.4s var(--ease-out);
}
.hero-media img.is-loaded{ opacity:1; transform:scale(1); }
.hero-media::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(to top, rgba(11,14,19,.94) 6%, rgba(11,14,19,.55) 38%, rgba(11,14,19,.15) 66%, rgba(11,14,19,.6) 100%),
    linear-gradient(to right, rgba(11,14,19,.6), rgba(11,14,19,0) 62%);
}
/* Filet de secours si l'image n'est pas encore posée dans le dossier */
.hero-media.is-missing{
  background:
    repeating-linear-gradient(135deg, #10151C 0 22px, #0D1218 22px 44px);
}

.hero-body{
  position:relative; z-index:2;
  width:100%; max-width:var(--wrap);
  margin:0 auto; padding:0 var(--pad);
}
.hero-kicker{
  font-family:var(--machine);
  font-size:.82rem;
  letter-spacing:.06em;
  color:rgba(246,242,234,.72);
  margin:0 0 1.1rem;
  padding-left:2.6rem;
  position:relative;
}
.hero-kicker::before{
  content:""; position:absolute; left:0; top:.62em;
  width:2rem; height:1px; background:var(--tampon);
}
.hero-title{
  display:flex; flex-direction:column;
  font-variation-settings:"wdth" 124;
  font-weight:900;
  text-transform:uppercase;
  margin:0 0 1.3rem;
  letter-spacing:-.03em;
}
.hero-title .l1{
  font-size:clamp(1rem,.7rem + 1.1vw,1.5rem);
  letter-spacing:.42em;
  font-weight:700;
  color:var(--tampon);
  margin-bottom:.9rem;
}
.hero-title .l2{
  font-size:clamp(2.6rem, 1rem + 8vw, 7rem);
  line-height:.94;
}
.hero-pitch{
  max-width:46ch;
  color:rgba(246,242,234,.82);
  margin:0 0 2rem;
}
.hero-actions{ display:flex; flex-wrap:wrap; gap:.75rem; }

/* Entrée orchestrée au chargement */
.hero-kicker,.hero-title .l1,.hero-pitch,.hero-actions,.hero-next{
  opacity:0; transform:translateY(26px);
}
.hero.is-ready .hero-kicker,
.hero.is-ready .hero-title .l1,
.hero.is-ready .hero-pitch,
.hero.is-ready .hero-actions,
.hero.is-ready .hero-next{
  opacity:1; transform:none;
  transition:opacity .9s ease, transform 1s var(--ease-out);
}
.hero.is-ready .hero-kicker{ transition-delay:.15s; }
.hero.is-ready .hero-title .l1{ transition-delay:.25s; }
.hero.is-ready .hero-pitch{ transition-delay:1.55s; }
.hero.is-ready .hero-actions{ transition-delay:1.7s; }
.hero.is-ready .hero-next{ transition-delay:1.85s; }

/* Le grand titre s'écrit comme à la machine à écrire */
.type-line{
  display:block;
  width:max-content;
  clip-path:inset(0 100% 0 0);
}
.hero.is-ready .type-line:nth-child(1){
  animation:type-reveal .55s steps(7,end) .35s forwards;
}
.hero.is-ready .type-line:nth-child(2){
  animation:type-reveal .5s steps(6,end) .95s forwards;
}
@keyframes type-reveal{ to{ clip-path:inset(0 0% 0 0); } }

.l2 .type-line:last-child::after{
  content:"";
  display:inline-block;
  width:.07em; height:.75em;
  margin-left:.06em;
  background:var(--tampon);
  vertical-align:-.05em;
  opacity:0;
}
.hero.is-ready .l2 .type-line:last-child::after{
  animation:caret-blink .5s steps(2,jump-none) .35s 4 forwards;
}
@keyframes caret-blink{ 0%,100%{ opacity:0; } 50%{ opacity:1; } }

.hero-next{
  position:relative; z-index:2;
  width:calc(100% - var(--pad) * 2);
  max-width:var(--wrap);
  margin:clamp(2.4rem,6vw,4rem) auto 0;
  display:flex; flex-wrap:wrap; align-items:baseline; gap:.4rem 1.4rem;
  padding-top:1.1rem;
  border-top:1px solid rgba(246,242,234,.22);
  text-decoration:none;
  transition:border-color .35s;
}
.hero-next:hover{ border-color:rgba(246,242,234,.55); }
.hero-next-label{
  font-family:var(--machine); font-size:.78rem; letter-spacing:.08em;
  color:rgba(246,242,234,.6);
}
.hero-next-value{
  font-family:var(--display); font-weight:800; font-variation-settings:"wdth" 112;
  font-size:clamp(1.05rem,.9rem + .6vw,1.4rem);
}
.hero-next-cta{
  margin-left:auto; font-size:.86rem; color:var(--tampon); font-weight:700;
}

/* ------------------------------ 8. Sections ------------------------------ */
.section{ padding-block:var(--rythme); position:relative; }
section[id]{ scroll-margin-top:6.5rem; }

/* ------------------------------ 9. Le spectacle ------------------------------ */
.grid-spectacle{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(2.5rem,6vw,5rem);
  align-items:start;
}

.fiche-meta{
  margin:0 0 2.2rem;
  border-top:1px solid var(--encre-14);
}
.fiche-meta > div{
  display:grid;
  grid-template-columns:minmax(9rem,32%) 1fr;
  gap:1rem;
  padding:.7rem 0;
  border-bottom:1px solid var(--encre-14);
}
.fiche-meta dt{
  font-family:var(--machine);
  font-size:.8rem;
  letter-spacing:.03em;
  color:var(--encre-60);
}
.fiche-meta dd{ margin:0; font-weight:600; }

.fiche .prose{ margin-bottom:2rem; }
.fiche .prose p{ margin:0 0 1.1em; }
.fiche-actions{ display:flex; flex-wrap:wrap; gap:.75rem; }
.fiche-docs{ margin:1.3rem 0 0; font-size:.94rem; color:var(--encre-60); }
.fiche-docs a{ color:var(--tampon); font-weight:600; text-underline-offset:.22em; }
.fiche-docs span{ font-family:var(--machine); font-size:.78rem; }

.affiche{
  margin:0;
  position:relative;
  padding:.8rem .8rem 0;
  background:#fff;
  border:1px solid var(--encre-14);
  box-shadow:0 30px 60px -40px rgba(15,48,67,.55);
  transform:rotate(-1.2deg);
  transition:transform .7s var(--ease-out), box-shadow .7s var(--ease-out);
}
.affiche:hover{
  transform:rotate(0deg) translateY(-6px);
  box-shadow:0 40px 70px -35px rgba(15,48,67,.65);
}
.affiche img{
  width:100%; aspect-ratio:2/3; object-fit:cover;
  background:repeating-linear-gradient(135deg,#E4E1D7 0 16px,#DCD9CE 16px 32px);
}
.affiche figcaption{
  font-family:var(--machine);
  font-size:.76rem;
  line-height:1.5;
  color:var(--encre-60);
  padding:.85rem .2rem;
}

/* ------------------------------ 9b. Acting ------------------------------ */
.acting{ background:var(--listing); }
.grid-acting{
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(2.5rem,6vw,5rem);
  align-items:start;
}
.acting-still{
  margin:0;
  position:relative;
  padding:.8rem .8rem 0;
  background:#fff;
  border:1px solid var(--encre-14);
  box-shadow:0 30px 60px -40px rgba(15,48,67,.55);
  transform:rotate(1.2deg);
  transition:transform .7s var(--ease-out), box-shadow .7s var(--ease-out);
}
.acting-still:hover{
  transform:rotate(0deg) translateY(-6px);
  box-shadow:0 40px 70px -35px rgba(15,48,67,.65);
}
.acting-still img{
  width:100%; aspect-ratio:3/4; object-fit:cover;
  object-position:center 20%;
  background:repeating-linear-gradient(135deg,#E4E1D7 0 16px,#DCD9CE 16px 32px);
}
.acting-still figcaption{
  font-family:var(--machine);
  font-size:.76rem;
  line-height:1.5;
  color:var(--encre-60);
  padding:.85rem .2rem;
}

/* ------------------------------ 10. Dates ------------------------------ */
.dates{ background:var(--papier); }

.date-list{
  list-style:none; margin:0; padding:0;
  border-top:1px solid var(--encre-14);
}
.date-row{
  display:grid;
  grid-template-columns:minmax(6.5rem,8rem) 1fr auto;
  align-items:center;
  gap:1rem 1.6rem;
  padding:1.15rem clamp(.6rem,2vw,1.2rem);
  border-bottom:1px solid var(--encre-14);
  transition:background-color .35s ease;
}
/* Papier listing : une bande sur deux */
.date-row:nth-child(even){ background:var(--listing); }
.date-row:hover{ background:#E4E2D8; }
.date-row:nth-child(even):hover{ background:#D3DCCF; }

.date-when{
  font-family:var(--machine);
  display:flex; align-items:baseline; gap:.4rem;
  color:var(--encre);
}
.date-when .d{ font-size:1.65rem; font-weight:700; line-height:1; }
.date-when .m{ font-size:.95rem; }
.date-when .y{ font-size:.78rem; color:var(--encre-60); }

.date-where{ display:flex; flex-direction:column; gap:.1rem; min-width:0; }
.date-where strong{
  font-family:var(--display); font-weight:800; font-variation-settings:"wdth" 110;
  font-size:1.22rem; letter-spacing:-.01em;
}
.date-where em{ font-style:normal; font-size:.9rem; color:var(--encre-60); }

.date-status{ justify-self:end; }

/* Affiché par le script quand toutes les dates sont passées */
.date-empty{
  padding:1.6rem clamp(.6rem,2vw,1.2rem);
  border-bottom:1px solid var(--encre-14);
  color:var(--encre-60);
}
.date-empty a{ color:var(--tampon); text-underline-offset:.22em; }

/* Tampon administratif */
.stamp{
  display:inline-block;
  font-family:var(--machine);
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--tampon);
  border:2px solid var(--tampon);
  border-radius:3px;
  padding:.3em .7em;
  transform:rotate(-7deg);
  opacity:.9;
}
.stamp-last{ color:var(--encre); border-color:var(--encre); transform:rotate(4deg); }

/* Le moment mémorable : les tampons s'abattent quand la ligne apparaît */
[data-reveal] .stamp{ transform:rotate(-7deg) scale(1.9); opacity:0; }
[data-reveal].is-in .stamp{
  transform:rotate(-7deg) scale(1); opacity:.9;
  transition:transform .32s cubic-bezier(.3,1.6,.5,1) .1s, opacity .2s ease .1s;
}
[data-reveal] .stamp-last{ transform:rotate(4deg) scale(1.9); }
[data-reveal].is-in .stamp-last{ transform:rotate(4deg) scale(1); }

/* ------------------------------ 10b. Avis du public ------------------------------ */
.avis-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin:0 0 clamp(2.5rem,6vw,4rem);
  border-block:1px solid var(--encre-14);
}
/* Le chiffre au-dessus de sa légende, sans casser l'ordre dt/dd */
.avis-stats > div{
  display:flex; flex-direction:column-reverse; justify-content:flex-end;
  padding:1.4rem .2rem;
}
.avis-stats > div + div{
  border-left:1px solid var(--encre-14);
  padding-left:clamp(.8rem,3vw,2rem);
}
.avis-stats dd{
  margin:0;
  font-family:var(--display);
  font-weight:900;
  font-variation-settings:"wdth" 120;
  font-size:clamp(1.6rem, 1rem + 3.6vw, 4rem);
  line-height:1;
  letter-spacing:-.02em;
  color:var(--tampon);
}
.avis-stats dt{
  margin-top:.55rem;
  font-family:var(--machine);
  font-size:.76rem;
  line-height:1.35;
  color:var(--encre-60);
}

.avis-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:clamp(1rem,2.5vw,1.6rem);
}
.avis{
  margin:0;
  display:flex; flex-direction:column;
  padding:1.5rem 1.4rem 1.3rem;
  background:#FFFDF8;
  border:1px solid var(--encre-14);
  border-radius:8px;
  box-shadow:0 30px 50px -45px rgba(15,48,67,.6);
}
.avis-stars{
  margin:0 0 .7rem;
  font-size:1rem;
  letter-spacing:.18em;
  color:var(--tampon);
}
.avis h3{
  font-size:1.25rem;
  margin-bottom:.7rem;
  font-variation-settings:"wdth" 108;
}
.avis blockquote{ flex:1; margin:0 0 1.2rem; }
.avis blockquote p{ margin:0; font-size:.96rem; }
.avis figcaption{
  font-family:var(--machine);
  font-size:.82rem;
  color:var(--encre-60);
}
.avis figcaption::before{ content:"— "; }

.avis figcaption span{ opacity:.75; }
.avis-source{ margin:1.8rem 0 0; font-size:.95rem; color:var(--encre-60); }

/* Sur téléphone, trois colonnes sont trop étroites : une ligne par chiffre */
@media (max-width:520px){
  .avis-stats{ grid-template-columns:1fr; }
  .avis-stats > div{
    flex-direction:row-reverse; justify-content:flex-end; align-items:baseline;
    gap:1rem;
    padding:1rem 0;
  }
  .avis-stats > div + div{ border-left:0; border-top:1px solid var(--encre-14); padding-left:0; }
  .avis-stats dd{ min-width:3.6em; flex-shrink:0; white-space:nowrap; font-size:1.9rem; }
  .avis-stats dt{ margin-top:0; }
}

/* Variante sur fond encre (accueil) : les cartes restent sur papier */
.avis-section{ background:var(--encre); color:#F6F2EA; }
.avis-section .section-note{ color:rgba(246,242,234,.65); }
.avis-section .avis-stats{ border-color:rgba(246,242,234,.16); }
.avis-section .avis-stats > div + div{ border-color:rgba(246,242,234,.16); }
.avis-section .avis-stats dd{ color:var(--tampon-doux); }
.avis-section .avis-stats dt{ color:rgba(246,242,234,.62); }
.avis-section .avis{ color:var(--encre); box-shadow:0 30px 50px -40px rgba(0,0,0,.8); }
.avis-section .avis-source{ color:rgba(246,242,234,.7); }
.avis-section .avis-source a{ color:var(--tampon-doux); text-underline-offset:.22em; }

/* ------------------------------ 11. Vidéos ------------------------------ */
.videos{ background:var(--scene); color:#F6F2EA; }
.videos .section-note{ color:rgba(246,242,234,.62); }
.videos .section-note a{ color:var(--tampon-doux); }

/* Deux vignettes par ligne : assez grandes pour que les titres tiennent. */
.video-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(1rem,2.5vw,1.6rem);
}
@media (max-width:640px){
  .video-grid{ grid-template-columns:1fr; }
}
.shorts-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:clamp(1rem,2.5vw,1.6rem);
  max-width:640px;
}
.video{ margin:0; }
.video-short .video-play img{ aspect-ratio:9/16; }
.video-short .video-icon{ aspect-ratio:9/16; }
.video-short .video-icon::before{ width:46px; height:46px; background:rgba(11,14,19,.55); }
.video-short .video-icon::after{ width:12px; height:14px; margin-left:2px; }
.video-play{
  position:relative;
  display:block; width:100%; padding:0;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  overflow:hidden;
  background:#11161D;
  cursor:pointer;
  text-align:left;
  transition:border-color .4s, transform .5s var(--ease-liquide);
}
.video-play img{
  width:100%; aspect-ratio:16/9; object-fit:cover;
  transition:transform .7s var(--ease-out), opacity .4s;
  opacity:.78;
}
.video-play:hover{ transform:translateY(-4px); border-color:rgba(255,255,255,.32); }
.video-play:hover img{ transform:scale(1.05); opacity:1; }

/* Le repère se cale sur la vignette (16/9), pas sur la carte entière. */
.video-icon{
  position:absolute; inset:0 0 auto 0;
  aspect-ratio:16/9;
  display:grid; place-items:center;
  pointer-events:none;
}
.video-icon::before{
  content:"";
  grid-area:1/1;
  width:62px; height:62px; border-radius:999px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.36);
  -webkit-backdrop-filter:blur(14px) saturate(180%);
  backdrop-filter:blur(14px) saturate(180%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
  transition:transform .45s var(--ease-liquide), background-color .3s;
}
.video-icon::after{
  content:"";
  grid-area:1/1;
  align-self:center; justify-self:center;
  width:16px; height:18px;
  margin-left:3px;
  background:#FBF6EE;
  clip-path:polygon(0 0, 100% 50%, 0 100%);
}
.video-play:hover .video-icon::before{ transform:scale(1.12); background:rgba(255,255,255,.26); }

.video-label{
  display:flex; align-items:baseline; justify-content:space-between; gap:1rem;
  padding:.95rem 1.1rem;
  font-weight:600;
}
.video-label em{
  font-style:normal; font-family:var(--machine);
  font-size:.75rem; color:rgba(246,242,234,.55);
}

.videos-kicker{
  font-family:var(--machine); font-size:.78rem; letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(246,242,234,.55);
  margin:0 0 1rem;
}
.video-grid + .videos-kicker,.shorts-grid + .videos-kicker{ margin-top:3rem; }

/* Reels/posts Instagram intégrés tels quels : on encadre la carte que fournit
   embed.js (elle gère sa propre largeur) sans toucher à son contenu interne. */
.insta-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:clamp(1rem,2.5vw,1.6rem);
  justify-items:center;
}
.insta-card{ margin:0; width:100%; max-width:400px; }
.insta-card iframe{ border-radius:14px !important; }
/* Avant que embed.js n'ait tourné (JS lent/coupé) : évite un bloc blanc énorme. */
.insta-card blockquote.instagram-media{
  min-width:0 !important; width:100% !important; max-width:100% !important;
  background:#11161D !important; border:1px solid rgba(255,255,255,.12) !important;
  border-radius:14px !important;
}
.insta-card blockquote.instagram-media a{
  display:block; padding:2.4rem 1.1rem; color:#F6F2EA; text-decoration:none; font-weight:600;
}

.videos-more{ margin:2.6rem 0 0; color:rgba(246,242,234,.72); }

/* ------------------------------ 12. Parcours ------------------------------ */
.grid-parcours{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(2.5rem,6vw,5rem);
  align-items:start;
}
.parcours-intro p{ max-width:44ch; color:var(--encre-60); }

.portrait{ margin:2rem 0 0; overflow:hidden; }
.portrait img{
  width:100%; aspect-ratio:4/5; object-fit:cover;
  object-position:center 15%;
  background:repeating-linear-gradient(135deg,#E4E1D7 0 16px,#DCD9CE 16px 32px);
  transition:transform .6s var(--ease-out);
}
.portrait:hover img{ transform:scale(1.06); }

.cv{ list-style:none; margin:0; padding:0; position:relative; }
.cv::before{
  content:""; position:absolute; left:.42rem; top:.6rem; bottom:2.6rem;
  width:1px; background:var(--encre-14);
}
.cv-item{
  position:relative;
  padding:0 0 2.1rem 2.6rem;
}
.cv-item::before{
  content:""; position:absolute; left:0; top:.42rem;
  width:.85rem; height:.85rem; border-radius:999px;
  background:var(--papier);
  border:2px solid var(--encre-30);
}
.cv-now::before{ background:var(--tampon); border-color:var(--tampon); }
.cv-year{
  font-family:var(--machine); font-size:.82rem; letter-spacing:.05em;
  color:var(--encre-60);
}
.cv-item h3{ font-size:1.4rem; margin:.15rem 0 .3rem; font-variation-settings:"wdth" 108; }
.cv-item p{ margin:0; color:var(--encre-60); max-width:46ch; }
.cv-now h3{ color:var(--tampon); }

/* ------------------------------ 13. Alerte ------------------------------ */
.alerte{ background:var(--encre); color:#F6F2EA; }
.alerte-inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(2rem,5vw,4rem);
  align-items:start;
}
.alerte p{ color:rgba(246,242,234,.7); max-width:44ch; }

.alerte-form{ display:flex; flex-direction:column; gap:1rem; }
.field{ display:flex; flex-direction:column; gap:.4rem; }
.field span{
  font-family:var(--machine); font-size:.78rem; letter-spacing:.05em;
  color:rgba(246,242,234,.6);
}
.field input{
  font:inherit; color:#F6F2EA;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  padding:.85rem 1rem;
  transition:border-color .3s, background-color .3s;
}
.field input::placeholder{ color:rgba(246,242,234,.35); }
.field input:focus{
  outline:none;
  border-color:rgba(255,255,255,.55);
  background:rgba(255,255,255,.1);
}
.check{
  display:flex; gap:.7rem; align-items:flex-start;
  font-size:.86rem; color:rgba(246,242,234,.65);
  max-width:46ch;
}
.check input{ margin-top:.25rem; accent-color:var(--tampon); }
.alerte-form .btn{ align-self:flex-start; }
.form-msg{ margin:0; font-size:.88rem; color:#8FCB9B; min-height:1.2em; }
.form-msg.is-error{ color:#F2A38A; }
.form-msg a{ color:inherit; text-underline-offset:.2em; }

/* Champ piège anti-robots : invisible pour les humains */
.hp{
  position:absolute !important;
  left:-9999px;
  width:1px; height:1px;
  overflow:hidden;
}

/* ------------------------------ 14. Pro ------------------------------ */
.grid-pro{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);
  gap:clamp(2.5rem,6vw,5rem);
  align-items:start;
}
.pro-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:clamp(1.5rem,4vw,3rem);
}
.pro-card{ border-top:2px solid var(--encre); padding-top:1.1rem; }
.pro-card h3{ font-size:1.25rem; margin-bottom:.5rem; font-variation-settings:"wdth" 108; }
.pro-card p{ margin:0 0 1rem; color:var(--encre-60); font-size:.94rem; max-width:34ch; }

.contact-still{
  margin:0;
  position:relative;
  padding:.8rem .8rem 0;
  background:#fff;
  border:1px solid var(--encre-14);
  box-shadow:0 30px 60px -40px rgba(15,48,67,.55);
  transform:rotate(-1deg);
  transition:transform .7s var(--ease-out), box-shadow .7s var(--ease-out);
}
.contact-still:hover{
  transform:rotate(0deg) translateY(-6px);
  box-shadow:0 40px 70px -35px rgba(15,48,67,.65);
}
.contact-still img{
  width:100%; aspect-ratio:3/4; object-fit:cover;
  object-position:center 15%;
  background:repeating-linear-gradient(135deg,#E4E1D7 0 16px,#DCD9CE 16px 32px);
}
.contact-still figcaption{
  font-family:var(--machine);
  font-size:.76rem;
  line-height:1.5;
  color:var(--encre-60);
  padding:.85rem .2rem;
}

/* ------------------------------ 15. Pied de page ------------------------------ */
.site-footer{
  background:var(--scene); color:rgba(246,242,234,.7);
  padding-block:clamp(3rem,6vw,4.5rem);
  font-size:.92rem;
}
.footer-inner{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:1.5rem 2.5rem;
  align-items:center;
}
.footer-mark{ color:#F6F2EA; font-size:1.4rem; margin:0; }
.footer-social,.footer-links{ display:flex; flex-wrap:wrap; gap:.4rem 1.4rem; }
.footer-social a,.footer-links a{
  display:inline-flex; align-items:center; gap:.5em;
  text-decoration:none;
  border-bottom:1px solid transparent;
  padding-bottom:2px;
  transition:color .3s, border-color .3s;
}
.footer-social a:hover,.footer-links a:hover{ color:#F6F2EA; border-color:currentColor; }
.footer-social img{
  width:16px; height:16px;
  filter:brightness(0) invert(1);
  opacity:.75;
  transition:opacity .3s;
}
.footer-social a:hover img{ opacity:1; }
.footer-legal{
  grid-column:1/-1;
  margin:1.5rem 0 0; padding-top:1.5rem;
  border-top:1px solid rgba(246,242,234,.14);
  font-family:var(--machine); font-size:.78rem;
  color:rgba(246,242,234,.45);
}

/* ------------------------------ 16. Lecteur vidéo ------------------------------ */
.lightbox{
  border:0; padding:0; background:transparent;
  width:min(1000px,92vw);
  color:#F6F2EA;
  /* Une <dialog> rogne ce qui dépasse : sans ça, le contour de focus du bouton est coupé. */
  overflow:visible;
}
.lightbox.is-vertical{ width:min(420px,92vw); }
.lightbox::backdrop{ background:rgba(6,8,11,.86); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.lightbox-frame{ position:relative; aspect-ratio:16/9; border-radius:14px; overflow:hidden; background:#000; }
/* Le focus d'ouverture se pose sur le lecteur (autofocus) et non sur « Fermer » */
.lightbox-frame:focus{ outline:none; }
.lightbox-frame iframe{ width:100%; height:100%; border:0; }
.lightbox-close{
  display:block; margin:0 0 .8rem auto;
  min-height:44px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border-radius:999px; padding:.6rem 1.3rem;
  font-size:.92rem; font-weight:600; cursor:pointer;
}
.lightbox-close:hover{ background:rgba(255,255,255,.22); }

/* ------------------------------ 17. Apparition au scroll ------------------------------ */
[data-reveal]{
  opacity:0;
  transform:translateY(20px);
  transition:opacity .75s ease, transform .85s var(--ease-out);
  transition-delay:calc(var(--i,0) * 55ms);
}
[data-reveal].is-in{ opacity:1; transform:none; }

/* ------------------------------ 18. Responsive ------------------------------ */
@media (max-width:1000px){
  .grid-spectacle,.grid-acting,.grid-parcours,.alerte-inner,.grid-pro{ grid-template-columns:1fr; }
  .affiche,.acting-still,.contact-still{ max-width:420px; }
  .portrait{ max-width:380px; }
}

@media (max-width:860px){
  .nav,.header-cta{ display:none; }
  .burger{ display:flex; }
  .header-inner{ padding:.5rem .5rem .5rem 1.15rem; }
  .footer-inner{ grid-template-columns:1fr; align-items:start; }
}

@media (max-width:640px){
  .hero-next{ padding-top:.9rem; }
  .hero-next-cta{ margin-left:0; width:100%; }
  .date-row{
    grid-template-columns:1fr auto;
    row-gap:.55rem;
    padding-block:1.3rem;
  }
  .date-when{ grid-column:1/-1; }
  .date-where{ grid-column:1; }
  .date-status{ grid-column:2; }
  .fiche-meta > div{ grid-template-columns:1fr; gap:.15rem; }
  .video-label{ flex-direction:column; gap:.2rem; }
}

/* ------------------------------ 19. Mouvement réduit ------------------------------ */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  [data-reveal]{ opacity:1; transform:none; }
  .hero-kicker,.hero-title .l1,.hero-pitch,.hero-actions,.hero-next{ opacity:1; transform:none; }
  .type-line{ clip-path:none; }
  .l2 .type-line:last-child::after{ opacity:0; }
  .hero-media img{ opacity:1; transform:none; }
  [data-reveal] .stamp{ opacity:.9; transform:rotate(-7deg); }
  [data-reveal] .stamp-last{ transform:rotate(4deg); }
}

/* ------------------------------ 20. Page intérieure ------------------------------ */
.page-legal .section{ padding-top:calc(var(--rythme) + 3.5rem); }
.legal{ max-width:70ch; }
.legal h2{ font-size:1.5rem; margin:2.6rem 0 .7rem; font-variation-settings:"wdth" 108; }
.legal h2:first-of-type{ margin-top:1.8rem; }
.legal p,.legal ul{ margin:0 0 1em; }
.legal ul{ padding-left:1.1rem; }
.legal a{ color:var(--tampon); text-underline-offset:.22em; }
.legal a.btn-solid{ color:#FBF6EE; text-decoration:none; }
.legal-kicker{ margin:0 0 .8rem; font-family:var(--machine); font-size:.82rem; letter-spacing:.06em; color:var(--encre-60); }

/* ------------------------------ 21. Page casting ------------------------------ */
.page-casting .section{ padding-top:calc(var(--rythme) + 3.5rem); }
.casting-intro{ max-width:60ch; margin:0 0 clamp(2rem,5vw,3rem); color:var(--encre-60); }

.grid-casting{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(0,.75fr);
  gap:clamp(2rem,5vw,4rem);
  align-items:start;
}

/* Formulaire sur papier : mêmes champs que l'alerte, version claire */
.form-light{
  display:flex; flex-direction:column; gap:2.2rem;
  padding:clamp(1.4rem,4vw,2.6rem);
  background:#FFFDF8;
  border:1px solid var(--encre-14);
  border-radius:8px;
  box-shadow:0 40px 70px -45px rgba(15,48,67,.6);
}
.form-light fieldset{ min-width:0; margin:0; padding:0; border:0; }
.form-light legend{
  padding:0; margin-bottom:1.1rem;
  font-family:var(--machine);
  font-weight:700;
  font-size:.8rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--tampon);
}
.form-grid{
  align-items:end;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem 1.2rem;
}
.form-grid .field-full{ grid-column:1/-1; }

.form-light .field span{ color:var(--encre-60); }
.form-light .field span small{ font-size:inherit; opacity:.75; }
.form-light .req{ color:var(--tampon); }
.form-light .field input,
.form-light .field select,
.form-light .field textarea{
  width:100%;
  font:inherit;
  color:var(--encre);
  background:#fff;
  border:1px solid var(--encre-14);
  border-radius:12px;
  padding:.8rem .95rem;
  transition:border-color .3s, box-shadow .3s;
}
.form-light .field textarea{ min-height:7.5rem; resize:vertical; }
.form-light .field select{
  appearance:none;
  padding-right:2.6rem;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230F3043' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 1rem center;
}
.form-light .field input::placeholder,
.form-light .field textarea::placeholder{ color:rgba(15,48,67,.38); }
.form-light .field input:focus,
.form-light .field select:focus,
.form-light .field textarea:focus{
  outline:none;
  background-color:#fff;
  border-color:var(--encre);
  box-shadow:0 0 0 3px rgba(223,128,56,.25);
}
.form-light .check{ max-width:none; color:var(--encre-60); }
.form-light .check a{ color:var(--tampon); text-underline-offset:.2em; }

.form-foot{ display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.5rem; }
.form-note{ margin:0; font-family:var(--machine); font-size:.76rem; color:var(--encre-60); }
.form-light .form-msg{ flex-basis:100%; color:#2E7D4F; }
.form-light .form-msg.is-error{ color:#B3412A; }

/* Pas de position collante : le profil est plus haut que l'écran et ses boutons resteraient cachés. */
.casting-aside .acting-still{ margin-bottom:1.8rem; transform:rotate(1deg); }
.casting-aside .acting-still img{ aspect-ratio:4/5; }
.casting-aside h2{ font-size:1.4rem; margin-bottom:1rem; font-variation-settings:"wdth" 108; }
.casting-aside .fiche-meta{ margin-bottom:1.6rem; }
.casting-aside .fiche-meta > div{ grid-template-columns:minmax(6.5rem,38%) 1fr; }
.casting-aside .fiche-meta a{ color:var(--tampon); text-underline-offset:.2em; }

@media (max-width:1000px){
  .grid-casting{ grid-template-columns:1fr; }
  .casting-aside{ max-width:520px; }
}
@media (max-width:640px){
  .form-grid{ grid-template-columns:1fr; }
}