.hero-art{background:radial-gradient(ellipse at 50% 50%,rgba(var(--accent-rgb),.08),transparent 68%)}
.button:hover{box-shadow:0 8px 30px rgba(var(--accent-rgb),.2)}
.pointer-glow{position:fixed;left:0;top:0;width:240px;height:240px;margin:-120px;pointer-events:none;z-index:42;border-radius:50%;background:radial-gradient(circle,rgba(var(--accent-rgb),.022),transparent 65%);opacity:0;will-change:transform;transition:opacity .4s}
.has-pointer .pointer-glow{opacity:1}
.hero-art:after{content:'';position:absolute;inset:12% 5%;pointer-events:none;opacity:0;background:linear-gradient(transparent 48%,rgba(var(--accent-rgb),.25) 50%,transparent 52%);background-size:100% 200%;z-index:3}
.fox-mode .hero-art:after{opacity:1;animation:fox-scan 4s linear infinite}
.fox-mode .orbit-ring{opacity:.55;border-style:dashed}
.fox-mode .art-grid{opacity:.65}
.art-grid{translate:var(--grid-x,0px) var(--grid-y,0px);transition:translate .15s ease-out}
.studio-art:before{content:'';position:absolute;inset:-25%;background-image:linear-gradient(rgba(var(--accent-rgb),.09) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--accent-rgb),.09) 1px,transparent 1px);background-size:38px 38px;transform:perspective(600px) rotateX(25deg) translateY(var(--studio-grid,0px));mask-image:linear-gradient(transparent,#000 40%,transparent);pointer-events:none}
.studio-asterisk{translate:0 var(--studio-parallax,0px);will-change:translate}
.process-step{position:relative}.process-step:before{content:'';position:absolute;top:-1px;left:0;height:1px;width:0;background:var(--accent);box-shadow:0 0 10px rgba(var(--accent-rgb),.4);transition:width .8s ease .15s}.process-step.visible:before{width:100%}
.project-card{perspective:1000px}.project-art{transform:rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .25s ease-out;will-change:transform}
.project-art:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--spot-x,50%) var(--spot-y,50%),#ffffff28,transparent 55%);opacity:0;transition:opacity .25s;z-index:2}.project-card:hover .project-art:after{opacity:1}
.palette-modal{--bs-modal-width:470px;--bs-modal-bg:var(--bg);--bs-modal-color:var(--text);--bs-modal-border-color:var(--line);--bs-modal-border-radius:12px;--bs-modal-header-border-color:var(--line);--bs-modal-footer-border-color:var(--line);--bs-modal-margin:18px;z-index:1060}
.modal-backdrop{background:#061017;--bs-backdrop-opacity:.8;backdrop-filter:blur(8px)}
.palette-modal .modal-content{box-shadow:0 30px 120px #0006;overflow:hidden}
.palette-modal .modal-header{padding:26px 28px 20px;gap:15px;align-items:start}
.palette-modal .eyebrow{color:var(--accent-contrast,var(--accent));font-size:9px}
.palette-modal h2{font-size:32px;letter-spacing:-.05em;margin-top:10px}
.palette-close{border:0;font-size:28px;line-height:1;padding:0 4px;color:var(--text);margin-left:auto}
.palette-modal .modal-body{padding:20px 28px}.palette-modal p{font-size:12px;line-height:1.8}
.wheel-wrap{width:240px;height:240px;position:relative;margin:24px auto 20px}
#colour-wheel{width:100%;height:100%;border-radius:50%;touch-action:none;cursor:crosshair;display:block}
.wheel-marker{position:absolute;width:16px;height:16px;border:2px solid white;box-shadow:0 0 0 1px #0009,0 2px 6px #0007;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}
.brightness-label{display:flex;gap:18px;align-items:center;font-size:11px;color:var(--muted)}
#colour-brightness{width:100%;accent-color:var(--accent);min-width:0}
.palette-value{display:flex;align-items:center;gap:12px;margin-top:22px}.colour-preview{width:40px;height:40px;border-radius:8px;background:var(--accent);border:1px solid var(--line)}
.palette-value label{font-size:9px;letter-spacing:.08em;color:var(--muted);flex:1}.palette-value input[type=text],#colour-hex{display:block;background:none;border:0;border-bottom:1px solid var(--line);font-family:monospace;color:var(--text);width:100%;padding:4px 0;font-size:16px;letter-spacing:.06em}
#native-colour{width:32px;height:32px;padding:0;border:0;border-radius:5px;cursor:pointer;background:none}
.palette-swatches{display:flex;gap:15px;margin-top:22px;justify-content:center}.palette-swatches button{width:26px;height:26px;border-radius:50%;background:var(--swatch);border:2px solid var(--surface);box-shadow:0 0 0 1px var(--line);transition:transform .2s}.palette-swatches button:hover{transform:scale(1.15)}
.palette-modal .modal-footer{padding:18px 28px;justify-content:space-between;gap:15px}.palette-modal .modal-footer>*{margin:0}.palette-modal .text-link{font-size:10px}.palette-modal .button{font-size:11px;padding:12px 17px}
.palette-modal .text-link{border:0;border-bottom:1px solid var(--line);padding:8px 0}
#fox-canvas{translate:0 var(--hero-parallax,0px)}
@keyframes fox-scan{from{background-position:0 100%}to{background-position:0 -100%}}
@media(max-width:400px){.wheel-wrap{width:210px;height:210px}.palette-modal .modal-header,.palette-modal .modal-body,.palette-modal .modal-footer{padding-inline:20px}.palette-modal h2{font-size:29px}}
@media(hover:none){.pointer-glow{display:none}.project-art{transform:none}}
@media(prefers-reduced-motion:reduce){.pointer-glow{display:none}.studio-asterisk,.art-grid,#fox-canvas{translate:none!important}.studio-art:before{transform:none}.project-art{transform:none!important;will-change:auto}.fox-mode .hero-art:after{animation:none;opacity:.2}}
.brand .brand-mark{display:block;flex-shrink:0;background:none;border-radius:0;overflow:visible}
.brand-mark.logo-preview{background:none;display:block;overflow:visible}
.visual-definitions{position:absolute;pointer-events:none;overflow:hidden}
.site-header{isolation:isolate;box-shadow:inset 0 1px 0 #ffffff09,0 8px 35px #0000000d;-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) url('#header-lens') saturate(1.2)}
.site-header>.brand,.site-header>nav,.site-header>.header-actions{z-index:2}
.site-header>.brand,.site-header>.header-actions{position:relative}
.site-header:before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 190px 85px at var(--lens-x,50%) 50%,#ffffff0a,transparent 95%);mask-image:radial-gradient(ellipse 190px 85px at var(--lens-x,50%) 50%,#000 5%,transparent 100%)}
.site-header:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;border-block:1px solid transparent;border-image:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.18),#ffffff18,transparent) 1;box-shadow:inset 0 -10px 18px #ffffff02}
.studio-cursor{position:fixed;left:0;top:0;z-index:2147483646;width:26px;height:26px;margin:-13px;pointer-events:none;opacity:0;color:var(--accent-contrast,var(--accent));filter:drop-shadow(0 0 1px var(--bg));transition:opacity .15s}
.cursor-reticle{position:absolute;inset:3px;border:1px solid currentColor;clip-path:polygon(0 0,35% 0,35% 20%,65% 20%,65% 0,100% 0,100% 35%,80% 35%,80% 65%,100% 65%,100% 100%,65% 100%,65% 80%,35% 80%,35% 100%,0 100%,0 65%,20% 65%,20% 35%,0 35%);rotate:45deg;transition:inset .18s,rotate .25s}
.cursor-core{position:absolute;left:11px;top:11px;width:4px;height:4px;background:currentColor;border-radius:1px;rotate:45deg;transition:scale .18s}
.cursor-action .cursor-reticle{inset:0;rotate:0deg}.cursor-action .cursor-core{scale:.65}
.cursor-down .cursor-reticle{inset:6px}.cursor-down .cursor-core{scale:1.5}
#cursor-laser{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:2147483645}
.fox-companion{position:fixed;right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));width:190px;height:190px;z-index:1080;pointer-events:none;opacity:0;transform:translateY(20px) scale(.86);transform-origin:bottom right;transition:opacity .5s ease,transform .6s cubic-bezier(.2,.7,.2,1);contain:layout style}
.fox-companion.is-active{opacity:1;transform:translateY(0) scale(1)}
#companion-canvas{display:block;width:100%;height:100%;filter:drop-shadow(0 0 5px rgba(var(--accent-rgb),.18))}
#fox-canvas{transition:opacity .4s}.fox-docked #fox-canvas{opacity:0}
@media(pointer:fine) and (hover:hover){.custom-pointer.has-pointer .studio-cursor{opacity:1}.custom-pointer.has-pointer,.custom-pointer.has-pointer a,.custom-pointer.has-pointer button,.custom-pointer.has-pointer [role=button],.custom-pointer.has-pointer canvas{cursor:none}.custom-pointer.has-pointer input,.custom-pointer.has-pointer textarea,.custom-pointer.has-pointer select{cursor:auto}.custom-pointer.cursor-text .studio-cursor{opacity:0}}
@media(max-width:760px),(pointer:coarse),(hover:none){.fox-companion{display:none}.fox-docked #fox-canvas{opacity:1}}
@media(pointer:coarse),(hover:none){.studio-cursor,#cursor-laser{display:none}}
@media(prefers-reduced-motion:reduce){.studio-cursor,#cursor-laser{display:none!important}.fox-companion{transition:none;transform:none}.site-header:before{backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.custom-pointer.has-pointer,.custom-pointer.has-pointer a,.custom-pointer.has-pointer button,.custom-pointer.has-pointer canvas{cursor:auto}}
.custom-pointer:has(dialog[open]) .studio-cursor{opacity:0}.custom-pointer.has-pointer dialog,.custom-pointer.has-pointer dialog a,.custom-pointer.has-pointer dialog button{cursor:auto}
