/* Core theme */
:root{--bg:#0b0b10;--fg:#e6e6ea;--muted:#9aa0a6;--accent:#6ab0ff;--card:#14141c}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;background:var(--bg);color:var(--fg);line-height:1.6}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(1100px,92%);margin:0 auto}

/* Header */
.tb-header{position:relative;isolation:isolate;border-bottom:1px solid #1f2330;background:#07080c}
.tb-header__bg{position:relative;height:clamp(180px,28vw,360px);overflow:hidden}
.tb-header__bg picture,.tb-header__bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tb-header__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.65),rgba(0,0,0,.35) 40%,rgba(0,0,0,.8));pointer-events:none}
.tb-header__bar{position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:1rem;margin-top:-72px;padding:0 0 1rem}
.tb-logo img{display:block;max-width:min(90vw,680px);height:auto;filter:drop-shadow(0 6px 0 #0a78ff33)}
.tb-nav{display:flex;flex-wrap:wrap;gap:1rem;background:rgba(10,12,18,.55);border:1px solid #1c2233;padding:.6rem .8rem;border-radius:999px;backdrop-filter:blur(6px)}
.tb-nav a{color:#e6e6ea;font-weight:600}
.tb-nav a:hover{color:#6ab0ff}
@media (max-width:720px){
  .tb-header__bar{grid-template-columns:1fr;margin-top:-56px}
  .tb-nav{justify-content:center}
}

/* Sections */
.hero{background:radial-gradient(1200px 600px at 10% 10%,#162032,transparent),linear-gradient(180deg,#0b0b10,#0b0b10 40%,#09090e);padding:5rem 0 3rem}
.hero h2{font-size:clamp(1.8rem,3vw + 1rem,3rem);margin:0 0 .5rem}
.hero p{color:var(--muted);margin:0 0 1rem}
.btn{display:inline-block;background:var(--accent);color:#08101d;padding:.7rem 1rem;border-radius:999px;font-weight:600}
.btn:hover{filter:brightness(1.05)}
.section{padding:3rem 0}
.section h3{margin:0 0 1rem;font-size:1.4rem}
.grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem}
.grid li{background:var(--card);padding:1rem;border-radius:16px}
.embeds iframe{border-radius:12px;background:#000;margin:.5rem 0}
label{display:block;margin:.6rem 0}
input,textarea{width:100%;padding:.7rem .8rem;border-radius:12px;border:1px solid #24283a;background:#0f1018;color:var(--fg)}
.site-footer{border-top:1px solid #1f2330;padding:2rem 0;color:var(--muted)}

/* === Member cards (single source of truth) === */
.member{
  display:grid;
  grid-template-columns:500px 1fr;         /* fixed image column + text */
  gap:1.6rem;
  align-items:start;
  margin:1.2rem 0;
  border:1px solid #1f2330;
  border-radius:20px;
  overflow:hidden;
  background:linear-gradient(180deg,#0f1018,#0b0b10);
  position:relative;
}

.member__media{
  width:500px;
  height:500px;                            /* force the 500px box */
  overflow:hidden;
  border-radius:16px;
  box-shadow:0 8px 24px rgba(0,0,0,.15);
  background:#0d0d0d;
  position:relative;
}

.member__media > a,
.member__media > img{
  display:block;
  width:100%;
  height:100%;
}

.member__media > img{
  object-fit:cover;
  object-position:var(--objpos,50% 50%);   /* per-image focal point */
  filter:contrast(1.1) saturate(1.1) sepia(.08);
  transform:scale(1.02);
  transition:transform .35s ease;
}

.member__media:hover img,
.member__media:focus-within img{
  transform:scale(1.01);                   /* subtle hover */
}

.member__media::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.35));
}

.member__body{ padding:1.1rem 1.1rem 1.2rem; }
.member__body h4{ margin:.2rem 0 .4rem; font-size:1.25rem; }
.member .tag{ color:#9aa0a6; margin:.2rem 0 .8rem; }

/* Optional helpers if you prefer classes over inline --objpos */
.obj-left  > img{ object-position:30% 45%; }
.obj-right > img{ object-position:70% 45%; }
.obj-high  > img{ object-position:50% 38%; }
.obj-low   > img{ object-position:50% 60%; }

/* Responsive */
@media (max-width:900px){
  .member{ grid-template-columns:1fr; }
  .member__media{ width:100%; height:360px; }
}
@media (max-width:520px){
  .member__media{ height:300px; }
}

/* Band page hero image */
.band-hero{
  text-align:center;
  margin-bottom:2rem;
}
.band-hero img{
  max-width:100%;
  height:auto;
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.2);
}

/* --- HOTFIX: force 500px boxes and image fit --- */
.member{
  display:grid !important;
  grid-template-columns:500px 1fr !important;
  gap:1.6rem !important;
  align-items:start !important;
  margin:1.2rem 0 !important;
  border:1px solid #1f2330 !important;
  border-radius:20px !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,#0f1018,#0b0b10) !important;
}

.member__media{
  width:500px !important;
  height:500px !important;
  overflow:hidden !important;
  border-radius:16px !important;
  position:relative !important;
  background:#0d0d0d !important;
}

.member__media > a,
.member__media > img{
  display:block !important;
  width:100% !important;
  height:100% !important;      /* this is the key */
}

.member__media > img{
  object-fit:cover !important;
  object-position:var(--objpos,50% 45%) !important; /* default slightly high for faces */
  transition:transform .2s ease !important;
}

/* Mobile stack */
@media (max-width:900px){
  .member{ grid-template-columns:1fr !important; }
  .member__media{ width:100% !important; height:360px !important; }
}
@media (max-width:520px){
  .member__media{ height:300px !important; }
}

/* Discography (paste into /assets/styles.css) */
.album-card{display:grid;grid-template-columns:260px 1fr;gap:1.2rem;background:linear-gradient(180deg,#10121a,#0b0b10);border:1px solid #1f2330;border-radius:20px;padding:1rem;margin:1.2rem 0}
.album-art img{width:100%;height:auto;border-radius:14px;display:block;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.album-meta h4{margin:.2rem 0 1rem;font-size:1.25rem}
.tracklist{list-style:none;padding:0;margin:0;display:grid;gap:.35rem}
.tracklist a{color:#e6e6ea}.tracklist a:hover{color:var(--accent)}
.album-links{display:flex;gap:.6rem;margin-top:1rem}
.btn-ghost{background:transparent;border:1px solid #2a3248;color:#c9d1e4}.btn-ghost:hover{border-color:#3b4767}
@media (max-width:800px){.album-card{grid-template-columns:1fr}}
/* Lyrics */
.lyrics pre{white-space:pre-wrap;font:500 16px/1.7 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;background:#111421;border:1px solid #1f2330;padding:1rem;border-radius:12px}

