
:root{--bg:#f7f1e6;--fg:#2b1a0e;--mut:#6e5a47;--gold:#c98a1e;--brown:#5e3010;--card:#fffaf1;--line:#e4d6bf}
@media (prefers-color-scheme:dark){:root{--bg:#1d140d;--fg:#f3e9da;--mut:#bfa98d;--gold:#e0a43a;--brown:#e9c48a;--card:#2a1d13;--line:#4a3725}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.65 "Source Sans 3",system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--gold)}
header{background:#2b1a0e;color:#f7e7c6}
header .in{max-width:1000px;margin:auto;padding:12px 16px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
header .brand{font:600 26px/1 Oswald,Impact,sans-serif;letter-spacing:.04em;color:#f0b445;text-decoration:none;text-transform:uppercase;display:flex;align-items:center;gap:10px}
header .brand img{height:38px;width:auto}
header .social{display:flex;align-items:center;gap:10px;font-size:14px;padding-left:16px;border-left:1px solid #6b4a2a}
header .social a{display:block;line-height:0;opacity:.9}header .social a:hover{opacity:1}
@media (max-width:720px){header .social{border-left:0;padding-left:0;width:100%}}
header nav{margin-left:auto;display:flex;gap:4px 18px;flex-wrap:wrap;font:500 15px Oswald,sans-serif;text-transform:uppercase;letter-spacing:.06em}
header nav a{color:#f7e7c6;text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
header nav a.on,header nav a:hover{border-color:#f0b445;color:#fff}
main{max-width:1000px;margin:auto;padding:28px 16px 56px}
h1,h2,h3{font-family:Oswald,Impact,sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.03em;color:var(--brown);line-height:1.2}
h1{font-size:34px;margin:.2em 0 .6em}h2{font-size:24px;margin:1.6em 0 .5em}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:32px;align-items:center}
.hero img{width:100%;height:auto}
@media (max-width:720px){.hero{grid-template-columns:1fr}.hero img{max-width:360px;margin:auto;display:block}}
.songs{display:grid;gap:14px;margin-top:10px}
.song{display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px}
.song img{width:72px;height:72px;border-radius:6px;object-fit:cover}
.song b{font-family:Oswald,sans-serif;font-weight:500;letter-spacing:.03em;text-transform:uppercase}
.song audio{width:100%;margin-top:4px;height:36px}
.links{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.links a{border:1px solid var(--gold);border-radius:999px;padding:6px 14px;text-decoration:none;font-size:15px;font-weight:600}
.links a:hover{background:var(--gold);color:#fff}
.band-photo{width:100%;height:auto;border-radius:10px;margin-bottom:10px}
.member{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin:16px 0}
.member h3{margin:0 0 2px;font-size:21px}.member .em{font-size:15px}
.videos{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.video{position:relative;aspect-ratio:16/9;background:#000;border-radius:8px;overflow:hidden}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.cta{display:inline-block;background:var(--gold);color:#fff;text-decoration:none;font:600 18px Oswald,sans-serif;letter-spacing:.05em;text-transform:uppercase;padding:12px 22px;border-radius:8px;margin:8px 0}
footer{border-top:1px solid var(--line);color:var(--mut);font-size:14px}
footer .in{max-width:1000px;margin:auto;padding:18px 16px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
