
:root{
  --bg:#0a0a0a; --bg2:#0f0f10; --text:#e4e4e7; --muted:#a1a1aa; --accent:#facc15;
  --card:#0f0f12; --border:#27272a;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.page{margin:0;background:#0a0a0a;color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;line-height:1.5}
.container{max-width:72rem;margin:0 auto;padding:0 1rem}
.accent{color:var(--accent)}
.small{font-size:.925rem}
.xsmall{font-size:.8rem}
.muted{color:var(--muted)}
.link{color:var(--accent);text-decoration:none}
.link:hover{text-decoration:underline}
.section{padding:4rem 1rem}
.section--narrow{max-width:56rem;margin:0 auto;padding:4rem 1rem}
.section--band{background:rgba(24,24,27,.5);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.section__title{font-weight:800;font-size:clamp(1.5rem,2.2vw,2.5rem);margin:0 0 1rem}
.hero{text-align:center;padding-top:5rem}
.hero__title{font-weight:900;font-size:clamp(2rem,5vw,3.5rem);margin:0}
.hero__copy{max-width:40rem;margin:1rem auto 0;color:#d4d4d8}
.hero__actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;margin-top:1.5rem}

.header{position:sticky;top:0;z-index:50;backdrop-filter:saturate(140%) blur(6px);background:rgba(10,10,10,.7);border-bottom:1px solid var(--border)}
.header__inner{display:flex;align-items:center;justify-content:space-between;padding:.8rem 1rem}
.brand{display:flex;align-items:center;gap:.75rem}
.brand__icon{height:36px;width:36px;background:var(--accent);border-radius:12px;padding:.35rem;box-shadow:0 6px 18px rgba(250,204,21,.15)}
.brand__name{font-weight:800;margin:0}
.brand__tag{margin:0;font-size:.75rem;color:var(--muted)}
.nav{display:none}
@media(min-width:768px){.nav{display:flex;gap:1.25rem}}
.nav__link{color:var(--text);text-decoration:none}
.nav__link:hover{color:var(--accent)}

.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;padding:.8rem 1rem;font-weight:700;text-decoration:none;border:1px solid var(--border);transition:.2s}
.btn--primary{background:var(--accent);border-color:transparent;color:#111827;box-shadow:0 10px 24px rgba(250,204,21,.18)}
.btn--primary:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(250,204,21,.24)}
.btn--ghost{color:var(--text)}
.btn--ghost:hover{color:var(--accent);border-color:#3f3f46}

.cards{display:grid;gap:1rem;grid-template-columns:repeat(1,minmax(0,1fr))}
@media(min-width:768px){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.card{background:rgba(20,20,24,.7);border:1px solid var(--border);border-radius:22px;padding:1rem;box-shadow:0 12px 24px rgba(0,0,0,.25);transition:.2s}
.card:hover{border-color:rgba(250,204,21,.35);transform:translateY(-2px)}
.card__title{color:var(--accent);font-weight:700;margin:0 0 .5rem}
.card__list{margin:.5rem 0 0;padding-left:1rem;color:#d4d4d8}
.card__list li{margin:.25rem 0}

.grid2{display:grid;gap:1.25rem;grid-template-columns:1fr}
@media(min-width:1024px){.grid2{grid-template-columns:1fr 1fr}}

.grid-days{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem;max-height:180px;overflow:auto}
@media(min-width:640px){.grid-days{grid-template-columns:repeat(7,minmax(0,1fr))}}
.grid-times{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
@media(min-width:640px){.grid-times{grid-template-columns:repeat(5,minmax(0,1fr))}}

.dayBtn,.timeBtn{border:1px solid var(--border);background:#0b0b0e;color:var(--text);border-radius:12px;padding:.5rem .75rem;font-size:.9rem;cursor:pointer;transition:.2s}
.dayBtn:hover,.timeBtn:hover{border-color:#3f3f46;color:var(--accent)}
.dayBtn.active,.timeBtn.active{border-color:var(--accent);color:var(--accent)}

.textarea{width:100%;min-height:140px;border:1px solid var(--border);background:#0b0b0e;color:var(--text);border-radius:12px;padding:.75rem}

.actions-row{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:.75rem}

.footer{border-top:1px solid var(--border);text-align:center;color:var(--muted);font-size:.9rem;padding:2rem 1rem}

.bg-art{position:fixed;inset:0;z-index:-1;background:
  radial-gradient(circle at 30% 40%, rgba(250,204,21,.08), transparent 60%),
  radial-gradient(circle at 70% 60%, rgba(250,204,21,.05), transparent 70%),
  linear-gradient(to bottom, var(--bg), var(--bg2) 40%, #000 100%);
}
