@view-transition{navigation:none}
:root{--pink:#ea1f54;--blue:#006caf;--ink:#101011;--paper:#f3f1ed;--muted:#a5a4a6;--gutter:clamp(24px,5vw,84px);color-scheme:dark;font-family:Arial,Helvetica,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:94px}body{margin:0;background:var(--ink);color:var(--paper)}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button{color:inherit}img,video{display:block;max-width:100%}img{height:auto}button{border:0}h1,h2,h3,p{margin:0}h1,h2{font-weight:500;letter-spacing:-.065em;line-height:1.02}h2{font-size:clamp(46px,6.9vw,112px)}em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.065em}p{line-height:1.6}::selection{background:var(--pink);color:white}:focus-visible{outline:3px solid #fa779b;outline-offset:6px}.skip{position:fixed;top:5px;left:20px;transform:translateY(-200%);z-index:99;background:var(--paper);color:var(--ink);padding:15px}.skip:focus{transform:none}.header{height:92px;position:absolute;top:0;left:0;width:100%;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:0 var(--gutter);border-bottom:1px solid #ffffff25}.brand{display:block;width:205px;min-width:160px}.brand img{width:100%;height:auto;filter:brightness(0) invert(1)}.header nav{display:flex;align-items:center;gap:32px;font-size:13px}.header nav a{padding:10px 0;position:relative}.header nav a::after{content:'';position:absolute;bottom:3px;left:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s}.header nav a:hover::after{transform:scaleX(1)}.nav-contact span{margin-left:24px}.menu-toggle{display:none;background:none;padding:10px}.hero{height:max(850px,100svh);max-height:1200px;position:relative;overflow:hidden}.hero-media,.hero-shade{position:absolute;inset:0}.hero-media img,.hero-media video{width:100%;height:100%;object-fit:cover}.hero-media video{position:absolute;inset:0;opacity:0;transition:opacity .8s}.hero-media video.ready{opacity:1}.hero-media{transform:scale(calc(1 + var(--hero-progress,0)*.07))}.hero-shade{background:linear-gradient(90deg,#08080bce 0%,#08080b88 50%,#08080b36),linear-gradient(0deg,#101011 0%,transparent 35%,#08080b40 100%)}.hero-content{position:relative;z-index:1;padding:160px var(--gutter) 110px;height:100%;display:flex;flex-direction:column;justify-content:center}.eyebrow{font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:1.8px;line-height:1.5;display:flex;align-items:center;gap:10px}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--pink);box-shadow:0 0 0 4px #ea1f541b}.hero h1{font-size:clamp(76px,9.5vw,166px);margin-top:34px;max-width:1000px;line-height:.93;animation:enter .9s both}.hero h1 em{color:#fff}.hero-bottom{display:flex;align-items:end;justify-content:space-between;margin-top:42px;gap:30px}.hero-bottom p{font-size:14px;max-width:470px;color:#e1dedb}.round-link{display:flex;gap:20px;align-items:center;font-size:12px}.circle-arrow{width:56px;height:56px;border:1px solid #ffffff70;border-radius:50%;display:grid;place-items:center;font-size:23px;transition:background .25s,transform .25s}.round-link:hover .circle-arrow{background:var(--pink);border-color:var(--pink);transform:translateY(5px)}.hero-meta{position:absolute;bottom:27px;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;font-size:10px;text-transform:uppercase;letter-spacing:1.2px}.hero-meta a{color:#d2cbcb}.section-pad{padding:110px var(--gutter)}.section-top{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:68px}.small-label{font-size:11px;letter-spacing:.3px;line-height:1.5}.section-top .small-label{color:var(--muted)}.intro{padding-bottom:65px}.intro-copy{display:flex;justify-content:space-between;align-items:end;gap:70px}.intro-copy h2{font-size:clamp(44px,5.6vw,90px)}.intro-copy>p{max-width:345px;color:#b9b7b7;font-size:15px}.orbit{position:relative;height:650px;max-width:1150px;margin:65px auto 0;isolation:isolate}.orbit-lines{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#ffffff13;stroke-width:1}.orbit-lines path{stroke-dasharray:3 6}.orbit-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}.orbit-core>span{display:block;font-size:clamp(32px,3.3vw,57px);font-weight:700;letter-spacing:-2px}.orbit-core>em{display:block;font-size:clamp(56px,5.5vw,85px);color:var(--pink);line-height:1}.orbit-core small{display:block;margin-top:20px;font-size:10px;color:#a5a4a6}.orbital{position:absolute;width:clamp(145px,15vw,225px);left:50%;top:50%;transform:translate(calc(-50% + var(--x,0px)),calc(-50% + var(--y,0px)));z-index:1;transition:filter .25s}.orbital img{width:100%;aspect-ratio:1.45;object-fit:cover;filter:brightness(.85);transition:filter .3s,transform .3s}.orbital span{display:flex;justify-content:space-between;font-size:11px;padding-top:9px;color:#bdbdbd}.orbital b{font-size:15px;font-weight:400}.orbital:hover,.orbital:focus-visible{z-index:3}.orbital:hover img,.orbital:focus-visible img{filter:brightness(1.1);transform:scale(1.05)}.orbital:nth-of-type(1){--x:340px;--y:0px}.orbital:nth-of-type(2){--x:170px;--y:210px}.orbital:nth-of-type(3){--x:-170px;--y:210px}.orbital:nth-of-type(4){--x:-340px;--y:0px}.orbital:nth-of-type(5){--x:-170px;--y:-210px}.orbital:nth-of-type(6){--x:170px;--y:-210px}.orbit-foot{display:flex;justify-content:space-between;font-size:11px;color:#b9b7b7;border-top:1px solid #ffffff22;padding-top:24px}.text-button{background:none;padding:0 0 5px;border-bottom:1px solid currentColor;font-size:12px;display:inline-flex;gap:24px;align-items:center}.work{padding-top:90px}.work-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:70px}.work-heading>p{font-size:14px;color:#b9b7b7;padding-bottom:10px}.work h2 em{color:var(--pink)}.projects{display:grid;grid-template-columns:1fr 1fr;gap:90px 40px}.project:nth-child(even){transform:translateY(105px)}.project:last-child{margin-bottom:105px}.project-photo{aspect-ratio:1.16;overflow:hidden;position:relative}.project-photo img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}.project:hover .project-photo img{transform:scale(1.05)}.project-open{position:absolute;right:18px;bottom:18px;background:var(--paper);color:var(--ink);width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:22px;transition:background .25s}.project:hover .project-open{background:var(--pink);color:white}.project-caption{display:flex;justify-content:space-between;align-items:start;gap:20px;padding-top:20px}.project h3{font-size:21px;font-weight:500;letter-spacing:-.5px}.project-caption>span{font-size:10px;color:#b9b7b7;padding-top:6px}.light-section{background:var(--paper);color:var(--ink);color-scheme:light}.light-section .small-label{color:#5a5858}.services h2{margin-bottom:70px}.services h2 em{color:var(--blue)}.service-layout{display:grid;grid-template-columns:.85fr 1fr;gap:90px;align-items:start}.service-visual{position:sticky;top:90px}.service-visual img{width:100%;aspect-ratio:.95;object-fit:cover;transition:opacity .15s}.service-visual>span{display:block;font-size:10px;margin-top:17px;text-transform:uppercase;letter-spacing:1px}.service-list{border-top:1px solid #151515}.service-list details{border-bottom:1px solid #15151530}.service-list summary{display:flex;align-items:center;list-style:none;padding:25px 0;gap:20px;cursor:pointer}.service-list summary::-webkit-details-marker{display:none}.service-list h3{font-size:clamp(20px,2.1vw,32px);font-weight:500;letter-spacing:-1px}.number{font-size:10px;min-width:25px}.detail-plus{margin-left:auto;font-size:24px;transition:transform .3s}.service-list details[open] .detail-plus{transform:rotate(45deg)}.detail-copy{padding:0 28px 30px 45px}.detail-copy p{font-size:14px;color:#4f4f4f;max-width:370px}.detail-copy ul{list-style:none;font-size:12px;margin:22px 0 0;padding:0;line-height:2}.detail-copy li::before{content:'— ';color:var(--blue)}.method{background:var(--pink);color:var(--paper);position:relative;overflow:hidden;padding-bottom:0}.method .small-label{color:white}.method h2{font-size:clamp(44px,6vw,96px)}.method-bottom{display:grid;grid-template-columns:.8fr 1fr;gap:140px;margin-top:90px}.method-bottom>p{max-width:320px;font-size:18px}.steps{display:flex;flex-direction:column;gap:32px}.step{display:grid;grid-template-columns:25px 1fr;column-gap:22px;border-bottom:1px solid #ffffff40;padding-bottom:28px}.step>span{font-size:11px;padding-top:7px}.step h3{font-size:28px;letter-spacing:-1px;font-weight:500}.step p{grid-column:2;font-size:12px;margin-top:10px;opacity:.9}.method-word{font-size:clamp(80px,16vw,270px);font-weight:700;white-space:nowrap;letter-spacing:-.07em;line-height:1;margin:90px 0 -25px;color:#ffffff28;transform:translateX(calc(var(--method-shift,0)*-1px))}.reel-section{padding-bottom:110px}.reel-launch{display:block;width:100%;position:relative;background:transparent;padding:0;text-align:left;overflow:hidden}.reel-launch>img{width:100%;aspect-ratio:2.1;object-fit:cover;filter:brightness(.45);transition:transform .7s}.reel-launch:hover>img{transform:scale(1.03)}.reel-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center}.play-icon{width:58px;height:58px;border:1px solid #ffffff70;border-radius:50%;display:grid;place-items:center;font-size:16px;padding-left:3px}.reel-overlay #reel-title{font-size:clamp(32px,4vw,68px);line-height:1.03;letter-spacing:-2px}.reel-overlay>small{font-size:10px;letter-spacing:1px}.contact h2{font-size:clamp(50px,8vw,130px)}.contact h2 em{color:var(--blue)}.contact-bottom{display:flex;justify-content:space-between;align-items:start;margin-top:70px;gap:40px}.contact-bottom>p{font-size:14px;color:#5a5858}.contact-actions{min-width:300px;display:flex;flex-direction:column;align-items:start;gap:22px}.contact-phone{font-size:28px;letter-spacing:-.8px;border-bottom:1px solid #1a1a1a40;padding-bottom:14px;width:100%;display:flex;justify-content:space-between;gap:30px}.dark-button{font-size:14px}.footer{padding:50px var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:30px;font-size:10px}.footer .brand{width:180px}.prototype-label{color:#858589}.footer>a:last-child{white-space:nowrap}.js-motion .reveal{opacity:0;translate:0 20px;transition:opacity .7s,translate .7s}.js-motion .reveal.visible{opacity:1;translate:0 0}.case-main{padding-top:140px}.case-back{display:inline-flex;align-items:center;gap:15px;font-size:12px;margin-bottom:50px}.case-title{font-size:clamp(60px,8vw,140px);margin:28px 0 50px}.case-hero{width:100%;max-height:760px;object-fit:cover;view-transition-name:case-image}.case-layout{display:grid;grid-template-columns:1fr 1fr;gap:100px;padding:70px 0}.case-layout h2{font-size:clamp(36px,4vw,60px)}.case-copy>p{font-size:18px;line-height:1.6;margin-bottom:30px;color:#b9b7b7}.case-tags{display:flex;flex-wrap:wrap;gap:8px}.case-tags span{font-size:12px;border-bottom:1px solid #ffffff50;padding:8px 0;margin-right:15px}.case-nav{border-top:1px solid #ffffff30;padding-top:30px;margin-top:20px;display:flex;justify-content:space-between;font-size:13px}.case-note{font-size:11px;color:#969398;margin-top:40px;line-height:1.6;max-width:650px}dialog{background:var(--paper);color:var(--ink);border:0;padding:32px;width:min(840px,calc(100% - 32px));max-height:90svh;overflow:auto;color-scheme:light}dialog::backdrop{background:#000c;backdrop-filter:blur(10px)}.dialog-top{display:flex;justify-content:space-between;align-items:start;gap:25px;margin-bottom:20px}.dialog-top h2{font-size:30px;letter-spacing:-1.1px}.dialog-top button{background:none;white-space:nowrap;font-size:12px;padding:7px 0}dialog>video{width:100%;max-height:70svh}dialog>p,.dialog-note{font-size:13px}.dialog-note{margin-top:12px}form{margin-top:26px}form label{display:block;font-size:12px;line-height:1.5;margin-bottom:22px}input,select,textarea{display:block;width:100%;padding:12px;background:transparent;border:1px solid #a5a3a0;color:var(--ink);border-radius:0;margin-top:8px;font-size:15px}textarea{resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.solid-button{background:var(--ink);color:white;padding:16px 24px;width:100%;text-align:left}.form-note{font-size:11px;color:#595959;margin-top:12px}#brief-status{font-size:12px;margin-top:12px;color:#00603d}.motion-off *{scroll-behavior:auto!important}.motion-off .reveal{opacity:1;translate:none;transition:none}.motion-off .hero-media{transform:none}.motion-off .hero h1{animation:none}.motion-off .method-word{transform:none}@keyframes enter{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media(min-width:1800px){.hero-content,.section-pad,.header,.footer{padding-left:max(var(--gutter),calc((100vw - 1680px)/2));padding-right:max(var(--gutter),calc((100vw - 1680px)/2))}}
@media(max-width:1000px){.intro-copy{gap:35px}.intro-copy>p{max-width:260px}.orbit{height:530px}.service-layout{gap:45px}.method-bottom{gap:70px}.project-caption{display:block}.project-caption>span{display:block}.footer{flex-wrap:wrap}.footer>span{font-size:10px}.hero h1{font-size:11vw}}
@media(max-width:700px){.header{height:76px}.brand{width:170px}.menu-toggle{display:flex;gap:14px;align-items:center}.header nav{display:none;position:absolute;top:76px;left:0;right:0;padding:30px var(--gutter);background:var(--ink);flex-direction:column;align-items:start;gap:14px;border-bottom:1px solid #ffffff35}.header nav.open{display:flex}.header nav a{font-size:20px}.hero{height:850px;min-height:100svh;max-height:none}.hero-content{padding-top:140px;padding-bottom:130px;justify-content:center}.hero h1{font-size:clamp(67px,15vw,106px);line-height:.98;margin-top:35px}.hero-bottom{display:block;margin-top:35px}.hero-bottom p{font-size:13px;max-width:310px}.round-link{margin-top:32px;gap:15px}.circle-arrow{width:44px;height:44px}.hero-meta{font-size:9px}.hero-meta a{display:none}.hero-shade{background:linear-gradient(90deg,#08080bbd,#08080b70),linear-gradient(0deg,#101011,transparent 45%)}.hero-media img{object-position:60% center}.section-pad{padding:70px var(--gutter)}.section-top{margin-bottom:40px;align-items:start}.section-top .small-label{display:none}.intro-copy{display:block}.intro-copy h2{font-size:clamp(40px,9.5vw,65px)}.intro-copy>p{max-width:370px;margin-top:28px;font-size:14px}.orbit{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:26px 16px;margin-top:45px}.orbit-lines,.orbit-core{display:none}.orbital{position:relative;left:auto;top:auto;width:auto;transform:none!important}.orbital span{font-size:10px;line-height:1.4;gap:8px}.orbital img{aspect-ratio:1.22}.orbit-foot{margin-top:32px;font-size:10px;gap:20px;align-items:start}.text-button{font-size:11px;gap:12px}.work-heading{display:block;margin-bottom:40px}.work-heading p{margin-top:25px;font-size:13px}.projects{grid-template-columns:1fr;gap:42px}.project:nth-child(even){transform:none}.project:last-child{margin-bottom:0}.project-photo{aspect-ratio:1.17}.project-caption{padding-top:15px}.project h3{font-size:23px}.project-caption>span{margin-top:3px}.services h2{font-size:clamp(40px,9.5vw,66px);margin-bottom:40px}.service-layout{display:block}.service-visual{position:relative;top:auto;margin-bottom:35px}.service-visual img{aspect-ratio:1.45}.service-list h3{font-size:23px}.service-list summary{gap:10px;padding:23px 0}.detail-copy{padding-left:35px}.method h2{font-size:clamp(38px,9vw,58px)}.method-bottom{display:block;margin-top:35px}.method-bottom>p{font-size:15px;margin-bottom:45px}.step h3{font-size:24px}.method{padding-bottom:0}.method-word{margin-top:40px;margin-bottom:-8px;font-size:20vw}.reel-launch>img{aspect-ratio:.95}.reel-overlay #reel-title{font-size:40px}.reel-overlay>small{margin-top:14px}.contact h2{font-size:clamp(44px,10.5vw,70px)}.contact-bottom{display:block;margin-top:35px}.contact-actions{margin-top:35px;min-width:0}.contact-phone{font-size:27px}.footer{padding:35px var(--gutter);display:grid;grid-template-columns:1fr 1fr;gap:28px}.footer .brand{width:160px;min-width:0}.footer>span:nth-child(2){justify-self:end}.footer>a:last-child{justify-self:end}.case-main{padding-top:110px}.case-back{margin-bottom:30px}.case-title{font-size:15vw;line-height:1.03}.case-layout{display:block;padding:40px 0}.case-layout h2{margin-bottom:30px}.case-copy>p{font-size:15px}.case-nav{gap:20px;line-height:1.6}.case-hero{aspect-ratio:1.1;object-fit:cover}.form-row{display:block}.dialog-top h2{font-size:25px}dialog{padding:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.js-motion .reveal{opacity:1;translate:none}.hero-media,.method-word{transform:none}}

.hero-meta{align-items:center}.hero-meta button{font:inherit;letter-spacing:inherit;text-transform:uppercase;background:none;padding:12px 0;min-height:44px;color:inherit}.hero-meta button span{margin-left:8px}.method{color:var(--ink)}.method h2{color:var(--paper)}.method .small-label{color:var(--ink)}.step{border-bottom-color:#10101145}.method-word{color:#10101126}
@media(max-width:700px){.hero-meta{flex-wrap:wrap;gap:10px}.hero-meta button{font-size:9px}.hero-meta>span{font-size:8px}}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}}

html.motion-off{scroll-behavior:auto!important}html.motion-off::view-transition-old(root),html.motion-off::view-transition-new(root){animation:none!important}

.hero-meta{z-index:2}

/* v0.3 — Entrada editorial, geometría de marca y líneas de recorrido */
.brand img{filter:none}
.header .brand{padding-block:8px}
body:not(.motion-off) .header .brand img{animation:brand-arrive .75s cubic-bezier(.2,.75,.2,1) .1s both}
body:not(.motion-off) .header nav a{animation:nav-arrive .6s cubic-bezier(.2,.75,.2,1) both;animation-delay:calc(.22s + var(--nav-order,0)*.07s)}
.header nav a:nth-child(1){--nav-order:0}.header nav a:nth-child(2){--nav-order:1}.header nav a:nth-child(3){--nav-order:2}.header nav a:nth-child(4){--nav-order:3}
.header::after{content:'';position:absolute;left:var(--gutter);bottom:-1px;width:70px;height:1px;background:var(--pink);transform-origin:left}
body:not(.motion-off) .header::after{animation:rule-arrive 1.1s .3s both}
.header nav a::after{background:var(--pink)}.nav-contact span{color:var(--pink)}
.hero h1{animation:none}.hero-line{display:block;overflow:hidden;padding-bottom:.11em;margin-bottom:-.11em}.hero-line>span{display:block}
body:not(.motion-off) .hero-line>span{animation:title-arrive 1s cubic-bezier(.16,.75,.25,1) both;animation-delay:.24s}
body:not(.motion-off) .hero-line:nth-child(2)>span{animation-delay:.36s}body:not(.motion-off) .hero-line:nth-child(3)>span{animation-delay:.48s}
.hero h1 em{color:#f8edf0}.hero-traces{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:.6;overflow:hidden}
.hero-traces span{position:absolute;height:1px;width:140px;right:-90px;top:30%;background:linear-gradient(90deg,transparent,var(--pink));transform:translateX(calc(var(--hero-progress,0)*-260px));animation:hero-trace 12s ease-in-out infinite}
.hero-traces span:nth-child(2){top:65%;right:auto;left:-90px;width:170px;animation-delay:-6s;background:linear-gradient(90deg,var(--blue),transparent)}
.hero-traces i{position:absolute;right:5vw;top:40%;width:5px;height:5px;border:1px solid var(--pink);border-radius:50%;animation:dot-float 9s ease-in-out infinite}
.intro,.work,.services,.contact,.method{position:relative;isolation:isolate;overflow:clip}
.ambient-graphics{position:absolute;inset:0;overflow:hidden;z-index:-1;pointer-events:none;transform:translate3d(0,calc(var(--scene-progress,.5)*-70px),0)}
.ambient-ring{position:absolute;width:520px;aspect-ratio:1;right:-310px;top:26%;border:1px solid #ea1f542b;border-radius:50%;animation:ring-drift 22s ease-in-out infinite}
.ambient-ring::after{content:'';width:4px;height:4px;background:var(--pink);position:absolute;left:28%;top:4%;border-radius:50%;opacity:.5}
.ring-two{width:660px;right:-370px;top:27%;border-color:#006caf24;animation-duration:31s;animation-delay:-12s;animation-direction:reverse}
.ambient-disc{position:absolute;left:-55px;top:57%;width:135px;height:135px;background:#ea1f5405;border:1px solid #ea1f541a;border-radius:50%;animation:disc-drift 19s ease-in-out infinite}
.fine-trace{position:absolute;height:1px;background:linear-gradient(90deg,transparent,#ea1f5460,transparent);width:190px;left:-80px;top:35%;transform:translateX(calc(var(--scene-progress,.5)*220px));animation:trace-flow 16s ease-in-out infinite}
.trace-two{left:auto;right:-100px;top:72%;width:280px;background:linear-gradient(90deg,transparent,#006caf70,transparent);animation-delay:-9s;animation-duration:21s}
.trace-three{top:88%;left:35%;width:150px;animation-delay:-4s;opacity:.45}
.light-section .ambient-ring{border-color:#006caf18}.light-section .ambient-ring::after{background:var(--blue)}.light-section .ambient-disc{background:#006caf04;border-color:#006caf13}.light-section .fine-trace{opacity:.4}
.method .ambient-ring{border-color:#10101120}.method .ring-two{border-color:#ffffff30}.method .fine-trace{background:linear-gradient(90deg,transparent,#10101170,transparent)}.method .ambient-disc{border-color:#10101116;background:#ffffff05}
.section-top::after{content:'';height:1px;position:absolute;left:0;right:0;bottom:-24px;background:linear-gradient(90deg,#ea1f5475,#ffffff08 45%,transparent);transform:scaleX(calc(.15 + var(--scene-progress,.5)*.85));transform-origin:left}
.section-top{position:relative}.light-section .section-top::after{background:linear-gradient(90deg,#006caf65,#10101110 45%,transparent)}.method .section-top::after{background:linear-gradient(90deg,#10101180,#10101108 50%,transparent)}
.orbit-lines ellipse{stroke:#ffffff1a}.orbit-lines ellipse:nth-child(2){stroke:#ea1f542b;stroke-dasharray:2 9;animation:orbit-dash 40s linear infinite}
.orbit-core::before{content:'';position:absolute;inset:-30px -50px;border-top:1px solid #ea1f5438;border-bottom:1px solid #ea1f5420;border-radius:50%;animation:core-breathe 12s ease-in-out infinite;pointer-events:none}
.orbit-core small{position:relative}.number{color:var(--blue)}.project-caption h3::after{content:'.';color:var(--pink)}
.project-photo img{transform:translateY(calc(var(--image-shift,0)*1px)) scale(1.08);transition:transform .18s linear}
.project:hover .project-photo img{transform:translateY(calc(var(--image-shift,0)*1px)) scale(1.12)}
.js-motion .reveal{translate:0 30px;filter:blur(2px);transition:opacity .85s cubic-bezier(.2,.7,.2,1),translate .85s cubic-bezier(.2,.7,.2,1),filter .85s;transition-delay:var(--reveal-delay,0s)}
.js-motion .reveal.visible{filter:none}.step:nth-child(2){--reveal-delay:.08s}.step:nth-child(3){--reveal-delay:.16s}
.motion-off .ambient-graphics *,.motion-off .hero-traces *,.motion-off .orbit-lines *,.motion-off .orbit-core::before{animation-play-state:paused!important}
.motion-off .reveal{opacity:1;translate:none;filter:none;transition:none}.motion-off .project-photo img{transform:none}.motion-off .ambient-graphics{transform:none}
@keyframes brand-arrive{from{opacity:0;transform:translateY(9px);filter:blur(2px)}to{opacity:1;transform:none;filter:none}}
@keyframes nav-arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes rule-arrive{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes title-arrive{from{opacity:0;transform:translateY(55px)}to{opacity:1;transform:none}}
@keyframes ring-drift{0%,100%{transform:translate3d(0,-15px,0) rotate(-8deg)}50%{transform:translate3d(-35px,15px,0) rotate(12deg)}}
@keyframes disc-drift{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(40px,-25px,0)}}
@keyframes trace-flow{0%,100%{translate:-60px 0;opacity:0}35%,65%{opacity:.65}50%{translate:100px 0;opacity:.8}}
@keyframes hero-trace{0%,100%{translate:0 0;opacity:0}45%{translate:-90px 0;opacity:.7}70%{translate:-180px 0;opacity:0}}
@keyframes dot-float{0%,100%{translate:0 0;opacity:.3}50%{translate:-10px 35px;opacity:.6}}
@keyframes orbit-dash{to{stroke-dashoffset:-110}}
@keyframes core-breathe{0%,100%{scale:1;rotate:-8deg;opacity:.5}50%{scale:1.12;rotate:12deg;opacity:.8}}
@media(max-width:700px){
 .header nav{display:flex;visibility:hidden;opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity .25s ease,transform .3s ease,visibility 0s .3s;gap:20px}
 .header nav.open{visibility:visible;opacity:1;transform:none;pointer-events:auto;transition-delay:0s}
 body:not(.motion-off) .header nav a{animation:none;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s;transition-delay:0s}
 body:not(.motion-off) .header nav.open a{opacity:1;transform:none;transition-delay:calc(.07s + var(--nav-order,0)*.045s)}
 .ambient-ring{width:330px;right:-260px}.ring-two{width:450px;right:-315px}.fine-trace{width:120px}.trace-three{display:none}.ambient-disc{width:85px;height:85px;left:-55px}
 .hero-traces{opacity:.3}.hero-line{padding-bottom:.14em;margin-bottom:-.14em}.orbit-core::before{display:none}
}
@media(prefers-reduced-motion:reduce){.ambient-graphics{transform:none}.hero-line>span,.header .brand img,.header nav a{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}.project-photo img,.project:hover .project-photo img{transform:none!important}.js-motion .reveal{filter:none;translate:none;opacity:1}}

/* Música ambiental y contacto siempre disponibles */
.floating-tools{position:fixed;bottom:24px;right:var(--gutter);z-index:8;display:flex;align-items:center;gap:12px}
.sound-control{position:relative}.sound-control>button{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 17px;background:#101011ec;border:1px solid #ffffff28;border-radius:30px;font-size:11px;color:var(--paper);backdrop-filter:blur(8px);transition:border-color .25s,background .25s}
.sound-control>button:hover,.sound-control>button:focus-visible{border-color:#ea1f5490}.sound-bars{display:flex;align-items:center;gap:3px;width:17px;height:17px}.sound-bars i{display:block;width:2px;height:4px;background:var(--pink);border-radius:2px}.sound-bars i:nth-child(2){height:12px}.sound-bars i:nth-child(3){height:7px}
.sound-control.is-playing .sound-bars i{animation:sound-wave 1.2s ease-in-out infinite}.sound-control.is-playing .sound-bars i:nth-child(2){animation-delay:-.4s}.sound-control.is-playing .sound-bars i:nth-child(3){animation-delay:-.8s}
.volume-panel{display:flex;align-items:center;gap:10px;position:absolute;bottom:60px;right:0;width:224px;padding:14px;background:#101011f5;border:1px solid #ffffff25;border-radius:8px;color:var(--paper);opacity:0;visibility:hidden;translate:0 4px;transition:opacity .2s,translate .2s,visibility .2s;font-size:10px}
.sound-control:hover .volume-panel,.sound-control:focus-within .volume-panel{opacity:1;visibility:visible;translate:0 0}.volume-panel label{margin:0}.volume-panel input{display:block;width:110px;height:16px;accent-color:var(--pink);padding:0;border:0;background:transparent;margin:0;cursor:pointer}.volume-panel output{width:27px;text-align:right}
.whatsapp-float{width:48px;height:48px;display:grid;place-items:center;position:relative;background:#101011ec;border:1px solid #ea1f5480;color:var(--pink);border-radius:50%;backdrop-filter:blur(8px);transition:background .25s,color .25s,transform .25s}
.whatsapp-float svg{width:21px;height:21px}.whatsapp-float:hover,.whatsapp-float:focus-visible{background:var(--pink);color:white;transform:translateY(-2px)}
.whatsapp-tip{position:absolute;right:0;bottom:61px;padding:11px 14px;white-space:nowrap;background:#101011f2;color:var(--paper);border:1px solid #ffffff25;border-radius:6px;font-size:11px;opacity:0;visibility:hidden;translate:0 4px;transition:opacity .2s,translate .2s,visibility .2s}
.whatsapp-float:hover .whatsapp-tip,.whatsapp-float:focus-visible .whatsapp-tip{opacity:1;visibility:visible;translate:0 0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.hero-meta{right:calc(var(--gutter) + 250px)}.footer{padding-bottom:110px}
.motion-off .sound-bars i{animation:none!important}
@keyframes sound-wave{0%,100%{scale:1 .45}50%{scale:1 1}}
@media(max-width:700px){.floating-tools{bottom:18px;right:18px;gap:9px}.sound-control>button{min-height:44px;padding-inline:14px;font-size:10px}.whatsapp-float{width:44px;height:44px}.whatsapp-float svg{width:20px;height:20px}.hero-meta{bottom:88px;right:var(--gutter)}.hero-meta>span{font-size:8px}.hero-meta button{font-size:9px}.volume-panel{right:-53px;width:225px}.whatsapp-tip{display:none}}
@media(prefers-reduced-motion:reduce){.sound-bars i{animation:none!important}}

/* Planos grandes inspirados en los círculos superpuestos de la identidad P2W */
.brand-planes{position:absolute;right:-180px;top:18%;width:600px;height:530px;perspective:1000px;transform-style:preserve-3d;opacity:.24;transform:translate3d(calc(var(--scene-progress,.5)*-60px),calc(var(--scene-progress,.5)*-100px),0) rotateX(calc(8deg + var(--scene-progress,.5)*12deg)) rotateY(-18deg);will-change:transform}
.brand-disc{display:block;position:absolute;border-radius:50%;transform-style:preserve-3d;box-shadow:inset -12px -7px 24px #00000030,inset 4px 3px 14px #ffffff12,22px 35px 45px #00000026;animation:plane-float 24s ease-in-out infinite}
.disc-main{width:380px;height:380px;left:80px;top:90px;background:linear-gradient(135deg,#ee426b 5%,#ea1f54 55%,#a0113c);border:1px solid #ff608340;transform:translateZ(15px)}
.disc-left{width:160px;height:160px;left:0;top:185px;background:linear-gradient(145deg,#df2457,#a51d4a);border:1px solid #f3598540;transform:translateZ(65px);animation-delay:-5s;animation-duration:29s}
.disc-right{width:160px;height:160px;left:420px;top:185px;background:linear-gradient(140deg,#1685ba,#006caf 65%,#004977);border:1px solid #53a4ca35;transform:translateZ(-30px);animation-delay:-12s;animation-duration:32s}
.disc-back{width:410px;height:410px;left:110px;top:125px;border:1px solid #006caf90;background:linear-gradient(130deg,#006caf20,#006caf60);transform:translateZ(-75px);animation-delay:-9s;box-shadow:none}
.work .brand-planes{left:-360px;right:auto;top:35%;opacity:.16}.services .brand-planes{left:-330px;right:auto;top:auto;bottom:120px;opacity:.14}.services .disc-main,.contact .disc-main{background:linear-gradient(135deg,#188ac6,#006caf 60%,#004a7e)}
.services .disc-left,.contact .disc-left{background:linear-gradient(130deg,#1285ba,#006caf)}.services .disc-right,.contact .disc-right{background:linear-gradient(145deg,#ee426b,#ea1f54)}
.method .brand-planes{right:-120px;top:0;opacity:.12}.method .disc-main{background:linear-gradient(135deg,#ffffff60,#ffffff12);box-shadow:inset -10px -6px 24px #00000020,20px 25px 45px #00000010}.method .disc-left{background:#10101190}.method .disc-right{background:#ffffff60}
.contact .brand-planes{right:-260px;top:15%;opacity:.12}
.js-motion .reveal{translate:0 var(--reveal-offset,30px);scale:.985;transition:opacity .7s cubic-bezier(.2,.7,.2,1),translate .85s cubic-bezier(.2,.7,.2,1),filter .7s,scale .85s}
.js-motion .reveal.visible{translate:0 0;scale:1;filter:none}
.motion-off .reveal{scale:1;filter:none;translate:none;opacity:1}.motion-off .brand-planes{transform:rotateX(12deg) rotateY(-18deg)}
.dialog-top{flex-wrap:wrap}.dialog-top h2{flex:1 1 280px}#reel-play-toggle{border-bottom:1px solid var(--pink);padding-bottom:8px}
@keyframes plane-float{0%,100%{translate:0 -10px}50%{translate:10px 16px}}
@media(max-width:700px){.brand-planes{width:450px;right:-280px;top:20%;scale:.7;transform-origin:right center;opacity:.18}.work .brand-planes{left:-390px;top:30%;scale:.65}.services .brand-planes{left:-400px;bottom:220px;scale:.6}.contact .brand-planes{right:-340px;scale:.6}.method .brand-planes{right:-300px;scale:.6}.dialog-top h2{flex-basis:100%;margin-bottom:3px}}
@media(prefers-reduced-motion:reduce){.brand-planes{transform:rotateX(12deg) rotateY(-18deg);will-change:auto}.js-motion .reveal{opacity:1;translate:none;scale:1;filter:none}}

/* v0.4 — Letter choreography, with a stable three-line layout. */
.hero h1.headline-rotating .hero-line{position:relative;height:1.04em;overflow:visible;padding:0;margin:0}
body:not(.motion-off) .headline-rotating .hero-line>span{animation:none}
.headline-layer{position:absolute;inset:0 auto auto 0;display:block;white-space:pre;line-height:.93;perspective:800px}
.headline-layer[hidden]{display:none!important}
.headline-letter{display:inline-block;transform-origin:50% 65%;backface-visibility:hidden;will-change:auto}
.headline-layer.is-changing .headline-letter{will-change:transform,opacity}
.headline-rotating .hero-line:last-child .headline-layer{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;color:var(--pink)}
.hero h1 .hero-line:last-child em{color:var(--pink)}
@media(max-width:700px){.headline-layer{line-height:.98}.hero h1.headline-rotating .hero-line{height:1.08em}}
@media(max-width:360px){.hero h1.headline-rotating{font-size:clamp(58px,19vw,67px)}}

/* v0.5 — Projected orbit; depth sorting preserves every card's interaction. */
@media(min-width:701px){
 .orbit{perspective:1100px}
 .orbit-lines{transform:rotate(-10deg) rotateX(18deg);opacity:.8;pointer-events:none}
 .orbit-core{z-index:40;text-shadow:0 8px 28px #000a}
 .orbit-core::before{inset:-22px -45px;transform:rotate(-10deg) rotateX(45deg)}
 .orbit-core small{background:#101011c4;border-radius:20px;padding:5px 11px}
 .orbital{transform:translate(calc(-50% + var(--x,0px)),calc(-50% + var(--y,0px))) scale(var(--orbit-scale,1)) rotateX(var(--orbit-pitch,-7deg)) rotateY(var(--orbit-yaw,0deg));z-index:var(--orbit-stack,2);transform-origin:center;transition:filter .25s}
 .orbital img{filter:brightness(var(--orbit-light,1));border:1px solid #ffffff24;box-shadow:0 var(--orbit-shadow,30px) 45px -17px #000b,0 2px 9px #0006;transition:filter .25s,transform .3s,border-color .25s}
 .orbital span{color:#e2dfe0;text-shadow:0 2px 6px #000}
 .orbital:hover,.orbital:focus-visible{z-index:100}
 .orbital:hover img,.orbital:focus-visible img{filter:brightness(1.08);border-color:#ea1f5480;transform:scale(1.035)}
 .orbital:focus-visible{outline:3px solid #fa779b;outline-offset:8px}
}

/* v0.6 — Two equal phrase groups make a continuous watermark loop. */
.method-word.method-marquee{transform:none;width:calc(100% + var(--gutter)*2);margin-left:calc(var(--gutter)*-1);overflow:hidden;pointer-events:none;user-select:none}
.marquee-track{display:flex;width:max-content;animation:method-marquee-flow 58s linear infinite;animation-play-state:paused}
.marquee-group{display:flex;flex:none;align-items:center;gap:.28em;padding-right:.28em}
.marquee-group>span{display:block;flex:none}
.marquee-group>i{display:block;flex:none;font-size:.32em;font-style:normal;letter-spacing:0;opacity:.8}
.method-marquee.is-running .marquee-track{animation-play-state:running}
.motion-off .method-marquee .marquee-track{animation-play-state:paused!important}
@keyframes method-marquee-flow{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.method-marquee .marquee-track{animation:none!important;transform:none!important}}

/* Shared color surface: section edges carry no background changes. */
.continuous-background.has-surface{background:var(--scene-surface)}
.continuous-background.has-surface>.light-section,.continuous-background.has-surface>.method{background:transparent}
.continuous-background>.work{padding-bottom:200px}
.continuous-background>.services{padding-top:220px;padding-bottom:200px}
.continuous-background>.method{padding-top:220px;padding-bottom:220px}
.continuous-background>.reel-section{padding-top:180px;padding-bottom:200px}
.continuous-background>.contact{padding-top:220px;padding-bottom:240px}
.project-photo{transform:scale(var(--project-scale,1));transform-origin:center;transition:transform .18s cubic-bezier(.2,.7,.3,1)}
.motion-off .project-photo{transform:none;transition:none}
@media(max-width:700px){
 .continuous-background>.work{padding-bottom:140px}
 .continuous-background>.services{padding-top:150px;padding-bottom:140px}
 .continuous-background>.method{padding-top:150px;padding-bottom:150px}
 .continuous-background>.reel-section{padding-top:140px;padding-bottom:140px}
 .continuous-background>.contact{padding-top:150px;padding-bottom:170px}
}
@media(prefers-reduced-motion:reduce){.project-photo{transform:none!important;transition:none!important}}

/* v0.7 — Quiet, varied motion for existing underlines and fine rules. */
.text-button,.contact-phone{position:relative;border-bottom-color:transparent}
.text-button::after,.contact-phone::after{content:'';position:absolute;inset:auto 0 -1px;height:1px;pointer-events:none;background:currentColor;transform-origin:left}
.text-button::after{animation:underline-breathe 11s cubic-bezier(.45,0,.55,1) infinite}
.contact-actions .text-button::after{transform-origin:right;animation-name:underline-return;animation-duration:15s;animation-delay:-5s}
.contact-phone::after{opacity:.4;background:linear-gradient(90deg,currentColor 0%,currentColor 30%,transparent 52%,currentColor 75%,currentColor 100%);background-size:240% 100%;animation:underline-glide 13s ease-in-out -3s infinite}
.header nav a::after{background:linear-gradient(90deg,currentColor 0%,currentColor 35%,var(--pink) 55%,currentColor 85%);background-size:220% 100%;animation:underline-glide 10s ease-in-out infinite;transition:transform .45s cubic-bezier(.2,.75,.25,1)}
.header nav a:nth-child(even)::after{animation-duration:14s;animation-delay:-6s;transform-origin:right}
.section-top::after{background-size:180% 100%;animation:underline-glide 19s ease-in-out infinite}
.method .section-top::after{animation-duration:23s;animation-delay:-7s}
.service-list details,.step,.orbit-foot,.case-nav{position:relative}
.service-list details{border-bottom-color:transparent}
.service-list details::after,.step::after,.orbit-foot::before,.case-nav::before{content:'';position:absolute;left:0;right:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,currentColor 25%,currentColor 55%,transparent);background-size:200% 100%;opacity:.2;animation:underline-glide 18s ease-in-out infinite}
.service-list details::after,.step::after{bottom:0}
.service-list details:nth-child(even)::after{animation-duration:22s;animation-delay:-8s}
.step{border-bottom-color:transparent}
.step::after{transform-origin:left;animation:underline-return 17s cubic-bezier(.45,0,.55,1) infinite}
.step:nth-child(2)::after{animation-delay:-6s;transform-origin:right}
.step:nth-child(3)::after{animation-delay:-11s}
.orbit-foot,.case-nav{border-top-color:transparent}
.orbit-foot::before,.case-nav::before{top:0;animation-duration:25s;animation-delay:-9s}
@keyframes underline-glide{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes underline-breathe{0%,100%{transform:scaleX(1);opacity:.85}50%{transform:scaleX(.82);opacity:.55}}
@keyframes underline-return{0%,100%{transform:scaleX(.95);opacity:.75}50%{transform:scaleX(.72);opacity:.4}}
.motion-off .text-button::after,.motion-off .contact-phone::after,.motion-off .header nav a::after,.motion-off .section-top::after,.motion-off .service-list details::after,.motion-off .step::after,.motion-off .orbit-foot::before,.motion-off .case-nav::before{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.text-button::after,.contact-phone::after,.header nav a::after,.section-top::after,.service-list details::after,.step::after,.orbit-foot::before,.case-nav::before{animation:none!important}}

/* v0.8 — Audit improvements: navigation, hierarchy and accessible controls. */
.header{position:fixed;z-index:20;transition:height .3s,background-color .3s,box-shadow .3s}
.header.is-scrolled{height:76px;background:#101011f0;backdrop-filter:blur(14px);box-shadow:0 6px 25px #0002;border-bottom-color:#ffffff15}
.header nav a{min-height:44px;display:inline-flex;align-items:center}
.header nav a[aria-current="location"]::after{transform:scaleX(1)}
.reading-progress{height:2px;position:absolute;left:0;right:0;top:0;transform:scaleX(var(--reading-progress,0));transform-origin:left;background:linear-gradient(90deg,var(--pink),#f45c89 65%,var(--blue));pointer-events:none}
.primary-link{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;min-height:48px;padding:13px 20px;background:var(--pink);color:#000;border:1px solid var(--pink);border-radius:2px;font-size:13px;font-weight:700;line-height:1.5;transition:background .25s,transform .3s}
.primary-link:hover{background:#f24974;transform:translateY(-2px)}
.primary-link span{font-size:20px;font-weight:400}
.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.hero-actions .round-link{margin-top:0}
.hero-bottom{gap:24px}
.hero-bottom>p{max-width:390px;font-size:15px}
.text-button,.case-back,.case-nav a,.footer>a:last-child,.menu-toggle{min-height:44px;align-items:center}
.text-button{padding-top:8px;padding-bottom:8px}
.case-back,.case-nav a,.footer>a:last-child{display:inline-flex}
.case-cta{margin:0 0 30px}
.case-scope-label{font-size:11px;font-weight:400;letter-spacing:1.3px;text-transform:uppercase;margin:0 0 16px;color:#d7d3d4}
.case-nav{gap:30px;flex-wrap:wrap}
.method,.method .small-label{color:#000}
.step p{font-size:14px;opacity:1;color:#000}
.step>span{color:#000}
.intro-copy>p,.detail-copy p,.contact-bottom>p{font-size:15px}
.detail-copy ul{font-size:14px;line-height:1.8}
.dialog-top button{min-height:44px;padding:10px 8px;border-radius:3px}
input,select,textarea{font-size:16px}
.reveal:focus-visible{opacity:1!important;translate:none!important;scale:1!important;filter:none!important}
.sound-control>button{width:48px;height:48px;min-height:48px;padding:0;justify-content:center}
#sound-label{position:absolute;right:0;bottom:112px;white-space:nowrap;padding:8px 12px;border-radius:4px;background:#101011f5;border:1px solid #ffffff25;opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .2s,transform .2s,visibility .2s;pointer-events:none;font-size:11px}
.sound-control:hover #sound-label,.sound-control:focus-within #sound-label{opacity:1;visibility:visible;transform:none}
#sound-toggle::after{content:'';position:absolute;inset:-1px;border:1px solid transparent;border-radius:50%;pointer-events:none}
.sound-control.is-playing #sound-toggle::after{border-color:#ea1f5460}
.sound-control .volume-panel{bottom:60px}
.volume-panel input{height:32px}
.floating-tools{gap:10px;bottom:max(20px,env(safe-area-inset-bottom))}
.hero-meta{right:calc(var(--gutter) + 130px)}
@media(max-width:1100px){.hero-bottom{display:block}.hero-actions{margin-top:22px}.hero-actions .round-link{gap:12px}.hero-bottom>p{max-width:480px}.hero-actions .circle-arrow{width:44px;height:44px}}
@media(max-width:700px){
 .header.is-scrolled{height:76px}
 .hero{height:max(920px,100svh)}
 .hero-content{padding-top:125px;padding-bottom:160px}
 .hero-actions{gap:14px;align-items:flex-start;flex-direction:column}
 .hero-actions .primary-link{min-width:228px;max-width:100%}
 .hero-bottom>p{font-size:15px;line-height:1.55}
 .hero-meta{right:var(--gutter);bottom:85px;flex-wrap:wrap;gap:8px 12px}
 .hero-meta>span:last-child{display:none}
 .sound-control>button{width:44px;height:44px;min-height:44px}
 .floating-tools{right:18px;gap:10px}
 .volume-panel{right:-54px}
 .volume-panel input{height:36px}
 .case-copy>p{font-size:16px}
 .case-cta{width:100%;font-size:12px}
 .footer{row-gap:20px}
}
@media(prefers-reduced-motion:reduce){.primary-link:hover{transform:none}}

main:focus{outline:none}
@media(max-width:700px){.header nav{max-height:calc(100dvh - 76px);overflow:auto}}

/* v0.9 — Film portal, playful contact and a short 3D brand entrance. */
.reel-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:55px}
.reel-heading h2{font-size:clamp(48px,6.3vw,100px)}
.reel-heading h2 em{color:var(--pink)}
.reel-heading p{max-width:310px;font-size:15px;color:#bbb7b9}
.reel-cinema{border:1px solid #ffffff22;border-radius:3px}
.reel-cinema>img{aspect-ratio:1.95;filter:brightness(.46);transform:scale(1.015)}
.reel-cinema:hover>img{transform:scale(1.06);filter:brightness(.55)}
.reel-portal{position:absolute;inset:0;background:linear-gradient(90deg,#10101168,transparent 70%)}
.reel-topnote{position:absolute;top:28px;left:30px;font-size:10px;letter-spacing:2px;color:#e1d9dd}
.reel-big-word{position:absolute;left:5%;top:50%;transform:translateY(-58%);font-size:clamp(100px,19vw,290px);font-weight:700;line-height:.9;letter-spacing:-.085em;color:#f3f1eded}
.reel-play-disc{position:absolute;left:68%;top:50%;translate:-50% -50%;transform:translate(var(--play-x,0px),var(--play-y,0px));width:clamp(95px,12vw,170px);aspect-ratio:1;border-radius:50%;background:var(--pink);color:#000;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;box-shadow:0 18px 55px #0008;transition:transform .25s,box-shadow .3s}
.reel-play-disc svg{width:34px;height:34px}
.reel-play-disc>span{font-size:10px;font-weight:700;letter-spacing:1px}
.reel-cinema:hover .reel-play-disc{box-shadow:0 20px 70px #ea1f5440}
.portal-rings{position:absolute;left:68%;top:50%;width:clamp(200px,28vw,430px);aspect-ratio:1;translate:-50% -50%;perspective:800px;pointer-events:none}
.portal-rings i{position:absolute;inset:0;border:1px solid #ea1f5470;border-radius:50%;animation:portal-turn 18s linear infinite}
.portal-rings i:nth-child(2){inset:12%;border-color:#f3f1ed50;border-style:dashed;animation-direction:reverse;animation-duration:24s}
.portal-rings i:nth-child(3){inset:-15%;border-color:#006caf50;animation-duration:32s;animation-delay:-7s}
.reel-caption{position:absolute;bottom:28px;left:30px;right:30px;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:12px;color:#e4dee0}
.reel-tag{display:flex;gap:26px;align-items:center;padding:9px 15px;border:1px solid #ffffff40;border-radius:24px;font-size:11px}
.reel-tag b{font-weight:400;font-size:19px}
@keyframes portal-turn{from{transform:rotateZ(0deg) rotateX(58deg)}to{transform:rotateZ(360deg) rotateX(58deg)}}
.contact-stage{display:grid;grid-template-columns:1.25fr .85fr;gap:65px;align-items:center}
.contact-story{position:relative;isolation:isolate}
.contact-story h2{font-size:clamp(48px,6.5vw,110px);position:relative;z-index:1}
.contact-story>p{font-size:17px;color:#514d50;line-height:1.65;margin-top:32px}
.contact-lettering{position:absolute;left:-4%;top:-90px;font-size:clamp(100px,13vw,210px);font-weight:700;letter-spacing:-.07em;line-height:.86;color:transparent;-webkit-text-stroke:1px #006caf16;z-index:-1;transform:rotate(-8deg);pointer-events:none}
.contact-signature{display:flex;gap:17px;align-items:center;margin-top:45px;font-size:13px;line-height:1.6;color:#4c474a}
.contact-spark{font-size:48px;color:var(--pink);line-height:1;animation:contact-spark-turn 30s linear infinite}
@keyframes contact-spark-turn{to{transform:rotate(360deg)}}
.contact-console{position:relative;isolation:isolate;overflow:hidden;background:#101011;color:var(--paper);padding:34px;border-radius:4px;border:1px solid #ffffff25;box-shadow:0 24px 60px #10101116}
.contact-console::before{content:'';position:absolute;right:-100px;top:100px;width:300px;height:300px;border:1px solid #ea1f5435;border-radius:50%;transform:rotate(var(--console-turn,-8deg)) scaleX(.7);transition:transform .65s;z-index:-1}
.contact-console::after{content:'';position:absolute;right:-100px;top:100px;width:300px;height:300px;border:1px solid #006caf35;border-radius:50%;transform:rotate(calc(var(--console-turn,-8deg) + 60deg)) scaleX(.7);transition:transform .65s;z-index:-1}
.console-top{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px;letter-spacing:1.6px;color:#c1bbc0}
.console-mark{font-size:32px;color:var(--pink);line-height:1}
.intent-label{font-size:15px;margin-top:28px;margin-bottom:14px}
.intent-choices{display:flex;flex-wrap:wrap;gap:8px}
.intent-chip{flex:1 1 105px;min-height:44px;padding:10px 11px;border:1px solid #ffffff35;background:transparent;color:var(--paper);border-radius:2px;font-size:12px;transition:background .25s,border-color .25s,color .25s}
.intent-chip:hover{border-color:#ea1f5480}
.intent-chip[aria-pressed="true"]{background:var(--pink);color:#000;border-color:var(--pink)}
.intent-copy{margin-top:33px;min-height:178px}
.intent-copy h3{font-size:clamp(34px,3.7vw,58px);line-height:1.04;font-weight:500;letter-spacing:-.06em}
.intent-copy p{font-size:14px;line-height:1.7;color:#c2bcc0;margin-top:20px;max-width:350px}
.contact-chat{width:100%;margin-top:24px;font-size:12px}
.console-brief{color:#dcd6da;font-size:12px;margin-top:12px}
.console-bottom{margin-top:30px;font-size:11px;color:#aaa3a7}
.contact-console .contact-phone{font-size:19px;color:var(--paper);margin-bottom:15px;padding-bottom:14px;min-height:44px}
.motion-off .portal-rings i,.motion-off .contact-spark{animation-play-state:paused!important}
.motion-off .reel-play-disc,.motion-off .contact-console::before,.motion-off .contact-console::after{transition:none}
.entry-overlay{display:none;position:fixed;inset:0;z-index:1000;place-items:center;perspective:1100px}
.intro-enabled{overflow:hidden}
.intro-enabled .entry-overlay{display:grid}
.entry-wing{position:absolute;top:0;bottom:0;width:50.1%;background:#101011;border:1px solid #ffffff08;backface-visibility:hidden;will-change:transform}
.wing-left{left:0;transform-origin:left center;animation:entry-open-left 1.5s cubic-bezier(.4,0,.15,1) forwards}
.wing-right{right:0;transform-origin:right center;animation:entry-open-right 1.5s cubic-bezier(.4,0,.15,1) forwards}
.entry-brand{position:relative;display:flex;align-items:center;flex-direction:column;gap:28px;animation:entry-brand 1.5s cubic-bezier(.2,.7,.2,1) forwards;transform-style:preserve-3d;pointer-events:none}
.entry-brand>img{width:clamp(220px,29vw,410px);height:auto;position:relative}
.entry-brand>span:last-child{font-size:10px;letter-spacing:3px;color:#b9b2b7}
.entry-orbit{position:absolute;left:50%;top:50%;width:300px;height:300px;margin:-150px;border:1px solid #ea1f5460;border-radius:50%;transform:rotateX(65deg) rotateZ(-30deg) translateZ(-60px)}
#entry-skip{position:absolute;right:var(--gutter);bottom:25px;min-height:44px;padding:12px;background:transparent;color:var(--paper);font-size:11px}
@keyframes entry-open-left{0%,28%{transform:none}100%{transform:translateX(-15%) rotateY(-105deg)}}
@keyframes entry-open-right{0%,28%{transform:none}100%{transform:translateX(15%) rotateY(105deg)}}
@keyframes entry-brand{0%{opacity:0;transform:rotateY(-18deg) rotateX(9deg) scale(.95)}25%,48%{opacity:1;transform:rotateY(0deg) rotateX(0deg) scale(1)}100%{opacity:0;transform:translateZ(160px) scale(1.07)}}
@media(max-width:1000px){.contact-stage{grid-template-columns:1fr;gap:55px}.contact-story h2{font-size:clamp(48px,8vw,88px)}.contact-console{max-width:680px}.reel-heading{display:block}.reel-heading p{margin-top:25px;max-width:420px}.intent-copy{min-height:145px}.contact-lettering{top:-50px}}
@media(max-width:700px){
 .reel-heading{margin-bottom:35px}.reel-heading h2{font-size:clamp(40px,10vw,58px)}
 .reel-cinema>img{aspect-ratio:.96;filter:brightness(.4)}
 .reel-topnote{top:20px;left:20px;font-size:9px;letter-spacing:1.4px}
 .reel-big-word{left:7%;top:37%;font-size:26vw}
 .reel-play-disc{left:61%;top:59%;width:100px}
 .portal-rings{left:61%;top:59%;width:200px}
 .reel-caption{left:20px;right:20px;bottom:20px;font-size:10px}
 .reel-tag{padding:7px 10px;gap:10px;font-size:10px}
 .contact-story h2{font-size:clamp(40px,10.4vw,64px)}
 .contact-story>p{font-size:15px}.contact-signature{margin-top:28px}
 .contact-console{padding:24px}.intent-copy{min-height:175px}.intent-copy h3{font-size:39px}
 .contact-lettering{font-size:33vw;top:-55px}
 .contact-chat{font-size:12px;padding-inline:14px}
 .entry-orbit{width:220px;height:220px;margin:-110px}
}
@media(prefers-reduced-motion:reduce){.entry-overlay{display:none!important}.portal-rings i,.contact-spark{animation:none!important}.contact-console::before,.contact-console::after{transition:none}}

/* v0.10 — Quiet, layered motion behind the film section. */
.reel-section{position:relative;isolation:isolate}
.reel-section>.reel-atmosphere{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;mask-image:linear-gradient(transparent,black 17%,black 82%,transparent);-webkit-mask-image:linear-gradient(transparent,black 17%,black 82%,transparent)}
.reel-section>:not(.reel-atmosphere){position:relative;z-index:1}
.reel-depth{position:absolute;inset:-40px 0;transform:translateY(var(--reel-drift,0px))}
.film-disc,.film-orbit,.film-thread,.film-point{position:absolute;display:block;animation-play-state:paused}
.film-disc{border-radius:50%;width:clamp(210px,30vw,480px);aspect-ratio:1;opacity:.11;animation:film-float 23s ease-in-out infinite alternate;animation-play-state:paused}
.film-disc-pink{background:var(--pink);left:-16%;top:29%;box-shadow:inset -35px -28px 65px #10101199}
.film-disc-blue{background:var(--blue);right:-19%;top:8%;width:clamp(250px,38vw,590px);opacity:.14;animation-duration:29s;animation-delay:-11s;animation-direction:alternate-reverse}
.film-orbit{width:clamp(420px,76vw,1200px);aspect-ratio:1;border:1px solid #ea1f542e;border-radius:50%;animation:film-orbit 48s linear infinite;animation-play-state:paused}
.film-orbit::after{content:'';position:absolute;width:7px;height:7px;border-radius:50%;background:var(--pink);top:14.6%;left:14.6%;box-shadow:0 0 16px #ea1f5480}
.film-orbit-one{left:-26%;top:4%;transform:rotateX(57deg) rotateZ(-18deg)}
.film-orbit-two{right:-23%;top:16%;border-color:#006caf3d;animation-direction:reverse;animation-duration:61s;animation-delay:-17s}
.film-orbit-two::after{background:var(--blue);box-shadow:0 0 16px #006caf80}
.film-thread{width:38%;height:1px;background:linear-gradient(90deg,transparent,#f3f1ed44,transparent);animation:film-trace 17s cubic-bezier(.45,0,.55,1) infinite;animation-play-state:paused;opacity:0}
.film-thread-one{top:17%;left:-8%;rotate:-16deg}
.film-thread-two{top:53%;right:-12%;rotate:13deg;animation-duration:21s;animation-delay:-9s;background:linear-gradient(90deg,transparent,#ea1f5466,transparent)}
.film-thread-three{bottom:14%;left:5%;rotate:9deg;animation-duration:26s;animation-delay:-18s;background:linear-gradient(90deg,transparent,#006caf66,transparent)}
.film-point{width:3px;height:3px;border-radius:50%;background:#f3f1ed75;animation:film-point 12s ease-in-out infinite alternate;animation-play-state:paused}
.film-point-one{left:27%;top:12%}.film-point-two{right:8%;top:43%;animation-duration:16s;animation-delay:-5s}
.reel-alive .reel-atmosphere .reel-depth>span{animation-play-state:running}
.motion-off .reel-atmosphere .reel-depth>span{animation-play-state:paused!important}
.motion-off .reel-depth{transform:none}
@keyframes film-float{from{transform:translate3d(0,-15px,0) scale(.96)}to{transform:translate3d(34px,22px,0) scale(1.04)}}
@keyframes film-orbit{from{transform:rotateX(57deg) rotateZ(-18deg)}to{transform:rotateX(57deg) rotateZ(342deg)}}
@keyframes film-trace{0%,100%{transform:translateX(-35%);opacity:0}22%{opacity:.65}65%{opacity:.4}85%{transform:translateX(70%);opacity:0}}
@keyframes film-point{from{transform:translateY(-12px);opacity:.25}to{transform:translateY(15px);opacity:.65}}
@media(max-width:700px){.film-disc-pink{left:-48%;top:27%;opacity:.09}.film-disc-blue{right:-55%;top:5%;opacity:.12}.film-orbit-one{left:-72%;top:8%}.film-orbit-two{right:-77%;top:28%}.film-thread{width:65%}.film-point-one{left:15%;top:9%}}
@media(prefers-reduced-motion:reduce){.reel-atmosphere .reel-depth>span{animation:none!important}.reel-depth{transform:none!important}}

/* v0.11 — Service names roll into the brand accent on interaction. */
.service-list summary{position:relative;gap:18px;padding:25px 0;transition:background .4s}
.service-list summary h3{flex:1;min-width:0;perspective:600px;font-size:clamp(24px,2.1vw,32px);transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.service-name{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.service-title-motion{display:flex;flex-wrap:wrap;column-gap:.24em;row-gap:.04em;line-height:1.14}
.service-word{display:inline-block;height:1.14em;overflow:hidden;perspective:400px}
.service-word-roll{display:flex;flex-direction:column;transition:transform .65s cubic-bezier(.22,.8,.22,1);transition-delay:calc(var(--word)*.065s)}
.service-word-roll>span{display:block;height:1.14em;line-height:1.14;white-space:nowrap;transform-origin:center;transition:transform .65s cubic-bezier(.22,.8,.22,1);transition-delay:calc(var(--word)*.065s)}
.service-word-roll>span:nth-child(2){color:var(--pink);transform:rotateX(-65deg)}
.service-list summary::before{content:'';position:absolute;left:-12px;top:22%;bottom:22%;width:3px;background:var(--pink);transform:scaleY(0);transform-origin:bottom;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.service-list summary .number{min-width:24px;color:var(--blue);transition:transform .5s,color .5s}
.service-list summary .detail-plus{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;border:1px solid #10101135;border-radius:50%;color:var(--ink);font-size:22px;transition:transform .55s cubic-bezier(.2,.8,.2,1),background .4s,border-color .4s}
.service-list details[open] summary .service-word-roll,.service-list summary:focus-visible .service-word-roll{transform:translateY(-50%)}
.service-list details[open] summary .service-word-roll>span:first-child,.service-list summary:focus-visible .service-word-roll>span:first-child{transform:rotateX(65deg)}
.service-list details[open] summary .service-word-roll>span:nth-child(2),.service-list summary:focus-visible .service-word-roll>span:nth-child(2){transform:rotateX(0)}
.service-list details[open] summary::before,.service-list summary:focus-visible::before{transform:scaleY(1)}
.service-list details[open] summary .detail-plus{background:var(--pink);color:#000;border-color:var(--pink);transform:rotate(135deg)}
.service-list details[open] summary h3,.service-list summary:focus-visible h3{transform:translateX(5px)}
.service-list details[open] .detail-copy{animation:service-copy-in .5s cubic-bezier(.2,.75,.2,1) both}
.service-title-arriving{animation:service-title-in .8s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--service-delay,0ms)}
@keyframes service-title-in{from{opacity:.3;transform:translate3d(16px,10px,0) rotateX(-18deg)}to{opacity:1;transform:none}}
@keyframes service-copy-in{from{opacity:.35;transform:translateY(9px)}to{opacity:1;transform:none}}
@media(hover:hover) and (pointer:fine){
 .service-list summary:hover h3{transform:translateX(7px)}
 .service-list summary:hover .service-word-roll{transform:translateY(-50%)}
 .service-list summary:hover .service-word-roll>span:first-child{transform:rotateX(65deg)}
 .service-list summary:hover .service-word-roll>span:nth-child(2){transform:rotateX(0)}
 .service-list summary:hover::before{transform:scaleY(1)}
 .service-list summary:hover .detail-plus{background:var(--pink);border-color:var(--pink);color:#000;transform:rotate(90deg)}
 .service-list details[open] summary:hover .detail-plus{transform:rotate(135deg)}
}
.motion-off .service-list summary *,.motion-off .service-list summary::before{transition:none!important}
.motion-off .service-title-arriving,.motion-off .service-list details[open] .detail-copy{animation:none!important}
@media(max-width:700px){.service-list summary{gap:10px;padding:24px 0}.service-list summary h3{font-size:24px;letter-spacing:-.8px}.service-list summary .detail-plus{width:32px;height:32px;flex-basis:32px}.service-list summary::before{left:-9px;width:2px}.service-list details[open] summary h3{transform:translateX(2px)}}
@media(prefers-reduced-motion:reduce){.service-list summary *,.service-list summary::before{transition:none!important}.service-title-arriving,.service-list details[open] .detail-copy{animation:none!important}}

/* v0.12 — The accordion owns the height and staggered copy transition. */
.service-list details[open] .detail-copy{animation:none}

/* v0.13 — Color sculpture and a central iris reveal around the P2W logo. */
@property --entry-aperture{syntax:'<length>';inherits:false;initial-value:0px}
.entry-overlay{overflow:hidden;perspective:1000px;perspective-origin:50% 50%;isolation:isolate}
.entry-veil{position:absolute;inset:0;background:#08080b;mask-image:radial-gradient(circle at center,transparent var(--entry-aperture),#000 calc(var(--entry-aperture) + 2px));-webkit-mask-image:radial-gradient(circle at center,transparent var(--entry-aperture),#000 calc(var(--entry-aperture) + 2px));animation:entry-iris 2.8s cubic-bezier(.55,0,.2,1) both}
.entry-color-stage{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none;animation:entry-stage-exit 2.8s ease-in both}
.entry-glow{position:absolute;inset:-25%;background:radial-gradient(ellipse at 25% 55%,#ea1f542e,transparent 48%),radial-gradient(ellipse at 76% 40%,#006caf50,transparent 48%);animation:entry-glow-turn 2.8s ease-in-out both}
.entry-ribbon{position:absolute;left:50%;top:50%;width:min(96vw,1000px);aspect-ratio:1;margin:0;translate:-50% -50%;border-radius:50%;mask-image:radial-gradient(circle,transparent 51%,#000 52%,#000 69%,transparent 70%);-webkit-mask-image:radial-gradient(circle,transparent 51%,#000 52%,#000 69%,transparent 70%);backface-visibility:visible;transform-style:preserve-3d}
.ribbon-pink{background:conic-gradient(from 35deg,#680b28,#ea1f54 20%,#ff719f 34%,#ea1f54 46%,#900d38 62%,#ea1f54 80%,#ff92b5 92%,#680b28);animation:entry-pink-flight 2.8s cubic-bezier(.22,.6,.2,1) both}
.ribbon-blue{width:min(90vw,920px);background:conic-gradient(from 190deg,#002840,#006caf 18%,#43b4ff 34%,#006caf 48%,#00345d 66%,#0095db 84%,#79d4ff 94%,#002840);animation:entry-blue-flight 2.8s cubic-bezier(.22,.6,.2,1) both}
.ribbon-light{width:min(110vw,1130px);background:conic-gradient(transparent 0% 18%,#ea1f54a0 20% 43%,transparent 45% 66%,#006cafa0 68% 88%,transparent 90%);mask-image:radial-gradient(circle,transparent 68.6%,#000 69%,#000 69.3%,transparent 69.7%);animation:entry-light-flight 2.8s ease-in-out both}
.entry-sphere{position:absolute;width:clamp(90px,18vmin,210px);aspect-ratio:1;border-radius:50%;translate:-50% -50%;box-shadow:inset -18px -22px 35px #0008,0 35px 55px #0005}
.sphere-pink{left:22%;top:65%;background:radial-gradient(circle at 30% 24%,#ffb0cc,#ea1f54 38%,#800a34 82%);animation:entry-pink-sphere 2.8s cubic-bezier(.2,.65,.2,1) both}
.sphere-blue{left:80%;top:27%;width:clamp(65px,12vmin,145px);background:radial-gradient(circle at 30% 24%,#a5e2ff,#006caf 40%,#002642 86%);animation:entry-blue-sphere 2.8s cubic-bezier(.2,.65,.2,1) both}
.entry-overlay .entry-brand{position:absolute;inset:0;justify-content:center;gap:24px;z-index:3;animation:entry-logo-flight 2.8s cubic-bezier(.2,.7,.2,1) both}
.entry-overlay .entry-brand>img{width:clamp(240px,35vw,500px);filter:drop-shadow(0 8px 18px #000a)}
.entry-overlay .entry-brand>span{font-size:10px;letter-spacing:4px;color:#f3f1ed}
.entry-overlay #entry-skip{z-index:5;bottom:25px;color:#f3f1ed;background:#08080b90;border-radius:24px;padding:12px 18px;backdrop-filter:blur(8px)}
@keyframes entry-iris{0%,58%{--entry-aperture:0px}100%{--entry-aperture:120vmax}}
@keyframes entry-stage-exit{0%,60%{opacity:1}100%{opacity:0}}
@keyframes entry-glow-turn{0%{transform:rotate(-30deg);opacity:0}25%,60%{opacity:1}100%{transform:rotate(40deg);opacity:0}}
@keyframes entry-pink-flight{0%{opacity:0;transform:translate3d(-25%,15%,-380px) rotateX(65deg) rotateY(-30deg) rotateZ(-100deg) scale(.5)}20%{opacity:1}48%{transform:translateZ(20px) rotateX(35deg) rotateY(-24deg) rotateZ(20deg) scale(1)}65%{opacity:1;transform:translateZ(55px) rotateX(28deg) rotateY(-18deg) rotateZ(78deg) scale(1.08)}100%{opacity:0;transform:translate3d(-65%,-20%,500px) rotateX(65deg) rotateY(35deg) rotateZ(165deg) scale(1.5)}}
@keyframes entry-blue-flight{0%{opacity:0;transform:translate3d(30%,-20%,-420px) rotateX(-55deg) rotateY(40deg) rotateZ(125deg) scale(.5)}22%{opacity:1}48%{transform:translateZ(-10px) rotateX(-38deg) rotateY(24deg) rotateZ(-25deg) scale(1)}65%{opacity:1;transform:translateZ(10px) rotateX(-32deg) rotateY(18deg) rotateZ(-82deg) scale(1.06)}100%{opacity:0;transform:translate3d(65%,25%,480px) rotateX(-70deg) rotateY(-30deg) rotateZ(-170deg) scale(1.5)}}
@keyframes entry-light-flight{0%{opacity:0;transform:rotateX(70deg) rotateZ(-120deg) scale(.6)}25%,65%{opacity:.7}100%{opacity:0;transform:rotateX(30deg) rotateZ(100deg) scale(1.8)}}
@keyframes entry-pink-sphere{0%{opacity:0;transform:translate3d(-180px,140px,-180px) scale(.4)}22%,65%{opacity:1}52%{transform:translate3d(50px,-45px,60px) scale(1)}100%{opacity:0;transform:translate3d(-420px,-130px,400px) scale(1.8)}}
@keyframes entry-blue-sphere{0%{opacity:0;transform:translate3d(150px,-110px,-180px) scale(.4)}25%,65%{opacity:1}52%{transform:translate3d(-55px,65px,30px) scale(1)}100%{opacity:0;transform:translate3d(430px,170px,400px) scale(1.8)}}
@keyframes entry-logo-flight{0%{opacity:0;transform:translateZ(-80px) rotateX(12deg) scale(.85)}20%,60%{opacity:1;transform:translateZ(0) rotateX(0) scale(1)}72%{opacity:0;transform:translateZ(110px) scale(1.06)}100%{opacity:0;transform:translateZ(260px) scale(1.13)}}
@media(max-width:700px){.entry-ribbon{width:135vw}.ribbon-blue{width:128vw}.ribbon-light{width:160vw}.sphere-pink{left:10%;top:70%}.sphere-blue{left:88%;top:28%}.entry-overlay .entry-brand>img{width:72vw;max-width:370px}.entry-overlay .entry-brand>span{font-size:9px;letter-spacing:2.5px}}
@media(prefers-reduced-motion:reduce){.entry-overlay{display:none!important}.entry-overlay *{animation:none!important}}

/* v0.14 — A project playground: write an idea, take it to WhatsApp. */
.continuous-background>.contact-lab{padding-top:110px;padding-bottom:90px}
.contact-invitation{display:flex;align-items:end;justify-content:space-between;gap:35px;margin-bottom:70px}
.contact-invitation h2{font-size:clamp(54px,7.5vw,118px)}
.contact-invitation h2 em{color:var(--pink)}
.contact-invitation>p{font-size:17px;max-width:285px;line-height:1.65;color:#514d50;padding-bottom:10px}
.contact-arena{display:grid;grid-template-columns:1.15fr .85fr;gap:75px;align-items:center}
.contact-lab .idea-composer{background:none;color:var(--ink);border:0;box-shadow:none;padding:0;overflow:visible;border-radius:0;isolation:auto}
.idea-composer::before,.idea-composer::after{display:none}
.idea-step{display:flex;gap:13px;align-items:center;font-size:13px;margin-bottom:17px;line-height:1.5}
.idea-step-number{width:29px;height:29px;border:1px solid #10101145;border-radius:50%;display:grid;place-items:center;font-size:10px;flex:0 0 29px;color:var(--blue)}
.idea-composer .intent-choices{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.idea-composer .intent-chip{display:flex;justify-content:space-between;align-items:center;gap:10px;color:var(--ink);border:1px solid #10101130;background:#ffffff40;border-radius:26px;min-height:48px;padding:12px 18px;font-size:13px;transition:background .35s,border-color .35s,transform .35s}
.idea-composer .intent-chip>span{font-size:18px;transition:transform .4s}
.idea-composer .intent-chip:hover{border-color:var(--pink);transform:translateY(-2px)}
.idea-composer .intent-chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.idea-composer .intent-chip[aria-pressed="true"]>span{color:#fa779b;transform:rotate(12deg)}
.idea-composer .intent-copy{margin-top:25px;min-height:95px}
.idea-composer .intent-copy h3{font-size:clamp(25px,2.8vw,40px);line-height:1.12;letter-spacing:-.045em}
.idea-composer .intent-copy p{color:#514d50;font-size:14px;line-height:1.6;margin-top:12px;max-width:460px}
.idea-text-label{margin-top:25px}
.idea-input-wrap{position:relative}
#project-idea{display:block;width:100%;resize:vertical;min-height:130px;max-height:300px;padding:21px 22px 35px;color:var(--ink);background:#fff8;border:1px solid #10101130;border-radius:16px;font-size:17px;line-height:1.5;transition:border-color .3s,box-shadow .3s}
#project-idea::placeholder{color:#716a6f}
#project-idea:focus{border-color:var(--pink);box-shadow:0 0 0 4px #ea1f5410;outline:2px solid #ea1f54;outline-offset:3px}
.idea-count{position:absolute;bottom:12px;right:18px;font-size:10px;color:#61585e;pointer-events:none}
.idea-help{margin-top:12px;font-size:12px;color:#61585e;line-height:1.5}
.idea-composer .contact-chat{display:flex;gap:12px;justify-content:start;background:var(--pink);color:#000;border-radius:30px;margin-top:23px;min-height:60px;padding:16px 22px;font-size:14px;transition:transform .3s,box-shadow .3s}
.contact-chat svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:0 0 25px}
.idea-composer .idea-send-arrow{margin-left:auto;font-size:23px;transition:transform .35s}
.idea-composer .contact-chat:hover{transform:translateY(-3px);box-shadow:0 12px 30px #ea1f5420}
.idea-composer .contact-chat:hover .idea-send-arrow{transform:translate(3px,-3px)}
.idea-composer .console-brief{color:#514d50;margin-top:20px;min-height:44px;font-size:12px}
.idea-playground{position:relative;min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center}
.idea-sculpture{position:relative;height:430px;perspective:850px;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.2,.7,.2,1);transform:rotateZ(var(--idea-turn,0deg))}
.idea-core{position:absolute;left:50%;top:50%;width:clamp(190px,22vw,310px);aspect-ratio:1;border-radius:50%;translate:-50% -50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:27px;background:radial-gradient(circle at 30% 20%,#303035,#101011 65%);color:var(--paper);box-shadow:inset -20px -18px 45px #0007,0 30px 50px #1010111c;transform:rotateZ(calc(-1 * var(--idea-turn,0deg)));transition:transform .8s}
.idea-core img{width:72%;height:auto}
.idea-core-kicker{font-size:9px;letter-spacing:2px;color:#c3bec1}
.idea-mode{font-size:10px;letter-spacing:1.5px;color:#f3f1ed}
.idea-track{position:absolute;left:50%;top:50%;width:clamp(260px,34vw,480px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;border:17px solid var(--pink);box-shadow:inset 0 0 13px #ffb0cc,0 0 8px #ea1f5418;animation:idea-orbit 22s linear infinite;animation-play-state:paused}
.track-blue{border-color:var(--blue);border-width:9px;width:clamp(300px,38vw,530px);box-shadow:inset 0 0 8px #64ceff;animation-name:idea-orbit-blue;animation-duration:31s;animation-direction:reverse}
.idea-ball{position:absolute;width:78px;height:78px;border-radius:50%;box-shadow:inset -9px -12px 20px #0006,0 16px 30px #1010111a;animation:idea-ball-float 8s ease-in-out infinite alternate;animation-play-state:paused}
.ball-rose{background:radial-gradient(circle at 28% 22%,#ffb4ce,var(--pink) 44%,#80052a);left:2%;top:67%}
.ball-blue{background:radial-gradient(circle at 28% 22%,#a4e5ff,var(--blue) 45%,#003555);right:3%;top:11%;width:55px;height:55px;animation-delay:-3s;animation-duration:11s}
.contact-play .idea-track,.contact-play .idea-ball{animation-play-state:running}
.idea-play-caption{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid #10101125;padding-top:20px;margin-top:28px;font-size:11px;color:#514d50}
.idea-play-caption>span:last-child{font-size:12px;font-weight:700;letter-spacing:.3px;color:var(--ink)}
.idea-play-caption b{font-size:22px;margin-left:12px;color:var(--pink);font-weight:400}
.has-project-idea .idea-core{box-shadow:inset -20px -18px 45px #0007,0 25px 60px #ea1f5423}
.contact-socials{display:flex;align-items:center;justify-content:space-between;gap:35px;border-top:1px solid #10101125;padding-top:35px;margin-top:75px}
.social-intro>span{display:block;font-size:20px;letter-spacing:-.5px}
.social-intro small{display:block;color:#61585e;font-size:12px;margin-top:6px}
.social-icons{display:flex;gap:23px}
.social-placeholder{display:flex;align-items:center;gap:9px;color:#514d50;font-size:11px}
.social-placeholder svg{width:44px;height:44px;padding:11px;border:1px solid #10101130;border-radius:50%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.social-dot{fill:currentColor;stroke:none}
.contact-direct{text-align:right;display:flex;flex-direction:column;gap:7px;font-size:12px;color:#61585e}
.contact-direct>a{font-size:17px;color:var(--ink);min-height:44px;display:flex;align-items:center}
.contact-direct>a span{color:var(--pink);margin-left:10px}
@keyframes idea-orbit{from{transform:rotateX(58deg) rotateY(-20deg) rotateZ(0deg)}to{transform:rotateX(58deg) rotateY(-20deg) rotateZ(360deg)}}
@keyframes idea-orbit-blue{from{transform:rotateX(-50deg) rotateY(25deg) rotateZ(0deg)}to{transform:rotateX(-50deg) rotateY(25deg) rotateZ(360deg)}}
@keyframes idea-ball-float{from{transform:translate3d(0,-8px,0)}to{transform:translate3d(15px,12px,25px)}}
.motion-off .idea-track,.motion-off .idea-ball{animation-play-state:paused!important}
.motion-off .contact-lab *{transition:none!important}
@media(max-width:1100px){.contact-arena{gap:35px;grid-template-columns:1.1fr .9fr}.contact-invitation{display:block}.contact-invitation>p{margin-top:30px;max-width:500px}.contact-socials{flex-wrap:wrap}.contact-direct{text-align:left}.social-icons{gap:15px}.social-placeholder{flex-direction:column}.idea-core-kicker{font-size:8px;letter-spacing:1px}}
@media(max-width:700px){.continuous-background>.contact-lab{padding-top:100px;padding-bottom:65px}.contact-invitation{margin-bottom:40px}.contact-invitation h2{font-size:clamp(43px,10.4vw,70px)}.contact-invitation>p{font-size:15px;margin-top:24px}.contact-arena{display:flex;flex-direction:column;gap:35px}.idea-composer{width:100%}.idea-composer .intent-chip{padding:11px 14px;font-size:12px}.idea-composer .intent-copy{min-height:118px;margin-top:24px}.idea-composer .intent-copy h3{font-size:29px}.idea-composer .intent-copy p{font-size:14px}.idea-step{font-size:12px}.idea-composer .contact-chat{font-size:13px;gap:10px;padding:14px 17px}.idea-playground{width:100%;min-height:0}.idea-sculpture{height:310px;max-width:450px;width:100%;margin:auto}.idea-core{width:200px;gap:21px}.idea-track{width:270px;border-width:13px}.track-blue{width:295px;border-width:8px}.idea-ball{width:56px;height:56px}.ball-rose{left:3%;top:66%}.ball-blue{right:4%;top:11%;width:42px;height:42px}.idea-play-caption{margin-top:0;font-size:10px}.contact-socials{margin-top:45px;gap:26px;padding-top:30px}.social-intro{width:100%}.social-icons{gap:18px}.social-placeholder{font-size:10px}.contact-direct{margin-left:auto;font-size:10px}.contact-direct>a{font-size:13px}.contact-direct>a span{margin-left:4px}.social-placeholder svg{width:42px;height:42px;padding:11px}}
@media(max-width:360px){.contact-direct{margin-left:0;width:100%}.idea-composer .intent-chip{padding:10px 11px}.idea-play-caption{gap:10px}.idea-sculpture{height:280px}.idea-track{width:240px}.track-blue{width:265px}.idea-core{width:178px}.idea-core-kicker{letter-spacing:.7px}.idea-mode{font-size:9px}.idea-composer .contact-chat{font-size:13px;padding:14px}.contact-chat svg{width:22px;height:22px;flex-basis:22px}}
@media(prefers-reduced-motion:reduce){.idea-track,.idea-ball{animation:none!important}.contact-lab *{transition:none!important}}

.idea-composer .contact-chat>span:not(.idea-send-arrow){font-size:inherit;line-height:1.5;letter-spacing:0}

/* v0.15 — A visible way to unlock background music when autoplay is blocked. */
#sound-prompt{position:fixed;right:var(--gutter);bottom:92px;z-index:30;min-height:44px;padding:12px 18px;border-radius:24px;border:1px solid var(--pink);background:var(--paper);color:var(--ink);font-size:12px;box-shadow:0 8px 25px #10101130}
#sound-prompt[hidden]{display:none}
#sound-prompt>span{margin-left:18px;color:var(--pink);font-size:18px}
@media(max-width:700px){#sound-prompt{bottom:82px;font-size:11px;padding:10px 14px}}
