/* DeepSound Audio — site stylesheet (Studio Production Calendar) */
:root{
  --bg:#F5F2EA; --card:#FFFDF8; --ink:#201B24; --muted:#6B6270;
  --accent:#B07D1A; --accent-2:#6B3E63; --rule:#DAD3C4; --bar:#241D2A;
  --bar-ink:#EFE7D8; --shadow:0 10px 30px rgba(32,27,36,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:Verdana,Tahoma,"DejaVu Sans",sans-serif;
  font-size:16px; line-height:1.68;
}
img{max-width:100%; height:auto; display:block}
a{color:var(--accent-2)}
a:hover{color:var(--accent)}
h1,h2,h3,h4{font-family:Georgia,"Times New Roman",serif; line-height:1.24; color:var(--ink)}
h1{font-size:2.05rem; margin:.2em 0 .5em}
h2{font-size:1.5rem; margin:1.6em 0 .5em; padding-bottom:.25em; border-bottom:2px solid var(--rule)}
h3{font-size:1.16rem; margin:1.2em 0 .4em}
p{margin:.7em 0}
ul,ol{margin:.6em 0 .9em 1.15em; padding:0}
li{margin:.32em 0}
.wrap{max-width:1080px; margin:0 auto; padding:0 20px}

/* ---------- top bar + calendar navigation ---------- */
.topbar{
  position:sticky; top:0; z-index:60; background:var(--bar);
  color:var(--bar-ink); overflow:visible; box-shadow:var(--shadow);
}
.topbar .inner{
  max-width:1120px; margin:0 auto; padding:10px 18px 8px;
  display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px;
}
.brand{display:flex; align-items:center; gap:10px; margin-right:auto}
.brand .mono{
  width:40px; height:40px; border-radius:9px; background:var(--accent);
  display:flex; align-items:center; justify-content:center; flex:0 0 auto;
}
.brand .mono svg{width:26px; height:26px}
.brand .name{font-family:Georgia,serif; font-size:1.16rem; letter-spacing:.02em; color:#FFF9EC}
.brand .name b{color:var(--accent)}
.brand .tag{display:block; font-family:"Courier New",monospace; font-size:.62rem;
  letter-spacing:.18em; text-transform:uppercase; color:#B9ADBE; margin-top:2px}

.calendar{display:flex; gap:6px; align-items:flex-start}
.cal-cell{position:relative}
.cal-cell input{position:absolute; opacity:0; width:1px; height:1px}
.cal-toggle{
  display:block; cursor:pointer; min-width:74px; text-align:center;
  padding:7px 9px 8px; border:1px solid #3B3142; border-radius:9px;
  background:#2C2433; color:var(--bar-ink); transition:.15s;
}
.cal-toggle .dow{display:block; font-family:"Courier New",monospace; font-size:.6rem;
  letter-spacing:.16em; color:#B9ADBE}
.cal-toggle .chip{
  display:block; font-family:Georgia,serif; font-size:1.1rem; font-weight:bold;
  color:#FFF9EC; margin:1px 0;
}
.cal-toggle .sec{display:block; font-size:.68rem; letter-spacing:.03em; color:#D8CFBE}
.cal-toggle:hover{border-color:var(--accent); background:#35293E}
.cal-cell input:checked + .cal-toggle{
  background:var(--accent); border-color:var(--accent); color:#241D2A;
}
.cal-cell input:checked + .cal-toggle .dow,
.cal-cell input:checked + .cal-toggle .sec{color:#3A2C08}
.cal-cell input:checked + .cal-toggle .chip{color:#241D2A}
.cal-cell input:focus-visible + .cal-toggle{outline:3px solid #E9C878; outline-offset:2px}

.cal-panel{
  display:none; position:absolute; top:calc(100% + 8px); left:0; min-width:250px;
  background:var(--card); color:var(--ink); border:1px solid var(--rule);
  border-top:3px solid var(--accent); border-radius:0 0 10px 10px;
  box-shadow:var(--shadow); padding:10px 12px 12px; z-index:70;
}
.cal-cell input:checked ~ .cal-panel{display:block}
.cal-panel .plabel{font-family:"Courier New",monospace; font-size:.62rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:6px}
.cal-panel a{display:block; padding:5px 6px; border-radius:6px; text-decoration:none;
  color:var(--ink); font-size:.86rem; border-left:3px solid transparent}
.cal-panel a:hover{background:#F3EEE2; border-left-color:var(--accent-2); color:var(--accent-2)}
.cal-panel a[aria-current="page"]{
  background:#F6EEDC; border-left-color:var(--accent); font-weight:bold; color:#7A5510;
}

/* ---------- page shell ---------- */
main{padding:34px 0 60px}
.hero{
  background:linear-gradient(180deg,#2C2433 0%,#241D2A 100%); color:#F3ECDE;
  border-bottom:4px solid var(--accent);
}
.hero .wrap{padding:44px 20px 40px}
.hero h1{color:#FFF9EC; font-size:2.5rem; margin-top:0; max-width:20ch}
.hero p{max-width:64ch; color:#D9D0C2; font-size:1.02rem}
.hero .kicker{font-family:"Courier New",monospace; font-size:.68rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--accent); margin-bottom:.6em}
.hero figure{margin:0 0 22px}
.hero img{border-radius:10px; border:1px solid #3B3142}

.btn{
  display:inline-block; background:var(--accent); color:#241D2A; text-decoration:none;
  font-weight:bold; padding:12px 22px; border-radius:8px; border:1px solid #8E6413;
  font-family:Georgia,serif; font-size:1rem; margin-top:8px;
}
.btn:hover{background:#C8942A; color:#241D2A}
.btn.ghost{background:transparent; color:var(--accent); border-color:var(--accent)}

.lede{font-size:1.08rem; color:#3B333F}
.panel{background:var(--card); border:1px solid var(--rule); border-radius:12px;
  padding:18px 20px; margin:18px 0; box-shadow:0 2px 8px rgba(32,27,36,.05)}
.grid{display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.card{background:var(--card); border:1px solid var(--rule); border-left:4px solid var(--accent);
  border-radius:10px; padding:15px 17px}
.card h3{margin-top:.1em}
.card .tag-line{font-family:"Courier New",monospace; font-size:.62rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted)}
figure{margin:18px 0}
figcaption{font-size:.8rem; color:var(--muted); font-family:"Courier New",monospace; margin-top:6px}
.two-col{display:grid; grid-template-columns:1.35fr .85fr; gap:26px; align-items:start}
.note{background:#F6EEDC; border:1px solid #E4D2A6; border-radius:10px; padding:14px 16px; font-size:.9rem}
.avatar-row{display:flex; gap:14px; flex-wrap:wrap; align-items:center;
  border:1px dashed var(--rule); border-radius:10px; padding:12px 14px}

table{width:100%; border-collapse:collapse; margin:16px 0; font-size:.9rem; background:var(--card)}
caption{caption-side:top; text-align:left; font-family:"Courier New",monospace; font-size:.68rem;
  letter-spacing:.12em; text-transform:uppercase; color:var(--muted); padding-bottom:8px}
th,td{border:1px solid var(--rule); padding:9px 10px; vertical-align:top; text-align:left}
th{background:#EFE8D8; font-family:Georgia,serif}
tbody tr:nth-child(even){background:#FAF7EF}

form{background:var(--card); border:1px solid var(--rule); border-radius:12px; padding:20px}
.field{margin-bottom:14px}
.field label{display:block; font-size:.82rem; font-family:"Courier New",monospace;
  letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-bottom:5px}
.field input,.field select,.field textarea{
  width:100%; padding:10px 11px; border:1px solid var(--rule); border-radius:7px;
  font-family:Verdana,sans-serif; font-size:.95rem; background:#FFFDF8; color:var(--ink)}
.field textarea{min-height:120px; resize:vertical}

/* ---------- footer ---------- */
footer{background:var(--bar); color:#CFC6BB; margin-top:40px; border-top:4px solid var(--accent)}
footer .wrap{padding:34px 20px 26px}
.fgrid{display:grid; gap:22px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
footer h4{color:#FFF9EC; font-size:.8rem; letter-spacing:.14em; text-transform:uppercase;
  font-family:"Courier New",monospace; margin:0 0 10px}
footer a{color:#D9CDB7; text-decoration:none; font-size:.85rem; display:block; padding:2px 0}
footer a:hover{color:var(--accent)}
footer p{font-size:.85rem}
.disclaimer{background:#1C1622; border:1px solid #3B3142; border-radius:10px;
  padding:14px 16px; margin-top:24px; font-size:.8rem; color:#BCB2AA}
.fbottom{margin-top:20px; padding-top:16px; border-top:1px solid #3B3142;
  font-size:.78rem; color:#9C93A0; display:flex; flex-wrap:wrap; gap:8px 18px; justify-content:space-between}

/* ---------- cookie strip ---------- */
.cookie{position:fixed; left:0; right:0; bottom:0; z-index:90}
.cookie input{position:absolute; opacity:0; width:1px; height:1px}
.cookie-body{
  background:#241D2A; color:#E6DDCE; border-top:3px solid var(--accent);
  padding:12px 18px; display:flex; gap:16px; align-items:center; flex-wrap:wrap;
  font-size:.8rem; box-shadow:0 -8px 22px rgba(0,0,0,.2);
}
.cookie-body p{margin:0; max-width:76ch}
.cookie-btn{background:var(--accent); color:#241D2A; border-radius:6px; padding:7px 14px;
  cursor:pointer; font-weight:bold; font-family:Georgia,serif; white-space:nowrap}
.cookie input:checked ~ .cookie-body{display:none}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .two-col{grid-template-columns:1fr}
}
@media (max-width:760px){
  .topbar .inner{flex-direction:column; align-items:stretch; padding:12px 16px 14px}
  .brand{margin-right:0}
  .calendar{flex-direction:column; gap:8px}
  .cal-panel{position:static; display:block; margin-top:8px; min-width:0;
    border-radius:10px; box-shadow:none}
  .cal-cell input:not(:checked) ~ .cal-panel{display:block}
  h1{font-size:1.7rem}
  .hero h1{font-size:1.9rem}
  .hero .wrap{padding:30px 18px 28px}
}