/* LOWKII motion: restrained entrances, tactile selections, clear state changes. */
:root{--motion-ease:cubic-bezier(.22,1,.36,1)}
html{scroll-behavior:smooth}
body{scrollbar-gutter:stable}
.reveal-pending{opacity:0}
.service-content{animation:none}
.service-list details{overflow-anchor:none}
.service-list summary{transition:color .25s ease}
.service-n{transition:color .25s ease,transform .35s var(--motion-ease)}
.service-plus{transition:transform .35s var(--motion-ease)}
.service-list details[data-expanded=false] .service-plus{transform:rotate(0)}
.service-list details[data-expanded=true] .service-plus{transform:rotate(45deg)}
.nav-contact,.pill-button,.motion-toggle,.work-filters button,.service-options span{
 transition:background-color .22s ease,color .22s ease,border-color .22s ease,box-shadow .3s ease,transform .3s var(--motion-ease);
}
.nav-contact>span,.pill-button>span,.round-cta>span{display:inline-block;transition:transform .35s var(--motion-ease)}
.text-link{position:relative;transition:color .2s ease,opacity .2s ease}
.text-link>span{transition:transform .35s var(--motion-ease)}
.dialog-close{transition:transform .3s var(--motion-ease),background-color .2s ease}
.round-cta{transition:transform .45s var(--motion-ease),box-shadow .45s var(--motion-ease)}
.service-options span{display:flex;align-items:center;justify-content:center;min-height:44px}
.service-options span::after{content:'';display:inline-block;width:0;height:9px;border:0 solid currentColor;opacity:0;transform:rotate(45deg) scale(.6);transition:width .25s var(--motion-ease),margin-left .25s var(--motion-ease),opacity .2s ease,transform .25s var(--motion-ease)}
.service-options input:checked+span::after{width:5px;border-right-width:1.5px;border-bottom-width:1.5px;margin-left:10px;opacity:1;transform:translateY(-2px) rotate(45deg) scale(1)}
.step-progress span{transition:width .4s var(--motion-ease)}
input,select,textarea{transition:border-color .2s ease,background-color .2s ease}
input:focus,select:focus,textarea:focus{background:#fff}
dialog[open]::backdrop{animation:lowkii-backdrop-in .3s ease both}
dialog[data-closing=true]::backdrop{animation:lowkii-backdrop-out .18s ease both}
@keyframes lowkii-backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes lowkii-backdrop-out{from{opacity:1}to{opacity:0}}
@media(hover:hover) and (pointer:fine){
 .nav-contact:hover,.pill-button:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 6px 18px #0000000c}
 .nav-contact:hover>span,.pill-button:hover>span{transform:translate(2px,-2px)}
 .round-cta:hover{transform:rotate(5deg);box-shadow:inset 1px 2px 4px white,0 12px 28px #0000000a}
 .round-cta:hover>span{transform:translate(4px,-4px)}
 .dialog-close:hover{background:#e9e9e6;transform:rotate(90deg)}
 .service-list summary:hover .service-n{color:var(--ink);transform:translateX(3px)}
 .service-options input:not(:checked)+span:hover{background:#eaeae7;border-color:#acafaa}
 .text-link[href="#proyectos"]:hover>span{transform:translateY(4px)}
}
.pill-button:not(:disabled):active,.nav-contact:active,.round-cta:active,.work-filters button:active,.motion-toggle:active{transform:scale(.975)}
@media(max-width:700px){
 .menu-lines{position:relative;border:0}
 .menu-lines::before,.menu-lines::after{content:'';position:absolute;left:0;width:21px;height:1px;background:currentColor;transition:transform .28s var(--motion-ease),top .28s var(--motion-ease);transform-origin:center}
 .menu-lines::before{top:0}.menu-lines::after{top:11px}
 .menu-toggle[aria-expanded=true] .menu-lines::before{top:5px;transform:rotate(45deg)}
 .menu-toggle[aria-expanded=true] .menu-lines::after{top:5px;transform:rotate(-45deg)}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .reveal-pending{opacity:1}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .work-card:hover .stock-video,.round-cta:hover,.round-cta:hover>span,.nav-contact:hover,.pill-button:hover,.text-link:hover>span,.dialog-close:hover{transform:none}
}