:root { --cream:#f3eadb; --ink:#29241f; --rust:#a34d35; --rose:#c88677; --sage:#747c68; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:Georgia,"Times New Roman",serif; }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; }
.nav { min-height:86px; display:flex; align-items:center; justify-content:space-between; padding:0 5vw; border-bottom:1px solid rgba(41,36,31,.2); position:relative; z-index:5; }
.brand { font-family:Arial,sans-serif; font-size:14px; letter-spacing:.3em; font-weight:700; white-space:nowrap; }
.navlinks { display:flex; gap:28px; font:10px Arial,sans-serif; text-transform:uppercase; letter-spacing:.15em; }
.navlinks a:hover { color:var(--rust); }
.hero { min-height:calc(100vh - 86px); padding:8vh 8vw; display:grid; grid-template-columns:1.05fr .85fr; gap:7vw; align-items:center; position:relative; overflow:hidden; }
.eyebrow { font:10px Arial,sans-serif; letter-spacing:.28em; color:var(--rust); font-weight:700; }
h1 { font-size:clamp(58px,7vw,108px); line-height:.86; letter-spacing:-.055em; font-weight:400; margin:28px 0 35px; }
h1 em { color:var(--rust); font-weight:400; }
.intro { max-width:540px; font-size:17px; line-height:1.75; color:#5f574e; }
.listen { margin-top:25px; display:inline-flex; gap:14px; align-items:center; font:11px Arial,sans-serif; text-transform:uppercase; letter-spacing:.17em; border-bottom:1px solid var(--ink); padding:12px 0; }
.listen span { color:var(--rust); }
.hero-photo { margin:0; position:relative; box-shadow:18px 24px 0 rgba(163,77,53,.14); }
.hero-photo img { aspect-ratio:4/5; object-fit:cover; object-position:58% center; filter:saturate(.72) sepia(.14); }
.hero-photo figcaption { position:absolute; right:-22px; top:18px; writing-mode:vertical-rl; font:9px Arial,sans-serif; letter-spacing:.22em; color:#f7eedf; background:var(--rust); padding:18px 10px; }
.side-note { position:absolute; right:2vw; bottom:10vh; writing-mode:vertical-rl; font:9px Arial,sans-serif; letter-spacing:.25em; }
.section { padding:110px 8vw; }
.playlist { background:#ddd0bd; display:grid; grid-template-columns:.62fr 1.38fr; gap:8vw; }
.section-heading h2,.about h2 { font-size:clamp(42px,5vw,76px); line-height:.95; font-weight:400; letter-spacing:-.04em; margin:20px 0; }
.section-heading>p:last-child { color:#6e6255; font-style:italic; line-height:1.6; }
.tracklist { border-top:1px solid rgba(41,36,31,.35); }
.track { padding:20px 0; border-bottom:1px solid rgba(41,36,31,.25); }
.track-title { display:grid; grid-template-columns:42px 1fr auto; align-items:center; margin-bottom:13px; }
.track-title span,.track-title small { font:10px Arial,sans-serif; color:#776b5e; letter-spacing:.08em; }
.track-title h3 { font-size:22px; font-weight:400; margin:0; }
.track audio { width:100%; height:38px; accent-color:var(--rust); }
.concerts { background:#28312d; color:#eee4d3; }
.light-heading { margin-bottom:70px; }
.light-heading h2 { color:#eee4d3; }
.concert-columns { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid #6f756e; }
.concert-block { min-height:390px; padding:40px 5vw 25px 0; }
.concert-block+ .concert-block { border-left:1px solid #6f756e; padding-left:5vw; }
.concert-label { font:10px Arial,sans-serif; text-transform:uppercase; letter-spacing:.2em; color:#c9bbaa; }
.concert-block h3 { font-size:clamp(28px,3.2vw,48px); font-weight:400; line-height:1.08; margin:40px 0 18px; }
.concert-block>p:last-child { color:#aaa99f; line-height:1.7; }
.date { display:flex; align-items:center; gap:20px; margin-top:34px; color:var(--rose); }
.date strong { font-size:92px; line-height:.8; font-weight:400; }
.date span { font:12px Arial,sans-serif; letter-spacing:.2em; line-height:1.6; }
.gallery { background:#f3eadb; }
.gallery-heading { display:flex; justify-content:space-between; align-items:end; gap:8vw; margin-bottom:70px; }
.gallery-heading>p { max-width:390px; line-height:1.75; color:#6e6255; }
.photo-grid { display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:280px; gap:14px; }
.photo-grid figure { margin:0; overflow:hidden; background:#c8bcae; }
.photo-grid figure.wide { grid-column:span 2; }
.photo-grid img { height:100%; object-fit:cover; filter:saturate(.72) sepia(.08); transition:filter .3s,transform .5s; }
.photo-grid figure:hover img { filter:saturate(1); transform:scale(1.025); }
.video-heading { border-top:1px solid #9f9386; margin-top:70px; padding:40px 0 28px; display:flex; justify-content:space-between; align-items:end; gap:30px; }
.video-heading h3 { font-size:34px; font-weight:400; margin:8px 0 0; }
.video-heading>a { font:10px Arial,sans-serif; text-transform:uppercase; letter-spacing:.13em; color:var(--rust); border-bottom:1px solid var(--rust); padding-bottom:7px; }
.video-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.video-frame { position:relative; aspect-ratio:16/9; background:#211e1b; overflow:hidden; }
.video-frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-grid h4 { font-size:16px; line-height:1.45; font-weight:400; margin:13px 0 0; }
.about { background:#d7c3ae; display:grid; grid-template-columns:.75fr 1fr; gap:9vw; align-items:center; }
.about img { aspect-ratio:1; object-fit:cover; filter:sepia(.16); box-shadow:-18px 20px 0 rgba(41,36,31,.12); }
.about>div>p:not(.eyebrow) { max-width:650px; font-size:17px; line-height:1.8; color:#5b5148; }
.contact { text-align:center; background:#efe4d3; }
.contact h2 { font-size:clamp(48px,7vw,98px); line-height:.9; font-weight:400; letter-spacing:-.05em; margin:24px auto 34px; }
.contact h2 em { color:var(--rust); font-weight:400; }
.contact>p:not(.eyebrow) { max-width:620px; margin:0 auto; font-size:17px; line-height:1.75; color:#655b51; }
.contact-links { margin-top:45px; display:flex; justify-content:center; flex-wrap:wrap; gap:12px; }
.contact-links a { border:1px solid #9e8c79; border-radius:999px; padding:16px 24px; font:10px Arial,sans-serif; text-transform:uppercase; letter-spacing:.14em; transition:.25s; }
.contact-links a:hover { color:#f3eadb; background:var(--rust); border-color:var(--rust); }
footer { background:#a55842; color:#f1e4d2; padding:90px 8vw 38px; }
.script { font-size:clamp(38px,6vw,83px); font-style:italic; text-align:center; margin:0 0 80px; }
footer div { display:flex; justify-content:space-between; border-top:1px solid rgba(255,255,255,.4); padding-top:22px; font:9px Arial,sans-serif; text-transform:uppercase; letter-spacing:.18em; }
@media (max-width:900px) { .navlinks{gap:15px;font-size:9px}.hero{grid-template-columns:1fr;padding-top:70px}.hero-photo{width:78%;margin-left:auto}.side-note{display:none}.playlist{grid-template-columns:1fr}.concert-columns{grid-template-columns:1fr}.concert-block+.concert-block{border-left:0;border-top:1px solid #6f756e;padding-left:0}.photo-grid{grid-template-columns:repeat(2,1fr)}.video-grid{grid-template-columns:1fr 1fr}.about{grid-template-columns:1fr}.about img{width:70%}.section{padding:80px 7vw}h1{font-size:64px} }
@media (max-width:650px) { .nav{padding:24px 6vw;align-items:flex-start}.navlinks{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px}.hero{padding-left:6vw;padding-right:6vw}.hero-photo{width:94%}.gallery-heading{display:block}.photo-grid{grid-template-columns:1fr;grid-auto-rows:360px}.photo-grid figure.wide{grid-column:auto}.video-heading{display:block}.video-heading>a{display:inline-block;margin-top:22px}.video-grid{grid-template-columns:1fr}.about img{width:92%}.date strong{font-size:72px}.track-title{grid-template-columns:32px 1fr auto}.script{text-align:left} }
@media (max-width:420px) { .navlinks{display:none}.photo-grid{grid-auto-rows:300px}.concert-block{min-height:330px}.video-note>span{width:56px}.about img{width:100%} }
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}