/* Desktop depth and narrative revision. Character assets have genuine alpha. */
body.portfolio-site{isolation:isolate}.portfolio-site main{position:relative;z-index:2}.portfolio-site .site-footer{z-index:2}.portfolio-site .ambient{z-index:-3}.scene-background{position:fixed;inset:0;z-index:-2;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 83% 56%,#4a64002a,transparent 52%),#080a08}.scene-photo{position:absolute;inset:-10%;background-image:url('../assets/hero-poster.webp');background-size:310% 100%;background-position:left top;filter:blur(42px);opacity:.24;transform:scale(1.08)}.scene-light{position:absolute;pointer-events:none;filter:blur(65px);opacity:.6;will-change:transform}.light-one{width:35vw;height:110vh;right:-5%;top:-10%;background:linear-gradient(180deg,transparent,#b7e6001f,transparent);transform:rotate(30deg);animation:light-sweep 16s ease-in-out infinite alternate}.light-two{width:70vw;height:45vh;left:-20%;bottom:-10%;background:radial-gradient(ellipse,#9fc90018,transparent 65%);animation:light-breathe 13s ease-in-out infinite alternate}.scene-horizon{position:absolute;width:180%;height:55%;left:-40%;bottom:-15%;background-image:linear-gradient(#c6ff0013 1px,transparent 1px),linear-gradient(90deg,#c6ff0010 1px,transparent 1px);background-size:80px 80px;transform:perspective(550px) rotateX(65deg);mask-image:radial-gradient(ellipse,black,transparent 65%);animation:horizon-flow 18s linear infinite}.portfolio-site #atmosphere{z-index:0;opacity:.95}.portfolio-site .site-header.in-hero,.portfolio-site .site-header.in-hero.scrolled{height:100px;padding-block:27px;background:transparent;border-color:transparent;backdrop-filter:none}.portfolio-site .site-header{transition:background .4s,border-color .4s,padding .4s,height .4s}.portfolio-site .hero{background:transparent;clip-path:none;border:0}.portfolio-site .hero-stage{inset:0 -2%;mask-image:none;isolation:isolate;transform-origin:75% 50%}.portfolio-site .art{mask-image:none;filter:drop-shadow(0 12px 20px #0008)}.hero-stage:before{content:'';position:absolute;left:52%;width:45%;top:80%;height:5%;background:radial-gradient(ellipse,#9cce0040,#111b0750 45%,transparent 70%);filter:blur(14px);transform:rotate(-3deg);z-index:-1}.hero h1>span.hero-ia{font-size:.88em;line-height:1.1;letter-spacing:-.075em}.hero-ia strong{font-weight:inherit;color:var(--lime);-webkit-text-stroke:0}.hero-reaction{bottom:14%;right:5%}.hero-copy{will-change:transform}.hero-coordinates{top:120px}.portfolio-site .hero-bottom{bottom:28px}.portfolio-site .hero:before{background:radial-gradient(ellipse at 78% 66%,#9bb8000a,transparent 50%)}
.connection-visual{aspect-ratio:1;position:relative;align-self:center;--connect:0}.connection-visual>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.connection-wire{fill:none;stroke:var(--lime);stroke-width:1;stroke-dasharray:650;stroke-dashoffset:calc(650*(1 - var(--connect)));filter:drop-shadow(0 0 8px #c6ff0050)}.connection-guide{fill:none;stroke:#c6ff001e;stroke-dasharray:1 9;transform-origin:200px 200px;animation:slow-spin 50s linear infinite}.connection-node{position:absolute;background:#11180dbf;border:1px solid #c6ff0030;backdrop-filter:blur(8px);width:150px;padding:18px;transform-origin:center;box-shadow:0 10px 35px #0003}.connection-node>.mono{font-size:6px;display:block;color:#8a9d70;margin-bottom:8px}.connection-node>b{font-size:25px;letter-spacing:-1.5px;font-weight:500}.connection-a{left:0;top:12%;transform:translate(calc(var(--connect)*20px),calc(var(--connect)*25px)) rotate(calc(-8deg + var(--connect)*8deg))}.connection-b{right:-3%;bottom:10%;transform:translate(calc(var(--connect)*-20px),calc(var(--connect)*-25px)) rotate(calc(8deg - var(--connect)*8deg))}.connection-b>b{color:var(--lime)}.connection-result{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;opacity:0;color:var(--lime);text-shadow:0 0 30px #c6ff0020;pointer-events:none}.connection-result>span{font-size:35px;font-weight:200}.connection-result>b{font-size:20px;letter-spacing:-1px;font-weight:450}.connection-caption{position:absolute;bottom:-45px;left:0;right:0;text-align:center;color:#7e8a6c;font-size:6px;letter-spacing:.5px}.connection-visual:before{content:'';position:absolute;inset:-30%;background:radial-gradient(ellipse,#a8c4000f,transparent 60%)}
.process-readout{margin-top:45px;padding:20px 0;border-block:1px solid var(--line);max-width:380px}.process-readout>div.mono{display:flex;justify-content:space-between;font-size:7px;color:#7f8e6d}.process-readout b{font-weight:400;color:var(--lime)}.process-readout>p{font-size:22px;letter-spacing:-.8px;color:#d0d8c4;margin-block:15px 20px;line-height:1.2}.process-timeline{display:flex;gap:6px}.process-timeline i{display:block;height:2px;flex:1;background:#ffffff16;transition:background .3s}.process-timeline i.active{background:var(--lime);box-shadow:0 0 10px #c6ff0030}.process-step{transform-origin:top center;will-change:transform}.process-step h3{transition:color .4s}.process-step.active h3{color:#f1f1e9}.terminal-code>div{transition:opacity .18s,transform .18s}.about-terminal{will-change:transform}.marquee>div{animation:none;will-change:transform}.marquee{transform:rotate(-3deg)}.outcomes{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:90px;border-top:1px solid var(--line);padding-top:35px}.outcomes article{position:relative;opacity:calc(.12 + var(--outcome,0)*.88);transform:translateY(calc(28px*(1 - var(--outcome,0))));padding-right:30px}.outcomes .mono{font-size:7px;color:var(--lime)}.outcomes h3{font-size:28px;letter-spacing:-1.2px;margin-block:18px 10px}.outcomes p{font-size:11px;color:#89987b;line-height:1.6}.outcomes i{position:absolute;right:0;top:7px;color:#78924f;font-style:normal;font-size:24px;transform:translateY(calc(10px*(1 - var(--outcome,0))))}.contact-main{transform:translateY(calc(40px*(1 - var(--contact-reveal,1))));opacity:calc(.35 + var(--contact-reveal,1)*.65)}.contact-arrow{transform:rotate(calc(28deg*(1 - var(--contact-reveal,1))))}.contact-arrow:hover{transform:rotate(45deg)}.chart-line{stroke-dashoffset:calc(950*(1 - var(--chart-progress,1)));transition:stroke-dashoffset .15s}
@media(min-width:701px){.portfolio-site .hero-scroll{height:270dvh;min-height:0;z-index:1}.portfolio-site .hero{height:100dvh;min-height:0}.portfolio-site .idea-section{margin-top:-80dvh;height:160dvh;z-index:3;border:0;box-shadow:none;background:transparent}.portfolio-site .idea-section:before{display:none}.portfolio-site .idea-sticky{background:transparent;min-height:100dvh}.portfolio-site .idea-layout{grid-template-columns:29% 1fr}.hero-scroll .hero-intro{max-width:440px}.expertise-body{perspective:1000px}.system-visual{will-change:transform}.work-section{height:300svh}.about{padding-top:115px}}
@keyframes light-sweep{to{transform:translate(-28vw,5vh) rotate(-8deg);opacity:.95}}@keyframes light-breathe{to{transform:translate(25vw,-6vh) scale(1.35);opacity:1}}@keyframes horizon-flow{to{background-position:0 80px,0 80px}}
[data-motion=off] .hero{clip-path:none!important}[data-motion=off] .idea-section{margin-top:0;height:auto}[data-motion=off] .connection-result{opacity:1!important;transform:translate(-50%,-50%)!important}[data-motion=off] .connection-wire{stroke-dashoffset:0}[data-motion=off] .process-step,[data-motion=off] .about-terminal,[data-motion=off] .contact-main{transform:none!important;opacity:1!important}[data-motion=off] .terminal-code>div,[data-motion=off] .outcomes article{opacity:1!important;transform:none!important}
@media(prefers-reduced-motion:reduce){.hero{clip-path:none!important}.portfolio-site .idea-section{margin-top:0;height:auto}.connection-result{opacity:1!important}.connection-wire{stroke-dashoffset:0}.process-step,.about-terminal,.contact-main,.terminal-code>div,.outcomes article{transform:none!important;opacity:1!important}}
@media(min-width:701px){.portfolio-site .hero-stage{inset:4% -2% 2% -2%}}.hero-stage:before{left:calc(var(--ground-x,74%) - 22%);top:calc(var(--ground-y,90%) - 2%);width:44%;height:5%;background:radial-gradient(ellipse,#9bbf0038,#0b1009aa 48%,transparent 72%);filter:blur(15px)}

.portfolio-site .hero-reaction{transition:opacity .12s}


[data-motion=off] .portfolio-site .hero-scroll{height:auto;min-height:0}@media(prefers-reduced-motion:reduce){.portfolio-site .hero-scroll{height:auto;min-height:0}}

/* Preserve the large filled/outlined title shown in Matías's approved reference.
   Typography, copy, eyebrow dot and rounded CTA come from portfolio/style.css.
   Keep the transparent renderer, scene scale and sequential scroll handoff. */
@media(min-width:701px){
 .portfolio-site .hero{width:100%;height:100dvh;min-height:0;clip-path:none;overflow:hidden}
 .portfolio-site .hero:after{display:none}
 .portfolio-site .hero-stage{inset:auto 0 3dvh auto;width:159.84dvh;height:90dvh;transform-origin:right bottom}
 .portfolio-site .hero h1>span{will-change:opacity,transform}
 .portfolio-site .hero-bottom{bottom:32px}
 .portfolio-site .hero-bottom .scroll-cue{font-size:8px;color:#7f8a73;gap:12px}
 .portfolio-site .hero-bottom .scroll-circle{width:28px;height:28px;font-size:15px;border-color:#ffffff18}
 .portfolio-site .idea-section{border:0;box-shadow:none;background:transparent}
 .portfolio-site .idea-section:before{display:none}
 .portfolio-site .idea-sticky{will-change:opacity}
 .portfolio-site .ambient{display:none}
 .portfolio-site #atmosphere{opacity:1}
 .scene-horizon{opacity:.28}
 .scene-light{opacity:.35}
 .light-one{animation-duration:26s}
 .light-two{animation-duration:23s}
}
@media(min-width:701px) and (max-width:1100px){
 .portfolio-site .hero-stage{width:152.74dvh;height:86dvh;right:-4vw;bottom:4dvh}
}
[data-motion=off] .portfolio-site .idea-sticky{opacity:1!important}
@media(prefers-reduced-motion:reduce){.portfolio-site .idea-sticky{opacity:1!important}}

/* Safari review: preserve the title treatment while fitting the whole action. */
.hero-copy>.eyebrow .terminal-cursor{width:1.05em;height:3px;background:var(--lime);align-self:flex-end;margin:0 0 .35em 0;box-shadow:0 0 10px #c6ff0040;animation:terminal-caret 1.1s steps(1,end) infinite}
@keyframes terminal-caret{0%,48%{opacity:1}49%,100%{opacity:0}}
.portfolio-site .hero-stage:before{display:none}
.portfolio-site .art{filter:none}
.character-ground{position:absolute;inset:0 0 -11.111%;z-index:-1;pointer-events:none;background:url('../assets/character-ground.svg') right center/contain no-repeat}
.scene-photo{background-image:none;opacity:0}
@media(min-width:701px){
 .portfolio-site .hero-copy{top:clamp(114px,15.5dvh,180px);width:58%}
 .portfolio-site .hero-copy .eyebrow{margin-bottom:clamp(16px,2.3dvh,26px)}
 .portfolio-site .hero h1{font-size:clamp(62px,min(10.5vw,calc((100dvh - clamp(114px,15.5dvh,180px) - 200px)/3.56)),165px)}
 .portfolio-site .hero-intro{margin-top:clamp(16px,2.5dvh,28px);max-width:460px;font-size:clamp(12px,1.05vw,16px);line-height:1.5}
 .portfolio-site .hero-ctas{margin-top:clamp(16px,2.4dvh,26px);gap:24px}
 .portfolio-site .hero-ctas .pill{padding:13px 21px}
 .portfolio-site .hero-ctas .scroll-cue{font-size:7px;letter-spacing:.7px;color:#929a87;gap:10px}
 .portfolio-site .scroll-circle{width:27px;height:27px;font-size:15px}
}
@media(prefers-reduced-motion:reduce){.hero-copy>.eyebrow .terminal-cursor{animation:none;opacity:1}}

.hero-copy>.eyebrow{gap:0}

/* Pointer matched to Matías’s supplied image. Native cursor:
   immediate response, no duplicate pointer and no animation loop. */
@media(pointer:fine){
 body.portfolio-site,body.portfolio-site a,body.portfolio-site button,body.portfolio-site canvas{cursor:url('../assets/agent-cursor.png') 9 9,auto}
 body.portfolio-site input,body.portfolio-site textarea,[contenteditable=true]{cursor:text}
 body.portfolio-site button:disabled{cursor:wait}
}