/*
Theme Name: Sepyadamusic 3D Experience
Author: sepyadamusic
Description: Mobile-first 3D editorial music experience for sepyadamusic.
Version: 4.0.0
*/
:root{--ink:#071416;--muted:#416267;--paper:#eafffb;--aqua:#6de5df;--cyan:#9df7ef;--blue:#77bdf5;--line:rgba(7,20,22,.13);--glass:rgba(255,255,255,.34);--display:"Bristol AaBAg",Georgia,serif;--sans:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--ease:cubic-bezier(.2,.8,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:var(--sans);background:#dffbf7;overflow-x:hidden}body:before,body:after{content:"";position:fixed;z-index:-3;border-radius:50%;filter:blur(55px);pointer-events:none}.body{}body:before{width:55vw;height:55vw;left:-18vw;top:-10vw;background:rgba(91,224,216,.42);animation:blob 18s ease-in-out infinite alternate}body:after{width:52vw;height:52vw;right:-18vw;top:22vh;background:rgba(99,171,242,.32);animation:blob 22s ease-in-out infinite alternate-reverse}@keyframes blob{to{transform:translate(10vw,7vh) scale(1.15)}}a{color:inherit;text-decoration:none}button{font:inherit}
.site-header{position:fixed;top:14px;left:50%;transform:translateX(-50%);width:min(1180px,calc(100% - 28px));z-index:100;display:flex;align-items:center;justify-content:space-between;padding:9px 10px 9px 20px;border:1px solid rgba(255,255,255,.72);background:rgba(245,255,253,.56);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border-radius:22px;box-shadow:0 18px 50px rgba(17,88,96,.13)}.brand{font-weight:850;letter-spacing:-.055em;font-size:1.18rem}.menu-btn{width:48px;height:48px;border:1px solid rgba(255,255,255,.9);border-radius:16px;background:rgba(255,255,255,.5);cursor:pointer;position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.08)}.menu-lines,.menu-lines:before,.menu-lines:after{content:"";position:absolute;width:19px;height:2px;background:var(--ink);left:14px;top:23px;transition:.35s}.menu-lines:before{left:0;top:-7px}.menu-lines:after{left:0;top:7px}.menu-btn:hover .menu-lines{transform:rotate(90deg)}
.nav{position:fixed;inset:0;z-index:90;opacity:0;pointer-events:none;transition:.45s var(--ease)}.nav.open{opacity:1;pointer-events:auto}.nav-back{position:absolute;inset:0;background:rgba(2,20,23,.25);backdrop-filter:blur(16px)}.navbox{position:absolute;right:14px;top:14px;width:min(520px,calc(100% - 28px));height:calc(100% - 28px);padding:96px 34px 30px;border:1px solid rgba(255,255,255,.68);border-radius:32px;background:linear-gradient(145deg,rgba(235,255,252,.94),rgba(113,211,230,.78));box-shadow:0 45px 110px rgba(0,0,0,.27);transform:perspective(1300px) rotateY(-28deg) translateX(80px);transform-origin:right center;transition:.65s var(--ease);overflow:hidden}.nav.open .navbox{transform:perspective(1300px) rotateY(0) translateX(0)}.navbox:before{content:"";position:absolute;width:300px;height:300px;right:-120px;bottom:-100px;border-radius:50%;background:rgba(255,255,255,.32);filter:blur(4px)}.close{position:absolute;right:20px;top:20px;width:48px;height:48px;border:1px solid rgba(255,255,255,.75);border-radius:50%;background:rgba(255,255,255,.48);font-size:1.8rem;cursor:pointer}.navbox a{position:relative;display:flex;align-items:flex-end;justify-content:space-between;font-family:var(--display);font-size:clamp(2.4rem,8vw,5rem);line-height:.88;padding:19px 0;border-bottom:1px solid var(--line);transition:.35s}.navbox a:hover{transform:translateX(12px) skewX(-3deg)}.navbox small{font:700 .7rem var(--sans);letter-spacing:.18em;opacity:.6}
main{position:relative}.hero{min-height:100svh;padding:126px max(20px,5vw) 50px;display:grid;align-items:center;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;width:min(58vw,720px);height:min(58vw,720px);right:-13vw;top:17vh;border-radius:50%;background:rgba(255,255,255,.34);box-shadow:inset -35px -35px 90px rgba(75,164,185,.14),0 30px 90px rgba(60,140,160,.08);filter:blur(.3px);pointer-events:none}.hero-grid{width:min(1180px,100%);margin:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.82fr);gap:28px;align-items:center;position:relative;z-index:2}.eyebrow,.kicker{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:800;opacity:.64}.hero h1{font-family:var(--display);font-size:clamp(4.1rem,9.2vw,9.5rem);line-height:.79;letter-spacing:-.075em;margin:20px 0 28px;max-width:850px}.hero h1 span{display:block;margin-left:.12em}.copy{max-width:630px;font-size:clamp(1rem,1.65vw,1.22rem);line-height:1.58;color:#2e555b}.buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:999px;background:#071416;color:#fff;font-weight:750;box-shadow:0 14px 32px rgba(0,0,0,.14);transition:.3s var(--ease)}.btn:hover{transform:translateY(-3px)}.btn.alt{background:rgba(255,255,255,.48);color:var(--ink);border:1px solid rgba(255,255,255,.85);box-shadow:none}
.visual{min-height:520px;position:relative;display:grid;place-items:center;perspective:1400px}.orb{position:absolute;width:370px;height:370px;border-radius:50%;background:radial-gradient(circle at 32% 25%,rgba(255,255,255,.85),rgba(255,255,255,.14) 32%,rgba(82,193,205,.16) 60%,rgba(68,151,210,.12));box-shadow:inset -30px -30px 70px rgba(50,133,158,.13),0 35px 90px rgba(38,117,132,.12);animation:orb 8s ease-in-out infinite}.orb:after{content:"";position:absolute;inset:35px;border:1px solid rgba(255,255,255,.6);border-radius:50%;transform:translateZ(40px)}@keyframes orb{50%{transform:translateY(-14px) rotate(8deg)}}
.radio-wrap{position:relative;z-index:5;transform-style:preserve-3d;animation:radioFloat 5.5s ease-in-out infinite;transition:transform .2s ease}.radio{position:relative;width:min(390px,78vw);aspect-ratio:1.05/1;background:linear-gradient(145deg,#e6fffb 0%,#8ee7df 38%,#62aee7 100%);border-radius:38px;padding:34px;box-shadow:inset -25px -30px 65px rgba(27,96,119,.22),inset 14px 12px 30px rgba(255,255,255,.85),35px 45px 75px rgba(30,91,109,.25);transform:rotateX(8deg) rotateY(-14deg) rotateZ(2deg);transform-style:preserve-3d}.radio:before{content:"";position:absolute;inset:11px;border:1px solid rgba(255,255,255,.7);border-radius:29px;transform:translateZ(18px)}.radio:after{content:"";position:absolute;left:8%;right:8%;bottom:-22px;height:26px;border-radius:50%;background:rgba(27,94,110,.25);filter:blur(15px);transform:translateZ(-20px)}.antenna{position:absolute;width:170px;height:8px;top:17px;right:0;border-radius:10px;background:#557c84;transform:rotate(-20deg) translateZ(42px);box-shadow:0 5px 10px rgba(0,0,0,.2)}.screen{height:91px;border-radius:15px;background:linear-gradient(135deg,#193c42,#071a1d);box-shadow:inset 0 0 24px rgba(76,255,235,.15),0 12px 20px rgba(0,0,0,.15);transform:translateZ(38px);position:relative;overflow:hidden}.screen:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 48%,rgba(131,255,242,.07) 50%,transparent 52%);background-size:100% 10px;animation:scan 3s linear infinite}.screen:after{content:"SEPYADAMUSIC  /  DISCOVER";position:absolute;inset:0;display:grid;place-items:center;color:#a5fff4;font-size:.65rem;font-weight:700;letter-spacing:.16em}@keyframes scan{to{background-position:0 100px}}.dialrow{display:flex;gap:18px;align-items:center;margin:28px 0 20px;transform:translateZ(32px)}.knob{width:55px;height:55px;border-radius:50%;background:radial-gradient(circle at 33% 25%,#fff,#b7d7d7 35%,#5c7e84 37%,#23474e 68%,#16363b 100%);box-shadow:0 10px 17px rgba(0,0,0,.24);position:relative}.knob:after{content:"";position:absolute;left:50%;top:7px;width:3px;height:16px;background:#eaffff;transform:translateX(-50%);border-radius:3px}.tuner{height:9px;flex:1;border-radius:20px;background:repeating-linear-gradient(90deg,#1b4c54 0 3px,transparent 3px 17px);opacity:.7}.speaker{height:130px;border-radius:18px;background:radial-gradient(circle,#173b42 0 2px,transparent 3px);background-size:13px 13px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);transform:translateZ(24px)}@keyframes radioFloat{0%,100%{transform:translateY(0) rotateZ(0)}50%{transform:translateY(-15px) rotateZ(-1deg)}}
.float-disc{position:absolute;width:92px;height:92px;border-radius:50%;background:radial-gradient(circle,#071416 0 8%,#1b3034 9% 22%,#0a1518 23% 56%,#334c50 57% 60%,#071416 61%);box-shadow:0 22px 35px rgba(12,59,67,.2);transform-style:preserve-3d;animation:disc 9s linear infinite}.float-disc:after{content:"";position:absolute;inset:34px;border-radius:50%;background:#9cf4ea;box-shadow:0 0 0 4px #eafffb}.disc1{left:4%;top:12%;animation-duration:13s}.disc2{right:3%;bottom:9%;width:70px;height:70px;animation-duration:10s;animation-direction:reverse}@keyframes disc{to{transform:rotateX(68deg) rotateZ(360deg) translateY(-15px)}}
.ticker{width:100%;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.22);white-space:nowrap}.ticker-track{display:inline-flex;gap:36px;padding:13px 0;font-size:.68rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;animation:ticker 24s linear infinite}.ticker-dot{opacity:.35}@keyframes ticker{to{transform:translateX(-50%)}}
.section{width:min(1180px,calc(100% - 40px));margin:auto;padding:110px 0}.section h2{font-family:var(--display);font-size:clamp(3.4rem,7.2vw,7rem);line-height:.86;letter-spacing:-.065em;margin:14px 0 40px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px}.about-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:50px;align-items:start}.about-mark{font-size:clamp(5rem,13vw,10rem);font-weight:900;letter-spacing:-.1em;line-height:.7;opacity:.1}.about{font-size:clamp(1.06rem,1.9vw,1.4rem);line-height:1.72;color:#244b51}.about strong{color:var(--ink)}
.music-wrap{display:grid;grid-template-columns:.7fr 1.3fr;gap:24px;align-items:stretch}.music-card{border-radius:32px;padding:30px;background:linear-gradient(145deg,#071416,#174c55);color:#effffc;box-shadow:0 30px 80px rgba(10,68,76,.2);position:relative;overflow:hidden;transform-style:preserve-3d}.music-card:before{content:"";position:absolute;width:250px;height:250px;border-radius:50%;right:-80px;top:-80px;border:1px solid rgba(255,255,255,.25);box-shadow:0 0 0 25px rgba(255,255,255,.04),0 0 0 50px rgba(255,255,255,.03)}.music-card h3{font-family:var(--display);font-size:3rem;line-height:.9;margin:15px 0 25px}.music-card p{color:#b9dedb;line-height:1.6}.spotify{padding:18px;border:1px solid rgba(255,255,255,.65);background:rgba(255,255,255,.34);backdrop-filter:blur(20px);border-radius:32px;box-shadow:0 30px 80px rgba(19,87,94,.16)}.spotify iframe{display:block;width:100%;height:352px;border:0;border-radius:20px}.spotify-top{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:5px 5px 16px}.spotify-top b{font-size:.9rem}
.insta-shell{position:relative;border-radius:38px;padding:20px;background:linear-gradient(145deg,rgba(255,255,255,.56),rgba(107,206,222,.32));border:1px solid rgba(255,255,255,.75);box-shadow:0 35px 90px rgba(19,87,94,.16);perspective:1200px;transform-style:preserve-3d}.insta-card{min-height:470px;border-radius:29px;padding:22px;background:linear-gradient(135deg,rgba(5,28,32,.96),rgba(25,99,108,.92));color:#eaffff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 25px 50px rgba(0,0,0,.18);transform:rotateX(2deg) rotateY(-2deg);transform-style:preserve-3d;position:relative;overflow:hidden}.insta-card:before{content:"INSTAGRAM";position:absolute;right:22px;top:18px;font-size:.65rem;letter-spacing:.18em;opacity:.45}.insta-grid{height:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:13px;transform-style:preserve-3d}.post{min-height:125px;position:relative;border-radius:19px;overflow:hidden;background:linear-gradient(135deg,rgba(155,247,239,.9),rgba(91,168,232,.75));box-shadow:0 20px 35px rgba(0,0,0,.16);transform:translateZ(22px);transition:.35s var(--ease);display:flex;align-items:flex-end;padding:14px;color:#071416}.post:nth-child(2),.post:nth-child(5){transform:translateZ(35px) translateY(-8px)}.post:nth-child(3),.post:nth-child(6){transform:translateZ(48px) translateY(5px)}.post:hover{transform:translateZ(65px) rotateX(-3deg) rotateY(4deg) scale(1.035)}.post:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 18%,rgba(255,255,255,.9),transparent 22%),linear-gradient(145deg,transparent 35%,rgba(0,50,65,.35));mix-blend-mode:screen}.post:after{content:"";position:absolute;width:130px;height:130px;border-radius:50%;border:1px solid rgba(255,255,255,.55);right:-45px;bottom:-45px}.post b{position:relative;z-index:2;font-size:.78rem;letter-spacing:.1em}.insta-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:18px;color:#bfe9e7;font-size:.78rem}.insta-footer a{text-decoration:underline;text-underline-offset:4px}
.contact{padding:38px;border-radius:34px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(135deg,rgba(6,25,28,.96),rgba(22,91,102,.94));color:#eaffff;box-shadow:0 30px 80px rgba(14,71,80,.2)}.contact h2{margin-bottom:0}.contact a{font-weight:750;text-decoration:underline;text-underline-offset:5px}.footer{width:min(1180px,calc(100% - 40px));margin:auto;padding:28px 0 42px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;opacity:.6}
.reveal{opacity:0;transform:translateY(50px) scale(.98);transition:opacity .8s var(--ease),transform .9s var(--ease)}.reveal.visible{opacity:1;transform:none}.parallax{--py:0px;transform:translate3d(0,var(--py),0);will-change:transform}
@media(max-width:900px){.hero{padding-top:110px}.hero-grid{grid-template-columns:1fr;gap:0}.hero h1{font-size:clamp(4rem,15vw,7.5rem);max-width:700px}.visual{min-height:460px;margin-top:-5px}.orb{width:330px;height:330px}.radio{width:min(365px,88vw)}.float-disc{width:70px;height:70px}.disc2{width:56px;height:56px}.about-layout,.music-wrap{grid-template-columns:1fr}.about-mark{display:none}.section{padding:85px 0}.music-card{min-height:250px}.insta-card{min-height:390px}}
@media(max-width:560px){.site-header{top:9px;width:calc(100% - 18px);padding-left:15px}.menu-btn{width:44px;height:44px}.menu-lines,.menu-lines:before,.menu-lines:after{left:12px;top:21px}.hero{padding:96px 16px 25px;min-height:auto}.hero-grid{display:block}.eyebrow{font-size:.62rem}.hero h1{font-size:clamp(3.6rem,16.8vw,5.6rem);line-height:.82;margin:17px 0 20px}.copy{font-size:1rem;line-height:1.52}.buttons{margin-top:22px}.btn{min-height:45px;padding:0 17px}.visual{min-height:385px;margin-top:8px}.orb{width:280px;height:280px}.radio{width:min(330px,88vw);padding:27px;border-radius:30px}.screen{height:72px}.dialrow{margin:21px 0 15px}.knob{width:47px;height:47px}.speaker{height:100px}.antenna{width:130px}.float-disc{display:none}.ticker-track{font-size:.6rem;gap:24px}.section{width:calc(100% - 28px);padding:70px 0}.section h2{font-size:clamp(3rem,14vw,5rem);margin-bottom:30px}.section-head{align-items:flex-start;flex-direction:column}.about{font-size:1rem;line-height:1.68}.music-card{padding:24px;border-radius:26px}.music-card h3{font-size:2.5rem}.spotify{padding:10px;border-radius:25px}.spotify iframe{height:352px}.spotify-top{padding:4px 4px 12px}.insta-shell{padding:10px;border-radius:28px}.insta-card{min-height:340px;padding:13px;border-radius:22px}.insta-grid{gap:7px}.post{min-height:100px;border-radius:13px;padding:9px}.post:nth-child(2),.post:nth-child(5){transform:translateZ(28px) translateY(-5px)}.post:nth-child(3),.post:nth-child(6){transform:translateZ(35px) translateY(3px)}.insta-footer{font-size:.68rem}.contact{padding:27px;border-radius:27px;display:block}.contact a{display:inline-block;margin-top:22px}.footer{width:calc(100% - 28px);font-size:.62rem}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition:none!important}}
