:root {
--bg: #0b0f10;
--bg-surface: #11181a;
--bg-card: #151d20;
--text: #f2f5f5;
--text-muted: #adc0c0;
--accent-aqua: #3dd6d0;
--accent-teal: #3aa7a1;
--accent-green: #74d0a8;
--border: rgba(190,215,215,0.18);
--max-width: 880px;
--font-body: Inter, system-ui, sans-serif;
--font-head: "Crimson Text", Georgia, serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
font-family:var(--font-body);
font-size:16px;
line-height:1.65;
color:var(--text);
background:var(--bg);
}

/* Global link colors — turquoise throughout */
a { color: var(--accent-aqua); }
a:visited { color: var(--accent-aqua); }
a:hover { color: #5cece6; }

/* Navigation has its own muted→aerobic treatment */
.nav-menu a,
.nav-menu a:visited,
.nav-menu a:hover { color: var(--text-muted); }
.nav-menu a:hover,
.nav-menu a[aria-current="page"] { color: var(--accent-aqua); }

/* Footer links */
.footer-links a { color: var(--text-muted); }
.footer-links a:visited { color: var(--text-muted); }
.footer-links a:hover { color: var(--accent-aqua); }

/* Blog card titles */
.blog-card h3 a,
.blog-card h3 a:visited { color: var(--text); }
.blog-card h3 a:hover { color: var(--accent-aqua); }

/* Section link style */
.section-link a { color: var(--accent-aqua); }

/* Work card links */
.work-card-link { color: inherit; }

.skip-link{
position:absolute;left:-9999px;top:auto;
}
.skip-link:focus{
left:1rem;top:1rem;z-index:1000;
background:var(--bg-card);color:var(--text);
padding:.5rem 1rem;border-radius:4px;
}

.container{
max-width:var(--max-width);
margin:0 auto;
padding:0 1.5rem;
}

/* Header */
.site-header{
padding:1.2rem 0;
border-bottom:1px solid var(--border);
background:var(--bg-surface);
}

.header-row{
display:flex;align-items:center;justify-content:space-between;
gap:1rem;flex-wrap:wrap;
}

.brand{
font-family:var(--font-head);
font-size:1.25rem;
font-weight:600;
color:var(--text);
text-decoration:none;
}

.nav-menu{
list-style:none;display:flex;gap:1.5rem;flex-wrap:wrap;
}

.nav-menu a{
color:var(--text-muted);
text-decoration:none;
font-size:.91rem;
font-weight:500;
transition:color .2s;
}

.nav-menu a:hover,
.nav-menu a[aria-current="page"]{
color:var(--accent-aqua);
}

/* Hero */
.hero{
padding:7rem 0 6rem;
text-align:center;
background:linear-gradient(135deg,rgba(11,15,16,.92) 0%,rgba(11,15,16,.75) 50%,rgba(11,15,16,.9) 100%),url(/img/studio-2.png);
background-size:cover;
background-position:center;
border-bottom:1px solid var(--border);
}

.hero-content{max-width:680px;margin:0 auto}

.hero h1{
font-family:var(--font-head);
font-size:clamp(2rem,6vw,3.2rem);
line-height:1.1;
margin-bottom:1.2rem;
}

.hero-lead{
font-size:1.1rem;
color:var(--text-muted);
margin-bottom:.6rem;
}

.hero-location{
font-size:.85rem;
color:var(--accent-teal);
letter-spacing:.05em;
text-transform:uppercase;
margin-bottom:1.8rem;
}

/* Buttons */
.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

.btn{
display:inline-block;
padding:.7rem 1.4rem;
border-radius:4px;
font-size:.95rem;
font-weight:500;
text-decoration:none;
transition:all .15s;
cursor:pointer;
border:none;
}

.btn-primary{
background:#050909;
color:var(--accent-aqua);
border:1px solid var(--accent-aqua);
box-shadow:0 0 0 1px rgba(61,214,208,.08), 0 8px 24px rgba(0,0,0,.22);
}

.btn-primary:visited{
color:var(--accent-aqua);
}

.btn-primary:hover{
background:rgba(61,214,208,.12);
color:var(--text);
transform:translateY(-1px);
}

.btn-secondary{
background:rgba(0,0,0,.28);
color:var(--text);
border:1px solid var(--border);
}

.btn-secondary:visited{
color:var(--text);
}

.btn-secondary:hover{
background:rgba(61,214,208,.08);
border-color:var(--accent-aqua);
color:var(--accent-aqua);
}

/* Sections */
.section{padding:4rem 0}
.section-blog-preview{background:var(--bg-surface);border-top:1px solid var(--border);padding-bottom:2.5rem}

/* Blog grid on homepage */
.blog-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:1.5rem;
}

@media (max-width:900px){
.blog-grid{grid-template-columns:1fr}
}

.blog-card{
background:var(--bg-card);
padding:1.5rem;
border-radius:6px;
border:1px solid var(--border);
transition:border-color .2s;
position:relative;
}

.blog-card:hover{border-color:var(--accent-teal)}

.blog-date{
font-size:.75rem;
color:var(--text-muted);
letter-spacing:.02em;
margin-bottom:.5rem;
}

.blog-card h3{
font-family:var(--font-head);
font-size:1.2rem;
line-height:1.25;
margin-bottom:.6rem;
}

/* Stretched link — keeps the whole card clickable without duplicating title text */
.blog-card h3 a{
color:var(--text);
text-decoration:none;
position:static;
}

.blog-card h3 a::after{
content:'';
position:absolute;
inset:0;
z-index:3;
border-radius:6px;
}

/* Keep card content visible; the link pseudo-element sits above it for clicks */
.blog-card img,
.blog-card .blog-date,
.blog-card .blog-excerpt{
position:relative;
z-index:2;
}

.blog-card h3 a:focus-visible{
outline:2px solid var(--accent-aqua);
outline-offset:2px;
}

.blog-card h3 a:hover{
color:var(--accent-aqua);
}

.blog-excerpt{
font-size:.95rem;
color:var(--text-muted);
line-height:1.6;
}

/* Blog listing and individual post pages */
.post-content p{
margin-bottom:1.2rem;
}
.post-content a { color: var(--accent-aqua); text-decoration: underline; }
.post-content a:visited { color: var(--accent-aqua); }

/* Credits page */
.credit-list{
list-style:none;
padding:0;
margin:0 0 3rem 0;
display:grid;
gap:1.2rem;
}

.credit-entry{
padding:1.2rem 1.5rem;
background:var(--bg-card);
border-radius:6px;
border:1px solid var(--border);
transition:border-color .2s;
position:relative;
}

.credit-entry:hover{
border-color:var(--accent-teal);
}

/* Stretched link — entire card is clickable */
.credit-entry a{
color:inherit;
text-decoration:none;
position:absolute;
inset:0;
border-radius:6px;
z-index:1;
}

.credit-entry a:focus-visible{
outline:2px solid var(--accent-aqua);
outline-offset:-2px;
}

.credit-main{
display:flex;
align-items:center;
gap:.8rem;
flex-wrap:wrap;
margin-bottom:.5rem;
}

.credit-main strong{
font-family:var(--font-head);
font-size:1.15rem;
color:inherit;
}

.credit-role{
font-size:.8rem;
color:var(--accent-aqua);
border:1px solid rgba(61,214,208,.3);
padding:.2rem .6rem;
border-radius:999px;
}

.credit-award{
font-size:.75rem;
background:var(--bg-surface);
color:var(--text-muted);
padding:.25rem .5rem;
border-radius:4px;
}

.credit-details{
display:flex;
align-items:center;
gap:1rem;
flex-wrap:wrap;
color:var(--text-muted);
font-size:.88rem;
}

.credit-type{
color:var(--accent-teal);
}

.credit-year{
margin-left:auto;
font-size:.8rem;
opacity:.7;
}

.credit-note{
font-style:italic;
}

.credit-more{
text-align:center;
margin-top:2rem;
}

.credit-more a{
color:var(--accent-aqua);
}

/* Simplified credit list */
.credit-list{
list-style:none;
padding:0;
margin:0 0 3rem 0;
display:grid;
gap:1rem;
}

.credit-entry{
background:var(--bg-card);
padding:1.25rem 1.5rem;
border-radius:6px;
border:1px solid var(--border);
display:flex;
align-items:center;
gap:1rem 1.25rem;
flex-wrap:wrap;
line-height:1.5;
position:relative;
}

.credit-entry strong{
font-family:var(--font-head);
font-size:1.2rem;
line-height:1.2;
min-width:180px;
color:var(--text);
}

.credit-entry a{
color:inherit;
text-decoration:none;
position:static;
z-index:2;
}

.credit-entry a::after{
content:'';
position:absolute;
inset:0;
border-radius:6px;
z-index:1;
}

.credit-entry span,
.credit-entry em{
position:relative;
z-index:2;
}

.credit-entry span{
color:var(--text-muted);
font-size:.95rem;
}

.credit-entry .award{
background:rgba(90,184,144,.18);
color:var(--accent-green);
padding:.24rem .65rem;
border-radius:4px;
font-size:.82rem;
white-space:nowrap;
}

.credit-entry em{
margin-left:auto;
font-style:normal;
color:#9fb2b2;
font-size:.88rem;
}

.section h2{
font-family:var(--font-head);
font-size:1.6rem;
margin-bottom:2rem;
text-align:center;
}

.section-link{
text-align:center;
margin-top:2rem;
}

.section-link a{
color:var(--accent-aqua);
text-decoration:none;
}

.section-link a:hover{text-decoration:underline}

/* Work grid */
.work-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:1.5rem;
}

.work-card{
background:var(--bg-card);
padding:1.5rem;
border-radius:6px;
border:1px solid var(--border);
transition:border-color .2s;
position:relative;
}

.work-card-link{
position:absolute;
inset:0;
z-index:3;
border-radius:6px;
text-decoration:none;
color:inherit;
}

.work-card-link:visited{color:inherit}

.work-card-link:focus-visible{
outline:2px solid var(--accent-aqua);
outline-offset:-2px;
}

.work-card:hover{border-color:var(--accent-teal)}
.work-card:hover .work-cta{text-decoration:underline}

.work-number{
font-size:.75rem;
color:var(--accent-teal);
letter-spacing:.05em;
margin-bottom:.5rem;
}

.work-card h3{
font-family:var(--font-head);
font-size:1.15rem;
margin-bottom:.2rem;
}

.work-role{
font-size:.85rem;
color:var(--accent-aqua);
margin-bottom:.2rem;
}

.work-meta{
font-size:.8rem;
color:var(--text-muted);
}



/* Premium work page */
.work-grid-featured{
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
}

.work-card-large{
  min-height:260px;
  display:flex;
  flex-direction:column;
  gap:.35rem;
}

.work-card-large h3{
  font-size:1.35rem;
}

.work-card p:not(.work-number):not(.work-role):not(.work-meta):not(.work-cta){
  color:var(--text-muted);
}

.work-cta{
  margin-top:auto;
  padding-top:1rem;
  font-size:.9rem;
}

.work-cta,
.work-cta a{
  color:var(--accent-aqua);
  text-decoration:none;
}

.work-card:hover .work-cta,
.work-cta a:hover{
  text-decoration:underline;
}

.section-alt{
  background:var(--bg-surface);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}

.split-callout{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:2rem;
  align-items:center;
}

.split-callout h2{
  text-align:left;
  margin-bottom:.75rem;
}

.split-callout p{
  color:var(--text-muted);
}

.callout-actions{
  display:flex;
  gap:1rem;
  flex-wrap:wrap;
  justify-content:flex-end;
}

@media (max-width:720px){
  .split-callout{grid-template-columns:1fr;}
  .callout-actions{justify-content:flex-start;}
}

/* CTA box */
.section-cta{background:var(--bg-surface);padding:2.5rem 0}

.cta-box{
max-width:480px;
margin:0 auto;
text-align:center;
background:var(--bg-card);
padding:2.5rem;
border-radius:8px;
border:1px solid var(--border);
}

.cta-box h2{
font-family:var(--font-head);
font-size:1.5rem;
margin-bottom:.5rem;
}

.cta-box p{
color:var(--text-muted);
margin-bottom:1.5rem;
}

/* Page header */
.page-header{
padding:4rem 0 2rem;
text-align:center;
}

.page-header h1{
font-family:var(--font-head);
font-size:clamp(1.8rem,5vw,2.6rem);
margin-bottom:.8rem;
}

.lead{
color:var(--text-muted);
font-size:1.05rem;
max-width:560px;
margin:0 auto;
}

/* Reel embed */
.reel-embed{margin-bottom:2rem}
.reel-embed iframe{
width:100%;border-radius:6px;border:none;
}

.video-reel{
margin-bottom:2.4rem;
}

.placeholder-player{
color:var(--text-muted);
text-align:center;
padding:3rem 2rem;
border:1px solid var(--border);
border-radius:8px;
background:linear-gradient(180deg,rgba(61,214,208,.06),rgba(0,0,0,.10));
box-shadow:inset 0 0 0 1px rgba(61,214,208,.03);
}

.placeholder-player strong{
display:block;
font-family:var(--font-head);
font-size:1.35rem;
line-height:1.2;
color:var(--text);
margin-bottom:.45rem;
}

.placeholder-player span{
display:block;
max-width:520px;
margin:0 auto;
font-size:.95rem;
line-height:1.55;
}


.video-reel video{
width:100%;
display:block;
border:1px solid var(--border);
border-radius:10px;
background:#000;
box-shadow:0 24px 60px rgba(0,0,0,.28);
}

.reel-caption{
margin-top:.7rem;
color:var(--text-muted);
font-size:.86rem;
text-align:center;
}

/* Commercial video gallery */
.commercial-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:1.75rem;
}

.commercial-card{
background:var(--bg-card);
border:1px solid var(--border);
border-radius:12px;
padding:1rem;
box-shadow:0 18px 48px rgba(0,0,0,.16);
}

.commercial-card.video-reel{
margin-bottom:0;
}

.commercial-card video{
border-radius:8px;
box-shadow:none;
}

.commercial-copy{
padding:.95rem .25rem .15rem;
}

.commercial-copy h2{
font-family:var(--font-head);
font-size:1.35rem;
line-height:1.1;
margin-bottom:.3rem;
}

.commercial-copy p{
color:var(--text-muted);
font-size:.9rem;
}

@media (max-width:820px){
.commercial-grid{grid-template-columns:1fr;}
}

/* Track list */
.track-list ul{list-style:none}
.track-list li{
padding:1rem 0;
border-bottom:1px solid var(--border);
}
.track-list li:first-child{padding-top:0}
.track-list li:last-child{border-bottom:none}

.track-list h3{
font-family:var(--font-head);
font-size:1.1rem;
margin-bottom:.2rem;
}

.track-list p{
color:var(--text-muted);
font-size:.9rem;
}


/* Playlist blocks */
.section-alt{
background:var(--bg-surface);
border-top:1px solid var(--border);
border-bottom:1px solid var(--border);
}

.playlist-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:1.4rem;
}

.playlist-block{
background:var(--bg-card);
border:1px solid var(--border);
border-radius:10px;
padding:1.4rem;
box-shadow:0 18px 48px rgba(0,0,0,.16);
}

.playlist-block-compact{
height:100%;
display:flex;
flex-direction:column;
}

.playlist-block-compact .playlist-track-list{
max-height:36rem;
overflow-y:auto;
overflow-x:hidden;
padding-right:.35rem;
scrollbar-width:thin;
scrollbar-color:rgba(61,214,208,.55) rgba(242,245,245,.08);
}

.playlist-block-compact .playlist-track-list::-webkit-scrollbar{
width:8px;
}

.playlist-block-compact .playlist-track-list::-webkit-scrollbar-track{
background:rgba(242,245,245,.08);
border-radius:999px;
}

.playlist-block-compact .playlist-track-list::-webkit-scrollbar-thumb{
background:rgba(61,214,208,.55);
border-radius:999px;
}

.playlist-head{
margin-bottom:1.25rem;
}

.playlist-head h2{
font-family:var(--font-head);
font-size:clamp(1.55rem,4vw,2.1rem);
line-height:1.05;
margin-bottom:.45rem;
}

.playlist-head p{
color:var(--text-muted);
font-size:.95rem;
}

.playlist-player{
padding:1.35rem 0 1.1rem;
margin-bottom:.45rem;
border-top:1px solid var(--border);
border-bottom:1px solid var(--border);
}

.playlist-player audio{
display:none;
}

.playlist-now{
display:grid;
grid-template-columns:5.35rem 1fr;
gap:1.25rem;
align-items:center;
margin-bottom:1.45rem;
}

.playlist-play-main{
width:5.1rem;
height:5.1rem;
border:1px solid rgba(242,245,245,.92);
border-radius:50%;
background:transparent;
color:var(--text);
display:grid;
place-items:center;
cursor:pointer;
transition:border-color .2s ease, color .2s ease, background .2s ease, transform .2s ease;
}

.playlist-play-main span{
font-size:2rem;
line-height:1;
margin-left:.18rem;
}

.playlist-block.is-playing .playlist-play-main span{
font-size:1.35rem;
margin-left:0;
letter-spacing:.08em;
}

.playlist-play-main:hover{
border-color:var(--accent-aqua);
color:var(--accent-aqua);
background:rgba(61,214,208,.06);
transform:scale(1.02);
}

.playlist-now-artist{
font-size:.86rem;
color:var(--text-muted);
letter-spacing:.04em;
text-transform:uppercase;
margin-bottom:.12rem;
}

.playlist-now-title{
font-family:var(--font-body);
font-size:clamp(1.25rem,3vw,1.85rem);
font-weight:500;
line-height:1.18;
margin:0 0 .18rem;
}

.playlist-now-project{
color:var(--text-muted);
font-size:.98rem;
}

.playlist-controls{
display:grid;
grid-template-columns:auto auto minmax(8rem,1fr) auto auto;
gap:.75rem;
align-items:center;
}

.playlist-icon-button{
width:2.35rem;
height:2.35rem;
border:none;
background:transparent;
color:var(--text);
font-size:1.15rem;
cursor:pointer;
display:grid;
place-items:center;
opacity:.92;
transition:color .2s ease, opacity .2s ease, transform .2s ease;
}

.playlist-icon-button:hover{
color:var(--accent-aqua);
opacity:1;
transform:translateY(-1px);
}

.playlist-time{
font-variant-numeric:tabular-nums;
font-size:.88rem;
color:var(--text);
white-space:nowrap;
}

.playlist-progress{
--range-progress:0%;
width:100%;
height:1.5rem;
-webkit-appearance:none;
appearance:none;
background:transparent;
accent-color:var(--text);
cursor:pointer;
}

.playlist-progress::-webkit-slider-runnable-track{
height:2px;
background:linear-gradient(90deg,var(--text) 0%,var(--text) var(--range-progress),rgba(242,245,245,.28) var(--range-progress),rgba(242,245,245,.28) 100%);
border:0;
border-radius:999px;
}

.playlist-progress::-webkit-slider-thumb{
-webkit-appearance:none;
appearance:none;
width:14px;
height:14px;
border-radius:50%;
background:var(--text);
border:0;
margin-top:-6px;
box-shadow:0 0 0 3px rgba(0,0,0,.35);
}

.playlist-progress::-moz-range-track{
height:2px;
background:rgba(242,245,245,.28);
border:0;
border-radius:999px;
}

.playlist-progress::-moz-range-progress{
height:2px;
background:var(--text);
border-radius:999px;
}

.playlist-progress::-moz-range-thumb{
width:14px;
height:14px;
border-radius:50%;
background:var(--text);
border:0;
box-shadow:0 0 0 3px rgba(0,0,0,.35);
}

.playlist-track-list{
display:grid;
}

.playlist-track{
display:grid;
grid-template-columns:2.4rem 1fr;
gap:.85rem;
padding:1rem .1rem;
border-top:1px solid var(--border);
cursor:pointer;
transition:background .16s ease, border-color .16s ease, transform .16s ease;
}

.playlist-track:first-child{
border-top:none;
}

.playlist-track:hover,
.playlist-track.active{
background:rgba(61,214,208,.045);
border-color:rgba(61,214,208,.26);
}

.playlist-track:focus-visible{
outline:2px solid var(--accent-aqua);
outline-offset:2px;
border-radius:6px;
}

.playlist-track-number{
font-size:.78rem;
letter-spacing:.08em;
color:var(--accent-teal);
padding-top:.28rem;
}

.playlist-track h3{
font-family:var(--font-head);
font-size:1.18rem;
line-height:1.15;
margin:.1rem 0 .25rem;
display:flex;
align-items:center;
gap:.65rem;
}

.playlist-track-play-icon{
width:1.15rem;
height:1.15rem;
border:1px solid rgba(242,245,245,.72);
border-radius:50%;
color:var(--text);
display:inline-grid;
place-items:center;
flex:0 0 auto;
font-family:var(--font-body);
font-size:.58rem;
line-height:1;
padding-left:.07rem;
background:transparent;
box-shadow:none;
transition:border-color .16s ease, color .16s ease, transform .16s ease;
}

.playlist-track:hover .playlist-track-play-icon,
.playlist-track.active .playlist-track-play-icon{
border-color:rgba(242,245,245,.95);
color:var(--text);
transform:scale(1.04);
}

.playlist-track.is-row-playing .playlist-track-play-icon{
font-size:.48rem;
letter-spacing:-.08em;
padding-left:0;
}

.playlist-track-meta{
color:var(--text-muted);
font-size:.86rem;
margin-bottom:.55rem;
}

.playlist-track-instruments{
color:#c8d6d6;
font-size:.78rem;
line-height:1.35;
margin:-.25rem 0 .55rem;
}

.playlist-track-instruments b{
color:var(--text-muted);
font-weight:600;
text-transform:uppercase;
letter-spacing:.06em;
font-size:.68rem;
margin-right:.35rem;
}

.playlist-track-tags{
display:flex;
gap:.35rem;
flex-wrap:wrap;
}

.playlist-track-tags span{
font-size:.7rem;
line-height:1;
color:var(--accent-aqua);
border:1px solid rgba(61,214,208,.24);
border-radius:999px;
padding:.32rem .48rem;
background:rgba(61,214,208,.05);
}

.playlist-source-note{
margin-top:1rem;
padding-top:1rem;
border-top:1px solid var(--border);
color:var(--text-muted);
font-size:.78rem;
}

@media (max-width:800px){
.playlist-grid{grid-template-columns:1fr}
.playlist-now{grid-template-columns:4.25rem 1fr;gap:1rem}
.playlist-play-main{width:4rem;height:4rem}
.playlist-play-main span{font-size:1.65rem}
.playlist-controls{grid-template-columns:auto auto auto;gap:.55rem}
.playlist-progress{grid-column:1/-1;grid-row:2}
.playlist-time{grid-column:1/3;grid-row:3}
.playlist-mute{grid-column:3;grid-row:3;justify-self:end}
.playlist-track{grid-template-columns:1fr;padding:.95rem 0}
.playlist-track-number{padding-top:0}
}


.photo-section-title{
font-family:var(--font-head);
font-size:1.4rem;
margin:3rem 0 1.5rem;
text-align:center;
}

.about-photo-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:1rem;
}

.about-photo-grid img{
width:100%;
aspect-ratio:4/3;
height:100%;
object-fit:cover;
border-radius:8px;
border:1px solid var(--border);
background:var(--bg-card);
box-shadow:0 12px 34px rgba(0,0,0,.18);
}

@media (max-width:800px){
.about-grid{grid-template-columns:1fr!important}
.about-photo-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:520px){
.about-photo-grid{grid-template-columns:1fr}
}

/* Footer */
.site-footer{
padding:2rem 0;
border-top:1px solid var(--border);
background:var(--bg);
}

.footer-row{
display:flex;justify-content:space-between;align-items:center;
gap:1rem;flex-wrap:wrap;
}

.footer-row p{
color:var(--text-muted);
font-size:.85rem;
}

.footer-links{
display:flex;
gap:1.2rem;
}

.footer-links a{
color:var(--text-muted);
font-size:.85rem;
text-decoration:none;
}

.footer-links a:hover{
color:var(--accent-aqua);
}

/* Enhanced Design System */

/* Smooth scrolling */
html{scroll-behavior:smooth}

/* Improved focus states */
a:focus-visible, button:focus-visible{
outline:2px solid var(--accent-aqua);
outline-offset:3px;
border-radius:2px;
}

/* Enhanced card hover effects */
.blog-card, .credit-entry, .work-card{
transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.blog-card:hover, .work-card:hover{
transform:translateY(-2px);
box-shadow:0 8px 24px rgba(0,0,0,.3);
}

/* Section dividers */
.section + .section{
border-top:1px solid var(--border);
}

/* Enhanced button interactions */
.btn{
position:relative;
overflow:hidden;
}

.btn::after{
content:'';
position:absolute;
top:50%;
left:50%;
width:0;
height:0;
background:rgba(255,255,255,.1);
border-radius:50%;
transform:translate(-50%,-50%);
transition:width .3s ease, height .3s ease;
}

.btn:active::after{
width:200%;
height:200%;
}

/* Gallery image hover */
.gallery-grid img{
transition:transform .3s ease, box-shadow .3s ease;
}

.gallery-grid img:hover{
transform:scale(1.02);
box-shadow:0 8px 24px rgba(0,0,0,.4);
}

/* Page header accent */
.page-header h1::after{
content:'';
display:block;
width:60px;
height:3px;
background:linear-gradient(90deg,var(--accent-aqua),var(--accent-teal));
margin:1rem auto 0;
border-radius:2px;
}

/* Section title accent */
.section h2::after{
content:'';
display:block;
width:40px;
height:2px;
background:var(--accent-aqua);
margin:1rem auto 0;
border-radius:1px;
}

/* Responsive improvements */
@media (max-width:640px){
.hero{padding:5rem 0 4rem}
.section{padding:3rem 0}
.page-header{padding:3rem 0 1.5rem}
.cta-box{padding:2rem}
}

/* Print styles */
@media print{
.site-header, .site-footer{display:none}
.hero{background:none;color:#000;padding:2rem 0}
body{background:#fff;color:#000}
}

/* Responsive */
@media (max-width:640px){
.header-row{flex-direction:column;align-items:flex-start}
.nav-menu{gap:1rem}
.work-grid{grid-template-columns:1fr}
.footer-row{flex-direction:column;align-items:flex-start}
.contact-grid{grid-template-columns:1fr!important;gap:2rem!important}
.credit-entry{display:block;padding:1.15rem 1.25rem}
.credit-entry strong{display:block;min-width:0;margin-bottom:.35rem}
.credit-entry span{display:inline-block;margin:0 .4rem .35rem 0}
.credit-entry em{display:block;margin:.2rem 0 0;color:#9fb2b2}

/* Blog cards — stack vertically, kill stretched-link overlay */
.blog-card{display:flex;flex-direction:column}
.blog-card h3 a{
position:static;
width:100%;
border-radius:0;
margin-top:.5rem;
}
.blog-card img{display:block;width:100%;max-width:none;margin:.75rem 0 0 0}
.blog-date{margin-bottom:.4rem}
}

/* Music browser */
.music-header .eyebrow{
color:var(--accent-teal);
text-transform:uppercase;
letter-spacing:.12em;
font-size:.78rem;
font-weight:600;
margin-bottom:.35rem;
}

.music-browser-section{padding-top:2.5rem}
.music-container{max-width:1080px}

.music-toolbar{
background:linear-gradient(180deg,rgba(21,29,32,.98),rgba(17,24,26,.98));
border:1px solid var(--border);
border-radius:10px;
padding:1.4rem;
margin-bottom:1.5rem;
box-shadow:0 12px 34px rgba(0,0,0,.22);
}

.music-toolbar label{
display:block;
font-size:.78rem;
text-transform:uppercase;
letter-spacing:.08em;
color:var(--text-muted);
margin-bottom:.45rem;
}

.search-wrap{margin-bottom:1rem}
.music-toolbar input,
.music-toolbar select{
width:100%;
background:#071011;
color:var(--text);
border:1px solid var(--border);
border-radius:6px;
padding:.78rem .85rem;
font:inherit;
}

.music-toolbar input:focus,
.music-toolbar select:focus{
outline:2px solid rgba(61,214,208,.45);
border-color:var(--accent-aqua);
}

.filter-grid{
display:grid;
grid-template-columns:2fr 1fr 1fr;
gap:1rem;
margin-bottom:1.25rem;
}

.tag-panel{
border-top:1px solid var(--border);
padding-top:1rem;
}

.tag-panel-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:1rem;
margin-bottom:.75rem;
}

.tag-panel-head h2{
font-family:var(--font-body);
font-size:.82rem;
text-transform:uppercase;
letter-spacing:.08em;
color:var(--text-muted);
margin:0;
text-align:left;
}

.tag-panel-head h2::after{display:none}

.tag-panel-head button{
background:transparent;
color:var(--accent-aqua);
border:1px solid rgba(61,214,208,.32);
border-radius:999px;
padding:.35rem .75rem;
cursor:pointer;
}

.tag-filters,
.track-chips{
display:flex;
flex-wrap:wrap;
gap:.45rem;
}

.filter-chip,
.track-chip{
border:1px solid rgba(173,192,192,.24);
background:rgba(255,255,255,.03);
color:var(--text-muted);
border-radius:999px;
padding:.36rem .68rem;
font-size:.8rem;
line-height:1;
cursor:pointer;
transition:background .15s,border-color .15s,color .15s,transform .15s;
}

.filter-chip:hover,
.track-chip:hover{
border-color:var(--accent-aqua);
color:var(--accent-aqua);
transform:translateY(-1px);
}

.filter-chip.active{
background:rgba(61,214,208,.16);
border-color:var(--accent-aqua);
color:var(--text);
}

.music-status-row{
display:flex;
justify-content:space-between;
gap:1rem;
align-items:baseline;
margin:0 0 1rem;
}

.music-count{
color:var(--text);
font-weight:600;
}

.music-note{
color:var(--text-muted);
font-size:.86rem;
text-align:right;
}

.track-results{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:1rem;
}

.music-card{
background:var(--bg-card);
border:1px solid var(--border);
border-radius:10px;
padding:1.1rem;
display:flex;
flex-direction:column;
gap:1rem;
cursor:pointer;
transition:border-color .2s,transform .2s,box-shadow .2s,background .2s;
}

.music-card:hover,
.music-card.is-playing{
border-color:var(--accent-teal);
transform:translateY(-2px);
box-shadow:0 12px 28px rgba(0,0,0,.28);
background:rgba(61,214,208,.035);
}

.music-card:focus-visible{
outline:2px solid var(--accent-aqua);
outline-offset:2px;
}

.track-project{
color:var(--accent-teal);
font-size:.78rem;
letter-spacing:.05em;
text-transform:uppercase;
margin-bottom:.35rem;
}

.track-project span{
color:var(--text-muted);
opacity:.75;
margin-left:.35rem;
}

.music-card h2{
font-family:var(--font-head);
font-size:1.28rem;
line-height:1.15;
margin-bottom:.25rem;
display:flex;
align-items:center;
gap:.65rem;
}

.music-card.is-playing .music-card-play-icon{
border-color:rgba(242,245,245,.95);
color:var(--text);
font-size:.48rem;
letter-spacing:-.08em;
transform:scale(1.04);
}

.music-card-progress{
margin:.35rem 0 .65rem;
width:100%;
}

.music-card-seek{
--progress:0%;
-webkit-appearance:none;
appearance:none;
display:block;
width:100%;
height:18px;
background:transparent;
cursor:pointer;
}

.music-card-seek::-webkit-slider-runnable-track{
height:4px;
border-radius:999px;
background:linear-gradient(90deg,var(--accent-aqua) var(--progress),rgba(242,245,245,.18) var(--progress));
}

.music-card-seek::-moz-range-track{
height:4px;
border-radius:999px;
background:rgba(242,245,245,.18);
}

.music-card-seek::-moz-range-progress{
height:4px;
border-radius:999px;
background:var(--accent-aqua);
}

.music-card-seek::-webkit-slider-thumb{
-webkit-appearance:none;
appearance:none;
width:11px;
height:11px;
border-radius:50%;
border:1px solid rgba(242,245,245,.9);
background:var(--text);
box-shadow:0 0 10px rgba(61,214,208,.32);
margin-top:-3.5px;
}

.music-card-seek::-moz-range-thumb{
width:11px;
height:11px;
border-radius:50%;
border:1px solid rgba(242,245,245,.9);
background:var(--text);
box-shadow:0 0 10px rgba(61,214,208,.32);
}

.music-card-seek:focus-visible{
outline:2px solid var(--accent-aqua);
outline-offset:4px;
}

.track-meta,
.track-note{
color:var(--text-muted);
font-size:.88rem;
}

.track-note{margin-top:.7rem}

.track-instruments{
color:#c8d6d6;
font-size:.86rem;
line-height:1.4;
margin:.45rem 0 .1rem;
}

.track-instruments b{
color:var(--text-muted);
font-weight:600;
text-transform:uppercase;
letter-spacing:.06em;
font-size:.7rem;
margin-right:.4rem;
}

.track-meters{
display:flex;
gap:.9rem;
flex-wrap:wrap;
margin:.75rem 0;
}

.mini-meter{
display:flex;
align-items:center;
gap:.45rem;
color:var(--text-muted);
font-size:.76rem;
}

.mini-meter b{
font-weight:600;
color:var(--text-muted);
}

.mini-meter em{
font-style:normal;
color:var(--text);
opacity:.9;
}

.mini-meter span span{
display:inline-block;
width:7px;
height:7px;
border-radius:999px;
background:rgba(173,192,192,.25);
margin-right:3px;
}

.mini-meter span span.on{
background:var(--accent-aqua);
box-shadow:0 0 8px rgba(61,214,208,.35);
}

.music-card audio{
display:none;
}

.empty-state{
grid-column:1/-1;
text-align:center;
background:var(--bg-card);
border:1px solid var(--border);
border-radius:10px;
padding:2rem;
}

.empty-state h2{
font-family:var(--font-head);
font-size:1.4rem;
margin-bottom:.35rem;
}
.empty-state p{color:var(--text-muted)}

.load-more-wrap{
text-align:center;
margin-top:1.5rem;
}

@media (max-width:760px){
.filter-grid{grid-template-columns:1fr}
.music-status-row{display:block}
.music-note{text-align:left;margin-top:.35rem}
.track-results{grid-template-columns:1fr}
.music-toolbar{padding:1rem}
}
/* Private pitch pages */
.pitch-header .eyebrow{
color:var(--accent-teal);
text-transform:uppercase;
letter-spacing:.12em;
font-size:.78rem;
font-weight:600;
margin-bottom:.35rem;
}

.pitch-container{max-width:1040px}
.pitch-brief-section{padding-top:2.5rem}

.pitch-brief{
display:grid;
grid-template-columns:1fr 240px;
gap:1.2rem;
background:linear-gradient(180deg,rgba(21,29,32,.98),rgba(17,24,26,.98));
border:1px solid var(--border);
border-radius:10px;
padding:1.4rem;
margin-bottom:1.4rem;
}

.pitch-brief h2{
font-family:var(--font-head);
font-size:1.35rem;
text-align:left;
margin-bottom:.5rem;
}
.pitch-brief h2::after{display:none}
.pitch-brief p{color:var(--text-muted)}

.pitch-meta-box{
display:flex;
flex-direction:column;
gap:.55rem;
justify-content:center;
}
.pitch-meta-box span{
border:1px solid rgba(61,214,208,.25);
border-radius:999px;
color:var(--accent-aqua);
font-size:.8rem;
padding:.35rem .7rem;
text-align:center;
}

.pitch-track-list{
display:grid;
gap:1rem;
}

.pitch-track{
display:grid;
grid-template-columns:56px 1fr;
gap:1rem;
background:var(--bg-card);
border:1px solid var(--border);
border-radius:10px;
padding:1rem;
transition:border-color .2s,transform .2s,box-shadow .2s;
}
.pitch-track:hover{
border-color:var(--accent-teal);
transform:translateY(-2px);
box-shadow:0 12px 28px rgba(0,0,0,.28);
}
.pitch-track-num{
font-family:var(--font-head);
font-size:1.5rem;
line-height:1;
color:var(--accent-aqua);
opacity:.9;
padding-top:.25rem;
}
.pitch-track h2{
font-family:var(--font-head);
font-size:1.35rem;
line-height:1.15;
margin:.1rem 0 .25rem;
}
.pitch-rationale{
color:var(--text-muted);
margin:.6rem 0 .75rem;
font-size:.94rem;
}
.pitch-chips{
display:flex;
flex-wrap:wrap;
gap:.4rem;
margin-bottom:.85rem;
}
.pitch-chip{
border:1px solid rgba(173,192,192,.24);
background:rgba(255,255,255,.03);
color:var(--text-muted);
border-radius:999px;
padding:.32rem .62rem;
font-size:.78rem;
line-height:1;
}
.pitch-track audio{
width:100%;
filter:sepia(20%) saturate(80%) hue-rotate(130deg);
}
.pitch-footer-note{
text-align:center;
background:var(--bg-card);
border:1px solid var(--border);
border-radius:10px;
padding:1.5rem;
margin-top:1.5rem;
}
.pitch-footer-note p{
color:var(--text-muted);
max-width:620px;
margin:0 auto 1rem;
}

@media (max-width:760px){
.pitch-brief{grid-template-columns:1fr}
.pitch-meta-box{align-items:flex-start}
.pitch-meta-box span{text-align:left}
.pitch-track{grid-template-columns:1fr}
.pitch-track-num{font-size:1rem;letter-spacing:.12em}
}

/* Credit category anchors */
.credits-intro{
max-width:760px;
margin:0 auto 1.85rem;
color:var(--text-muted);
line-height:1.72;
text-align:center;
}
.credit-jump-nav{
display:flex;
justify-content:center;
gap:.8rem;
flex-wrap:wrap;
margin:0 0 3.6rem;
padding-top:.15rem;
}
.credit-jump-nav + h2{
margin-top:0;
}
.credit-jump-nav a{
color:var(--accent-aqua);
text-decoration:none;
border:1px solid rgba(61,214,208,.28);
border-radius:999px;
padding:.42rem .85rem;
font-size:.88rem;
background:rgba(61,214,208,.05);
}
.credit-jump-nav a:hover{
background:rgba(61,214,208,.12);
text-decoration:none;
}
#features-series,
#shorts,
#video-games{
scroll-margin-top:2rem;
}

/* About photo preview + shared media lightbox */
.about-photo-grid img{
cursor:zoom-in;
}
.photo-hover-preview{
position:fixed;
z-index:90;
pointer-events:none;
opacity:0;
transform:translateY(8px) scale(.98);
transition:opacity .16s ease, transform .16s ease;
background:rgba(8,12,13,.94);
border:1px solid rgba(61,214,208,.4);
border-radius:10px;
padding:.55rem;
box-shadow:0 24px 70px rgba(0,0,0,.52);
}
.photo-hover-preview.is-visible{
opacity:1;
transform:translateY(0) scale(1);
}
.photo-hover-preview img{
display:block;
width:100%;
max-height:270px;
object-fit:contain;
border-radius:7px;
background:#020303;
}
.media-lightbox{
position:fixed;
inset:0;
z-index:2000;
display:none;
place-items:center;
padding:1.25rem;
}
.media-lightbox.is-open{
display:grid;
}
.media-lightbox-backdrop{
position:absolute;
inset:0;
background:rgba(0,0,0,.78);
backdrop-filter:blur(4px);
}
.media-lightbox-panel{
position:relative;
z-index:1;
width:min(92vw,980px);
max-height:92vh;
background:var(--bg-card);
border:1px solid rgba(61,214,208,.34);
border-radius:14px;
padding:1rem;
box-shadow:0 34px 110px rgba(0,0,0,.65);
}
.media-lightbox-close{
position:absolute;
top:.65rem;
right:.75rem;
z-index:2;
width:2.2rem;
height:2.2rem;
border-radius:999px;
border:1px solid var(--border);
background:rgba(0,0,0,.55);
color:var(--text);
font-size:1.55rem;
line-height:1;
cursor:pointer;
}
.media-lightbox-close:hover{
color:var(--accent-aqua);
border-color:var(--accent-aqua);
}
.media-lightbox-content img,
.media-lightbox-content video{
display:block;
width:100%;
max-height:78vh;
object-fit:contain;
border-radius:10px;
background:#000;
}
.media-lightbox-caption{
margin:.75rem .3rem 0;
color:var(--text-muted);
font-size:.9rem;
text-align:center;
}
body.lightbox-open{
overflow:hidden;
}
.commercial-card video{
cursor:zoom-in;
}

@media (max-width:700px){
.photo-hover-preview{display:none;}
.media-lightbox{padding:.75rem;}
.media-lightbox-panel{width:96vw;padding:.75rem;}
.media-lightbox-content img,
.media-lightbox-content video{max-height:76vh;}
}
