/* Phase 1.1 — Creative Digital Studio motion layer; no external animation dependencies */
:root{--creative-ink:#0b1730;--creative-blue:#2563eb;--creative-mint:#10b981}
.scroll-progress{position:fixed;z-index:1200;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,#2563eb,#06b6d4,#10b981);transform:scaleX(0);transform-origin:left;pointer-events:none}
.ambient-cursor{position:fixed;z-index:0;width:360px;height:360px;left:0;top:0;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,.075),transparent 65%);pointer-events:none;transform:translate3d(-1000px,-1000px,0);will-change:transform}
.site-header{backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.creative-hero{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(140deg,#fff 0%,#f6faff 58%,#f0fdf8 100%)}
.creative-hero .container{position:relative;z-index:2}.hero-grid-lines{position:absolute;inset:0;z-index:-1;background-image:linear-gradient(to right,rgba(37,99,235,.04) 1px,transparent 1px),linear-gradient(to bottom,rgba(37,99,235,.04) 1px,transparent 1px);background-size:66px 66px;mask-image:linear-gradient(to right,transparent,#000 40%,#000 85%,transparent)}
.hero-glow{position:absolute;z-index:-1;filter:blur(18px);border-radius:50%;pointer-events:none;animation:glow-drift 14s ease-in-out infinite alternate}.hero-glow-one{width:390px;height:390px;right:-130px;top:4%;background:radial-gradient(circle,rgba(37,99,235,.16),transparent 67%)}.hero-glow-two{width:380px;height:380px;left:-200px;bottom:-130px;background:radial-gradient(circle,rgba(16,185,129,.13),transparent 65%);animation-delay:-7s}
.hero-copy{animation:hero-enter .85s cubic-bezier(.2,.7,.2,1) both}.hero-art{animation:hero-enter 1s .12s cubic-bezier(.2,.7,.2,1) both}.hero h1{letter-spacing:-.068em;line-height:1.07}.gradient-text,.gradient-text-alt{background:linear-gradient(110deg,#1d4ed8,#06b6d4,#059669);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradient-shift 8s ease-in-out infinite alternate}.gradient-text-alt{background-image:linear-gradient(110deg,#0f766e,#2563eb,#7c3aed)}
.studio-note{display:flex;gap:9px;align-items:center;margin-top:26px;font-size:10px;font-weight:800;letter-spacing:.16em;color:#64748b}.studio-note-mark{color:#2563eb;font-size:20px;line-height:1}.studio-note>span:not(.studio-note-mark){color:#10b981}
.creative-ribbon{background:#0b1730;color:#fff;overflow:hidden}.ribbon-content{display:flex;align-items:center;justify-content:center;gap:clamp(14px,3.5vw,48px);padding:20px 0;font-weight:800;font-size:clamp(11px,1.5vw,18px);letter-spacing:.12em;white-space:nowrap}.ribbon-star{color:#4adeb1;font-size:22px}
.creative-cards>*{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease;transform-style:preserve-3d}.creative-cards>*:hover{transform:translateY(-8px);box-shadow:0 24px 55px rgba(15,23,42,.11);border-color:rgba(37,99,235,.2)}
.btn{transition:transform .25s ease,box-shadow .25s ease,background-color .25s ease}.btn:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(37,99,235,.16)}.btn:focus-visible,.service-card:focus-visible,.product-card a:focus-visible{outline:3px solid #06b6d4;outline-offset:4px}
.dash-window{will-change:transform;animation:dashboard-float 7s ease-in-out infinite}.float-card{animation:card-float 6s ease-in-out infinite}.art-orb{animation:orb-pulse 9s ease-in-out infinite alternate}.bars b{transform-origin:bottom;animation:bar-rise 1.1s cubic-bezier(.2,.7,.2,1) both}.bars b:nth-child(2n){animation-delay:.18s}.bars b:nth-child(3n){animation-delay:.32s}
.js-motion .reveal{opacity:1;transform:none}.js-motion .reveal.is-visible{opacity:1;transform:none}
@keyframes hero-enter{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}@keyframes gradient-shift{from{background-position:0%}to{background-position:100%}}@keyframes glow-drift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(35px,-24px,0) scale(1.14)}}@keyframes dashboard-float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-11px) rotate(0deg)}}@keyframes card-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes orb-pulse{from{transform:scale(.92)}to{transform:scale(1.06)}}@keyframes bar-rise{from{transform:scaleY(.15);opacity:.4}to{transform:scaleY(1);opacity:1}}
@media(max-width:760px){.ribbon-content{gap:10px;letter-spacing:.04em}.ribbon-star{font-size:14px}.hero-glow-one{width:250px;height:250px}.ambient-cursor{display:none}.studio-note{flex-wrap:wrap}.creative-cards>*:hover{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.hero-glow,.hero-copy,.hero-art,.gradient-text,.gradient-text-alt,.dash-window,.float-card,.art-orb,.bars b{animation:none!important}.js-motion .reveal{opacity:1!important;transform:none!important;transition:none!important}.creative-cards>*:hover,.btn:hover{transform:none!important}.scroll-progress{transition:none!important}}
