:root{--bg:#090909;--fg:#e9e2d8;--muted:#a79b8c;--gold:#b8a185}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:'Helvetica Neue',Arial,sans-serif;font-weight:300;letter-spacing:.025em}a{color:inherit;text-decoration:none}button{font:inherit}header{position:fixed;z-index:10;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:21px 5vw;background:rgba(8,8,8,.88);backdrop-filter:blur(15px);border-bottom:1px solid #ffffff12}.brand{font-family:Georgia,serif;letter-spacing:.3em;font-size:14px}.nav{display:flex;gap:27px}.nav a{font-size:10px;letter-spacing:.18em;color:#c9c2b8}.nav a:hover,.active{color:#fff!important}.menu{display:none;background:none;border:0;color:white;font-size:23px}.hero{min-height:100svh;display:grid;place-items:center;position:relative;padding:100px 10vw 60px}.hero img{width:min(720px,85vw);display:block}.scroll{position:absolute;bottom:38px;color:#8e8377;font-size:10px;letter-spacing:.3em}section{padding:115px 7vw;scroll-margin-top:50px}.eyebrow{font-size:10px;letter-spacing:.32em;color:var(--gold)}h1,h2,h3,p{margin-top:0}h2{font-family:Georgia,serif;font-weight:400;letter-spacing:.08em;font-size:clamp(33px,4vw,60px)}h3{font-family:Georgia,serif;font-weight:400;font-size:clamp(23px,2.5vw,38px);letter-spacing:.07em}.center{text-align:center}.line{width:55px;height:1px;background:var(--gold);margin:24px auto 45px}.about{display:grid;grid-template-columns:minmax(250px,.83fr) 1.17fr;gap:8vw;align-items:center;max-width:1250px;margin:auto}.about img{width:100%;max-height:730px;object-fit:cover;object-position:center top}.about p{color:#c7c0b7;font-size:14px;line-height:2.05;margin-bottom:18px}.dark{background:#101010}.universe{max-width:950px;min-height:500px;margin:45px auto 80px;position:relative;display:grid;place-items:center}.orbit{position:absolute;width:min(75vw,500px);height:min(75vw,500px);border:1px solid #b8a18545;border-radius:50%}.orbit.two{width:min(57vw,365px);height:min(57vw,365px);opacity:.45}.core{z-index:1;text-align:center;background:#101010;padding:25px 18px;font-family:Georgia,serif;letter-spacing:.25em;font-size:23px}.node{position:absolute;z-index:2;border:1px solid #5c4f40;background:#121110;padding:18px 22px;font-size:11px;letter-spacing:.18em;white-space:nowrap}.node:nth-of-type(4){top:8%;left:12%}.node:nth-of-type(5){top:8%;right:12%}.node:nth-of-type(6){bottom:8%;left:12%}.node:nth-of-type(7){bottom:8%;right:12%}.feature{max-width:1200px;margin:0 auto 90px;min-height:450px;border:1px solid #514537;display:flex;align-items:end;padding:55px;background:radial-gradient(ellipse at 70% 25%,#494139 0%,#1a1919 40%,#090909 80%)}.feature.silver{background:radial-gradient(ellipse at 75% 25%,#383c40 0%,#191b1e 40%,#090909 80%)}.feature p{max-width:480px;color:#d0c7bd;line-height:1.8}.small-link{display:inline-block;margin-top:12px;border-bottom:1px solid var(--gold);padding-bottom:9px;font-size:10px;letter-spacing:.22em}.stages{max-width:900px;margin:auto;text-align:center}.stages p{color:#b9afa2;line-height:2.3}.music-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1200px;margin:auto}.music-card{min-height:340px;border:1px solid #554b3d;padding:32px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(150deg,#1b1a19,#0b0b0b)}.music-card .number{color:var(--gold);font-size:11px}.music-card h3{font-size:27px}.music-card p{font-size:13px;color:#b6aca0;line-height:1.7}.music-card .small-link{align-self:start}.tabs{display:flex;gap:50px;justify-content:center;margin:30px 0 48px}.tabs button{cursor:pointer;color:#82776c;border:0;border-bottom:1px solid transparent;background:transparent;padding:12px 0;font-size:11px;letter-spacing:.22em}.tabs button.selected{color:#f2e8dc;border-bottom-color:var(--gold)}.gallery-content{max-width:1080px;margin:auto}.photos{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.photo-placeholder{background:linear-gradient(135deg,#282725,#121212);min-height:340px;border:1px solid #403a33;display:grid;place-items:center;color:#80776b;font-size:10px;letter-spacing:.2em}.photo-placeholder.wide{grid-column:span 2;min-height:280px}.video-placeholder{border-bottom:1px solid #413a32;padding-bottom:22px;margin-bottom:30px}.video-screen{aspect-ratio:16/9;background:linear-gradient(135deg,#272729,#111);display:grid;place-items:center;color:#c4b39e;font-size:44px}.video-placeholder h3{font-family:Arial,sans-serif;font-size:13px;letter-spacing:.2em;margin:18px 0 5px}.video-placeholder p{font-size:12px;color:#9e9488}.hidden{display:none}.contact{text-align:center;min-height:580px}.contact h2{margin-bottom:20px}.contact p{color:#afa598}.contact .email{display:block;font-family:Georgia,serif;font-size:clamp(19px,3vw,38px);margin:45px 0 25px;overflow-wrap:anywhere}.contact-links{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;font-size:12px;letter-spacing:.14em}footer{text-align:center;border-top:1px solid #292521;padding:28px;color:#8b8177;font-size:10px;letter-spacing:.16em}@media(max-width:760px){header{padding:18px 6vw}.menu{display:block}.nav{display:none;position:absolute;top:57px;left:0;right:0;background:#0a0a0a;padding:30px;flex-direction:column;align-items:center}.nav.open{display:flex}section{padding:90px 6vw}.about{grid-template-columns:1fr;gap:38px}.about img{max-height:550px}.music-grid{grid-template-columns:1fr}.music-card{min-height:230px}.universe{min-height:350px}.orbit{width:260px;height:260px}.orbit.two{width:185px;height:185px}.node{font-size:9px;padding:12px}.node:nth-of-type(4){top:0;left:0}.node:nth-of-type(5){top:0;right:0}.node:nth-of-type(6){bottom:0;left:0}.node:nth-of-type(7){bottom:0;right:0}.core{font-size:17px}.feature{min-height:380px;padding:28px}.photos{gap:8px}.photo-placeholder{min-height:200px}.photo-placeholder.wide{min-height:200px}.tabs{gap:30px}}
.logo-wall{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 48px;max-width:940px;margin:48px auto 20px;align-items:center}.brand-logo{min-height:100px;display:flex;align-items:center;justify-content:center;padding:15px}.brand-logo img{width:100%;max-width:195px;height:76px;object-fit:contain;filter:grayscale(1) brightness(0) invert(1);opacity:.78;transition:opacity .3s,filter .3s}.brand-logo:hover img{opacity:1}.logo-fallback{color:#c4b8a6;font-size:15px;letter-spacing:.12em;text-transform:uppercase}.logo-note{font-size:10px!important;letter-spacing:.03em!important;opacity:.4;max-width:650px;margin:12px auto!important}.f1-reference{font-size:12px;letter-spacing:.22em;color:#cbbda9;margin:25px 0 0}.f1-reference small{font-size:9px;opacity:.6}@media(max-width:650px){.logo-wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.brand-logo{min-height:80px}.brand-logo img{height:58px}} .artist-network{max-width:850px;margin:70px auto 0;padding:46px 20px 12px;border-top:1px solid #3b332a;text-align:center}.artist-network .network-intro{font-size:13px!important;color:#aaa095!important;letter-spacing:.035em}.artist-network .network-names{font-size:16px!important;line-height:2!important;letter-spacing:.045em;color:#e0d4c3}.artist-network .network-names span{color:#937e62;padding:0 9px}@media(max-width:650px){.artist-network{margin-top:45px}.artist-network .network-names{font-size:13px!important}} .network-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:34px auto 0;max-width:900px}.network-card{text-align:left}.network-photo{aspect-ratio:4/5;background:linear-gradient(145deg,#272522,#121110);display:flex;align-items:center;justify-content:center;color:#776d62;font-size:10px;letter-spacing:.17em;text-align:center}.network-card h4{font-family:Georgia,serif;font-size:20px;font-weight:400;letter-spacing:.025em;margin:17px 0 6px;color:#e9e0d4}.network-role{color:#b5a896;font-size:11px;margin:0 0 5px}.network-project{color:#d0c2ae;font-size:12px;margin:0}.network-photo img{width:100%;height:100%;object-fit:cover}@media(max-width:650px){.network-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.network-card h4{font-size:17px}}@media(max-width:410px){.network-grid{grid-template-columns:1fr}.network-photo{max-height:420px}} 
/* The orbital lines move gently while the four labels and center remain still. */
.universe{isolation:isolate;overflow:hidden;border-radius:50%;max-width:780px;min-height:560px}
.universe-halo{position:absolute;inset:13%;border-radius:50%;background:radial-gradient(circle,#9e826b18 0%,#bba08109 30%,transparent 67%);pointer-events:none}
.universe .orbit{position:absolute;left:50%;top:50%;width:min(69vw,510px);height:min(39vw,275px);border:1px solid #b8a18566;border-radius:50%;pointer-events:none;transform-origin:center;will-change:transform}
.universe .orbit-a{animation:orbital-a 75s linear infinite}
.universe .orbit-b{width:min(69vw,510px);height:min(39vw,275px);opacity:.68;animation:orbital-b 95s linear infinite reverse}
.universe .orbit-c{width:min(50vw,355px);height:min(50vw,355px);opacity:.24;animation:orbital-c 130s linear infinite}
@keyframes orbital-a{from{transform:translate(-50%,-50%) rotate(-34deg)}to{transform:translate(-50%,-50%) rotate(326deg)}}
@keyframes orbital-b{from{transform:translate(-50%,-50%) rotate(57deg)}to{transform:translate(-50%,-50%) rotate(417deg)}}
@keyframes orbital-c{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
.universe .core{background:#101010c9;border-radius:50%;min-width:190px;min-height:100px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;box-shadow:0 0 70px #bba08015}
.universe .core small{font-family:Arial,sans-serif;font-size:8px;letter-spacing:.24em;color:#a9957c}
.universe .node{cursor:pointer;font-family:inherit;color:#e6dacb;transition:background .35s,border-color .35s,box-shadow .35s;z-index:3}
.universe .node:hover,.universe .node:focus-visible,.universe .node.is-active{background:#28231d;border-color:#d0b694;box-shadow:0 0 30px #bba08024;outline:none}
.universe .node-piano{top:11%;left:8%}.universe .node-dj{top:11%;right:8%}.universe .node-hybrid{bottom:11%;left:8%}.universe .node-music{bottom:11%;right:8%}
.dimension-detail{text-align:center;max-width:600px;margin:-28px auto 100px;min-height:115px}.dimension-detail h3{font-size:25px;margin:12px 0}.dimension-detail p{color:#bfb4a7;font-size:13px;line-height:1.8}
@media(max-width:760px){.universe{min-height:380px;overflow:visible}.universe .orbit{width:290px;height:155px}.universe .orbit-c{width:235px;height:235px}.universe .core{min-width:150px;min-height:85px;font-size:16px}.universe .node{font-size:9px;padding:12px 10px}.universe .node-piano{top:1%;left:0}.universe .node-dj{top:1%;right:0}.universe .node-hybrid{bottom:1%;left:0}.universe .node-music{bottom:1%;right:0}.dimension-detail{margin:0 auto 75px}}
@media(prefers-reduced-motion:reduce){.universe .orbit{animation:none!important}}

/* Revision 07: immersive hero, unobstructed orbit diagram, and editorial contact. */
.hero{height:100svh;min-height:600px;padding:0!important;overflow:hidden;background:#050505;isolation:isolate}
.hero .hero-art{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;display:block}
.hero .scroll{z-index:2;bottom:22px;padding:9px 16px;background:#080808a8;border-radius:30px;color:#e7d9c5}
@media(max-width:760px){.hero{min-height:0;height:100svh}.hero .hero-art{object-fit:contain}}
.universe{width:100%;max-width:1040px;height:680px;min-height:680px;margin:35px auto 35px;overflow:visible;isolation:isolate}
.universe .universe-halo{width:560px;height:560px;max-width:80vw;max-height:80vw;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#c4a77b13 0%,#c4a77b08 37%,transparent 72%);pointer-events:none}
.universe .orbit{width:580px!important;height:300px!important;max-width:70vw;max-height:36vw;z-index:0;opacity:.8}
.universe .orbit-c{width:420px!important;height:420px!important;max-width:55vw;max-height:55vw;opacity:.22}
.universe .core{position:relative;z-index:2;pointer-events:none}
.universe .node{z-index:5;max-width:190px;text-align:center;white-space:normal;line-height:1.4;min-width:132px}
.universe .node-piano{top:9%;left:9%}.universe .node-dj{top:9%;right:9%}
.universe .node-hybrid{bottom:9%;left:9%}.universe .node-music{bottom:9%;right:9%}
.dimension-detail{margin:0 auto 100px}
@media(max-width:760px){.universe{height:490px;min-height:490px}.universe .orbit{width:310px!important;height:180px!important;max-width:82vw;max-height:50vw}.universe .orbit-c{width:245px!important;height:245px!important;max-width:70vw;max-height:70vw}.universe .node{min-width:0;max-width:135px;padding:12px 9px;font-size:9px}.universe .node-piano{top:1%;left:1%}.universe .node-dj{top:1%;right:1%}.universe .node-hybrid{bottom:1%;left:1%}.universe .node-music{bottom:1%;right:1%}.universe .core{min-width:150px}}
.music-card:nth-child(3) h3{white-space:nowrap;font-size:clamp(17px,1.8vw,25px);letter-spacing:.025em}
.contact{padding:120px 7vw 90px!important;min-height:auto;text-align:left}
.contact-shell{max-width:1050px;margin:auto}.contact h2{font-size:clamp(48px,6vw,90px);margin:18px 0 14px}.contact-intro{max-width:550px;line-height:1.9;font-size:15px}
.contact-primary{border-top:1px solid #5a4c3b;border-bottom:1px solid #5a4c3b;margin:55px 0 40px;padding:34px 0;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.contact-label,.social-heading,.social-grid span{font-size:10px;letter-spacing:.22em;color:#b9a287}.contact-email{font-family:Georgia,serif;font-size:clamp(21px,3vw,36px);overflow-wrap:anywhere}.contact-phone{font-size:15px;color:#d0c4b5}
.social-heading{margin-bottom:20px}.social-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:#3c352c;border:1px solid #3c352c}
.social-grid>a,.social-pending{display:flex;flex-direction:column;gap:14px;background:#101010;padding:27px;min-height:115px}.social-grid>a:hover{background:#1b1916}.social-grid strong{font-weight:400;font-size:14px;letter-spacing:.025em}.social-pending strong{font-weight:300;color:#8c8276;font-size:12px}.contact-location{margin-top:45px;font-size:10px;letter-spacing:.25em;color:#b3a28d}
@media(max-width:600px){.social-grid{grid-template-columns:1fr}.contact{padding:95px 6vw!important}.social-grid>a,.social-pending{min-height:90px;padding:22px}}

/* Fix: remove inherited positional constraints from legacy nth-of-type rules. */
.universe .node{top:auto;right:auto;bottom:auto;left:auto;width:auto;height:auto;min-height:48px;align-content:center}
.universe .node-piano{top:9%;left:9%;right:auto;bottom:auto}
.universe .node-dj{top:9%;right:9%;left:auto;bottom:auto}
.universe .node-hybrid{bottom:9%;left:9%;top:auto;right:auto}
.universe .node-music{bottom:9%;right:9%;top:auto;left:auto}
@media(max-width:760px){
.universe .node-piano{top:1%;left:1%;right:auto;bottom:auto}
.universe .node-dj{top:1%;right:1%;left:auto;bottom:auto}
.universe .node-hybrid{bottom:1%;left:1%;top:auto;right:auto}
.universe .node-music{bottom:1%;right:1%;top:auto;left:auto}
}

/* Planetary constellation v2: no opaque center badge or rectangular buttons. */
.universe{height:680px;min-height:680px;max-width:1000px;overflow:visible;isolation:isolate}
.universe .core{background:transparent!important;border-radius:0!important;box-shadow:none!important;min-width:0!important;min-height:0!important;padding:0!important;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:6;white-space:nowrap;text-shadow:0 0 28px #d9b98a44;pointer-events:none}
.universe .core span{font-size:clamp(21px,2.7vw,35px);letter-spacing:.32em}
.universe .core small{margin-top:7px}
.universe .universe-halo{pointer-events:none}
.universe .planet-track{position:absolute;left:50%;top:50%;width:min(75vw,590px);height:min(44vw,355px);border:1px solid #c9ae8750;border-radius:50%;transform-origin:center;animation:planet-rotate var(--duration) linear infinite;z-index:3;pointer-events:none}
.universe .planet-track-dj{width:min(73vw,570px);height:min(38vw,310px);border-color:#d4b99345;animation-direction:reverse}
.universe .planet-track-hybrid{width:min(65vw,510px);height:min(49vw,390px);border-color:#c6ac8540}
.universe .planet-track-music{width:min(55vw,440px);height:min(52vw,410px);border-color:#c6ac8538;animation-direction:reverse}
@keyframes planet-rotate{from{transform:translate(-50%,-50%) rotate(var(--start))}to{transform:translate(-50%,-50%) rotate(calc(var(--start) + 360deg))}}
.universe .planet{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);border:0!important;background:none!important;box-shadow:none!important;padding:0!important;min-width:0!important;max-width:none!important;width:145px;display:flex;flex-direction:column;align-items:center;gap:11px;cursor:pointer;pointer-events:auto;color:#e8d9c5;z-index:5;animation:planet-upright var(--duration) linear infinite;white-space:normal}
.universe .planet-track-dj .planet,.universe .planet-track-music .planet{animation-direction:reverse}
@keyframes planet-upright{from{transform:translate(-50%,-50%) rotate(calc(-1 * var(--start)))}to{transform:translate(-50%,-50%) rotate(calc(-1 * (var(--start) + 360deg)))}}
.planet-sphere{display:block;width:29px;height:29px;flex:none;border-radius:50%;background:radial-gradient(circle at 30% 25%,#f3e3c7 0%,#c3a681 25%,#806c57 55%,#272522 90%);box-shadow:0 0 0 1px #e4d0ac44,0 0 24px #bfa07c77, inset -6px -5px 10px #0009;transition:transform .3s,box-shadow .3s}
.planet-label{font-size:10px;letter-spacing:.17em;text-align:center;line-height:1.4;text-shadow:0 1px 10px #000,0 0 10px #000}
.planet:hover .planet-sphere,.planet:focus-visible .planet-sphere,.planet.is-active .planet-sphere{transform:scale(1.3);box-shadow:0 0 0 1px #f1dfbd,0 0 38px #d8b88b99,inset -6px -5px 10px #0008}
.planet:focus-visible{outline:1px solid #c9ad83;outline-offset:8px}
@media(max-width:760px){.universe{height:440px;min-height:440px}.universe .planet-track{width:78vw;height:46vw}.universe .planet-track-dj{width:73vw;height:40vw}.universe .planet-track-hybrid{width:68vw;height:55vw}.universe .planet-track-music{width:57vw;height:52vw}.universe .planet{width:100px;gap:6px}.planet-sphere{width:20px;height:20px}.planet-label{font-size:8px;letter-spacing:.09em}.universe .core span{font-size:19px}.universe .core small{font-size:6px}}
@media(prefers-reduced-motion:reduce){.universe .planet-track,.universe .planet{animation:none!important}.universe .planet-track{transform:translate(-50%,-50%) rotate(var(--start))}.universe .planet{transform:translate(-50%,-50%) rotate(calc(-1 * var(--start)))}}

.contact-redesign{padding:120px 7vw 95px!important;background:#0b0b0b}.contact-redesign .contact-shell{max-width:1320px}.contact-topline{display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #544839;padding-bottom:20px}.contact-redesign .contact-location{margin:0}.contact-editorial{display:grid;grid-template-columns:1.15fr 1fr;align-items:end;gap:7vw;padding:85px 0 90px}.contact-lead h2{font-size:clamp(56px,8vw,126px);letter-spacing:-.045em;line-height:.95;margin:0 0 32px;font-weight:400}.contact-lead h2 em{font-style:italic;font-weight:400;color:#c8b397}.contact-lead p{font-size:15px;color:#b7aea3;line-height:1.8;max-width:330px}.contact-details{display:flex;flex-direction:column;align-items:flex-start;gap:23px;padding-bottom:14px}.contact-details .contact-label{margin-bottom:10px}.contact-details a{border-bottom:1px solid #51483e;padding-bottom:13px;max-width:100%;transition:color .2s,border-color .2s}.contact-details a:hover{color:#ddc5a4;border-color:#b8a185}.contact-details .contact-email{font-size:clamp(18px,2.25vw,31px);letter-spacing:-.025em}.contact-details .contact-phone{font-size:clamp(16px,1.5vw,21px)}.contact-socials{border-top:1px solid #544839;padding-top:30px}.social-inline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:25px}.social-inline a{min-height:90px;display:grid;grid-template-columns:1fr auto;align-content:start;gap:8px;padding:12px 18px 10px 0;margin-right:18px;border-right:1px solid #342f29;transition:color .2s}.social-inline a:last-child{border:0;margin-right:0}.social-inline a:hover{color:#d8bd97}.social-inline span{font-size:10px;letter-spacing:.19em;color:#b8a185;grid-column:1}.social-inline strong{font-size:12px;letter-spacing:.08em;font-weight:400;grid-column:1}.social-inline b{grid-column:2;grid-row:1/3;font-size:19px;font-weight:300}@media(max-width:850px){.contact-editorial{grid-template-columns:1fr;gap:48px;padding:60px 0}.social-inline{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}}@media(max-width:500px){.contact-redesign{padding:85px 6vw!important}.contact-topline{align-items:flex-start;flex-direction:column;gap:10px}.social-inline{grid-template-columns:1fr 1fr;gap:20px 8px}.social-inline a{margin-right:0;padding-right:8px}.social-inline strong{font-size:10px}.contact-lead h2{font-size:clamp(55px,13vw,80px)}}

/* Four individual ivory planets: restrained scale and distinctive finishes */
.universe .planet{gap:9px!important}
.universe .planet-sphere{width:19px!important;height:19px!important;background:radial-gradient(circle at 30% 24%,#fffdf4 0%,#eee9dc 32%,#c4bfb1 69%,#77746e 100%)!important;box-shadow:0 0 0 1px #f4efe388,0 0 12px #f6eddd50,inset -3px -3px 5px #44433d35!important}
.universe .planet-track-dj .planet-sphere{width:15px!important;height:15px!important;background:radial-gradient(circle at 27% 26%,#fffdf6 0%,#dedbd2 38%,#9f9d95 72%,#575852 100%)!important;box-shadow:0 0 0 1px #f4f0e066,0 0 9px #eee8dc55,inset -3px -3px 4px #4445!important}
.universe .planet-track-hybrid .planet-sphere{width:21px!important;height:21px!important;background:radial-gradient(circle at 35% 23%,#fffff7 0%,#f0eee5 24%,#d2cbbb 52%,#8c8a7f 100%)!important;box-shadow:0 0 0 1px #f8f4e588,0 0 13px #eee9dd55,inset -4px -4px 6px #48463d40!important}
.universe .planet-track-music .planet-sphere{width:17px!important;height:17px!important;background:radial-gradient(circle at 25% 23%,#fffdf3 0%,#e9e6dc 28%,#b8b6ae 60%,#6e716c 100%)!important;box-shadow:0 0 0 1px #f5efe077,0 0 10px #eee8dc4d,inset -3px -4px 5px #343b3440!important}
.universe .planet:hover .planet-sphere,.universe .planet:focus-visible .planet-sphere,.universe .planet.is-active .planet-sphere{transform:scale(1.18)!important;box-shadow:0 0 0 1px #fffaf0,0 0 19px #f6eee4a8!important}
.social-inline a{grid-template-columns:24px 1fr auto!important;align-items:center;column-gap:12px!important}
.social-inline a .social-icon{grid-column:1;grid-row:1/3;width:19px;height:19px;color:#e6dac9;align-self:center}
.social-inline a span{grid-column:2!important;grid-row:1}
.social-inline a strong{grid-column:2!important;grid-row:2}
.social-inline a b{grid-column:3!important;grid-row:1/3}
@media(max-width:760px){.universe .planet-sphere{width:15px!important;height:15px!important}.universe .planet-track-dj .planet-sphere{width:12px!important;height:12px!important}.universe .planet-track-hybrid .planet-sphere{width:16px!important;height:16px!important}.universe .planet-track-music .planet-sphere{width:13px!important;height:13px!important}}

/* Cinematic material depth, directional lighting and subtle surface detail. */
.universe .planet-sphere{position:relative;isolation:isolate;overflow:visible;width:21px!important;height:21px!important;border-radius:50%;background:radial-gradient(circle at 29% 24%,#fffdf5 0%,#f6f0e3 13%,#e1d9ca 31%,#aaa396 57%,#55514c 77%,#171819 96%)!important;box-shadow:inset -3px -4px 6px #090a0ba8,inset 1px 1px 2px #fffdf8c9,0 0 0 1px #fff9ed70,0 0 9px 2px #fff4df47,0 0 25px 6px #efe6d41c!important;filter:contrast(1.08);}
.universe .planet-sphere::before{content:"";position:absolute;inset:1px;border-radius:50%;pointer-events:none;background:repeating-radial-gradient(ellipse at 28% 30%,transparent 0px,transparent 2px,#fffdf20b 3px,#312e290d 4px),radial-gradient(ellipse at 22% 18%,#fffef1aa,transparent 47%);mix-blend-mode:soft-light;}
.universe .planet-sphere::after{content:"";position:absolute;inset:-7px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,#f8f2e42c 0%,#e9e0cc0b 50%,transparent 72%);z-index:-1;}
.universe .planet-track-dj .planet-sphere{width:17px!important;height:17px!important;background:radial-gradient(circle at 26% 22%,#fffef7 0%,#e9e6df 20%,#c7c2b8 40%,#777873 68%,#1c2020 96%)!important;box-shadow:inset -3px -3px 5px #0b0d0db0,inset 1px 1px 2px #fffff4a8,0 0 0 1px #f4efe06e,0 0 8px 2px #f0ebdd38,0 0 20px 5px #e7e3da17!important;}
.universe .planet-track-hybrid .planet-sphere{width:23px!important;height:23px!important;background:radial-gradient(circle at 32% 22%,#fffff7 0%,#f4eddf 13%,#d6cbb8 36%,#938a7b 60%,#373632 84%,#111516 100%)!important;box-shadow:inset -4px -4px 7px #0b0c0db5,inset 1px 1px 3px #fffef4c9,0 0 0 1px #fff7e97d,0 0 11px 2px #fff1db4a,0 0 28px 6px #eee0ca1a!important;}
.universe .planet-track-music .planet-sphere{width:19px!important;height:19px!important;background:radial-gradient(circle at 35% 20%,#fffef7 0%,#e9e5da 18%,#c7c4ba 36%,#8b8980 57%,#494b49 80%,#121618 98%)!important;box-shadow:inset -4px -4px 6px #090c0db0,inset 1px 1px 2px #fffef1b0,0 0 0 1px #f7f2e677,0 0 9px 2px #fff3df42,0 0 23px 5px #e8e5dc18!important;}
.universe .planet:hover .planet-sphere,.universe .planet:focus-visible .planet-sphere,.universe .planet.is-active .planet-sphere{transform:scale(1.14)!important;filter:contrast(1.12) brightness(1.07);box-shadow:inset -4px -4px 7px #0a0c0da6,inset 1px 1px 2px #fffdf4c9,0 0 0 1px #fffaf0bd,0 0 13px 3px #f7eddf77,0 0 31px 8px #f1e9da28!important;}
@media(max-width:760px){.universe .planet-sphere{width:17px!important;height:17px!important}.universe .planet-track-dj .planet-sphere{width:14px!important;height:14px!important}.universe .planet-track-hybrid .planet-sphere{width:19px!important;height:19px!important}.universe .planet-track-music .planet-sphere{width:16px!important;height:16px!important}}

.music-platform-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:22px}.music-platform-links a{font-size:11px;letter-spacing:.14em;border-bottom:1px solid #bca98c;padding-bottom:7px;color:#e6d9c8;text-decoration:none;transition:color .2s}.music-platform-links a:hover{color:#fff}.social-inline{grid-template-columns:repeat(5,minmax(0,1fr))}@media(max-width:850px){.social-inline{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:550px){.social-inline{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* --------------------------------------------------------------------
   Additions for the CMS-driven page (not part of the reference design).
   Everything above is the reference stylesheet verbatim, in its original
   order, so the later blocks there keep overriding the earlier ones.
   -------------------------------------------------------------------- */

/* Real photos inside the reference .photos grid: the placeholder keeps its
   border, gradient and min-height, the picture fills the box. */
.photos .photo-placeholder.is-photo{padding:0;overflow:hidden;place-items:stretch;position:relative;height:340px}
.photos .photo-placeholder.is-photo.wide{height:280px}
.photos .photo-placeholder.is-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block}
@media(max-width:760px){.photos .photo-placeholder.is-photo,.photos .photo-placeholder.is-photo.wide{height:200px}}

/* Gallery "View all": the photos after the first N are hidden while the grid
   is collapsed (public/js/onepage.js adds .is-collapsed, never the server, so
   every photo stays visible without JavaScript). The button reuses the
   reference .small-link look as a centred button under the grid. */
.photos.is-collapsed .photo-placeholder.is-extra{display:none}
.gallery-more{text-align:center}
.gallery-toggle{display:inline-block;margin-top:34px;padding:0 0 9px;border:0;border-bottom:1px solid var(--gold);background:transparent;color:inherit;font-size:10px;letter-spacing:.22em;cursor:pointer;transition:color .2s}
.gallery-toggle:hover,.gallery-toggle:focus-visible{color:#fff}
/* Full-size photo viewer of the PHOTOGRAPHY tab (public/js/onepage.js):
   near-black backdrop, the picture fitted to the screen (object-fit: contain,
   max 92vw × 86vh), the caption below in the eyebrow style and the counter
   plus the thin ← → × controls in the header / nav style. The .lightbox class
   also keeps the site animations (site-anim.js) out of the overlay. */
.lightbox{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;background:rgba(5,5,5,.96);opacity:0;transition:opacity .3s ease}
.lightbox[hidden]{display:none}
.lightbox.is-open{opacity:1}
.lightbox-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:21px 5vw;border-bottom:1px solid #ffffff12}
.lightbox-counter{font-size:10px;letter-spacing:.18em;color:#c9c2b8}
.lightbox-close{padding:0;border:0;background:none;color:#c9c2b8;font-size:22px;line-height:1;cursor:pointer;transition:color .2s}
.lightbox-stage{position:relative;flex:1;display:grid;place-items:center;min-height:0;padding:24px min(9vw,70px)}
.lightbox-figure{margin:0;display:grid;justify-items:center;gap:16px;max-width:92vw;transform:scale(.985);transition:transform .3s ease}
.lightbox.is-open .lightbox-figure{transform:scale(1)}
.lightbox-figure img{display:block;width:auto;height:auto;max-width:92vw;max-height:86vh;object-fit:contain}
.lightbox-caption{font-size:10px;letter-spacing:.32em;line-height:1.8;text-align:center;color:var(--gold,#b8a185)}
.lightbox-arrow{position:absolute;top:50%;transform:translateY(-50%);padding:14px 10px;border:0;background:none;color:#c9c2b8;font-size:19px;line-height:1;cursor:pointer;transition:color .2s}
.lightbox-prev{left:min(3vw,22px)}
.lightbox-next{right:min(3vw,22px)}
.lightbox-close:hover,.lightbox-close:focus-visible,.lightbox-arrow:hover,.lightbox-arrow:focus-visible{color:#fff}
.lightbox-close:focus-visible,.lightbox-arrow:focus-visible{outline:1px solid var(--gold,#b8a185);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.lightbox,.lightbox-figure{transition:none}.lightbox-figure{transform:none}}
@media(max-width:760px){.lightbox-bar{padding:16px 5vw}.lightbox-stage{padding:18px min(11vw,44px)}.lightbox-figure img{max-height:76vh}}

/* Dimension link under the description (#dimension-link): the reference
   .small-link look, a little further from the text. An empty linkUrl hides
   it (public/js/onepage.js and the template toggle the hidden attribute). */
#dimension-link{display:inline-block;margin-top:18px}
#dimension-link[hidden]{display:none}

/* Real portraits in the artist network (the box keeps its 4:5 crop). */
.network-photo.has-photo{align-items:stretch;padding:0}

/* Header brand logo (Admin → Header & nav: brandMode "logo" / "logo-text").
   "Text" mode renders the wordmark alone and is not affected by any of this,
   so the header of the reference design keeps its height and alignment. The
   height comes from the --brand-logo-height variables printed by server.js. */
.brand.brand-with-logo{display:inline-flex;align-items:center;gap:12px}
.brand .brand-logo-img{display:block;width:auto;height:var(--brand-logo-height, 34px);max-width:min(48vw, 260px);object-fit:contain}
.brand .brand-text{font-size:inherit;letter-spacing:inherit;line-height:1.2}
@media(max-width:760px){.brand .brand-logo-img{height:var(--brand-logo-height-mobile, 28px);max-width:min(52vw, 180px)}.brand.brand-with-logo{gap:9px}}

/* Selected stage logos: the upload wins over the https URL, and "invert" off
   shows the uploaded logo in its original colours instead of the white
   treatment of the reference (grayscale + brightness(0) + invert(1)). */
.brand-logo.is-color img{filter:none;opacity:.92}
.brand-logo.is-color:hover img{opacity:1;filter:none}

/* Optional background photo of a section (Admin → the same section): a layer
   behind the content with a dark overlay on top of it. z-index:-1 paints it
   over the section background but under every piece of content — the planet
   universe, the feature articles and the cards included — and isolation keeps
   the whole thing in the stacking context of the section. */
.has-section-bg{position:relative;isolation:isolate}
.section-bg{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.section-bg-image{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.section-bg-overlay{position:absolute;inset:0;display:block;background:#060606}

/* Optional photo behind a music card / a feature article (Admin → Music /
   Performances) with the same dark overlay, so the text stays readable.
   Empty = the gradient of the reference design, unchanged. */
.music-card.has-card-image{position:relative;isolation:isolate;overflow:hidden}
.card-media{position:absolute;inset:0;z-index:-1;display:block;pointer-events:none}
.card-media-image{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.card-media-overlay{position:absolute;inset:0;display:block;background:linear-gradient(150deg,#1b1a19e0,#0b0b0bf2)}
.feature.has-feature-image{position:relative;isolation:isolate;overflow:hidden}
.feature-media{position:absolute;inset:0;z-index:-1;display:block;pointer-events:none}
.feature-media-image{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.feature-media-overlay{position:absolute;inset:0;display:block;background:linear-gradient(120deg,#090909f2 25%,#101010c9 60%,#090909f5)}

/* YouTube facade inside the reference .video-screen card. */
.video-screen.is-video{position:relative;overflow:hidden;padding:0;cursor:pointer}
.video-screen .video-facade{position:absolute;inset:0;display:grid;place-items:center;padding:0;border:0;background:transparent;cursor:pointer;color:#c4b39e;font-size:44px}
.video-screen .video-facade img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.82;transition:opacity .3s,transform .6s}
.video-screen .video-facade:hover img,.video-screen .video-facade:focus-visible img{opacity:1;transform:scale(1.03)}
.video-screen .video-play{position:relative;z-index:1;font-size:44px;line-height:1;text-shadow:0 2px 18px #000}
.video-screen .video-embed{position:absolute;inset:0;width:100%;height:100%;border:0}

/* 404 / 500: the reference section spacing, without the old stylesheet. */
.notfound{min-height:70svh;display:grid;place-items:center}

/* Site animations (public/js/site-anim.js): nothing is hidden by CSS alone —
   only after the script has confirmed GSAP and set html.gsap-ready. */
html.gsap-ready [data-sa-pending]{opacity:0}
.sa-mask{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.sa-mask-inline{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
header{transition:transform .45s cubic-bezier(.22,.61,.36,1)}
header.is-hidden{transform:translateY(-101%)}

/* --------------------------------------------------------------------
   Admin → Mobile & Tablet (Admin panel → Settings → Mobile & Tablet).

   Every rule below reads a custom property that is printed by the server
   into <style id="responsive-css"> (views/partials/head.ejs, built by
   lib/responsive.js): the properties are only emitted inside the media
   query of the device whose value differs from the reference design, and
   only the edited ones. The fallback of every var() is the size of the
   reference design at that breakpoint, so an untouched site renders
   exactly as above and a tuned value only applies to its own device:

     tablet → @media (min-width:761px) and (max-width:1024px)
     mobile → @media (max-width:760px)

   These declarations are the last block of the file on purpose: they only
   repeat a design value multiplied by a scale (or read a px value), so
   nothing above is lost.
   -------------------------------------------------------------------- */

/* Text size: paragraphs, labels, captions and the small print. --------- */
body{font-size:calc(16px * var(--rs-text-scale, 1))}
.hero .scroll,.eyebrow,.small-link,.contact-label,.social-heading,.social-grid span,.social-inline span,.contact-location,footer,.lightbox-caption,.photo-placeholder{font-size:calc(10px * var(--rs-text-scale, 1))}
.music-card .number,.tabs button,.network-role,.music-platform-links a{font-size:calc(11px * var(--rs-text-scale, 1))}
.network-project,.video-placeholder p,.social-inline strong{font-size:calc(12px * var(--rs-text-scale, 1))}
.music-card p,.dimension-detail p,.video-placeholder h3{font-size:calc(13px * var(--rs-text-scale, 1))}
.artist-network .network-intro{font-size:calc(13px * var(--rs-text-scale, 1)) !important}
.about p,.social-grid strong{font-size:calc(14px * var(--rs-text-scale, 1))}
.contact-intro,.contact-lead p{font-size:calc(15px * var(--rs-text-scale, 1))}
/* The dimension labels keep their own (smaller) design size on phones. */
.universe .node{font-size:calc(11px * var(--rs-text-scale, 1))}
.planet-label{font-size:calc(10px * var(--rs-text-scale, 1))}
@media(max-width:760px){
  .universe .node{font-size:calc(9px * var(--rs-text-scale, 1))}
  .planet-label{font-size:calc(8px * var(--rs-text-scale, 1))}
}

/* Heading size: h2 / h3, the contact headings, the feature titles and the
   KUDZINA core of the universe. The fluid clamp() of the design is kept,
   so the scale only multiplies the size the reference would use. -------- */
h2{font-size:calc(clamp(33px,4vw,60px) * var(--rs-heading-scale, 1))}
h3{font-size:calc(clamp(23px,2.5vw,38px) * var(--rs-heading-scale, 1))}
.music-card h3{font-size:calc(27px * var(--rs-heading-scale, 1))}
.music-card:nth-child(3) h3{font-size:calc(clamp(17px,1.8vw,25px) * var(--rs-heading-scale, 1))}
.dimension-detail h3{font-size:calc(25px * var(--rs-heading-scale, 1))}
.network-card h4{font-size:calc(20px * var(--rs-heading-scale, 1))}
.universe .core span{font-size:calc(clamp(21px,2.7vw,35px) * var(--rs-heading-scale, 1))}
.contact h2{font-size:calc(clamp(48px,6vw,90px) * var(--rs-heading-scale, 1))}
.contact-lead h2{font-size:calc(clamp(56px,8vw,126px) * var(--rs-heading-scale, 1))}
@media(max-width:760px){
  .universe .core span{font-size:calc(19px * var(--rs-heading-scale, 1))}
}
@media(max-width:650px){
  .network-card h4{font-size:calc(17px * var(--rs-heading-scale, 1))}
}
@media(max-width:500px){
  .contact-lead h2{font-size:calc(clamp(55px,13vw,80px) * var(--rs-heading-scale, 1))}
}

/* Section padding (vertical and horizontal), contact block included. --- */
section{padding:calc(115px * var(--rs-spacing-scale, 1)) calc(7vw * var(--rs-spacing-scale, 1))}
.contact{padding:calc(120px * var(--rs-spacing-scale, 1)) calc(7vw * var(--rs-spacing-scale, 1)) calc(90px * var(--rs-spacing-scale, 1)) !important}
.contact-redesign{padding:calc(120px * var(--rs-spacing-scale, 1)) calc(7vw * var(--rs-spacing-scale, 1)) calc(95px * var(--rs-spacing-scale, 1)) !important}
@media(max-width:760px){
  section{padding:calc(90px * var(--rs-spacing-scale, 1)) calc(6vw * var(--rs-spacing-scale, 1))}
}
@media(max-width:600px){
  .contact{padding:calc(95px * var(--rs-spacing-scale, 1)) calc(6vw * var(--rs-spacing-scale, 1)) !important}
}
@media(max-width:500px){
  .contact-redesign{padding:calc(85px * var(--rs-spacing-scale, 1)) calc(6vw * var(--rs-spacing-scale, 1)) !important}
}

/* Header: minimum height (0 = design), brand text and navigation links.
   A taller header also moves the drop-down menu of the navigation. ----- */
header{min-height:var(--rs-header-height, 0)}
.brand{font-size:var(--rs-brand-size, 14px)}
.nav a{font-size:var(--rs-nav-size, 10px)}
@media(max-width:760px){
  .nav{top:var(--rs-nav-top, 57px)}
}

/* Hero: height in vh and how the image fills it (design = cover, and
   contain on phones — exactly the reference behaviour). ---------------- */
.hero{height:var(--rs-hero-height, 100svh);min-height:var(--rs-hero-min-height, 600px)}
.hero .hero-art{object-fit:var(--rs-hero-fit, cover)}
@media(max-width:760px){
  .hero{height:var(--rs-hero-height, 100svh);min-height:var(--rs-hero-min-height, 0)}
  .hero .hero-art{object-fit:var(--rs-hero-fit, contain)}
}

/* About: maximum height of the portrait (0 = design). ------------------ */
.about img{max-height:var(--rs-about-image-height, 730px)}
@media(max-width:760px){
  .about img{max-height:var(--rs-about-image-height, 550px)}
}

/* Universe: the block height, the four orbit tracks and the planet labels
   are scaled together. The keyframes (planet-rotate / planet-upright) only
   translate and rotate, so the orbits keep spinning exactly as before. -- */
.universe{height:calc(680px * var(--rs-universe-scale, 1));min-height:calc(680px * var(--rs-universe-scale, 1))}
.universe .planet-track{width:min(75vw,calc(590px * var(--rs-universe-scale, 1)));height:min(44vw,calc(355px * var(--rs-universe-scale, 1)))}
.universe .planet-track-dj{width:min(73vw,calc(570px * var(--rs-universe-scale, 1)));height:min(38vw,calc(310px * var(--rs-universe-scale, 1)))}
.universe .planet-track-hybrid{width:min(65vw,calc(510px * var(--rs-universe-scale, 1)));height:min(49vw,calc(390px * var(--rs-universe-scale, 1)))}
.universe .planet-track-music{width:min(55vw,calc(440px * var(--rs-universe-scale, 1)));height:min(52vw,calc(410px * var(--rs-universe-scale, 1)))}
.universe .planet{width:calc(145px * var(--rs-universe-scale, 1))}
@media(max-width:760px){
  .universe{height:calc(440px * var(--rs-universe-scale, 1));min-height:calc(440px * var(--rs-universe-scale, 1))}
  .universe .planet-track{width:calc(78vw * var(--rs-universe-scale, 1));height:calc(46vw * var(--rs-universe-scale, 1))}
  .universe .planet-track-dj{width:calc(73vw * var(--rs-universe-scale, 1));height:calc(40vw * var(--rs-universe-scale, 1))}
  .universe .planet-track-hybrid{width:calc(68vw * var(--rs-universe-scale, 1));height:calc(55vw * var(--rs-universe-scale, 1))}
  .universe .planet-track-music{width:calc(57vw * var(--rs-universe-scale, 1));height:calc(52vw * var(--rs-universe-scale, 1))}
  .universe .planet{width:calc(100px * var(--rs-universe-scale, 1))}
}

/* Photo grid: columns and the height of a tile. The every-third-photo cell
   spans two columns, never more than the grid actually has (the server
   prints --rs-gallery-wide-span together with the column count). ------- */
.photos{grid-template-columns:repeat(var(--rs-gallery-cols, 2),1fr)}
.photos .photo-placeholder.wide{grid-column:span var(--rs-gallery-wide-span, 2)}
.photos .photo-placeholder.is-photo{height:var(--rs-gallery-tile, 340px)}
.photos .photo-placeholder.is-photo.wide{height:calc(var(--rs-gallery-tile, 340px) * 280 / 340)}
@media(max-width:760px){
  .photos .photo-placeholder.is-photo,.photos .photo-placeholder.is-photo.wide{height:var(--rs-gallery-tile, 200px)}
}

/* Artist network and music cards: portraits / cards per row. ---------- */
.network-grid{grid-template-columns:repeat(var(--rs-network-cols, 3),minmax(0,1fr))}
.music-grid{grid-template-columns:repeat(var(--rs-music-cols, 3),1fr)}
@media(max-width:650px){
  .network-grid{grid-template-columns:repeat(var(--rs-network-cols, 2),minmax(0,1fr))}
}
@media(max-width:760px){
  .music-grid{grid-template-columns:repeat(var(--rs-music-cols, 1),1fr)}
}
@media(max-width:410px){
  .network-grid{grid-template-columns:repeat(var(--rs-network-cols, 1),minmax(0,1fr))}
}

/* Hidden sections: lib/responsive.js prints "#about{display:none}" (and the
   same for the other anchors) inside the media query of the device, so a
   hidden section never touches the other device. Nothing to add here. */