:root{--bg:#0d0c0b;--panel:#171513;--ink:#ece6dc;--muted:#a89f92;--accent:#e0b25a;--accent2:#6fb7a8;--line:rgba(255,255,255,.12);--serif:"Cormorant Garamond","Playfair Display",Georgia,"Times New Roman",serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--accent)}
a:hover{color:#fff}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;z-index:99;background:#000;padding:.5rem}
/* header */
.site-header{position:sticky;top:0;z-index:20;background:rgba(13,12,11,.88);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.bar{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:1rem;padding:.6rem 1.2rem}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink);font-family:var(--serif);font-size:1.35rem;letter-spacing:.12em;white-space:nowrap}
.brand img{width:38px;height:38px;border-radius:50%;background:#fff}
.nav{margin-left:auto}
.nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.2rem}
.nav a{display:block;padding:.45rem .7rem;color:var(--muted);text-decoration:none;font-size:.92rem;letter-spacing:.04em;border-radius:4px}
.nav a:hover,.nav a[aria-current=page]{color:var(--ink);background:rgba(255,255,255,.06)}
.nav a[aria-current=page]{box-shadow:inset 0 -2px 0 var(--accent)}
.menu-btn{display:none;margin-left:auto;background:none;border:1px solid var(--line);color:var(--ink);padding:.4rem .7rem;border-radius:4px;font-size:1rem}
@media (max-width:860px){.menu-btn{display:block}.nav{display:none;position:absolute;left:0;right:0;top:100%;background:#0d0c0b;border-bottom:1px solid var(--line)}.nav.open{display:block}.nav ul{flex-direction:column;padding:.5rem 1rem 1rem}.nav a{padding:.7rem .5rem;font-size:1.05rem}}
/* layout */
main{display:block}
.wrap{max-width:1100px;margin:0 auto;padding:0 1.2rem}
.narrow{max-width:760px}
.page-head{padding:4.5rem 0 2rem;text-align:center}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.15;margin:0 0 .6rem}
h1{font-size:clamp(2.4rem,6vw,4.2rem);letter-spacing:.18em;text-transform:uppercase}
h2{font-size:clamp(1.6rem,3.5vw,2.3rem);letter-spacing:.06em}
h3{font-size:1.35rem}
.lead{color:var(--muted);font-size:1.12rem;max-width:640px;margin:0 auto}
section{padding:2.5rem 0}
.btn{display:inline-block;padding:.8rem 2.1rem;border:1px solid var(--accent);color:var(--ink);text-decoration:none;letter-spacing:.25em;text-transform:uppercase;font-size:.9rem;border-radius:2px;transition:.2s}
.btn:hover{background:var(--accent);color:#111}
.socials{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap;padding:0;margin:0;list-style:none}
.socials img{width:40px;height:40px;transition:transform .2s}
.socials a:hover img{transform:scale(1.1)}
/* hero */
.hero{min-height:calc(100vh - 60px);display:grid;place-items:center;text-align:center;padding:4rem 1.2rem;background:radial-gradient(ellipse at 50% 30%,rgba(111,183,168,.28),transparent 60%),linear-gradient(180deg,#1b2a26 0%,#14110f 55%,#0d0c0b 100%)}
.hero h1{font-size:clamp(2.6rem,9vw,6rem);letter-spacing:.3em;margin-right:-.3em;border-bottom:3px solid var(--ink);display:inline-block;padding-bottom:.2rem}
.tagline{font-family:var(--serif);font-style:italic;color:#f3e7a9;font-size:clamp(1.25rem,2.6vw,1.7rem);margin:1.6rem 0 .3rem}
.sub{font-family:var(--serif);font-style:italic;color:#f3e7a9;opacity:.9;font-size:clamp(1.05rem,2.2vw,1.4rem);margin:0 0 2.4rem}
.hero .socials{margin-top:2.6rem}
/* about */
.about-bg{background:linear-gradient(rgba(13,12,11,.82),rgba(13,12,11,.92)),url(../img/about-bg.jpg) center top/100% auto repeat-y;background-color:#0d0c0b}
.role{font-family:var(--serif);font-size:1.4rem;color:var(--accent);letter-spacing:.06em}
.chapter{border-left:2px solid var(--accent);padding:0 0 0 1.4rem;margin:2.4rem 0}
.chapter .kicker{text-transform:uppercase;letter-spacing:.2em;font-size:.8rem;color:var(--muted);margin:0}
.chapter p{margin:.4rem 0 0}
/* albums */
.albums-page{background:#0d0c0b}
.albums-page::before{content:"";position:fixed;inset:0;height:100vh;height:100lvh;z-index:-1;pointer-events:none;
 background:radial-gradient(ellipse at center,rgba(10,9,8,0) 55%,rgba(10,9,8,.55) 100%),linear-gradient(rgba(10,9,8,.65),rgba(10,9,8,.65)),url(../img/albums-bg.jpg) center/cover no-repeat}

.strip{display:block;width:100%;margin:.5rem 0 3rem;line-height:0;border-top:1px solid rgba(224,178,90,.45);border-bottom:1px solid rgba(224,178,90,.45);box-shadow:0 10px 30px rgba(0,0,0,.45)}
.strip img{display:block;width:100%;height:auto;aspect-ratio:1588/222}
.albums-page .page-head{padding-bottom:2.2rem}
@media (max-width:700px){.strip{margin:.25rem 0 2rem}}
.albums-page .page-head{text-shadow:0 2px 18px rgba(0,0,0,.6)}
.section-title{text-align:center;margin-bottom:1.8rem}
.section-title p{color:var(--muted);margin:0}
.album-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.6rem}
.album{background:rgba(23,21,19,.88);border:1px solid var(--line);border-radius:6px;overflow:hidden;display:flex;flex-direction:column}
.album>img{width:100%;height:auto;min-height:0;flex:0 0 auto;aspect-ratio:1/1;object-fit:cover}
.album .body{padding:1.1rem 1.2rem 1.3rem}
.album .meta{color:var(--muted);font-size:.9rem;margin:-.3rem 0 .8rem}
.tracks{margin:0;padding:0 0 0 1.6rem;font-size:.93rem}
.tracks li{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px dashed var(--line);padding:.25rem 0}
.tracks li{display:list-item}
.tracks .d{float:right;color:var(--muted);font-variant-numeric:tabular-nums;margin-left:1rem}
.tracks .ft{color:var(--muted);font-size:.85em}
.soon{display:block;text-decoration:none;margin-top:1rem;padding:.6rem .8rem;border:1px dashed var(--accent);color:var(--accent);border-radius:4px;font-size:.88rem;text-align:center}
.players{display:grid;gap:1.2rem}
.players.two{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.player iframe{width:100%;border:0;border-radius:12px;display:block;background:rgba(0,0,0,.35)}
.player.sc iframe{border-radius:4px}
.ep{display:grid;grid-template-columns:260px 1fr;gap:1.6rem;align-items:start;background:rgba(23,21,19,.88);border:1px solid var(--line);border-radius:6px;padding:1.4rem}
.ep img{border-radius:4px;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;align-self:start}
@media (max-width:700px){.ep{grid-template-columns:1fr}.ep img{max-width:260px;margin:0 auto}}
/* projects */
.projects-bg{background:linear-gradient(rgba(13,12,11,.86),rgba(13,12,11,.9)),url(../img/projects-bg.jpg) center/cover}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1.6rem}
.card{display:block;text-decoration:none;color:var(--ink);background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:6px;padding:1.4rem;text-align:center;transition:.2s}
.card:hover{border-color:var(--accent);transform:translateY(-3px);color:var(--ink)}
.card img{width:100%;height:auto;min-height:0;flex:0 0 auto;aspect-ratio:1/1;object-fit:cover;border-radius:50%;margin-bottom:1rem}
.card span{font-family:var(--serif);font-size:1.5rem}
/* forms */
.form{display:grid;gap:.9rem;grid-template-columns:1fr 1fr;margin-top:1.4rem}
.form .full{grid-column:1/-1}
.form label{display:grid;gap:.3rem;font-size:.85rem;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.form input,.form textarea{background:#0f0e0d;border:1px solid var(--line);color:var(--ink);padding:.7rem;border-radius:3px;font:inherit}
.form button{justify-self:start;background:var(--accent);color:#111;border:0;padding:.8rem 2rem;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;border-radius:2px}
.note{font-size:.85rem;color:var(--muted);border:1px dashed var(--line);padding:.6rem .8rem;border-radius:4px}
@media (max-width:600px){.form{grid-template-columns:1fr}}
/* videos */
.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.6rem}
.vph{position:relative;aspect-ratio:16/9;background:#000 center/cover;border-radius:6px;overflow:hidden;border:1px solid var(--line)}
.vph::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.45)}
.vph .lbl{position:absolute;inset:auto 0 0 0;z-index:1;padding:.7rem 1rem;font-size:.9rem;background:linear-gradient(transparent,rgba(0,0,0,.85))}
.vph .play{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-60%);width:64px;height:64px;border-radius:50%;border:2px solid #fff;display:grid;place-items:center;opacity:.85}
.vph .play::before{content:"";border-left:18px solid #fff;border-top:11px solid transparent;border-bottom:11px solid transparent;margin-left:5px}
/* photos */
.photo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1.4rem;text-align:center}
.photo-grid img{width:100%;aspect-ratio:6/7;object-fit:cover;border-radius:4px}
.photo-grid h3{font-family:var(--sans);font-weight:400;font-size:1.1rem;margin:.8rem 0 0}
.photo-grid p{margin:0;font-family:ui-monospace,Menlo,monospace;color:var(--muted);font-size:.9rem}
/* references */
blockquote{margin:0;padding:2rem;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:6px}
blockquote footer{margin-top:1rem;font-family:var(--serif);font-size:1.3rem;color:var(--accent)}
/* contact */
.contact-hero{height:clamp(120px,22vw,280px);background:url(../img/contact-stars.jpg) center/cover}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.4rem;align-items:start}
@media (max-width:800px){.contact-grid{grid-template-columns:1fr}}
.contact-list{list-style:none;padding:0;margin:1rem 0}
.contact-list li{margin:.8rem 0}
.contact-list strong{display:block;text-transform:uppercase;letter-spacing:.15em;font-size:.8rem;color:var(--muted)}
.contact-list a{font-size:1.15rem}
.contact-grid .socials{justify-content:flex-start}
/* footer */
.site-footer{border-top:1px solid var(--line);padding:2.5rem 1.2rem;text-align:center;color:var(--muted);font-size:.9rem;background:#0a0908}
.site-footer .fbrand{font-family:var(--serif);color:var(--ink);font-size:1.5rem;letter-spacing:.35em;margin-bottom:1rem}
.site-footer nav ul{list-style:none;padding:0;margin:0 0 1.2rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.2rem}
.site-footer nav a{color:var(--muted);text-decoration:none}
.site-footer nav a:hover{color:var(--ink)}
.site-footer .socials{margin-bottom:1.2rem}.site-footer .socials img{width:30px;height:30px}
.albums-page section.wrap+section.wrap{margin-top:3.2rem}.albums-page .section-title{margin-bottom:1.2rem}
.page-head{padding-left:1.25rem;padding-right:1.25rem}
a.soon:hover{background:var(--accent);color:#111}
.bc-cta{text-align:center;margin:-1.2rem 0 2.6rem}
.donate{display:flex;align-items:center;justify-content:center;gap:.7rem;margin:1.2rem 0}
.btn-donate{display:inline-block;padding:.55rem 1.6rem;background:#ffc439;color:#111;font-weight:600;border-radius:999px;text-decoration:none}
.btn-donate:hover{background:#f2b52c}.donate span{color:var(--muted);font-size:.85rem}
.ep-wrap .lead,.section-title .lead{margin-top:.6rem;font-size:1rem}
.section-title .lead{margin:.6rem auto 0;max-width:640px}
.bb-spotify{max-width:760px;margin:0 auto 1.8rem}.bb-link{text-align:center;margin:.6rem 0 0;font-size:.95rem}.bb-link a{color:var(--accent)}
/* credits */
.credits-line{font-size:.82rem;line-height:1.5;opacity:.8;margin:.5rem .2rem 0}
.section-title .lead a{display:inline-block;margin-top:.5rem}
.project-entry{padding:3rem 1.2rem 1rem;scroll-margin-top:90px}
.project-entry h2{text-align:center;margin-bottom:1.6rem}
.project-entry .sub2{display:block;font-size:.6em;font-weight:400;opacity:.8;margin-top:.3rem}
.pe-grid{display:grid;grid-template-columns:minmax(0,320px) 1fr;gap:2rem;align-items:start;max-width:960px;margin:0 auto}
.pe-grid img{width:100%;height:auto;border-radius:6px}
.pe-links a{white-space:nowrap}
.credits{max-width:960px;margin:2rem auto 0;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:1.4rem 1.6rem}
.credits h3{margin:0 0 .8rem}
.credits ul{list-style:none;margin:0;padding:0}
.credits li{display:grid;grid-template-columns:minmax(0,15rem) 1fr auto;gap:.4rem 1rem;padding:.55rem 0;border-top:1px solid rgba(255,255,255,.08)}
.credits li:first-child{border-top:0}
.credits .who{font-weight:600}
.credits .src{font-size:.75rem;opacity:.6;white-space:nowrap}
@media (max-width:700px){.pe-grid{grid-template-columns:1fr}.pe-grid img{max-width:320px;margin:0 auto}.credits li{grid-template-columns:1fr}.credits{padding:1.1rem}}
/* Baby Blue teaser + subpage */
.pe-kicker{text-align:center;opacity:.8;margin:-1rem 0 1.8rem;letter-spacing:.04em}
.teaser{display:grid;grid-template-columns:200px 1fr;gap:1.6rem;align-items:center;max-width:860px;margin:2.5rem auto 3rem;padding:1.2rem;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.12);border-radius:8px;color:inherit;text-decoration:none;transition:border-color .2s,transform .2s}
.teaser:hover,.teaser:focus-visible{border-color:var(--accent,#e0b25a);transform:translateY(-2px)}
.teaser img{width:100%;height:auto;border-radius:6px}
.teaser h2{margin:0 0 .4rem}
.teaser p{margin:0 0 .7rem}
.teaser .more{color:var(--accent,#e0b25a);text-decoration:underline}
#babyblue{scroll-margin-top:90px}
@media (max-width:600px){.teaser{grid-template-columns:1fr;text-align:center}.teaser img{max-width:240px;margin:0 auto}}
/* project teasers (side by side) */
.teasers{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.4rem;max-width:1100px;margin:2.5rem auto 3rem}
.teasers .teaser{margin:0;grid-template-columns:140px 1fr;align-items:start}
.teaser{scroll-margin-top:90px}
.pe-fig{margin:0}
.pe-fig figcaption{font-size:.78rem;opacity:.7;margin-top:.4rem}
.pe-quote{max-width:760px;margin:2rem auto 0;text-align:center;font-family:var(--serif);font-size:1.35rem;padding:1.4rem 1.6rem}
.pe-quote.small{font-size:1.1rem;text-align:left;margin:1.2rem 0 0}
.pe-quote footer{font-family:var(--sans);font-size:.85rem;opacity:.75;margin-top:.5rem}
.ig-embed{max-width:540px;margin:0 auto}
@media (max-width:600px){.teasers{grid-template-columns:1fr}.teasers .teaser{grid-template-columns:1fr}}
/* Sound Stories */
.ss-empty{text-align:center;padding:2.5rem 1rem;border:1px dashed var(--line);border-radius:8px;color:var(--muted)}
.ss-list{display:grid;gap:1.4rem}
.ss-card{display:grid;grid-template-columns:220px 1fr;gap:1.4rem;padding:1.1rem;background:rgba(0,0,0,.35);border:1px solid var(--line);border-radius:8px;color:inherit;text-decoration:none}
.ss-card:hover{border-color:var(--accent)}
.ss-card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px}
.ss-card h2{margin:.2rem 0 .5rem}.ss-card p{margin:0 0 .6rem}.ss-card .more{color:var(--accent);text-decoration:underline}
.ss-date{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0}
.ss-rss{text-align:center;font-size:.85rem;margin-top:2rem}
.ss-post h1{font-size:clamp(2rem,5vw,3rem);margin:.4rem 0 1.4rem;letter-spacing:.02em;text-align:left}
.ss-cover{margin:0 0 1.6rem}.ss-cover img,.ss-body img{width:100%;height:auto;border-radius:6px}
.ss-body figure{margin:1.6rem 0}.ss-body blockquote{margin:1.4rem 0}
.ss-source{margin-top:2rem;font-size:.9rem;color:var(--muted)}
@media (max-width:600px){.ss-card{grid-template-columns:1fr}}