body{margin:0;background:#F8F8F8}
a{color:#1D1D1D}a:hover{color:#7651E0}
.wrap{width:100%;max-width:1320px;margin:0 auto;padding:0 40px;box-sizing:border-box}
.g{color:#8F8F8F}
.on-dark .g{color:#7E7E7E}
.on-purple .g{color:#C8B9F3}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase}
.display{font-size:clamp(52px,8.6vw,132px);line-height:0.94;letter-spacing:-0.055em;font-weight:500;margin:0}
.h2{font-size:clamp(40px,5.4vw,80px);line-height:0.98;letter-spacing:-0.045em;font-weight:500;margin:0}
.statement{font-size:clamp(28px,3.4vw,50px);line-height:1.12;letter-spacing:-0.035em;font-weight:500;margin:0}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
.split-wide{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
.label-col{display:grid;grid-template-columns:minmax(0,0.32fr) minmax(0,1fr);gap:40px}
.row{display:grid;grid-template-columns:72px minmax(0,1.2fr) minmax(0,1fr) 48px;gap:24px;align-items:center;padding:30px 0;border-top:1px solid #CFCFCF;text-decoration:none;color:#4A4A4A;transition:padding 260ms cubic-bezier(.22,1,.36,1),background-color 260ms ease,color 260ms ease,border-radius 260ms ease}
.row:hover{background:#7651E0;color:#FFFFFF;padding-left:24px;padding-right:24px;border-radius:14px;border-top-color:transparent}
.row:hover + .row{border-top-color:transparent}
.row-desc{color:#7A7A7A}
.row:hover .row-desc{color:#FFFFFF}
.row:hover .row-arrow{transform:translate(4px,-4px)}
.row-arrow{transition:transform 260ms cubic-bezier(.22,1,.36,1)}
.circuit{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.circuit > div{border-left:1px solid rgba(255,255,255,0.22)}
.circuit > div:first-child{border-left:0}
.casos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.caso{display:flex;flex-direction:column;background:#FFFFFF;border:1px solid #E4E4E4;border-radius:14px;overflow:hidden;text-decoration:none;color:#1D1D1D;transition:border-color 220ms ease,transform 220ms cubic-bezier(.22,1,.36,1)}
.caso:hover{border-color:#7651E0;transform:translateY(-4px);box-shadow:0 18px 40px -24px rgba(83,57,157,0.45);color:#1D1D1D}
.caso-shot{aspect-ratio:16 / 9;overflow:hidden;background:#141220}
.caso-shot img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform 900ms cubic-bezier(.22,1,.36,1)}
.caso:hover .caso-shot img{transform:scale(1.04)}
.caso:hover .caso-ver{color:#53399D}
.comp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.comp > div{border-radius:18px}
.comp ul{list-style:none;margin:0;padding:0}
.comp li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:14px;padding:16px 0;border-top:1px solid;font-size:16px;line-height:1.5}
.method{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0}
.method > div{border-top:2px solid #1D1D1D;padding-top:20px}
.herr{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.herr-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;min-height:116px;padding:20px 10px;background:#FFFFFF;text-align:center;border:1px solid #E4E4E4;border-radius:12px;transition:border-color 220ms ease,transform 220ms cubic-bezier(.22,1,.36,1)}
.herr-item:hover{border-color:#9F85E9;transform:translateY(-2px)}
.herr-item img{height:30px;width:auto;max-width:76%;object-fit:contain;display:block;filter:grayscale(1);opacity:0.55;mix-blend-mode:multiply;transition:filter 250ms ease,opacity 250ms ease}
.herr-item:hover img{filter:none;opacity:1}
.herr-item span{font-size:13px;font-weight:600;color:#8A8A8A;transition:color 220ms ease}
.herr-item:hover span{color:#1D1D1D}
.agenda-grid{display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);gap:56px;align-items:start}
.agenda-list{list-style:none;margin:0;padding:0}
.agenda-list li{display:flex;gap:14px;padding:15px 0;border-top:1px solid rgba(255,255,255,0.28);font-size:16px;line-height:1.5}
.agenda-list li:last-child{border-bottom:1px solid rgba(255,255,255,0.28)}
.slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;width:max-content;animation:slide 42s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track ul{display:flex;align-items:center;gap:72px;list-style:none;margin:0;padding:0 36px}
.marquee-track img{height:38px;width:auto;max-width:170px;object-fit:contain;display:block;filter:grayscale(1);opacity:0.55;mix-blend-mode:multiply;transition:filter 250ms ease,opacity 250ms ease}
.marquee-track img:hover{filter:none;opacity:1}
@keyframes slide{to{transform:translateX(-50%)}}
.panel{margin:0 16px;border-radius:28px;overflow:hidden}
.cal-card{border-radius:14px;overflow:hidden}
.nav-links{display:flex;gap:32px;align-items:center}
.btn{display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:0 28px;border-radius:100px;background:#1D1D1D;color:#FFFFFF;text-decoration:none;font-size:16px;font-weight:600;transition:background-color 200ms ease}
.btn:hover{background:#7651E0;color:#FFFFFF}
.btn-sm{min-height:44px;padding:0 20px;font-size:15px}
.ulink{text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px;font-weight:600}
/* ---------- Animaciones de entrada y fondo violeta (las activa anim.js; sin JS no se aplica nada) ---------- */
.page,.site-header{transition:background-color 700ms ease,border-color 700ms ease}
.site-header a,.site-header img,.site-header .btn{transition:color 700ms ease,background-color 700ms ease,filter 700ms ease}
html.is-violet,html.is-violet body{background:#53399D}
html.is-violet .page{background:#53399D !important}
html.is-violet .site-header{background:rgba(83,57,157,0.88) !important;border-bottom-color:rgba(255,255,255,0.16) !important}
html.is-violet .site-header .nav-links a{color:#FFFFFF}
html.is-violet .site-header > .wrap > a img{filter:brightness(0) invert(1)}
html.is-violet .site-header .btn{background:#FFFFFF;color:#53399D}
#herramientas > .wrap{transition:opacity 700ms ease}
html.is-violet #herramientas > .wrap{opacity:0.2}
.js-anim:not(.anim-ready) h1.display,.js-anim:not(.anim-ready) .h2,.js-anim:not(.anim-ready) .statement{visibility:hidden}
.js-anim:not(.anim-ready) #inicio .split{opacity:0}
.js-anim.anim-safe:not(.anim-ready) #inicio .split{opacity:1}
.js-anim .w{display:inline-block;opacity:0.001;transform:translateY(20px);transition:opacity 900ms cubic-bezier(.44,0,.13,.96),transform 900ms cubic-bezier(.44,0,.13,.96);transition-delay:var(--d,0ms)}
.js-anim .in .w,.js-anim .w.in{opacity:1;transform:none}
.js-anim .rv{opacity:0;transform:translateY(40px) scale(0.96);transition:opacity 1000ms cubic-bezier(.23,1,.32,1),transform 1200ms cubic-bezier(.23,1,.32,1) !important;transition-delay:var(--d,0ms) !important}
.js-anim .rv.in{opacity:1;transform:none}
.js-anim.anim-safe:not(.anim-ready) h1.display,.js-anim.anim-safe:not(.anim-ready) .h2,.js-anim.anim-safe:not(.anim-ready) .statement{visibility:visible}
@media (prefers-reduced-motion: reduce){.page,.site-header,#herramientas > .wrap{transition:none}}
/* ---------- Formulario "Dejá tus datos" (popup) ---------- */
[hidden]{display:none !important}
html.modal-open{overflow:hidden}
.btn-light{background:#FFFFFF;color:#53399D}
.btn-light:hover{background:#C8B9F3;color:#53399D}
.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px;visibility:hidden;pointer-events:none;transition:visibility 0s linear 420ms}
.modal:target,.modal.is-open{visibility:visible;pointer-events:auto;transition-delay:0s}
.modal-bg{position:absolute;inset:0;background:rgba(20,18,32,0.58);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;transition:opacity 380ms ease}
.modal:target .modal-bg,.modal.is-open .modal-bg{opacity:1}
.modal-card{position:relative;width:100%;max-width:580px;max-height:calc(100vh - 48px);overflow:auto;background:#FFFFFF;border-radius:24px;box-shadow:0 40px 100px -30px rgba(20,18,32,0.6);opacity:0;transform:translateY(48px) scale(0.9) rotate(-1.5deg);transition:opacity 260ms ease,transform 420ms cubic-bezier(.4,0,.2,1)}
.modal:target .modal-card,.modal.is-open .modal-card{opacity:1;transform:none;transition:opacity 300ms ease,transform 640ms cubic-bezier(.34,1.56,.64,1)}
.modal-head{position:relative;overflow:hidden;padding:30px 32px 28px;color:#FFFFFF;background:#7651E0}
.modal-head::before{content:'';position:absolute;inset:-60%;background:radial-gradient(circle at 30% 40%,rgba(200,185,243,0.55),transparent 38%),radial-gradient(circle at 75% 70%,rgba(83,57,157,0.9),transparent 42%);animation:modal-glow 7s ease-in-out infinite alternate;pointer-events:none}
.modal-head > *{position:relative}
.modal-head h2{margin:10px 0 8px;font-size:30px;line-height:1.05;letter-spacing:-0.035em;font-weight:500}
.modal-head p{margin:0;font-size:15px;line-height:1.5;color:#EDE7FC;max-width:420px}
.modal-x{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,0.16);color:#FFFFFF;font-size:22px;line-height:1;cursor:pointer;display:grid;place-items:center;text-decoration:none;transition:background-color 200ms ease,transform 300ms cubic-bezier(.34,1.56,.64,1)}
.modal-x:hover{background:rgba(255,255,255,0.3);color:#FFFFFF;transform:rotate(90deg)}
.modal-body{padding:26px 32px 30px}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 14px}
.f{display:flex;flex-direction:column;gap:7px;min-width:0}
.f-full{grid-column:1 / -1}
.f label{font-size:13px;font-weight:600;color:#4A4A4A}
.f label small{font-weight:400;color:#8A8A8A}
.f input,.f select,.f textarea{width:100%;box-sizing:border-box;min-height:48px;padding:12px 14px;border:1px solid #E4E4E4;border-radius:12px;background:#FAFAFA;color:#1D1D1D;font:inherit;font-size:15px;transition:border-color 180ms ease,box-shadow 180ms ease,background-color 180ms ease;-webkit-appearance:none;appearance:none}
.f select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%237651E0' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
.f textarea{min-height:88px;resize:vertical}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:#7651E0;background:#FFFFFF;box-shadow:0 0 0 4px rgba(118,81,224,0.16)}
.f.is-error input,.f.is-error select{border-color:#C93C3C;background:#FFF8F8}
.f-msg{font-size:12px;color:#C93C3C;min-height:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.modal-legal{margin:18px 0 0;font-size:12px;line-height:1.5;color:#8A8A8A}
.modal-legal a{color:#7651E0}
.modal-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px;flex-wrap:wrap}
.modal-actions .btn{background:#7651E0;border:0;cursor:pointer;font:inherit;font-size:16px;font-weight:600}
.modal-actions .btn:hover{background:#53399D}
.modal-actions .btn[disabled]{opacity:0.6;cursor:progress}
.modal-alt{font-size:14px;color:#6E6E6E}
.modal-error{margin:16px 0 0;padding:12px 14px;border-radius:12px;background:#FFF1F1;color:#A12F2F;font-size:14px}
.modal.is-open .f,.modal:target .f{animation:f-in 520ms cubic-bezier(.22,1,.36,1) both;animation-delay:calc(160ms + var(--i,0) * 55ms)}
.lead-ok{padding:44px 32px 40px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}
.lead-ok h3{margin:6px 0 0;font-size:28px;letter-spacing:-0.03em;font-weight:500}
.lead-ok p{margin:0;max-width:380px;font-size:16px;line-height:1.55;color:#6E6E6E}
.lead-ok svg circle{stroke-dasharray:180;stroke-dashoffset:180;animation:draw 700ms cubic-bezier(.22,1,.36,1) 100ms forwards}
.lead-ok svg path{stroke-dasharray:40;stroke-dashoffset:40;animation:draw 420ms ease-out 650ms forwards}
@keyframes f-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes modal-glow{0%{transform:translate(0,0) rotate(0)}100%{transform:translate(8%,-6%) rotate(25deg)}}
@keyframes draw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion: reduce){.modal-card,.modal-bg{transition:none}.modal-head::before,.modal .f,.lead-ok svg circle,.lead-ok svg path{animation:none}.lead-ok svg circle,.lead-ok svg path{stroke-dashoffset:0}}
@media (max-width: 600px){
.modal{padding:0;place-items:end stretch}
.modal-card{max-width:none;max-height:92vh;border-radius:22px 22px 0 0;transform:translateY(100%)}
.modal:target .modal-card,.modal.is-open .modal-card{transition:opacity 200ms ease,transform 560ms cubic-bezier(.22,1.2,.36,1)}
.modal-head{padding:26px 22px 22px}
.modal-head h2{font-size:26px}
.modal-body{padding:22px 22px 28px}
.fgrid{grid-template-columns:1fr}
.modal-actions .btn{width:100%;justify-content:center}
}
.cal-embed{width:100%;min-height:600px;overflow:auto}
.cal-placeholder{min-height:600px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;font-size:15px;color:#7A7A7A;background:repeating-linear-gradient(0deg,#FFFFFF 0 71px,#F1EEF9 71px 72px)}
/* ---------- WhatsApp flotante ---------- */
.wa{position:fixed;right:24px;bottom:24px;z-index:50;display:flex;flex-direction:column;align-items:flex-end;gap:14px;font-family:'Satoshi','Manrope','Helvetica Neue',system-ui,sans-serif}
.wa-btn{position:relative;width:62px;height:62px;border-radius:50%;background:#25D366;color:#FFFFFF;display:grid;place-items:center;box-shadow:0 14px 30px -10px rgba(0,0,0,0.45);transition:transform 220ms cubic-bezier(.22,1,.36,1),box-shadow 220ms ease}
.wa-btn:hover{color:#FFFFFF;transform:scale(1.07);box-shadow:0 18px 36px -10px rgba(0,0,0,0.5)}
.wa-btn::before,.wa-btn::after{content:'';position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;animation:wa-ring 2.8s cubic-bezier(.22,1,.36,1) infinite;pointer-events:none}
.wa-btn::after{animation-delay:1.4s}
.wa-btn svg{width:32px;height:32px;animation:wa-nudge 900ms ease-in-out 3.3s 2}
.wa-bubble{position:relative;max-width:272px;background:#FFFFFF;color:#1D1D1D;border:1px solid #E4E4E4;border-radius:18px 18px 4px 18px;box-shadow:0 24px 48px -22px rgba(29,29,29,0.4);opacity:0;transform:translateY(12px) scale(0.94);transform-origin:bottom right;animation:wa-in 520ms cubic-bezier(.22,1,.36,1) 3s forwards}
.wa-bubble.is-hidden{display:none}
.wa-bubble a{display:block;padding:16px 44px 16px 18px;text-decoration:none;color:#1D1D1D}
.wa-bubble a:hover{color:#1D1D1D}
.wa-bubble strong{display:block;font-size:15px;font-weight:600;letter-spacing:-0.01em;margin-bottom:4px}
.wa-bubble span{display:block;font-size:14px;line-height:1.45;color:#6E6E6E}
.wa-bubble em{display:inline-block;margin-top:10px;font-style:normal;font-size:13px;font-weight:600;color:#1DA851}
.wa-close{position:absolute;top:8px;right:8px;width:28px;height:28px;border:0;border-radius:50%;background:transparent;color:#8A8A8A;font-size:18px;line-height:1;cursor:pointer;display:grid;place-items:center}
.wa-close:hover{background:#F2F2F2;color:#1D1D1D}
@keyframes wa-ring{0%{transform:scale(1);opacity:0.75}100%{transform:scale(1.75);opacity:0}}
@keyframes wa-in{to{opacity:1;transform:none}}
@keyframes wa-nudge{0%,100%{transform:rotate(0)}20%{transform:rotate(-14deg)}40%{transform:rotate(11deg)}60%{transform:rotate(-7deg)}80%{transform:rotate(4deg)}}
@media (prefers-reduced-motion: reduce){.wa-btn::before,.wa-btn::after,.wa-btn svg{animation:none}.wa-bubble{animation:none;opacity:1;transform:none}}
@media (max-width: 600px){.wa{right:14px;bottom:14px}.wa-btn{width:56px;height:56px}.wa-bubble{max-width:224px;animation-delay:8s}.wa-btn svg{animation-delay:8.3s}}
@media (prefers-reduced-motion: reduce){.marquee-track{animation:none}}
@media (max-width: 1080px){.herr{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width: 980px){
.split,.split-wide,.label-col,.casos,.comp,.agenda-grid{grid-template-columns:1fr}
.circuit{grid-template-columns:repeat(2,minmax(0,1fr))}
.circuit > div:nth-child(odd){border-left:0}
.circuit > div:nth-child(n+3){border-top:1px solid rgba(255,255,255,0.22);padding-top:28px !important}
.circuit{row-gap:28px}
.method{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}
.herr{grid-template-columns:repeat(3,minmax(0,1fr))}
.row{grid-template-columns:48px minmax(0,1fr) 40px}
.row-desc{display:none}
.nav-links{display:none}
}
@media (max-width: 600px){
.wrap{padding:0 18px}
.panel{margin:0 8px;border-radius:20px}
#agenda.panel{margin-bottom:8px}
.circuit,.method{grid-template-columns:1fr}
.herr{grid-template-columns:repeat(2,minmax(0,1fr))}
.circuit > div{border-left:0;border-top:1px solid rgba(255,255,255,0.22);padding:28px 0 !important}
.circuit > div:first-child{border-top:0}
.marquee-track ul{gap:44px}
.marquee-track img{height:30px}
}
/* ---------- Celular: carruseles y tarjetas apiladas ---------- */
.herr-dup{display:none}
.casos-dots{display:none}
@keyframes herr-slide{to{transform:translateX(-50%)}}
@media (max-width: 600px){
/* Trabajos: carrusel con autoplay (mobile.js) y arrastre con el dedo */
.casos{position:relative;display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 -18px;padding:4px 18px 10px;scroll-padding:0 18px}
.casos::-webkit-scrollbar{display:none}
.caso{flex:0 0 86%;scroll-snap-align:start}
.caso:hover{transform:none}
.casos-dots{display:flex;justify-content:center;gap:8px;margin-top:-36px}
.casos-dots span{width:7px;height:7px;border-radius:4px;background:#D4D4D4;transition:width 300ms ease,background-color 300ms ease}
.casos-dots span.on{width:22px;background:#7651E0}
/* Comparativa: la tarjeta de Betta sube y tapa a la otra al hacer scroll */
.comp{display:flex;flex-direction:column;gap:0}
.comp > div{position:sticky;top:90px}
.comp > div:last-child{top:106px;margin-top:32px;z-index:1;box-shadow:0 -18px 40px -18px rgba(20,18,32,0.35)}
/* Cómo trabajamos: los 5 pasos en una sola línea deslizable */
#metodo .circuit{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 -18px;padding:0 18px;scroll-padding:0 18px}
#metodo .circuit::-webkit-scrollbar{display:none}
#metodo .circuit > div{flex:0 0 68%;scroll-snap-align:start;border-top:0 !important;border-left:1px solid rgba(255,255,255,0.22) !important;padding:4px 20px !important;gap:28px}
#metodo .circuit > div:first-child{border-left:0 !important;padding-left:0 !important}
#metodo .circuit > div:last-child{scroll-snap-align:end}
/* Herramientas: una fila por grupo, girando sola */
.herr-row{overflow:hidden;margin:0 -18px;padding:0 18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.herr{display:flex;width:max-content;gap:10px;padding-right:10px;animation:herr-slide 26s linear infinite}
.herr-row:nth-of-type(odd) .herr{animation-direction:reverse}
.herr-row:active .herr{animation-play-state:paused}
.herr-item{flex:0 0 126px;min-height:100px}
.herr-dup{display:flex}
}
@media (max-width: 600px) and (prefers-reduced-motion: reduce){.herr{animation:none;flex-wrap:wrap;width:auto}.herr-dup{display:none}}

html{scroll-behavior:smooth}
section[id]{scroll-margin-top:84px}
img{max-width:100%}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}