:root{--gx:48px}
@media(max-width:900px){:root{--gx:28px}}
@media(max-width:620px){:root{--gx:20px}}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;font-family:'Roboto',sans-serif;color:#000;background:#fff;-webkit-text-size-adjust:100%}
img{max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
input,select,textarea{font-family:inherit}
:focus-visible{outline:2px solid #29a9e1;outline-offset:2px}

/* nav */
.site-nav{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #e6e6e6}
.site-nav-in{max-width:1440px;margin:0 auto;padding:18px var(--gx);display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand img{height:34px;width:auto;display:block}
.site-links{display:flex;align-items:center;gap:28px}
.site-links a{font-size:15px;color:#000}
.site-links a.on{color:#00c9af;font-weight:500}
.site-links a.cta{background:#00c9af;color:#fff;padding:11px 22px;border-radius:100px;font-size:14px;font-weight:500}
.burger{display:none;width:44px;height:44px;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.burger span{display:block;width:22px;height:2px;background:#000}
/* dropdown Herramientas */
.dd{position:relative}
.dd-btn{font:inherit;font-size:15px;color:#000;background:none;border:0;padding:8px 0;cursor:pointer;display:inline-flex;align-items:center;gap:7px}
.dd.on .dd-btn{color:#00c9af;font-weight:500}
.dd-menu{display:none;position:absolute;top:100%;left:-16px;min-width:240px;background:#fff;border:1px solid #e6e6e6;border-radius:12px;box-shadow:0 12px 28px rgba(0,0,0,.10);padding:8px;z-index:60}
.dd-menu a{display:block;padding:11px 14px;border-radius:8px;font-size:15px;white-space:nowrap}
.dd-menu a:hover{background:#f4f4f4}
.dd:hover .dd-menu,.dd.open .dd-menu,.dd:focus-within .dd-menu{display:block}
@media(max-width:1100px){
  .dd-btn{width:100%;justify-content:space-between;padding:16px var(--gx);border-top:1px solid #f0f0f0;font-size:16px}
  .dd-menu{display:block;position:static;border:0;box-shadow:none;border-radius:0;padding:0;min-width:0}
  .dd-menu a{padding:14px var(--gx) 14px calc(var(--gx) + 18px);border-top:1px solid #f0f0f0;border-radius:0;font-size:15px;color:#333}
  .dd-btn svg{display:none}
}
@media(max-width:1100px){
  .site-nav-in{padding:10px var(--gx)}
  .burger{display:flex}
  .site-links{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;border-bottom:1px solid #e6e6e6;box-shadow:0 12px 24px rgba(0,0,0,.08)}
  .site-nav.open .site-links{display:flex}
  .site-links a{padding:16px var(--gx);border-top:1px solid #f0f0f0;font-size:16px}
  .site-links a.cta{margin:14px var(--gx);padding:14px 22px;text-align:center;border-top:none}
}

/* footer */
.site-footer{border-top:1px solid #e6e6e6;background:#fff}
.site-footer-in{max-width:1440px;margin:0 auto;padding:32px var(--gx);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px}
.f-brand{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.f-brand img{height:26px;width:auto}
.f-brand span{font-family:'Roboto Mono',monospace;font-size:13px;color:#666}
.f-links{display:flex;flex-wrap:wrap;gap:12px 24px}
.f-links a{font-size:13px;color:#666}

/* filtros / chips */
.chip{padding:11px 22px;border-radius:100px;font-size:14px;font-weight:500;background:#f7f7f7;color:#000}
.chip[aria-pressed="true"]{background:#00c9af;color:#fff}
.case-card[hidden]{display:none!important}

/* ===== responsive sobre estilos inline ===== */
img{height:auto}
@media(max-width:1000px){
  [style*="grid-template-columns:repeat(3,minmax(0,1fr))"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="grid-template-columns:repeat(4,minmax(0,1fr))"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:760px){
  [style*="grid-template-columns:repeat(3,minmax(0,1fr))"],
  [style*="grid-template-columns:repeat(2,minmax(0,1fr))"],
  [style*="grid-template-columns:repeat(4,minmax(0,1fr))"]{grid-template-columns:minmax(0,1fr)!important}
  [style*="padding:96px var(--gx)"],[style*="padding:88px var(--gx)"],[style*="padding:80px var(--gx)"],[style*="padding:72px var(--gx)"]{padding-top:56px!important;padding-bottom:56px!important}
  [style*="padding:64px var(--gx)"]{padding-top:44px!important;padding-bottom:44px!important}
  [style*="font-size:64px"]{font-size:38px!important}
  [style*="font-size:58px"]{font-size:34px!important}
  [style*="font-size:48px"]{font-size:32px!important}
  [style*="font-size:44px"]{font-size:28px!important}
  [style*="font-size:40px"]{font-size:28px!important}
  [style*="font-size:34px"]{font-size:26px!important}
  [style*="font-size:32px"]{font-size:23px!important}
  [style*="font-size:28px"]{font-size:23px!important}
  [style*="font-size:26px"]{font-size:21px!important}
  [style*="font-size:24px"]{font-size:20px!important}
  [style*="font-size:22px"]{font-size:19px!important}
  [style*="gap:72px"]{gap:28px!important;flex-direction:column!important}
  [style*="flex:0 0 360px"]{flex:none!important;width:min(260px,70%)!important}
  [style*="padding:96px 64px"]{padding:48px var(--gx)!important}
  [style*="min-height:560px"]{flex-direction:column!important;align-items:flex-start!important}
  img[alt="movimiento-white"]{width:100%!important;height:auto!important;max-height:340px;object-fit:cover}
  img[style*="width:318px"]{width:min(318px,100%)!important}
  [style*="grid-template-columns:120px 28px minmax(0,1fr)"]{grid-template-columns:76px 22px minmax(0,1fr)!important;column-gap:4px!important}
  [style*="justify-content:space-between"]{flex-wrap:wrap}
  [style*="padding-top:18px"][style*="font-size:24px"]{display:none!important}
  [style*="height:340px"]{height:220px!important}
  [style*="height:300px"]{height:200px!important}
  [style*="padding:44px"]{padding:28px 22px!important}
  [style*="padding:40px"]{padding:26px 20px!important}
}

/* proceso animado: se dispara al entrar en pantalla */
.proc{overflow:visible}
.proc .ln{stroke-dasharray:1}
.proc .dt{transform-box:fill-box;transform-origin:center}
.proc.pre .ln{stroke-dashoffset:1}
.proc.pre .dt{opacity:0}
.proc.go .ln{animation:pl-line-once 2.6s ease-in-out both}
.proc.go .dt{animation:pl-drop-once 1.15s cubic-bezier(.3,0,.6,1) both;animation-delay:calc(var(--i)*0.42s + 0.15s)}
@keyframes pl-line-once{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes pl-drop-once{0%{transform:translateY(-520px);opacity:0}8%{opacity:1}55%{transform:translateY(0)}72%{transform:translateY(-30px)}88%{transform:translateY(0)}94%{transform:translateY(-8px)}100%{transform:translateY(0);opacity:1}}
@media (prefers-reduced-motion:reduce){.proc.pre .ln{stroke-dashoffset:0}.proc.pre .dt{opacity:1}.proc.go .ln,.proc.go .dt{animation:none}}
@media(max-width:760px){.proc{flex:0 0 auto!important;width:min(300px,70vw)!important;margin:0 auto}}

/* metodología secuencial */
.mt.pre .mt-step,.mt.pre .mt-arr{opacity:0}
.mt.go .mt-step{animation:mt-in 0.8s ease-out both;animation-delay:calc((var(--i) - 1)*0.9s)}
.mt.go .mt-arr{animation:mt-arr 0.6s ease-out both;animation-delay:calc((var(--i) - 1)*0.9s + 0.5s)}
.mt.go .mt-c{animation:mt-pop 1.4s ease-out both;animation-delay:calc((var(--i) - 1)*0.9s)}
@keyframes mt-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes mt-arr{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:translateX(0)}}
@keyframes mt-pop{0%{transform:scale(.4);box-shadow:0 0 0 0 rgba(255,255,255,.8)}35%{transform:scale(1.18)}55%{transform:scale(1)}100%{transform:scale(1);box-shadow:0 0 0 18px rgba(255,255,255,0)}}
@media (prefers-reduced-motion:reduce){.mt.pre .mt-step,.mt.pre .mt-arr{opacity:1}.mt.go .mt-step,.mt.go .mt-arr,.mt.go .mt-c{animation:none}}
@media(max-width:760px){.mt-arr{display:none}}
/* selector de idioma ES | EN (fuera del menú: siempre visible, también en mobile) */
.lang{display:inline-flex;align-items:center;border:1px solid #d4d4d4;border-radius:100px;overflow:hidden;font-family:'Roboto Mono',monospace;flex:0 0 auto}
.lang a{padding:7px 11px;font-size:12px;line-height:1;color:#555;letter-spacing:.04em}
.lang a.on{background:#000;color:#fff;font-weight:500}
.lang a:not(.on):hover{background:#efefef}
@media(max-width:1100px){
  .brand{margin-right:auto}
  .lang{order:2}
  .burger{order:3;margin-left:-4px}
  .lang a{padding:9px 13px;font-size:12px}
  .site-nav-in{gap:10px}
}
/* hero: la grilla animada se achica en tablet para no desbordar */
@media(max-width:1250px){
  div:has(>img[width="800"][height="840"])>div:first-child{flex:1 1 0;min-width:0;padding-left:40px;padding-right:24px}
  img[width="800"][height="840"]{width:auto!important;height:auto!important;flex:0 1 460px;min-width:0;object-fit:contain!important}
}
/* "Logramos reducciones": texto fluido en tablet */
@media(max-width:1100px){
  svg.proc{flex-basis:230px!important;width:230px!important}
  svg.proc+div{min-width:0}
  svg.proc+div b,svg.proc+div>div{overflow-wrap:anywhere}
  svg.proc+div p:not(:last-child){font-size:clamp(36px,6.4vw,64px)!important}
  svg.proc+div p:last-child,svg.proc+div>div{font-size:clamp(22px,3.6vw,40px)!important}
}
@media(max-width:700px){div[style*="height:278px"]{height:auto!important;min-height:0!important}}
