html{-webkit-text-size-adjust:100%}body{margin:0}img,svg{max-width:100%}[hidden]{display:none!important}
/* Layout: grilla suiza de 12 columnas invisible, tinta sobre blanco; el color vive sólo dentro de los orbes. */
:root{
  --bg:#FFFFFF;
  --ink:#0D0E12;
  --muted:#6A6D78;
  --faint:#A9ACB6;
  --line:#ECEDF1;
  --cloud:#F4F3F1;
  --accent:#20F994;
  --f-sans:"Archivo",ui-sans-serif,system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --s-xs:11px; --s-sm:13px; --s-md:15px; --s-lg:clamp(20px,2.2vw,28px);
  --s-xl:clamp(32px,5vw,64px); --s-xxl:clamp(42px,7.6vw,120px);
  --gap:clamp(12px,1.6vw,24px);
  --ease:cubic-bezier(.22,1,.36,1);
  color-scheme:light;
}
*{box-sizing:border-box}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{background:var(--bg);color:var(--ink);font-family:var(--f-sans);font-size:var(--s-md);font-weight:300;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--line);color:var(--ink)}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
:focus-visible{outline:1px solid var(--accent);outline-offset:4px}
.skip{position:fixed;left:16px;top:-60px;z-index:80;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:999px;font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;transition:top .3s}
.skip:focus{top:calc(12px + env(safe-area-inset-top,0px))}
main:focus{outline:none}
sup.r{font-size:.5em;vertical-align:.75em;line-height:0;margin-left:.05em;font-weight:400}

.wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));max-width:1600px;margin:0 auto}
@media(min-width:760px){.wrap{padding-left:max(32px,env(safe-area-inset-left,0px));padding-right:max(32px,env(safe-area-inset-right,0px))}}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:var(--gap)}
.grid>*{min-width:0}
.mono{font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;font-weight:400}
.muted{color:var(--muted)}
.idx{font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;color:var(--muted)}
.more{display:inline-flex;gap:10px;align-items:center;font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid var(--ink);padding-bottom:3px}
.more .arr{transition:transform .4s var(--ease)}
.more:hover .arr{transform:translateX(4px)}

/* ORBE */
.orb{position:relative;aspect-ratio:1;max-width:100%;border-radius:50%}
.orb{transition:transform 1.2s var(--ease)}
.orb:hover{transform:scale(1.03)}
.orb canvas{position:absolute;left:-18%;top:-18%;width:136%;height:136%;display:block;pointer-events:none}


.progress{position:fixed;top:0;left:0;right:0;height:1px;z-index:60;transform-origin:0 50%;transform:scaleX(0);background:var(--accent);transition:background 1.2s}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;padding-top:env(safe-area-inset-top,0px);background:rgba(255,255,255,.76);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:transform .6s var(--ease)}
.nav.hide{transform:translateY(-100%)}
.nav .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center;padding-block:16px}
.brand{grid-column:1/5;display:flex;align-items:center;gap:14px}
.logo{display:flex;align-items:center;gap:10px;font-weight:500;font-size:15px;letter-spacing:.16em;font-variation-settings:"wdth" 125}
.logo .orb{width:16px}
.crumb{font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);overflow:hidden}
.crumb span{display:inline-block;transition:transform .6s var(--ease),opacity .6s}
.crumb.swap span{transform:translateY(100%);opacity:0}
.nav-meta{grid-column:6/10;font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);display:flex;gap:24px;font-variant-numeric:tabular-nums}
.menu-btn{grid-column:11/13;justify-self:end;font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.08em;text-transform:uppercase;display:flex;align-items:center;gap:10px;padding:8px 0}
.menu-btn i{position:relative;width:22px;height:8px;display:block}
.menu-btn i::before,.menu-btn i::after{content:"";position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .5s var(--ease),width .5s var(--ease)}
.menu-btn i::before{top:0}.menu-btn i::after{bottom:0;width:60%;left:auto;right:0}
.menu-btn:hover i::after{width:100%}
body.menu-open .menu-btn i::before{transform:translateY(3.5px) rotate(45deg)}
body.menu-open .menu-btn i::after{width:100%;transform:translateY(-3.5px) rotate(-45deg)}
body.menu-open .nav{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
@media(max-width:860px){.nav-meta{display:none}.brand{grid-column:1/10}}

/* MENU */
.menu{position:fixed;inset:0;z-index:40;background:var(--bg);clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease);visibility:hidden;overflow:auto}
body.menu-open .menu{clip-path:inset(0 0 0 0);visibility:visible}
.menu .wrap{padding-top:calc(110px + env(safe-area-inset-top,0px));padding-bottom:40px;min-height:100%;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-content:space-between;row-gap:48px}
.menu-list{grid-column:1/8;list-style:none;margin:0;padding:0}
.menu-list li{overflow:hidden;border-bottom:1px solid var(--line)}
.menu-list a{display:flex;align-items:baseline;gap:18px;padding:10px 0;font-size:clamp(34px,5.6vw,80px);font-weight:200;line-height:1.05;letter-spacing:-.02em;transform:translateY(105%);transition:transform .8s var(--ease),padding .5s var(--ease),color .3s}
.menu-list a .idx{font-size:var(--s-xs);transform:translateY(-1.6em)}
.menu-list a .kind{margin-left:auto;align-self:center;font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.menu-list a:hover{padding-left:16px;color:var(--muted)}
.menu-list a.cur{color:var(--muted)}
body.menu-open .menu-list a{transform:none}
body.menu-open .menu-list li:nth-child(1) a{transition-delay:.25s}
body.menu-open .menu-list li:nth-child(2) a{transition-delay:.31s}
body.menu-open .menu-list li:nth-child(3) a{transition-delay:.37s}
body.menu-open .menu-list li:nth-child(4) a{transition-delay:.43s}
body.menu-open .menu-list li:nth-child(5) a{transition-delay:.49s}
body.menu-open .menu-list li:nth-child(6) a{transition-delay:.55s}
.menu-aside{grid-column:9/13;display:flex;flex-direction:column;gap:28px;align-self:center;opacity:0;transform:scale(.92);transition:opacity .8s .4s,transform 1.4s .4s var(--ease)}
body.menu-open .menu-aside{opacity:1;transform:none}
.menu-aside .orb{width:min(100%,340px)}
.menu-aside .contact{display:flex;flex-direction:column;gap:6px}
.menu-foot{grid-column:1/13;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
@media(max-width:760px){.menu-list,.menu-aside{grid-column:1/13}.menu-aside .orb{width:110px}}

/* CORTINA entre páginas */
.curtain{position:fixed;inset:0;z-index:45;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;transform:translateY(100%);pointer-events:none}
.curtain .orb{width:72px}
.curtain.in{transition:transform .7s var(--ease);transform:none}
.curtain.out{transition:transform .8s var(--ease);transform:translateY(-100%)}

/* HERO landing */
.hero{padding-top:calc(124px + env(safe-area-inset-top,0px));padding-bottom:clamp(56px,8vw,120px)}
.hero-eyebrow{grid-column:1/13;display:flex;justify-content:space-between;margin-bottom:clamp(28px,4vw,56px)}
.hero h1{grid-column:1/9;grid-row:2;margin:0;font-size:var(--s-xxl);font-weight:200;line-height:.96;letter-spacing:-.035em;font-variation-settings:"wdth" 104;align-self:start}
.ln{display:block;overflow:hidden;padding-bottom:.06em}
.ln>span{display:inline-block}
.play .ln>span{animation:rise 1.2s var(--ease) both}
.play .ln:nth-child(2)>span{animation-delay:.1s}
.play .ln:nth-child(3)>span{animation-delay:.2s}
h1 em,h2 em{font-style:italic;font-weight:200;color:var(--muted)}
@keyframes rise{from{transform:translateY(105%)}}
@keyframes fade{from{opacity:0}}
@keyframes grow{from{opacity:0;transform:scale(.86)}}
.play .fade{animation:fade 1s .4s both}
.play .grow{animation:grow 1.8s .1s var(--ease) both}
.hero-orb{grid-column:9/13;grid-row:2/4;align-self:center;justify-self:end;width:min(100%,440px);display:flex;flex-direction:column;gap:56px}
.hero-copy{grid-column:1/5;grid-row:3;margin-top:clamp(36px,5vw,72px);display:flex;flex-direction:column;gap:26px}
.hero-copy p{margin:0;max-width:40ch}
@media(max-width:860px){
  .hero h1{grid-column:1/13;grid-row:auto}
  .hero-orb{grid-column:1/13;grid-row:auto;justify-self:start;width:min(64vw,300px);margin-top:36px}
  .hero-copy{grid-column:1/13;grid-row:auto;margin-top:12px}
}

.hero-orb .cap{display:flex;justify-content:space-between}

.btn{display:inline-flex;align-items:center;gap:14px;font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.08em;text-transform:uppercase;padding:14px 20px 14px 22px;border:1px solid var(--ink);border-radius:999px;position:relative;overflow:hidden;align-self:flex-start;isolation:isolate;transition:color .45s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;background:var(--ink);transform:translateY(101%);border-radius:999px;transition:transform .5s var(--ease);z-index:-1}
.btn:hover{color:var(--bg)}
.btn:hover::before{transform:none}
.btn .arr{transition:transform .4s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}

.marquee{border-block:1px solid var(--line);overflow:hidden;padding-block:16px;white-space:nowrap}
.marquee-track{display:inline-flex;animation:marq 48s linear infinite}
.marquee span{font-size:var(--s-lg);font-weight:200;font-variation-settings:"wdth" 112;letter-spacing:-.01em;display:inline-flex;align-items:center;gap:40px;padding-right:40px}
.marquee span::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--faint)}
@keyframes marq{to{transform:translateX(-50%)}}

/* SECCIONES */
.sec{padding-block:clamp(80px,11vw,170px)}
.sec.tight{padding-top:0}
.sec-head{margin-bottom:clamp(40px,6vw,88px)}
.sec-head .idx{grid-column:1/3;padding-top:.9em}
.sec-head h2{grid-column:3/11;margin:0;font-size:var(--s-xl);font-weight:200;line-height:1.02;letter-spacing:-.03em;font-variation-settings:"wdth" 104;text-wrap:balance}
.sec-head .lede{grid-column:3/8;margin:18px 0 0;color:var(--muted);max-width:52ch}
.sec-head .go{grid-column:3/11;margin-top:28px}
@media(max-width:760px){.sec-head .idx,.sec-head h2,.sec-head .lede,.sec-head .go{grid-column:1/13}}

.rv{transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
.rv.pre{opacity:0;transform:translateY(28px)}

/* MODELO (diagrama) */
.model-stage{grid-column:1/13;position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center;min-height:440px}
.model-stage svg.links{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.node{position:relative;z-index:1;display:inline-flex;flex-direction:column;gap:4px}
.node .mono{color:var(--muted)}
.node-t{font-size:var(--s-lg);font-weight:300;letter-spacing:-.01em}
.n-you{grid-column:1/3;justify-self:start}
.n-you .you-dot{width:12px;height:12px;border-radius:50%;border:1px solid var(--ink);margin-bottom:10px}
.n-pm{grid-column:5/7;justify-self:center;align-items:center;text-align:center}
.n-pm .orb{width:104px;margin-bottom:14px}
.n-team{grid-column:9/13;display:flex;flex-direction:column}
.chip{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);transition:padding .8s var(--ease)}
.chip .mono{color:var(--faint);transition:color .8s}
.chip .lbl{display:flex;align-items:center;gap:10px}
.chip .lbl::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent);transform:scale(0);transition:transform .8s var(--ease),background 1.2s}
.chip.on{padding-left:6px}
.chip.on .lbl::before{transform:scale(1)}
.chip.on .mono{color:var(--ink)}
.model-notes{margin-top:clamp(48px,6vw,90px)}
.model-notes>div{grid-column:span 4;display:flex;flex-direction:column;gap:10px}
.model-notes h3{margin:0;font-size:var(--s-md);font-weight:500}
.model-notes p{margin:0;color:var(--muted);max-width:40ch}
@media(max-width:860px){
  .model-stage{min-height:0;row-gap:48px}
  .n-you,.n-pm,.n-team{grid-column:1/13;justify-self:start}
  .n-pm{align-items:flex-start;text-align:left}
  .n-team{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gap)}
  .model-notes>div{grid-column:1/13}
}

/* TABLAS */
.tbl-wrap{grid-column:3/13;overflow-x:auto}
.tbl{width:100%;min-width:640px;border-collapse:collapse}
.tbl th,.tbl td{text-align:left;padding:18px 16px 18px 0;border-bottom:1px solid var(--line);vertical-align:top;font-weight:300}
.tbl thead th{font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:400}
.tbl td{color:var(--muted)}
.tbl td:first-child{width:24%}
.tbl .us{color:var(--ink);font-weight:400}
.tbl td.strong{color:var(--ink)}
.tbl tbody tr{transition:background .3s}
.tbl tbody tr:hover{background:var(--cloud)}
@media(max-width:760px){.tbl-wrap{grid-column:1/13}}

/* SERVICIOS lista */
.svc-list{grid-column:1/13;list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.svc{position:relative;border-bottom:1px solid var(--line)}
.svc-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:baseline;padding:clamp(18px,2.4vw,30px) 0}
.svc-row .idx{grid-column:1/3}
.svc-row h3{grid-column:3/7;margin:0;font-size:clamp(26px,3.6vw,52px);font-weight:200;letter-spacing:-.025em;line-height:1;transition:transform .8s var(--ease),font-variation-settings .8s var(--ease)}
.svc-row p{grid-column:7/11;margin:0;color:var(--muted);max-width:44ch;transition:color .4s}
.svc-row .who{grid-column:11/13;justify-self:end;text-align:right}
.svc::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--accent);transition:width 1s var(--ease)}
.svc:hover::after{width:100%}
.svc:hover h3{transform:translateX(12px);font-variation-settings:"wdth" 118}
.svc:hover p{color:var(--ink)}
@media(max-width:860px){
  .svc-row .idx,.svc-row h3,.svc-row p,.svc-row .who{grid-column:1/13}
  .svc-row h3{margin-top:6px}.svc-row p{margin-top:10px}
  .svc-row .who{justify-self:start;text-align:left;margin-top:10px}
}

/* AUTOMATIZACION (landing) */
.band{background:var(--cloud)}
.auto-head .orb{grid-column:10/13;grid-row:1/4;justify-self:end;align-self:start;width:min(100%,240px)}
.auto-head h2{grid-column:3/10}
@media(max-width:760px){.auto-head .orb{grid-column:1/13;grid-row:auto;justify-self:start;width:120px;margin-bottom:16px;order:-1}.auto-head h2{grid-column:1/13}}

/* pipeline: el punto recorre los pasos */
.pipe{grid-column:1/13;position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));column-gap:var(--gap)}
.pipe-line{position:absolute;left:0;right:0;top:0;height:1px;background:var(--line)}
.pipe-fill{position:absolute;left:0;top:0;height:1px;width:0;background:var(--ink)}
.pipe-dot{position:absolute;top:-4px;left:0;width:9px;height:9px;margin-left:-4px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 16%,transparent);transition:background 1.2s}
.pstep{padding-top:24px;display:flex;flex-direction:column;gap:8px}
.pstep .mono{color:var(--faint);transition:color .6s}
.pstep b{font-weight:400;transition:color .6s;color:var(--muted)}
.pstep span.d{font-size:var(--s-sm);color:var(--muted);max-width:26ch}
.pstep.lit .mono{color:var(--ink)}
.pstep.lit b{color:var(--ink)}
@media(max-width:760px){
  .pipe{grid-template-columns:1fr;padding-left:28px;row-gap:8px}
  .pipe-line{left:0;right:auto;top:0;bottom:0;width:1px;height:auto}
  .pipe-fill{width:1px;height:0}
  .pipe-dot{left:0;top:0;margin-left:-4px;margin-top:-4px}
  .pstep{padding-top:0;padding-bottom:20px}
}
.areas{grid-column:1/13;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--gap);row-gap:32px;margin-top:clamp(56px,7vw,100px)}
.area{display:flex;flex-direction:column;gap:10px;padding-top:16px;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.area h3{margin:0;font-size:var(--s-md);font-weight:500}
.area p{margin:0;font-size:var(--s-sm);color:var(--muted)}
@media(max-width:960px){.areas{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.areas{grid-template-columns:1fr}}
.foot-link{grid-column:1/13;margin-top:clamp(48px,6vw,80px)}

/* PROCESO (landing) */
.proc{grid-column:1/13;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));column-gap:var(--gap);row-gap:40px}
.proc-i{display:flex;flex-direction:column;gap:12px;padding-top:18px;border-top:1px solid var(--line);position:relative}
.proc-i::before{content:"";position:absolute;top:-1px;left:0;width:0;height:1px;background:var(--accent);transition:width 1s var(--ease)}
.proc-i:hover::before{width:100%}
.proc-i h3{margin:0;font-size:var(--s-lg);font-weight:300;letter-spacing:-.01em}
.proc-i p{margin:0;color:var(--muted);font-size:var(--s-sm)}
.proc-i .t{color:var(--faint);margin-top:auto}
@media(max-width:960px){.proc{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.proc{grid-template-columns:1fr}}

/* FAQ */
.faq{grid-column:3/11;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:flex;justify-content:space-between;gap:20px;padding:22px 0;cursor:pointer;font-size:var(--s-lg);font-weight:300;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pl{flex:none;width:14px;height:14px;position:relative;margin-top:.45em}
.faq summary .pl::before,.faq summary .pl::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:currentColor;transition:transform .5s var(--ease)}
.faq summary .pl::after{transform:rotate(90deg)}
.faq details[open] .pl::after{transform:rotate(0)}
.faq details p{margin:0 0 24px;color:var(--muted);max-width:60ch}
@media(max-width:760px){.faq{grid-column:1/13}}

/* CONTACTO */
.contact h2{grid-column:1/10;margin:0;font-size:var(--s-xxl);font-weight:200;letter-spacing:-.04em;line-height:.95;font-variation-settings:"wdth" 104}
.contact-orb{grid-column:10/13;justify-self:end;align-self:end;width:min(100%,180px)}
.contact-row{margin-top:clamp(40px,5vw,72px)}
.contact-mail{grid-column:1/6;display:flex;flex-direction:column;gap:16px}
.mail{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.mail span{font-size:var(--s-lg);font-weight:300;user-select:all}
.copy{font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid var(--ink);padding-bottom:2px}
form.brief{grid-column:7/13;display:grid;grid-template-columns:1fr 1fr;gap:28px var(--gap)}
.inp{display:flex;flex-direction:column;gap:6px}
.inp.full{grid-column:1/3}
.inp>label,.inp>.lab{font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.inp input,.inp textarea{font:inherit;font-weight:300;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--line);padding:8px 0;border-radius:0;transition:border-color .3s}
.inp input:focus,.inp textarea:focus{outline:none;border-bottom-color:var(--ink)}
.inp textarea{resize:vertical;min-height:84px}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pills label{font-size:var(--s-sm);cursor:pointer;position:relative}
.pills input{position:absolute;opacity:0;pointer-events:none}
.pills span{display:inline-block;padding:7px 14px;border:1px solid var(--line);border-radius:999px;transition:all .3s}
.pills label:hover span{border-color:var(--faint)}
.pills input:checked+span{border-color:var(--ink);background:var(--ink);color:var(--bg)}
.pills input:focus-visible+span{outline:1px solid var(--accent);outline-offset:3px}
.form-foot{grid-column:1/3;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.form-msg{font-size:var(--s-sm);color:var(--muted)}
@media(max-width:860px){.contact h2{grid-column:1/13}.contact-orb{grid-column:1/13;justify-self:start;width:110px;grid-row:1}.contact-mail,form.brief{grid-column:1/13}form.brief{grid-template-columns:1fr}.inp.full,.form-foot{grid-column:1/2}}

/* ===== PÁGINAS INTERNAS ===== */
.page-hero{padding-top:calc(150px + env(safe-area-inset-top,0px));padding-bottom:clamp(64px,9vw,140px)}
.page-hero .eyebrow{grid-column:1/13;display:flex;justify-content:space-between;margin-bottom:clamp(28px,4vw,56px)}
.page-hero h1{grid-column:1/10;margin:0;font-size:var(--s-xxl);font-weight:200;line-height:.96;letter-spacing:-.035em;font-variation-settings:"wdth" 104}
.page-hero .orb{grid-column:10/13;justify-self:end;align-self:end;width:min(100%,260px)}
.page-hero .lede{grid-column:1/6;margin:clamp(32px,4vw,56px) 0 0;max-width:46ch}
.page-hero .toc{grid-column:8/13;margin-top:clamp(32px,4vw,56px);display:flex;flex-direction:column;border-top:1px solid var(--line)}
.page-hero .toc a{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font-size:var(--s-sm);transition:padding .5s var(--ease),color .3s}
.page-hero .toc a:hover{padding-left:8px;color:var(--muted)}
@media(max-width:860px){.page-hero h1,.page-hero .lede,.page-hero .toc{grid-column:1/13}.page-hero .orb{grid-column:1/13;grid-row:2;justify-self:start;width:120px;margin-bottom:24px}}

.trio{grid-column:1/13;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gap);row-gap:40px}
.trio>div{display:flex;flex-direction:column;gap:12px;padding-top:18px;border-top:1px solid var(--line)}
.trio h3{margin:0;font-size:var(--s-lg);font-weight:300;letter-spacing:-.01em}
.trio p{margin:0;color:var(--muted);max-width:42ch}
.trio .pro,.trio .con{font-size:var(--s-sm);display:flex;gap:10px}
.trio .pro::before{content:"+";color:var(--ink)}
.trio .con::before{content:"−";color:var(--faint)}
.trio .con{color:var(--muted)}
@media(max-width:860px){.trio{grid-template-columns:1fr}}

.statement{padding-block:clamp(80px,11vw,170px)}
.statement p{grid-column:3/11;margin:0;font-size:var(--s-xl);font-weight:200;line-height:1.08;letter-spacing:-.03em;text-wrap:balance}
.statement .orb{grid-column:1/3;width:min(100%,120px);align-self:start}
@media(max-width:760px){.statement p{grid-column:1/13}.statement .orb{grid-column:1/13;width:80px;margin-bottom:12px}}

.week{grid-column:1/13;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--gap);row-gap:32px}
.day{display:flex;flex-direction:column;gap:10px}
.day .bar{height:3px;background:var(--line);position:relative;overflow:hidden;border-radius:2px}
.day .bar i{position:absolute;inset:0;background:var(--accent);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.4s var(--ease),background 1.2s}
.week.go .day .bar i{transform:scaleX(1)}
.week.go .day:nth-child(2) .bar i{transition-delay:.3s}
.week.go .day:nth-child(3) .bar i{transition-delay:.6s}
.week.go .day:nth-child(4) .bar i{transition-delay:.9s}
.day h3{margin:6px 0 0;font-size:var(--s-lg);font-weight:300}
.day p{margin:0;color:var(--muted);font-size:var(--s-sm);max-width:30ch}
@media(max-width:860px){.week{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.week{grid-template-columns:1fr}}

.configs{grid-column:1/13;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gap);row-gap:24px}
.cfg{display:flex;flex-direction:column;gap:20px;padding:clamp(20px,2.4vw,32px);border:1px solid var(--line);border-radius:4px;transition:border-color .4s}
.cfg:hover{border-color:var(--ink)}
.cfg h3{margin:0;font-size:var(--s-lg);font-weight:300}
.cfg p{margin:0;color:var(--muted);font-size:var(--s-sm)}
.cfg ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.cfg li{font-size:var(--s-sm);padding:5px 12px;border:1px solid var(--line);border-radius:999px}
.cfg li.add{border-color:var(--ink)}
.cfg-note{grid-column:1/-1;font-size:var(--s-xs);color:var(--muted);margin:0}
@media(max-width:860px){.configs{grid-template-columns:1fr}}

/* servicios detalle */
.sd{grid-column:1/13;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.sd-nav{grid-column:1/4;position:sticky;top:110px;align-self:start;display:flex;flex-direction:column}
.sd-nav a{display:flex;gap:14px;padding:9px 0;font-size:var(--s-sm);color:var(--faint);transition:color .4s,padding .5s var(--ease)}
.sd-nav a.on{color:var(--ink);padding-left:10px}
.sd-nav a .idx{color:inherit}
.sd-body{grid-column:5/13;display:flex;flex-direction:column}
.sblock{padding-block:0 clamp(64px,8vw,120px);display:grid;grid-template-columns:repeat(8,minmax(0,1fr));column-gap:var(--gap);row-gap:24px}
.sblock>*{min-width:0}
.sblock .idx{grid-column:1/9}
.sblock h3{grid-column:1/9;margin:0;font-size:var(--s-xl);font-weight:200;letter-spacing:-.03em;line-height:1}
.sblock>p{grid-column:1/6;margin:0;max-width:48ch}
.sblock .inc{grid-column:1/5;list-style:none;margin:8px 0 0;padding:0;border-top:1px solid var(--line)}
.sblock .inc li{padding:10px 0;border-bottom:1px solid var(--line);font-size:var(--s-sm)}
.sblock .meta{grid-column:6/9;margin-top:8px;display:flex;flex-direction:column;gap:18px}
.sblock .meta div{display:flex;flex-direction:column;gap:4px}
.sblock .meta span:last-child{font-size:var(--s-sm)}
@media(max-width:860px){.sd-nav{display:none}.sd-body{grid-column:1/13}.sblock>p,.sblock .inc,.sblock .meta{grid-column:1/9}}

/* timeline proceso */
.tl{grid-column:3/13;position:relative;padding-left:40px}
.tl-line{position:absolute;left:0;top:6px;bottom:0;width:1px;background:var(--line)}
.tl-fill{position:absolute;left:0;top:6px;width:1px;height:0;background:var(--ink)}
.ph{position:relative;padding-bottom:clamp(56px,7vw,100px);display:grid;grid-template-columns:repeat(10,minmax(0,1fr));column-gap:var(--gap);row-gap:18px}
.ph>*{min-width:0}
.ph::before{content:"";position:absolute;left:-44px;top:6px;width:9px;height:9px;border-radius:50%;background:var(--bg);border:1px solid var(--faint);transition:all .6s var(--ease)}
.ph.on::before{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 16%,transparent)}
.ph .top{grid-column:1/11;display:flex;justify-content:space-between;gap:12px}
.ph h3{grid-column:1/11;margin:0;font-size:var(--s-xl);font-weight:200;letter-spacing:-.03em;line-height:1}
.ph .cols{grid-column:1/11;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gap);row-gap:20px;margin-top:8px}
.ph .cols div{display:flex;flex-direction:column;gap:8px;padding-top:12px;border-top:1px solid var(--line)}
.ph .cols p{margin:0;font-size:var(--s-sm);color:var(--muted)}
@media(max-width:860px){.tl{grid-column:1/13;padding-left:28px}.ph::before{left:-32px}.ph .cols{grid-template-columns:1fr}}

.tools{grid-column:3/13;display:flex;flex-wrap:wrap;gap:8px}
.tools span{padding:8px 16px;border:1px solid var(--line);border-radius:999px;font-size:var(--s-sm);transition:border-color .3s}
.tools span:hover{border-color:var(--ink)}
@media(max-width:760px){.tools{grid-column:1/13}}
.duo{grid-column:3/13;display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gap);row-gap:24px}
.duo>div{padding:clamp(20px,2.4vw,32px);background:var(--bg);border-radius:4px;display:flex;flex-direction:column;gap:12px}
.duo h3{margin:0;font-size:var(--s-lg);font-weight:300}
.duo p{margin:0;color:var(--muted);font-size:var(--s-sm)}
@media(max-width:760px){.duo{grid-column:1/13;grid-template-columns:1fr}}
.areas.big{margin-top:0}
.areas.big .area h3{font-size:var(--s-lg);font-weight:300}
.areas.big ul{list-style:none;margin:6px 0 0;padding:0}
.areas.big li{font-size:var(--s-sm);color:var(--muted);padding:8px 0;border-bottom:1px solid var(--line)}

/* cierre de página */
.next{border-top:1px solid var(--line)}
.next a{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding-block:clamp(48px,7vw,110px);align-items:end}
.next .mono{grid-column:1/4}
.next .t{grid-column:4/12;font-size:var(--s-xxl);font-weight:200;letter-spacing:-.04em;line-height:.95;transition:transform .9s var(--ease)}
.next .a{grid-column:12/13;justify-self:end;font-size:var(--s-xl);font-weight:200;transition:transform .9s var(--ease)}
.next a:hover .t{transform:translateX(16px)}
.next a:hover .a{transform:translateX(8px)}
@media(max-width:760px){.next .mono,.next .t{grid-column:1/13}.next .a{grid-column:1/13;justify-self:start}}
.cta-band{padding-block:clamp(64px,8vw,120px)}
.cta-band h2{grid-column:1/9;margin:0;font-size:var(--s-xl);font-weight:200;letter-spacing:-.03em;line-height:1.02}
.cta-band .act{grid-column:9/13;align-self:end;justify-self:end;display:flex;flex-direction:column;gap:14px;align-items:flex-end}
@media(max-width:760px){.cta-band h2,.cta-band .act{grid-column:1/13;justify-self:start;align-items:flex-start}}

/* FOOTER */
footer{border-top:1px solid var(--line);padding-block:28px 40px;overflow:hidden}
footer .grid>*{font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.f1{grid-column:1/4}.f2{grid-column:5/9}.f3{grid-column:10/13;justify-self:end}
.f2 a:hover,.f3:hover{color:var(--ink)}
@media(max-width:760px){.f1,.f2,.f3{grid-column:1/13;justify-self:start}}
.wordmark{font-size:clamp(80px,25vw,400px);font-weight:100;letter-spacing:-.06em;line-height:.8;font-variation-settings:"wdth" 125;color:var(--ink);margin:48px 0 0;user-select:none;white-space:nowrap}


/* =====================================================================
   MOBILE · eje central sobre la grilla suiza
   Mismos 12 tracks, pero cada bloque ocupa el ancho completo y se alinea
   al eje central. Ritmo vertical fijo: 12 · 24 · 48 · 96. Filetes de lado a lado.
   ===================================================================== */
@media(max-width:760px){
  :root{--s-xxl:clamp(40px,12.4vw,64px);--s-xl:clamp(30px,8.6vw,40px);--s-lg:20px}
  .grid>*,.svc-row>*,.sblock>*,.ph>*,.next a>*,.model-stage>*{grid-column:1/-1!important}
  .sec{padding-block:96px}
  .sec.tight{padding-top:0}
  .sec-head{margin-bottom:48px;text-align:center;justify-items:center;row-gap:12px}
  .sec-head .idx{padding-top:0}
  .sec-head h2{max-width:14ch}
  .sec-head .lede{margin:12px auto 0;max-width:34ch}
  .sec-head .go{margin-top:12px}
  p{margin-inline:auto}
  .foot-link{text-align:center}

  /* nav: hora · logo · menú */
  .nav .wrap{grid-template-columns:1fr auto 1fr}
  .nav-meta{display:flex;grid-column:1;grid-row:1;gap:0}
  .nav-meta span:not(#clock){display:none}
  .brand{grid-column:2;grid-row:1;justify-self:center}
  .crumb{display:none}
  .menu-btn{grid-column:3;grid-row:1}

  /* menú */
  .menu-list a{justify-content:center;font-size:clamp(34px,10vw,48px)}
  .menu-list a .kind{display:none}
  .menu-list a:hover{padding-left:0}
  .menu-aside{align-items:center;text-align:center}
  .menu-aside .contact{align-items:center}
  .menu-foot{flex-direction:column;align-items:center;text-align:center}

  /* hero */
  .hero{padding-top:calc(104px + env(safe-area-inset-top,0px));padding-bottom:72px;text-align:center}
  .hero-eyebrow{justify-content:center;gap:16px;flex-wrap:wrap;margin-bottom:24px}
  .hero-orb{grid-row:auto;order:-1;justify-self:center;width:min(70vw,280px);margin:0 0 24px;gap:24px}
  .hero-eyebrow{order:-2}
  .hero-orb .cap{justify-content:center;gap:24px}
  .hero h1{text-align:center}
  .hero-copy{align-items:center;margin-top:24px;gap:24px}
  .hero-copy p{max-width:34ch}
  .btn{align-self:center}

  /* modelo: vos → PM → equipo, en vertical */
  .model-stage{row-gap:56px;text-align:center}
  .n-you,.n-pm{justify-self:center;align-items:center;text-align:center}
  .n-pm .orb{width:96px}
  .n-team{justify-self:stretch;display:grid;grid-template-columns:1fr 1fr;column-gap:12px}
  .chip{justify-content:center;gap:8px}
  .chip .lbl::before{display:none}
  .chip.on{padding-left:0}
  .chip.on .lbl{color:var(--ink)}
  .chip .lbl{color:var(--muted);transition:color .8s}
  .model-notes{text-align:center;row-gap:48px}
  .model-notes>div{align-items:center}

  /* tablas apiladas: cada fila es un bloque centrado */
  .tbl{min-width:0}
  .tbl thead{display:none}
  .tbl tbody tr{display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px 0;border-bottom:1px solid var(--line);text-align:center}
  .tbl tbody tr:hover{background:none}
  .tbl td{display:block;border:0;padding:0;width:auto!important;text-align:center;max-width:34ch}
  .tbl td:first-child{font-size:var(--s-md);font-weight:500;color:var(--ink)}
  .tbl td[data-label]:not(:first-child)::before{content:attr(data-label);display:block;margin-bottom:2px;font-family:var(--f-mono);font-size:var(--s-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
  .tbl td.us{padding:10px 16px;border:1px solid var(--ink);border-radius:999px}
  .tbl td.us::before{color:var(--ink)!important}
  .tbl-wrap{border-top:1px solid var(--line)}

  /* servicios (landing) */
  .svc-row{text-align:center;justify-items:center;row-gap:8px}
  .svc-row h3,.svc-row p,.svc-row .who{margin-top:0}
  .svc-row .who{justify-self:center;text-align:center}
  .svc:hover h3{transform:none}

  /* automatización: el flujo baja por el eje central */
  .auto-head .orb{justify-self:center;width:120px;margin:0 0 12px}
  .pipe{grid-template-columns:1fr;padding-left:0;row-gap:32px}
  .pipe-line{left:50%;right:auto;top:0;bottom:0;width:1px;height:auto}
  .pipe-dot{z-index:0;margin-left:-4px;margin-top:-4px}
  .pstep{position:relative;z-index:1;padding:16px 0;align-items:center;text-align:center;background:var(--bg)}
  .band .pstep{background:var(--cloud)}
  .pstep span.d{max-width:28ch}
  .pipe-label{text-align:center}
  .areas{grid-template-columns:1fr;row-gap:32px;text-align:center}
  .area{align-items:center}
  .areas.big ul{width:100%}

  /* proceso (landing) y método */
  .proc{grid-template-columns:1fr;text-align:center;row-gap:32px}
  .proc-i{align-items:center}
  .proc-i::before{left:50%;transform:translateX(-50%)}
  .proc-i:hover::before{width:100%}

  /* FAQ: pregunta centrada, el + debajo */
  .faq summary{flex-direction:column;align-items:center;text-align:center;gap:12px}
  .faq summary .pl{margin-top:0}
  .faq details p{text-align:center}

  /* contacto */
  .contact{text-align:center}
  .contact h2{text-align:center}
  .contact-orb{justify-self:center;width:96px;margin-bottom:24px}
  .contact-mail{align-items:center}
  .mail{justify-content:center}
  form.brief{text-align:center;row-gap:24px;margin-top:48px}
  .inp{align-items:stretch}
  .inp input,.inp textarea{text-align:center}
  .pills{justify-content:center}
  .form-foot{flex-direction:column;align-items:center}

  /* páginas internas */
  .page-hero{padding-top:calc(112px + env(safe-area-inset-top,0px));padding-bottom:72px;text-align:center}
  .page-hero .eyebrow{justify-content:center;gap:16px;flex-wrap:wrap;margin-bottom:24px}
  .page-hero .orb{justify-self:center;width:140px;margin-bottom:24px}
  .page-hero .lede{margin:24px auto 0;max-width:34ch}
  .page-hero .toc{margin-top:48px}
  .page-hero .toc a{justify-content:center;gap:12px}
  .page-hero .toc a:hover{padding-left:0}
  .trio{grid-template-columns:1fr;text-align:center;row-gap:48px}
  .trio>div{align-items:center}
  .trio .pro,.trio .con{justify-content:center}
  .statement{padding-block:96px;text-align:center}
  .statement .orb{justify-self:center;width:72px;margin-bottom:24px}
  .week{grid-template-columns:1fr;row-gap:48px;text-align:center}
  .day{align-items:center}
  .day .bar{width:48px}
  .configs{grid-template-columns:1fr}
  .cfg{align-items:center;text-align:center}
  .cfg ul{justify-content:center}
  .cfg-note{text-align:center}
  .sblock{text-align:center;justify-items:center;padding-bottom:96px}
  .sblock .inc{width:100%}
  .sblock .meta{align-items:center}
  .tools{justify-content:center}
  .duo{grid-template-columns:1fr;text-align:center}
  .duo>div{align-items:center}

  /* línea de tiempo sobre el eje central */
  .tl{padding-left:0}
  .tl-line,.tl-fill{left:50%}
  .ph{position:relative;z-index:1;background:var(--bg);padding:0;margin-bottom:72px;text-align:center;justify-items:center;row-gap:12px}
  .ph::before{left:50%;top:-40px;margin-left:-4.5px}
  .ph .top{justify-content:center;gap:16px}
  .ph .cols{grid-template-columns:1fr;row-gap:24px;width:100%}
  .ph .cols div{align-items:center}

  /* CTA y siguiente */
  .cta-band{text-align:center}
  .cta-band h2{max-width:16ch;justify-self:center}
  .cta-band .act{justify-self:center;align-items:center;margin-top:24px}
  .next a{justify-items:center;text-align:center;row-gap:12px;padding-block:72px}
  .next .a{justify-self:center}
  .next a:hover .t{transform:none}

  /* footer */
  footer{text-align:center}
  footer .grid{row-gap:12px}
  .f1,.f2,.f3{justify-self:center!important}
  .wordmark{text-align:center;font-size:26vw;margin-top:48px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv.pre{opacity:1;transform:none}
}