/* 26 September: a brighter, tactile studio identity and reactive brand world. */
:root{--scene-glow:#9e57ff;--accent:#b9ff6c;--studio-lilac:#ca9dff}
body{background:#110f1c}body:before{height:1600px;background:radial-gradient(ellipse at 90% 20%,#6720b437,transparent 46%),radial-gradient(ellipse at 0 60%,#075e6430,transparent 46%)}
.studio-header{background:#110f1ced;border-bottom-color:#b786ff25}.studio-brand{width:192px;transition:filter .25s,transform .25s}.studio-brand:hover{filter:drop-shadow(0 0 10px #f86ff866);transform:rotate(-3deg) scale(1.04)}.studio-brand img{filter:drop-shadow(0 3px 0 #08050e)}
.home-hero{position:relative}.home-hero h1 em{background:linear-gradient(105deg,#ff90da,#c298ff 46%,#65dfff);background-clip:text;-webkit-background-clip:text;color:transparent}.hero-layout{grid-template-columns:1.06fr 1fr;gap:24px}.hero-topline .live-dot{box-shadow:0 0 16px #aaff6399}.button.yellow,.nav-brief{box-shadow:0 5px 0 #52672c;transition:box-shadow .2s,transform .2s,background .3s}.button.yellow:hover,.nav-brief:hover{transform:translateY(-3px);box-shadow:0 8px 0 #52672c,0 10px 30px #b9ff6c20}.button.yellow:active,.nav-brief:active{transform:translateY(3px);box-shadow:0 2px 0 #52672c}.text-link:hover{color:#ff9ada}.studio-ticker{background:linear-gradient(100deg,#ffa9cf,#c5a1ff 40%,#8edff0 75%,#cafa87)}
.brand-reactor{height:580px;position:relative;isolation:isolate;overflow:clip;--look-x:0px;--look-y:0px;--brand-tilt:0deg;min-width:0}#brand-canvas{position:absolute;width:100%;height:100%;inset:0;pointer-events:none}.reactor-orbit{position:absolute;inset:17% 7% 23%;border:1px dashed #b5a0fa45;border-radius:50%;rotate:-22deg;animation:turn 90s linear infinite}.reactor-logo{position:absolute;left:3%;top:38%;width:94%;padding:0;background:none;transform:rotate(-7deg) rotateY(var(--brand-tilt));z-index:3;transition:transform .3s;animation:brand-bob 7s ease-in-out infinite}.reactor-logo img{width:100%;filter:drop-shadow(0 12px 0 #18072b) drop-shadow(0 15px 35px #9a50ff45)}.reactor-logo>span{display:block;font-size:8px;letter-spacing:.22em;color:#f8e5ff;margin-top:19px}.reactor-logo:hover{filter:brightness(1.12)}.reactor-logo:focus-visible{outline-offset:12px;border-radius:8px}.reactor-sticker{position:absolute;z-index:4;font-family:Display;line-height:1.3;letter-spacing:-.02em;padding:15px 19px;border-radius:12px;box-shadow:5px 6px 0 #0004;font-size:15px;animation:float 6s ease-in-out infinite}.sticker-create{left:5%;top:10%;background:#ffa6d5;color:#481b4c;transform:rotate(-9deg)}.sticker-feel{right:3%;bottom:26%;background:#b7e8ff;color:#173a52;transform:rotate(8deg);animation-delay:-3s}.joy-creature{position:absolute;right:11%;top:12%;width:91px;height:84px;border-radius:40% 55% 38% 50%;background:linear-gradient(135deg,#e6ff7c,#89e84a);box-shadow:inset -8px -8px 0 #50731325,5px 7px 0 #1c122a;rotate:12deg;display:flex;justify-content:center;gap:13px;align-items:center;animation:float 4s ease-in-out infinite}.joy-creature i{width:10px;height:16px;background:#272047;border-radius:50%;translate:var(--look-x) var(--look-y)}.joy-creature i:before{content:'';display:block;width:3px;height:4px;border-radius:50%;background:white;margin:2px}.joy-creature b{position:absolute;bottom:15px;width:19px;height:9px;border-bottom:3px solid #29204a;border-radius:50%;translate:var(--look-x) 0}.joy-creature:before,.joy-creature:after{content:'';position:absolute;width:13px;height:7px;background:#ff8c94;border-radius:50%;top:48px}.joy-creature:before{left:12px}.joy-creature:after{right:12px}.reactor-controls{position:absolute;bottom:10%;display:flex;justify-content:center;gap:9px;left:0;right:0;z-index:5}.reactor-controls button{background:#252036;border:1px solid #746082;border-radius:30px;padding:10px 15px;font-size:11px;min-height:40px}.reactor-controls button[aria-pressed=true]{background:var(--accent);color:#201b31;border-color:var(--accent)}.reactor-controls button:hover{border-color:#ffe7fb}.reactor-hint{position:absolute;bottom:2%;left:8%;right:8%;text-align:center;font-size:10px;color:#cfc2dd;min-height:30px}.brand-reactor[data-scene=dreamy] .joy-creature{background:linear-gradient(135deg,#fac9ff,#b58aff)}.brand-reactor[data-scene=sunny] .joy-creature{background:linear-gradient(135deg,#fff2a0,#ffb64e)}.remixing .reactor-logo img{animation:remix-pop .7s cubic-bezier(.2,.8,.3,1)}@keyframes brand-bob{50%{translate:0 -13px}}@keyframes remix-pop{0%{scale:1}40%{scale:1.1;rotate:3deg}70%{scale:.97;rotate:-1deg}100%{scale:1;rotate:0deg}}
.feature-card,.work-card,.brief-panel{--light-x:50%;--light-y:40%;position:relative}.feature-card:after,.work-card:after{content:'';position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(300px circle at var(--light-x) var(--light-y),#fff2,transparent 65%);transition:opacity .3s;border-radius:inherit}.feature-card:hover:after,.work-card:hover:after{opacity:1}.feature-card.lime{background:linear-gradient(135deg,#e5ffa9,#a9eac0)}.feature-card.lilac{background:linear-gradient(135deg,#f2baff,#bbadff)}.feature-card.peach{background:linear-gradient(135deg,#ffdeb0,#ffaabc)}.feature-card .card-number{transition:transform .4s cubic-bezier(.2,.8,.3,1)}.feature-card:hover .card-number{transform:rotate(-12deg) scale(1.15)}.cream-section{background:radial-gradient(ellipse at 0 0,#ffd5bc77,transparent 50%),radial-gradient(ellipse at 100% 100%,#d8c2ff66,transparent 50%),#f5f0e7}.studio-strip{background:linear-gradient(125deg,#e8fba8,#a5e7da)}.big-cta{border-image:linear-gradient(90deg,#ff75bd,#b08fff,#6cdfff,#c7f78c) 1}.big-cta h2 em{background:linear-gradient(90deg,#ff9fd2,#ba9cff,#70dcec);background-clip:text;-webkit-background-clip:text;color:transparent}.footer-top img{width:290px}.service-art{box-shadow:inset 0 0 80px #fff2}.service-art>span{filter:drop-shadow(5px 6px 0 #fff4)}.reading-progress{position:fixed;top:0;left:0;width:100%;height:3px;z-index:70;transform-origin:left;background:linear-gradient(90deg,#ff3986,#ffcf4b,#9df260,#39d8ff,#b47bff);pointer-events:none}
.idea-mixer{display:grid;grid-template-columns:1fr 1fr;gap:75px;margin-top:90px;padding:55px;border:1px solid #bc86e74d;border-radius:24px;background:radial-gradient(ellipse at 100% 100%,#7531ac25,transparent 65%),#1c1729}.idea-mixer h2{margin:19px 0 24px}.idea-mixer>div>p:not(.eyebrow){font-size:14px;color:var(--muted)}.mixer-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:27px 0}.mixer-fields label{font-size:12px}.mixer-fields select{width:100%;margin-top:10px;background:#100d1a;color:#f9f1ff;border:1px solid #796085;border-radius:10px;padding:12px;font:12px Body;min-height:46px}.idea-result{background:linear-gradient(135deg,#e9bdff,#b9c2ff);border-radius:20px;padding:36px;color:#33203e;align-self:center;box-shadow:7px 8px 0 #0c091555;transform:rotate(2deg)}.idea-result .eyebrow{color:#613969}.idea-icon{font:60px/1 Arial;display:block;margin-bottom:20px;color:#8051c0}.idea-result h3{font-size:35px;margin:16px 0}.idea-result #idea-description{font-size:15px;color:#49315b;line-height:1.8}.idea-result a{font-weight:bold;margin:15px 0;color:#33203e}.idea-result .tiny{font-size:10px;color:#554164}.idea-result[data-vibe=bold]{background:linear-gradient(135deg,#ffd68b,#ffaabd)}.idea-result[data-vibe=playful]{background:linear-gradient(135deg,#edffa9,#a5eecb)}.idea-pop{animation:idea-pop .5s ease-out}@keyframes idea-pop{0%{translate:0 10px;rotate:-3deg}100%{translate:0 0;rotate:0deg}}
.paused .reactor-logo,.paused .reactor-orbit,.paused .reactor-sticker,.paused .joy-creature{animation-play-state:paused!important}.page-hidden *{animation-play-state:paused!important}
.reactor-sticker{font-family:Display,Arial,sans-serif;font-weight:700}
.reactor-sleep *{animation-play-state:paused!important}.idea-mixer .idea-result .tiny{color:#594068}
@media(max-width:1200px){.studio-brand{width:160px}.brand-reactor{height:550px}.reactor-sticker{font-size:12px;padding:12px 15px}.joy-creature{width:76px;height:73px;right:8%}.idea-mixer{padding:38px;gap:40px}.mixer-fields{grid-template-columns:1fr;gap:15px}}
@media(max-width:1000px){.brand-reactor{height:500px}.reactor-logo{top:39%}.reactor-controls{gap:6px}.reactor-controls button{padding:9px 10px;font-size:10px}.reactor-sticker{font-size:11px}.joy-creature{right:9%;top:14%;width:66px;height:64px}.joy-creature i{height:13px;width:8px}.joy-creature:before,.joy-creature:after{top:38px}.joy-creature b{bottom:10px}.reactor-logo>span{font-size:6px}.idea-result{padding:25px}.idea-result h3{font-size:28px}}
@media(max-width:760px){.hero-layout{grid-template-columns:1fr}.brand-reactor{height:480px;width:min(530px,100%);margin:auto}.reactor-logo{top:37%}.reactor-logo>span{font-size:8px}.sticker-create{top:7%}.sticker-feel{bottom:26%}.reactor-sticker{font-size:13px}.joy-creature{width:77px;height:74px;top:11%;right:10%}.reactor-controls button{font-size:11px;padding:10px 14px}.reactor-controls{bottom:10%}.reactor-hint{bottom:0}.idea-mixer{grid-template-columns:1fr;padding:30px 25px;gap:35px;margin-top:60px}.mixer-fields{grid-template-columns:1fr 1fr}.idea-result{padding:30px;transform:rotate(1deg)}.idea-result h3{font-size:32px}.studio-brand{width:175px}.footer-top img{width:270px}}
@media(max-width:440px){.studio-brand{width:135px}.brand-reactor{height:410px}.reactor-sticker{font-size:10px;padding:11px 12px}.sticker-create{top:9%;left:3%}.sticker-feel{bottom:27%;right:4%}.joy-creature{width:65px;height:62px;top:11%;right:11%}.reactor-logo>span{font-size:6px;letter-spacing:.14em;margin-top:15px}.reactor-controls{gap:6px;bottom:11%}.reactor-controls button{font-size:10px;padding:9px 11px}.reactor-hint{font-size:9px;bottom:0}.mixer-fields{grid-template-columns:1fr}.idea-result{padding:25px}.idea-result h3{font-size:29px}.idea-mixer{padding:27px 20px}.footer-top img{width:240px}}
@media(max-width:360px){.studio-brand{width:110px}.reactor-controls button{font-size:9px;padding:9px 10px}.brand-reactor{height:380px}.joy-creature{width:57px;height:57px;right:9%}.reactor-sticker{font-size:9px}.reactor-logo>span{font-size:5px}}
@media(prefers-reduced-motion:reduce){.reactor-logo,.reactor-orbit,.reactor-sticker,.joy-creature{animation:none!important}.reactor-logo{transform:rotate(-7deg)}.studio-brand:hover,.button.yellow:hover,.nav-brief:hover{transform:none}.feature-card:hover .card-number{transform:none}}
