/*
Theme Name: Omsen Musik
Theme URI: https://omsen-musik.de
Author: omsen.musik
Description: Dark-industrial Coming-Soon-Theme für omsen.musik – Techno / Electronic.
Version: 1.0
Requires at least: 5.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: omsen-musik
*/

:root{
  --bg:#0a0a0a;
  --bg-panel:#131313;
  --line:#2a2a2a;
  --text:#e9e7e1;
  --text-dim:#7a7a76;
  --accent:#e8a33d;
  --accent-dim:#5c451f;
}
*{margin:0;padding:0;box-sizing:border-box;}
html,body{height:100%;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Space Grotesk',sans-serif;
  overflow-x:hidden;
  position:relative;
}

/* rust-texture backdrop, darkened so type stays legible */
.bg{
  position:fixed; inset:0; z-index:0;
  background-image:
    linear-gradient(180deg, rgba(6,5,3,.86) 0%, rgba(6,5,3,.72) 45%, rgba(6,5,3,.9) 100%),
    url('assets/bg-texture.jpg');
  background-size:cover;
  background-position:center;
  filter:saturate(1.05);
}
.bg::after{
  content:"";
  position:absolute; inset:0;
  background:radial-gradient(ellipse at center, transparent 35%, rgba(0,0,0,.55) 100%);
}

.hairline{
  position:fixed; left:0; right:0; height:1px; z-index:5;
  background:linear-gradient(90deg, transparent, var(--accent-dim) 20%, var(--accent) 50%, var(--accent-dim) 80%, transparent);
  opacity:.6;
}
.hairline.top{top:0;} .hairline.bottom{bottom:0;}

main{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:40px 24px;
  text-align:center;
  position:relative;
  z-index:2;
}

.eyebrow{
  font-family:'JetBrains Mono',monospace;
  font-size:11px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--text-dim);
  margin-bottom:22px;
}
.eyebrow .dot{
  display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--accent); margin-right:8px;
  animation:pulse 1.6s ease-in-out infinite;
  vertical-align:middle;
}
@keyframes pulse{
  0%,100%{opacity:1; box-shadow:0 0 0 0 rgba(232,163,61,.5);}
  50%{opacity:.4; box-shadow:0 0 0 6px rgba(232,163,61,0);}
}

h1{
  font-size:clamp(3rem, 12vw, 7.5rem);
  font-weight:700;
  letter-spacing:-.02em;
  line-height:.9;
  text-transform:lowercase;
  position:relative;
  display:inline-block;
}
h1 .dim{ color:var(--text-dim); font-weight:400; }
h1 .cursor{
  display:inline-block; width:.09em; margin-left:.05em;
  background:var(--accent); height:.8em; transform:translateY(.05em);
  animation:blink 1.1s step-end infinite;
}
@keyframes blink{0%,49%{opacity:1;}50%,100%{opacity:0;}}

.tagline{
  margin-top:20px;
  font-family:'JetBrains Mono',monospace;
  font-size:13px;
  color:var(--text-dim);
  letter-spacing:.04em;
}

/* eq bars — signature element, ambient motion */
.eq{
  display:flex; align-items:flex-end; gap:5px;
  height:34px; margin:34px 0 4px;
}
.eq span{
  width:4px; background:var(--accent); border-radius:1px;
  animation:eq 1.2s ease-in-out infinite;
  opacity:.85;
}
.eq span:nth-child(1){height:40%; animation-delay:-1.1s;}
.eq span:nth-child(2){height:80%; animation-delay:-.7s;}
.eq span:nth-child(3){height:55%; animation-delay:-.3s;}
.eq span:nth-child(4){height:95%; animation-delay:-.9s;}
.eq span:nth-child(5){height:30%; animation-delay:-.15s;}
.eq span:nth-child(6){height:65%; animation-delay:-.5s;}
@keyframes eq{
  0%,100%{transform:scaleY(.35);}
  50%{transform:scaleY(1);}
}
@media (prefers-reduced-motion: reduce){
  .eq span, .eyebrow .dot, h1 .cursor{animation:none;}
}

.links{
  display:flex; gap:14px; margin-top:38px;
  font-family:'JetBrains Mono',monospace;
}
.links a{
  color:var(--text);
  text-decoration:none;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:12px 22px;
  border:1px solid var(--line);
  transition:border-color .2s ease, color .2s ease;
}
.links a:hover, .links a:focus-visible{
  border-color:var(--accent);
  color:var(--accent);
  outline:none;
}

footer{
  position:relative;
  text-align:center;
  font-family:'JetBrains Mono',monospace;
  font-size:10px;
  letter-spacing:.1em;
  color:var(--text-dim);
  z-index:2;
  padding:28px 0 36px;
}

/* references — past flyers */
.refs{
  position:relative; z-index:2;
  padding:10px 24px 20px;
  max-width:920px;
  margin:0 auto;
}
.refs-head{
  display:flex; align-items:center; gap:14px;
  margin-bottom:22px;
}
.refs-head .num{
  font-family:'JetBrains Mono',monospace;
  font-size:11px; color:var(--accent); letter-spacing:.1em;
}
.refs-head .rule{ flex:1; height:1px; background:var(--line); }
.refs-head h2{
  font-family:'JetBrains Mono',monospace;
  font-size:12px; letter-spacing:.28em; text-transform:uppercase;
  color:var(--text-dim); font-weight:400;
}
.refs-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px,1fr));
  gap:14px;
}
.refs-grid figure{
  margin:0; border:1px solid var(--line); background:var(--bg-panel);
  overflow:hidden; position:relative;
}
.refs-grid img{
  display:block; width:100%; height:180px; object-fit:cover;
  filter:grayscale(1) contrast(1.05);
  transition:filter .35s ease, transform .35s ease;
}
.refs-grid figure:hover img{
  filter:grayscale(0) contrast(1.05);
  transform:scale(1.03);
}
.refs-grid figcaption{
  font-family:'JetBrains Mono',monospace;
  font-size:10px; letter-spacing:.06em; color:var(--text-dim);
  padding:9px 10px; border-top:1px solid var(--line);
}
.refs-grid figcaption b{ color:var(--text); font-weight:500; }