:root {
    --black:#070707;
    --black-soft:#101010;
    --panel:#151515;
    --silver:#d5d5d5;
    --silver-muted:#9c9c9c;
    --white:#f7f7f4;
    --red:#7d1717;
    --red-bright:#a82929;
    --line:rgba(255,255,255,.13);
    --container:1240px;
    --radius:3px;
    --shadow:0 28px 70px rgba(0,0,0,.38);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--black); }
body {
    margin:0;
    color:var(--white);
    background:var(--black);
    font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height:1.65;
}
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
button, input, textarea { font:inherit; }
button { color:inherit; }
.container { width:min(var(--container), calc(100% - 48px)); margin-inline:auto; }
.section { position:relative; padding:112px 0; overflow:hidden; }
.section:nth-of-type(even) { background:var(--black-soft); }
.eyebrow {
    margin:0 0 14px;
    color:#c58a8a;
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.22em;
    text-transform:uppercase;
}
.section-title {
    margin:0;
    max-width:850px;
    font-family:Georgia, "Times New Roman", serif;
    font-size:clamp(2.3rem,5vw,4.8rem);
    font-weight:500;
    line-height:1.02;
}
.section-lead {
    max-width:730px;
    margin:24px 0 0;
    color:var(--silver);
    font-size:1.05rem;
}
.section-heading {
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:48px;
    margin-bottom:54px;
}
.section-heading.centered {
    display:block;
    max-width:900px;
    margin:0 auto 58px;
    text-align:center;
}
.section-heading.centered .section-lead { margin-inline:auto; }
.button-row { display:flex; flex-wrap:wrap; align-items:center; gap:20px; margin-top:34px; }
.centered-row { justify-content:center; }
.button {
    display:inline-flex;
    min-height:52px;
    align-items:center;
    justify-content:center;
    padding:14px 24px;
    border:1px solid var(--red-bright);
    background:var(--red);
    color:white;
    font-size:.78rem;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    transition:.3s ease;
}
.button:hover { background:var(--red-bright); transform:translateY(-2px); }
.button--outline { border-color:rgba(255,255,255,.5); background:rgba(0,0,0,.18); }
.button--outline:hover { background:white; color:black; }
.text-link { color:var(--silver); border-bottom:1px solid rgba(255,255,255,.35); }
.text-link:hover { color:white; }
.skip-link {
    position:fixed; left:16px; top:16px; z-index:2000;
    padding:10px 14px; background:white; color:black;
    transform:translateY(-150%);
}
.skip-link:focus { transform:none; }
.sr-only {
    position:absolute!important; width:1px!important; height:1px!important; padding:0!important;
    margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important;
}
.split-layout, .story-grid, .partners-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:72px;
    align-items:center;
}
.album-cover, .story-image, .partners-image {
    width:100%;
    border:1px solid var(--line);
    box-shadow:var(--shadow);
}
.streaming { display:flex; flex-wrap:wrap; gap:10px; margin-top:34px; }
.streaming span {
    padding:8px 12px; border:1px solid var(--line); color:var(--silver-muted);
    font-size:.76rem; text-transform:uppercase;
}
.site-footer { border-top:1px solid var(--line); background:#050505; }
.footer-grid {
    display:grid; grid-template-columns:1.5fr repeat(3,1fr); gap:48px; padding:72px 0;
}
.footer-grid h2, .footer-grid h3 { margin-top:0; }
.footer-grid p, .footer-grid a { color:var(--silver-muted); }
.footer-grid a { display:block; margin:8px 0; }
.footer-grid a:hover { color:white; }
.footer-emblem { margin-bottom:18px; }
.footer-bottom { border-top:1px solid var(--line); }
.footer-bottom .container { display:flex; justify-content:space-between; gap:24px; padding:18px 0; color:#777; font-size:.8rem; }
.back-to-top {
    position:fixed; right:20px; bottom:20px; z-index:900;
    width:46px; height:46px; border:1px solid var(--line); background:#111; color:white;
    opacity:0; pointer-events:none; transform:translateY(10px); transition:.3s;
}
.back-to-top.is-visible { opacity:1; pointer-events:auto; transform:none; }


body {
    background:
        linear-gradient(rgba(4,4,4,.84),rgba(4,4,4,.92)),
        url("../images/backgrounds/fond-noir-nuages.jpg") center top / cover fixed;
}
.section { background-color:transparent!important; }
.section::before {
    content:"";position:absolute;inset:0;z-index:-1;
    background:rgba(7,7,7,.76);backdrop-filter:blur(1px);
}
.section:nth-of-type(even)::before { background:rgba(12,12,12,.82); }
