/* ============================================
   UNDERCURRENT.FM — Golden Hour design system
   ============================================ */
:root{
  --espresso:#171007;
  --walnut:#1F1810;
  --panel:#282017;
  --cream:#F6EAD3;
  --dim:#B3A488;
  --amber:#FFB347;
  --coral:#FF7847;
  --dial:#E8D5A3;
  --hairline:rgba(246,234,211,.12);
  --glow-amber:0 0 18px rgba(255,179,71,.45), 0 0 60px rgba(255,179,71,.14);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--espresso);
  color:var(--cream);
  font-family:'Karla',sans-serif;
  font-size:16.5px;
  line-height:1.65;
  overflow-x:hidden;
}
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:199;
  background:radial-gradient(ellipse 120% 100% at 50% 50%, transparent 62%, rgba(0,0,0,.4));
}
::selection{background:var(--amber);color:var(--espresso)}

.mono{font-family:'Courier Prime',monospace;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase}
.display{font-family:'Fraunces',serif;font-optical-sizing:auto;font-weight:600;line-height:1.05;letter-spacing:-.01em}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px}
.wrap-narrow{max-width:760px;margin:0 auto;padding:0 32px}

/* ---------- NAV ---------- */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  backdrop-filter:blur(14px);
  background:rgba(23,16,7,.78);
  border-bottom:1px solid var(--hairline);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:66px;max-width:1180px;margin:0 auto;padding:0 32px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--cream)}
.brand-dial{width:26px;height:16px}
.brand-name{font-family:'Fraunces',serif;font-weight:700;font-size:1.05rem;letter-spacing:.01em}
.brand-name em{font-style:italic;color:var(--amber);font-weight:600}
.nav-links{display:flex;gap:32px;align-items:center}
.nav-links a{color:var(--dim);text-decoration:none;font-size:.88rem;font-weight:600;transition:color .2s}
.nav-links a:hover,.nav-links a:focus-visible{color:var(--cream)}
.nav-links a.active{color:var(--amber)}
.nav-links a:focus-visible,.btn:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:4px}
.btn{
  font-family:'Courier Prime',monospace;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  color:var(--espresso);background:var(--amber);
  border:none;padding:11px 22px;cursor:pointer;border-radius:3px;
  box-shadow:var(--glow-amber);text-decoration:none;display:inline-block;
  transition:transform .15s, box-shadow .2s;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 0 26px rgba(255,179,71,.6),0 0 80px rgba(255,179,71,.2)}
.btn.ghost{background:transparent;color:var(--cream);border:1px solid rgba(246,234,211,.3);box-shadow:none}
.btn.ghost:hover{border-color:var(--amber);color:var(--amber);box-shadow:none}

/* ---------- HERO ---------- */
header.hero{
  position:relative;min-height:92vh;display:flex;align-items:center;
  background:
    radial-gradient(ellipse 90% 60% at 50% 115%, rgba(255,120,71,.20), transparent 62%),
    radial-gradient(ellipse 70% 45% at 85% -10%, rgba(255,179,71,.08), transparent 55%),
    var(--espresso);
}
header.hero.compact{min-height:0;padding:150px 0 60px}
.hero-inner{position:relative;z-index:2;padding-top:130px;padding-bottom:190px;width:100%}
header.hero.compact .hero-inner{padding:0}
.hero-meta{display:flex;gap:28px;flex-wrap:wrap;color:var(--dim);margin-bottom:34px}
.hero-meta .live{color:var(--coral)}
.hero-meta .live::before{
  content:"";display:inline-block;width:7px;height:7px;border-radius:50%;
  background:var(--coral);margin-right:8px;box-shadow:0 0 10px var(--coral);
  animation:pulse 2.2s infinite;vertical-align:1px;
}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
h1{font-size:clamp(3rem,8.2vw,6.6rem);margin-bottom:8px}
h1 .l1{display:block;font-weight:350}
h1 .l2{display:block;font-style:italic;font-weight:650;color:var(--amber);text-shadow:0 0 40px rgba(255,179,71,.3)}
.hero-sub{max-width:520px;color:var(--dim);font-size:1.08rem;margin:30px 0 42px}
.hero-sub strong{color:var(--cream);font-weight:700}
.hero-ctas{display:flex;gap:16px;flex-wrap:wrap}

/* FM dial signature */
.dial-band{position:absolute;left:0;right:0;bottom:0;height:130px;z-index:1;border-top:1px solid var(--hairline);background:rgba(31,24,16,.5);backdrop-filter:blur(4px)}
.dial-scale{position:relative;height:100%;max-width:1180px;margin:0 auto;padding:0 32px}
.dial-ticks{position:absolute;left:32px;right:32px;top:38px;height:34px;display:flex;justify-content:space-between;align-items:flex-start}
.tick{width:1px;background:rgba(246,234,211,.35);height:12px}
.tick.major{height:22px;background:rgba(246,234,211,.6)}
.dial-nums{position:absolute;left:32px;right:32px;top:8px;display:flex;justify-content:space-between;color:var(--dial);font-family:'Courier Prime',monospace;font-size:.8rem;letter-spacing:.1em}
.needle{
  position:absolute;top:30px;width:2px;height:52px;left:24%;
  background:var(--coral);box-shadow:0 0 12px var(--coral),0 0 40px rgba(255,120,71,.5);
  animation:drift 9s ease-in-out infinite alternate;
}
.needle::after{content:"YOU ARE HERE";position:absolute;top:58px;left:-42px;width:90px;text-align:center;font-family:'Courier Prime',monospace;font-size:.62rem;letter-spacing:.16em;color:var(--coral)}
@keyframes drift{0%{left:24%}50%{left:25.2%}100%{left:23.4%}}

/* ---------- SECTIONS ---------- */
section{position:relative;padding:100px 0}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:52px;flex-wrap:wrap}
.eyebrow{color:var(--coral);margin-bottom:14px;display:block}
h2{font-size:clamp(2rem,4vw,3.2rem)}
h2 em,h1 em{font-style:italic;color:var(--amber)}
.sec-link{color:var(--dim);text-decoration:none;font-size:.88rem;border-bottom:1px solid transparent;transition:.2s}
.sec-link:hover{color:var(--amber);border-color:var(--amber)}
.tinted{background:var(--walnut);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}

/* ---------- CARDS & GRIDS ---------- */
.tools-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.tool{
  background:var(--walnut);border:1px solid var(--hairline);border-radius:6px;
  padding:30px 26px;position:relative;overflow:hidden;
  transition:transform .2s,border-color .2s;text-decoration:none;color:inherit;display:block;
}
.tool:hover{transform:translateY(-4px);border-color:rgba(255,179,71,.55)}
.tool:hover .tool-num{color:var(--amber);text-shadow:0 0 14px rgba(255,179,71,.6)}
.tool-num{font-family:'Courier Prime',monospace;color:rgba(246,234,211,.25);font-size:.76rem;letter-spacing:.12em;transition:.2s}
.tool h3{font-family:'Fraunces',serif;font-weight:650;font-size:1.2rem;margin:42px 0 10px}
.tool p{color:var(--dim);font-size:.9rem}
.tool .soon{position:absolute;top:18px;right:18px;color:var(--coral);font-size:.62rem}

/* ---------- SPOTLIGHT ---------- */
.spot-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center}
.spot-visual{
  aspect-ratio:4/5;position:relative;overflow:hidden;border-radius:6px;
  background:
    radial-gradient(ellipse 100% 75% at 50% 100%, rgba(255,120,71,.4), transparent 62%),
    radial-gradient(ellipse 80% 50% at 50% -5%, rgba(255,179,71,.12), transparent 60%),
    linear-gradient(180deg,#2A2115,#191209);
  border:1px solid rgba(246,234,211,.15);
}
.spot-visual::before{
  content:"";position:absolute;left:50%;top:58%;width:180px;height:180px;transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,179,71,.9), rgba(255,120,71,.55) 55%, transparent 72%);
  filter:blur(6px);
}
.spot-visual::after{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(0deg,transparent 0 14px,rgba(23,16,7,.65) 14px 20px);
}
.spot-band{
  position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:2;
  text-align:center;font-family:'Fraunces',serif;font-weight:800;font-style:italic;
  font-size:clamp(3rem,7vw,5.2rem);letter-spacing:.01em;
  color:var(--cream);text-shadow:0 0 30px rgba(255,179,71,.55),0 4px 30px rgba(0,0,0,.5);
}
.spot-tag{position:absolute;top:20px;left:20px;color:var(--amber);z-index:2}
.spot-freq{position:absolute;bottom:18px;right:20px;color:var(--dim);z-index:2}
.spot-copy h3{font-family:'Fraunces',serif;font-weight:650;font-size:1.7rem;margin-bottom:16px}
.spot-copy p{color:var(--dim);margin-bottom:32px;max-width:46ch}
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--hairline)}
.stat{padding:20px 4px 0;border-left:1px solid var(--hairline);padding-left:18px}
.stat:first-child{border-left:none;padding-left:0}
.stat b{font-family:'Fraunces',serif;font-weight:700;font-size:1.8rem;display:block;color:var(--amber)}
.stat span{color:var(--dim);font-size:.8rem}

/* ---------- ERA TIMELINE ---------- */
.eras{display:flex;gap:2px;margin-top:44px;border:1px solid var(--hairline);border-radius:5px;overflow:hidden}
.era{flex:1;padding:16px 14px;background:var(--panel);transition:background .2s;position:relative}
.era:hover{background:#332A1E}
.era::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--era-c,var(--amber))}
.era .mono{color:var(--dim);display:block;margin-bottom:6px}
.era b{font-size:.83rem;font-weight:700;display:block;line-height:1.3}

/* ---------- WIRE (article lists) ---------- */
.wire-list{border-top:1px solid var(--hairline)}
.wire{
  display:grid;grid-template-columns:130px 1fr auto;gap:28px;align-items:baseline;
  padding:26px 0;border-bottom:1px solid var(--hairline);
  text-decoration:none;color:inherit;transition:padding-left .2s;
}
.wire:hover{padding-left:14px}
.wire:hover .wire-title{color:var(--amber)}
.wire .mono{color:var(--dim)}
.wire-title{font-family:'Fraunces',serif;font-weight:550;font-size:1.15rem;transition:color .2s}
.wire-dek{grid-column:2;color:var(--dim);font-size:.9rem;margin-top:4px}
.wire-cat{color:var(--coral)}
.wire-cat.rumor{color:#D98E5F}

/* ---------- ARTICLE PAGES ---------- */
article.post{padding:150px 0 90px}
.post-kicker{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.post h1{font-size:clamp(2.2rem,5vw,3.6rem);font-weight:600;line-height:1.1;margin-bottom:22px}
.post .dek{font-size:1.2rem;color:var(--dim);font-family:'Fraunces',serif;font-weight:400;font-style:italic;margin-bottom:28px;line-height:1.5}
.post-meta{display:flex;gap:22px;flex-wrap:wrap;color:var(--dim);padding:18px 0;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);margin-bottom:44px}
.post-body p{margin-bottom:1.4em;color:#E4D8BF}
.post-body p:first-of-type::first-letter{
  font-family:'Fraunces',serif;font-weight:700;font-style:italic;color:var(--amber);
  font-size:3.4em;float:left;line-height:.85;padding-right:10px;
}
.post-body h2{font-size:1.5rem;margin:1.8em 0 .7em;font-family:'Fraunces',serif;font-weight:650}
.post-body a{color:var(--amber);text-decoration:none;border-bottom:1px solid rgba(255,179,71,.4)}
.post-body a:hover{border-color:var(--amber)}
.post-body ul{margin:0 0 1.4em 1.2em;color:#E4D8BF}
.post-body li{margin-bottom:.5em}
.callout{
  background:var(--walnut);border-left:3px solid var(--amber);border-radius:0 6px 6px 0;
  padding:22px 26px;margin:2em 0;color:var(--dim);font-size:.95rem;
}
.callout .mono{color:var(--amber);display:block;margin-bottom:8px}
.rumor-meter{
  background:var(--walnut);border:1px solid var(--hairline);border-radius:6px;
  padding:24px 26px;margin:2em 0;
}
.rumor-meter .mono{color:var(--coral);display:block;margin-bottom:12px}
.meter-track{height:8px;background:var(--panel);border-radius:4px;overflow:hidden;margin-bottom:10px}
.meter-fill{height:100%;background:linear-gradient(90deg,var(--coral),var(--amber));border-radius:4px}
.rumor-meter p{color:var(--dim);font-size:.9rem;margin:0}
.sources{margin-top:56px;padding-top:28px;border-top:1px solid var(--hairline)}
.sources .mono{color:var(--amber);display:block;margin-bottom:14px}
.sources li{color:var(--dim);font-size:.88rem;margin-bottom:8px;list-style:none}
.tag-status{display:inline-block;padding:3px 10px;border-radius:3px;font-family:'Courier Prime',monospace;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;vertical-align:2px}
.tag-status.confirmed{background:rgba(255,179,71,.15);color:var(--amber);border:1px solid rgba(255,179,71,.4)}
.tag-status.reported{background:rgba(232,213,163,.1);color:var(--dial);border:1px solid rgba(232,213,163,.35)}
.tag-status.rumor{background:rgba(255,120,71,.12);color:var(--coral);border:1px solid rgba(255,120,71,.4)}

/* ---------- BAND PAGE ---------- */
.band-hero{
  position:relative;padding:170px 0 80px;
  background:
    radial-gradient(ellipse 90% 60% at 50% 115%, rgba(255,120,71,.18), transparent 62%),
    var(--espresso);
  border-bottom:1px solid var(--hairline);
}
.band-hero h1{font-style:italic;font-weight:750}
.band-facts{display:flex;gap:34px;flex-wrap:wrap;margin-top:26px;color:var(--dim)}
.band-facts span b{color:var(--cream);font-weight:700}
.status-card{
  background:var(--walnut);border:1px solid rgba(255,179,71,.35);border-radius:6px;
  padding:28px 30px;margin:0 0 60px;box-shadow:0 0 40px rgba(255,179,71,.06);
}
.status-card .mono{color:var(--coral);display:block;margin-bottom:10px}
.status-card p{color:var(--dim);margin:0}
.status-card p strong{color:var(--cream)}
.disco{width:100%;border-collapse:collapse;margin-top:10px}
.disco th{font-family:'Courier Prime',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);text-align:left;padding:12px 16px;border-bottom:1px solid var(--hairline)}
.disco td{padding:16px;border-bottom:1px solid var(--hairline);font-size:.95rem}
.disco td:first-child{font-family:'Fraunces',serif;font-weight:600}
.disco .yr{font-family:'Courier Prime',monospace;color:var(--amber)}
.member-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:10px}
.member{background:var(--walnut);border:1px solid var(--hairline);border-radius:6px;padding:24px}
.member b{font-family:'Fraunces',serif;font-weight:650;font-size:1.05rem;display:block}
.member span{color:var(--dim);font-size:.85rem}

/* ---------- CTA / FOOTER ---------- */
.cta{
  text-align:center;
  background:
    radial-gradient(ellipse 60% 85% at 50% 125%, rgba(255,179,71,.16), transparent 62%),
    var(--espresso);
}
.cta h2{font-size:clamp(2.3rem,5vw,4.1rem);margin-bottom:18px}
.cta p{color:var(--dim);max-width:46ch;margin:0 auto 40px}
footer{border-top:1px solid var(--hairline);padding:56px 0 40px;color:var(--dim);font-size:.87rem}
.foot-grid{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;margin-bottom:44px}
.foot-col a{display:block;color:var(--dim);text-decoration:none;margin-bottom:10px;transition:color .2s}
.foot-col a:hover{color:var(--cream)}
.foot-col .mono{color:var(--amber);display:block;margin-bottom:16px}
.foot-base{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--hairline);padding-top:24px}

/* ---------- RESPONSIVE / MOTION ---------- */
@media(max-width:900px){
  .spot-grid{grid-template-columns:1fr;gap:40px}
  .tools-grid{grid-template-columns:repeat(2,1fr)}
  .member-grid{grid-template-columns:repeat(2,1fr)}
  .eras{flex-wrap:wrap}
  .era{flex:1 1 45%}
  .nav-links a:not(.btn){display:none}
  .needle::after{display:none}
}
@media(max-width:560px){
  .tools-grid,.member-grid{grid-template-columns:1fr}
  .wire{grid-template-columns:1fr;gap:6px}
  .wire-dek{grid-column:1}
  .wrap,.wrap-narrow{padding:0 20px}
  .nav-inner{padding:0 20px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* ---------- A11Y & FORMS (v1.2) ---------- */
.skip-link{position:absolute;left:-9999px;top:0;z-index:300;background:var(--amber);color:var(--espresso);padding:10px 18px;font-weight:700;border-radius:0 0 6px 0;text-decoration:none}
.skip-link:focus{left:0}
.join-form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;max-width:480px;margin:0 auto}
.join-form input[type="email"]{
  flex:1;min-width:240px;background:var(--walnut);border:1px solid rgba(246,234,211,.3);
  border-radius:3px;padding:12px 16px;color:var(--cream);font-family:'Karla',sans-serif;font-size:.95rem;
}
.join-form input[type="email"]::placeholder{color:var(--dim)}
.join-form input[type="email"]:focus{outline:2px solid var(--amber);outline-offset:2px;border-color:var(--amber)}