/* Navbar compartido: editar aquí para todas las páginas. */
body header.cck-navbar{box-sizing:border-box!important;position:relative!important;inset:auto!important;z-index:50!important;display:grid!important;grid-template-columns:237px minmax(0,1fr) auto!important;align-items:center!important;gap:28px!important;width:100%!important;max-width:none!important;height:auto!important;min-height:0!important;margin:0!important;padding:38px 5%!important;background:transparent!important;transform:none!important;font-family:Arial,Helvetica,sans-serif!important;color:#fff!important}
body header.cck-navbar *,body header.cck-navbar *::before,body header.cck-navbar *::after{box-sizing:border-box!important}
body header.cck-navbar .brand{position:relative!important;inset:auto!important;display:block!important;width:237px!important;max-width:none!important;height:auto!important;margin:0!important;padding:0!important;transform:none!important}
body header.cck-navbar .brand img{display:block!important;width:100%!important;height:auto!important;max-width:100%!important;object-fit:contain!important}
body header.cck-navbar #navigation{position:static!important;inset:auto!important;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:center!important;justify-self:center!important;order:0!important;gap:24px!important;width:max-content!important;max-width:100%!important;height:62px!important;min-height:0!important;margin:0!important;padding:0 30px!important;border:1px solid #ffffff40!important;border-radius:999px!important;background:#ffffff15!important;box-shadow:none!important;transform:none!important;opacity:1!important;visibility:visible!important;overflow:visible!important;backdrop-filter:blur(10px)!important}
body header.cck-navbar #navigation a,body header.cck-navbar .header-contact{display:inline-flex!important;align-items:center!important;justify-content:center!important;position:relative!important;inset:auto!important;width:auto!important;min-width:0!important;height:auto!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;font-family:Arial,Helvetica,sans-serif!important;font-size:14px!important;font-weight:600!important;line-height:20px!important;letter-spacing:normal!important;text-transform:none!important;color:#fff!important;white-space:nowrap!important;text-decoration:none!important;transform:none!important;opacity:1!important}
body header.cck-navbar #navigation a::before,body header.cck-navbar #navigation a::after{display:none!important}
body header.cck-navbar #navigation a[aria-current="page"],body header.cck-navbar #navigation a:hover{background:transparent!important;text-decoration:underline!important;text-underline-offset:6px!important;text-decoration-thickness:1px!important}
body header.cck-navbar .header-contact{height:62px!important;padding:0 25px!important;border:1px solid #ffffff!important;border-radius:999px!important;background:#ff9600!important;box-shadow:0 4px 16px #ff960066!important;justify-self:end!important;backdrop-filter:none!important}
body header.cck-navbar .header-contact:hover{background:#ffa826!important}
/* Per-page accent: on backgrounds where orange doesn't pop (orange hero, dark LAB hero), switch to vivid blue instead. */
body.centro-page header.cck-navbar .header-contact,
body.page-lab header.cck-navbar .header-contact{border-color:#ffffff!important;background:#087cff!important;box-shadow:0 4px 16px #087cff66!important}
body.centro-page header.cck-navbar .header-contact:hover,
body.page-lab header.cck-navbar .header-contact:hover{background:#2f95ff!important}
body header.cck-navbar .menu-toggle{position:relative!important;inset:auto!important;transform:none!important;display:none!important}
body header.cck-navbar a:focus-visible,body header.cck-navbar button:focus-visible{outline:3px solid #9eefff!important;outline-offset:5px!important}
@media(max-width:1279px){
body header.cck-navbar{grid-template-columns:200px 1fr auto!important;padding:26px 5%!important;gap:16px!important}
body header.cck-navbar .brand{width:200px!important}
body header.cck-navbar .menu-toggle{display:grid!important;place-items:center!important;justify-self:end!important;width:46px!important;height:46px!important;margin:0!important;padding:10px!important;border:1px solid #ffffff60!important;border-radius:50%!important;background:#ffffff18!important;color:#fff!important;cursor:pointer!important}
body header.cck-navbar .menu-toggle-icon{display:block!important;width:24px!important;height:24px!important}
body header.cck-navbar .header-contact{height:46px!important;padding:0 20px!important}
body header.cck-navbar #navigation{display:none!important;justify-self:stretch!important;position:absolute!important;top:calc(100% - 10px)!important;left:5%!important;right:5%!important;width:auto!important;max-width:none!important;height:auto!important;max-height:calc(100dvh - 115px)!important;overflow:auto!important;border-radius:24px!important;padding:20px!important;background:#087cfff5!important;gap:4px!important;box-shadow:0 12px 30px #0002!important;backdrop-filter:blur(16px)!important}
body header.cck-navbar #navigation.open{display:flex!important;flex-direction:column!important;align-items:stretch!important}
body header.cck-navbar #navigation a{justify-content:flex-start!important;width:100%!important;min-height:44px!important;padding:10px 14px!important;font-size:16px!important;line-height:24px!important}
}
@media(max-width:480px){body header.cck-navbar{grid-template-columns:145px 1fr auto!important;padding:22px 5%!important;gap:10px!important}body header.cck-navbar .brand{width:145px!important}body header.cck-navbar .header-contact{padding:0 13px!important}body header.cck-navbar .menu-toggle{width:42px!important;height:42px!important;padding:8px!important}}

/* Shared carousel navigation. */
.carousel-arrows{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:24px}
body .carousel-arrow{display:inline-flex;align-items:center;justify-content:center;flex:0 0 40px;width:40px;height:40px;padding:0;border:1px solid color-mix(in srgb,currentColor 35%,transparent);border-radius:50%;background:transparent;color:#ff4036;cursor:pointer;transition:background .2s,border-color .2s}
body .carousel-arrow svg{display:block;width:18px;height:18px;flex:none}
body .carousel-arrow:hover:not(:disabled){background:color-mix(in srgb,currentColor 10%,transparent);border-color:currentColor}
body .carousel-arrow:disabled{opacity:.3;cursor:default}
.awards .carousel-arrow{color:inherit}
body .team-controls .carousel-arrow{color:#fff;border-color:#fff8}
body .team-controls .carousel-arrow:hover{background:#ffffff26;border-color:#fff}
body .lab-team-controls .carousel-arrow{color:var(--lab-blue)}
.team-progress,.lab-team-progress{display:block}
.service-controls{justify-content:center!important;padding:16px 0 0!important}
.service-controls .carousel-arrows{margin:0}
.page-hablemos .conversation-card .conversation-label{font-size:.9rem;letter-spacing:.09em;font-weight:700;line-height:1.5;text-transform:uppercase;color:#999;margin:0 0 22px}
.office-email{overflow-wrap:anywhere;font-size:clamp(12px,1.15vw,17px)}
@media(prefers-reduced-motion:reduce){body .carousel-arrow{transition:none}}

/* Reference navigation: arrows at both ends of a full-length progress rail. */
body .carousel-rail-controls{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:25px}
body .carousel-arrows.carousel-rail-controls{width:100%}
body .library-controls.carousel-rail-controls{position:static;width:100%;margin:24px 0 0}
body .carousel-rail{display:block;height:4px;min-width:0;flex:1;background:color-mix(in srgb,currentColor 25%,transparent);overflow:hidden}
body .carousel-rail>span{display:block;width:25%;height:100%;background:currentColor;transform:translateX(0)}
body .carousel-rail-controls{color:#ff4036}
body .team-controls.carousel-rail-controls{color:#fff}
body .lab-team-controls.carousel-rail-controls{color:var(--lab-blue)}
body .awards .carousel-rail-controls{color:inherit}
body .carousel-rail-controls .carousel-arrow{color:inherit}
@media(max-width:640px){body .carousel-rail-controls{gap:16px}}

/* Vertical card navigation: directional controls without progress rail. */
body .vertical-carousel-controls{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:auto}
body .vertical-carousel-controls .carousel-arrow{border:0;border-radius:8px;background:transparent;color:#ff4036;width:44px;height:36px;flex:0 0 36px}
body .vertical-carousel-controls .carousel-arrow svg{width:24px;height:24px}
body .vertical-carousel-controls .carousel-arrow:hover:not(:disabled){background:#ff403610}
body .library-controls.vertical-carousel-controls{position:absolute;top:0;right:-64px;margin:0}
@media(max-width:1100px){body .library-controls.vertical-carousel-controls{right:-48px}}
@media(max-width:900px){body .library-controls.vertical-carousel-controls{position:static;margin:20px auto 0}}

/* Mobile artwork and footer: keep circles round and use the LAB footer layout. */
@media(max-width:640px){
  body:not(.page-lab) .hero .hero-lines{
    width:180%;height:auto;aspect-ratio:1440/750;
    top:50%;bottom:auto;left:-40%;right:auto;inset-inline-start:-40%;
    transform:translateY(-50%);
  }
  body:not(.page-lab) :is(.services-hero,.casos-hero,.centro-hero) .hero-lines{
    width:46%;height:auto;aspect-ratio:540/750;
    top:auto;bottom:0;left:auto;right:0;inset-inline-start:auto;
    transform:none;opacity:.8;
  }
  body:not(.page-lab) :is(.somos-hero,.hablemos-hero) .somos-hero-flow{
    width:46%;height:auto;aspect-ratio:540/750;
    top:auto;bottom:0;left:auto;right:0;transform:none;opacity:.8;
  }
  body:not(.page-lab) .about-scroll .about-lines{
    width:100%;height:auto;aspect-ratio:1040/760;top:auto;bottom:0;left:0;
  }
  body:not(.page-lab) footer.cck-footer .footer-links{
    display:flex;flex-direction:row;flex-wrap:wrap;align-items:normal;
    justify-content:flex-start;width:100%;height:auto;max-width:none;
    inset:auto;transform:none;gap:12px 28px;margin:0;padding:0;font-size:14px;
  }
  body:not(.page-lab) footer.cck-footer .footer-links a{width:auto;flex:0 0 auto}
  body:not(.page-lab) footer.cck-footer .footer-bottom{
    flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;
    gap:18px;font-size:16px;
  }
  body:not(.page-lab) footer.cck-footer>.footer-flow-right{
    top:50px;right:0;bottom:auto;left:auto;width:90px;height:auto;aspect-ratio:100/120;
  }
}

@media(max-width:640px){
 body:not(.page-lab) :is(.services-hero,.casos-hero,.centro-hero) .hero-lines,
 body:not(.page-lab) :is(.somos-hero,.hablemos-hero) .somos-hero-flow{aspect-ratio:auto}
 .page-hablemos .conversation-card>div{order:1}
 .page-hablemos .conversation-card>.conversation-image{order:2;justify-self:center;margin-top:10px}
}
@media(max-width:640px){
 body:not(.page-lab) :is(.services-hero,.casos-hero,.centro-hero) .hero-lines,
 body:not(.page-lab) :is(.somos-hero,.hablemos-hero) .somos-hero-flow{
  mask-image:linear-gradient(to bottom,transparent,#000 18px);
 }
}

/* Keep the awards arc visible below the preceding rounded panel on phones. */
@media(max-width:640px){
 .casos-page .awards-flow{width:200%;height:auto;left:-50%;top:20px}
}

/* Shared dropdown navigation and faster client marquees. */
.clients .client-list{animation-duration:140s}
body header.cck-navbar #navigation .nav-dropdown{position:relative;display:flex;align-items:center;gap:4px;flex:none}
body header.cck-navbar #navigation .nav-submenu-toggle{display:grid;place-items:center;flex:none;width:18px;height:28px;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;border-radius:6px}
body header.cck-navbar #navigation .nav-submenu-toggle svg{width:16px;height:16px;transition:transform .2s}
body header.cck-navbar #navigation .is-open>.nav-submenu-toggle svg{transform:rotate(180deg)}
body header.cck-navbar #navigation .nav-submenu{position:absolute;top:100%;left:-18px;z-index:60;display:flex;flex-direction:column;gap:2px;width:340px;margin:0;padding:14px 8px;background:#fff;border:1px solid #e2e9f2;border-radius:16px;box-shadow:0 12px 35px #05284c26}
body header.cck-navbar #navigation .nav-submenu[hidden]{display:none!important}
body header.cck-navbar #navigation .nav-submenu a{display:flex!important;justify-content:flex-start!important;white-space:normal!important;line-height:1.35!important;color:#202020!important;padding:12px 14px!important;width:100%!important;border-radius:9px!important;font-size:14px!important;font-weight:500!important}
body header.cck-navbar #navigation .nav-submenu a:hover,body header.cck-navbar #navigation .nav-submenu a:focus-visible{background:#edf6ff!important;color:#087cff!important;text-decoration:none!important}
body header.cck-navbar #navigation .nav-submenu a[aria-current=page]{color:#087cff!important}
@media(max-width:1279px){
 body header.cck-navbar #navigation .nav-dropdown{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:0;width:100%}
 body header.cck-navbar #navigation .nav-submenu-toggle{width:44px;height:44px;color:#fff}
 body header.cck-navbar #navigation .nav-submenu{position:static;grid-column:1/-1;width:100%;padding:5px 8px;margin:0 0 8px;box-shadow:none;border-color:#ffffff30;background:#ffffff12;border-radius:12px}
 body header.cck-navbar #navigation .nav-submenu a{min-height:44px!important;font-size:14px!important;color:#fff!important}
 body header.cck-navbar #navigation .nav-submenu a:hover,body header.cck-navbar #navigation .nav-submenu a:focus-visible{background:#ffffff20!important;color:#fff!important}
 body header.cck-navbar #navigation .nav-submenu a[aria-current=page]{color:#c3f7ff!important}
}
@media(prefers-reduced-motion:reduce){body header.cck-navbar #navigation .nav-submenu-toggle svg{transition:none}}

/* Servicios y Centro de ideas: submenús y menú móvil con el color del hero (variable puesta por navbar-dropdowns.js). */
body header.cck-navbar.nav-hero-tinted #navigation .nav-submenu{background:var(--nav-hero);border-color:#ffffff40;box-shadow:0 14px 35px #0000002e}
body header.cck-navbar.nav-hero-tinted #navigation .nav-submenu a{color:#fff!important}
body header.cck-navbar.nav-hero-tinted #navigation .nav-submenu a:hover,body header.cck-navbar.nav-hero-tinted #navigation .nav-submenu a:focus-visible{background:#ffffff26!important;color:#fff!important}
body header.cck-navbar.nav-hero-tinted #navigation .nav-submenu a[aria-current=page]{color:#fff!important;background:#ffffff1f!important;text-decoration:underline!important;text-underline-offset:5px!important}
@media(max-width:1279px){
 body header.cck-navbar.nav-hero-tinted #navigation{background:color-mix(in srgb,var(--nav-hero) 96%,transparent)!important;border-color:#ffffff40!important}
 body header.cck-navbar.nav-hero-tinted #navigation .nav-submenu{background:#ffffff1a;border-color:#ffffff40;box-shadow:none}
}

/* Traductor ES / EN (translator.js): entre el menú y "Hablemos"; en teléfonos pasa dentro del menú. */
body header.cck-navbar{grid-template-columns:237px minmax(0,1fr) auto auto!important}
body header.cck-navbar .lang-switch{display:flex;align-items:center;gap:2px;height:46px;padding:4px;border:1px solid #ffffff40;border-radius:999px;background:#ffffff15;backdrop-filter:blur(10px);justify-self:end}
body header.cck-navbar .lang-switch button{display:grid;place-items:center;min-width:38px;height:100%;padding:0 10px;border:0;border-radius:999px;background:transparent;color:#fff;font:700 13px/1 Arial,Helvetica,sans-serif;letter-spacing:.06em;cursor:pointer;transition:background .2s,color .2s}
body header.cck-navbar .lang-switch button:hover{background:#ffffff26}
body header.cck-navbar .lang-switch button[aria-pressed=true]{background:#fff;color:#202020}
body header.cck-navbar #navigation .lang-switch--menu{display:none}
@media(max-width:1279px){
 body header.cck-navbar{grid-template-columns:200px 1fr auto auto!important}
 body header.cck-navbar .lang-switch{height:46px}
}
@media(max-width:560px){
 body header.cck-navbar{grid-template-columns:145px 1fr auto!important}
 body header.cck-navbar .lang-switch--bar{display:none}
 body header.cck-navbar #navigation .lang-switch--menu{display:flex;align-self:flex-start;height:44px;margin:10px 0 0 10px}
 body header.cck-navbar #navigation .lang-switch--menu button{min-width:48px}
}
@media(prefers-reduced-motion:reduce){body header.cck-navbar .lang-switch button{transition:none}}

@media(max-width:360px){body header.cck-navbar{grid-template-columns:118px 1fr auto!important}body header.cck-navbar .brand{width:118px!important}}