/* Base */
img{max-width:100%}
[hidden]:not([hidden=until-found i]){display:none!important}

@font-face{font-family:"Neuropolitical";src:url("../fonts/Neuropolitical.otf") format("opentype");font-display:swap}
/* Layout: portafolio de una sola página, oscuro, con etiquetas tipo terminal (// SECCIÓN) y el motivo de flujo; el naranja solo señala la acción. */
:root{
  --bg:#1E1F28; --bg-2:#24252F; --bg-3:#2C2E39; --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.16);
  --fg:#FFFFFF; --fg-2:#A3A6AE; --naranja:#EF8018; --naranja-claro:#FFA052; --petroleo:#293D46; --pizarra:#546871;
  --f-titulo:"Neuropolitical","Michroma",sans-serif; --f-texto:"Gilroy","Outfit",system-ui,sans-serif; --f-mono:"JetBrains Mono",ui-monospace,monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--bg);color:var(--fg);font:400 17px/1.6 var(--f-texto);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,p{margin:0} h1,h2,h3{text-wrap:balance}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--naranja);outline-offset:3px;border-radius:4px}
.wrap{max-width:1200px;margin:0 auto;padding-inline:clamp(16px,4vw,48px)}
.mono{font-family:var(--f-mono)}
.o{color:var(--naranja)}
.tag{font:500 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-2)}
.tag b{color:var(--naranja);font-weight:500}
.lg{display:block;height:auto;max-width:100%}
section{padding-block:clamp(80px,11vw,140px);border-top:1px solid var(--line);position:relative}
section.glow-r{background:radial-gradient(38% 1.5px at 50% 0%,rgba(255,160,82,.85) 0%,rgba(255,160,82,0) 100%),radial-gradient(45% 55% at 92% 8%,rgba(239,128,24,.26) 0%,rgba(239,128,24,0) 70%),radial-gradient(40% 50% at 4% 96%,rgba(255,160,82,.14) 0%,rgba(255,160,82,0) 70%),radial-gradient(60% 60% at 50% 50%,rgba(41,61,70,.35) 0%,rgba(41,61,70,0) 75%)}
section.glow-c{background:radial-gradient(38% 1.5px at 50% 0%,rgba(255,160,82,.85) 0%,rgba(255,160,82,0) 100%),radial-gradient(50% 55% at 50% 62%,rgba(239,128,24,.26) 0%,rgba(239,128,24,0) 70%),radial-gradient(35% 45% at 50% 0%,rgba(255,160,82,.10) 0%,rgba(255,160,82,0) 70%)}
section.glow-l{background:radial-gradient(38% 1.5px at 50% 0%,rgba(255,160,82,.85) 0%,rgba(255,160,82,0) 100%),radial-gradient(45% 60% at 6% 20%,rgba(239,128,24,.24) 0%,rgba(239,128,24,0) 70%),radial-gradient(40% 50% at 98% 90%,rgba(41,61,70,.6) 0%,rgba(41,61,70,0) 70%)}
.sh{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:20px 56px;align-items:end;margin-bottom:clamp(40px,6vw,64px)}
.hl{background:linear-gradient(100deg,#FFC08A 0%,#FFA052 28%,#EF8018 68%,#D45F05 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.sh h2{font:400 clamp(30px,4.6vw,58px)/1.04 var(--f-titulo);text-transform:uppercase;margin-top:18px}
.sh p{color:var(--fg-2);font-size:18px;max-width:52ch}

/* nav */
.nav{position:fixed;top:calc(env(safe-area-inset-top,0px) + 14px);left:0;right:0;z-index:30;padding-inline:clamp(12px,3vw,32px);pointer-events:none}
.nav .wrap{pointer-events:auto;position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;height:72px;max-width:1180px;padding:0 12px;border-radius:999px;transition:max-width .55s cubic-bezier(.2,.7,.2,1),height .55s cubic-bezier(.2,.7,.2,1),background .4s,box-shadow .4s;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.03)),rgba(36,37,47,.38);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 -1px 0 rgba(0,0,0,.2),0 12px 32px -12px rgba(0,0,0,.55)}
.nav .home{justify-self:center;display:block}
.nav .btn{justify-self:end;border-radius:999px}
.burger{justify-self:start;position:relative;width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);cursor:pointer;padding:0;transition:background .2s}
.burger:hover{background:rgba(255,255,255,.12)}
.burger .b1,.burger .b2{position:absolute;left:13px;height:2px;border-radius:2px;background:#FFFFFF;transition:transform .4s cubic-bezier(.2,.7,.2,1),width .4s cubic-bezier(.2,.7,.2,1),top .4s cubic-bezier(.2,.7,.2,1)}
.burger .b1{top:17px;width:18px}
.burger .b2{top:25px;width:11px}
.nav .wrap{z-index:1}
.nscrim{position:fixed;inset:0;z-index:2;background:rgba(14,15,20,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s;pointer-events:auto}
.npanel{position:fixed;top:0;left:0;bottom:0;z-index:3;width:min(400px,88vw);display:flex;flex-direction:column;gap:6px;padding:22px 20px 24px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02)),rgba(30,31,40,.92);-webkit-backdrop-filter:blur(28px) saturate(180%);backdrop-filter:blur(28px) saturate(180%);border-right:1px solid rgba(255,255,255,.12);box-shadow:24px 0 60px -20px rgba(0,0,0,.7);transform:translateX(-102%);visibility:hidden;transition:transform .55s cubic-bezier(.2,.8,.2,1),visibility .55s;pointer-events:auto;overflow-y:auto}
.nhead{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 18px;border-bottom:1px solid rgba(255,255,255,.08)}
.nclose{width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0;transition:background .2s,transform .3s}
.nclose:hover{background:rgba(255,255,255,.12);transform:rotate(90deg)}
.nlabel{font:500 11px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--fg-2);padding:22px 14px 8px}
.nlinks{display:flex;flex-direction:column}
.npanel .nlinks a{display:flex;align-items:baseline;gap:14px;padding:14px;border-radius:14px;font:400 22px/1.15 var(--f-titulo);text-transform:uppercase;color:#FFFFFF;transition:background .2s,padding-left .3s}
.npanel .nlinks a:hover{background:rgba(255,255,255,.06);padding-left:20px}
.npanel .nlinks a span{font:500 11px/1 var(--f-mono);letter-spacing:.1em;color:var(--naranja)}
.ncta{margin-top:auto;display:grid;gap:10px;padding:18px 4px 0}
.ncta .btn{width:100%}
.ncta p{font-size:13px;color:var(--fg-2);text-align:center}
.nfoot{display:flex;justify-content:space-between;margin-top:14px;padding:14px 4px 0;border-top:1px solid rgba(255,255,255,.10);font:500 11px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-2)}
.nav.open .nscrim{opacity:1;visibility:visible}
.nav.open .npanel{transform:none;visibility:visible}
.nav.scrolled .wrap{max-width:820px;height:60px;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.03)),rgba(30,31,40,.62);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 -1px 0 rgba(0,0,0,.2),0 16px 40px -14px rgba(0,0,0,.7)}
.nav.open .burger .b1{top:21px;width:18px;transform:rotate(45deg)}
.nav.open .burger .b2{top:21px;width:18px;transform:rotate(-45deg)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:600 15px/1 var(--f-texto);padding:15px 22px;border-radius:10px;border:1.5px solid transparent;transition:background .2s,border-color .2s,transform .2s;white-space:nowrap}
.btn.p{background:linear-gradient(135deg,#FFA052 0%,#EF8018 52%,#D9650A 100%);color:var(--bg);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 20px -8px rgba(239,128,24,.55)}
.btn.p:hover{background:linear-gradient(135deg,#FFB878 0%,#FF9233 52%,#EF8018 100%)}
.btn.s{border-color:var(--line-2);color:var(--fg)}
.btn.s:hover{border-color:var(--fg)}
.btn.sm{padding:11px 16px;font-size:14px}
.btn .ic{flex:none}

/* hero */
.hero{position:relative;overflow:hidden;height:100vh;min-height:800px;display:flex;flex-direction:column;padding-block:88px 76px;background:radial-gradient(60% 55% at 50% 108%,rgba(239,128,24,.30) 0%,rgba(239,128,24,.10) 45%,rgba(239,128,24,0) 75%),radial-gradient(55% 70% at 8% 0%,rgba(41,61,70,.95) 0%,rgba(41,61,70,0) 70%),radial-gradient(45% 60% at 96% 18%,rgba(84,104,113,.40) 0%,rgba(84,104,113,0) 70%),linear-gradient(180deg,#1E1F28 0%,#20222C 60%,#1E1F28 100%)}
.pcanvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hstage{flex:1;position:relative;z-index:1;display:grid;place-items:center;min-height:0}
.hstage>*{grid-area:1/1}
.htitle{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;font:400 clamp(44px,9.6vw,176px)/.9 var(--f-titulo);text-transform:uppercase;letter-spacing:-.01em;margin:0;transform:translateY(-26%);transition:transform .6s cubic-bezier(.2,.7,.2,1);white-space:nowrap}
.htitle .ht{font:inherit;margin:0;display:flex;flex-direction:column;align-items:center;text-transform:uppercase;letter-spacing:inherit}
.htitle .status{margin-bottom:30px;font-size:12px;line-height:1;letter-spacing:.14em;white-space:nowrap;text-decoration:none;color:#E6E7EA;background:rgba(36,37,47,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:border-color .2s,background .2s}
.htitle .status.ghost{visibility:hidden}
.hpill{z-index:3;pointer-events:none}
@media (max-height:780px) and (min-width:761px){.hstage>.mwrap{top:34%}}
.hpill .ht{visibility:hidden}
.hpill .status{pointer-events:auto}
.htitle .status:hover{border-color:rgba(239,128,24,.6);background:rgba(36,37,47,.8)}
.htitle .l1{color:#F4F4F2}
.htitle .l2{background:linear-gradient(180deg,#FFB067 0%,#EF8018 50%,#D45F05 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.glow{width:min(70vw,720px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(239,128,24,.22) 0%,rgba(239,128,24,.06) 40%,rgba(239,128,24,0) 68%);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.hstage>.mwrap{grid-area:auto;position:absolute;left:0;right:0;bottom:0;top:24%;z-index:2;display:flex;justify-content:center;align-items:flex-end;pointer-events:none}
.memo{height:100%;max-height:500px;transition:transform .35s cubic-bezier(.2,.7,.2,1);will-change:transform}
.memo img{height:100%;width:auto;display:block;filter:drop-shadow(0 30px 40px rgba(0,0,0,.55));animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.hbottom{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px;width:100%;padding-top:18px}
.hleft{max-width:620px;display:grid;gap:18px;justify-items:center}
.hright{display:grid;gap:14px;justify-items:center}
.hright .ctas{justify-content:center}
.status{display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border:1px solid var(--line-2);border-radius:999px;font:500 12px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-2);background:rgba(30,31,40,.7)}
.status i{width:8px;height:8px;border-radius:50%;background:var(--naranja);animation:ping 2.4s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(239,128,24,.55)}70%{box-shadow:0 0 0 10px rgba(239,128,24,0)}100%{box-shadow:0 0 0 0 rgba(239,128,24,0)}}
.hero .lead{font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--fg-2)}
.hero .lead b{color:var(--fg);font-weight:600}
.ctas{display:flex;flex-wrap:wrap;gap:12px}
.badges{display:flex;flex-wrap:wrap;gap:8px}
.badges span{font:500 12px/1 var(--f-mono);letter-spacing:.1em;padding:10px 12px;border-radius:8px;background:var(--bg-2);border:1px solid var(--line);color:var(--fg-2)}
.badges span b{color:var(--fg);font-weight:500}

/* marquee */
.marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding-block:20px;background:var(--bg-2)}
.marquee .track{display:flex;gap:56px;width:max-content;animation:mq 38s linear infinite}
.marquee span{display:flex;align-items:center;gap:14px;font:400 18px/1 var(--f-titulo);text-transform:uppercase;color:var(--fg-2);white-space:nowrap}
.marquee span svg{--sym:var(--naranja)}
@keyframes mq{to{transform:translateX(-50%)}}

/* trabajo */
.works{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.work{background:var(--bg-2);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:border-color .25s,transform .25s;display:flex;flex-direction:column;min-width:0}
.work:hover{border-color:var(--line-2);transform:translateY(-3px)}
.work .shot{aspect-ratio:16/10;position:relative;overflow:hidden;background:var(--bg-3);container-type:inline-size;max-width:100%}
.work .body{padding:22px 24px 24px;display:grid;gap:8px}
.work .row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.work h3{font:600 22px/1.2 var(--f-texto)}
.work p{color:var(--fg-2);font-size:15px}
.pill{font:500 11px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;padding:7px 10px;border-radius:6px;border:1px solid var(--line-2);color:var(--fg-2);white-space:nowrap}
.more{display:inline-flex;align-items:center;gap:8px;font:500 13px/1 var(--f-mono);letter-spacing:.08em;color:var(--naranja-claro);margin-top:6px}
.vals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:20px}
.vals div{display:flex;align-items:center;gap:12px;padding:18px;border-radius:12px;border:1px solid var(--line);font-weight:600;font-size:15px;min-width:0}
.vals .ic{color:var(--naranja)}

/* mock screens inside work cards (cqw-scaled) */
.scr{position:absolute;inset:7cqw 7cqw -2cqw;border-radius:2cqw 2cqw 0 0;background:var(--bg);border:1px solid var(--line-2);overflow:hidden;box-shadow:0 2cqw 6cqw rgba(0,0,0,.4)}
.scr .bar{height:4.4cqw;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:1cqw;padding:0 2cqw}
.scr .bar i{width:1.2cqw;height:1.2cqw;border-radius:50%;background:var(--bg-3)}
.scr .ct{padding:4cqw;display:grid;gap:2cqw}
.ln{height:1.6cqw;border-radius:1cqw;background:var(--bg-3)}

/* about */
.about{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,72px);align-items:center}
.about .photo{border-radius:20px;overflow:hidden;aspect-ratio:4/5;max-width:100%;border:1px solid var(--line)}
.about .photo img{width:100%;height:100%;object-fit:cover;object-position:50% 22%;display:block}
.about h2{font:400 clamp(30px,4.4vw,54px)/1.05 var(--f-titulo);text-transform:uppercase;margin:18px 0 22px}
.about p{color:var(--fg-2);margin-bottom:14px;max-width:58ch}
.about p b{color:var(--fg);font-weight:600}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:30px}
.stats div{border-top:1px solid var(--line-2);padding-top:16px}
.stats b{display:block;font:400 clamp(28px,3vw,38px)/1 var(--f-titulo)}
.stats span{font:500 11px/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-2)}
.social{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px;align-items:center}
.social a{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--line);border-radius:10px;font:500 13px/1 var(--f-mono);color:var(--fg-2);transition:border-color .2s,color .2s}
.social a:hover{border-color:var(--line-2);color:var(--fg)}

/* servicios */
.svcs{display:flex;flex-direction:column;gap:clamp(48px,14vh,140px);padding-bottom:clamp(24px,6vh,60px)}
.svc{position:sticky;top:112px;display:grid;grid-template-columns:120px minmax(0,1fr) minmax(0,.9fr);gap:28px;padding:clamp(24px,3vw,36px);border-radius:22px;background:linear-gradient(180deg,#2A2C37 0%,#24252F 100%);box-shadow:0 -18px 40px -16px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.06);border:1px solid var(--line);transition:border-color .25s}
.svc:hover{border-color:rgba(239,128,24,.45)}
.svc.s2{top:136px}
.svc.s3{top:160px}
#servicios .sh{position:sticky;top:92px;grid-template-columns:minmax(0,1fr) minmax(0,.55fr);align-items:end;margin-bottom:28px}
#servicios .sh h2{font-size:clamp(26px,3vw,42px)}
#servicios .sh p{font-size:16px}
#servicios .svc{top:288px}
#servicios .svc.s2{top:312px}
#servicios .svc.s3{top:336px}
.svc .n{font:500 14px/1 var(--f-mono);color:var(--naranja)}
.svc h3{font:400 clamp(20px,2.2vw,26px)/1.15 var(--f-titulo);text-transform:uppercase;margin-bottom:12px}
.svc p{color:var(--fg-2)}
.svc ul{list-style:none;padding:0;margin:0;display:grid;gap:10px;align-content:start}
.svc li{display:flex;gap:10px;align-items:center;font-size:15px;padding:10px 12px;border-radius:8px;background:var(--bg-3)}
.svc li .ic{color:var(--naranja)}

/* planes */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.plan{border-radius:18px;padding:30px;background:var(--bg-2);border:1px solid var(--line);display:flex;flex-direction:column;gap:18px;min-width:0}
.plan.star{background:var(--petroleo);border-color:transparent;position:relative}
.plan .top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.plan .badge{font:500 10px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;background:linear-gradient(135deg,#FFA052 0%,#EF8018 52%,#D9650A 100%);color:var(--bg);padding:6px 8px;border-radius:4px}
.plan .price{font:400 clamp(28px,3vw,38px)/1 var(--f-titulo)}
.plan .price small{font:500 13px/1 var(--f-mono);color:var(--fg-2);letter-spacing:.06em;margin-left:6px}
.plan.star .price small,.plan.star p{color:#DBDBDB}
.plan p{color:var(--fg-2);font-size:15px}
.plan ul{list-style:none;padding:0;margin:0;display:grid;gap:10px;border-top:1px solid var(--line-2);padding-top:18px}
.plan li{display:flex;gap:10px;font-size:15px}
.plan li .ic{color:var(--naranja);margin-top:3px;flex:none}
.plan .btn{margin-top:auto;width:100%}
.note{margin-top:18px;color:var(--fg-2);font-size:15px;display:flex;gap:10px;align-items:center}

/* beneficios */
.bens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.ben{background:var(--bg);padding:30px;min-width:0;transition:background .25s}
.ben:hover{background:var(--bg-2)}
.ben .ic{color:var(--naranja)}
.ben h3{font:600 19px/1.25 var(--f-texto);margin:18px 0 8px}
.ben p{color:var(--fg-2);font-size:15px}
.ben .k{display:inline-block;margin-top:14px;font:500 11px/1 var(--f-mono);letter-spacing:.12em;color:var(--naranja-claro)}

/* flujo */
.flow{background:linear-gradient(180deg,#2A2C37 0%,#24252F 100%);border:1px solid var(--line);border-radius:22px;padding:clamp(18px,3vw,36px);overflow-x:auto;box-shadow:0 -18px 40px -16px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.06)}
.flow.s4{position:sticky;top:360px}
.flow svg{display:block;width:100%;min-width:620px;height:auto}

/* testimonios */
.tests{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.test{border:1.5px dashed var(--line-2);border-radius:18px;padding:28px;display:flex;flex-direction:column;gap:18px;min-width:0}
.test q{font-size:18px;line-height:1.5;color:var(--fg-2);quotes:none}
.test .who{display:flex;align-items:center;gap:12px;margin-top:auto}
.test .av{width:44px;height:44px;border-radius:50%;background:var(--bg-3);border:1px dashed var(--line-2)}
.test .who b{display:block;font-size:15px;color:var(--fg-2)}
.test .who span{font:500 11px/1.3 var(--f-mono);letter-spacing:.08em;color:var(--fg-2);opacity:.8}
.test .res{font:500 12px/1 var(--f-mono);letter-spacing:.1em;color:var(--naranja-claro)}

/* cta */
.cta{position:relative;overflow:hidden;text-align:left}
.cta .box{position:relative;border-radius:24px;background:radial-gradient(80% 120% at 0% 0%,#FFA052 0%,rgba(255,160,82,0) 55%),linear-gradient(135deg,#F58A26 0%,#EF8018 45%,#D45F05 100%);color:var(--bg);padding:clamp(36px,6vw,80px);overflow:hidden}
.cta .box .wm2{position:absolute;right:-70px;top:-90px;height:520px;width:auto;opacity:.1;--sym:#1E1F28}
.cta h2{font:400 clamp(32px,5.4vw,72px)/1 var(--f-titulo);text-transform:uppercase;max-width:14ch;position:relative}
.cta p{font-size:clamp(17px,1.8vw,20px);font-weight:500;margin-top:20px;max-width:46ch;position:relative}
.cta .btn{background:var(--bg);color:var(--fg);margin-top:30px;position:relative}
.cta .btn:hover{background:#2C2E39}
.cta .kw{display:inline-block;font:400 0.9em/1 var(--f-titulo);background:var(--bg);color:var(--fg);padding:.12em .3em;border-radius:.18em}

footer{border-top:1px solid var(--line);padding-block:56px 40px}
footer .top{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;flex-wrap:wrap}
footer .cols{display:flex;gap:56px;flex-wrap:wrap}
footer .cols div{display:grid;gap:10px;align-content:start}
footer .cols a{color:var(--fg-2);font-size:15px}
footer .cols a:hover{color:var(--fg)}
footer .bot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:48px;padding-top:24px;border-top:1px solid var(--line);font:500 12px/1.4 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-2)}

/* reveal */
@media (prefers-reduced-motion:no-preference){
  .rv{animation:rv .8s cubic-bezier(.2,.7,.2,1) both}
  .rv.d1{animation-delay:.08s}.rv.d2{animation-delay:.16s}.rv.d3{animation-delay:.24s}.rv.d4{animation-delay:.32s}
}
@keyframes rv{from{transform:translateY(16px)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.marquee .track,.status i,.memo img{animation:none}}

@media (max-width:980px){
  .svc{grid-template-columns:1fr;gap:16px}
  #servicios .sh{position:static}
  #servicios .svc{top:92px}
  #servicios .svc.s2{top:108px}
  #servicios .svc.s3{top:124px}
  .flow.s4{top:140px}
  .plans,.tests{grid-template-columns:1fr}
  .bens{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vals{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .hero .grid,.about,.sh{grid-template-columns:1fr}
  .portrait{max-width:440px}
  .works{grid-template-columns:1fr}
  .bens{grid-template-columns:1fr}
  .nav .btn .t{display:none}
  .hero{height:auto;min-height:0}
  .htitle{font-size:11.4vw}
  .hstage{min-height:340px}
  .hstage>.mwrap{top:40%;bottom:-16px}
  .hbottom{align-items:center}
}
@media (max-width:440px){.vals,.stats{grid-template-columns:1fr}}

.sidenav{position:fixed;right:clamp(12px,1.8vw,26px);top:50%;transform:translateY(-50%);z-index:25;display:flex;flex-direction:column;gap:20px;padding:16px 9px;border-radius:999px;background:rgba(30,31,40,.35);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);border:1px solid rgba(255,255,255,.10);box-shadow:0 10px 30px -12px rgba(0,0,0,.5)}
.sline{position:absolute;left:50%;top:24px;bottom:24px;width:1px;background:rgba(255,255,255,.14);transform:translateX(-50%);pointer-events:none}
.sfill{display:block;width:100%;height:0;background:linear-gradient(180deg,#FFA052,#EF8018);transition:height .5s cubic-bezier(.2,.7,.2,1)}
.sdot{position:relative;width:18px;height:18px;display:grid;place-items:center;cursor:pointer}
.sdot i{width:10px;height:10px;border-radius:50%;border:1.5px solid rgba(255,255,255,.45);background:#1E1F28;transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s,background .3s,box-shadow .3s}
.sdot:hover i{border-color:#FFA052;transform:scale(1.3)}
.sdot.on i{background:linear-gradient(135deg,#FFC08A,#EF8018 55%,#D45F05);border-color:transparent;transform:scale(1.35);box-shadow:0 0 0 4px rgba(239,128,24,.18),0 0 14px rgba(239,128,24,.65)}
.sdot.past i{border-color:rgba(255,160,82,.75)}
.slab{position:absolute;right:30px;top:50%;white-space:nowrap;font:500 11px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:#FFFFFF;background:rgba(30,31,40,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12);padding:8px 11px;border-radius:999px;opacity:0;transform:translate(8px,-50%);transition:opacity .25s,transform .25s;pointer-events:none}
.sdot:hover .slab,.sdot:focus-visible .slab{opacity:1;transform:translate(0,-50%)}
@media (max-width:760px){.sidenav{display:none}}

@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    .svc li{animation:liIn linear both;animation-timeline:view();animation-range:entry 20% cover 40%}
    .svc li:nth-child(2){animation-range:entry 24% cover 42%}
    .svc li:nth-child(3){animation-range:entry 28% cover 44%}
    .svc li:nth-child(4){animation-range:entry 32% cover 46%}
  }
}
@keyframes liIn{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:none}}

@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes spinb{to{--ang:360deg}}
.btn.p{position:relative;isolation:isolate}
.btn.p::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;background:conic-gradient(from var(--ang),rgba(255,255,255,0) 0deg,rgba(255,255,255,0) 250deg,rgba(255,226,196,.55) 290deg,#FFFFFF 320deg,rgba(255,226,196,.55) 340deg,rgba(255,255,255,0) 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);pointer-events:none;z-index:1}
.btn.p::after{content:"";position:absolute;inset:-6px;border-radius:inherit;background:conic-gradient(from var(--ang),transparent 0deg,transparent 280deg,rgba(255,160,82,.55) 320deg,transparent 360deg);filter:blur(10px);z-index:-1;pointer-events:none;opacity:.8}
@media (prefers-reduced-motion:no-preference){
  .btn.p::before,.btn.p::after{animation:spinb 3.2s linear infinite}
}

@keyframes upIn{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes zoomIn{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
@keyframes heroUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
@keyframes heroMemo{from{opacity:0;transform:translateY(80px) scale(.92)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
  .htitle .status{animation:heroUp .8s cubic-bezier(.2,.7,.2,1) .05s backwards}
  .htitle .l1{animation:heroUp .9s cubic-bezier(.2,.7,.2,1) .1s backwards}
  .htitle .l2{animation:heroUp .9s cubic-bezier(.2,.7,.2,1) .22s backwards}
  .mwrap{animation:heroMemo 1.1s cubic-bezier(.2,.7,.2,1) .35s backwards}
  .hleft{animation:heroUp .8s cubic-bezier(.2,.7,.2,1) .55s backwards}
  .hright{animation:heroUp .8s cubic-bezier(.2,.7,.2,1) .65s backwards}
  .nav .wrap{animation:fadeIn .8s ease .05s backwards}
  .marquee{animation:fadeIn 1s ease .8s backwards}
}
.rv-init{opacity:0 !important;transform:translateY(70px) scale(.96) !important;filter:blur(8px) !important;transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1),filter .9s ease !important;transition-delay:var(--rvd,0s) !important}
.rv-init.rv-in{opacity:1 !important;transform:none !important;filter:none !important}
.rv-init.rv-zoom{transform:scale(.88) !important}
.rv-init.rv-zoom.rv-in{transform:none !important}
