/* PREMIUM_LAYER · capa de movimiento y narrativa (no sustituye a style.css) */
:root{--e:cubic-bezier(.22,.8,.2,1)}html{scroll-padding-top:96px}
.pbar{position:fixed;inset:0 0 auto;height:3px;z-index:1500;background:var(--blue);transform:scaleX(var(--p,0));transform-origin:0 50%}
.header{position:sticky;top:0;z-index:1000;width:100%;max-width:none;padding-inline:max(48px,calc((100vw - 1344px)/2));background:#fffffff2;transition:transform .6s var(--e),height .5s var(--e),box-shadow .4s}
@supports(backdrop-filter:blur(1px)){.header{background:#ffffffd6;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}}
.header.s{box-shadow:0 1px 0 var(--line)}.header.hide{transform:translateY(-101%)}.header nav>a{position:relative}.header nav>a.on{color:var(--blue)}
.header nav>a:not(.contact-nav):after{content:"";position:absolute;left:0;right:0;bottom:8px;height:1px;background:var(--blue);transform:scaleX(0);transform-origin:0 50%;transition:transform .5s var(--e)}.header nav>a.on:after,.header nav>a:hover:after{transform:scaleX(1)}
@media(max-width:700px){.header{padding-inline:20px}}
.rail{position:fixed;right:18px;top:50%;translate:0 -50%;z-index:900;display:grid;gap:14px}.rail a{width:9px;height:9px;border-radius:50%;background:#8a93a69e;position:relative;transition:transform .4s var(--e),background .3s}.rail a.on{background:var(--blue);transform:scale(1.55)}
.rail span{position:absolute;right:20px;top:50%;translate:0 -50%;font-size:11px;white-space:nowrap;opacity:0;pointer-events:none;background:var(--ink);color:#fff;padding:3px 9px;transition:opacity .3s}.rail a:hover span,.rail a:focus-visible span{opacity:1}@media(max-width:1100px){.rail{display:none}}
.ln{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}.ln>span{display:block}
@keyframes rise{from{transform:translateY(112%)}}@keyframes fade{from{opacity:0;transform:translateY(20px)}}
.hero{position:relative;isolation:isolate}.hero:before{content:"";position:absolute;inset:-110px -8vw auto;height:700px;z-index:-1;pointer-events:none;background:radial-gradient(520px circle at var(--mx,72%) var(--my,28%),#3659e326,transparent 70%),linear-gradient(#171a2008 1px,transparent 1px) 0 0/100% 56px,linear-gradient(90deg,#171a2008 1px,transparent 1px) 0 0/56px 100%;-webkit-mask-image:linear-gradient(#000 35%,transparent);mask-image:linear-gradient(#000 35%,transparent)}
.a .hero h1 .ln>span{animation:rise 1.3s var(--e) calc(var(--d)*.14s + .15s) both}.a .hero-top{animation:fade 1s var(--e) .1s both}.a .hero-bottom{animation:fade 1.1s var(--e) .8s both}.a .reel-cap,.a .reel{animation:fade 1.2s var(--e) 1.05s both}.a .profile-strip{animation:fade 1.1s var(--e) 1.3s both}
.reel-cap{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:650;color:var(--muted);margin-bottom:16px}
.reel{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding-bottom:12px}.reel a{position:relative;display:block;overflow:hidden;aspect-ratio:4/3;background:#edf0f6;color:#fff;text-decoration:none}
.reel img{width:100%;height:114%;object-fit:cover;object-position:top;transform:translate3d(0,var(--ry,0px),0);scale:1.02;transition:scale 1.4s var(--e)}.reel a:hover img{scale:1.08}.reel a:after{content:"";position:absolute;inset:auto 0 0;height:55%;background:linear-gradient(transparent,#0a0e1ad9)}
.reel span{position:absolute;z-index:1;left:16px;right:16px;bottom:14px;display:flex;justify-content:space-between;font-size:11px;font-weight:650;letter-spacing:.08em;text-transform:uppercase}
@media(max-width:700px){.reel{grid-template-columns:1fr 1fr}.reel a:first-child{grid-column:1/-1}.reel a:nth-child(n){translate:none}.reel{padding-bottom:30px}}
.a [data-r]{opacity:0;transform:translateY(32px);transition:opacity 1s var(--e),transform 1.2s var(--e);transition-delay:calc(var(--i,0)*.09s)}.a [data-r].in{opacity:1;transform:none}
.a main h2 .ln>span{transform:translateY(112%);transition:transform 1.2s var(--e) calc(var(--d)*.12s)}.a main h2.in .ln>span{transform:none}
.a .project .project-visual{clip-path:inset(0 0 100% 0);transition:clip-path 1.6s var(--e)}.a .project.in .project-visual{clip-path:inset(0)}.a .project .project-visual img{scale:1.18;transition:scale 2.2s var(--e)}.a .project.in .project-visual img{scale:1}
.project-image-link img{transition:transform .8s var(--e),box-shadow .8s var(--e)}.project-image-link:hover img{transform:translateY(-8px);box-shadow:0 34px 60px -34px #171a2088}
.career-head{position:relative}.career-head:after{content:"";position:absolute;left:0;right:0;bottom:-12px;height:2px;background:var(--blue);transform:scaleX(var(--d,1));transform-origin:0 50%}
.tool-level{display:inline-flex;align-items:center;gap:9px}.tool-level:after{content:"";width:38px;height:4px;border-radius:2px;background:linear-gradient(currentColor,currentColor) 0 0/var(--m,100%) 100% no-repeat,#00000014;transition:background-size 1.3s var(--e) .35s}.tool-level-specific{--m:66%}.tool-level-supported{--m:33%}.a .tools-table tr:not(.in) .tool-level:after{background-size:0 100%,auto}
.tools-table tbody tr{transition:background .4s}.tools-table tbody tr:hover{background:#f4f5f8}
.contact{position:relative;overflow:hidden;isolation:isolate}.contact:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(560px circle at var(--mx,70%) var(--my,40%),#3659e344,transparent 70%)}.email{display:inline-flex;transition:translate .5s var(--e)}
.header{overflow-anchor:none}.reel a{aspect-ratio:16/10}.reel span i{font-style:normal;font-weight:600}
@media(min-width:701px){.hero{padding-top:34px}.hero h1{margin-top:26px;font-size:clamp(52px,6.2vw,92px)}.hero-bottom{margin:24px 0 30px}}
.avail{display:inline-flex;align-items:center;gap:10px}.avail i{width:8px;height:8px;border-radius:50%;background:#1faa59;animation:pulse 2.2s infinite}@keyframes pulse{0%{box-shadow:0 0 0 0 #1faa5966}70%,100%{box-shadow:0 0 0 10px #1faa5900}}
.fab{position:fixed;right:24px;bottom:24px;z-index:950;display:inline-flex;gap:14px;align-items:center;padding:14px 20px;background:var(--blue);color:#fff;text-decoration:none;font-size:12px;font-weight:600;translate:0 90px;opacity:0;transition:translate .6s var(--e),opacity .4s,background .3s}.fab:not(.on){visibility:hidden;transition:translate .6s var(--e),opacity .4s,visibility 0s .6s}.fab.on{translate:0 0;opacity:1}.fab:hover{background:#2443bc}@media(max-width:700px){.fab{right:14px;bottom:14px}}
.demo-priv{margin-top:30px;padding:26px 28px;border:1px solid var(--line);background:var(--soft)}.demo-priv .eyebrow{color:var(--blue);margin-bottom:10px}.demo-priv h5{font-size:22px;letter-spacing:-.04em;line-height:1.15;font-weight:650;margin:0 0 8px}.demo-priv p:not(.eyebrow){color:var(--muted);font-size:14px;margin:0 0 20px}.demo-priv .button{display:inline-flex}
.header.hide{transform:none}.header nav>a.contact-nav{background:var(--blue);color:#fff;border:0;padding:0 18px;transition:background .3s}.header nav>a.contact-nav:hover,.header nav>a.contact-nav.on{background:#2443bc;color:#fff}
.about-text{margin-top:18px;color:var(--muted);max-width:520px}.about-photo{margin:34px 0 0;max-width:340px}.about-photo img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}.about-photo figcaption{font-size:11px;color:var(--muted);margin-top:10px}
.intro{display:flex;align-items:flex-start;gap:20px;max-width:720px}.intro p{font-size:19px;color:var(--muted);line-height:1.6;letter-spacing:-.025em;max-width:620px}.hero-avatar{width:60px;height:60px;border-radius:50%;object-fit:cover;flex:none;border:3px solid #fff;box-shadow:0 0 0 1px var(--line),0 10px 24px -12px #171a2088}
@media(max-width:700px){.intro p{font-size:16px}.hero-avatar{width:46px;height:46px}.intro{gap:14px}}
@media(prefers-reduced-motion:reduce){.pbar{display:none}*{animation:none!important;transition:none!important}.reel a:nth-child(n){translate:none}}

/* PORTFOLIO_INTEGRATION_FIXES_START */
main{overflow-x:clip}
@media(max-width:700px){.reel span{flex-wrap:wrap;gap:4px 10px}}
/* PORTFOLIO_INTEGRATION_FIXES_END */

/* PORTFOLIO_PROGRESS_V1_START */
@media(min-width:1101px){
  .pbar{inset:0 0 0 auto;width:3px;height:auto;z-index:1100;background:transparent;transform:none;pointer-events:none}
  .pbar:before{content:"";position:absolute;inset:0;background:var(--blue);transform:scaleY(var(--p,0));transform-origin:50% 100%}
  .rail{right:calc(var(--progress-right,0px) + var(--progress-width,36px)/2 - 12px);z-index:1101;gap:2px}
  .header nav>a.contact-nav.on:not(:hover){background:var(--blue)}
  .rail a{width:24px;height:24px;background:none;transform:none;--dot-color:#65718d;--dot-scale:1}
  .rail a.on{background:none;transform:none;--dot-color:var(--blue);--dot-scale:1.55}
  .rail a.on-fill{background:none;--dot-color:#65718d}
  .rail a.on-fill.on{background:none;--dot-color:var(--blue)}
  .rail a:before{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;background:var(--dot-color);border-radius:50%;transform:translate(-50%,-50%) scale(var(--dot-scale));transition:transform .4s var(--e),background .3s,box-shadow .3s}
  .rail a.on-fill.on:before{box-shadow:0 0 0 3px #fff}
  .rail span{right:32px}
  .rail a.on-fill:focus-visible{outline-color:var(--blue)}
}
@media(prefers-reduced-motion:reduce){.pbar{display:block}}
/* PORTFOLIO_PROGRESS_V1_END */