/* ==========================================================================
   LA MANUFACTURE — Charte graphique du site
   Reprise de la DA de la plaquette semestrielle :
   nuit étoilée, dégradés bleu → violet → rose, aplats vert / rose / bleu,
   lignes ondulées, typographie condensée massive.
   Fichier partagé par index.html, acces.html et nous_contacter.html
   ========================================================================== */

:root{
  /* --- couleurs : celles de la plaquette semestrielle --- */
  --noir-1:#0F1214;          /* fond général */
  --noir-2:#16191B;          /* blocs posés sur le fond */
  --noir-3:#303030;
  --ink:#0F1214;
  --ink-soft:rgba(255,255,255,0.05);
  --ink-card:rgba(255,255,255,0.08);
  --paper:#ffffff;
  --vert:#78BD59;            /* bleu ciel : couleur dominante */
  --rose:#E792C0;            /* rose */
  --cyan:#74CCEB;            /* vert fluo : couleur d'appoint */
  --bleu:#1571c6;            /* bleu roi des modules date */
  --violet:#ff49ff;
  --rose-vif:#E792C0;
  --flash:#74CCEB;
  --flash-deep:#4FB2D6;
  --bleu-fonce:#1E3E7B;
  --alert:#FF0000;
  --muted:rgba(255,255,255,0.58);
  --line:rgba(255,255,255,0.14);
  --line-noir:rgba(0,0,0,0.26);

  /* --- typo --- */
  --display:"Anton","Arial Narrow",sans-serif;          /* titres massifs */
  --body:"Inter","Helvetica Neue",Arial,sans-serif;      /* textes courants */
  --ui:"Fredoka","Trebuchet MS",sans-serif;              /* étiquettes et boutons, arrondis */

  /* --- mesures --- */
  --wrap:1480px;
  --gutter:28px;

  /* --- motifs --- */
  --ondes:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='1600' height='600' viewBox='0 0 1600 600'><g fill='none' stroke='%23ffffff' stroke-width='1.1' stroke-opacity='0.5'><path d='M-40,66 C 180,14 380,68.6 620,29.6 S 1000,8.8 1240,47.8 S 1500,66 1640,27.0'/><path d='M-40,103 C 180,37 380,106.30000000000001 620,56.8 S 1000,30.4 1240,79.9 S 1500,103 1640,53.5'/><path d='M-40,140 C 180,60 380,144.0 620,84.0 S 1000,52.0 1240,112.0 S 1500,140 1640,80.0'/><path d='M-40,177 C 180,83 380,181.7 620,111.2 S 1000,73.6 1240,144.1 S 1500,177 1640,106.5'/><path d='M-40,186 C 180,134 380,188.6 620,149.6 S 1000,128.8 1240,167.8 S 1500,186 1640,147.0'/><path d='M-40,223 C 180,157 380,226.3 620,176.8 S 1000,150.4 1240,199.9 S 1500,223 1640,173.5'/><path d='M-40,260 C 180,180 380,264.0 620,204.0 S 1000,172.0 1240,232.0 S 1500,260 1640,200.0'/><path d='M-40,297 C 180,203 380,301.7 620,231.2 S 1000,193.6 1240,264.1 S 1500,297 1640,226.5'/><path d='M-40,306 C 180,254 380,308.6 620,269.6 S 1000,248.8 1240,287.8 S 1500,306 1640,267.0'/><path d='M-40,343 C 180,277 380,346.3 620,296.8 S 1000,270.4 1240,319.9 S 1500,343 1640,293.5'/><path d='M-40,380 C 180,300 380,384.0 620,324.0 S 1000,292.0 1240,352.0 S 1500,380 1640,320.0'/><path d='M-40,417 C 180,323 380,421.7 620,351.2 S 1000,313.6 1240,384.1 S 1500,417 1640,346.5'/><path d='M-40,426 C 180,374 380,428.6 620,389.6 S 1000,368.8 1240,407.8 S 1500,426 1640,387.0'/><path d='M-40,463 C 180,397 380,466.3 620,416.8 S 1000,390.4 1240,439.9 S 1500,463 1640,413.5'/><path d='M-40,500 C 180,420 380,504.0 620,444.0 S 1000,412.0 1240,472.0 S 1500,500 1640,440.0'/><path d='M-40,537 C 180,443 380,541.7 620,471.2 S 1000,433.6 1240,504.1 S 1500,537 1640,466.5'/><path d='M-40,546 C 180,494 380,548.6 620,509.6 S 1000,488.8 1240,527.8 S 1500,546 1640,507.0'/><path d='M-40,583 C 180,517 380,586.3 620,536.8 S 1000,510.4 1240,559.9 S 1500,583 1640,533.5'/></g></svg>");
  --ondes-noir:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='1600' height='600' viewBox='0 0 1600 600'><g fill='none' stroke='%23000000' stroke-width='1.1' stroke-opacity='0.32'><path d='M-40,66 C 180,14 380,68.6 620,29.6 S 1000,8.8 1240,47.8 S 1500,66 1640,27.0'/><path d='M-40,103 C 180,37 380,106.30000000000001 620,56.8 S 1000,30.4 1240,79.9 S 1500,103 1640,53.5'/><path d='M-40,140 C 180,60 380,144.0 620,84.0 S 1000,52.0 1240,112.0 S 1500,140 1640,80.0'/><path d='M-40,177 C 180,83 380,181.7 620,111.2 S 1000,73.6 1240,144.1 S 1500,177 1640,106.5'/><path d='M-40,186 C 180,134 380,188.6 620,149.6 S 1000,128.8 1240,167.8 S 1500,186 1640,147.0'/><path d='M-40,223 C 180,157 380,226.3 620,176.8 S 1000,150.4 1240,199.9 S 1500,223 1640,173.5'/><path d='M-40,260 C 180,180 380,264.0 620,204.0 S 1000,172.0 1240,232.0 S 1500,260 1640,200.0'/><path d='M-40,297 C 180,203 380,301.7 620,231.2 S 1000,193.6 1240,264.1 S 1500,297 1640,226.5'/><path d='M-40,306 C 180,254 380,308.6 620,269.6 S 1000,248.8 1240,287.8 S 1500,306 1640,267.0'/><path d='M-40,343 C 180,277 380,346.3 620,296.8 S 1000,270.4 1240,319.9 S 1500,343 1640,293.5'/><path d='M-40,380 C 180,300 380,384.0 620,324.0 S 1000,292.0 1240,352.0 S 1500,380 1640,320.0'/><path d='M-40,417 C 180,323 380,421.7 620,351.2 S 1000,313.6 1240,384.1 S 1500,417 1640,346.5'/><path d='M-40,426 C 180,374 380,428.6 620,389.6 S 1000,368.8 1240,407.8 S 1500,426 1640,387.0'/><path d='M-40,463 C 180,397 380,466.3 620,416.8 S 1000,390.4 1240,439.9 S 1500,463 1640,413.5'/><path d='M-40,500 C 180,420 380,504.0 620,444.0 S 1000,412.0 1240,472.0 S 1500,500 1640,440.0'/><path d='M-40,537 C 180,443 380,541.7 620,471.2 S 1000,433.6 1240,504.1 S 1500,537 1640,466.5'/><path d='M-40,546 C 180,494 380,548.6 620,509.6 S 1000,488.8 1240,527.8 S 1500,546 1640,507.0'/><path d='M-40,583 C 180,517 380,586.3 620,536.8 S 1000,510.4 1240,559.9 S 1500,583 1640,533.5'/></g></svg>");
  /* --- motifs de la plaquette --- */
  --contours-noir:url("images/contours-noir.svg");
  --contours-blanc:url("images/contours-blanc.svg");
  --etoiles:url("images/etoiles.svg");
}

/* --- reset --- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip;}
body{
  /* nuit étoilée, comme le fond des pages de la plaquette */
  background-color:var(--noir-1);
  background-image:var(--etoiles);
  background-repeat:repeat;
  background-size:520px 520px;
  background-attachment:fixed;
  color:var(--paper);
  font-family:var(--body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;}
::selection{background:#fff;color:#000;}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* --- traits obliques : habillage de fond, en transparence ---
   Courtes hachures blanches, dispersées, parallèles au logo (26,5°).
   Objectif : une texture qu'on devine, jamais un motif qui domine. */
.bandes{display:none;}
/* les traits ne servent plus qu'en haut des pages secondaires */
main .bandes,.cta-band .bandes{display:none;}
.hero .bandes{
  inset:0 0 6% 0;opacity:0.9;
  /* les traits s'estompent derrière le nom pour garder le texte net */
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 40%,rgba(0,0,0,0.30) 72%,rgba(0,0,0,0.14) 100%);
          mask-image:linear-gradient(180deg,#000 0%,#000 40%,rgba(0,0,0,0.30) 72%,rgba(0,0,0,0.14) 100%);
}

.page-hero .bandes{inset:0 0 40% 0;opacity:0.8;}
.bandes span{
  position:absolute;background:var(--paper);
  width:3px;border-radius:999px;opacity:0.34;
  transform:rotate(26.5deg);transform-origin:center;
  /* halo de lumière ~3 mm autour du trait, façon tube néon */
  box-shadow:
    0 0 4px 1px rgba(255,255,255,0.8),
    0 0 11px 4px rgba(150,205,255,0.8),
    0 0 24px 8px rgba(70,150,255,0.5),
    0 0 52px 14px rgba(70,150,255,0.22);
}
/* une hachure sur deux en bleu fluo */
.bandes span:nth-child(2n){
  background:#2f8bff;opacity:0.5;
  box-shadow:
    0 0 4px 1px rgba(190,225,255,0.75),
    0 0 11px 4px rgba(47,139,255,0.9),
    0 0 24px 8px rgba(47,139,255,0.55),
    0 0 52px 14px rgba(47,139,255,0.25);
}
.bandes span:nth-child(4n+3){width:4px;opacity:0.4;}
.bandes span:nth-child(6n+4){width:2px;}

/* dispersion irrégulière : position, hauteur et longueur variables */
.bandes span:nth-child(1) {left:4%; top:10%;height:22%;}
.bandes span:nth-child(2) {left:11%;top:44%;height:32%;}
.bandes span:nth-child(3) {left:17%;top:20%;height:17%;}
.bandes span:nth-child(4) {left:23%;top:60%;height:26%;}
.bandes span:nth-child(5) {left:29%;top:5%; height:30%;}
.bandes span:nth-child(6) {left:35%;top:38%;height:19%;}
.bandes span:nth-child(7) {left:41%;top:64%;height:23%;}
.bandes span:nth-child(8) {left:47%;top:14%;height:35%;}
.bandes span:nth-child(9) {left:53%;top:50%;height:16%;}
.bandes span:nth-child(10){left:59%;top:26%;height:28%;}
.bandes span:nth-child(11){left:65%;top:62%;height:20%;}
.bandes span:nth-child(12){left:71%;top:7%; height:31%;}
.bandes span:nth-child(13){left:77%;top:41%;height:23%;}
.bandes span:nth-child(14){left:83%;top:18%;height:19%;}
.bandes span:nth-child(15){left:89%;top:54%;height:28%;}
.bandes span:nth-child(16){left:95%;top:30%;height:22%;}
.bandes span:nth-child(17){left:8%; top:73%;height:16%;}
.bandes span:nth-child(18){left:38%;top:1%; height:15%;}
.bandes span:nth-child(19){left:92%;top:72%;height:18%;}
.bandes span:nth-child(n+20){display:none;}
.panneau .bandes span,
.panneau .bandes span:nth-child(2n){background:#000;opacity:0.16;box-shadow:none;}
.panneau .bandes span:nth-child(4n+3){opacity:0.2;}
@media (max-width:760px){
  .bandes span{width:3px;}
  .bandes span:nth-child(4n+3){width:4px;}
  .bandes span:nth-child(6n+4){width:2px;}
  .bandes span:nth-child(3n){display:none;}
}
@media (prefers-reduced-motion:reduce){ .bandes span{animation:none;} }

/* --- boutons --- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--ui);font-weight:600;font-size:13px;
  letter-spacing:0.06em;text-transform:uppercase;
  padding:13px 26px;border:2px solid currentColor;border-radius:999px;
  white-space:nowrap;cursor:pointer;
  transition:background .2s ease,color .2s ease,transform .2s ease,border-color .2s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn--flash{background:var(--cyan);border-color:var(--cyan);color:#000;}
.btn--flash:hover{background:var(--paper);border-color:var(--paper);color:#000;}
.btn--ghost{color:var(--paper);}
.btn--ghost:hover{background:var(--paper);color:#000;}
.btn--dark{color:#000;border-color:#000;}
.btn--dark:hover{background:#000;color:var(--vert);}
.btn .arrow{font-size:14px;line-height:1;transition:transform .2s ease;}
.btn:hover .arrow{transform:translateX(4px);}

/* --- micro-typo --- */
.kicker{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--ui);font-size:12px;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;
  color:var(--rose);
}
.kicker::before{content:"";width:24px;height:3px;background:currentColor;}
#agenda .kicker{color:var(--cyan);}
#agenda .filter.is-active{background:var(--rose);border-color:var(--rose);color:#000;}
#equipe .kicker{color:var(--rose);}
.eyebrow{
  font-family:var(--ui);font-size:12px;font-weight:500;letter-spacing:0.2em;text-transform:uppercase;
  color:var(--muted);
}
/* étiquette façon plaquette : petit bloc de couleur, texte noir */
.pastille{
  display:inline-block;font-family:var(--ui);font-weight:600;
  font-size:14px;line-height:1.15;letter-spacing:0.01em;
  color:#000;background:#fff;white-space:nowrap;
  padding:4px 10px 3px;border-radius:3px;
}
.pastille--bleu{background:var(--cyan);}
.pastille--rose{background:var(--rose);}
.pastille--violet{background:var(--vert);}

/* ==========================================================================
   HEADER
   ========================================================================== */
/* nuancier : les trois couleurs de la charte, en filet sous l'en-tête */
.site-header{
  position:fixed;top:0;z-index:120;
  width: -webkit-fill-available;
  width: stretch;
  background:transparent;
  transition:background .3s ease,border-color .3s ease;
  border-bottom:1px solid transparent;
}
.site-header.is-stuck{
  background:var(--noir-2);
  backdrop-filter:blur(14px);
  border-bottom-color:var(--line);
}
.header-inner{
  max-width:var(--wrap);margin:0 auto;padding:20px var(--gutter);
  display:flex;align-items:center;gap:20px;justify-content:space-between;
}
.brand{display:flex;align-items:center;gap:13px;flex:none;}
.brand-mark{
  width:clamp(48px,5.4vw,62px);height:auto;flex:none;object-fit:contain;
  transition:transform .3s cubic-bezier(.2,.7,.3,1);
}
.brand:hover .brand-mark{transform:rotate(-8deg) scale(1.08);}
.brand-name{
  font-family:var(--display);font-size:clamp(34px,3.4vw,44px);font-weight:400;
  letter-spacing:0.01em;text-transform:uppercase;line-height:0.92;
  display:flex;flex-direction:column;
}
.brand-name em{
  font-style:normal;font-family:var(--body);font-weight:700;
  font-family:var(--ui);font-size:10px;letter-spacing:0.24em;color:var(--cyan);margin-top:5px;font-weight:500;
}
@media (max-width:560px){
  .brand-mark{width:42px;}
  .brand-name{font-size:21px;}
  .brand-name em{display:none;}
}
.main-nav{display:flex;flex-wrap:nowrap;gap:22px;margin-left:auto;}
.main-nav a{
  font-family:var(--ui);font-size:13px;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;
  color:rgba(255,255,255,0.72);position:relative;padding:4px 0;white-space:nowrap;
  transition:color .2s ease;
}
.main-nav a::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--cyan);
  transition:width .25s ease;
}
.main-nav a:hover,.main-nav a[aria-current="page"]{color:var(--paper);transform:scale(1.1);}
.main-nav a:hover::after,.main-nav a[aria-current="page"]::after{width:100%;}
.header-cta{flex:none;padding:11px 24px;font-size:12px;}
.site-header .btn--flash{background:var(--rose);border-color:var(--rose);color:#000;}
.site-header .btn--flash:hover{background:#fff;border-color:#fff;color:var(--noir-1);transform:scale(1.08);}
.burger{
  display:none;width:44px;height:44px;margin-left:auto;
  align-items:center;justify-content:center;flex-direction:column;gap:2px;
  border:1px solid var(--line);
}
.burger span{display:block;width:18px;height:2px;background:var(--paper);transition:transform .25s ease,opacity .25s ease;}
body.menu-open .burger span:nth-child(1){transform:translateY(4px) rotate(45deg);}
body.menu-open .burger span:nth-child(2){opacity:0;}
body.menu-open .burger span:nth-child(3){transform:translateY(-4px) rotate(-45deg);}

.overlay-menu{
  position:fixed;inset:0;z-index:110;background:var(--ink);
  display:flex;flex-direction:column;justify-content:center;
  padding:96px var(--gutter) 40px;
  transform:translateY(-100%);
  transition:transform .45s cubic-bezier(.7,0,.2,1);
  overflow-y:auto;
}
body.menu-open .overlay-menu{transform:translateY(0);}
.overlay-menu a{
  font-family:var(--display);font-size:clamp(34px,10vw,58px);
  text-transform:uppercase;line-height:1.08;padding:10px 0;
  border-bottom:1px solid var(--line);
}
.overlay-menu a:hover{color:var(--cyan);}
.overlay-menu .overlay-foot{margin-top:30px;display:flex;flex-wrap:wrap;gap:12px;}

@media (max-width:940px){
  .main-nav,.header-cta{display:none;}
  .burger{display:flex;}
}

/* ==========================================================================
   HERO — reprise de la couverture de la plaquette
   ========================================================================== */
.hero{
  position:relative;min-height:100svh;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:150px 0 0;overflow:hidden;
  background:#040f28;
}
/* halo bleu et blocs translucides, comme sur la maquette */
.hero-halo{display:none;}
.hero-blocs{display:none;}
.hero-blocs span{
  position:absolute;background:rgba(90,150,255,0.10);
  transform:rotate(13deg);border-radius:4px;
}
.hero-blocs span:nth-child(1){right:6%;top:-6%;width:150px;height:66%;}
.hero-blocs span:nth-child(2){right:16%;top:-2%;width:120px;height:58%;background:rgba(90,150,255,0.07);}
.hero-blocs span:nth-child(3){right:24%;top:2%;width:96px;height:48%;background:rgba(90,150,255,0.05);}
.hero-blocs span:nth-child(4){right:-2%;top:4%;width:110px;height:52%;background:rgba(90,150,255,0.08);}
/* fines rayures régulières sur tout le fond */
.hero-rayures{display:none;}
.hero .kicker{color:#c8e4ff;}
.hero .lockup-rule{background:rgba(255,255,255,0.45);height:1px;}
.hero .lockup-tag{color:#c8e4ff;}
.hero .btn--flash{background:#fff;border-color:#fff;color:#04173a;}
.hero .btn--flash:hover{background:transparent;border-color:#fff;color:#fff;}
.page-hero .kicker{color:var(--cyan);}
.page-hero p.lead{color:rgba(255,255,255,0.82);}
.hero .bandes span,.page-hero .bandes span{
  background:#fff;opacity:0.95;
  box-shadow:
    0 0 3px 0 rgba(255,255,255,0.9),
    0 0 10px 3px rgba(160,215,255,0.8),
    0 0 24px 7px rgba(60,150,255,0.5),
    0 0 54px 13px rgba(60,150,255,0.26);
}
.hero .bandes span:nth-child(2n),.page-hero .bandes span:nth-child(2n){
  background:#8fd8ff;opacity:0.9;
  box-shadow:
    0 0 3px 0 rgba(230,246,255,0.9),
    0 0 10px 3px rgba(120,205,255,0.85),
    0 0 24px 7px rgba(60,170,255,0.55),
    0 0 54px 13px rgba(60,170,255,0.28);
}
.hero-bg{display:none;}
@keyframes onde{
  from{transform:translate3d(0,0,0) scale(1);}
  to{transform:translate3d(-28px,14px,0) scale(1.04);}
}
.hero-noise{display:none;}

.hero-glow{display:none;}
.hero-beams{display:none;}      /* remplacé par les ondes */

/* logo dégradé, façon couverture */
.hero-logo{position:absolute;pointer-events:none;height:auto;}
.hero-logo--main{                 /* filigrane vert fluo, posé derrière le nom */
  left:50%;bottom:9%;
  width:min(74vw,940px);
  opacity:0.22;z-index:0;
  transform:translateX(-50%);
}
.hero-logo--small,.hero-logo--ghost{display:none;}

.hero-inner{position:relative;z-index:2;width:100%;padding-bottom:44px;}
.hero .hero-meta{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;margin-bottom:22px;}

/* bloc-titre */
.lockup-top{display:flex;align-items:center;gap:18px;margin-bottom:2px;}
.lockup-mark{width:clamp(52px,6vw,86px);height:auto;flex:none;filter:drop-shadow(0 0 22px rgba(59,130,246,0.55));}
.lockup-la{
  font-family:var(--display);font-size:clamp(30px,4.6vw,62px);
  text-transform:uppercase;line-height:0.9;letter-spacing:0.01em;color:var(--paper);
}
.lockup-rule{flex:1;height:2px;background:var(--vert);}
.lockup-tag{
  font-size:11px;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;
  color:var(--vert);white-space:nowrap;
}
@media (max-width:640px){ .lockup-tag{display:none;} }

.hero h1{
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(52px,13vw,240px);line-height:0.86;letter-spacing:-0.005em;
}
.hero h1 .line{color:var(--paper);}
.hero h1 .solid{color:var(--paper);}
.hero h1 .outline{color:transparent;-webkit-text-stroke:0.012em rgba(255,255,255,0.9);}

/* signature verte sous le titre, comme sur la couverture */
.hero-signature{
  position:relative;z-index:2;margin:22px 0 4px;
  display:flex;align-items:center;gap:18px;
  font-family:var(--display);text-transform:uppercase;letter-spacing:0.06em;
  font-size:clamp(15px,1.9vw,26px);color:var(--bleu);
}
.hero-signature::before,.hero-signature::after{content:"";height:2px;background:var(--vert);flex:1;}
.hero-signature::before{max-width:40px;}

.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;}

/* mention de saison, gros, en bas à droite */
.hero-saison{
  position:absolute;right:var(--gutter);bottom:132px;z-index:3;text-align:right;
  font-family:var(--display);text-transform:uppercase;color:var(--paper);
  font-size:clamp(28px,4.4vw,64px);line-height:0.86;letter-spacing:0.01em;
}
.hero-saison sup{font-size:0.45em;vertical-align:super;margin-left:0.1em;}
@media (max-width:900px){ .hero-saison{display:none;} }

/* nuancier de la charte, coin bas droite */
.nuancier{
  position:absolute;right:var(--gutter);bottom:44px;z-index:3;
  display:grid;grid-template-columns:repeat(2,18px);grid-auto-rows:18px;gap:2px;
}
.nuancier span{display:block;}
@media (max-width:900px){ .nuancier{display:none;} }

/* bandeau des infos clés, juste sous l'en-tête */
.bandeau-infos{
  display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid var(--line);margin-top:90px;
}
.bandeau-infos div{
  padding:10px var(--gutter);
  border-right:1px solid var(--line);
  font-family:var(--ui);font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);
}
.bandeau-infos div:last-child{border-right:none;}
.bandeau-infos b{
  display:block;color:var(--paper);font-family:var(--display);font-size:22px;
  letter-spacing:0.02em;margin-bottom:3px;font-weight:400;
}
@media (max-width:760px){
  .bandeau-infos{grid-template-columns:1fr;}
  .bandeau-infos div{border-right:none;border-bottom:1px solid var(--line);}
}

.hero-foot{
  position:relative;z-index:2;
  border-top:1px solid var(--line);
  display:grid;grid-template-columns:repeat(3,1fr);
  background:rgba(7,7,12,0.6);
}
.hero-foot div{
  padding:18px var(--gutter);
  border-right:1px solid var(--line);
  font-family:var(--ui);font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);font-weight:400;
}
.hero-foot div:last-child{border-right:none;}
.hero-foot b{display:block;color:var(--paper);font-family:var(--display);font-size:20px;letter-spacing:0.02em;font-weight:400;}
@media (max-width:760px){
  .hero{min-height:auto;padding:130px 0 0;}
  .hero-foot{grid-template-columns:1fr;}
  .hero-foot div{border-right:none;border-bottom:1px solid var(--line);}
  .hero-logo--main{width:86vw;bottom:24%;opacity:0.22;}
}

/* --- hero des pages secondaires --- */
.page-hero{
  position:relative;padding:150px 0 62px;overflow:hidden;
  border-bottom:1px solid var(--line);background:transparent;
}

.page-hero .page-mark{
  position:absolute;top:50%;right:-2%;transform:translateY(-50%);
  width:min(26vw,270px);height:auto;opacity:0.18;pointer-events:none;filter:brightness(0) invert(1);
}
@media (max-width:820px){ .page-hero .page-mark{opacity:0.35;right:-14%;} }
.page-hero-inner{position:relative;z-index:2;}
.page-hero h1{
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(50px,11vw,150px);line-height:0.88;margin-top:16px;
}
.page-hero h1 .line{color:var(--paper);}
.page-hero h1 .flash,.page-hero h1 .outline{color:var(--paper);-webkit-text-stroke:0;}
.page-hero p.lead{margin-top:20px;max-width:56ch;color:rgba(255,255,255,0.74);font-size:17px;}

/* ==========================================================================
   BANDEAUX DÉFILANTS
   ========================================================================== */
.marquee{
  overflow:hidden;white-space:nowrap;
  background:var(--cyan);color:#000;
}
.marquee--dark{background:var(--rose);color:#000;border-color:#000;}
.marquee-track{
  display:inline-flex;align-items:center;padding:11px 0;
  font-family:var(--display);font-size:26px;text-transform:uppercase;letter-spacing:0.01em;
  animation:marquee 46s linear infinite;
}
.marquee--dark .marquee-track{animation-duration:58s;animation-direction:reverse;}
.marquee-track span{padding:0 18px;}
.marquee-track .sep{opacity:0.5;}
.marquee-track .mk{height:24px;width:auto;margin:0 12px;flex:none;opacity:1;filter:brightness(0);}
.marquee--dark .marquee-track span{color:#000;}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ==========================================================================
   SECTIONS
   ========================================================================== */
.section{padding:104px 0;position:relative;background:transparent;}

/* séparation discrète entre deux blocs : un filet et un court repère bleu */
main > section + section{border-top:1px solid var(--line);}
main > .cta-band + section::before,main > section.cta-band::before{display:none;}

#agenda > .wrap{position:relative;z-index:1;}
.section--tight{padding:70px 0;background:transparent;}
.section--video{padding:10px 0;background:var(--cyan);}
.section--lieu{padding:104px 0 20px;background:var(--noir-2);}
.section-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:26px;flex-wrap:wrap;
  margin-bottom:44px;
}
.section-head h2{
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(32px,7vw,92px);line-height:0.86;margin-top:12px;
  letter-spacing:-0.005em;overflow-wrap:break-word;
}
.section-head .side{color:var(--muted);font-size:14px;max-width:34ch;margin-left:auto;}
@media (max-width:700px){ .section-head .side{margin-left:0;max-width:100%;} }

/* ==========================================================================
   PANNEAUX DE COULEUR — les grands aplats de la plaquette
   ========================================================================== */
.panneau{position:relative;overflow:hidden;color:#000;}
/* lignes topographiques, signature de la plaquette */
.panneau::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:var(--contours-noir);
  background-size:cover;background-position:left top;background-repeat:no-repeat;
  /* elles restent en bord de page, comme sur la plaquette */
  -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,0.25) 26%,rgba(0,0,0,0.12) 60%,#000 100%);
          mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,0.25) 26%,rgba(0,0,0,0.12) 60%,#000 100%);
}
.panneau > *{position:relative;z-index:2;}
.panneau--vert{background:var(--vert);}
.panneau--rose{background:var(--rose);}
.panneau--bleu{background:var(--cyan);}
.panneau--noir{background:var(--noir-2);color:var(--paper);}
.panneau--violet{background:var(--violet);}

.panneau > .wrap{position:relative;z-index:2;}

/* textes et titres */
.panneau .kicker{color:#000;}
.panneau .section-head h2,.panneau h2,.panneau h3{color:#000;}
.panneau .section-head .side{color:rgba(0,0,0,0.74);}
.panneau .eyebrow{color:rgba(0,0,0,0.62);}
.panneau .about .copy p{color:rgba(0,0,0,0.78);}
.panneau .about .copy p b{color:#000;}
.panneau .about .copy .drop::first-letter{color:#000;}

/* boutons sur fond coloré : noir plein */
.panneau .btn--flash{background:#000;border-color:#000;color:#fff;}
.panneau .btn--flash:hover{background:#fff;border-color:#fff;color:#000;}
.panneau .btn--ghost{color:#000;}
.panneau .btn--ghost:hover{background:#000;color:#fff;border-color:#000}

/* grilles : les filets deviennent noirs, les cases prennent la couleur du panneau */
.panneau .cards,.panneau .team,.panneau .stats,.panneau .info-grid,
.panneau .contact-grid,.panneau .split{background:rgba(0,0,0,0.32);border-color:rgba(0,0,0,0.32);}
.panneau--vert .card,.panneau--vert .member,.panneau--vert .stat,
.panneau--vert .stat,.panneau--vert .member,.panneau--vert .card,
.panneau--vert .info,.panneau--vert .contact,.panneau--vert .split > *{background:var(--vert);}
.panneau--rose .card,.panneau--rose .member,.panneau--rose .stat,
.panneau--rose .stat,.panneau--rose .member,.panneau--rose .card,
.panneau--rose .info,.panneau--rose .contact,.panneau--rose .split > *{background:var(--rose);}
.panneau--bleu .card,.panneau--bleu .member,.panneau--bleu .stat,
.panneau--bleu .stat,.panneau--bleu .member,.panneau--bleu .card,
.panneau--bleu .info,.panneau--bleu .contact,.panneau--bleu .split > *{background:var(--cyan);}
.panneau--violet .card,.panneau--violet .member,.panneau--violet .stat,
.panneau--violet .info,.panneau--violet .contact,.panneau--violet .split > *{background:var(--violet);}
.panneau .card:hover,.panneau .member:hover,.panneau .stat:hover,
.panneau .contact:hover{background:rgba(255,255,255,0.28);}

.panneau .card .num{color:#000;opacity:0.42;}
.panneau .card p,.panneau .info p,.panneau .member p{color:rgba(0,0,0,0.74);}
.panneau .stat .num{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#000;-webkit-text-fill-color:#000;}
.panneau .stat .label{color:rgba(0,0,0,0.62);}
.panneau .team .member .avatar{background:#000;color:#fff;}
.panneau .team .member .role,.panneau .contact-grid .contact .role{color:#000;}
.panneau .info-grid .info .pin{background:#000;color:#fff;}
.panneau .info a.link,.panneau .contact a:hover{color:#000;text-decoration-thickness:2px;}
.panneau .contact .line{color:rgba(0,0,0,0.78);}
.panneau .contact .line span.ico{color:#000;}
.panneau .todo{background:#000;color:#fff;}
.panneau .Video_Youtube{border-color:rgba(0,0,0,0.32);}
.panneau .split .map{background:rgba(0,0,0,0.1);}
.panneau .split .map iframe{filter:grayscale(0.4) contrast(1.03);}

/* le bloc « prochain rendez-vous » posé sur un panneau */

/* ==========================================================================
   PROCHAIN RENDEZ-VOUS — la double page de la plaquette :
   module date en tuiles colorées, photo, puis grand aplat de couleur.
   ========================================================================== */
.next-show{
  display:grid;grid-template-columns:minmax(150px,auto) 1fr;
  max-width:1180px;margin-inline:auto;min-height:320px;
  background:#000;overflow:hidden;
}
.next-show.has-photo{grid-template-columns:minmax(150px,auto) minmax(200px,0.55fr) 1fr;}

/* --- le module date : des tuiles de couleur juxtaposées --- */
.next-show .date-panel{
  background:#000;color:#fff;padding:0;position:relative;overflow:hidden;
  display:grid;grid-template-rows:auto 1fr;grid-template-columns:auto 1fr;
  gap:2px;
}
.next-show .date-panel .tag{
  grid-column:1 / -1;
  font-family:var(--ui);font-size:12px;font-weight:600;letter-spacing:0.14em;
  text-transform:uppercase;white-space:nowrap;
  padding:11px 14px;background:var(--noir-1);color:var(--cyan);
}
.next-show .date-panel .jour-vertical{
  writing-mode:vertical-rl;transform:rotate(180deg);
  background:var(--cyan);color:var(--bleu);
  font-family:var(--ui);font-weight:600;font-size:15px;letter-spacing:0.18em;
  display:flex;align-items:center;justify-content:center;padding:14px 10px;
}
.next-show .date-panel .big{
  font-family:var(--display);font-size:clamp(64px,7vw,104px);line-height:0.8;
  display:flex;flex-direction:column;justify-content:center;
  padding:16px 18px;background:var(--bleu);color:var(--cyan);
}
.next-show .date-panel .big small{
  display:block;font-family:var(--ui);font-weight:600;
  font-size:13px;letter-spacing:0.08em;margin-top:14px;text-transform:uppercase;
  background:var(--cyan);color:var(--bleu);padding:5px 9px;align-self:flex-start;white-space:nowrap;
}

/* --- la photo, sur fond noir étoilé --- */
.next-show .photo-panel{position:relative;overflow:hidden;min-height:260px;min-width:150px;background:#000;}
.next-show .photo-panel img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;}

/* --- le grand aplat de couleur --- */
.next-show .info-panel{
  position:relative;background:var(--noir-3);color:var(--cyan);
  padding:30px 34px;display:flex;flex-direction:column;justify-content:center;gap:12px;
}
.next-show .info-panel::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:var(--contours-noir);background-size:cover;background-position:right top;
}
.next-show .info-panel > *{position:relative;z-index:1;}
.next-show .info-panel h3{
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(30px,3.6vw,54px);line-height:0.9;color:#fff;
}
.next-show .info-panel .eyebrow{
  font-family:var(--ui);font-weight:600;font-size:12px;letter-spacing:0.14em;color:#fff;
}
.next-show .info-panel .meta{
  display:flex;flex-wrap:wrap;gap:8px 16px;color:#fff;
  font-family:var(--ui);font-size:12px;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;
}
.next-show .info-panel .desc{color:rgba(0,0,0,0.78);font-size:14px;max-width:52ch;}
.next-show .info-panel .actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px;}
.next-show .info-panel .btn--flash{background:var(--rose);border-color:var(--rose);color:#000;}
.next-show .info-panel .btn--flash:hover{background:#fff;border-color:#fff;color:#000;}
.next-show .info-panel .btn--ghost{color:var(--rose);border-color:var(--rose);}
.next-show .info-panel .btn--ghost:hover{background:var(--rose);color:var(--noir-3);}
@media (max-width:860px){
  .next-show,.next-show.has-photo{grid-template-columns:1fr;}
  .next-show .photo-panel{min-height:220px;}
  .next-show .info-panel{padding:30px 24px;}
}

/* ==========================================================================
   AGENDA
   ========================================================================== */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:34px;}
.filter{
  font-family:var(--ui);font-size:13px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;
  padding:11px 20px;border:1px solid var(--line);border-radius:999px;color:rgba(255,255,255,0.72);
  transition:all .2s ease;
}
.filter:hover{border-color:var(--paper);color:var(--paper);}
.filter.is-active{background:var(--rose);border-color:var(--rose);color:#000;}

.agenda{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:48px 26px;}
.event{display:flex;flex-direction:column;position:relative;color:inherit;}
.event .barre{width:54px;height:5px;background:var(--vert);margin-bottom:13px;flex:none;}
.event:nth-child(3n+2) .barre{background:var(--rose);}
.event:nth-child(3n+3) .barre{background:var(--cyan);}
.event .quand{font-size:19px;color:rgba(255,255,255,0.62);margin-bottom:16px;line-height:1.25;}
.event .quand b{font-family:var(--display);font-weight:400;color:var(--paper);font-size:26px;letter-spacing:0.01em;}
.event .quand em{
  display:block;font-style:normal;font-size:11px;font-weight:700;
  letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);margin-top:5px;
}

.visuel-wrap{position:relative;}
.event .visuel{
  position:relative;display:block;aspect-ratio:3/4;overflow:hidden;
  background:var(--ink-soft);border:1px solid var(--line);
}
.event .visuel img{
  width:100%;height:100%;display:block;
  transform: scale(var(--z, 1));
  transition: transform .3s ease;
}

.event:hover .visuel img{
  transform:scale(calc(var(--z, 1) * 1.03));
}

.event .visuel::after{
  content:"";position:absolute;inset:0;background: color-mix(in srgb, var(--cyan) 0%, transparent);
  transition:background .3s ease;pointer-events:none;
}
.event:hover .visuel::after{background: color-mix(in srgb, var(--cyan) 22%, transparent);}

.event .visuel.vide{
  display:flex;align-items:center;justify-content:center;background:var(--bleu-fonce);
}

.event .visuel.vide .ph-date{
  position:relative;z-index:2;
  font-family:var(--display);font-size:66px;line-height:0.82;text-align:center;color:var(--paper);
}
.event .visuel.vide .ph-date small{
  display:block;font-size:15px;letter-spacing:0.18em;margin-top:10px;color:var(--muted);
}
.event .visuel.vide .ph-logo{position:absolute;bottom:-8%;right:-10%;width:62%;opacity:0.35;height:auto;}

.event .statut{
  position:absolute;top:0;left:0;z-index:2;
  font-size:15px;font-weight:800;letter-spacing:0.12em;text-transform:uppercase;
  padding:8px 12px;background:#000;color:#fff;max-width:88%;
}
.event .statut--complet{background:var(--alert);color:#fff;}
.event .statut--gratuit{background:var(--violet);color:#000;}
.event .statut--dernieres{background:var(--rose);color:#000;}

.event .play{
  position:absolute;right:12px;bottom:12px;z-index:3;
  width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--rose);color:#000;font-size:15px;padding-left:3px;
  box-shadow:0 6px 22px rgba(0,0,0,0.5);
  transition:transform .2s ease,background .2s ease;
}
.event .play:hover{transform:scale(1.12);background:var(--paper);}
.event .ecouter{
  margin-top:12px;align-self:flex-start;
  display:inline-flex;align-items:center;gap:8px;
  font-size:11px;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;
  font-family:var(--ui);color:var(--rose);border-bottom:1px solid rgba(116,204,235,0.5);padding-bottom:3px;
  transition:color .2s ease,border-color .2s ease;
}
.event .ecouter:hover{color:var(--paper);border-color:var(--paper);}
.event .ecouter .ico{font-size:9px;}

/* étiquettes de style, façon plaquette */
.event .tags{margin-top:15px;display:flex;flex-wrap:wrap;gap:5px;}
.event .tags .pastille{font-size:14px;padding:4px 10px 3px;}
.event .tags .pastille:nth-child(3n+2){background:var(--rose);}
.event .tags .pastille:nth-child(3n+3){background:var(--cyan);}
.event .titre{
  display:block;font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(22px,2.1vw,32px);line-height:0.96;margin-top:10px;
  overflow-wrap:break-word;transition:color .2s ease;
}
.event:hover .titre{color:var(--cyan);}
.event .sub{
  margin-top:8px;font-size:15px;line-height:1.45;color:rgba(255,255,255,0.66);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.event.is-hidden{display:none;}
@media (max-width:1120px){ .agenda{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (max-width:820px){ .agenda{grid-template-columns:repeat(2,minmax(0,1fr));gap:38px 18px;} }
@media (max-width:520px){ .agenda{grid-template-columns:1fr;gap:34px;} }

.agenda-foot{margin-top:34px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;}
.agenda-empty{padding:46px 0;color:var(--muted);text-align:center;display:none;}
.agenda-empty.is-visible{display:block;}

/* ==========================================================================
   LE LIEU
   ========================================================================== */
.about{display:grid;grid-template-columns:1.05fr 0.95fr;gap:66px;align-items:start;}
.about .copy p{color:rgba(255,255,255,0.76);font-size:17px;margin-bottom:20px;max-width:58ch;}
.about .copy p b{color:var(--paper);font-weight:700;}
.about .copy .drop::first-letter{
  float:left;font-family:var(--display);font-size:76px;line-height:0.72;
  padding:8px 12px 0 0;color:var(--bleu);
}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);}
.stat{background:var(--ink-soft);padding:30px 24px;transition:background .25s ease;}
.stat:hover{background:var(--ink-soft);}
.stat .num{
  display:block;font-family:var(--display);font-size:clamp(42px,6vw,64px);line-height:0.88;
  color:var(--bleu);
}
.stat .label{display:block;margin-top:10px;font-size:11px;font-weight:700;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--paper);}
@media (max-width:900px){.about{grid-template-columns:1fr;gap:44px;}}

/* vidéos */
.section--mini .section-head{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start;}
.section--mini .section-head > div{grid-column:1 / -1;}
.Video_Youtube{width:100%;height:auto;aspect-ratio:16/9;display:block;border:1px solid var(--line);}
@media (max-width:820px){ .section--mini .section-head{grid-template-columns:1fr;} }

/* ==========================================================================
   ACCOMPAGNEMENT — sur panneau de couleur
   ========================================================================== */
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.card{background:var(--ink-soft);padding:38px 32px;position:relative;overflow:hidden;transition:background .3s ease,color .3s ease;}
.card .num{
  font-family:var(--display);font-size:56px;line-height:0.8;
  color:var(--cyan);display:block;margin-bottom:20px;
}
.card h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:29px;line-height:1;margin-bottom:12px;}
.card p{color:rgba(255,255,255,0.7);font-size:15px;max-width:46ch;transition:color .3s ease;}
.card:hover{background:var(--ink-soft);}
@media (max-width:760px){.cards{grid-template-columns:1fr;}}

/* version sur panneau clair */
.panneau .cards{background:rgba(0,0,0,0.32);border-color:rgba(0,0,0,0.32);}
.panneau--vert .card{background:var(--vert);}
.panneau--rose .card{background:var(--rose);}
.panneau--bleu .card{background:var(--cyan);}
.panneau .card .num{color:#000;opacity:0.45;}
.panneau .card h3{color:#000;}
.panneau .card p{color:rgba(0,0,0,0.72);}
.panneau .card:hover{background:rgba(255,255,255,0.22);}

/* ==========================================================================
   ÉQUIPE
   ========================================================================== */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.member{background:var(--ink-soft);padding:32px 26px;transition:background .25s ease;}
.member:hover{background:var(--ink-soft);}
.member .avatar{
  width:54px;height:54px;display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-size:21px;
  background:var(--vert);color:#000;margin-bottom:18px;
}
.member:nth-child(3n+2) .avatar{background:var(--rose);}
.member:nth-child(3n) .avatar{background:var(--cyan);}
.member h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:23px;line-height:1;}
.member .role{margin-top:7px;font-size:11px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--vert);}
.member:nth-child(3n+2) .role{color:var(--rose);}
.member:nth-child(3n) .role{color:var(--cyan);}
.member p{margin-top:14px;color:rgba(255,255,255,0.64);font-size:14px;}
@media (max-width:900px){.team{grid-template-columns:1fr 1fr;}}
@media (max-width:620px){.team{grid-template-columns:1fr;}}

/* ==========================================================================
   BANDEAU D'APPEL
   ========================================================================== */
.cta-band{background:var(--cyan);color:var(--noir-1);position:relative;overflow:hidden;padding:82px 0;border-block:2px solid #000;}
.cta-band::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:var(--contours-noir);background-size:cover;background-position:left top;
}



.cta-band .cta-logo{position:absolute;top:50%;right:4%;transform:translateY(-50%);
  width:min(28vw,280px);height:auto;opacity:0.16;pointer-events:none;z-index:1;}
@media (max-width:900px){ .cta-band .cta-logo{opacity:0.18;right:-8%;} }
.cta-band .inner{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;}
.cta-band h2{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(32px,5.4vw,68px);line-height:0.92;max-width:16ch;}
.cta-band p{margin-top:12px;font-weight:500;max-width:44ch;color:rgba(0,0,0,0.78);}
.cta-band .btn--dark{color:#000;border-color:#000;}
.cta-band .btn--dark:hover{background:var(--noir-1);color:var(--cyan);}

/* ==========================================================================
   BLOCS INFOS (accès / contact)
   ========================================================================== */
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);}
.info{background:var(--ink-soft);padding:32px 28px;}
.info h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:25px;margin-bottom:14px;}
.info p{color:rgba(255,255,255,0.72);font-size:15px;}
.info p + p{margin-top:10px;}
.info .pin{
  display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;
  background:var(--vert);color:#000;font-size:16px;margin-bottom:18px;
}
.info:nth-child(4n+2) .pin{background:var(--rose);}
.info:nth-child(4n+3) .pin{background:var(--cyan);}
.info:nth-child(4n+4) .pin{background:var(--violet);}
.info a.link{color:#fff;}
.info a.link:hover{color:var(--rose);}

.split{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);}
.split > *{background:var(--ink-soft);}
.split .map{padding:0;min-height:380px;background:var(--ink-soft);}
.split .map iframe{width:100%;height:100%;min-height:380px;border:0;display:block;
  filter:grayscale(1) contrast(1.05) invert(0.92) hue-rotate(180deg);}
.split .address{padding:42px 36px;display:flex;flex-direction:column;justify-content:center;gap:16px;}
.split .address h3{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(28px,4vw,46px);line-height:0.96;}
.split .address .addr{font-size:19px;line-height:1.5;}
@media (max-width:860px){.split{grid-template-columns:1fr;}}

/* contacts */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);}
.contact{background:var(--ink-soft);padding:32px 28px;position:relative;overflow:hidden;transition:background .25s ease;}
.contact:hover{background:var(--ink-soft);}
.contact .role{font-size:11px;font-weight:800;letter-spacing:0.16em;text-transform:uppercase;color:var(--vert);}
.contact:nth-child(3n+2) .role{color:var(--rose);}
.contact:nth-child(3n) .role{color:var(--cyan);}
.contact h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:29px;line-height:1;margin:10px 0 16px;}
.contact .line{display:flex;align-items:center;gap:10px;font-size:15px;color:rgba(255,255,255,0.78);margin-bottom:8px;}
.contact .line span.ico{color:var(--vert);font-size:13px;width:18px;flex:none;}
.contact a:hover{color:var(--vert);}
.todo{
  display:inline-block;margin-top:4px;
  font-size:10px;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;
  color:#000;background:var(--vert);padding:4px 9px;
}

/* ==========================================================================
   PIED DE PAGE
   ========================================================================== */
.site-footer{
  position:relative;border-top:1px solid var(--line);padding-top:66px;overflow:hidden;
  background:transparent;
}

.footer-grid{
  position:relative;z-index:2;
  max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter) 50px;
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;
}
.footer-grid h4{font-size:11px;font-weight:800;letter-spacing:0.2em;text-transform:uppercase;color:var(--muted);margin-bottom:18px;}
.footer-grid a{display:block;font-size:15px;margin-bottom:11px;color:rgba(255,255,255,0.85);transition:color .2s ease;}
.footer-grid a:hover{color:var(--cyan);}
.footer-brand .brand-mark{width:88px;height:88px;margin-bottom:20px;}
.footer-brand p{color:var(--muted);font-size:14px;max-width:30ch;}
.footer-social{display:flex;gap:10px;margin-top:20px;}
.footer-social a{
  width:42px;height:42px;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;margin:0;
  font-size:11px;font-weight:800;letter-spacing:0.06em;
}
.footer-social a:hover{background:var(--rose);border-color:var(--rose);color:#000;}
.footer-wordmark{position:relative;z-index:2;overflow:hidden;border-top:1px solid var(--line);padding:24px 0 16px;}
.footer-wordmark span{
  display:block;text-align:center;white-space:nowrap;
  font-family:var(--display);text-transform:uppercase;
  font-size:clamp(56px,15vw,220px);line-height:0.84;
  color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,0.28);
}
.footer-bottom{
  position:relative;z-index:2;border-top:1px solid var(--line);
  max-width:var(--wrap);margin:0 auto;padding:20px var(--gutter) 28px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);font-weight:600;
}
.footer-bottom a:hover{color:var(--cyan);}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr;}}

/* ==========================================================================
   DIVERS
   ========================================================================== */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.3,1);}
.reveal.is-in{opacity:1;transform:none;}
.fit .line{display:block;white-space:nowrap;}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;}
  .reveal{opacity:1;transform:none;}
  html{scroll-behavior:auto;}
}