
@font-face{
  font-family:'Roca Heavy';
  src:url('../fonts/Roca-Heavy.ttf') format('truetype');
  font-weight:700;
  font-display:swap;
}
@property --active-platform{
  syntax:'<color>';
  inherits:true;
  initial-value:#ff8a42;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
::view-transition-old(root),
::view-transition-new(root){
  animation-duration:.5s;
  animation-timing-function:ease-in-out;
}
.theme-transition,
.theme-transition *{
  transition-property:color, background-color, border-color, box-shadow, filter, opacity !important;
  transition-duration:.5s !important;
  transition-timing-function:ease-in-out !important;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important;}
  ::view-transition-old(root),
  ::view-transition-new(root){ animation-duration:.001ms !important; }
}


body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'DM Sans', sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3{ font-family:'Roca Heavy', sans-serif; margin:0; }
p{ margin:0; }
span{ font-weight:700; }
a{ color:inherit; }
::selection{ background:var(--selection-bg); color:var(--selection-text); }
:focus-visible{ outline:2px solid var(--real-pink); outline-offset:3px; border-radius:4px; }
img,svg{ display:block; }

button,
.btn,
.nav-pill,
.platform-link,
.breath-platforms a,
.breath-page-link,
.social-link,
.story-sound-toggle,
.theme-toggle{
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

#texteStyle{
  display:inline-block;
  margin-top:.45rem;
  font-size:clamp(1rem, 2.4vw, 1.55rem);
  font-weight:700;
  line-height:1.08;
  background:var(--hero-text-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

h3.release-page{
  font-size:clamp(0.7rem, 2vw, 1.4rem);
  font-weight:600;
  letter-spacing:-.01em;
  color:var(--release-accent, var(--real-pink));
}

@media (prefers-color-scheme: light){
  :root:not([data-theme]){
    --bg:#f6f7fb;
    --bg-soft:#eef1f7;
    --surface:rgba(12,18,32,.04);
    --surface-strong:rgba(12,18,32,.08);
    --border:rgba(17,24,39,.12);
    --text:#111827;
    --muted:#5d667d;
    --muted-2:#7a8399;
    --nav-bg:rgba(246,247,251,.74);
    --selection-bg:#111827;
    --selection-text:#f6f7fb;
    --hero-text-gradient:linear-gradient(100deg, #111827 6%, var(--pink) 54%, var(--violet) 92%);
    --card-sheen:linear-gradient(180deg, rgba(255,255,255,.7), rgba(255,255,255,.45));
    --card-top-glow:linear-gradient(155deg, rgba(160,107,255,.16), transparent 42%);
    --decorative-num:rgba(17,24,39,.06);
    color-scheme:light;
    --fos-card-volume-color:#a442ff;
    --fos-card-title-color:#a442ff;
  }
}
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 1.5rem; }

/* ---------- nav ---------- */
nav{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr);
  align-items:center;
  padding:1.1rem 1.5rem;
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  background:var(--nav-bg);
  border-bottom:1px solid var(--border);
}
.nav-actions{
  display:flex;
  align-items:center;
  grid-column:3;
  justify-self:end;
  gap:.7rem;
}
.release-menus{
  display:flex;
  align-items:center;
  justify-content:center;
  grid-column:2;
  gap:.55rem;
}
.breath-menu{
  position:relative;
}
.breath-menu-trigger{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  min-height:2.35rem;
  padding:.45rem .85rem;
  border:1px solid color-mix(in srgb, var(--pink) 55%, transparent);
  border-radius:999px;
  background:color-mix(in srgb, var(--pink) 12%, var(--surface));
  color:var(--text);
  font:inherit;
  font-size:.7rem;
  font-weight:800;
  cursor:pointer;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.release-trigger-label-mobile{ display:none; }
.breath-menu-trigger:hover,
.breath-menu-trigger[aria-expanded="true"]{
  transform:translateY(-1px);
  background:color-mix(in srgb, var(--pink) 20%, var(--surface));
  box-shadow:0 10px 28px color-mix(in srgb, var(--pink) 22%, transparent);
}
.fos-menu-trigger{
  border-color:color-mix(in srgb, var(--violet) 58%, transparent);
  background:color-mix(in srgb, var(--violet) 13%, var(--surface));
}
.fos-menu-trigger:hover,
.fos-menu-trigger[aria-expanded="true"]{
  background:color-mix(in srgb, var(--violet) 22%, var(--surface));
  box-shadow:0 10px 28px color-mix(in srgb, var(--violet) 24%, transparent);
}
.fos-menu .breath-menu-pulse{
  background:#c084fc;
  box-shadow:0 0 0 0 rgba(192,132,252,.55);
}
.breath-menu-pulse{
  width:.48rem;
  height:.48rem;
  border-radius:50%;
  background:#4ade80;
  box-shadow:0 0 0 0 rgba(74,222,128,.55);
  animation:breathPulse 2s infinite;
}
@keyframes breathPulse{ 70%{ box-shadow:0 0 0 7px rgba(74,222,128,0); } 100%{ box-shadow:0 0 0 0 rgba(74,222,128,0); } }
.breath-menu-panel{
  --active-platform:var(--pink);
  position:absolute;
  top:calc(100% + .85rem);
  left:50%;
  width:min(24rem, calc(100vw - 2rem));
  min-width:0;
  isolation:isolate;
  padding:1.1rem;
  border:1px solid color-mix(in srgb, var(--active-platform) 34%, var(--border));
  border-radius:26px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--surface-strong) 72%, transparent), transparent 55%),
    color-mix(in srgb, var(--bg-soft) 94%, transparent);
  box-shadow:
    0 24px 65px rgba(0,0,0,.32),
    0 8px 25px color-mix(in srgb, var(--active-platform) 18%, transparent),
    inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  opacity:0;
  visibility:hidden;
  transform:translate(-50%, -8px) scale(.97);
  transform-origin:top center;
  transition:--active-platform .45s ease, opacity .3s ease, transform .3s ease, visibility .3s, border-color .45s ease, box-shadow .45s ease;
}
.breath-menu-panel::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  border-radius:inherit;
  background:radial-gradient(circle at 50% 0, color-mix(in srgb, var(--active-platform) 24%, transparent), transparent 52%);
  transition:background .45s ease;
  pointer-events:none;
}
.breath-menu-panel::before{
  content:"";
  position:absolute;
  top:-6px;
  left:50%;
  width:11px;
  height:11px;
  border-left:1px solid var(--border);
  border-top:1px solid var(--border);
  background:var(--bg-soft);
  transform:translateX(-50%) rotate(45deg);
}
.breath-menu-panel.is-open{ opacity:1; visibility:visible; transform:translateX(-50%); }
.fos-menu-panel{ --active-platform:var(--violet); }
.breath-menu-panel:has(.platform-soundcloud:is(:hover, :focus-visible)){ --active-platform:#ff5500; }
.breath-menu-panel:has(.platform-spotify:is(:hover, :focus-visible)){ --active-platform:#1ed760; }
.breath-menu-panel:has(.platform-tidal:is(:hover, :focus-visible)){ --active-platform:#22b8cf; }
.breath-menu-panel:has(.platform-apple:is(:hover, :focus-visible)){ --active-platform:#fa57c1; }
.breath-menu-panel:has(.platform-itunes:is(:hover, :focus-visible)){ --active-platform:#9d6cff; }
.breath-menu-panel:has(.platform-deezer:is(:hover, :focus-visible)){ --active-platform:#a238ff; }
.breath-menu-panel > p{
  margin:0 0 .85rem;
  padding:0 .15rem .75rem;
  border-bottom:1px solid var(--border);
  font-size:.75rem;
  font-weight:800;
  color:var(--muted-2);
}
.breath-platforms{ display:flex; justify-content:center; gap:.5rem; }
.breath-platforms a{
  --platform-color:var(--pink);
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:0;
  width:auto;
  max-width:2.35rem;
  height:2.35rem;
  padding:0 .56rem;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:13px;
  background:color-mix(in srgb, var(--platform-color) 12%, var(--surface));
  color:var(--text);
  white-space:nowrap;
  text-decoration:none;
  transition:max-width .5s cubic-bezier(.2,.8,.2,1), transform .35s ease, color .35s ease, background .35s ease, box-shadow .35s ease;
}
.breath-platforms a:hover,
.breath-platforms a:focus-visible{
  max-width:9.5rem;
  transform:translateY(-3px);
  border-color:color-mix(in srgb, var(--platform-color) 55%, var(--border));
  background:color-mix(in srgb, var(--platform-color) 24%, var(--surface-strong));
  box-shadow:0 8px 22px color-mix(in srgb, var(--platform-color) 22%, transparent);
}
.breath-platforms svg{ width:1.1rem; height:1.1rem; fill:currentColor; }
.breath-platforms .platform-spotify{ color:#1ed760; }
.breath-platforms .platform-soundcloud{ --platform-color:#ff5500; }
.breath-platforms .platform-spotify{ --platform-color:#1ed760; }
.breath-platforms .platform-tidal{ --platform-color:#22b8cf; }
.breath-platforms .platform-apple{ --platform-color:#fa57c1; }
.breath-platforms .platform-itunes{ --platform-color:#9d6cff; }
.breath-platforms .platform-deezer{ --platform-color:#a238ff; }
.breath-platforms svg,
.breath-platforms img{ flex:0 0 auto; }
.breath-platforms a > span{
  max-width:0;
  margin-left:0;
  overflow:hidden;
  opacity:0;
  color:var(--text);
  font-size:.68rem;
  font-weight:750;
  transition:max-width .5s cubic-bezier(.2,.8,.2,1), margin-left .5s ease, opacity .3s ease .08s;
}
.breath-platforms a:hover > span,
.breath-platforms a:focus-visible > span{
  max-width:7rem;
  margin-left:.48rem;
  opacity:1;
}
.breath-platforms img{
  width:1.22rem;
  height:1.22rem;
  object-fit:contain;
  transition:filter .35s ease, transform .35s ease;
}
.breath-platforms .platform-soundcloud img{ width:1.38rem; }
.breath-platforms .platform-deezer img{ width:1.3rem; height:1.3rem; }
.breath-platforms .platform-monochrome img{ filter:invert(1) brightness(1.08); }
.breath-platforms a:hover img{ transform:scale(1.08); }
:root[data-theme="light"] .breath-platforms .platform-monochrome img{ filter:none; }
@media (prefers-color-scheme:light){
  :root:not([data-theme]) .breath-platforms .platform-monochrome img{ filter:none; }
}
.breath-page-link{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:.85rem;
  padding:.72rem .85rem;
  border-radius:14px;
  background:linear-gradient(95deg,
    color-mix(in srgb, var(--violet) var(--glass-button-mix, 76%), transparent),
    color-mix(in srgb, var(--pink) var(--glass-button-mix, 76%), transparent));
  color:#fff;
  font-size:.75rem;
  font-weight:800;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease;
}
.breath-page-link:hover{ transform:translateY(-2px); box-shadow:0 10px 25px rgba(255,138,66,.28); }
.fos-presave-link{
  margin-top:0;
  background:linear-gradient(95deg,
    color-mix(in srgb, #5f45d8 var(--glass-button-mix, 76%), transparent),
    color-mix(in srgb, #a442ff var(--glass-button-mix, 76%), transparent));
}
.fos-presave-link:hover{ box-shadow:0 10px 25px rgba(164,66,255,.3); }
.nav-brand{
  display:flex;
  align-items:center;
  grid-column:1;
  justify-self:start;
  gap:.75rem;
  min-width:0;
}
.social-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.15rem;
  height:2.15rem;
  flex:0 0 auto;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--surface);
  text-decoration:none;
  transition:transform .25s ease, background .25s ease, border-color .25s ease;
}
.social-link:hover{
  transform:translateY(-1px);
  background:var(--surface-strong);
}
.social-link:focus-visible{
  outline:2px solid var(--pink);
  outline-offset:3px;
}
.social-link img{
  width:1.25rem;
  height:1.25rem;
  object-fit:contain;
  display:block;
}
:root[data-theme="light"] img[src$="insta.png"],
:root[data-theme="light"] img[src$="soundcloud.png"]{
  filter:brightness(.22);
  opacity:.88;
}
@media (prefers-color-scheme: light){
  :root:not([data-theme]) img[src$="insta.png"],
  :root:not([data-theme]) img[src$="soundcloud.png"]{
    filter:brightness(.22);
    opacity:.88;
  }
}
.brand-mark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.25rem;
  height:2.25rem;
  flex:0 0 auto;
  border-radius:50%;
  overflow:hidden;
  text-decoration:none;
}
.brand-mark img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.logo{
  font-family:'Roca Heavy', sans-serif;
  font-weight:700;
  font-size:.82rem;
  letter-spacing:.05em;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.nav-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:2.35rem;
  padding:.45rem .85rem;
  font-size:.7rem;
  letter-spacing:.08em;
  color:var(--text);
  border:1px solid var(--border);
  border-radius:999px;
  background:var(--surface);
  text-decoration:none;
  text-transform:uppercase;
  font-weight:700;
  transition:transform .25s ease, background .25s ease, border-color .25s ease;
}
.account-login-link{
  gap:.55rem;
  touch-action:manipulation;
}
.account-login-link.is-logout-armed{
  border-color:rgba(255,116,132,.42);
  background:rgba(255,92,114,.12);
  color:#ffbdc6;
}
.account-login-link.is-logout-pending{
  opacity:.68;
  pointer-events:none;
}
.account-greeting{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.account-nav-avatar{
  display:grid;
  place-items:center;
  width:1.65rem;
  height:1.65rem;
  flex:0 0 auto;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:50%;
  background:linear-gradient(145deg, var(--violet), var(--pink));
  color:#fff;
  font-size:.68rem;
  font-weight:800;
}
.account-nav-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.nav-pill:hover{
  transform:translateY(-1px);
  background:var(--surface-strong);
  border-color:rgba(255,255,255,.18);
}
.nav-pill.is-active{
  color:var(--bg);
  border-color:transparent;
  background:var(--text);
}
.theme-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:2.35rem;
  padding:.45rem .9rem;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--surface);
  color:var(--text);
  font:inherit;
  font-size:.7rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
  transition:transform .25s ease, background .25s ease, border-color .25s ease;
}
.theme-toggle:hover{
  transform:translateY(-1px);
  background:var(--surface-strong);
}
.theme-toggle:focus-visible{
  outline:2px solid var(--pink);
  outline-offset:3px;
}
.theme-menu{
  position:fixed;
  z-index:100;
  display:grid;
  min-width:13rem;
  padding:.4rem;
  border:1px solid var(--border);
  border-radius:16px;
  background:color-mix(in srgb, var(--nav-bg) 88%, var(--surface));
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  box-shadow:0 18px 50px rgba(0,0,0,.22);
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px) scale(.98);
  transform-origin:top right;
  transition:opacity .18s ease, transform .18s ease, visibility .18s;
}
.theme-menu.is-open{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
}
.theme-menu-group{
  display:grid;
  gap:.12rem;
}
.theme-menu-group + .theme-menu-group{
  margin-top:.4rem;
  padding-top:.5rem;
  border-top:1px solid var(--border);
}
.theme-menu-label{
  padding:.25rem .85rem;
  color:var(--muted-2);
  font-size:.62rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.theme-menu button{
  padding:.7rem .85rem;
  border:0;
  border-radius:11px;
  background:transparent;
  color:var(--text);
  font:inherit;
  font-size:.78rem;
  font-weight:700;
  text-align:left;
  cursor:pointer;
}
.theme-menu button:hover,
.theme-menu button:focus-visible{
  background:var(--surface-strong);
  outline:none;
}
.theme-menu button.is-active{
  color:var(--real-pink);
}
.glass-slider{
  display:grid;
  gap:.55rem;
  padding:.7rem .85rem .55rem;
  color:var(--text);
  font-size:.7rem;
  font-weight:700;
}
.glass-slider > span{
  display:flex;
  justify-content:space-between;
  gap:1rem;
}
.glass-slider output{
  color:var(--real-pink);
  font-variant-numeric:tabular-nums;
}
.glass-slider input{
  width:100%;
  accent-color:var(--real-pink);
  cursor:pointer;
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.55rem;
  font-family:'DM Sans', sans-serif;
  font-weight:600;
  font-size:.92rem;
  padding:.85rem 1.6rem;
  border-radius:100px;
  cursor:pointer;
  border:none;
  text-decoration:none;
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn-primary{
  background:linear-gradient(95deg, var(--violet), var(--pink));
  color:#fff;
  box-shadow:0 10px 30px -8px rgba(255,138,66,.45);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.btn-primary:hover{ box-shadow:0 16px 40px -8px rgba(255,138,66,.6); }
.btn-ghost{
  background:var(--surface);
  color:var(--text);
  border:1px solid var(--border);
}
.btn-ghost:hover{ background:var(--surface); border-color:var(--surface-strong); }
.btn svg{ width:14px; height:14px; transition:transform .25s ease; }
.btn:hover svg{ transform:translateX(3px); }

/* ---------- equalizer motif ---------- */
.eq{ display:inline-flex; align-items:flex-end; gap:3px; height:16px; }
.eq span{
  width:3px; border-radius:2px;
  background:linear-gradient(180deg, var(--pink), var(--violet));
  animation:eqbounce 1.1s ease-in-out infinite;
}
.eq span:nth-child(1){ height:40%; animation-delay:-.9s; }
.eq span:nth-child(2){ height:90%; animation-delay:-.5s; }
.eq span:nth-child(3){ height:60%; animation-delay:-1.1s; }
.eq span:nth-child(4){ height:100%; animation-delay:-.2s; }
.eq span:nth-child(5){ height:55%; animation-delay:-.7s; }
@keyframes eqbounce{
  0%,100%{ transform:scaleY(.35); }
  50%{ transform:scaleY(1); }
}

/* ---------- hero ---------- */
.hero{
  position:relative;
  min-height:100svh;
  display:flex; align-items:center; justify-content:center;
  text-align:center;
  overflow:hidden;
  padding:7rem 1.5rem 5rem;
}
.aura{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.aura span{
  position:absolute;
  width:46vmax; height:46vmax;
  border-radius:50%;
  filter:blur(110px);
  opacity:.45;
}
.aura .a1{ background:var(--violet); top:-12%; left:-10%; animation:float1 22s ease-in-out infinite alternate; }
.aura .a2{ background:var(--pink); bottom:-18%; right:-8%; animation:float2 26s ease-in-out infinite alternate; }
.aura .a3{ background:var(--amber); top:30%; right:25%; opacity:.22; animation:float3 30s ease-in-out infinite alternate; }
.aura .cursor{
  background:var(--violet);
  opacity:.28;
  width:34vmax; height:34vmax;
  transition:transform .6s cubic-bezier(.2,.7,.3,1);
}
@keyframes float1{ 0%{transform:translate(0,0);} 100%{transform:translate(6%,8%);} }
@keyframes float2{ 0%{transform:translate(0,0);} 100%{transform:translate(-5%,-6%);} }
@keyframes float3{ 0%{transform:translate(0,0) scale(1);} 100%{transform:translate(-8%,5%) scale(1.15);} }

.hero-content{ position:relative; z-index:2; max-width:780px; }
.eyebrow-row{
  display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center;
  margin-bottom:1.8rem;
}
.chip{
  font-size:.7rem; letter-spacing:.06em;
  padding:.4rem .85rem; border-radius:100px;
  border:1px solid var(--border);
  color:var(--muted-2);
  background:var(--surface);
}
.hero h1{
  font-size:clamp(2.6rem, 8vw, 5.6rem);
  font-weight:700;
  line-height:1.02;
  letter-spacing:-.02em;
  background:var(--hero-text-gradient);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

.hero h1.release-page{
  font-size:clamp(3rem, 14vw, 8.7rem);
  font-weight:700;
  line-height:1.02;
  letter-spacing:-.02em;
  background:var(--hero-text-gradient);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero .tagline{
  margin-top:1.3rem;
  font-size:1.08rem;
  color:var(--real-pink);
}
.hero .credit{
  margin-top:.6rem;
  font-size:.85rem;
  color:var(--muted-2);
}
.hero .credit strong{
  color:var(--release-accent-soft, var(--text));
  font-weight:600;
}
.hero-actions{
  margin-top:2.6rem;
  display:flex; gap:.9rem; flex-wrap:wrap; justify-content:center;
}

/* ---------- generic section ---------- */
section{ position:relative; padding:6.5rem 0; }
.section-head{
  max-width:560px;
  margin:0 auto 3rem;
  text-align:center;
}
.section-head .kicker{
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted-2);
  display:flex; align-items:center; justify-content:center; gap:.6rem;
  margin-bottom:1rem;
}
.section-head h2{
  font-size:clamp(1.7rem, 4vw, 2.4rem);
  font-weight:600;
  letter-spacing:-.01em;
}
.section-head p{
  margin-top:.9rem;
  color:var(--muted-2);
  font-size:1rem;
  line-height:1.6;
}

/* ---------- featured volume ---------- */
.story-section{
  overflow:visible;
  min-height:max(2500px, min(720px, 1080px));
}
.story-sound-toggle{
  position:sticky;
  top:6.2rem;
  margin-left:auto;
  margin-right:1.5rem;
  display:block;
  z-index:2;
  border:1px solid var(--border);
  border-radius:999px;
  padding:.7rem 1rem;
  background:color-mix(in srgb, var(--surface) 85%, transparent);
  color:var(--text-alt);
  font:inherit;
  font-size:.72rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  transition:transform .25s ease, background .25s ease, border-color .25s ease;
}
.story-sound-toggle:hover{
  transform:translateY(-1px);
  background:var(--surface-strong);
}
.story-sound-toggle:focus-visible{
  outline:2px solid var(--pink);
  outline-offset:3px;
}
.story-sound-toggle.is-on{
  border-color:var(--pink);
  color:var(--pink);
}
.story-section .wrap{
  position:relative;
  z-index:1;
}
.story-section.is-story-starting .wrap,
.story-section.is-story-starting .story-pin,
.story-section.is-story-ending .wrap,
.story-section.is-story-ending .story-pin{
  position:static;
}
.story-pin{
  position:sticky;
  top:0;
  height:100svh;
  display:flex;
  align-items:center;
  justify-content:center;
}
.story-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:saturate(1.05) contrast(1.02) brightness(.88);
  pointer-events:none;
}
.story-section::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(10,10,19,.18), rgba(10,10,19,.5));
  z-index:0;
  pointer-events:none;
}
.featured{
  max-width:640px;
  text-align:center;
  padding:3.2rem 2rem;
  border-radius:28px;
  background:color-mix(in srgb, var(--surface) 85%, transparent);
  border:1px solid var(--border);
  opacity:0; transform:translateY(24px);
  transition:opacity .7s ease, transform .7s ease;
  position:relative;
  z-index:1;
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
}
.featured.visible{ opacity:1; transform:translateY(0); }
.story-section.is-story-starting .featured{
  position:absolute;
  top:100px;
  left:50%;
  width:min(640px, calc(100vw - 3rem));
  transform:translateX(-50%);
  transition:opacity .7s ease;
  z-index:3;
}
.story-section.is-story-active .featured{
  position:fixed;
  top:50%;
  left:50%;
  width:min(640px, calc(100vw - 3rem));
  transform:translate(-50%, -50%);
  transition:opacity .7s ease;
  z-index:3;
}
.story-section.is-story-ending .featured{
  position:absolute;
  right:auto;
  bottom:100px;
  left:50%;
  width:min(640px, calc(100vw - 3rem));
  transform:translateX(-50%);
  transition:opacity .7s ease;
  z-index:3;
}
.featured .vol{
  font-family:'Roca Heavy', sans-serif;
  font-size:.78rem;
  letter-spacing:.18em;
  color:var(--release-accent, var(--fos-card-volume-color));
  font-weight:700;
}
.featured h3{
  margin-top:.9rem;
  color:var(--release-accent-alt, var(--fos-card-title-color));
  font-size:clamp(2rem, 5vw, 2.8rem);
  font-weight:700;
}
.featured .mood{
  margin-top:1rem;
  color:var(--muted);
  font-size:1rem;
}
.featured .mood span{
  color:var(--release-accent-soft, var(--text));
  font-weight:700;
}
.featured .btn{ margin-top:2rem; }

/* ---------- about strip ---------- */
.about{
  max-width:760px;
  margin:0 auto;
  text-align:center;
  padding:6.5rem 1.5rem;
}
.about p{
  font-size:clamp(1.3rem, 3.2vw, 1.9rem);
  font-weight:500;
  line-height:1.5;
  font-family:'Roca Heavy', sans-serif;
  letter-spacing:-.01em;
}
.about p span{ color:var(--release-accent-soft, var(--muted-2)); }

/* ---------- volumes grid ---------- */
.grid{
  display:flex;
  flex-direction:column;
  gap:.5rem;
  margin-top:.75rem;
}
.vcard{
  position:relative;
  display:flex;
  flex-direction:column;
  padding:1rem 1.3rem;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface);
  opacity:0; transform:translateY(8px);
  transition:opacity .4s ease, transform .4s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease, max-height .4s ease, padding .4s ease;
  box-shadow:0 2px 8px rgba(0,0,0,.08);
  overflow:hidden;
  max-height:3.5rem;
}
.vcard:is(a){
  text-decoration:none;
  cursor:pointer;
}
.vcard:is(a):focus-visible{
  outline:2px solid var(--accent, var(--pink));
  outline-offset:3px;
}
.vcard::before{
  display:none;
}
.vcard::after{
  display:none;
}
.vcard.visible{ opacity:1; transform:translateY(0); }
.vcard:hover{
  border-color:var(--accent, var(--pink));
  background:var(--surface-strong);
  box-shadow:0 8px 20px -8px var(--accent, var(--pink));
  max-height:8rem;
  padding:1.2rem 1.3rem;
}
.vcard-main{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:1.5rem;
  width:100%;
}
.vcard .n{
  font-family:'Roca Heavy', sans-serif;
  font-size:.75rem;
  font-weight:700;
  color:var(--accent, var(--pink));
  letter-spacing:.14em;
  white-space:nowrap;
  flex-shrink:0;
}
.vcard .t{
  justify-self:center;
  font-size:.95rem;
  font-weight:600;
  line-height:1.3;
  letter-spacing:-.01em;
  text-align:center;
}
.vcard .d{
  justify-self:end;
  font-size:.7rem;
  color:var(--muted-2);
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
}
.vcard-info{
  font-size:.85rem;
  color:var(--muted);
  margin-top:0.8rem;
  opacity:0;
  transition:opacity .3s ease .1s;
  line-height:1.5;
}
.vcard:hover .vcard-info{
  opacity:1;
}

/* ---------- sound section ---------- */
.sound-row{
  display:flex; flex-wrap:wrap; gap:.7rem; justify-content:center;
  margin-top:.5rem;
  max-width:700px;
  margin-left:auto;
  margin-right:auto;
}
.sound-chip{
  font-family:'Roca Heavy', sans-serif;
  font-size:.92rem; font-weight:700;
  padding:.7rem 1.3rem;
  border-radius:100px;
  border:1px solid var(--border);
  background:var(--surface);
  transition:transform .25s ease, border-color .25s ease, background .25s ease;
}
.sound-chip:hover{
  transform:translateY(-3px);
  border-color:var(--surface-strong);
  background:var(--surface-strong);
}

/* ---------- release player ---------- */
.btn-music{
  display:flex;
  justify-content:center;
  flex-direction:column;
  align-items:center;
  width:min(560px, calc(100% - 2rem));
  margin:2.5rem auto 0;
  padding:0;
  border:1px solid transparent;
  border-radius:28px;
  background:transparent;
  transition:background .28s ease, border-color .28s ease, box-shadow .28s ease, padding .28s ease;
}
.btn-music.is-open{
  padding:.45rem;
  border-color:var(--border);
  background:linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
  box-shadow:0 24px 70px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));
}
.btn-music .btn{
  position:relative;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  width:100%;
  min-height:3.45rem;
  padding:.9rem 1.35rem;
  border:1px solid var(--border);
  border-radius:999px;
  overflow:hidden;
  z-index:0;
  background:var(--surface);
  color:var(--text);
  font-family:'DM Sans', sans-serif;
  font-size:.86rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:none;
  box-shadow:0 10px 30px rgba(0,0,0,.16);
  transition:transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.btn-music .btn::after{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  z-index:-1;
  background:linear-gradient(95deg, color-mix(in srgb, var(--violet) 26%, transparent), color-mix(in srgb, var(--pink) 22%, transparent));
  opacity:.8;
}
.btn-music .btn:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.2);
  background:var(--surface-strong);
  box-shadow:0 16px 40px rgba(0,0,0,.2);
}
.btn-music .btn.is-playing{
  background:color-mix(in srgb, var(--pink) 16%, var(--surface-strong));
}
.inline-player{
  width:100%;
  max-height:0;
  margin-top:0;
  display:flex;
  justify-content:center;
  overflow:hidden;
  opacity:0;
  transform:translateY(-6px);
  transition:max-height .32s ease, opacity .28s ease, transform .28s ease, margin-top .28s ease;
}
.inline-player.active{
  max-height:220px;
  margin-top:.45rem;
  opacity:1;
  transform:translateY(0);
}
.player-box{
  width:100%;
  display:grid;
  gap:.85rem;
  padding:.9rem .95rem 1rem;
  border:1px solid var(--border);
  border-radius:22px;
  background:rgba(0,0,0,.16);
  animation:playerIn .35s ease;
}
.player-topline{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  gap:.8rem;
  align-items:center;
}
.player-btn{
  width:2.55rem;
  height:2.55rem;
  border:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--text);
  color:var(--bg);
  font-weight:700;
  font-size:.8rem;
  cursor:pointer;
  box-shadow:0 10px 26px rgba(0,0,0,.22);
  transition:transform .2s ease, box-shadow .2s ease;
}
.player-btn:hover{
  transform:scale(1.04);
  box-shadow:0 14px 34px rgba(0,0,0,.28);
}
.player-copy{
  min-width:0;
  display:grid;
  gap:.15rem;
}
.player-title{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--release-accent-soft, var(--text));
  font-size:.95rem;
  font-weight:800;
}
.player-state{
  color:var(--muted);
  font-size:.76rem;
  font-weight:700;
}
.player-time{
  display:flex;
  align-items:center;
  gap:.25rem;
  color:var(--muted);
  font-variant-numeric:tabular-nums;
  font-size:.78rem;
  font-weight:800;
  white-space:nowrap;
}
.player-wave{
  height:2.1rem;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:.25rem .4rem;
  border-radius:16px;
  background:rgba(255,255,255,.035);
}
.player-wave span{
  width:4px;
  height:28%;
  border-radius:999px;
  background:linear-gradient(180deg, var(--pink), var(--violet));
  opacity:.48;
  transform-origin:center;
}
.player-box.is-playing .player-wave span{
  animation:playerWave 1.05s ease-in-out infinite;
}
.player-wave span:nth-child(2n){ height:48%; animation-delay:-.72s; }
.player-wave span:nth-child(3n){ height:72%; animation-delay:-.38s; }
.player-wave span:nth-child(4n){ height:38%; animation-delay:-.18s; }
.player-wave span:nth-child(5n){ height:62%; animation-delay:-.92s; }
@keyframes playerWave{
  0%,100%{ transform:scaleY(.45); opacity:.36; }
  50%{ transform:scaleY(1.25); opacity:.9; }
}
.player-bar-wrap{
  position:relative;
  height:1rem;
  display:grid;
  align-items:center;
}
.player-bar{
  position:relative;
  height:6px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.08);
}
.player-bar::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, var(--violet), var(--pink), var(--amber));
  opacity:.18;
}
.player-progress{
  width:0%;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, var(--violet), var(--pink), var(--amber));
  transition:width .12s linear;
}
.player-range{
  position:absolute;
  inset:0;
  width:100%;
  opacity:0;
  cursor:pointer;
}
.player-volume{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  gap:.75rem;
  align-items:center;
}
.volume-btn{
  min-height:2rem;
  padding:.35rem .7rem;
  border:1px solid var(--border);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:var(--text);
  font:inherit;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .2s ease, border-color .2s ease;
}
.volume-btn:hover,
.volume-btn.is-muted{
  border-color:rgba(255,255,255,.2);
  background:rgba(255,255,255,.11);
}
.volume-range{
  width:100%;
  accent-color:var(--release-accent, var(--pink));
}
@keyframes playerIn{
  from{ opacity:0; transform:translateY(6px) scale(.98); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}

/* ---------- release directory ---------- */
.release-directory{
  min-height:100svh;
  padding:8rem 1.5rem 4rem;
}
.release-directory .wrap{
  display:grid;
  gap:2rem;
}
.release-directory-head{
  display:grid;
  gap:1rem;
  max-width:760px;
}
.release-directory-head .kicker{
  display:flex;
  align-items:center;
  gap:.65rem;
  color:var(--muted-2);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.release-directory-head h1{
  font-size:clamp(2.7rem, 8vw, 5.8rem);
  line-height:.98;
  background:var(--hero-text-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.release-directory-head p{
  max-width:620px;
  color:var(--muted);
  line-height:1.65;
}
.release-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:.85rem;
}
.release-link{
  min-height:8.5rem;
  display:grid;
  align-content:space-between;
  gap:1rem;
  padding:1rem;
  border:1px solid var(--border);
  border-radius:8px;
  background:var(--surface);
  color:inherit;
  text-decoration:none;
  transition:transform .22s ease, border-color .22s ease, background .22s ease;
}
.release-link:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb, var(--pink) 52%, var(--border));
  background:var(--surface-strong);
}
.release-link.is-locked{
  opacity:.58;
}
.release-link-meta{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  color:var(--muted);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.release-link h2{
  font-family:'DM Sans', sans-serif;
  font-size:1.1rem;
  line-height:1.25;
}
.release-link p{
  color:var(--muted);
  font-size:.86rem;
  line-height:1.45;
}

.home-release-grid{
  margin-top:.75rem;
}

#tous-les-volumes{
  scroll-margin-top:5rem;
}

.home-release-link{
  --card-media-base:#11111b;
  --card-media-text:rgba(255,255,255,.86);
  position:relative;
  min-height:23rem;
  overflow:hidden;
  grid-template-rows:auto minmax(10rem, 1fr) auto;
  border-color:color-mix(in srgb, var(--card-accent, var(--pink)) 28%, var(--border));
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--card-accent-alt, var(--violet)) 20%, transparent), transparent 48%),
    linear-gradient(145deg, color-mix(in srgb, var(--card-accent, var(--pink)) 12%, transparent), transparent 62%),
    var(--surface);
}

.home-release-link::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:var(--card-accent, var(--pink));
  opacity:.9;
}

.home-release-link:hover{
  border-color:color-mix(in srgb, var(--card-accent, var(--pink)) 62%, var(--border));
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--card-accent-alt, var(--violet)) 28%, transparent), transparent 50%),
    linear-gradient(145deg, color-mix(in srgb, var(--card-accent, var(--pink)) 19%, transparent), transparent 65%),
    var(--surface-strong);
  box-shadow:0 16px 35px -24px var(--card-accent, var(--pink));
}

.home-release-link .release-link-meta span:first-child,
.home-release-link h2{
  color:var(--card-accent, var(--pink));
}

.home-release-link h2{
  font-family:'Roca Heavy', 'DM Sans', sans-serif;
  font-size:clamp(1.25rem, 2.2vw, 1.65rem);
}

.home-release-date{
  margin-top:.45rem;
  color:color-mix(in srgb, var(--card-accent-alt, var(--violet)) 72%, var(--text)) !important;
  font-size:.74rem !important;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.home-release-media{
  position:relative;
  display:grid;
  min-height:11rem;
  place-items:center;
  overflow:hidden;
  border:1px solid color-mix(in srgb, var(--card-accent-alt, var(--violet)) 35%, var(--border));
  border-radius:6px;
  background:
    radial-gradient(circle at 75% 20%, color-mix(in srgb, var(--card-accent-alt, var(--violet)) 90%, transparent) 0, transparent 48%),
    radial-gradient(circle at 20% 85%, color-mix(in srgb, var(--card-accent, var(--pink)) 85%, transparent) 0, transparent 52%),
    linear-gradient(135deg, color-mix(in srgb, var(--card-accent, var(--pink)) 65%, var(--card-media-base)), color-mix(in srgb, var(--card-accent-alt, var(--violet)) 58%, var(--card-media-base)));
  isolation:isolate;
}

.home-release-media::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(115deg, rgba(255,255,255,.14), transparent 35%, rgba(0,0,0,.16));
}

.home-release-media span{
  color:var(--card-media-text);
  font-family:'Roca Heavy', 'DM Sans', sans-serif;
  font-size:clamp(1.2rem, 3vw, 2rem);
  letter-spacing:.12em;
  text-shadow:0 4px 25px rgba(0,0,0,.3);
}

.home-release-media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .45s ease;
}

.home-release-link:hover .home-release-media img{
  transform:scale(1.035);
}

.home-release-link.is-locked{
  cursor:default;
}

:root[data-glass="opaque"] :is(
  .breath-menu-panel,
  .featured,
  .btn-music,
  .feature-card,
  .home-release-link
){
  background:var(--surface-strong);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

:root[data-theme="light"] .home-release-link{
  --card-media-base:#f4f1f8;
  --card-media-text:rgba(32,24,44,.78);
  border-color:color-mix(in srgb, var(--card-accent, var(--pink)) 38%, var(--border));
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--card-accent-alt, var(--violet)) 22%, transparent), transparent 48%),
    linear-gradient(145deg, color-mix(in srgb, var(--card-accent, var(--pink)) 10%, transparent), transparent 62%),
    rgba(255,255,255,.64);
}

:root[data-theme="light"] .home-release-link:hover{
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--card-accent-alt, var(--violet)) 30%, transparent), transparent 50%),
    linear-gradient(145deg, color-mix(in srgb, var(--card-accent, var(--pink)) 16%, transparent), transparent 65%),
    rgba(255,255,255,.9);
}

:root[data-theme="light"][data-glass="opaque"] .home-release-link,
:root[data-theme="light"][data-glass="opaque"] .home-release-link:hover{
  background:var(--surface);
}

@media (max-width:640px){
  .home-release-link{
    min-height:20rem;
  }
}
@media (max-width:860px){
  .release-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:560px){
  .release-directory{ padding-top:6rem; }
  .release-grid{ grid-template-columns:1fr; }
}

@media (prefers-color-scheme: light){
  :root:not([data-theme]) body{
    background:
      radial-gradient(circle at top left, rgba(160,107,255,.08), transparent 28%),
      radial-gradient(circle at bottom right, rgba(255,95,160,.08), transparent 26%),
      var(--bg);
  }
  :root:not([data-theme]) nav{
    background:rgba(246,247,251,.72);
  }
  :root:not([data-theme]) .aura{ opacity:.82; }
  :root:not([data-theme]) .aura .a1{ opacity:.16; }
  :root:not([data-theme]) .aura .a2{ opacity:.14; }
  :root:not([data-theme]) .aura .a3{ opacity:.08; }
  :root:not([data-theme]) .aura .cursor{ opacity:.12; }
  :root:not([data-theme]) .featured,
  :root:not([data-theme]) .chip,
  :root:not([data-theme]) .sound-chip{
    box-shadow:0 12px 30px -26px rgba(17,24,39,.35);
  }
  :root:not([data-theme]) .vcard{
    box-shadow:0 18px 45px -30px rgba(17,24,39,.28);
  }
  :root:not([data-theme]) .vcard:hover{
    box-shadow:0 24px 60px -28px color-mix(in srgb, var(--accent) 55%, rgba(17,24,39,.2));
  }
}

/* ---------- outro ---------- */
.outro{
  text-align:center;
  padding:7rem 1.5rem 4rem;
}
.outro h2{
  font-size:clamp(1.6rem, 4vw, 2.2rem);
  font-weight:600;
}
.outro .credit{
  margin-top:.8rem;
  color:var(--release-accent-soft, var(--muted-2));
  font-size:.95rem;
}
.outro .btn{ margin-top:2.2rem; }
footer.fineprint{
  text-align:center;
  padding:2rem 1.5rem 3rem;
  font-size:.7rem;
  letter-spacing:.04em;
  color:var(--muted-2);
}

@media (max-width:1100px) and (min-width:901px){
  .logo{ display:none; }
  .release-menus{ gap:.35rem; }
  .breath-menu-trigger{
    padding:.4rem .6rem;
    font-size:.58rem;
  }
}

@media (max-width:900px) and (min-width:641px){
  .logo{ display:none; }
  .release-menus{
    position:absolute;
    top:4.5rem;
    right:1rem;
    left:1rem;
    width:auto;
    gap:.45rem;
  }
  .release-menus .breath-menu{
    flex:1 1 0;
    min-width:0;
  }
  .breath-menu-trigger{
    width:100%;
    justify-content:center;
    font-size:.62rem;
    text-align:center;
  }
  .breath-menu-panel{
    position:fixed;
    top:7.4rem;
    right:1rem;
    left:1rem;
    width:auto;
    transform:translateY(-8px) scale(.97);
  }
  .breath-menu-panel.is-open{ transform:none; }
  .hero{ padding-top:10rem; }
}

@media (max-width:640px){
  .wrap{ padding:0 1rem; }
  nav{
    align-items:flex-start;
    gap:.8rem;
    padding:.85rem 1rem;
  }
  .logo{
    max-width:58vw;
    line-height:1.25;
  }
  .nav-brand{
    gap:.55rem;
    max-width:calc(100% - 10rem);
  }
  .social-link{
    width:1.95rem;
    height:1.95rem;
  }
  .social-link img{
    width:1.12rem;
    height:1.12rem;
  }
  .brand-mark{
    width:2rem;
    height:2rem;
  }
  .theme-toggle{
    min-height:2.15rem;
    padding:.4rem .65rem;
    font-size:.62rem;
  }
  .nav-pill{
    min-height:2.15rem;
    padding:.4rem .62rem;
    font-size:.62rem;
  }
  .release-menus{
    position:absolute;
    top:4.15rem;
    right:1rem;
    left:1rem;
    width:auto;
    gap:.4rem;
  }
  .release-menus .breath-menu{
    flex:1 1 0;
    min-width:0;
  }
  .breath-menu-trigger{
    width:100%;
    min-height:3rem;
    justify-content:center;
    padding:.4rem .55rem;
    font-size:.56rem;
    line-height:1.25;
    text-align:center;
  }
  .breath-menu-panel{ position:fixed; top:6.9rem; right:1rem; left:1rem; width:auto; min-width:0; transform:translateY(-8px) scale(.97); }
  .breath-menu-panel.is-open{ transform:none; }
  .breath-menu-panel::before{ left:50%; }
  .breath-platforms{ justify-content:flex-start; overflow-x:auto; padding:.2rem 0 .45rem; scrollbar-width:none; }
  .breath-platforms::-webkit-scrollbar{ display:none; }
  .btn{
    width:100%;
    justify-content:center;
    padding:.85rem 1rem;
  }
  section{ padding:4.5rem 0; }
  .hero{
    min-height:auto;
    padding:10rem 1rem 4rem;
  }
  .hero-content{ max-width:100%; }
  .hero h1{
    font-size:clamp(2.4rem, 17vw, 4.3rem);
    line-height:1;
  }
  .hero h1.release-page{
    font-size:clamp(3rem, 18vw, 5.6rem);
  }
  .hero-actions{ margin-top:2rem; }
  .eyebrow-row{ gap:.4rem; margin-bottom:1.3rem; }
  .chip{ font-size:.64rem; padding:.35rem .65rem; }
  .aura span{
    width:62vmax;
    height:62vmax;
    filter:blur(80px);
  }
  .story-section{
    min-height:auto;
    padding:5rem 0;
    overflow:hidden;
  }
  .story-sound-toggle{
    position:relative;
    top:auto;
    margin:0 1rem 1rem auto;
    padding:.58rem .8rem;
    font-size:.65rem;
  }
  .story-pin,
  .story-section.is-story-starting .story-pin,
  .story-section.is-story-ending .story-pin{
    position:relative;
    height:auto;
    min-height:70svh;
  }
  .story-section.is-story-starting .featured,
  .story-section.is-story-active .featured,
  .story-section.is-story-ending .featured{
    position:relative;
    inset:auto;
    width:calc(100vw - 2rem);
    transform:none;
  }
  .featured{
    width:calc(100vw - 2rem);
    padding:2rem 1rem;
    border-radius:18px;
  }
  .featured h3{ font-size:clamp(1.8rem, 10vw, 2.6rem); }
  .about{ padding:4rem 1rem; }
  .section-head{
    margin-bottom:2rem;
    padding:0 .25rem;
  }
  .section-head .kicker{
    flex-wrap:wrap;
    line-height:1.4;
  }
  .vcard{
    max-height:none;
    padding:1rem;
  }
  .vcard:hover{
    transform:none;
    max-height:none;
    padding:1rem;
  }
  .vcard-main{
    grid-template-columns:1fr;
    gap:.45rem;
    text-align:left;
  }
  .vcard .t,
  .vcard .d{
    justify-self:start;
    text-align:left;
    white-space:normal;
  }
  .vcard-info{
    opacity:1;
    margin-top:.65rem;
  }
  .sound-row{ justify-content:flex-start; }
  .sound-chip{ font-size:.82rem; padding:.6rem .9rem; }
  .btn-music{
    width:calc(100% - 2rem);
    border-radius:22px;
  }
  .btn-music .btn{
    min-height:3.15rem;
    font-size:.76rem;
    letter-spacing:.06em;
    padding:.8rem .9rem;
  }
  .player-box{
    gap:.75rem;
    padding:.8rem;
    border-radius:18px;
  }
  .player-topline{
    grid-template-columns:auto minmax(0, 1fr);
  }
  .player-time{
    grid-column:1 / -1;
    justify-content:flex-end;
  }
  .player-wave{
    height:1.65rem;
    gap:4px;
  }
  .player-wave span{ width:3px; }
  .player-volume{
    grid-template-columns:1fr;
    gap:.45rem;
  }
  .volume-btn{
    justify-self:start;
    min-height:1.9rem;
  }
  .release-directory{
    padding:6.5rem 1rem 3rem;
  }
  .release-directory-head h1{
    font-size:clamp(2.6rem, 16vw, 4.8rem);
  }
  .release-link-meta{
    flex-direction:column;
    gap:.25rem;
  }
  .outro{ padding:4.5rem 1rem 3rem; }
  footer.fineprint{ padding:1.5rem 1rem 2.5rem; }
}

@media (max-width:380px){
  .logo{ max-width:54vw; font-size:.72rem; }
  .theme-toggle{ font-size:.56rem; }
  .hero h1.release-page{ font-size:clamp(2.5rem, 17vw, 4.2rem); }
  .player-title{ font-size:.86rem; }
}

/* ---------- 2026 interface refinement ---------- */
:root{
  --ui-radius-sm:14px;
  --ui-radius-md:22px;
  --ui-radius-lg:32px;
  --ui-ease:cubic-bezier(.22, 1, .36, 1);
  --ui-shadow:0 24px 70px -34px rgba(0,0,0,.72);
  --ui-shadow-soft:0 14px 40px -28px rgba(0,0,0,.55);
  --ui-highlight:rgba(255,255,255,.13);
}

body{
  min-height:100svh;
  background:
    radial-gradient(ellipse 60% 36% at 8% 5%, color-mix(in srgb, var(--violet) 10%, transparent), transparent),
    radial-gradient(ellipse 52% 32% at 94% 92%, color-mix(in srgb, var(--pink) 8%, transparent), transparent),
    var(--bg);
  background-attachment:fixed;
}

body::before{
  content:"";
  position:fixed;
  z-index:999;
  inset:0;
  pointer-events:none;
  opacity:.022;
  background-image:repeating-linear-gradient(115deg, rgba(255,255,255,.9) 0 1px, transparent 1px 4px);
  mix-blend-mode:soft-light;
}

.wrap{ width:100%; }

.is-reveal-target{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .7s var(--ui-ease) var(--reveal-delay, 0ms), transform .7s var(--ui-ease) var(--reveal-delay, 0ms);
}
.is-reveal-target.is-visible{
  opacity:1;
  transform:none;
}

nav{
  top:0;
  right:0;
  left:0;
  width:auto;
  padding:3rem 1.25rem;
  border-radius:0;
  box-shadow:inset 0 -1px 0 color-mix(in srgb, var(--border) 48%, transparent), inset 0 1px 0 var(--ui-highlight);
  transition:top .45s var(--ui-ease), right .45s var(--ui-ease), left .45s var(--ui-ease), padding .35s var(--ui-ease), border-radius .45s var(--ui-ease), background .35s ease, border-color .35s ease, box-shadow .45s var(--ui-ease);
}

nav.is-scrolled{
  top:.75rem;
  right:.75rem;
  left:.75rem;
  padding:.5rem .65rem;
  border-radius:var(--ui-radius-md);
  border-color:color-mix(in srgb, var(--border) 75%, var(--text) 8%);
  box-shadow:0 18px 50px -26px rgba(0,0,0,.8), inset 0 1px 0 var(--ui-highlight);
}

nav:not(.is-scrolled) .release-menus,
nav:not(.is-scrolled) .nav-actions{
  flex-direction:column;
  gap:.45rem;
}
nav:not(.is-scrolled) .release-menus{
  position:relative;
}
nav:not(.is-scrolled) .fos-menu{
  position:static;
}
nav:not(.is-scrolled) .fos-menu-panel{
  top:calc(100% + .85rem);
}
nav:not(.is-scrolled) .release-menus,
nav:not(.is-scrolled) .nav-actions{
  align-items:stretch;
}
nav:not(.is-scrolled) .breath-menu-trigger,
nav:not(.is-scrolled) .nav-pill,
nav:not(.is-scrolled) .theme-toggle{
  width:100%;
  justify-content:center;
}
nav:not(.is-scrolled) .nav-actions{
  min-width:7.4rem;
}
nav:not(.is-scrolled) .header-profile-links{
  display:flex;
}
.header-profile-links{
  display:none;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:.35rem;
  margin-top:.45rem;
}
.header-profile-links a{
  --platform-color:var(--pink);
  position:relative;
  display:flex;
  height:2rem;
  align-items:center;
  justify-content:center;
  gap:.38rem;
  padding:0 .6rem;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:10px;
  background:color-mix(in srgb, var(--platform-color) 8%, var(--surface));
  color:var(--text);
  text-decoration:none;
  box-shadow:inset 0 1px 0 var(--ui-highlight);
  transition:transform .3s var(--ui-ease), border-color .25s ease, background .25s ease, box-shadow .3s var(--ui-ease);
}
.header-profile-links a:hover,
.header-profile-links a:focus-visible{
  transform:translateY(-3px);
  border-color:color-mix(in srgb, var(--platform-color) 68%, var(--border));
  background:color-mix(in srgb, var(--platform-color) 22%, var(--surface-strong));
  box-shadow:0 10px 24px -12px color-mix(in srgb, var(--platform-color) 80%, transparent), inset 0 1px 0 rgba(255,255,255,.2);
}
.header-profile-links a > span{
  color:var(--text);
  font-size:.58rem;
  font-weight:750;
  letter-spacing:.01em;
  white-space:nowrap;
}
.header-profile-links img{
  width:.95rem;
  height:.95rem;
  object-fit:contain;
  transition:transform .3s var(--ui-ease);
}
.header-profile-links a:hover img,
.header-profile-links a:focus-visible img{
  transform:scale(1.13);
}
.header-profile-links .platform-soundcloud{ --platform-color:#ff5500; }
.header-profile-links .platform-spotify{ --platform-color:#1ed760; }
.header-profile-links .platform-tidal{ --platform-color:#55d7ff; }
.header-profile-links .platform-apple{ --platform-color:#fa57c1; }
.header-profile-links .platform-deezer{ --platform-color:#a855f7; }
.header-profile-links .platform-monochrome img{ filter:invert(1) brightness(1.08); }
:root[data-theme="light"] .header-profile-links .platform-monochrome img{ filter:none; }
@media (prefers-color-scheme:light){
  :root:not([data-theme]) .header-profile-links .platform-monochrome img{ filter:none; }
}
nav:not(.is-scrolled) .nav-brand{
  display:grid;
  grid-template-columns:2.15rem minmax(0, 1fr);
  grid-template-rows:repeat(3, auto);
  align-items:center;
  column-gap:.85rem;
  row-gap:.42rem;
}
nav:not(.is-scrolled) .social-link[data-link="social.instagram"]{
  grid-column:1;
  grid-row:2;
}
nav:not(.is-scrolled) .social-link[data-link="social.soundcloudProfile"]{
  grid-column:1;
  grid-row:3;
}
nav:not(.is-scrolled) .brand-mark{
  grid-column:1;
  grid-row:1;
  justify-self:center;
}
nav:not(.is-scrolled) .logo{
  grid-column:2;
  grid-row:1 / -1;
}

.nav-brand{ gap:.55rem; }
.brand-mark{
  width:2.15rem;
  height:2.15rem;
  overflow:visible;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.logo{
  display:flex;
  align-items:center;
  gap:.35rem;
  font-size:.74rem;
  letter-spacing:.025em;
  text-decoration:none;
  transition:transform .4s var(--ui-ease);
}
.logo-title{
  display:flex;
  gap:.22em;
  background:var(--hero-text-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.logo-title span{ font-weight:inherit; }
.logo-artists{
  color:var(--muted-2);
  font-family:'DM Sans', sans-serif;
  font-size:.58rem;
  font-weight:700;
  letter-spacing:.055em;
  white-space:nowrap;
}
nav:not(.is-scrolled) .logo{
  display:grid;
  align-content:center;
  gap:.55rem;
  overflow:visible;
  white-space:normal;
}
nav:not(.is-scrolled) .logo-title{
  display:grid;
  gap:0;
  font-size:clamp(1.65rem, 2.6vw, 2.65rem);
  line-height:.82;
  letter-spacing:-.055em;
}
nav:not(.is-scrolled) .logo-artists{
  padding-left:.08rem;
  font-size:.62rem;
  letter-spacing:.11em;
  text-transform:uppercase;
}
nav.is-scrolled .logo-artists{
  display:none;
}
.social-link,
.nav-pill,
.theme-toggle,
.breath-menu-trigger{
  border-color:color-mix(in srgb, var(--border) 90%, white 10%);
  box-shadow:inset 0 1px 0 var(--ui-highlight), 0 5px 18px -15px rgba(0,0,0,.8);
  transition:transform .3s var(--ui-ease), background .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.social-link:hover,
.nav-pill:hover,
.theme-toggle:hover,
.breath-menu-trigger:hover,
.breath-menu-trigger[aria-expanded="true"]{
  transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 12px 28px -18px rgba(0,0,0,.85);
}

/* Platform colour pours from left to right like a compact paint swipe. */
.social-link[data-link="social.instagram"],
.social-link[data-link="social.soundcloudProfile"]{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.social-link[data-link="social.instagram"]::before,
.social-link[data-link="social.soundcloudProfile"]::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:-20%;
  bottom:-20%;
  left:-20%;
  width:145%;
  border-radius:35% 48% 42% 38%;
  clip-path:polygon(0 0, 83% 0, 91% 15%, 85% 34%, 95% 54%, 86% 73%, 93% 100%, 0 100%);
  transform:translateX(-108%) skewX(-7deg);
  transform-origin:left center;
  transition:transform .52s var(--ui-ease);
  will-change:transform;
}
.social-link[data-link="social.instagram"]::after,
.social-link[data-link="social.soundcloudProfile"]::after{
  content:"";
  position:absolute;
  z-index:0;
  top:-25%;
  bottom:-25%;
  left:-35%;
  width:28%;
  border-radius:50%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.4), transparent);
  opacity:0;
  transform:translateX(0) rotate(8deg);
  transition:transform .58s var(--ui-ease), opacity .18s ease;
  pointer-events:none;
}
.social-link[data-link="social.instagram"]::before{
  background:linear-gradient(105deg, #7638fa 2%, #d300c5 35%, #ff0169 58%, #ff7a00 82%, #ffd600);
}
.social-link[data-link="social.soundcloudProfile"]::before{
  background:linear-gradient(105deg, #e83b00, #ff5500 56%, #ff9d3d);
}
.social-link[data-link="social.instagram"] img,
.social-link[data-link="social.soundcloudProfile"] img{
  position:relative;
  z-index:1;
  transition:transform .42s var(--ui-ease), filter .28s ease, opacity .28s ease;
}
.social-link[data-link="social.instagram"]:is(:hover, :focus-visible),
.social-link[data-link="social.soundcloudProfile"]:is(:hover, :focus-visible){
  border-color:transparent;
  transform:translateY(-2px) scale(1.035);
}
.social-link[data-link="social.instagram"]:is(:hover, :focus-visible){
  box-shadow:0 12px 30px -12px rgba(255,1,105,.78), 0 5px 16px -9px rgba(118,56,250,.8);
}
.social-link[data-link="social.soundcloudProfile"]:is(:hover, :focus-visible){
  box-shadow:0 13px 30px -12px rgba(255,85,0,.86);
}
.social-link[data-link="social.instagram"]:is(:hover, :focus-visible)::before,
.social-link[data-link="social.soundcloudProfile"]:is(:hover, :focus-visible)::before{
  transform:translateX(0) skewX(-7deg);
}
.social-link[data-link="social.instagram"]:is(:hover, :focus-visible)::after,
.social-link[data-link="social.soundcloudProfile"]:is(:hover, :focus-visible)::after{
  opacity:1;
  transform:translateX(520%) rotate(8deg);
}
.social-link[data-link="social.instagram"]:is(:hover, :focus-visible) img{
  filter:brightness(0) invert(1);
  opacity:1;
  transform:scale(1.1) rotate(4deg);
}
.social-link[data-link="social.soundcloudProfile"]:is(:hover, :focus-visible) img{
  filter:brightness(0) invert(1);
  opacity:1;
  transform:translateX(1px) scale(1.12);
}
.social-link[data-link="social.instagram"]:active,
.social-link[data-link="social.soundcloudProfile"]:active{
  transform:translateY(0) scale(.94);
}

.breath-menu-panel,
.theme-menu{
  border-radius:var(--ui-radius-md);
  box-shadow:0 28px 80px -26px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.14);
}
.breath-menu-panel{
  padding:1rem;
  transform:translate(-50%, -10px) scale(.96);
  transition:--active-platform .45s ease, opacity .28s ease, transform .38s var(--ui-ease), visibility .28s, border-color .45s ease, box-shadow .45s ease;
}
.breath-menu-panel.is-open{ transform:translateX(-50%) scale(1); }
.breath-platforms a{ border-radius:12px; }
.breath-page-link{
  min-height:2.65rem;
  border-radius:13px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2);
}

.theme-menu{
  min-width:16rem;
  padding:.55rem;
  border-radius:20px;
}
.theme-menu-group{
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:.3rem;
}
.theme-menu-label,
.glass-slider{ grid-column:1 / -1; }
.theme-menu-label{ padding:.35rem .55rem .25rem; }
.theme-menu button{
  min-width:0;
  padding:.65rem .4rem;
  border:1px solid transparent;
  border-radius:10px;
  text-align:center;
}
.theme-menu button.is-active{
  border-color:var(--border);
  background:var(--surface-strong);
  box-shadow:inset 0 1px 0 var(--ui-highlight);
}
.glass-slider{ padding:.7rem .55rem .45rem; }

.btn{
  min-height:3.2rem;
  padding:.88rem 1.45rem;
  border:1px solid transparent;
  font-size:.88rem;
  font-weight:750;
  letter-spacing:-.005em;
  box-shadow:inset 0 1px 0 var(--ui-highlight);
  transition:transform .34s var(--ui-ease), box-shadow .34s var(--ui-ease), background .3s ease, border-color .3s ease;
}
.btn:hover{ transform:translateY(-3px) scale(1.015); }
.btn:active{ transform:translateY(0) scale(.985); }
.btn-primary{
  border-color:rgba(255,255,255,.13);
  background:linear-gradient(105deg, var(--violet), var(--pink) 72%, var(--amber));
  background-size:115% 100%;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 14px 35px -16px rgba(255,138,66,.72);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.btn-primary:hover{
  background-position:100% 0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32), 0 20px 44px -17px rgba(255,138,66,.82);
}
.btn-bg-fos{
  border-color:rgba(255,255,255,.13);
  background:linear-gradient(105deg, #002fff, #a442ff 72%, #d15cff);
  background-size:115% 100%;
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 14px 35px -16px rgba(164,66,255,.72);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.btn-bg-fos:hover{
  background-position:100% 0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32), 0 20px 44px -17px rgba(164,66,255,.82);
}
.btn-ghost{
  border-color:color-mix(in srgb, var(--border) 90%, white 10%);
  box-shadow:inset 0 1px 0 var(--ui-highlight), var(--ui-shadow-soft);
}

.hero{
  min-height:max(760px, 100svh);
  padding-top:var(--header-expanded-clearance, 14rem);
}
.hero::after{
  content:"";
  position:absolute;
  z-index:1;
  right:0;
  bottom:0;
  left:0;
  height:34%;
  pointer-events:none;
  background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--bg) 84%, transparent));
}
.hero-content{
  max-width:920px;
  animation:heroEntrance .85s var(--ui-ease) both;
}
@keyframes heroEntrance{
  from{ opacity:0; transform:translateY(16px) scale(.99); }
  to{ opacity:1; transform:none; }
}
.eyebrow-row{ margin-bottom:2rem; }
.chip{
  padding:.45rem .75rem;
  border-color:color-mix(in srgb, var(--border) 88%, white 12%);
  font-size:.66rem;
  font-weight:750;
  box-shadow:inset 0 1px 0 var(--ui-highlight);
}
.hero h1,
.release-directory-head h1{
  letter-spacing:-.045em;
  text-wrap:balance;
}
.hero h1{ font-size:clamp(3.15rem, 8.8vw, 6.6rem); }
.hero h1.release-page{ font-size:clamp(3.8rem, 14vw, 9.5rem); }
.hero .tagline{
  max-width:650px;
  margin:1.55rem auto 0;
  color:color-mix(in srgb, var(--text) 76%, var(--real-pink));
  font-size:clamp(1rem, 1.8vw, 1.2rem);
  line-height:1.55;
  text-wrap:balance;
}
.hero .tagline span{ color:var(--real-pink); }
.hero .credit{ margin-top:.8rem; }
.hero-actions{ margin-top:2.35rem; gap:.7rem; }
.platform-links{ margin-top:1.35rem; gap:.5rem; }
.platform-link{
  min-height:2.55rem;
  padding:.6rem .82rem;
  border-radius:14px;
  box-shadow:inset 0 1px 0 var(--ui-highlight), 0 8px 20px -17px rgba(0,0,0,.8);
  transition:transform .32s var(--ui-ease), border-color .25s ease, background-color .25s ease, box-shadow .32s var(--ui-ease);
}
.platform-link:hover{ transform:translateY(-3px) scale(1.015); }

section{ padding:7.5rem 0; }
.section-head{ max-width:680px; margin-bottom:3.5rem; }
.section-head .kicker,
.release-directory-head .kicker{
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.2em;
}
.section-head h2{
  font-size:clamp(2.1rem, 4.8vw, 3.35rem);
  letter-spacing:-.035em;
  text-wrap:balance;
}
.section-head p{ max-width:540px; margin-right:auto; margin-left:auto; }

.story-section::before{
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 28%, transparent), rgba(10,10,19,.52)),
    radial-gradient(circle at 50% 45%, transparent 10%, rgba(10,10,19,.34) 76%);
}
.story-sound-toggle{
  padding:.68rem .9rem;
  border-color:rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 14px 35px -20px rgba(0,0,0,.8);
}
.featured{
  max-width:680px;
  padding:3.7rem 2.4rem;
  overflow:hidden;
  border-radius:var(--ui-radius-lg);
  border-color:rgba(255,255,255,.16);
  background:
    radial-gradient(circle at 50% 0, color-mix(in srgb, var(--release-accent, var(--violet)) 18%, transparent), transparent 54%),
    color-mix(in srgb, var(--surface) 86%, transparent);
  box-shadow:0 36px 100px -38px rgba(0,0,0,.88), inset 0 1px 0 rgba(255,255,255,.18);
}
.featured::before{
  content:"";
  position:absolute;
  top:0;
  right:18%;
  left:18%;
  height:1px;
  background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--release-accent, var(--pink)) 70%, white), transparent);
}
.featured h3{ letter-spacing:-.035em; text-wrap:balance; }
.featured .mood{ line-height:1.6; }

.about{
  max-width:920px;
  padding:8.5rem 1.5rem;
}
.about::before{
  content:"“";
  display:block;
  height:2.7rem;
  margin-bottom:1.2rem;
  color:color-mix(in srgb, var(--violet) 70%, var(--pink));
  font-family:'Roca Heavy', sans-serif;
  font-size:4.5rem;
  line-height:1;
  opacity:.72;
}
.about p{
  font-size:clamp(1.55rem, 3.6vw, 2.55rem);
  line-height:1.34;
  letter-spacing:-.028em;
  text-wrap:balance;
}

#tous-les-volumes,
.sound-section{
  isolation:isolate;
}
#tous-les-volumes::before,
.sound-section::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:2rem 0;
  pointer-events:none;
  background:radial-gradient(ellipse 55% 38% at 50% 18%, color-mix(in srgb, var(--violet) 8%, transparent), transparent);
}
.release-grid{ gap:1rem; }
.release-link{
  min-height:10rem;
  padding:1.25rem;
  overflow:hidden;
  border-radius:var(--ui-radius-md);
  box-shadow:inset 0 1px 0 var(--ui-highlight), var(--ui-shadow-soft);
  transition:transform .4s var(--ui-ease), border-color .3s ease, background .3s ease, box-shadow .4s var(--ui-ease);
}
.release-link:hover{
  transform:translateY(-6px) scale(1.008);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), var(--ui-shadow);
}
.release-link-meta{ font-size:.66rem; }
.release-link h2{ letter-spacing:-.025em; }
.home-release-grid{ gap:1.15rem; }
.home-release-link{
  min-height:25rem;
  padding:1rem;
  border-radius:28px;
  transform:translateZ(0);
}
.home-release-link::before{
  inset:0 18% auto;
  width:auto;
  height:1px;
  background:linear-gradient(90deg, transparent, var(--card-accent, var(--pink)), transparent);
}
.home-release-link:not(.is-locked)::after{
  content:"↗";
  position:absolute;
  right:1.1rem;
  bottom:1rem;
  display:grid;
  width:2.15rem;
  height:2.15rem;
  place-items:center;
  border:1px solid color-mix(in srgb, var(--card-accent, var(--pink)) 38%, var(--border));
  border-radius:50%;
  background:color-mix(in srgb, var(--card-accent, var(--pink)) 12%, var(--surface));
  color:var(--card-accent, var(--pink));
  font-size:.9rem;
  transition:transform .35s var(--ui-ease), background .3s ease;
}
.home-release-link:not(.is-locked):hover::after{
  transform:translate(2px, -2px) rotate(4deg);
  background:color-mix(in srgb, var(--card-accent, var(--pink)) 22%, var(--surface));
}
.home-release-media{
  min-height:12.5rem;
  border-radius:19px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 18px 40px -28px rgba(0,0,0,.9);
}
.home-release-media::after{
  background:
    linear-gradient(135deg, rgba(255,255,255,.18), transparent 32%),
    linear-gradient(115deg, transparent 38%, rgba(255,255,255,.08) 48%, transparent 58%),
    linear-gradient(180deg, transparent, rgba(0,0,0,.12));
}
.home-release-link:hover .home-release-media img{ transform:scale(1.045); }

.sound-row{ gap:.6rem; }
.sound-chip{
  padding:.72rem 1.15rem;
  border-radius:14px;
  font-family:'DM Sans', sans-serif;
  font-size:.82rem;
  box-shadow:inset 0 1px 0 var(--ui-highlight);
  transition:transform .34s var(--ui-ease), border-color .25s ease, background .25s ease, box-shadow .34s var(--ui-ease);
}
.sound-chip:hover{
  transform:translateY(-4px) rotate(-1deg);
  border-color:color-mix(in srgb, var(--pink) 30%, var(--border));
  box-shadow:0 14px 32px -24px color-mix(in srgb, var(--pink) 72%, transparent), inset 0 1px 0 var(--ui-highlight);
}

.btn-music.is-open,
.player-box,
.feature-card{
  border-radius:var(--ui-radius-lg);
  box-shadow:0 30px 85px -38px rgba(0,0,0,.78), inset 0 1px 0 rgba(255,255,255,.13);
}
.btn-music .btn{ border-radius:16px; }
.player-btn{
  box-shadow:0 12px 30px -14px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.2);
}
.player-wave,
.player-bar{ background:color-mix(in srgb, var(--surface-strong) 70%, transparent); }
.feature-card{ padding:clamp(1.1rem, 3vw, 1.7rem); }
.feature-card iframe,
.soundcloud-embed{ border-radius:20px; }
.feature-link{
  padding:.75rem 1rem;
  border-radius:999px;
  background:var(--surface);
  transition:transform .3s var(--ui-ease), color .25s ease, background .25s ease;
}
.feature-link:hover{ transform:translateY(-2px); background:var(--surface-strong); }

.release-directory{ padding-top:var(--header-expanded-clearance, 14rem); }
.release-directory .wrap{ gap:3.5rem; }
.release-directory-head{ max-width:820px; }
.release-directory-head h1{ font-size:clamp(3.2rem, 8.5vw, 6.8rem); }
.release-directory-head p{ font-size:1.08rem; }

.outro{ padding-top:8rem; }
.outro::before{
  content:"";
  display:block;
  width:min(360px, 70vw);
  height:1px;
  margin:0 auto 3rem;
  background:linear-gradient(90deg, transparent, var(--border), transparent);
}
footer.fineprint{
  display:grid;
  gap:.35rem;
  border-top:1px solid color-mix(in srgb, var(--border) 58%, transparent);
  background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--surface) 44%, transparent));
}

:root[data-theme="light"]{
  --ui-shadow:0 24px 70px -38px rgba(45,37,71,.3);
  --ui-shadow-soft:0 14px 40px -30px rgba(45,37,71,.22);
  --ui-highlight:rgba(255,255,255,.68);
}
:root[data-theme="light"] body::before{ opacity:.01; }
:root[data-theme="light"] .release-directory-head h1{
  background:linear-gradient(100deg, #33243d 5%, #b22f70 52%, #6539ad 92%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
:root[data-theme="light"] .release-directory-head .kicker{
  color:#61546f;
}
:root[data-theme="light"] .release-directory-head p{
  color:#50596d;
}
:root[data-theme="light"] .release-link{
  border-color:rgba(63,48,76,.15);
  background:
    radial-gradient(circle at 100% 0%, rgba(160,107,255,.1), transparent 52%),
    rgba(255,255,255,.76);
  color:#2d2336;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92), 0 18px 45px -34px rgba(49,35,67,.34);
}
:root[data-theme="light"] .release-link:hover{
  border-color:rgba(128,65,177,.32);
  background:
    radial-gradient(circle at 100% 0%, rgba(160,107,255,.16), transparent 54%),
    rgba(255,255,255,.94);
  box-shadow:inset 0 1px 0 #fff, 0 22px 52px -32px rgba(73,44,96,.38);
}
:root[data-theme="light"] .release-link-meta{
  color:#596176;
}
:root[data-theme="light"] .release-link-meta span:last-child{
  color:#32634a;
}
:root[data-theme="light"] .release-link h2{
  color:#2d2336;
}
:root[data-theme="light"] .release-link p{
  color:#596176;
}
:root[data-theme="light"] .release-link.is-locked{
  opacity:.78;
}
:root[data-theme="light"] .release-link.is-locked .release-link-meta span:last-child{
  color:#805321;
}
:root[data-theme="light"] .featured{
  box-shadow:0 36px 100px -44px rgba(76,55,118,.34), inset 0 1px 0 rgba(255,255,255,.82);
}
:root[data-theme="light"] nav.is-over-dark-media{
  background:color-mix(in srgb, var(--nav-bg) 25%, rgba(255,255,255,.94));
  border-color:rgba(42,35,62,.18);
  box-shadow:0 20px 54px -28px rgba(24,18,42,.42), inset 0 1px 0 rgba(255,255,255,.92);
}
:root[data-theme="light"] nav.is-over-dark-media :is(
  .social-link,
  .nav-pill,
  .theme-toggle,
  .breath-menu-trigger
){
  border-color:rgba(42,35,62,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.86), 0 8px 22px -18px rgba(24,18,42,.38);
}

@media (max-width:900px){
  nav{ top:0; right:0; left:0; }
  nav.is-scrolled{ top:.5rem; right:.5rem; left:.5rem; }
  .release-menus{ top:4.35rem; }
  .breath-menu-panel{ top:7.25rem; }
  nav:not(.is-scrolled) .breath-menu-panel{
    top:calc(var(--header-expanded-clearance, 13.5rem) - .5rem);
  }
  nav.is-scrolled .breath-menu-panel{ top:4.75rem; }
  .hero{ padding-top:var(--header-expanded-clearance, 13.5rem); }
  .release-directory{ padding-top:var(--header-expanded-clearance, 13.5rem); }
}

@media (max-width:640px){
  body{ background-attachment:scroll; }
  body::before{ display:none; }
  nav{
    padding:.82rem .75rem;
    border-radius:0;
  }
  nav.is-scrolled{
    padding:.5rem .58rem;
    border-radius:18px;
  }
  .nav-brand{ max-width:calc(100% - 8rem); }
  .social-link{ display:none; }
  .release-menus{ top:4.05rem; right:.5rem; left:.5rem; }
  .breath-menu-trigger{ min-height:2.75rem; border-radius:16px; }
  .breath-menu-panel{ top:6.95rem; right:.5rem; left:.5rem; }
  nav:not(.is-scrolled) .breath-menu-panel{
    top:calc(var(--header-expanded-clearance, 12.5rem) - .5rem);
  }
  nav.is-scrolled .breath-menu-panel{ top:4.4rem; }
  .theme-menu{ right:.5rem !important; left:.5rem; min-width:0; }
  .hero{
    min-height:100svh;
    padding:var(--header-expanded-clearance, 12.5rem) 1rem 4rem;
  }
  .hero h1{ font-size:clamp(3rem, 18vw, 4.7rem); }
  .hero h1.release-page{ font-size:clamp(3.35rem, 19vw, 5.8rem); }
  .hero .tagline br{ display:none; }
  .hero-actions{ gap:.55rem; }
  .btn{ min-height:3.25rem; }
  section{ padding:5.5rem 0; }
  .section-head h2{ font-size:clamp(2rem, 10vw, 2.75rem); }
  .featured{
    padding:2.5rem 1.2rem;
    border-radius:24px;
  }
  .about{ padding:6rem 1.2rem; }
  .about p{ font-size:clamp(1.45rem, 7.5vw, 2rem); }
  .home-release-grid{ gap:.8rem; }
  .home-release-link{
    min-height:22rem;
    border-radius:24px;
  }
  .home-release-media{ min-height:11rem; border-radius:16px; }
  .release-link:hover{ transform:none; }
  .sound-row{ justify-content:center; }
  .sound-chip:hover{ transform:translateY(-2px); }
  .btn-music.is-open,
  .player-box,
  .feature-card{ border-radius:24px; }
  .release-directory{ padding-top:var(--header-expanded-clearance, 12.5rem); }
}

@media (hover:none){
  .btn:hover,
  .platform-link:hover,
  .release-link:hover,
  .sound-chip:hover{ transform:none; }
}

/* Mobile header: keep every control in the document flow while the header is
   expanded. The desktop refinement above otherwise overlaps the release row
   with the brand/actions columns on narrow screens. */
@media (max-width:640px){
  nav,
  nav.is-scrolled{
    grid-template-columns:minmax(0, 1fr) auto;
    grid-template-rows:auto auto;
    align-items:center;
    gap:.65rem .5rem;
  }

  .nav-brand,
  nav:not(.is-scrolled) .nav-brand{
    display:flex;
    grid-column:1;
    grid-row:1;
    max-width:none;
    gap:.5rem;
  }

  nav:not(.is-scrolled) .logo,
  .logo{
    display:flex;
    overflow:hidden;
    white-space:nowrap;
  }

  nav:not(.is-scrolled) .logo-title,
  .logo-title{
    display:flex;
    gap:.2em;
    font-size:.78rem;
    line-height:1;
    letter-spacing:.01em;
    white-space:nowrap;
  }

  .logo-artists,
  nav:not(.is-scrolled) .logo-artists,
  .nav-actions .nav-pill{
    display:none;
  }

  .nav-actions .account-login-link{
    display:inline-flex;
    min-height:2.15rem;
    padding:.4rem .62rem;
    max-width:9.5rem;
    white-space:nowrap;
  }

  .nav-actions,
  nav:not(.is-scrolled) .nav-actions{
    grid-column:2;
    grid-row:1;
    min-width:0;
    flex-direction:row;
    align-items:center;
  }

  .theme-toggle{
    width:auto !important;
    max-width:7.5rem;
    white-space:nowrap;
  }

  .release-menus,
  nav:not(.is-scrolled) .release-menus{
    position:static;
    display:grid;
    grid-column:1 / -1;
    grid-row:2;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    width:100%;
    gap:.45rem;
    flex-direction:row;
  }

  .release-menus .breath-menu{
    min-width:0;
  }

  .breath-menu-trigger,
  nav:not(.is-scrolled) .breath-menu-trigger{
    width:100%;
    min-width:0;
    height:2.8rem;
    min-height:2.8rem;
    padding:.45rem .5rem;
    overflow:hidden;
    white-space:nowrap;
  }

  .release-trigger-label{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .release-trigger-label-desktop{ display:none; }
  .release-trigger-label-mobile{ display:block; }

  .hero,
  .release-directory{
    padding-top:var(--header-expanded-clearance, 8.5rem);
  }

  h3.release-page,
  .hero h1.release-page{
    left:auto;
    width:auto;
    max-width:100%;
    transform:none;
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .hero h1.release-page{
    font-size:clamp(2.7rem, 15vw, 4.5rem);
    line-height:.95;
  }
}
