/*
Theme Name: Sanitiz€r Artist
Theme URI: https://sanitizer.freethinkers-inc.de/
Author: Freethinkers-Inc.
Description: Independent industrial acid-green artist theme with Spotify release wall, SoundCloud media, and upcoming release countdown.
Version: 0.1.3
Requires PHP: 7.4
Text Domain: sanitizer-artist
*/
:root{color-scheme:dark;--bg:#090b17;--text:#f3f2ff;--muted:#b6b2cb;--accent:#9c72ec}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse at 75% 5%,#281b48 0,transparent 40%),radial-gradient(ellipse at 10% 65%,#102a40 0,transparent 50%),var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,sans-serif;min-height:100vh}a{color:inherit}.site-header{position:relative;z-index:10;padding:22px clamp(18px,4vw,70px);display:flex;align-items:center;justify-content:space-between;gap:30px;background:#090b17d9;border-bottom:1px solid #ffffff16;min-height:104px}.site-brand{display:flex;align-items:center;gap:14px;min-width:0;animation:brand-arrive 1.35s cubic-bezier(.2,.75,.2,1) both}.site-brand img{max-width:min(360px,48vw);max-height:78px;width:auto;height:auto;object-fit:contain}.brand-text{font-weight:850;letter-spacing:.12em;font-size:clamp(1.05rem,2vw,1.65rem);text-decoration:none}.site-nav{display:flex;flex-wrap:wrap;gap:clamp(12px,2vw,28px)}.site-nav a{text-decoration:none;color:#d4cde8;font-size:.94rem;font-weight:600}.site-nav a:hover,.site-nav a[aria-current=page]{color:#b7f0ff}.site-main{max-width:1540px;margin:0 auto;padding:clamp(30px,5vw,80px) clamp(18px,4vw,70px);min-height:calc(100vh - 170px)}.eyebrow{color:#b9a1f3;text-transform:uppercase;letter-spacing:.24em;font-size:.77rem;font-weight:700}.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,490px);gap:clamp(30px,6vw,100px);align-items:center;min-height:65vh}.hero h1{font-size:clamp(2.7rem,6vw,6rem);line-height:1.05;letter-spacing:-.055em;margin:15px 0 22px}.hero p{max-width:550px;color:var(--muted);font-size:1.13rem;line-height:1.75}.hero-cover{position:relative;display:block;border-radius:23px;box-shadow:0 30px 90px #0009,0 0 65px #7b5ed044;transform:perspective(900px) rotateY(-7deg);transition:transform .4s}.hero-cover:hover{transform:perspective(900px) rotateY(0deg) translateY(-6px)}.hero-cover img{width:100%;aspect-ratio:1;object-fit:cover;display:block;border-radius:23px}.hero-cover .cover-fallback{aspect-ratio:1;display:grid;place-items:center;background:linear-gradient(135deg,#39215e,#112c48);border-radius:23px;font-size:2rem}.cta{display:inline-block;margin-top:22px;padding:14px 23px;background:linear-gradient(110deg,#8054c9,#3a96b3);border-radius:11px;text-decoration:none;font-weight:700}.cta:hover{filter:brightness(1.15)}.intro-fade{animation:reveal-up 1s 1.25s both}.page-heading{margin-bottom:34px}.page-heading h1{font-size:clamp(2.3rem,5vw,4.6rem);margin:8px 0}.page-heading p{color:var(--muted)}.music-stage{perspective:1400px;overflow:visible;padding:12px 0 80px}.music-stage .ft-rm-wall,.music-stage .ft-rm-grid{max-width:none;width:100%;margin:0 auto;transform:rotateX(2deg) rotateY(-2deg);transform-style:preserve-3d}.music-stage .ft-rm-card{box-shadow:0 18px 36px #0007;transition:transform .35s,box-shadow .35s}.music-stage .ft-rm-card:hover{transform:translateZ(45px) scale(1.035);box-shadow:0 22px 60px #a37aff55}.about-layout{display:grid;grid-template-columns:minmax(230px,380px) minmax(0,1fr);gap:clamp(25px,5vw,80px);align-items:start}.artist-photo{width:100%;border-radius:20px;box-shadow:0 20px 70px #0007}.artist-photo-placeholder{aspect-ratio:4/5;background:linear-gradient(145deg,#362354,#112e43);border:1px solid #ffffff22;border-radius:20px;display:grid;place-items:center;color:#d7c8ed;padding:25px;text-align:center}.bio p{line-height:1.85;color:#d3cfe1;font-size:1.05rem}.panel{border:1px solid #ffffff22;background:#ffffff09;border-radius:18px;padding:32px;max-width:800px}.panel p{line-height:1.7;color:var(--muted)}.site-footer{border-top:1px solid #ffffff19;padding:25px 5vw;text-align:center;color:#aba6c1;font-size:.85rem}@keyframes brand-arrive{from{opacity:0;transform:translateX(min(70vw,750px))}to{opacity:1;transform:translateX(0)}}@keyframes reveal-up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media(max-width:850px){.site-header{flex-direction:column;align-items:flex-start}.hero{grid-template-columns:1fr;min-height:0}.hero-cover{max-width:450px}.about-layout{grid-template-columns:1fr}.artist-photo{max-width:380px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Original logo: show the full planet and rings without cropping. */
.site-header{min-height:130px}.site-brand img{max-width:min(440px,52vw);max-height:116px;object-fit:contain}.brand-logo{display:inline-flex;align-items:center}@media(max-width:850px){.site-brand img{max-width:min(440px,90vw);max-height:120px}}

.artist-photo{object-fit:cover;object-position:center top}
.contact-socials{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-top:22px}
.contact-social{display:flex;align-items:center;gap:12px;padding:14px 16px;background:#ffffff0c;border:1px solid #ffffff24;border-radius:13px;text-decoration:none;transition:transform .2s,border-color .2s}
.contact-social:hover{transform:translateY(-3px);border-color:#ad7bff}
.contact-social img{width:25px;height:25px;object-fit:contain}

.contact-social img{filter:invert(1)}

/* Configurable upcoming release, independent of the Spotify sync. */
.upcoming-section{margin:0 0 clamp(35px,5vw,75px)}
.upcoming-section h2{font-size:clamp(1.9rem,3.3vw,3rem);margin:10px 0 25px}
.upcoming-card{display:grid;grid-template-columns:minmax(220px,330px) minmax(0,1fr);gap:clamp(24px,5vw,65px);align-items:center;border:1px solid #ffffff1c;border-radius:25px;padding:clamp(18px,3vw,32px);background:linear-gradient(115deg,#231337a6,#101e30a3);box-shadow:0 15px 60px #0005}
.upcoming-art{position:relative;aspect-ratio:1;overflow:hidden;border-radius:18px;isolation:isolate;box-shadow:0 12px 45px #0008;outline-offset:4px}
.upcoming-art>img{display:block;width:100%;height:100%;object-fit:cover}
.upcoming-placeholder{display:grid;place-items:center;height:100%;background:radial-gradient(circle at 50% 30%,#6632a2,#0c172c 75%);font-size:1.5rem}
.upcoming-overlay{position:absolute;inset:0;background:#090918df;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:14px;padding:18px;opacity:0;transition:opacity .25s}
.upcoming-art:hover .upcoming-overlay,.upcoming-art:focus .upcoming-overlay,.upcoming-art:focus-within .upcoming-overlay{opacity:1}
.upcoming-overlay strong{font-size:clamp(1rem,2vw,1.4rem)}
.upcoming-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%}
.upcoming-links a{border:1px solid #b995ff;border-radius:9px;padding:9px 6px;background:#6741a3d9;text-decoration:none;font-size:.86rem}
.upcoming-links a:hover,.upcoming-links a:focus-visible{background:#357b9c}
.upcoming-pending{color:#bcb3d0;font-size:.9rem}
.upcoming-copy h3{font-size:clamp(2rem,4vw,3.6rem);margin:12px 0}
.upcoming-copy p{color:var(--muted);line-height:1.7;max-width:480px}
@media(max-width:700px){.upcoming-card{grid-template-columns:1fr}.upcoming-art{max-width:380px;width:100%}}
@media(hover:none){.upcoming-overlay{opacity:1;justify-content:flex-end;background:linear-gradient(transparent 10%,#090918f5 100%);padding:12px}.upcoming-links a{padding:7px 4px}}
@media(prefers-reduced-motion:reduce){.upcoming-overlay{transition:none}}

/* Atmospheric photographic-style cosmic header. */
.site-header{isolation:isolate;overflow:hidden;min-height:145px;background:#070713 url("assets/cosmic-header.jpg") center 48%/cover no-repeat;border-bottom:1px solid rgba(146,117,201,.22)}
.site-header::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(3,4,13,.12),rgba(3,4,13,.4) 60%,rgba(3,4,13,.56));z-index:0}
.site-header::after{content:none}
.site-brand,.site-nav{position:relative;z-index:1}
.site-brand{animation:brand-arrive 1.65s cubic-bezier(.16,1,.3,1) both}
@keyframes brand-arrive{0%{opacity:0;transform:translate3d(95vw,0,0) scale(.88);filter:blur(5px)}70%{opacity:1;filter:blur(0)}100%{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}}
/* Logo entrance on every page load, including Ctrl+F5. Explicitly override
   the base reduced-motion rule and avoid competing selectors. */
html .site-brand{animation:brand-arrive 1.65s cubic-bezier(.16,1,.3,1) both!important}
@media(prefers-reduced-motion:reduce){
  html .site-brand{animation:brand-arrive 1.65s cubic-bezier(.16,1,.3,1) both!important}
}
html.hed-force-intro .site-brand{animation:brand-arrive 1.65s cubic-bezier(.16,1,.3,1) both!important}


/* v0.1.8: genuinely animated deep-space header, layered independently
   behind the navigation and the existing working logo entrance. */
.site-header{
  background:#070611 url("assets/cosmic-header.jpg") center center / cover no-repeat;
  isolation:isolate;
}
.site-header::before{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  inset:-65% -20%;
  background:
    radial-gradient(ellipse 30% 36% at 22% 42%,rgba(102,36,185,.46),transparent 78%),
    radial-gradient(ellipse 31% 38% at 73% 56%,rgba(20,113,174,.32),transparent 79%),
    radial-gradient(ellipse 26% 36% at 53% 24%,rgba(159,38,173,.24),transparent 82%);
  filter:blur(21px);
  opacity:.72;
  animation:hed-nebula-drift 18s ease-in-out infinite alternate!important;
  will-change:transform,opacity;
}
.site-header::after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  inset:-30% -10%;
  background-image:url("assets/stars-near.svg"),url("assets/stars-far.svg");
  background-size:1100px 260px,1600px 380px;
  background-repeat:repeat;
  opacity:.66;
  animation:hed-stars-drift 36s linear infinite,hed-stars-glow 5.8s ease-in-out infinite alternate!important;
  will-change:transform,opacity;
}
.site-header .site-brand,.site-header .site-nav{position:relative;z-index:2}
@keyframes hed-nebula-drift{
  0%{transform:translate3d(-5%,1%,0) scale(1);opacity:.5}
  50%{opacity:.83}
  100%{transform:translate3d(7%,-4%,0) scale(1.09);opacity:.65}
}
@keyframes hed-stars-drift{
  from{transform:translate3d(-2%,0,0)}
  to{transform:translate3d(4%,-3%,0)}
}
@keyframes hed-stars-glow{
  from{opacity:.35}to{opacity:.82}
}
/* Home content enters after the logo; independent of browser motion settings. */
body.home .intro-fade,body.front-page .intro-fade,body.page-template-default .hero .intro-fade,
body .upcoming-section.intro-fade,body .hero .intro-fade{
  animation:hed-home-enter 1.15s cubic-bezier(.2,.75,.2,1) 1.55s both!important;
}
body .hero > .intro-fade:last-child{animation-delay:1.85s!important}
@keyframes hed-home-enter{
  0%{opacity:0;transform:translate3d(0,48px,0) scale(.965);filter:blur(6px)}
  65%{filter:blur(0)}
  100%{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}
}
@media(max-width:850px){.site-header::before{filter:blur(16px)}}

/* v0.1.9 — visibly animated cosmic atmosphere, without changing logo/home animations. */
.site-header{position:relative;isolation:isolate;overflow:hidden}
/* Preserve the photographic background, but let the two colorful clouds travel visibly. */
.site-header::before{
  inset:-90% -28%;
  background:
    radial-gradient(ellipse 28% 44% at 25% 46%,rgba(145,34,230,.65),transparent 76%),
    radial-gradient(ellipse 30% 45% at 72% 52%,rgba(14,149,218,.53),transparent 76%);
  filter:blur(15px);mix-blend-mode:screen;
  animation:hed-nebula-visible 12s ease-in-out infinite alternate!important;
}
.site-header::after{content:none!important}
.site-header .hed-cosmos{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.site-header .hed-cosmos__cyan{position:absolute;inset:-90% -30%;background:radial-gradient(ellipse 31% 38% at 65% 50%,rgba(28,121,210,.35),transparent 78%);filter:blur(16px);mix-blend-mode:screen;animation:hed-cyan-flow 16s ease-in-out infinite alternate!important}
.site-header .hed-cosmos__stars{position:absolute;inset:-45% -15%;background-repeat:repeat;pointer-events:none}
.site-header .hed-cosmos__stars--far{background-image:url("assets/stars-far.svg");background-size:1600px 380px;opacity:.48;animation:hed-far-travel 35s linear infinite!important}
.site-header .hed-cosmos__stars--near{background-image:url("assets/stars-near.svg");background-size:1100px 260px;opacity:.8;animation:hed-near-travel 20s linear infinite!important}
.site-header .hed-cosmos__twinkle{position:absolute;inset:0;background-image:radial-gradient(1.5px 1.5px at 8% 23%,#fff 85%,transparent),radial-gradient(2px 2px at 28% 65%,#b6dfff 75%,transparent),radial-gradient(1.4px 1.4px at 47% 17%,#e2b8ff 80%,transparent),radial-gradient(2px 2px at 69% 42%,#fff 80%,transparent),radial-gradient(1.4px 1.4px at 87% 76%,#b6dfff 80%,transparent);opacity:.25;animation:hed-twinkle 3.2s ease-in-out infinite alternate!important}
.site-header .hed-cosmos__twinkle--offset{transform:scaleX(-1);animation:hed-twinkle 2.3s ease-in-out -1.6s infinite alternate!important}
.site-header .site-brand,.site-header .site-nav{z-index:2}
.site-header .site-brand::before{content:"";position:absolute;inset:10% -8%;z-index:-1;pointer-events:none;border-radius:50%;background:radial-gradient(ellipse,rgba(115,35,210,.3),transparent 65%);filter:blur(11px);animation:hed-logo-halo 5s ease-in-out infinite alternate!important}
@keyframes hed-nebula-visible{0%{transform:translate3d(-12%,2%,0) scale(.93);opacity:.58}100%{transform:translate3d(13%,-3%,0) scale(1.15);opacity:1}}
@keyframes hed-cyan-flow{0%{transform:translate3d(13%,-3%,0) scale(1.1);opacity:.38}100%{transform:translate3d(-14%,4%,0) scale(.92);opacity:.85}}
@keyframes hed-near-travel{from{transform:translate3d(-6%,2%,0)}to{transform:translate3d(7%,-3%,0)}}
@keyframes hed-far-travel{from{transform:translate3d(3%,-1%,0)}to{transform:translate3d(-4%,2%,0)}}
@keyframes hed-twinkle{from{opacity:.12;filter:brightness(.65)}to{opacity:.95;filter:brightness(1.65)}}
@keyframes hed-logo-halo{from{opacity:.3;transform:scale(.95)}to{opacity:.9;transform:scale(1.12)}}


/* v0.1.11 — responsive 3D SoundCloud DJ Mix Wall */
.hed-media-stage{perspective:1400px;padding:14px 0 70px}
.hed-media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:clamp(18px,2.6vw,36px);transform:rotateX(2deg) rotateY(-2deg);transform-style:preserve-3d}
.hed-media-card{min-width:0;display:block;overflow:hidden;border:1px solid #ffffff26;border-radius:19px;background:linear-gradient(145deg,#271a40,#111b2e);text-decoration:none;box-shadow:0 18px 36px #0008;transition:transform .35s,box-shadow .35s,border-color .35s;transform-style:preserve-3d}
.hed-media-card:hover,.hed-media-card:focus-visible{transform:translateZ(45px) translateY(-6px) scale(1.025);box-shadow:0 22px 60px #a37aff55;border-color:#bca3ff99;outline:none}
.hed-media-cover{position:relative;aspect-ratio:1;overflow:hidden;background:radial-gradient(circle at 50% 35%,#6d3ba1,#142438 78%)}
.hed-media-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s}
.hed-media-card:hover .hed-media-cover img{transform:scale(1.06)}
.hed-media-fallback{height:100%;display:grid;place-items:center;font-size:5rem;color:#d7b8ff}
.hed-media-play{position:absolute;inset:0;display:grid;place-items:center;font-size:2.2rem;color:white;background:#090b1766;opacity:0;transition:opacity .3s}
.hed-media-card:hover .hed-media-play,.hed-media-card:focus-visible .hed-media-play{opacity:1}
.hed-media-info{padding:17px 19px 20px;display:flex;flex-direction:column;gap:9px}
.hed-media-info strong{font-size:1.02rem;line-height:1.45;overflow-wrap:anywhere}
.hed-media-info span{font-size:.82rem;color:#bba4f4}
.hed-media-message{color:var(--muted);padding:20px 0}
@media(max-width:700px){.hed-media-grid{transform:none;grid-template-columns:repeat(auto-fill,minmax(min(100%,165px),1fr));gap:15px}.hed-media-info{padding:12px}.hed-media-card:hover{transform:translateY(-4px)}}
@media(hover:none){.hed-media-play{opacity:1;inset:auto 10px 10px auto;width:42px;height:42px;border-radius:50%;background:#090b17a9;font-size:1.1rem}}
@media(prefers-reduced-motion:reduce){.hed-media-card,.hed-media-cover img,.hed-media-play{transition:none}}

/* Latest Release: streaming overlay, matching the 3D release wall. */
.hero-release-art{overflow:hidden;isolation:isolate;outline-offset:5px}
.hero-release-art>img{border-radius:inherit}
.hero-release-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;padding:clamp(16px,4vw,35px);text-align:center;background:#090918e8;opacity:0;visibility:hidden;transition:opacity .28s,visibility .28s;border-radius:inherit}
.hero-release-overlay>strong{font-size:clamp(1.15rem,2.2vw,1.75rem);line-height:1.3}
.hero-release-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%}
.hero-release-links a{min-width:0;padding:12px 8px;border:1px solid #b995ff;border-radius:10px;background:#6741a3e6;text-decoration:none;font-weight:650;font-size:clamp(.78rem,1.3vw,.96rem);transition:background .2s}
.hero-release-links a:hover,.hero-release-links a:focus-visible{background:#357b9c}
.hero-release-art:hover .hero-release-overlay,.hero-release-art:focus .hero-release-overlay,.hero-release-art:focus-within .hero-release-overlay{opacity:1;visibility:visible}
@media(hover:none){.hero-release-overlay{opacity:1;visibility:visible;justify-content:flex-end;background:linear-gradient(transparent 10%,#090918f5 100%);gap:10px;padding:15px}.hero-release-overlay>strong{font-size:1rem}.hero-release-links{gap:7px}.hero-release-links a{padding:9px 5px}}
@media(prefers-reduced-motion:reduce){.hero-release-overlay{transition:none}}

/* Homo Et Deus — independent visual identity */
:root{--bg:#070713;--text:#fff5e9;--muted:#c2b8d2;--accent:#e9bd75}
html{background:#070713}
body{background:radial-gradient(ellipse at 50% 5%,#292047 0%,transparent 42%),radial-gradient(ellipse at 85% 75%,#181c3a 0%,transparent 55%),#070713;color:var(--text)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 50% 40%,#b67d3210,transparent 65%)}
#hed-cosmos-canvas{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.78}
.site-header,.site-main,.site-footer{position:relative;z-index:1}
.site-header{background:#080915e8;border-bottom:1px solid #e4b96b3d;min-height:120px;backdrop-filter:blur(14px)}
.site-header::before{background:radial-gradient(ellipse 42% 60% at 55% 50%,#bb894b3b,transparent 80%);animation:hed-nebula-visible 18s ease-in-out infinite alternate!important}
.site-header .hed-cosmos__cyan{background:radial-gradient(ellipse 34% 50% at 65% 50%,#5c479d48,transparent 80%)}
.site-header .hed-cosmos__stars--far,.site-header .hed-cosmos__stars--near{opacity:.27}
.site-brand img{max-width:min(370px,50vw);max-height:100px}
.site-nav a{color:#e4d8ca;letter-spacing:.055em}
.site-nav a:hover,.site-nav a[aria-current=page]{color:#f5c67d}
.site-main{max-width:1540px;padding-top:clamp(20px,3vw,45px)}
.eyebrow{color:#eac18c}
.cta{background:linear-gradient(110deg,#a87939,#d9b67b);color:#10101c;box-shadow:0 6px 32px #c59c5040}
.hero h1{letter-spacing:-.035em}
.hero-cover{box-shadow:0 30px 90px #0009,0 0 65px #c6a15c30}
.music-stage .ft-rm-card:hover,.hed-media-card:hover,.hed-media-card:focus-visible{box-shadow:0 22px 60px #e9b66e55;border-color:#e9b66e99}
.hed-media-card{background:linear-gradient(145deg,#282039,#101627);border-color:#cba56e45}
.hed-media-info span{color:#e6bb82}
.hed-media-cover{background:radial-gradient(circle,#58457b,#13182d 78%)}
.hero-release-links a,.upcoming-links a{background:#74502ccf;border-color:#dfb879}
.hero-release-links a:hover,.upcoming-links a:hover{background:#a67b42}
.upcoming-card{background:linear-gradient(115deg,#29203aab,#101627b8);border-color:#cba56e35}
.hed-hero-banner{width:100%;border-radius:22px;overflow:hidden;position:relative;margin:0 0 clamp(35px,5vw,75px);border:1px solid #d5ad7140;box-shadow:0 25px 90px #0008,0 0 70px #c28e3224}
.hed-hero-banner img{display:block;width:100%;height:auto;object-fit:cover}
.hed-hero-banner::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 20%,#f3c87a0b 50%,transparent 80%);animation:hed-banner-shimmer 12s ease-in-out infinite alternate}
@keyframes hed-banner-shimmer{from{opacity:.1;transform:translateX(-12%)}to{opacity:.7;transform:translateX(12%)}}
.contact-social:hover{border-color:#eac18c}
@media(max-width:700px){.hed-hero-banner{border-radius:12px}.site-brand img{max-width:min(350px,88vw)}}
@media(prefers-reduced-motion:reduce){.hed-hero-banner::after,.site-header::before,.site-header .hed-cosmos__cyan,.site-header .hed-cosmos__stars,.site-header .hed-cosmos__twinkle,html .site-brand{animation:none!important}}

/* v0.1.1 — compact cinematic header, releases first, original hero last. */
.site-header{min-height:210px;background:#080715 url("assets/cosmic-header.jpg") center 50%/cover no-repeat!important;align-items:flex-start;padding-top:26px}
.site-header::before{background:linear-gradient(90deg,rgba(5,5,15,.46),rgba(5,5,15,.12) 45%,rgba(5,5,15,.53))!important;inset:0!important;filter:none!important;animation:none!important;opacity:1!important;transform:none!important}
.site-header .hed-cosmos__cyan{background:radial-gradient(ellipse 40% 60% at 65% 50%,rgba(186,101,229,.23),transparent 80%);animation:hed-cyan-flow 24s ease-in-out infinite alternate!important}
.site-main{padding-top:clamp(22px,3vw,44px)}
body.home .hero{min-height:0;gap:clamp(24px,5vw,75px);margin:0 0 clamp(36px,5vw,72px);padding:clamp(20px,3vw,40px);border:1px solid #cba56e30;border-radius:23px;background:linear-gradient(110deg,#20182e85,#101625a0)}
body.home .hero h1{font-size:clamp(2.2rem,4.5vw,4.7rem)}
body.home .hero-cover{max-width:340px;margin-left:auto}
body.home .hero-cover img{aspect-ratio:1}
body.home .hed-hero-banner{margin:0 0 12px}
body.home .upcoming-section{margin-bottom:clamp(24px,4vw,52px)}
@media(max-width:850px){.site-header{min-height:185px;gap:10px}.site-nav{gap:14px}body.home .hero-cover{margin:0 auto}}
@media(max-width:500px){.site-header{min-height:175px;padding-top:14px}.site-header .site-brand img{max-height:65px}.site-nav a{font-size:.85rem}body.home .hero{padding:18px}}
@media(prefers-reduced-motion:reduce){.site-header .hed-cosmos__cyan{animation:none!important}}

/* v0.1.2: preview-derived cosmic art, visibly moving background */
.site-header{background:#090617!important;min-height:210px;overflow:hidden;isolation:isolate}
.site-header::before{content:""!important;position:absolute!important;inset:-30%!important;z-index:-1!important;background:url("assets/cosmic-header.jpg") center/cover no-repeat!important;opacity:1!important;filter:none!important;transform-origin:center!important;animation:hed-cinematic-pan 12s ease-in-out infinite alternate!important;will-change:transform}
.site-header::after{content:""!important;position:absolute!important;inset:0!important;z-index:0!important;background:linear-gradient(90deg,#04030e75,transparent 38%,#04030e66)!important;pointer-events:none}
.site-header .hed-cosmos{z-index:1}.site-header .site-brand,.site-header .site-nav{z-index:3}
.site-header .hed-cosmos__stars--near{opacity:.72!important;animation:hed-stars-near-v12 9s linear infinite!important}
.site-header .hed-cosmos__stars--far{opacity:.45!important;animation:hed-stars-far-v12 17s linear infinite!important}
@keyframes hed-cinematic-pan{from{transform:translate3d(-4%,0,0) scale(1.02)}to{transform:translate3d(4%,-2%,0) scale(1.16)}}
@keyframes hed-stars-near-v12{from{transform:translate3d(-3%,0,0)}to{transform:translate3d(3%,2%,0)}}
@keyframes hed-stars-far-v12{from{transform:translate3d(2%,0,0)}to{transform:translate3d(-2%,1%,0)}}
@media(prefers-reduced-motion:reduce){.site-header::before,.site-header .hed-cosmos__stars--near,.site-header .hed-cosmos__stars--far{animation:none!important}}

/* v0.1.3: approved preview banner, ONE gentle horizontal movement only. */
.site-header {position:relative!important;min-height:210px!important;overflow:hidden!important;background:#0b0818!important;isolation:isolate!important}
.site-header::before {content:""!important;display:block!important;position:absolute!important;inset:-4% -5%!important;z-index:0!important;background-image:url("assets/cosmic-header.jpg")!important;background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important;opacity:1!important;filter:none!important;transform:translate3d(-1.2%,0,0)!important;animation:hed-banner-sway 22s ease-in-out infinite alternate!important;will-change:transform}
.site-header::after {content:none!important;display:none!important}
.site-header .hed-cosmos {display:none!important}
.site-header .site-brand,.site-header .site-nav {position:relative!important;z-index:2!important}
.site-header .site-brand::before {display:none!important}
@keyframes hed-banner-sway {from{transform:translate3d(-1.2%,0,0)}to{transform:translate3d(1.2%,0,0)}}
@media(prefers-reduced-motion:reduce){.site-header::before{animation:none!important}}
@media(max-width:850px){.site-header{min-height:185px!important}}

/* v0.1.4 — newly generated, complete panoramic banner; gentle horizontal sway only. */
.site-header{background:#080617!important;overflow:hidden!important;isolation:isolate!important}
.site-header::before{
  content:""!important;display:block!important;position:absolute!important;
  inset:0 -3%!important;z-index:0!important;
  background-image:url("assets/cosmic-header.jpg")!important;
  background-position:center center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  opacity:1!important;filter:none!important;
  transform:translate3d(-1%,0,0);
  animation:hed-banner-sway-014 24s ease-in-out infinite alternate!important;
  will-change:transform;
}
.site-header::after{display:none!important;content:none!important}
.site-header .hed-cosmos{display:none!important}
.site-header .site-brand,.site-header .site-nav{position:relative!important;z-index:2!important}
@keyframes hed-banner-sway-014{
  0%{transform:translate3d(-1%,0,0)}
  100%{transform:translate3d(1%,0,0)}
}
@media(prefers-reduced-motion:reduce){.site-header::before{animation:none!important;transform:none!important}}

/* v0.1.5 — larger brand logo, without altering the cosmic banner or its motion. */
.site-header .site-brand img {
  width:auto!important;
  max-width:min(555px,60vw)!important;
  max-height:145px!important;
  height:auto!important;
  object-fit:contain!important;
  filter:drop-shadow(0 3px 12px rgba(5,3,18,.82))!important;
}
@media(max-width:850px){
  .site-header .site-brand img{max-width:min(440px,57vw)!important;max-height:120px!important}
}
@media(max-width:500px){
  .site-header .site-brand img{max-width:min(300px,76vw)!important;max-height:90px!important}
}


/* v0.1.6: Localized, feathered contrast zones. The panorama remains untouched. */
.site-header .site-brand,
.site-header .site-nav {
  isolation:isolate!important;
}
.site-header .site-brand::before,
.site-header .site-nav::before {
  content:""!important;
  display:block!important;
  position:absolute!important;
  pointer-events:none!important;
  z-index:-1!important;
  border-radius:50%!important;
  animation:none!important;
  transform:none!important;
  /* Match the deep indigo/violet already present in the cosmic photograph. */
  background:radial-gradient(ellipse at center,
    rgba(12,8,34,.86) 0%,
    rgba(20,11,47,.76) 32%,
    rgba(27,13,54,.40) 57%,
    rgba(27,13,54,0) 78%)!important;
  -webkit-backdrop-filter:blur(11px);
  backdrop-filter:blur(11px);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 0%,#000 29%,rgba(0,0,0,.7) 48%,transparent 76%);
  mask-image:radial-gradient(ellipse at center,#000 0%,#000 29%,rgba(0,0,0,.7) 48%,transparent 76%);
}
.site-header .site-brand::before {
  inset:-35px -54px!important;
}
.site-header .site-nav::before {
  inset:-37px -52px!important;
  background:radial-gradient(ellipse at center,
    rgba(11,8,32,.82) 0%,
    rgba(20,11,47,.68) 35%,
    rgba(27,13,54,.34) 58%,
    transparent 79%)!important;
}
@media(max-width:850px){
  .site-header .site-brand::before{inset:-20px -30px!important}
  .site-header .site-nav::before{inset:-20px -25px!important}
}

/* v0.1.7 — Upcoming: artwork left, countdown centered, pre-save right. */
.upcoming-card{grid-template-columns:minmax(180px,300px) minmax(260px,1fr) minmax(160px,235px);gap:clamp(20px,3vw,48px)}
.upcoming-copy{min-width:0}
.upcoming-copy h3{font-size:clamp(1.8rem,3vw,3rem)}
.upcoming-copy .upcoming-date{color:#e7c58c;margin:6px 0 16px;font-weight:600}
.upcoming-countdown{margin-top:22px}
.upcoming-countdown-title{display:block;color:#e9b968;font-size:.7rem;font-weight:750;letter-spacing:.17em;margin-bottom:11px}
.upcoming-countdown-units{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;max-width:440px}
.upcoming-countdown-unit{border:1px solid #d4a45c8c;background:linear-gradient(145deg,#b17d2620,#0e122c80);border-radius:11px;padding:10px 3px;display:flex;flex-direction:column;align-items:center;gap:4px;box-shadow:0 0 15px #b77b1914}
.upcoming-countdown-unit strong{font-size:clamp(1.05rem,2vw,1.8rem);font-variant-numeric:tabular-nums;color:#ffd28c;line-height:1.15}
.upcoming-countdown-unit small{font-size:.58rem;letter-spacing:.08em;color:#dfbd85}
.upcoming-presave{display:flex;align-items:center;justify-content:center;height:100%;border-left:1px solid #d6a75a48;padding-left:clamp(14px,2vw,30px)}
.upcoming-presave-button{display:inline-flex;align-items:center;justify-content:center;text-align:center;padding:15px 19px;border-radius:12px;background:linear-gradient(120deg,#e3aa4c,#f6d28a);color:#191124!important;font-weight:750;text-decoration:none;box-shadow:0 4px 22px #d6a14755;transition:transform .2s,box-shadow .2s}
.upcoming-presave-button:hover,.upcoming-presave-button:focus-visible{transform:translateY(-2px);box-shadow:0 5px 27px #e4b55b88}
@media(max-width:1050px){.upcoming-card{grid-template-columns:minmax(170px,260px) minmax(0,1fr)}.upcoming-presave{grid-column:2;border-left:0;border-top:1px solid #d6a75a48;padding:18px 0 0;justify-content:flex-start}}
@media(max-width:700px){.upcoming-card{grid-template-columns:minmax(0,1fr)}.upcoming-presave{grid-column:1}.upcoming-countdown-units{max-width:420px}}
@media(prefers-reduced-motion:reduce){.upcoming-presave-button{transition:none}}

/* Sanitiz€r Industrial Acid — identity overrides */
:root{--bg:#080a09;--text:#f0f4ed;--muted:#a7b4ab;--accent:#b7ff00;color-scheme:dark}
html,body{background:#080a09!important;color:var(--text)}
body{background-image:radial-gradient(ellipse at 50% 0%,#1a2613 0%,transparent 46%),radial-gradient(ellipse at 90% 75%,#152018 0%,transparent 55%)!important}
body::before{background:radial-gradient(ellipse at 50% 35%,#a4ff0007,transparent 70%)}
#hed-cosmos-canvas{display:none!important}
.site-header{min-height:250px!important;padding:25px clamp(18px,4vw,70px)!important;background:#060908!important;isolation:isolate!important;overflow:hidden!important;align-items:flex-start!important;border-bottom:1px solid #b7ff0055!important}
.site-header::before{content:""!important;display:block!important;position:absolute!important;inset:0 -3%!important;z-index:0!important;background:url("assets/industrial-header.jpg") center 49%/cover no-repeat!important;opacity:1!important;filter:none!important;transform:translate3d(-1%,0,0);animation:sz-header-sway 24s ease-in-out infinite alternate!important}
.site-header::after{content:""!important;display:block!important;position:absolute!important;inset:0!important;z-index:1!important;background:linear-gradient(90deg,#020604b8 0%,#02060438 42%,#02060488 100%)!important;pointer-events:none!important}
@keyframes sz-header-sway{from{transform:translate3d(-1%,0,0)}to{transform:translate3d(1%,0,0)}}
.site-header .site-brand,.site-header .site-nav{position:relative!important;z-index:2!important;isolation:isolate!important}
.site-header .site-brand::before,.site-header .site-nav::before{background:radial-gradient(ellipse at center,rgba(3,10,5,.88),rgba(4,14,7,.65) 45%,transparent 78%)!important}
.site-header .site-brand img{max-width:min(465px,53vw)!important;max-height:185px!important;width:auto!important;height:auto!important;filter:drop-shadow(0 4px 14px #000b)!important}
.site-nav a{color:#f3f6ef!important;text-shadow:0 2px 8px #000;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.site-nav a:hover,.site-nav a[aria-current=page]{color:#b7ff00!important}
.site-main{max-width:1540px}
.eyebrow,.upcoming-countdown-title,.upcoming-copy .upcoming-date{color:#b7ff00!important}
.hero h1,.page-heading h1,.upcoming-section h2{font-weight:900;text-transform:uppercase;letter-spacing:-.025em}
.cta,.upcoming-presave-button{background:#b7ff00!important;color:#071000!important;border-radius:4px!important;box-shadow:0 0 24px #b7ff0050!important;text-transform:uppercase;letter-spacing:.04em}
.cta:hover,.upcoming-presave-button:hover{background:#d3ff58!important;box-shadow:0 0 36px #b7ff0080!important}
body.home .hero,.upcoming-card,.panel{background:linear-gradient(135deg,#1c2420e8,#090d0ce8)!important;border:1px solid #b7ff0059!important;box-shadow:0 12px 48px #0008!important}
.upcoming-countdown-unit{border-color:#b7ff0080!important;background:#111b12!important}
.upcoming-countdown-unit strong{color:#b7ff00!important}
.upcoming-countdown-unit small{color:#d5e8c0!important}
.upcoming-presave{border-color:#b7ff0040!important}
.upcoming-links a,.hero-release-links a{background:#1e3614!important;border-color:#b7ff00!important;color:#f0f5e9!important}
.upcoming-links a:hover,.hero-release-links a:hover{background:#345c17!important}
.upcoming-card .upcoming-art,.hero-cover{box-shadow:0 20px 55px #000b,0 0 22px #b7ff0026!important}
.music-stage .ft-rm-card:hover,.hed-media-card:hover,.hed-media-card:focus-visible{border-color:#b7ff00!important;box-shadow:0 22px 60px #b7ff0038!important}
.hed-media-card{background:linear-gradient(145deg,#202b23,#0b110e)!important;border-color:#b7ff0044!important}
.hed-media-info span{color:#b7ff00!important}
.hed-media-cover,.artist-photo-placeholder,.upcoming-placeholder,.hero-cover .cover-fallback{background:radial-gradient(circle at 50% 35%,#385b19,#101711 75%)!important}
.hed-hero-banner{border-color:#b7ff0055!important;box-shadow:0 20px 60px #000a,0 0 40px #b7ff0018!important}
.hed-hero-banner::after{background:linear-gradient(110deg,transparent 20%,#b7ff0011 50%,transparent 80%)}
.contact-social:hover{border-color:#b7ff00!important}
.site-footer{border-color:#b7ff0040!important;color:#a7b4ab!important}
@media(max-width:850px){.site-header{min-height:220px!important}.site-header .site-brand img{max-width:min(410px,82vw)!important;max-height:145px!important}}
@media(max-width:500px){.site-header{min-height:220px!important}.site-header .site-brand img{max-width:min(350px,88vw)!important;max-height:125px!important}.site-nav{gap:12px!important}.site-nav a{font-size:.8rem!important}}
@media(prefers-reduced-motion:reduce){.site-header::before{animation:none!important;transform:none!important}html .site-brand{animation:none!important}}


/* v0.1.3: explicit intro class overrides Firefox reduced-motion rule. */
@keyframes sz-logo-impact {
  0% {opacity:0;transform:translate3d(110vw,0,0) scale(1.04);filter:blur(8px)}
  57% {opacity:1;transform:translate3d(-18px,0,0);filter:blur(0)}
  68% {transform:translate3d(11px,-3px,0) rotate(1deg)}
  77% {transform:translate3d(-7px,2px,0) rotate(-.65deg)}
  86% {transform:translate3d(3px,-1px,0) rotate(.3deg)}
  94% {transform:translate3d(-1px,0,0)}
  100% {opacity:1;transform:translate3d(0,0,0) rotate(0);filter:blur(0)}
}
html body .site-header .site-brand.sz-logo-play,
html.sz-force-intro body .site-header .site-brand.sz-logo-play {
  animation:sz-logo-impact 1.4s cubic-bezier(.18,.75,.25,1) both!important;
  transform-origin:center center;
}
/* This explicitly takes precedence over the inherited reduced-motion animation:none. */
@media(prefers-reduced-motion:reduce) {
  html body .site-header .site-brand.sz-logo-play,
  html.sz-force-intro body .site-header .site-brand.sz-logo-play {
    animation:sz-logo-impact 1.4s cubic-bezier(.18,.75,.25,1) both!important;
  }
}
