/* LandoHOUSE · Fondo tecnológico animado · Desarrollo web (ES/EN) · v2026.10.26 */
.hero-web{isolation:isolate;background:radial-gradient(120% 90% at 50% 0%,#1c2060 0%,#131645 45%,#0c0e33 100%);min-height:min(88vh,860px);display:flex;flex-direction:column;justify-content:center}
.hero-web>.container{width:min(var(--max,1200px),calc(100% - 32px))}
.hero-web .wfx-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:1;z-index:1;pointer-events:none}
.hero-web .wfx-aurora{position:absolute;inset:-20%;z-index:0;pointer-events:none;filter:blur(60px);opacity:.75}
.hero-web .wfx-aurora i{position:absolute;border-radius:50%;mix-blend-mode:screen;animation:wfxFloat 18s var(--ease,ease) infinite alternate}
.hero-web .wfx-aurora i:nth-child(1){width:44vw;height:44vw;left:58%;top:6%;background:radial-gradient(circle,rgba(187,0,39,.55),transparent 65%)}
.hero-web .wfx-aurora i:nth-child(2){width:50vw;height:50vw;left:-6%;top:40%;background:radial-gradient(circle,rgba(191,194,251,.30),transparent 65%);animation-duration:24s;animation-delay:-6s}
.hero-web .wfx-aurora i:nth-child(3){width:36vw;height:36vw;left:30%;top:-10%;background:radial-gradient(circle,rgba(74,79,154,.55),transparent 65%);animation-duration:21s;animation-delay:-11s}
@keyframes wfxFloat{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(6vw,-4vh,0) scale(1.12)}100%{transform:translate3d(-5vw,5vh,0) scale(.92)}}
.hero-web .wfx-scan{position:absolute;left:0;right:0;top:0;height:140px;z-index:1;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(191,194,251,.03) 70%,rgba(255,179,177,.10) 99%,transparent);animation:wfxScan 7s linear infinite}
@keyframes wfxScan{0%{transform:translateY(-160px)}100%{transform:translateY(110vh)}}
.hero-web .wfx-glow{position:absolute;z-index:1;width:520px;height:520px;left:var(--mx,50%);top:var(--my,40%);transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,179,177,.13),transparent 60%);transition:left .25s ease-out,top .25s ease-out}
.hero-web h1 em{background:linear-gradient(90deg,#ffb3b1,#bfc2fb,#ffb3b1);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:wfxShine 6s linear infinite}
@keyframes wfxShine{to{background-position:-200% 0}}
.hero-web .hero-card{position:relative;overflow:hidden;background:rgba(12,14,51,.55);border-color:rgba(191,194,251,.22);box-shadow:0 0 0 1px rgba(191,194,251,.06),0 24px 60px rgba(5,6,30,.45)}
.hero-web .hero-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:conic-gradient(from var(--wa,0deg),transparent 0 70%,rgba(255,179,177,.9) 80%,rgba(191,194,251,.9) 88%,transparent 96%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:wfxSpin 6s linear infinite;pointer-events:none}
@property --wa{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes wfxSpin{to{--wa:360deg}}
.wfx-ticker{position:relative;margin:40px auto 0;max-width:1040px;overflow:hidden;border:1px solid rgba(191,194,251,.18);border-radius:99px;background:rgba(12,14,51,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.wfx-ticker ul{display:flex;gap:34px;width:max-content;margin:0;padding:11px 0;list-style:none;animation:wfxMarquee 38s linear infinite}
.wfx-ticker li{display:flex;align-items:center;gap:9px;font:600 13px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.04em;color:#d5d7f7;white-space:nowrap}
.wfx-ticker li::before{content:"";width:7px;height:7px;border-radius:50%;background:#3ddc97;box-shadow:0 0 8px #3ddc97;animation:wfxBlink 2.4s ease-in-out infinite}
.wfx-ticker li:nth-child(3n)::before{background:#ffb3b1;box-shadow:0 0 8px #ffb3b1;animation-delay:-.8s}
.wfx-ticker li:nth-child(3n+1)::before{background:#bfc2fb;box-shadow:0 0 8px #bfc2fb;animation-delay:-1.6s}
@keyframes wfxMarquee{to{transform:translateX(-50%)}}
@keyframes wfxBlink{50%{opacity:.35}}
/* Portafolio: fondo de puntos animado y tarjetas con brillo */
#proyectos,#projects{position:relative;overflow:hidden}
#proyectos::before,#projects::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(19,22,69,.11) 1px,transparent 1.4px);background-size:26px 26px;-webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse at 50% 30%,#000 20%,transparent 75%);animation:wfxDots 30s linear infinite}
@keyframes wfxDots{to{background-position:260px 260px}}
#proyectos>.container,#projects>.container{position:relative}
.card.proj{transition:transform .35s var(--ease,ease),box-shadow .35s var(--ease,ease)}
.card.proj .shot{position:relative;overflow:hidden}
.card.proj .shot::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-120%);transition:transform .9s var(--ease,ease);pointer-events:none}
.card.proj:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(19,22,69,.16),0 0 0 1px rgba(187,0,39,.18)}
.card.proj:hover .shot::after{transform:translateX(120%)}
.card.proj .shot img{transition:transform .8s var(--ease,ease)}
.card.proj:hover .shot img{transform:scale(1.04)}
@media (max-width:760px){.hero-web{min-height:0}.hero-web .wfx-glow{display:none}.wfx-ticker{margin-top:28px}}
@media (prefers-reduced-motion:reduce){.hero-web .wfx-aurora i,.hero-web .wfx-scan,.hero-web h1 em,.hero-web .hero-card::before,.wfx-ticker ul,.wfx-ticker li::before,#proyectos::before,#projects::before{animation:none}.hero-web .wfx-scan{display:none}.wfx-ticker ul{flex-wrap:wrap;justify-content:center;width:auto;padding:12px 18px}.wfx-ticker li.dup{display:none}}
@media print{.wfx-canvas,.wfx-aurora,.wfx-scan,.wfx-glow,.wfx-ticker{display:none!important}}
