:root{--ink:#171717;--red:#ab122e;--paper:#f5f2e9;--line:#c5c1b7}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:1rem/1.55 "DM Sans","Hiragino Kaku Gothic ProN","Yu Gothic",Arial,sans-serif}
main,header,footer{max-width:72rem;margin:auto;padding:1.25rem clamp(1.1rem,5vw,4rem)}
header,footer{display:flex;justify-content:space-between;align-items:center}
header{border-bottom:1px solid var(--ink)}footer{border-top:1px solid var(--ink);margin-top:3rem}
a{color:inherit;text-underline-offset:.2em}a:hover{color:var(--red)}a:focus-visible{outline:3px solid var(--red);outline-offset:4px}
.brand{font-size:1.5rem;letter-spacing:-.06em;font-weight:900;text-decoration:none}
nav,.time{font-size:.9rem}nav{margin:.5rem 0 2.2rem}nav span{padding:0 .35em}
h1,h2{line-height:1.12;overflow-wrap:anywhere}h1{font-size:clamp(2.4rem,6vw,5rem);letter-spacing:-.045em;margin:.25rem 0 1rem}h2{font-size:clamp(1.4rem,3vw,2.1rem);margin:.3rem 0 1rem}
.artist{font-weight:750;color:var(--red);letter-spacing:.07em;margin:.5rem 0}
.song{display:grid;grid-template-columns:minmax(14rem,34%) 1fr;gap:clamp(1.25rem,4vw,4rem);align-items:center;margin-bottom:2.5rem}
.song img{width:100%;height:auto;display:block}
.buttons{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.2rem}
.button{padding:.55em .9em;background:var(--ink);color:white;font-weight:bold;text-decoration:none}.button:hover{background:var(--red);color:white}
section{border-top:1px solid var(--line);padding:1.4rem 0}li{padding:.28rem 0}ul,ol{padding-left:1.4rem}
.intro{font-size:1.1rem;max-width:46rem;margin-bottom:2rem}
.releases{display:grid;gap:0 2.25rem;grid-template-columns:repeat(2,minmax(0,1fr))}.back{padding-top:1rem;font-weight:bold}
@media(max-width:42rem){.song,.releases{grid-template-columns:1fr}.song img{max-width:21rem}.song{margin-bottom:1.5rem}nav{margin-bottom:1.25rem}}