@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400&display=swap");
/* MUVIN typography — Inter (primary) + JetBrains Mono (data/tracking).
   Both are the faces named in the Manual de Marca v1.0 and are open source.
   NOTE: served from Google Fonts CDN — no local binaries were provided. */

:root{--font-sans:"Inter","Helvetica Neue",Arial,sans-serif;--font-mono:"JetBrains Mono","SFMono-Regular",Menlo,monospace}

/* Base palette — values read off the MUVIN brand board (uploads/ brand sheet). */
:root{
--negro:#1a1a1a;
--hueso:#f8f6f1;
--lima:#c4f500;
--grafito:#3d3d3d;
--gris:#6b6b6b;
--rojo:#ff3b30;

/* extended ramp, derived in oklch from the six brand values */
--negro-900:#0e0e0e;
--negro-800:#1a1a1a;
--negro-700:#242424;
--grafito-600:#2e2e2e;
--grafito-500:#3d3d3d;
--grafito-400:#525252;
--gris-300:#6b6b6b;
--gris-200:#9a9a95;
--gris-100:#c9c7c0;
--hueso-050:#efece5;
--hueso-000:#f8f6f1;
--blanco:#ffffff;

--lima-600:#8fb400;
--lima-500:#a9d400;
--lima-400:#c4f500;
--lima-300:#d9fb5c;
--lima-100:#eefdb8;
--lima-050:#f7fee2;

--rojo-600:#d92f25;
--rojo-500:#ff3b30;
--rojo-100:#ffe1de;

/* alphas for overlays, hairlines and focus rings */
--alpha-lima-40:rgba(196,245,0,.4);
--alpha-lima-16:rgba(196,245,0,.16);
--alpha-lima-08:rgba(196,245,0,.08);
--alpha-blanco-12:rgba(255,255,255,.12);
--alpha-blanco-08:rgba(255,255,255,.08);
--alpha-negro-12:rgba(26,26,26,.12);
--alpha-negro-08:rgba(26,26,26,.08);
--alpha-negro-64:rgba(26,26,26,.64);
}

:root{
--text-hero:clamp(44px,6vw,72px);
--text-display:56px;
--text-title-1:40px;
--text-title-2:32px;
--text-title-3:24px;
--text-body-lg:18px;
--text-body:16px;
--text-body-sm:14px;
--text-caption:13px;
--text-label:12px;

--lh-tight:1.02; /* @kind font */
--lh-snug:1.15; /* @kind font */
--lh-normal:1.5; /* @kind font */
--lh-relaxed:1.65; /* @kind font */

--ls-hero:-.03em;
--ls-title:-.02em;
--ls-body:0em;
--ls-label:.1em;
--ls-mono:.01em;

--fw-regular:400; /* @kind font */
--fw-medium:500; /* @kind font */
--fw-semibold:600; /* @kind font */
--fw-bold:700; /* @kind font */
--fw-black:800; /* @kind font */
}

/* 4px base grid; --space-6 (24px) is the default component gutter. */
:root{
--space-0:0px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;
--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;
--space-24:96px;--space-32:128px;
--gutter:24px;
--section-y:96px;
--container-max:1200px;
--container-narrow:720px;
}

:root{
--radius-xs:4px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-pill:999px;
--border-hairline:1px;--border-strong:2px;--stroke-icon:2px; /* @kind other */
--border-dark:1px solid var(--alpha-blanco-12);
--border-light:1px solid var(--alpha-negro-12);
/* Flat brand: shadows are used sparingly, never decoratively. */
--shadow-none:none;
--shadow-card:0 1px 2px rgba(26,26,26,.06),0 8px 24px rgba(26,26,26,.06);
--shadow-raised:0 12px 40px rgba(14,14,14,.24);
--shadow-lima-glow:0 0 0 4px var(--alpha-lima-16);
--focus-ring:0 0 0 3px var(--alpha-lima-40);
}

:root{
--dur-instant:80ms; /* @kind other */
--dur-fast:140ms; /* @kind other */
--dur-base:220ms; /* @kind other */
--dur-slow:380ms; /* @kind other */
--dur-pulse:1600ms; /* @kind other */
--ease-out:cubic-bezier(.2,.8,.25,1); /* @kind other */
--ease-in-out:cubic-bezier(.4,0,.2,1); /* @kind other */
--ease-entrance:cubic-bezier(.16,1,.3,1); /* @kind other */
--transition-base:all var(--dur-fast) var(--ease-out); /* @kind other */
}
@keyframes muvin-pulse{0%{box-shadow:0 0 0 0 var(--alpha-lima-40)}70%{box-shadow:0 0 0 12px rgba(196,245,0,0)}100%{box-shadow:0 0 0 0 rgba(196,245,0,0)}}

/* Semantic aliases. Default surface is bone (light); .muvin-dark flips to graphite. */
:root{
--surface-page:var(--hueso-000);
--surface-raised:var(--blanco);
--surface-sunken:var(--hueso-050);
--surface-card:var(--blanco);
--surface-inverse:var(--negro-800);
--surface-accent:var(--lima-400);

--text-primary:var(--negro-800);
--text-secondary:var(--grafito-500);
--text-tertiary:var(--gris-300);
--text-inverse:var(--hueso-000);
--text-on-accent:var(--negro-800);
--text-link:var(--negro-800);
--text-link-hover:var(--lima-600);

--border-subtle:var(--alpha-negro-08);
--border-default:var(--alpha-negro-12);
--border-strong-color:var(--negro-800);

--action-primary-bg:var(--lima-400);
--action-primary-fg:var(--negro-800);
--action-primary-bg-hover:var(--lima-300);
--action-primary-bg-active:var(--lima-500);
--action-secondary-bg:var(--negro-800);
--action-secondary-fg:var(--hueso-000);
--action-secondary-bg-hover:var(--grafito-500);
--action-ghost-fg:var(--negro-800);
--action-disabled-bg:var(--hueso-050);
--action-disabled-fg:var(--gris-200);

--state-active:var(--lima-400);
--state-done:var(--lima-400);
--state-pending:var(--gris-200);
--state-alert:var(--rojo-500);
--state-alert-soft:var(--rojo-100);

--data-fg:var(--negro-800);
--data-fg-on-dark:var(--lima-400);
}
.muvin-dark{
--surface-page:var(--negro-800);
--surface-raised:var(--negro-700);
--surface-sunken:var(--negro-900);
--surface-card:var(--negro-700);
--surface-inverse:var(--hueso-000);
--text-primary:var(--hueso-000);
--text-secondary:var(--gris-100);
--text-tertiary:var(--gris-200);
--text-inverse:var(--negro-800);
--text-link:var(--hueso-000);
--text-link-hover:var(--lima-400);
--border-subtle:var(--alpha-blanco-08);
--border-default:var(--alpha-blanco-12);
--border-strong-color:var(--hueso-000);
--action-secondary-bg:var(--hueso-000);
--action-secondary-fg:var(--negro-800);
--action-secondary-bg-hover:var(--hueso-050);
--action-ghost-fg:var(--hueso-000);
--action-disabled-bg:var(--negro-700);
--action-disabled-fg:var(--gris-300);
--data-fg:var(--lima-400);
}



:root{--e:cubic-bezier(.16,1,.3,1);--ink:#1a1a1a;--bone:#f8f6f1;--lima:#c4f500;--g2:#9a9a95;--g1:#c9c7c0;--line:rgba(255,255,255,.12);--lineD:rgba(26,26,26,.12)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--bone);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.loading{overflow:hidden}
a{color:inherit;text-decoration:none}a:hover{color:inherit}
svg{display:block}
.wrap{max-width:1320px;margin:0 auto;padding:0 clamp(20px,4vw,56px)}
.mono{font-family:var(--font-mono);letter-spacing:.01em}
.eyebrow{display:flex;align-items:center;gap:14px;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--g2)}
.eyebrow i{height:2px;width:40px;background:var(--lima);border-radius:9px;flex:none}
.light{background:var(--bone);color:var(--ink)}.light .eyebrow{color:#6b6b6b}.light .eyebrow i{background:var(--ink)}
.eyebrow--dk{color:var(--ink)}.eyebrow--dk i{background:var(--ink)}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.045em;line-height:.96}
.h2{font-size:clamp(40px,6vw,96px)}
p{margin:0}
.ln{display:block;overflow:hidden;padding-bottom:.09em;margin-bottom:-.09em}
.ln>span{display:inline-block;transform:translate3d(0,112%,0);transition:transform 1.25s var(--e)}
.in .ln>span,.is-in .ln>span{transform:none}
.ln:nth-child(2)>span{transition-delay:.08s}.ln:nth-child(3)>span{transition-delay:.16s}.ln:nth-child(4)>span{transition-delay:.24s}
.reveal{opacity:0;transform:translate3d(0,32px,0);transition:opacity 1s var(--e),transform 1s var(--e)}
.reveal.in{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}
.loader{position:fixed;inset:0;z-index:200;background:var(--ink);display:grid;place-items:center;clip-path:inset(0 0 0 0);transition:clip-path 1s var(--e)}
.loader.out{clip-path:inset(0 0 100% 0)}
.loader__in{display:flex;flex-direction:column;align-items:center;gap:22px}
.loader svg{width:96px;overflow:visible}
.loader path{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.3s var(--e) .1s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.loader__n{font-size:12px;color:var(--g2)}
.cur{position:fixed;left:0;top:0;z-index:150;pointer-events:none;width:0;height:0;transition:opacity .3s}
.cur__r{position:absolute;left:-18px;top:-18px;width:36px;height:36px;border-radius:50%;border:1.5px solid var(--lima);display:grid;place-items:center;transition:width .45s var(--e),height .45s var(--e),left .45s var(--e),top .45s var(--e),background .3s,border-color .3s}
.cur.hover .cur__r{width:60px;height:60px;left:-30px;top:-30px;background:rgba(196,245,0,.12)}
.cur.big .cur__r{width:88px;height:88px;left:-44px;top:-44px;background:var(--lima)}
.cur__l{font-size:12px;font-weight:600;color:var(--ink);opacity:0;transition:opacity .2s;white-space:nowrap}
.cur.big .cur__l{opacity:1}
.cur.dk .cur__r{border-color:var(--ink)}.cur.dk.hover .cur__r{background:rgba(26,26,26,.1)}.cur.dk.big .cur__r{background:var(--ink)}.cur.dk .cur__l{color:var(--lima)}
.cur.off{opacity:0}
@media (pointer:coarse){.cur{display:none}}
.nav{position:fixed;left:0;right:0;top:0;z-index:100;transition:transform .7s var(--e)}
.nav.hide{transform:translateY(-110%)}
.nav::before{content:"";position:absolute;inset:0;background:rgba(26,26,26,.74);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line);opacity:0;transition:opacity .4s}
.nav.solid::before{opacity:1}
.nav__in{position:relative;display:flex;align-items:center;gap:44px;padding:18px clamp(20px,4vw,56px);max-width:1320px;margin:0 auto}
.logo{display:inline-flex;align-items:center;gap:12px}
.logo svg{width:34px;overflow:visible}
.logo path{stroke-dasharray:1;stroke-dashoffset:0}
.logo:hover path{animation:redraw 1s var(--e)}
@keyframes redraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.logo b{font-family:Comfortaa,sans-serif;font-weight:300;letter-spacing:.16em;font-size:19px;color:var(--bone)}
.logo--sm svg{width:26px}.logo--sm b{font-size:15px}
.nav__links{display:flex;gap:30px;font-size:14px;color:var(--g1)}
.ul{position:relative;display:inline-block}
.ul::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1.5px;background:var(--lima);transform:scaleX(0);transform-origin:right;transition:transform .55s var(--e)}
.ul:hover{color:var(--bone)}.ul:hover::after{transform:scaleX(1);transform-origin:left}
.ul--dk::after{background:var(--ink)}.ul--dk:hover{color:var(--ink)}
.nav__r{margin-left:auto;display:flex;align-items:center;gap:24px}
.nav__time{font-size:12px;color:var(--g2)}
.btn{position:relative;display:inline-flex;align-items:center;gap:12px;height:58px;padding:0 30px;border-radius:999px;font-size:15px;font-weight:600;border:0;cursor:pointer;white-space:nowrap}
.mag{will-change:transform;transition:transform .6s var(--e),background .3s,color .3s,box-shadow .3s}
.btn--sm{height:42px;padding:0 20px;font-size:13px}
.btn--lima{background:var(--lima);color:var(--ink)}.btn--lima:hover{color:var(--ink);background:#d9fb5c}
.btn--line{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.2);color:var(--bone)}.btn--line:hover{box-shadow:inset 0 0 0 1.5px var(--bone);color:var(--bone)}
.roll{display:inline-block;overflow:hidden;height:1.25em;line-height:1.25em;vertical-align:top}
.roll>span{display:block;transition:transform .65s var(--e)}
.roll>span::after{content:attr(data-t);display:block}
.btn:hover .roll>span,.circ:hover .roll>span{transform:translateY(-50%)}
.arr{display:inline-flex;transition:transform .6s var(--e)}
.btn:hover .arr,.circ:hover .arr{transform:translateX(5px)}
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;padding:150px 0 72px;overflow:hidden}
.hero__wave{position:absolute;left:0;right:0;top:8%;width:100%;height:64%;pointer-events:none;will-change:transform}
.hw{fill:none;stroke:var(--lima);stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.6s var(--e) .2s}
.is-in .hw{stroke-dashoffset:0}
.hw2{opacity:.3;transition-delay:.34s}.hw3{opacity:.1;transition-delay:.48s}
.hero__in{position:relative}
.hero__t{font-size:clamp(54px,10.6vw,172px);line-height:.9}
.hero__t em{font-style:normal;color:var(--lima)}
.hero__row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-top:52px;flex-wrap:wrap}
.hero__sub{font-size:clamp(17px,1.45vw,20px);line-height:1.55;color:var(--g1);max-width:460px}
.hero__ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero__meta{display:flex;gap:28px;font-size:12px;color:var(--g2);margin-bottom:32px;flex-wrap:wrap}
.live{display:inline-flex;align-items:center;gap:10px}
.live i{width:7px;height:7px;border-radius:50%;background:var(--lima);animation:ping 1.8s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(196,245,0,.55)}80%,100%{box-shadow:0 0 0 10px rgba(196,245,0,0)}}
.hero__scroll{position:absolute;right:clamp(20px,4vw,56px);top:50%;display:flex;flex-direction:column;align-items:center;gap:14px;font-size:11px;color:var(--g2);writing-mode:vertical-rl;letter-spacing:.2em;text-transform:uppercase}
.hero__scroll i{width:1.5px;height:64px;background:var(--line);position:relative;overflow:hidden}
.hero__scroll i::after{content:"";position:absolute;left:0;top:0;width:100%;height:40%;background:var(--lima);animation:sdrop 2s var(--e) infinite}
@keyframes sdrop{from{transform:translateY(-100%)}to{transform:translateY(260%)}}
.marq{background:var(--lima);color:var(--ink);overflow:hidden;padding:28px 0}
.marq__t{display:flex;width:max-content;will-change:transform}
.marq__i{display:flex;align-items:center;gap:40px;padding-right:40px;font-size:clamp(30px,3.6vw,56px);font-weight:600;letter-spacing:-.035em;white-space:nowrap}
.marq__i svg{width:.95em;overflow:visible;flex:none}
.mani{padding:clamp(130px,17vw,240px) 0}
.mani__p{font-size:clamp(32px,4.5vw,74px);font-weight:500;letter-spacing:-.04em;line-height:1.06;margin-top:44px;max-width:1200px;text-wrap:pretty}
.mani__p .w{opacity:.14}
.hl{background:linear-gradient(var(--lima),var(--lima)) 0 90%/0% 38% no-repeat;transition:background-size 1.1s var(--e)}
.hl.on{background-size:100% 38%}
.ph{position:relative;height:220vh;background:var(--bone)}
.ph__s{position:sticky;top:0;height:100vh;height:100svh;display:grid;place-items:center;overflow:hidden}
.ph__f{position:relative;width:100%;height:100%;overflow:hidden;background:#242424;clip-path:inset(var(--iy,18%) var(--ix,22%) round var(--r,28px));will-change:clip-path}
.ph__f .slot{position:absolute;inset:0;transform:scale(var(--sc,1.18));transform-origin:center;will-change:transform}
.ph__cap{position:absolute;left:0;right:0;bottom:0;padding:clamp(24px,4vw,56px);background:linear-gradient(transparent,rgba(26,26,26,.82));pointer-events:none;opacity:var(--co,0);transform:translate3d(0,calc((1 - var(--co,0)) * 30px),0)}
.eyebrow--lt{color:var(--g1)}
.ph__t{margin-top:18px;font-size:clamp(32px,4.6vw,76px);font-weight:600;letter-spacing:-.045em;line-height:.98;color:var(--bone)}
.gal{padding:clamp(90px,10vw,150px) 0}
.gal__g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,28px);align-items:start}
.gal__i{display:flex;flex-direction:column;gap:14px}
.gal__i--up{margin-top:clamp(40px,8vw,120px)}
.gal__i .mono{font-size:12px;color:#6b6b6b;letter-spacing:.08em;text-transform:uppercase}
.gal__img{position:relative;aspect-ratio:4/5;border-radius:20px;overflow:hidden;background:#e4e1d9}
.gal__img .slot{position:absolute;inset:0;transition:transform 1.2s var(--e)}
.gal__i:hover .gal__img .slot{transform:scale(1.04)}
@media(max-width:760px){.gal__g{grid-template-columns:1fr}.gal__i--up{margin-top:0}}
.met{position:relative;height:480vh;background:var(--ink)}
.met__s{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;gap:clamp(12px,3vh,40px);overflow:hidden;padding:84px 0 36px}
.met__s>.wrap{width:100%}
.met__head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;width:100%}
.met__h{font-size:clamp(32px,4.2vw,64px)}
.met__n{font-size:15px;color:var(--g2)}.met__n b{color:var(--lima);font-weight:500}
.met__stage{position:relative;width:min(100%,calc(42vh * 3.333));margin:0 auto}
.met__stage svg{width:100%;height:auto;overflow:visible}
.st circle{fill:var(--ink);stroke:#3d3d3d;stroke-width:4;transition:stroke .4s,fill .4s}
.st.done circle{stroke:var(--lima);fill:var(--lima)}
.st.alert circle{stroke:#ff3b30;fill:var(--ink)}
.st text{fill:#6b6b6b;font:600 15px Inter,sans-serif;letter-spacing:2.6px;transition:fill .4s}
.st.done text,.st.alert text{fill:var(--bone)}
#metDot{fill:var(--lima);transition:fill .3s}#metDot.alert{fill:#ff3b30}
.met__tag{position:absolute;transform:translate(-50%,calc(-100% - 34px));white-space:nowrap;font-size:12px;padding:9px 13px;border-radius:8px;background:#242424;border:1px solid var(--line);opacity:0;transition:opacity .4s,color .3s,border-color .3s;pointer-events:none}
.met__tag.on{opacity:1}
.met__tag.alert{color:#ff5a50;border-color:rgba(255,59,48,.45)}.met__tag.ok{color:var(--lima);border-color:rgba(196,245,0,.35)}
.met__copy{position:relative;height:clamp(120px,19vh,176px)}
.met__step{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:40px;align-items:start;opacity:0;transform:translate3d(0,26px,0);transition:opacity .6s var(--e),transform .7s var(--e);pointer-events:none}
.met__step.on{opacity:1;transform:none}
.met__i{font-size:13px;color:var(--lima)}
.met__step h3{font-size:clamp(40px,5.2vw,84px);margin-top:8px}
.met__step p{font-size:clamp(16px,1.35vw,19px);line-height:1.55;color:var(--g1);max-width:520px;padding-top:26px}
.met__bar{position:absolute;left:0;bottom:0;height:3px;background:var(--lima);width:0}
.vs{padding:clamp(120px,14vw,200px) 0}
.vs__top{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
.seg{position:relative;display:inline-flex;padding:5px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--lineD)}
.seg button{position:relative;z-index:1;height:48px;padding:0 26px;border:0;background:none;font:600 14px Inter,sans-serif;color:#6b6b6b;cursor:pointer;border-radius:999px;transition:color .4s}
.seg button.on{color:var(--ink)}
.seg__k{position:absolute;top:5px;bottom:5px;left:5px;width:0;border-radius:999px;background:var(--lima);transition:transform .7s var(--e),width .7s var(--e),background .4s}
.seg.c .seg__k{background:#e4e1d9}
.vs__line{width:100%;height:auto;margin:72px 0 28px;overflow:visible}
#vsPath{fill:none;stroke-width:7;stroke-linecap:round;stroke:var(--ink);transition:stroke .5s}
.vs.c #vsPath{stroke:#c9c7c0}
.vs__lbl{font:600 13px Inter,sans-serif;letter-spacing:2.4px;fill:#6b6b6b}
.vs__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--lineD)}
.vs__list li{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:24px;align-items:center;padding:26px 0;border-bottom:1px solid var(--lineD);font-size:clamp(20px,2.2vw,32px);font-weight:500;letter-spacing:-.025em;transition:opacity .4s var(--e),transform .6s var(--e)}
.vs__list li.out{opacity:0;transform:translate3d(0,16px,0)}
.vs__list .mono{font-size:13px;color:#6b6b6b;letter-spacing:.01em}
.vs.c .vs__list li>span:nth-child(2){color:#6b6b6b}
.mk{width:38px;height:38px;border-radius:50%;display:grid;place-items:center}
.mk.m{background:var(--lima);color:var(--ink)}.mk.c{box-shadow:inset 0 0 0 1.5px var(--lineD);color:#9a9a95}
.pil{padding:clamp(120px,14vw,200px) 0}
.pil__list{list-style:none;margin:72px 0 0;padding:0;border-top:1px solid var(--line)}
.pil__row{position:relative;display:grid;grid-template-columns:80px minmax(0,1.1fr) minmax(0,1fr) 56px;gap:28px;align-items:center;padding:36px 22px;border-bottom:1px solid var(--line);cursor:pointer;overflow:hidden;isolation:isolate;transition:color .5s var(--e),opacity 1s var(--e),transform 1s var(--e)}
.pil__row::before{content:"";position:absolute;inset:0;background:var(--lima);transform:scaleY(0);transform-origin:bottom;transition:transform .65s var(--e);z-index:-1}
.pil__row:hover{color:var(--ink)}.pil__row:hover::before{transform:scaleY(1)}
.pil__n{font-size:13px;color:var(--g2);transition:color .4s}
.pil__t{font-size:clamp(30px,4.2vw,64px);font-weight:600;letter-spacing:-.045em;line-height:1;transition:transform .7s var(--e)}
.pil__d{font-size:16px;line-height:1.55;color:var(--g1);transition:color .4s;max-width:440px}
.pil__a{justify-self:end;width:52px;height:52px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--line);display:grid;place-items:center;transition:transform .7s var(--e),background .4s,box-shadow .4s,color .4s}
.pil__row:hover .pil__t{transform:translateX(14px)}
.pil__row:hover .pil__d,.pil__row:hover .pil__n{color:var(--ink)}
.pil__row:hover .pil__a{background:var(--ink);box-shadow:none;color:var(--lima);transform:rotate(-45deg)}
.plat{padding:clamp(120px,14vw,200px) 0;background:#efece5;color:var(--ink)}
.plat .eyebrow{color:#6b6b6b}.plat .eyebrow i{background:var(--ink)}
.plat__g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(40px,6vw,100px);align-items:center}
.plat__lead{font-size:18px;line-height:1.55;color:#3d3d3d;max-width:480px;margin-top:28px}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:40px 28px;margin-top:56px}
.stat b{display:block;font-size:clamp(46px,5vw,82px);font-weight:600;letter-spacing:-.055em;line-height:1;font-variant-numeric:tabular-nums}
.stat span{display:block;font-size:14px;color:#3d3d3d;margin-top:12px;max-width:230px;line-height:1.45}
.tilt{perspective:1400px}
.dev{background:var(--ink);color:var(--bone);border-radius:28px;padding:28px;box-shadow:0 50px 90px -40px rgba(14,14,14,.55);transition:transform .9s var(--e);will-change:transform}
.dev__h{display:flex;align-items:center;justify-content:space-between;gap:12px}
.chip{font-size:12px;color:var(--lima);background:rgba(196,245,0,.08);padding:7px 12px;border-radius:8px}
.mini{width:100%;height:auto;margin:30px 0 10px;overflow:visible}
#miniLine{transition:stroke-dashoffset 1.1s var(--e)}
.ms{fill:var(--ink);stroke:#3d3d3d;stroke-width:6;transition:fill .4s,stroke .4s}
.ms.done{fill:var(--lima);stroke:var(--lima)}.ms.alert{fill:var(--ink);stroke:#ff3b30}
.dev__lbls{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--g2)}
.feed{list-style:none;margin:20px 0 0;padding:0;height:236px;overflow:hidden}
.feed li{display:grid;grid-template-columns:50px minmax(0,1fr) auto;gap:14px;align-items:center;padding:15px 0;border-top:1px solid var(--line);font-size:14px;animation:feedIn .8s var(--e)}
@keyframes feedIn{from{opacity:0;transform:translate3d(0,-18px,0)}to{opacity:1;transform:none}}
.feed .t{color:var(--g2);font-size:12px}
.tg{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.08);color:var(--g1)}
.tg.l{background:var(--lima);color:var(--ink)}.tg.r{background:rgba(255,59,48,.18);color:#ff6a61}
.dev__f{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:6px;padding-top:18px;border-top:1px solid var(--line);font-size:13px;color:var(--g1)}
.cta{position:relative;background:var(--lima);color:var(--ink);padding:clamp(130px,15vw,220px) 0 calc(clamp(130px,15vw,220px) + 18vw);overflow:hidden}
.cta__w{position:absolute;left:0;bottom:-2vw;width:200%;height:22vw;animation:drift 30s linear infinite;pointer-events:none;opacity:.9}
@keyframes drift{to{transform:translate3d(-50%,0,0)}}
.cta__g{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:flex-end;gap:48px;flex-wrap:wrap}
.cta__t{font-size:clamp(54px,9.2vw,156px);line-height:.9}
.cta__sub{font-size:19px;line-height:1.5;max-width:440px;margin-top:34px;color:var(--ink)}
.cta__wa{margin-top:22px;font-weight:600;font-size:15px}
.circ{width:clamp(156px,14vw,210px);aspect-ratio:1;border-radius:50%;background:var(--ink);color:var(--bone);display:flex;align-items:center;justify-content:center;gap:10px;font-weight:600;font-size:17px}
.circ:hover{color:var(--lima)}
.ft{background:#0e0e0e;color:var(--g1);padding:96px 0 36px;overflow:hidden}
.ft__g{display:grid;grid-template-columns:1.4fr repeat(2,1fr);gap:40px}
.ft h4{margin:0 0 18px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#6b6b6b}
.ft ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;font-size:14px}
.big{display:flex;justify-content:center;margin:110px 0 28px;font-family:Comfortaa,sans-serif;font-weight:300;font-size:clamp(84px,21.5vw,340px);letter-spacing:.04em;line-height:.8;color:var(--bone);user-select:none}
.big span{display:inline-block;transition:transform .8s var(--e),color .4s;transition-delay:calc(var(--i) * 45ms)}
.big:hover span{transform:translate3d(0,-9%,0)}
.big span:hover{color:var(--lima)}
.ft__b{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:#6b6b6b;padding-top:22px;border-top:1px solid var(--line)}
@media(max-width:960px){.nav__links,.nav__time,.hero__scroll{display:none}.met__step{grid-template-columns:1fr;gap:4px}.met__step p{padding-top:8px}.plat__g{grid-template-columns:1fr}.pil__row{grid-template-columns:44px minmax(0,1fr) 52px}.pil__d{display:none}.ft__g{grid-template-columns:1fr 1fr}.met__copy{height:200px}}
.rm *,.rm *::before,.rm *::after{transition:none!important;animation:none!important}
.rm .ln>span,.rm .reveal{transform:none;opacity:1}.rm .hw,.rm .loader path{stroke-dashoffset:0}

/* Bloque gráfico Flow: ocupa el lugar de la fotografía hasta que existan fotos reales de entregas. */
.slot{position:absolute;inset:0;display:grid;place-items:center;background:#1f1f1f}
.slot svg{width:min(22%,120px);height:auto;opacity:.9}
.slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}