/* Twisted360 color system: electric, layered, and responsive. */
body{background:radial-gradient(circle at 8% 8%,rgba(247,223,66,.22),transparent 24rem),radial-gradient(circle at 94% 36%,rgba(94,217,240,.2),transparent 28rem),var(--paper)}
.site-header{box-shadow:0 8px 28px rgba(17,17,20,.08)}
.brand-logo{display:block;width:112px;height:64px;object-fit:contain;filter:drop-shadow(0 5px 0 rgba(17,17,20,.12));transition:transform .25s ease}.brand:hover .brand-logo{transform:rotate(-3deg) scale(1.05)}
.hero{position:relative;background:linear-gradient(135deg,rgba(255,255,255,.36),rgba(247,223,66,.12) 45%,rgba(255,104,169,.12));border-bottom:12px solid var(--ink)}
.hero:before,.hero:after{content:"";position:absolute;z-index:0;pointer-events:none;border-radius:999px;mix-blend-mode:multiply}.hero:before{width:260px;height:70px;right:-45px;top:95px;background:var(--pink);transform:rotate(-19deg)}.hero:after{width:170px;height:38px;left:-45px;bottom:90px;background:var(--purple);transform:rotate(24deg)}.hero-copy,.hero-art{position:relative;z-index:1}
.hero h1{text-shadow:4px 4px 0 rgba(247,223,66,.7)}.hero h1 em{color:var(--pink);text-shadow:3px 3px 0 var(--blue)}
.hero-art{isolation:isolate}.hero-logo{position:absolute;z-index:2;width:min(290px,58%);height:auto;left:50%;top:49%;transform:translate(-50%,-50%) rotate(-6deg);filter:drop-shadow(8px 10px 0 rgba(17,17,20,.35));animation:logo-float 5s ease-in-out infinite}.burst-three{position:absolute;width:120px;height:120px;right:3%;bottom:3%;background:var(--pink);border-radius:50%;opacity:.85}.burst-one{animation:orbit-one 8s ease-in-out infinite}.burst-two{animation:orbit-two 7s ease-in-out infinite}
.sticker{z-index:3;transition:transform .25s ease,box-shadow .25s ease}.sticker:hover{transform:rotate(0) translateY(-7px)!important;box-shadow:10px 13px 0 var(--ink)}
.service-card{position:relative;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease;border:2px solid var(--ink)}.service-card:after{content:"✦";position:absolute;right:14px;top:10px;font-size:28px;opacity:.25}.service-card:nth-child(2){background:var(--pink)}.service-card:nth-child(3){background:var(--blue)}.service-card:nth-child(4){background:var(--purple);color:white}.service-card:nth-child(4) a{color:white}.service-card:hover{transform:translateY(-8px) rotate(-1deg);box-shadow:8px 10px 0 var(--ink)}
.work-section{position:relative;overflow:hidden;background:linear-gradient(120deg,#111114 0%,#271d48 52%,#111114 100%)}.work-section:after{content:"";position:absolute;width:340px;height:340px;border-radius:50%;background:var(--pink);opacity:.16;right:-80px;bottom:-140px}.work-card{transition:transform .25s ease,filter .25s ease}.work-card:hover{transform:translateY(-8px) rotate(1deg);filter:saturate(1.2)}
.process{background:linear-gradient(180deg,rgba(94,217,240,.1),transparent)}.process-grid>div{padding:24px;border:2px solid var(--ink);background:rgba(255,255,255,.55);box-shadow:6px 7px 0 var(--yellow);transition:transform .25s ease}.process-grid>div:nth-child(2){box-shadow:6px 7px 0 var(--pink)}.process-grid>div:nth-child(3){box-shadow:6px 7px 0 var(--blue)}.process-grid>div:hover{transform:translateY(-6px)}
.quote-section{position:relative;overflow:hidden;background:linear-gradient(125deg,var(--pink),#ff8b72 55%,var(--yellow))}.quote-section:after{content:"S!";position:absolute;right:5%;top:4%;font:700 180px/.8 'Space Grotesk';color:rgba(255,255,255,.23);transform:rotate(12deg);pointer-events:none}.quote-intro,.quote-form{position:relative;z-index:1}.quote-form{border:3px solid var(--ink);box-shadow:10px 10px 0 var(--ink)}
.site-footer{background:var(--ink);color:white;border-top:0}.site-footer p{color:#d9d5ca}.site-footer a{color:var(--yellow)}
@keyframes logo-float{0%,100%{margin-top:0}50%{margin-top:-13px}}@keyframes orbit-one{50%{transform:translate(14px,8px) scale(1.05)}}@keyframes orbit-two{50%{transform:translate(-11px,-8px) scale(.94)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:600px){.brand-logo{width:92px;height:55px}.hero{border-bottom-width:8px}.hero-art{height:315px}.hero-logo{width:235px}.hero:before{top:35px}.hero:after{bottom:35px}.quote-section:after{font-size:110px;top:2%}.process-grid>div{padding:20px}}