:root{--blue:#092DE2;--blue2:#3d5aff;--red:#DD3B33;--dark:#111;--dark2:#1B1B1B;--light:#F8F8F8;--white:#FFF;--font-display:'Krona One',sans-serif;--font-body:'Inter',sans-serif;}
*{margin:0;padding:0;box-sizing:border-box;}html{scroll-behavior:smooth;}body{font-family:var(--font-body);background:var(--dark);color:#fff;overflow-x:hidden;}a{color:inherit;text-decoration:none;}::selection{background:var(--blue);color:#fff;}
body::before{content:'';position:fixed;inset:0;z-index:9997;pointer-events:none;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:overlay;}

nav{position:fixed;top:0;left:0;right:0;z-index:600;display:flex;align-items:center;justify-content:space-between;padding:20px 52px;transition:transform .4s;}
nav.hidden{transform:translateY(-110%);}
nav .frame{position:absolute;inset:12px 40px auto 40px;height:60px;border:1px solid rgba(255,255,255,.1);pointer-events:none;backdrop-filter:blur(12px);background:rgba(17,17,17,.55);}
.nav-logo{height:20px;position:relative;z-index:2;}.nav-links{display:flex;align-items:center;gap:32px;font-size:13px;font-weight:600;position:relative;z-index:2;}
.nav-links a.plain{opacity:.7;transition:opacity .2s;}.nav-links a.plain:hover{opacity:1;}
.btn-nav{font-family:var(--font-display);font-size:11px;padding:11px 22px;background:var(--red);color:#fff;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);}

section{position:relative;padding:140px 52px;}.section-inner{max-width:1280px;margin:0 auto;position:relative;z-index:2;}
.sec-label{font-family:var(--font-display);font-size:10.5px;letter-spacing:.25em;text-transform:uppercase;color:var(--blue2);display:flex;align-items:center;gap:12px;margin-bottom:24px;}.sec-label::before{content:'';width:30px;height:2px;background:var(--red);}
h2.sec-title{font-family:var(--font-display);font-weight:400;font-size:clamp(24px,3.2vw,40px);line-height:1.25;margin-bottom:14px;}
.sec-desc{font-size:16.5px;color:rgba(255,255,255,.5);max-width:600px;line-height:1.7;}
.btn{font-family:var(--font-display);font-size:12.5px;padding:18px 38px;display:inline-flex;align-items:center;position:relative;overflow:hidden;clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);}
.btn-blue{background:var(--blue);color:#fff;}.btn-ghost{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.3);}
.btn-red{background:var(--red);color:#fff;}.btn-white{background:#fff;color:var(--blue);}
.btn .flare{position:absolute;top:0;left:-80%;width:60%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.3),transparent);transform:skewX(-20deg);}

/* HERO */
.landing-hero{min-height:72vh;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:60px;padding:130px 52px 80px;position:relative;overflow:hidden;background:linear-gradient(140deg,var(--dark) 0%,#0a1230 100%);}
.landing-hero .grid-bg{position:absolute;inset:0;opacity:.18;background-image:linear-gradient(rgba(9,45,226,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(9,45,226,.1) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 75% 75% at 35% 50%,black 20%,transparent 70%);}
.hero-breadcrumb{font-family:var(--font-display);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:28px;display:flex;align-items:center;gap:8px;}.hero-breadcrumb .sep{color:var(--red);}.hero-breadcrumb .current{color:var(--blue2);}
.landing-hero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(28px,3.6vw,46px);line-height:1.22;margin-bottom:24px;}.landing-hero h1 .accent{color:var(--blue2);}
.landing-hero .hero-sub{font-size:17px;line-height:1.7;color:rgba(255,255,255,.55);max-width:500px;margin-bottom:36px;}
.hero-stages{display:flex;flex-direction:column;gap:2px;position:relative;z-index:2;}
.hero-stage{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;padding:20px 24px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);transition:all .3s;}
.hero-stage:hover{background:rgba(9,45,226,.06);border-color:rgba(9,45,226,.25);}
.hero-stage .hs-icon{font-size:24px;}
.hero-stage .hs-t{font-family:var(--font-display);font-size:12px;}.hero-stage .hs-d{font-size:12px;color:rgba(255,255,255,.4);margin-top:2px;}

/* WEB TYPES - TILT */
.web-types{padding:140px 52px;background:var(--dark2);}
.tilt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-top:56px;perspective:1200px;}
.tilt-card{position:relative;background:linear-gradient(160deg,#232323,#181818);border:1px solid rgba(255,255,255,.08);padding:34px 28px;min-height:280px;display:flex;flex-direction:column;transform-style:preserve-3d;transition:border-color .3s;will-change:transform;}
.tilt-card:hover{border-color:rgba(9,45,226,.6);}
.tilt-card .shine{position:absolute;inset:0;background:radial-gradient(circle at var(--sx,50%) var(--sy,50%),rgba(9,45,226,.22),transparent 55%);opacity:0;transition:opacity .3s;pointer-events:none;}.tilt-card:hover .shine{opacity:1;}
.tilt-card .t-icon{font-size:28px;margin-bottom:16px;transform:translateZ(30px);}
.tilt-card .t-name{font-family:var(--font-display);font-size:14.5px;margin-bottom:8px;transform:translateZ(28px);}
.tilt-card .t-sub{font-size:13px;color:rgba(255,255,255,.55);margin-bottom:14px;transform:translateZ(22px);line-height:1.5;}
.tilt-card .t-list{list-style:none;display:flex;flex-direction:column;gap:7px;transform:translateZ(16px);}
.tilt-card .t-list li{font-size:12.5px;color:rgba(255,255,255,.4);display:flex;gap:8px;align-items:baseline;}.tilt-card .t-list li::before{content:'⚡';font-size:9px;flex-shrink:0;}

/* ENFOQUE - STICKY PANELS */
.enfoque-wrap{position:relative;}
.enf-panel{min-height:100vh;display:flex;align-items:center;justify-content:center;position:sticky;top:0;overflow:hidden;}
.enf-panel .panel-bg{position:absolute;inset:0;}
.enf-panel:nth-child(1) .panel-bg{background:var(--light);}
.enf-panel:nth-child(2) .panel-bg{background:var(--blue);}
.enf-panel:nth-child(3) .panel-bg{background:var(--dark2);}
.enf-panel:nth-child(4) .panel-bg{background:var(--red);}
.enf-panel:nth-child(5) .panel-bg{background:var(--dark);}
.enf-content{position:relative;z-index:2;text-align:center;max-width:820px;padding:0 40px;}
.enf-step{font-family:var(--font-display);font-size:clamp(50px,8vw,110px);opacity:.14;display:block;line-height:1;margin-bottom:10px;}
.enf-content h3{font-family:var(--font-display);font-weight:400;font-size:clamp(22px,3vw,36px);line-height:1.3;margin-bottom:22px;}
.enf-content p{font-size:17px;line-height:1.7;opacity:.7;max-width:560px;margin:0 auto;}
.enf-panel:nth-child(1) .enf-content{color:var(--dark2);}
.enf-panel:nth-child(1) .enf-step{color:var(--blue);opacity:.2;}

/* AVANZADO */
.avanzado{padding:140px 52px;background:var(--light);color:var(--dark2);}
.avanzado .sec-label{color:var(--blue);}.avanzado .sec-title{color:var(--dark2);}
.adv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:rgba(0,0,0,.08);margin-top:48px;}
.adv-card{background:var(--light);padding:34px 26px;transition:background .3s;}.adv-card:hover{background:#fff;}
.adv-card .adv-icon{font-size:26px;margin-bottom:14px;display:block;}
.adv-card h4{font-family:var(--font-display);font-size:12.5px;margin-bottom:10px;color:var(--dark2);}
.adv-card p{font-size:13.5px;color:rgba(27,27,27,.55);line-height:1.6;}

/* TECH STACK */
.tech{padding:140px 52px;background:var(--dark2);}
.tech-cols{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:48px;align-items:start;}
.tech-left p{font-size:16.5px;line-height:1.75;color:rgba(255,255,255,.55);margin-bottom:18px;}
.tech-left .strong{color:#fff;font-weight:600;}
.tech-pills{display:flex;flex-direction:column;gap:2px;background:rgba(255,255,255,.06);}
.tech-pill{background:var(--dark2);padding:22px 24px;display:flex;align-items:center;gap:16px;transition:background .3s;}.tech-pill:hover{background:#222;}
.tech-pill .tp-icon{font-size:22px;flex-shrink:0;}
.tech-pill .tp-name{font-family:var(--font-display);font-size:12.5px;min-width:100px;}
.tech-pill .tp-desc{font-size:12.5px;color:rgba(255,255,255,.4);}

/* PORTFOLIO HORIZONTAL */
.horizontal-section{position:relative;background:var(--dark);z-index:5;}
.h-track-wrap{overflow:hidden;min-height:100vh;display:flex;align-items:center;background:var(--dark);}
.h-track{display:flex;width:max-content;align-items:stretch;}
.h-intro{width:42vw;min-width:400px;padding:0 56px;display:flex;flex-direction:column;justify-content:center;flex-shrink:0;}
.h-card{width:380px;flex-shrink:0;margin-right:24px;background:#191919;border:1px solid rgba(255,255,255,.08);padding:34px 28px;display:flex;flex-direction:column;gap:16px;position:relative;overflow:hidden;transition:border-color .4s;}
.h-card:hover{border-color:rgba(9,45,226,.4);}
.h-card::before{content:attr(data-idx);position:absolute;top:12px;right:18px;font-family:var(--font-display);font-size:50px;color:rgba(255,255,255,.04);}
.h-card .hc-name{font-family:var(--font-display);font-size:20px;}
.h-card .hc-type{font-size:10px;font-weight:700;color:var(--red);letter-spacing:.12em;text-transform:uppercase;}
.h-card .hc-desc{font-size:14px;color:rgba(255,255,255,.55);line-height:1.6;}
.h-card .hc-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.07);}
.h-card .hc-tags span{font-size:10.5px;color:var(--blue2);background:rgba(9,45,226,.1);padding:4px 10px;font-family:var(--font-display);}

/* CTA BANNER */
.cta-banner{padding:100px 52px;background:var(--blue);text-align:center;position:relative;overflow:hidden;}
.cta-banner h2{font-family:var(--font-display);font-weight:400;font-size:clamp(22px,3vw,34px);line-height:1.35;color:#fff;max-width:740px;margin:0 auto 24px;}
.cta-banner p{font-size:16px;color:rgba(255,255,255,.65);max-width:560px;margin:0 auto 36px;}

/* FAQ */
.faq-sec{padding:140px 52px;background:var(--dark2);}
.faq-terminal{max-width:840px;margin:48px auto 0;background:#161616;border:1px solid rgba(255,255,255,.1);}
.faq-term-head{display:flex;align-items:center;gap:8px;padding:14px 22px;border-bottom:1px solid rgba(255,255,255,.08);}
.faq-term-head .tdot{width:11px;height:11px;border-radius:50%;}.faq-term-head .tdot:nth-child(1){background:var(--red);}.faq-term-head .tdot:nth-child(2){background:#e8b93e;}.faq-term-head .tdot:nth-child(3){background:#3ec96f;}
.faq-term-head span{font-family:var(--font-display);font-size:10px;color:rgba(255,255,255,.3);margin-left:12px;letter-spacing:.15em;}
.faq-item{border-bottom:1px solid rgba(255,255,255,.06);}.faq-item:last-child{border-bottom:none;}
.faq-q{display:flex;align-items:center;gap:14px;padding:22px 24px;cursor:pointer;}.faq-q .prompt{color:var(--blue2);font-family:var(--font-display);font-size:13px;}
.faq-q span.qt{font-size:15px;font-weight:600;flex:1;}.faq-q .caret{color:var(--red);font-size:20px;transition:transform .3s;}
.faq-item.open .caret{transform:rotate(90deg);}
.faq-a-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s;}.faq-item.open .faq-a-wrap{grid-template-rows:1fr;}
.faq-a-inner{overflow:hidden;}.faq-a-inner p{font-size:14px;color:rgba(255,255,255,.55);line-height:1.65;padding:0 24px 22px 54px;position:relative;}.faq-a-inner p::before{content:'→';position:absolute;left:28px;color:var(--red);}

/* CONTACTO */
.contacto{min-height:70vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:var(--dark);padding:120px 52px;}
.spotlight{position:absolute;inset:0;background:radial-gradient(circle 340px at var(--cx,50%) var(--cy,50%),rgba(9,45,226,.2),transparent 70%);z-index:1;}
.contact-inner{position:relative;z-index:2;text-align:center;max-width:780px;}
.contact-inner h2{font-family:var(--font-display);font-weight:400;font-size:clamp(24px,3.6vw,42px);line-height:1.25;margin-bottom:24px;}.contact-inner .dim{color:rgba(255,255,255,.45);}
.contact-inner p{color:rgba(255,255,255,.6);font-size:17px;margin-bottom:40px;}
.dani-chip{display:inline-flex;align-items:center;gap:12px;margin-top:32px;padding:12px 24px;border:1px solid rgba(255,255,255,.15);font-size:13px;color:rgba(255,255,255,.6);}
.dani-chip .pulse{width:9px;height:9px;background:#3ec96f;border-radius:50%;animation:pulse 1.6s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(62,201,111,.5);}70%{box-shadow:0 0 0 9px rgba(62,201,111,0);}100%{box-shadow:0 0 0 0 rgba(62,201,111,0);}}

footer{background:#0d0d0d;padding:64px 52px 28px;}
.footer-top{max-width:1280px;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px;}
.footer-logo{height:18px;margin-bottom:14px;filter:brightness(0) invert(1);}
.footer-cols{display:flex;gap:56px;flex-wrap:wrap;}
.fcol span{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.15em;color:rgba(255,255,255,.25);display:block;margin-bottom:14px;}.fcol a{display:block;font-size:13px;color:rgba(255,255,255,.5);margin-bottom:9px;}
.footer-bottom{max-width:1280px;margin:44px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.06);display:flex;justify-content:space-between;font-size:11px;color:rgba(255,255,255,.2);}

@media(max-width:900px){.nav-links{display:none;}section{padding:90px 24px;}.landing-hero{grid-template-columns:1fr;min-height:auto;padding:120px 24px 60px;}.tilt-grid,.adv-grid,.tech-cols{grid-template-columns:1fr;}.h-intro{width:88vw;min-width:0;padding:0 24px;}.h-card{width:82vw;}}