/* =========================================================
   OBSIDIANCE — feuille de style partagée
   Concept : la dualité de l'obsidienne.
   Lueur d'ambre (l'humain, les mots) qui transperce un verre
   noir traversé d'un chatoiement froid (la technique).
   ========================================================= */

:root{
  --obsidian:#08080c;
  --glass:#101019;
  --glass-2:#181826;
  --line:rgba(176,170,210,.10);
  --ash:#eceaf2;
  --smoke:#928fa8;
  --smoke-dim:#5f5c74;
  --ember:#e8a45c;        /* lueur chaude — l'humain, les mots */
  --ember-soft:#f3c79a;
  --sheen-1:#8a7bf0;      /* chatoiement froid — la technique */
  --sheen-2:#46d6c5;
  --maxw:1180px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--obsidian);
  color:var(--ash);
  font-family:"Manrope",system-ui,sans-serif;
  font-weight:300;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:rgba(232,164,92,.28);color:#fff}

/* grain d'obsidienne subtil sur toute la page */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.5;
  background:
    radial-gradient(1200px 600px at 18% -8%, rgba(138,123,240,.10), transparent 60%),
    radial-gradient(900px 500px at 92% 8%, rgba(70,214,197,.06), transparent 60%);
}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;position:relative;z-index:2}

.eyebrow{
  font-family:"JetBrains Mono",monospace;
  font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--sheen-2);font-weight:400;
}
.serif{font-family:"Cormorant Garamond",serif}

/* accès clavier visible */
a:focus-visible,button:focus-visible,.track:focus-visible{
  outline:2px solid var(--ember);outline-offset:3px;border-radius:4px;
}

/* lien d'évitement (accessibilité) */
.skip-link{
  position:absolute;left:-999px;top:0;z-index:100;
  background:var(--ember);color:#1a1206;padding:10px 18px;border-radius:0 0 8px 0;
  font-family:"JetBrains Mono",monospace;font-size:.8rem;
}
.skip-link:focus{left:0}

/* ---------- NAV ---------- */
header.nav{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 28px;
  transition:background .4s ease, padding .4s ease, border-color .4s ease;
  border-bottom:1px solid transparent;
}
header.nav.scrolled{
  background:rgba(8,8,12,.72);
  backdrop-filter:blur(14px);
  padding:14px 28px;
  border-bottom:1px solid var(--line);
}
.brand{
  font-family:"Cormorant Garamond",serif;
  font-size:1.5rem;font-weight:600;letter-spacing:.14em;
  background:linear-gradient(100deg,var(--ash) 30%,var(--ember-soft));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
nav.links{display:flex;gap:34px;align-items:center}
nav.links a{
  font-size:.84rem;letter-spacing:.06em;color:var(--smoke);
  transition:color .25s ease;position:relative;
}
nav.links a:hover,nav.links a.active{color:var(--ash)}
.nav-cta{
  font-family:"JetBrains Mono",monospace;font-size:.74rem;letter-spacing:.08em;
  padding:9px 18px;border:1px solid rgba(232,164,92,.4);border-radius:999px;
  color:var(--ember-soft)!important;transition:.3s ease;
}
.nav-cta:hover{background:rgba(232,164,92,.12);border-color:var(--ember)}
.burger{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px}
.burger span{width:24px;height:2px;background:var(--ash);display:block;transition:.3s}

/* ---------- HERO ---------- */
.hero{
  min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;position:relative;padding:120px 28px 80px;overflow:hidden;
}
.ember-glow{
  position:absolute;left:50%;top:42%;width:760px;height:760px;transform:translate(-50%,-50%);
  background:radial-gradient(circle, rgba(232,164,92,.20), rgba(232,164,92,.05) 38%, transparent 66%);
  filter:blur(20px);z-index:0;animation:breathe 9s ease-in-out infinite;
}
@keyframes breathe{0%,100%{opacity:.7;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}}

.echo-field{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);z-index:0;pointer-events:none}
.echo{
  position:absolute;left:50%;top:50%;width:280px;height:280px;border-radius:50%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(138,123,240,.35);
  animation:ripple 6s ease-out infinite;
}
.echo:nth-child(2){animation-delay:2s;border-color:rgba(70,214,197,.28)}
.echo:nth-child(3){animation-delay:4s;border-color:rgba(232,164,92,.22)}
@keyframes ripple{
  0%{width:120px;height:120px;opacity:.6}
  100%{width:1100px;height:1100px;opacity:0}
}

.hero-inner{position:relative;z-index:3}
.hero .eyebrow{margin-bottom:26px;animation:rise .9s .1s both}
.wordmark{
  font-family:"Cormorant Garamond",serif;
  font-weight:600;letter-spacing:.04em;line-height:.92;
  font-size:clamp(3.4rem,13vw,9.5rem);
  background:linear-gradient(180deg,#fff 0%,var(--ash) 45%,#b9b6c9 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:rise 1s .2s both;
}
.reflection{
  font-family:"Cormorant Garamond",serif;font-weight:600;letter-spacing:.04em;line-height:.92;
  font-size:clamp(3.4rem,13vw,9.5rem);
  transform:scaleY(-1);margin-top:-.06em;
  background:linear-gradient(180deg,rgba(185,182,201,.28),transparent 62%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.5),transparent 70%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,.5),transparent 70%);
  user-select:none;pointer-events:none;
}
.tagline{
  font-family:"Cormorant Garamond",serif;font-style:italic;
  font-size:clamp(1.4rem,3.2vw,2.1rem);color:var(--ash);
  margin:18px 0 10px;animation:rise 1s .35s both;
}
.hero-sub{
  max-width:540px;margin:0 auto;color:var(--smoke);font-size:1.02rem;
  animation:rise 1s .5s both;
}
.hero-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:38px;animation:rise 1s .65s both}
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}

.btn{
  display:inline-flex;align-items:center;gap:10px;cursor:pointer;
  font-family:"Manrope";font-size:.92rem;font-weight:500;letter-spacing:.02em;
  padding:14px 26px;border-radius:999px;transition:.3s ease;border:1px solid transparent;
}
.btn-primary{
  background:linear-gradient(100deg,var(--ember),var(--ember-soft));
  color:#1a1206;font-weight:600;
  box-shadow:0 0 0 0 rgba(232,164,92,.45);
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 40px -10px rgba(232,164,92,.5)}
.btn-ghost{border-color:var(--line);color:var(--ash);background:rgba(255,255,255,.02)}
.btn-ghost:hover{border-color:rgba(138,123,240,.5);background:rgba(138,123,240,.08)}

.scroll-hint{
  position:absolute;bottom:30px;left:50%;transform:translateX(-50%);z-index:3;
  font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.3em;
  color:var(--smoke-dim);text-transform:uppercase;animation:bob 2.4s ease-in-out infinite;
}
@keyframes bob{0%,100%{transform:translateX(-50%) translateY(0);opacity:.5}50%{transform:translateX(-50%) translateY(6px);opacity:1}}

/* ---------- SECTIONS ---------- */
section{padding:120px 0;position:relative}
.section-head{margin-bottom:56px;max-width:680px}
.section-head .eyebrow{display:block;margin-bottom:18px}
.section-head h2{
  font-family:"Cormorant Garamond",serif;font-weight:500;
  font-size:clamp(2.1rem,5vw,3.4rem);line-height:1.08;letter-spacing:.01em;
}
.section-head h2 em{font-style:italic;color:var(--ember-soft)}

/* ---------- MANIFESTE ---------- */
.manifesto{border-top:1px solid var(--line)}
.manifesto .grid{display:grid;grid-template-columns:1fr 1.15fr;gap:70px;align-items:start}
.manifesto .lede{
  font-family:"Cormorant Garamond",serif;font-size:clamp(1.5rem,3vw,2rem);
  line-height:1.35;color:var(--ash);
}
.manifesto .lede .ink{
  background:linear-gradient(120deg,var(--sheen-1),var(--sheen-2));
  -webkit-background-clip:text;background-clip:text;color:transparent;font-style:italic;
}
.manifesto .body p{color:var(--smoke);margin-bottom:20px;font-size:1.04rem}
.manifesto .body p strong{color:var(--ash);font-weight:500}
.pull{
  margin-top:34px;padding:24px 28px;border-left:2px solid var(--ember);
  background:linear-gradient(90deg,rgba(232,164,92,.07),transparent);
  font-family:"Cormorant Garamond",serif;font-style:italic;font-size:1.3rem;
  color:var(--ember-soft);line-height:1.4;
}

/* ---------- ALBUMS (grille accueil) ---------- */
.albums{border-top:1px solid var(--line)}
.albums-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.album{
  position:relative;border-radius:18px;overflow:hidden;padding:42px 38px 38px;
  background:linear-gradient(165deg,var(--glass-2),var(--glass));
  border:1px solid var(--line);min-height:380px;
  display:flex;flex-direction:column;justify-content:space-between;
  transition:transform .4s ease, border-color .4s ease;
}
.album::after{
  content:"";position:absolute;inset:0;opacity:0;transition:opacity .5s ease;pointer-events:none;
}
.album:hover{transform:translateY(-6px)}
.album.a1{border-color:rgba(232,164,92,.16)}
.album.a1::after{background:radial-gradient(420px 280px at 80% 0%,rgba(232,164,92,.16),transparent 70%)}
.album.a2{border-color:rgba(138,123,240,.16)}
.album.a2::after{background:radial-gradient(420px 280px at 80% 0%,rgba(138,123,240,.18),transparent 70%)}
.album:hover::after{opacity:1}
.album-meta{font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--smoke);position:relative;z-index:2}
.album h3{font-family:"Cormorant Garamond",serif;font-size:clamp(2rem,4vw,3rem);font-weight:500;margin:14px 0 12px;position:relative;z-index:2}
.album p{color:var(--smoke);font-size:1rem;max-width:38ch;position:relative;z-index:2}
.album-foot{display:flex;align-items:center;justify-content:space-between;margin-top:30px;position:relative;z-index:2}
.tracks-count{font-family:"JetBrains Mono",monospace;font-size:2.6rem;font-weight:500;color:var(--ash);line-height:1}
.tracks-count span{font-size:.8rem;color:var(--smoke);letter-spacing:.15em}
.album-link{font-size:.86rem;color:var(--ember-soft);display:inline-flex;align-items:center;gap:7px;transition:gap .3s}
.album-link:hover{gap:12px}

/* ---------- TITRES / TRACKLIST ---------- */
.tracks{border-top:1px solid var(--line)}
.tracklist{border-top:1px solid var(--line)}
.track{
  display:grid;grid-template-columns:46px 1fr auto 42px;gap:22px;align-items:center;
  padding:22px 4px;border-bottom:1px solid var(--line);cursor:pointer;
  transition:background .3s ease,padding-left .3s ease;
}
.track:hover{background:rgba(138,123,240,.05);padding-left:14px}
.track-num{font-family:"JetBrains Mono",monospace;font-size:.92rem;color:var(--smoke-dim)}
.track-main .t-title{font-family:"Cormorant Garamond",serif;font-size:1.5rem;font-weight:500;color:var(--ash)}
.track-main .t-desc{font-size:.88rem;color:var(--smoke);margin-top:2px;max-width:60ch}
.track-tag{
  font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;
  padding:5px 11px;border-radius:999px;border:1px solid var(--line);color:var(--smoke);white-space:nowrap;
}
.track-tag.warm{color:var(--ember-soft);border-color:rgba(232,164,92,.3)}
.track-tag.cool{color:var(--sheen-2);border-color:rgba(70,214,197,.3)}
.track-tag.fav{color:#ffcf6a;border-color:rgba(255,207,106,.5);background:rgba(255,207,106,.08)}
.track-tag.explicit{color:#e89090;border-color:rgba(232,144,144,.35)}
.track-tag.en{color:var(--sheen-1);border-color:rgba(138,123,240,.35)}
.track-tag.soon{color:var(--smoke-dim);border-color:var(--line);font-style:normal}
.track-tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}
.track-play{
  width:42px;height:42px;border-radius:50%;border:1px solid var(--line);
  display:grid;place-items:center;color:var(--ash);transition:.3s ease;flex-shrink:0;
}
.track:hover .track-play{border-color:var(--ember);color:var(--ember-soft);background:rgba(232,164,92,.1)}

/* ---------- DÉMARCHE / TRANSPARENCE ---------- */
.approach{border-top:1px solid var(--line);background:linear-gradient(180deg,transparent,rgba(138,123,240,.03),transparent)}
.approach .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:20px}
.facet{padding:30px 26px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.015)}
.facet .ico{font-family:"JetBrains Mono",monospace;font-size:.7rem;letter-spacing:.2em;color:var(--sheen-2);margin-bottom:16px}
.facet h4{font-family:"Cormorant Garamond",serif;font-size:1.5rem;font-weight:500;margin-bottom:10px}
.facet p{color:var(--smoke);font-size:.96rem}
.facet.human{border-color:rgba(232,164,92,.2)}
.facet.human .ico{color:var(--ember-soft)}

/* ---------- ÉCOUTER ---------- */
.listen{border-top:1px solid var(--line);text-align:center}
.listen .section-head{margin:0 auto 46px}
.platforms{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;align-items:center}
.plat{
  display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border-radius:14px;
  border:1px solid var(--line);font-size:.92rem;color:var(--ash);transition:.3s ease;
  background:rgba(255,255,255,.02);
}
.plat.live:hover{border-color:var(--ember);background:rgba(232,164,92,.1);transform:translateY(-3px)}
.plat.soon{color:var(--smoke-dim);cursor:default}
.plat.soon .badge{font-family:"JetBrains Mono",monospace;font-size:.6rem;letter-spacing:.12em;border:1px solid var(--line);padding:2px 7px;border-radius:6px}
.yt-dot{width:9px;height:9px;border-radius:50%;background:var(--ember);box-shadow:0 0 10px var(--ember)}
.dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.dot-spotify{background:#1DB954;box-shadow:0 0 10px rgba(29,185,84,.6)}
.dot-apple{background:#fc3c44;box-shadow:0 0 10px rgba(252,60,68,.5)}
.dot-deezer{background:#a238ff;box-shadow:0 0 10px rgba(162,56,255,.5)}
.dot-yt{background:#ff0000;box-shadow:0 0 10px rgba(255,0,0,.45)}

/* ---------- EN-TÊTE DE PAGE INTERNE ---------- */
.page-hero{
  position:relative;padding:170px 0 70px;border-bottom:1px solid var(--line);overflow:hidden;
}
.page-hero .ember-glow{top:30%;width:560px;height:560px;opacity:.7}
.page-hero .wrap{position:relative;z-index:3}
.breadcrumb{
  font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.12em;
  color:var(--smoke-dim);margin-bottom:22px;
}
.breadcrumb a{color:var(--smoke)}
.breadcrumb a:hover{color:var(--ember-soft)}
.page-hero h1{
  font-family:"Cormorant Garamond",serif;font-weight:500;
  font-size:clamp(2.6rem,7vw,5rem);line-height:1.02;letter-spacing:.01em;
}
.page-hero .lead{
  max-width:620px;margin-top:18px;color:var(--smoke);font-size:1.08rem;
}
.album-stat{
  display:flex;gap:34px;margin-top:34px;flex-wrap:wrap;
}
.album-stat .stat{font-family:"JetBrains Mono",monospace}
.album-stat .stat b{display:block;font-size:1.8rem;color:var(--ash);font-weight:500}
.album-stat .stat span{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--smoke-dim)}

/* ---------- LECTEUR YOUTUBE EMBARQUÉ ---------- */
.player{margin:0 0 30px}
.player .frame{
  position:relative;width:100%;aspect-ratio:16/9;border-radius:16px;overflow:hidden;
  border:1px solid var(--line);background:var(--glass);
}
.player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- PAGE LÉGALE / TEXTE ---------- */
.legal{padding:150px 0 90px}
.legal .wrap{max-width:820px}
.legal h2{
  font-family:"Cormorant Garamond",serif;font-weight:500;font-size:1.9rem;
  margin:46px 0 14px;color:var(--ash);
}
.legal h2:first-of-type{margin-top:30px}
.legal h3{font-size:1.1rem;font-weight:600;margin:24px 0 8px;color:var(--ash)}
.legal p{color:var(--smoke);margin-bottom:14px}
.legal p strong{color:var(--ash);font-weight:500}
.legal a{color:var(--ember-soft);text-decoration:underline;text-underline-offset:3px}
.legal .lang-sep{
  margin:60px 0 0;padding-top:40px;border-top:1px solid var(--line);
  font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--sheen-2);
}

/* ---------- FOOTER ---------- */
footer{border-top:1px solid var(--line);padding:64px 0 50px;position:relative}
.foot-grid{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:30px}
.foot-brand{font-family:"Cormorant Garamond",serif;font-size:2rem;font-weight:600;letter-spacing:.1em;background:linear-gradient(100deg,var(--ash),var(--ember-soft));-webkit-background-clip:text;background-clip:text;color:transparent}
.foot-tag{color:var(--smoke);font-style:italic;font-family:"Cormorant Garamond",serif;font-size:1.05rem;margin-top:6px}
.foot-links{display:flex;gap:26px;font-size:.86rem;color:var(--smoke);flex-wrap:wrap}
.foot-links a:hover{color:var(--ember-soft)}
.foot-legal{margin-top:40px;font-family:"JetBrains Mono",monospace;font-size:.68rem;letter-spacing:.08em;color:var(--smoke-dim);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}

/* ---------- REVEAL ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* ---------- RESPONSIVE ---------- */
@media(max-width:860px){
  nav.links{
    position:fixed;inset:0 0 0 auto;width:74%;max-width:320px;
    background:rgba(8,8,12,.96);backdrop-filter:blur(18px);
    flex-direction:column;justify-content:center;align-items:flex-start;
    gap:30px;padding:60px 40px;transform:translateX(100%);transition:transform .4s ease;
    border-left:1px solid var(--line);
  }
  nav.links.open{transform:translateX(0)}
  nav.links a{font-size:1.1rem}
  .burger{display:flex;z-index:60}
  .manifesto .grid{grid-template-columns:1fr;gap:36px}
  .albums-grid{grid-template-columns:1fr}
  .approach .grid{grid-template-columns:1fr}
  .track{grid-template-columns:34px 1fr auto 38px;gap:14px}
  .track-tag{display:none}
  .track-play{width:38px;height:38px}
  section{padding:84px 0}
}
@media(prefers-reduced-motio