:root{
  --bg:#07090d;
  --bg-soft:#0d1118;
  --text:#f3f0ea;
  --muted:#a8adb8;
  --line:rgba(255,255,255,.14);
  --accent:#8ec5ff;
  --accent2:#c8b7ff;
  --warm:#e8c58d;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Arial, Helvetica, sans-serif;
  letter-spacing:.01em;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.site-header{
  position:sticky; top:0; z-index:30;
  backdrop-filter:blur(14px);
  background:rgba(7,9,13,.72);
  border-bottom:1px solid var(--line);
}
.header-inner,.footer-inner,.wrap{
  width:min(var(--max), calc(100% - 40px));
  margin:auto;
}
.header-inner{
  min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.brand{font-weight:700; letter-spacing:.12em; font-size:18px}
.nav{display:flex; gap:18px; flex-wrap:wrap; align-items:center}
.nav a{font-size:13px; color:#d8dbe2}
.nav a:hover{color:white}
.nav .bandcamp{border:1px solid var(--line); padding:10px 14px; border-radius:999px}
.menu-toggle{display:none;background:none;border:1px solid var(--line);color:white;padding:9px 12px;border-radius:999px}
.hero{
  min-height:76vh; display:grid; place-items:center; position:relative; overflow:hidden;
  border-bottom:1px solid var(--line);
  background:#030405;
}

.hero-prism-image{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center center; z-index:0; display:block;
}
.hero::before{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg,rgba(0,0,0,.80) 0%,rgba(0,0,0,.58) 38%,rgba(0,0,0,.18) 66%,rgba(0,0,0,.08) 100%),
             linear-gradient(180deg,rgba(0,0,0,.20),rgba(0,0,0,.12) 62%,rgba(0,0,0,.45));
}
.hero-prism::after{display:none}
.hero-content{position:relative; z-index:3; width:min(720px, calc(100% - 40px)); margin-right:28%}
@media (max-width:820px){
  .hero{min-height:72vh}
  .hero-prism-image{object-position:43% center}
  .hero::before{background:linear-gradient(180deg,rgba(0,0,0,.48),rgba(0,0,0,.72) 70%,rgba(0,0,0,.84))}
}
.kicker{font-size:12px; letter-spacing:.22em; text-transform:uppercase; color:#b9bdc7; margin-bottom:18px}
h1{font-size:clamp(42px,7vw,88px); line-height:.95; margin:0 0 22px; font-weight:500; letter-spacing:-.04em}
.lead{font-size:clamp(18px,2.3vw,28px); line-height:1.4; color:#e4e1da; max-width:720px}
.cta-row{display:flex; gap:14px; flex-wrap:wrap; margin-top:28px}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:46px; padding:0 18px; border-radius:999px;
  border:1px solid var(--line); background:rgba(255,255,255,.03);
  color:var(--text); cursor:pointer;
}
.btn:hover{background:rgba(255,255,255,.08)}
.section{padding:84px 0;border-bottom:1px solid var(--line)}
.section h2{font-size:clamp(30px,4.2vw,58px); font-weight:500; letter-spacing:-.03em; margin:0 0 18px}
.section-intro{max-width:760px;color:#c9cdd5;font-size:18px;line-height:1.65}
.video-shell{
  margin-top:34px; aspect-ratio:16/9; border:1px solid var(--line); border-radius:22px;
  overflow:hidden; position:relative; display:grid; place-items:center;
  background:
    linear-gradient(135deg,rgba(255,255,255,.03),rgba(255,255,255,.01)),
    radial-gradient(circle at 50% 40%, var(--videoGlow, rgba(80,150,255,.25)), transparent 45%);
}
.video-shell iframe{width:100%;height:100%;border:0}
.video-placeholder{text-align:center;color:#d2d6df;padding:30px}
.video-placeholder strong{display:block;font-size:22px;margin-bottom:8px}
.questions{
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:42px;
}
.question{
  min-height:150px; padding:22px; border:1px solid var(--line); border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));
  display:flex; flex-direction:column; justify-content:space-between;
  transition:.25s ease;
}
.question:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.055)}
.question small{color:#9298a5;text-transform:uppercase;letter-spacing:.16em}
.question span{font-size:20px;line-height:1.35}
.question b{font-size:20px;font-weight:400}
.work-hero{
  min-height:64vh; display:flex; align-items:end; padding:96px 0 54px; position:relative; overflow:hidden;
  background:var(--work-bg);
}
.work-hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(7,9,13,.88) 88%);
}
.work-hero .wrap{position:relative;z-index:2}
.work-level{font-size:13px;letter-spacing:.18em;color:#d0d4dc;text-transform:uppercase}
.work-title{font-size:clamp(56px,9vw,120px);font-weight:500;letter-spacing:-.05em;margin:12px 0 12px}
.work-sub{max-width:760px;font-size:20px;color:#d9dbe0;line-height:1.55}
.level-01{--work-bg:
  radial-gradient(circle at 65% 32%,rgba(64,123,180,.20),transparent 30%),
  linear-gradient(180deg,#080c12,#0a1018 58%,#07090d);
  --videoGlow:rgba(77,130,190,.28);
}
.level-02{--work-bg:
  radial-gradient(circle at 66% 30%,rgba(190,134,74,.20),transparent 32%),
  radial-gradient(circle at 30% 25%,rgba(88,96,128,.10),transparent 30%),
  linear-gradient(180deg,#0b0c0f,#14110e 56%,#07090d);
  --videoGlow:rgba(204,157,88,.26);
}
.level-03{--work-bg:
  radial-gradient(circle at 62% 24%,rgba(235,229,207,.18),transparent 32%),
  radial-gradient(circle at 28% 38%,rgba(167,183,210,.12),transparent 30%),
  linear-gradient(180deg,#111317,#17191d 58%,#08090b);
  --videoGlow:rgba(225,225,210,.26);
}
.notes{
  display:grid; grid-template-columns:1.1fr .9fr; gap:42px; align-items:start;
}
.note-card{padding:24px;border-left:1px solid var(--line)}
.note-card h3{font-weight:500;margin-top:0}
.note-card p{color:#bfc4cd;line-height:1.65}
.site-footer{padding:38px 0 48px;background:#06080b}
.footer-inner{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.footer-links{display:flex;gap:16px;flex-wrap:wrap;color:#aeb3bd;font-size:13px}
.footer-note{color:#7f8590;font-size:12px;margin-top:16px}
@media(max-width:820px){
  .nav{display:none}
  .nav.open{display:flex;position:absolute;left:20px;right:20px;top:72px;background:#0a0d12;border:1px solid var(--line);padding:18px;border-radius:16px;flex-direction:column;align-items:flex-start}
  .menu-toggle{display:block}
  .hero-content{margin-right:0}
  .human{right:-80px;opacity:.55}
  .questions{grid-template-columns:1fr}
  .notes{grid-template-columns:1fr}
}

/* =========================================================
   DOMUS.band V1.1 — progression chromatique 01 / 02 / 03
   Le fond porte le niveau de lumière.
   Le titre porte la couleur de l'œuvre.
   Les détails diffusent cette couleur avec retenue.
   ========================================================= */

.level-01{
  --work-accent:#7fb8e8;
  --work-accent-soft:rgba(127,184,232,.20);
  --work-accent-faint:rgba(127,184,232,.08);
  --work-bg:
    radial-gradient(circle at 72% 20%,rgba(65,118,171,.22),transparent 28%),
    radial-gradient(circle at 18% 55%,rgba(36,71,108,.12),transparent 26%),
    linear-gradient(180deg,#06090d 0%,#08111a 42%,#09131e 66%,#07090d 100%);
  --videoGlow:rgba(86,151,205,.34);
}

.level-02{
  --work-accent:#d6ad68;
  --work-accent-soft:rgba(214,173,104,.22);
  --work-accent-faint:rgba(214,173,104,.09);
  --work-bg:
    radial-gradient(circle at 72% 18%,rgba(208,155,83,.26),transparent 30%),
    radial-gradient(circle at 28% 46%,rgba(116,91,64,.12),transparent 28%),
    linear-gradient(180deg,#0a0a0b 0%,#14110d 40%,#18130d 68%,#090a0c 100%);
  --videoGlow:rgba(220,169,92,.36);
}

.level-03{
  --work-accent:#efe4c7;
  --work-accent-soft:rgba(239,228,199,.24);
  --work-accent-faint:rgba(239,228,199,.10);
  --work-bg:
    radial-gradient(circle at 70% 16%,rgba(242,235,211,.26),transparent 31%),
    radial-gradient(circle at 24% 42%,rgba(164,177,194,.14),transparent 30%),
    linear-gradient(180deg,#0d0f12 0%,#171a1f 38%,#1d2024 68%,#0a0b0e 100%);
  --videoGlow:rgba(233,227,207,.34);
}

.level-01 .section{
  background:linear-gradient(180deg,rgba(27,52,74,.09),rgba(7,9,13,0) 55%),#070b10;
}
.level-02 .section{
  background:linear-gradient(180deg,rgba(92,67,35,.11),rgba(7,9,13,0) 55%),#0c0b09;
}
.level-03 .section{
  background:linear-gradient(180deg,rgba(165,174,187,.10),rgba(7,9,13,0) 55%),#111318;
}

.level-01 .work-title,
.level-02 .work-title,
.level-03 .work-title{
  color:var(--work-accent);
  text-shadow:0 0 34px var(--work-accent-soft);
}

.level-01 .work-level,
.level-02 .work-level,
.level-03 .work-level,
.level-01 .kicker,
.level-02 .kicker,
.level-03 .kicker,
.level-01 .question b,
.level-02 .question b,
.level-03 .question b{
  color:var(--work-accent);
}

.level-01 .btn,
.level-02 .btn,
.level-03 .btn,
.level-01 .question,
.level-02 .question,
.level-03 .question,
.level-01 .note-card,
.level-02 .note-card,
.level-03 .note-card,
.level-01 .video-shell,
.level-02 .video-shell,
.level-03 .video-shell{
  border-color:var(--work-accent-soft);
}

.level-01 .question,
.level-02 .question,
.level-03 .question{
  background:linear-gradient(180deg,var(--work-accent-faint),rgba(255,255,255,.015));
}

.level-01 .btn:hover,
.level-02 .btn:hover,
.level-03 .btn:hover,
.level-01 .question:hover,
.level-02 .question:hover,
.level-03 .question:hover{
  background:var(--work-accent-faint);
  border-color:var(--work-accent);
}

.level-01 .section::before,
.level-02 .section::before,
.level-03 .section::before{
  content:"";
  display:block;
  width:74px;
  height:1px;
  margin:0 0 34px;
  background:linear-gradient(90deg,var(--work-accent),transparent);
  opacity:.48;
}


/* =========================================================
   DOMUS.band V1.2 — échelle de lumière réellement perceptible
   01 = fermé / sombre
   02 = respiration intermédiaire
   03 = lumière plus présente, toujours sombre
   ========================================================= */

/* On donne désormais une vraie base de fond différente à chaque page */
.level-01{
  background:#060a0f;
  --work-bg:
    radial-gradient(ellipse at 72% 22%,rgba(62,116,170,.22),transparent 31%),
    linear-gradient(180deg,#05080c 0%,#07101a 52%,#080e15 100%);
}
.level-02{
  background:#11100e;
  --work-bg:
    radial-gradient(ellipse at 70% 20%,rgba(196,145,78,.25),transparent 33%),
    linear-gradient(180deg,#0c0c0c 0%,#15120e 48%,#13110e 100%);
}
.level-03{
  background:#1b1d20;
  --work-bg:
    radial-gradient(ellipse at 68% 18%,rgba(238,231,207,.27),transparent 34%),
    linear-gradient(180deg,#15171a 0%,#202329 48%,#191c20 100%);
}

/* Le fond de chaque section suit réellement le niveau lumineux */
.level-01 .section{
  background:#070c12;
}
.level-02 .section{
  background:#12110f;
}
.level-03 .section{
  background:#1a1c20;
}

/* Une très légère modulation verticale évite l'effet d'aplat */
.level-01 .section:nth-of-type(even){
  background:linear-gradient(180deg,#08101a,#070b11);
}
.level-02 .section:nth-of-type(even){
  background:linear-gradient(180deg,#17130f,#11100e);
}
.level-03 .section:nth-of-type(even){
  background:linear-gradient(180deg,#22252a,#191b1f);
}

/* Le texte secondaire accompagne légèrement la montée de lumière */
.level-01 .section-intro,.level-01 .note-card p{color:#b8c0ca}
.level-02 .section-intro,.level-02 .note-card p{color:#c8c5bd}
.level-03 .section-intro,.level-03 .note-card p{color:#d3d4d3}

/* Header/footer restent volontairement identiques : ancrage DOMUS */


/* =========================================================
   DOMUS.band V1.3 — univers chromatiques validés
   01 INMATE   = bleu froid
   02 CEREMONY = or / ambre
   03 ANGE     = violet / rose subtil
   Chaque page reçoit une "tâche lumineuse" cohérente.
   ========================================================= */

.level-01{
  --work-accent:#58a9ff;
  --work-accent-soft:rgba(88,169,255,.28);
  --work-accent-faint:rgba(88,169,255,.09);
  --work-bg:
    radial-gradient(circle at 20% 36%, rgba(27,108,255,.34) 0 4%, rgba(27,108,255,.20) 8%, rgba(27,108,255,.08) 18%, transparent 34%),
    radial-gradient(circle at 72% 20%,rgba(65,118,171,.18),transparent 30%),
    linear-gradient(180deg,#05080c 0%,#07101a 52%,#080e15 100%);
}

.level-02{
  --work-accent:#d8a737;
  --work-accent-soft:rgba(216,167,55,.30);
  --work-accent-faint:rgba(216,167,55,.10);
  --work-bg:
    radial-gradient(circle at 22% 34%, rgba(226,170,28,.36) 0 4%, rgba(226,170,28,.22) 9%, rgba(226,170,28,.09) 18%, transparent 34%),
    radial-gradient(circle at 72% 18%,rgba(196,145,78,.20),transparent 31%),
    linear-gradient(180deg,#0b0b0a 0%,#15120e 48%,#13110e 100%);
}

.level-03{
  --work-accent:#d58acb;
  --work-accent-soft:rgba(213,138,203,.30);
  --work-accent-faint:rgba(213,138,203,.10);
  --work-bg:
    radial-gradient(circle at 22% 34%, rgba(205,93,183,.34) 0 4%, rgba(205,93,183,.20) 9%, rgba(205,93,183,.08) 18%, transparent 34%),
    radial-gradient(circle at 70% 18%,rgba(174,122,168,.16),transparent 32%),
    linear-gradient(180deg,#0f0d12 0%,#18131c 48%,#151117 100%);
}

/* Titres */
.level-01 .work-title{color:#69b4ff;text-shadow:0 0 30px rgba(88,169,255,.24)}
.level-02 .work-title{color:#e1b756;text-shadow:0 0 30px rgba(216,167,55,.24)}
.level-03 .work-title{color:#dd98d3;text-shadow:0 0 30px rgba(213,138,203,.24)}

/* Le fond des sections reprend subtilement la teinte de l'œuvre */
.level-01 .section{
  background:
    radial-gradient(circle at 14% 26%,rgba(27,108,255,.13),transparent 26%),
    linear-gradient(180deg,#07101a,#070b11);
}
.level-02 .section{
  background:
    radial-gradient(circle at 14% 26%,rgba(226,170,28,.14),transparent 26%),
    linear-gradient(180deg,#17130f,#11100e);
}
.level-03 .section{
  background:
    radial-gradient(circle at 14% 26%,rgba(205,93,183,.14),transparent 26%),
    linear-gradient(180deg,#1a141e,#121016);
}

/* Les cartes de questions gardent la couleur, sans devenir criardes */
.level-01 .question{box-shadow:inset 0 0 0 1px rgba(88,169,255,.04)}
.level-02 .question{box-shadow:inset 0 0 0 1px rgba(216,167,55,.04)}
.level-03 .question{box-shadow:inset 0 0 0 1px rgba(213,138,203,.04)}


/* =========================================================
   DOMUS.band V1.4 — repositionnement des tâches lumineuses
   Les halos principaux quittent la zone du titre et passent
   en haut à droite de chaque page œuvre.
   ========================================================= */

.level-01{
  --work-bg:
    radial-gradient(circle at 84% 18%, rgba(27,108,255,.36) 0 4%, rgba(27,108,255,.22) 9%, rgba(27,108,255,.09) 18%, transparent 34%),
    radial-gradient(circle at 68% 22%,rgba(65,118,171,.16),transparent 31%),
    linear-gradient(180deg,#05080c 0%,#07101a 52%,#080e15 100%);
}

.level-02{
  --work-bg:
    radial-gradient(circle at 84% 18%, rgba(226,170,28,.38) 0 4%, rgba(226,170,28,.23) 9%, rgba(226,170,28,.10) 18%, transparent 34%),
    radial-gradient(circle at 68% 22%,rgba(196,145,78,.18),transparent 31%),
    linear-gradient(180deg,#0b0b0a 0%,#15120e 48%,#13110e 100%);
}

.level-03{
  --work-bg:
    radial-gradient(circle at 84% 18%, rgba(205,93,183,.36) 0 4%, rgba(205,93,183,.21) 9%, rgba(205,93,183,.09) 18%, transparent 34%),
    radial-gradient(circle at 68% 22%,rgba(174,122,168,.15),transparent 32%),
    linear-gradient(180deg,#0f0d12 0%,#18131c 48%,#151117 100%);
}

/* Retire les halos secondaires proches des titres dans les sections */
.level-01 .section,
.level-02 .section,
.level-03 .section{
  background-image:none;
}

/* On garde seulement une légère teinte globale par niveau */
.level-01 .section{background:#070c12;}
.level-02 .section{background:#12110f;}
.level-03 .section{background:#161219;}


/* =========================================================
   DOMUS.band V1.5 — correction structurelle des tâches
   La tâche lumineuse n'est plus un radial-gradient du fond.
   Elle devient un élément indépendant via .work-hero::before,
   explicitement positionné en haut à droite.
   ========================================================= */

/* Fonds de base : sans grosse tâche colorée */
.level-01{
  --work-accent:#58a9ff;
  --work-accent-soft:rgba(88,169,255,.28);
  --work-accent-faint:rgba(88,169,255,.09);
  --work-spot:rgba(44,126,255,.72);
  --work-spot-soft:rgba(44,126,255,.28);
  --work-bg:
    radial-gradient(circle at 70% 28%,rgba(65,118,171,.10),transparent 32%),
    linear-gradient(180deg,#05080c 0%,#07101a 52%,#080e15 100%);
}
.level-02{
  --work-accent:#d8a737;
  --work-accent-soft:rgba(216,167,55,.30);
  --work-accent-faint:rgba(216,167,55,.10);
  --work-spot:rgba(235,176,36,.76);
  --work-spot-soft:rgba(235,176,36,.30);
  --work-bg:
    radial-gradient(circle at 70% 28%,rgba(196,145,78,.10),transparent 32%),
    linear-gradient(180deg,#0b0b0a 0%,#15120e 48%,#13110e 100%);
}
.level-03{
  --work-accent:#d58acb;
  --work-accent-soft:rgba(213,138,203,.30);
  --work-accent-faint:rgba(213,138,203,.10);
  --work-spot:rgba(220,101,195,.74);
  --work-spot-soft:rgba(220,101,195,.30);
  --work-bg:
    radial-gradient(circle at 70% 28%,rgba(174,122,168,.09),transparent 32%),
    linear-gradient(180deg,#0f0d12 0%,#18131c 48%,#151117 100%);
}

/* La vraie tâche lumineuse, indépendante du fond */
.level-01 .work-hero::before,
.level-02 .work-hero::before,
.level-03 .work-hero::before{
  content:"";
  position:absolute;
  top:34px;
  right:6%;
  width:190px;
  height:190px;
  border-radius:50%;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(circle,
      var(--work-spot) 0%,
      var(--work-spot-soft) 24%,
      rgba(255,255,255,.03) 48%,
      transparent 72%);
  filter:blur(9px);
  opacity:.92;
}

/* On garde le voile sombre au-dessus du fond, mais derrière le texte */
.work-hero::after{
  z-index:1;
}
.work-hero .wrap{
  z-index:2;
}

/* La tâche doit rester nettement séparée du titre */
@media (min-width: 900px){
  .level-01 .work-hero::before,
  .level-02 .work-hero::before,
  .level-03 .work-hero::before{
    top:46px;
    right:7%;
  }
}

/* Mobile : tâche plus petite, toujours en haut à droite */
@media (max-width: 820px){
  .level-01 .work-hero::before,
  .level-02 .work-hero::before,
  .level-03 .work-hero::before{
    width:120px;
    height:120px;
    top:26px;
    right:18px;
    opacity:.78;
  }
}


/* =========================================================
   DOMUS.band V1.6 — PHP / œuvres historiques / couleurs propres
   Les niveaux 01/02/03 déterminent la quantité de lumière.
   Chaque classe work-* peut redéfinir sa couleur sans toucher
   au header/footer commun. Les espaces partenaires ne sont
   rendus que lorsqu'ils sont explicitement activés en PHP.
   ========================================================= */

/* Œuvres actuelles : rappel explicite des couleurs V1.5 validées */
.work-inmate{--work-accent:#58a9ff;--work-accent-soft:rgba(88,169,255,.28);--work-accent-faint:rgba(88,169,255,.09);--work-spot:rgba(44,126,255,.72);--work-spot-soft:rgba(44,126,255,.28);}
.work-ceremony{--work-accent:#d8a737;--work-accent-soft:rgba(216,167,55,.30);--work-accent-faint:rgba(216,167,55,.10);--work-spot:rgba(235,176,36,.76);--work-spot-soft:rgba(235,176,36,.30);}
.work-ange{--work-accent:#d58acb;--work-accent-soft:rgba(213,138,203,.30);--work-accent-faint:rgba(213,138,203,.10);--work-spot:rgba(220,101,195,.74);--work-spot-soft:rgba(220,101,195,.30);}

/* Anciennes œuvres : teintes propres, toujours sur la même échelle de lumière */
.work-decadence{--work-accent:#d86b68;--work-accent-soft:rgba(216,107,104,.30);--work-accent-faint:rgba(216,107,104,.09);--work-spot:rgba(228,74,70,.72);--work-spot-soft:rgba(228,74,70,.28);--work-bg:radial-gradient(circle at 70% 28%,rgba(150,58,58,.10),transparent 32%),linear-gradient(180deg,#0b0607 0%,#160a0c 52%,#10090b 100%);--videoGlow:rgba(216,107,104,.30);}
.work-deambulation{--work-accent:#62c6ad;--work-accent-soft:rgba(98,198,173,.30);--work-accent-faint:rgba(98,198,173,.10);--work-spot:rgba(73,210,174,.74);--work-spot-soft:rgba(73,210,174,.28);--work-bg:radial-gradient(circle at 70% 28%,rgba(60,145,126,.10),transparent 32%),linear-gradient(180deg,#080c0b 0%,#0d1714 48%,#0b1210 100%);--videoGlow:rgba(98,198,173,.30);}
.work-phenomene{--work-accent:#d99562;--work-accent-soft:rgba(217,149,98,.30);--work-accent-faint:rgba(217,149,98,.10);--work-spot:rgba(230,139,78,.74);--work-spot-soft:rgba(230,139,78,.28);--work-bg:radial-gradient(circle at 70% 28%,rgba(165,105,64,.10),transparent 32%),linear-gradient(180deg,#0f0c09 0%,#1d1711 48%,#17120e 100%);--videoGlow:rgba(217,149,98,.30);}
.work-confession{--work-accent:#8f88df;--work-accent-soft:rgba(143,136,223,.30);--work-accent-faint:rgba(143,136,223,.09);--work-spot:rgba(116,104,226,.72);--work-spot-soft:rgba(116,104,226,.28);--work-bg:radial-gradient(circle at 70% 28%,rgba(91,82,150,.10),transparent 32%),linear-gradient(180deg,#08070d 0%,#100d19 52%,#0c0a13 100%);--videoGlow:rgba(143,136,223,.30);}

/* Les couleurs d'œuvre prennent la main sur les règles génériques de niveau */
.work-inmate .work-title,.work-ceremony .work-title,.work-ange .work-title,
.work-decadence .work-title,.work-deambulation .work-title,.work-phenomene .work-title,.work-confession .work-title{
  color:var(--work-accent);text-shadow:0 0 30px var(--work-accent-soft);
}
.work-inmate .work-level,.work-ceremony .work-level,.work-ange .work-level,
.work-decadence .work-level,.work-deambulation .work-level,.work-phenomene .work-level,.work-confession .work-level,
.work-inmate .kicker,.work-ceremony .kicker,.work-ange .kicker,.work-decadence .kicker,.work-deambulation .kicker,.work-phenomene .kicker,.work-confession .kicker,
.work-inmate .question b,.work-ceremony .question b,.work-ange .question b,.work-decadence .question b,.work-deambulation .question b,.work-phenomene .question b,.work-confession .question b{color:var(--work-accent);}
.work-inmate .btn,.work-ceremony .btn,.work-ange .btn,.work-decadence .btn,.work-deambulation .btn,.work-phenomene .btn,.work-confession .btn,
.work-inmate .question,.work-ceremony .question,.work-ange .question,.work-decadence .question,.work-deambulation .question,.work-phenomene .question,.work-confession .question,
.work-inmate .note-card,.work-ceremony .note-card,.work-ange .note-card,.work-decadence .note-card,.work-deambulation .note-card,.work-phenomene .note-card,.work-confession .note-card,
.work-inmate .video-shell,.work-ceremony .video-shell,.work-ange .video-shell,.work-decadence .video-shell,.work-deambulation .video-shell,.work-phenomene .video-shell,.work-confession .video-shell{border-color:var(--work-accent-soft);}
.work-inmate .question,.work-ceremony .question,.work-ange .question,.work-decadence .question,.work-deambulation .question,.work-phenomene .question,.work-confession .question{background:linear-gradient(180deg,var(--work-accent-faint),rgba(255,255,255,.015));}

/* La tache V1.5 s'applique maintenant à toutes les œuvres */
.work-decadence .work-hero::before,.work-deambulation .work-hero::before,.work-phenomene .work-hero::before,.work-confession .work-hero::before{
  content:"";position:absolute;top:34px;right:6%;width:190px;height:190px;border-radius:50%;z-index:1;pointer-events:none;
  background:radial-gradient(circle,var(--work-spot) 0%,var(--work-spot-soft) 24%,rgba(255,255,255,.03) 48%,transparent 72%);filter:blur(9px);opacity:.92;
}
@media (min-width:900px){.work-decadence .work-hero::before,.work-deambulation .work-hero::before,.work-phenomene .work-hero::before,.work-confession .work-hero::before{top:46px;right:7%;}}
@media (max-width:820px){.work-decadence .work-hero::before,.work-deambulation .work-hero::before,.work-phenomene .work-hero::before,.work-confession .work-hero::before{width:130px;height:130px;top:28px;right:18px;}}

/* Futurs partenariats/publicités : aucun emplacement n'est affiché tant que le PHP ne l'active pas. */
.partner-slot{width:min(var(--max),calc(100% - 40px));margin:auto;padding:12px 0;text-align:center;color:var(--muted);font-size:12px;}
.partner-slot-header{border-top:1px solid var(--line);}
.partner-slot-footer{margin-bottom:26px;border-bottom:1px solid var(--line);}


/* V1.8 — pages secondaires */
.simple-hero{padding:130px 0 70px;background:radial-gradient(circle at 70% 20%,rgba(127,184,232,.10),transparent 30%),linear-gradient(180deg,#080b10,#07090d);border-bottom:1px solid var(--line)}
.simple-hero h1{font-size:clamp(42px,7vw,88px);font-weight:500;letter-spacing:-.045em;margin:14px 0 18px}
.question-static{border:1px solid var(--line);border-radius:18px;padding:22px;background:rgba(255,255,255,.018);line-height:1.65;color:#c9cdd5}
.archive-list{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:820px){.archive-list{grid-template-columns:1fr}}


/* V2.0 — liens archives */
.archive-link{
  display:block;
  color:inherit;
  transition:.25s ease;
}
.archive-link:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.28);
  background:rgba(255,255,255,.045);
}
.archive-link em{
  display:inline-block;
  margin-top:10px;
  color:#cfd4dc;
  font-style:normal;
}

/* V2.1 — formulaire, consentement et Spreadshop */
.contact-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,.7fr);gap:36px;align-items:start}
.contact-form{display:grid;gap:18px;margin-top:28px}
.contact-form label{display:grid;gap:8px;color:#d7dbe2;font-size:14px}
.contact-form input,.contact-form textarea{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025);color:#fff;padding:13px 14px;font:inherit}
.contact-form textarea{resize:vertical;min-height:170px}
.contact-form input:focus,.contact-form textarea:focus{outline:1px solid rgba(127,184,232,.55);border-color:rgba(127,184,232,.55)}
.hp-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.form-note{font-size:13px;color:var(--muted);line-height:1.55}
.legal-copy{max-width:860px}.legal-copy h2{margin-top:34px}.legal-copy a{color:#d7dbe2}
.external-content-box{border:1px solid var(--line);border-radius:18px;padding:28px;background:rgba(255,255,255,.018);text-align:center;margin-top:28px}
.spreadshop-container{min-height:500px;margin-top:28px;background:#fff;border-radius:18px;overflow:hidden}
.cookie-banner{position:fixed;left:20px;right:20px;bottom:20px;z-index:9999;max-width:820px;margin:auto;border:1px solid rgba(255,255,255,.18);border-radius:18px;background:#11151c;padding:20px;box-shadow:0 18px 60px rgba(0,0,0,.45)}
.cookie-banner p{margin:0 0 14px;color:#d6d9df;line-height:1.55}.cookie-actions{display:flex;gap:10px;flex-wrap:wrap}
.cookie-actions button{cursor:pointer}.cookie-secondary{border:1px solid var(--line);background:transparent;color:#fff;border-radius:999px;padding:11px 18px}
.footer-cookie-link{border:0;background:none;color:inherit;font:inherit;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr}.cookie-banner{left:12px;right:12px;bottom:12px}.spreadshop-container{border-radius:10px}}

/* V2.3 — réflexion de bas de page : Penser globalement */
.global-reflection{position:relative;overflow:hidden;padding-top:92px;padding-bottom:104px;background:radial-gradient(circle at 82% 35%,rgba(127,184,232,.07),transparent 30%)}
.global-reflection::before{content:"";display:block;width:72px;height:1px;margin:0 0 34px;background:linear-gradient(90deg,rgba(127,184,232,.75),transparent)}
.global-reflection .reflection-copy{max-width:880px}
.global-reflection h2{max-width:720px}
.global-reflection .reflection-text{max-width:820px;margin-top:26px;color:#c9cdd5;font-size:clamp(17px,1.6vw,20px);line-height:1.85}
.global-reflection .reflection-text p{margin:0 0 20px}
.global-reflection .reflection-text p:last-child{margin-bottom:0}
@media(max-width:820px){.global-reflection{padding-top:70px;padding-bottom:78px}.global-reflection .reflection-text{line-height:1.72}}

/* V2.4.2 — accueil : image et accroche réunies dans une même scène */
@media (min-width:821px){
  .hero.hero-prism{
    min-height:78vh;
    display:grid;
    grid-template-columns:minmax(0, 1.02fr) minmax(520px, .98fr);
    align-items:center;
    gap:0;
    padding-left:max(40px, calc((100vw - var(--max))/2));
    background:#030405;
  }
  .hero.hero-prism .hero-content{
    grid-column:1;
    grid-row:1;
    width:auto;
    max-width:660px;
    margin:0;
    padding:76px 42px 76px 0;
    z-index:3;
  }
  .hero.hero-prism .hero-prism-image{
    position:relative;
    grid-column:2;
    grid-row:1;
    inset:auto;
    width:100%;
    height:min(70vh,720px);
    min-height:500px;
    object-fit:cover;
    /* V2.7.2 : cadrage desktop décalé nettement vers la droite */
    object-position:20% center;
    align-self:stretch;
    z-index:0;
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 8%,#000 24%,#000 100%);
    mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 8%,#000 24%,#000 100%);
  }
  .hero.hero-prism::before{
    background:linear-gradient(90deg,#030405 0%,rgba(3,4,5,.94) 42%,rgba(3,4,5,.28) 61%,rgba(3,4,5,.02) 82%);
    pointer-events:none;
  }
}
@media (max-width:820px){
  .hero.hero-prism{display:flex;flex-direction:column;min-height:auto;padding:0;background:#030405}
  .hero.hero-prism .hero-prism-image{position:relative;inset:auto;width:100%;height:44vh;min-height:300px;object-fit:cover;object-position:42% center;order:1}
  .hero.hero-prism .hero-content{order:2;width:calc(100% - 40px);margin:0 auto;padding:44px 0 58px}
  .hero.hero-prism::before{height:44vh;bottom:auto;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(3,4,5,.18) 60%,#030405 100%)}
}

/* =========================================================
   DOMUS.band V2.6 — Actualité TERROR + Heavy Metal Alliance
   ========================================================= */
.terror-news{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(ellipse at 72% 48%,rgba(143,224,255,.08),transparent 36%),
    linear-gradient(180deg,#07090d,#070b10);
}
.terror-news::after{
  content:"";
  position:absolute;
  width:380px;
  height:180px;
  right:8%;
  top:50%;
  transform:translateY(-50%);
  background:radial-gradient(ellipse,rgba(177,235,255,.08),transparent 68%);
  filter:blur(18px);
  pointer-events:none;
}
.terror-news .wrap{position:relative;z-index:1}
.terror-title{
  color:#d9f6ff;
  text-shadow:0 0 28px rgba(139,222,255,.18);
  letter-spacing:-.035em;
}
.terror-title span{color:#a9dce9}
.terror-hook{
  max-width:760px;
  margin:0 0 10px;
  font-size:clamp(21px,2.4vw,31px);
  line-height:1.4;
  color:#e8edf0;
}
.terror-hook strong{
  color:#c9f2ff;
  font-weight:500;
  text-shadow:0 0 20px rgba(139,222,255,.18);
}

.alliance-partners{display:grid;gap:30px;margin-top:42px}
.alliance-card{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
  gap:34px;
  align-items:center;
  padding:30px;
  border:1px solid var(--line);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
}
.alliance-card h3{font-size:clamp(30px,4vw,48px);font-weight:500;letter-spacing:-.03em;margin:0 0 16px}
.alliance-card p{color:#c9cdd5;font-size:17px;line-height:1.7}
.alliance-video{aspect-ratio:16/9;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:#030405}
.alliance-video iframe{width:100%;height:100%;border:0;display:block}
.alliance-mark{
  aspect-ratio:16/9;
  border:1px solid var(--line);
  border-radius:16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.06),transparent 42%),#06080b;
  color:#aeb4bf;
  letter-spacing:.22em;
}
.alliance-mark span{font-size:clamp(42px,7vw,72px);letter-spacing:.04em;color:#e2e5ea}
.alliance-mark strong{font-size:12px;font-weight:400;margin-top:5px}
@media(max-width:820px){
  .alliance-card{grid-template-columns:1fr;padding:22px}
  .alliance-video,.alliance-mark{order:-1}
  .terror-news::after{right:-140px}
}

/* =========================================================
   DOMUS.band V2.7 — navigation, actualité dynamique, catalogue
   ========================================================= */
.nav-dropdown{position:relative;display:flex;align-items:center}
.nav-dropdown-toggle{border:0;background:none;color:#d8dbe2;font:inherit;font-size:13px;padding:8px 0;cursor:pointer}
.nav-dropdown-toggle:hover,.nav-dropdown-toggle:focus-visible{color:#fff}
.nav-dropdown-menu{display:none;position:absolute;top:100%;left:-18px;min-width:220px;padding:10px;background:#0a0d12;border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 44px rgba(0,0,0,.35)}
.nav-dropdown-menu a{display:block;padding:9px 10px;border-radius:8px;white-space:nowrap}
.nav-dropdown-menu a:hover{background:rgba(255,255,255,.05)}
.nav-dropdown-menu .nav-all-works{margin-top:6px;padding-top:12px;border-top:1px solid var(--line);color:#fff}
.nav-dropdown.open .nav-dropdown-menu{display:block}
@media (min-width:821px){.nav-dropdown:hover .nav-dropdown-menu,.nav-dropdown:focus-within .nav-dropdown-menu{display:block}}

.actualite-news{position:relative;overflow:hidden}
.actualite-news .wrap{position:relative;z-index:1}
.actualite-title{letter-spacing:-.035em}
.actualite-title span{opacity:.82}
.actualite-hook{max-width:760px;margin:0 0 10px;font-size:clamp(21px,2.4vw,31px);line-height:1.4;color:#e8edf0}
.actualite-glace{background:radial-gradient(ellipse at 72% 48%,rgba(143,224,255,.08),transparent 36%),linear-gradient(180deg,#07090d,#070b10)}
.actualite-glace::after{content:"";position:absolute;width:380px;height:180px;right:8%;top:50%;transform:translateY(-50%);background:radial-gradient(ellipse,rgba(177,235,255,.08),transparent 68%);filter:blur(18px);pointer-events:none}
.actualite-glace .actualite-title{color:#d9f6ff;text-shadow:0 0 28px rgba(139,222,255,.18)}
.actualite-glace .actualite-title span{color:#a9dce9}
.actualite-glace .actualite-hook{color:#c9f2ff;text-shadow:0 0 20px rgba(139,222,255,.10)}
.actualite-neutre{background:linear-gradient(180deg,#07090d,#090c11)}

.works-catalog{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.work-catalog-card{position:relative;overflow:hidden;min-height:190px;padding:26px;border:1px solid var(--line);border-radius:20px;background:var(--work-bg);display:flex;flex-direction:column;justify-content:flex-end;transition:.25s ease}
.work-catalog-card:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.28)}
.work-catalog-card span{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#c8ccd4}
.work-catalog-card strong{font-size:clamp(28px,4vw,48px);font-weight:500;letter-spacing:-.035em;color:var(--work-accent);margin:8px 0 16px}
.work-catalog-card b{font-size:14px;font-weight:400;color:#e3e6eb}

@media(max-width:820px){
  .nav-dropdown{display:block;width:100%}
  .nav-dropdown-toggle{width:100%;text-align:left;padding:0;font-size:13px}
  .nav-dropdown-menu{position:static;box-shadow:none;margin-top:10px;margin-left:10px;min-width:0;width:calc(100% - 10px)}
  .nav-dropdown.open .nav-dropdown-menu{display:block}
  .actualite-glace::after{right:-140px}
  .works-catalog{grid-template-columns:1fr}
}