/* =========================================================
   SDATATEC V45 — NORMALIZACIÓN FINAL
   Cargado después de las hojas históricas para evitar conflictos de cascada.
   ========================================================= */

/* Scroll nativo y estable, sin rebote en los límites de la página. */
html{
  overflow-x:clip;
  overflow-y:auto;
  overscroll-behavior-x:none;
  overscroll-behavior-y:none;
}
body{
  overflow-x:clip;
  overflow-y:visible;
  overscroll-behavior-x:none;
  overscroll-behavior-y:none;
}
main,.wrapper,.container{
  overscroll-behavior-y:contain;
}

/* La cabecera queda anclada al viewport y sale del cálculo del scroll. */
.header{
  position:fixed !important;
  top:0;
  right:0;
  left:0;
  width:100%;
  background:#fff !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
.header .main-nav{
  margin-left:auto;
}
main{
  padding-top:74px;
}
html.home-index,
html.sdc-scroll{
  scroll-snap-type:none;
  scroll-behavior:smooth;
}

/*
   V52 — SCROLL INTERNO ESTABLE
   La hoja maestra usa selectores más específicos para las páginas internas.
   Estas reglas dejan un solo scroller (html), eliminan el rebote de borde y
   neutralizan el scroll-snap histórico sin modificar el INDEX.
*/
html.sdc-scroll{
  overflow-y:auto !important;
  overscroll-behavior-y:none !important;
  scroll-behavior:auto !important;
  scroll-snap-type:none !important;
}
body.sdc-page{
  overflow-y:visible !important;
  overscroll-behavior-y:none !important;
}
body.sdc-page main,
body.sdc-page .wrapper,
body.sdc-page .container{
  overflow-y:visible !important;
  overscroll-behavior-y:auto !important;
}
body.sdc-page main>.sdc-module{
  scroll-snap-align:none !important;
  scroll-snap-stop:normal !important;
}

/* Todos los heroes internos replican la altura responsive del INDEX. */
.sdc-hero{
  height:auto;
  min-height:560px;
  align-items:center;
}
.sdc-hero-copy{
  padding-top:68px;
  padding-bottom:68px;
}

/* Los assets DFEED, GMA, IRON SUPPORT, TAME y WDE ya incluyen su composición final. */
.dfeed-page .sdc-hero-visual,
.gma-page .sdc-hero-visual,
.iron-support-page .sdc-hero-visual,
.tame-page .sdc-hero-visual,
.wde-page .sdc-hero-visual{
  width:100%;
  opacity:1;
  filter:none;
  transform:none;
}
.dfeed-page .sdc-hero-visual::before,
.dfeed-page .sdc-hero-visual::after,
.gma-page .sdc-hero-visual::before,
.gma-page .sdc-hero-visual::after,
.iron-support-page .sdc-hero-visual::before,
.iron-support-page .sdc-hero-visual::after,
.tame-page .sdc-hero-visual::before,
.tame-page .sdc-hero-visual::after,
.wde-page .sdc-hero-visual::before,
.wde-page .sdc-hero-visual::after{
  content:none;
  display:none;
}

.sdc-hero-tags{
  display:flex;
  flex-wrap:wrap;
  gap:0;
  margin:-8px 0 24px;
  color:var(--sdc-navy);
  font-size:12px;
  line-height:1.3;
  font-weight:850;
  letter-spacing:.025em;
}
.sdc-hero-tags span{
  display:inline-flex;
  align-items:center;
  white-space:nowrap;
}
.sdc-hero-tags span:not(:last-child)::after{
  content:"";
  width:4px;
  height:4px;
  margin:0 10px;
  border-radius:50%;
  background:var(--sdc-teal);
}

@media(max-width:1000px){
  .sdc-hero{min-height:640px}
  .sdc-hero-copy{padding:56px 34px 285px}
  .sdc-hero-visual{width:100%;background-position:70% center}
}
@media(max-width:640px){
  main{padding-top:68px}
  .sdc-hero{min-height:690px}
  .sdc-hero-copy{padding:46px 24px 300px}
  .sdc-hero-tags{margin-top:-6px;margin-bottom:20px;font-size:11px}
  .sdc-hero-tags span:not(:last-child)::after{margin:0 7px}
}

@media(prefers-reduced-motion:reduce){
  html.home-index,
  html.sdc-scroll{scroll-behavior:auto}
}

/* V55 — Navegación principal simplificada, sin CTA duplicado en la cabecera. */

/* =========================================================
   V53 — TRANSICIÓN SUTIL ENTRE PESTAÑAS
   La cabecera permanece visualmente estable y sólo cambia el contenido.
   ========================================================= */

/* Neutraliza los fundidos históricos que animaban BODY y HERO por separado. */
body{
  opacity:1 !important;
  transform:none !important;
  animation:none !important;
}
.hero-content,
.sdc-hero-copy,
.wde-v75-hero-copy,
.iron-v6-hero-copy{
  animation:none !important;
}

/* Transición nativa entre documentos del mismo sitio. */
@view-transition{
  navigation:auto;
}
.header{
  view-transition-name:sdc-site-header;
}
main{
  view-transition-name:sdc-page-content;
}

::view-transition-old(root),
::view-transition-new(root){
  animation:none;
  mix-blend-mode:normal;
}
::view-transition-group(sdc-site-header){
  z-index:2147483646;
  animation:none;
}
::view-transition-old(sdc-site-header),
::view-transition-new(sdc-site-header){
  opacity:1;
  animation:none;
  mix-blend-mode:normal;
}
::view-transition-group(sdc-page-content){
  z-index:1;
}
::view-transition-old(sdc-page-content){
  animation:sdc-route-out 120ms ease-in both;
  mix-blend-mode:normal;
}
::view-transition-new(sdc-page-content){
  animation:sdc-route-in 220ms cubic-bezier(.22,.61,.36,1) both;
  mix-blend-mode:normal;
}

@keyframes sdc-route-out{
  from{opacity:1}
  to{opacity:0}
}
@keyframes sdc-route-in{
  from{opacity:0;transform:translateY(4px)}
  to{opacity:1;transform:translateY(0)}
}

/* Respaldo para apertura local del ZIP y navegadores sin transición nativa. */
html:not(.sdc-native-transition).sdc-route-enter main{
  opacity:0;
  transform:translateY(4px);
}
html:not(.sdc-native-transition).sdc-route-enter.sdc-route-ready main{
  opacity:1;
  transform:translateY(0);
  transition:opacity 200ms ease-out,transform 200ms cubic-bezier(.22,.61,.36,1);
}
html:not(.sdc-native-transition) body.sdc-route-leaving main{
  opacity:0;
  transition:opacity 110ms ease-in;
}
.main-nav a.sdc-route-pending{
  color:var(--teal) !important;
  border-color:var(--teal) !important;
}

@media(prefers-reduced-motion:reduce){
  ::view-transition-old(root),
  ::view-transition-new(root),
  ::view-transition-old(sdc-site-header),
  ::view-transition-new(sdc-site-header),
  ::view-transition-old(sdc-page-content),
  ::view-transition-new(sdc-page-content){
    animation:none !important;
  }
  html.sdc-route-enter main,
  html.sdc-route-enter.sdc-route-ready main,
  body.sdc-route-leaving main{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
}

/* =========================================================
   V58 — TEXTOS DE HERO CONCISOS + LOGO CENTRADO
   ========================================================= */
.header .brand{
  display:flex;
  align-items:center;
  height:100%;
  line-height:0;
}
.header .brand img{
  display:block;
  flex:0 0 auto;
}

/* =========================================================
   V59 — PUNTO FINAL VERDE EN TÍTULOS DE PRODUCTO
   ========================================================= */
.sdc-pillar-title .sdc-title-period{
  color:#1F8A5B;
}

/* =========================================================
   V61 — DESCRIPCIÓN DE SOLUCIONES EN UNA SOLA LÍNEA
   ========================================================= */
@media(min-width:1001px){
  .home-page .solutions-section .index-section-head,
  .home-page .solutions-section .index-section-head>p{
    max-width:none;
  }
  .home-page .solutions-section .index-section-head>p{
    white-space:nowrap;
  }
}

/* =========================================================
   V60 — NUEVO HERO PANORÁMICO DEL INDEX
   ========================================================= */
.home-page .hero-image{
  background-position:center center !important;
}

@media(max-width:1000px){
  .home-page .hero-image{
    background-position:66% center !important;
  }
}

@media(max-width:640px){
  .home-page .hero-image{
    background-position:70% center !important;
  }
}

/* =========================================================
   V56 — HERO CONTACTO + NUEVO HERO IRON SUPPORT
   Contacto incorpora una escena panorámica de colaboración como fondo.
   ========================================================= */
.contact-sdc-page .sdc-contact-main{
  min-height:620px;
  background:#fff;
}
.contact-sdc-page .sdc-contact-main::after{
  content:none;
  display:none;
}
.sdc-contact-hero-visual{
  position:absolute;
  inset:0;
  z-index:0;
  background-image:url('assets/contact-hero-collaboration-v1.png');
  background-size:cover;
  background-position:center right;
  background-repeat:no-repeat;
  pointer-events:none;
}
.contact-sdc-page .sdc-contact-grid{
  min-height:620px;
  align-items:center;
  padding-top:56px;
  padding-bottom:56px;
}
.contact-sdc-page .sdc-contact-copy{
  padding-right:18px;
}
.contact-sdc-page .sdc-contact-photo{
  display:none;
}
.contact-sdc-page .sdc-contact-form{
  background:rgba(255,255,255,.84);
  border-color:rgba(8,42,108,.14);
  box-shadow:0 18px 46px rgba(6,27,68,.12);
}
.contact-sdc-page .sdc-contact-form input,
.contact-sdc-page .sdc-contact-form select,
.contact-sdc-page .sdc-contact-form textarea{
  background:#fff;
}

@media(max-width:1000px){
  .sdc-contact-hero-visual{
    background-position:70% center;
    opacity:.30;
  }
  .contact-sdc-page .sdc-contact-grid{
    min-height:auto;
    padding-top:52px;
    padding-bottom:52px;
  }
  .contact-sdc-page .sdc-contact-copy{
    padding-right:0;
  }
}

/* =========================================================
   V57 — REFINAMIENTO DE LEGIBILIDAD Y JERARQUÍA
   ========================================================= */
.sdc-pillar-title{
  color:var(--sdc-graphite);
}
.sdc-pillar-title .sdc-product-accent{
  color:var(--sdc-teal);
}

@media(min-width:1001px){
  .wde-page .sdc-hero-copy>p,
  .iron-support-page .sdc-hero-copy>p{
    max-width:490px;
    text-wrap:pretty;
  }
}

@media(max-width:640px){
  .sdc-contact-hero-visual{
    background-position:74% center;
    opacity:.20;
  }
  .contact-sdc-page .sdc-contact-main{
    min-height:auto;
  }
}

/* =========================================================
   V62 — KPI REACTIVABLES + ACENTO CROMÁTICO
   El valor domina en verde tecnología y el porcentaje queda en azul.
   ========================================================= */
.home-page .impact-kpi strong{
  color:#1F8A5B;
}
.home-page .impact-kpi strong em{
  color:#082A6C;
}

/* =========================================================
   V65 — CONTACTO EN UNA SOLA PANTALLA
   En escritorio, cabecera, formulario y pie ocupan exactamente
   el alto visible. En tablet y móvil se conserva el scroll normal.
   ========================================================= */
@media(min-width:1001px){
  html.contact-no-scroll{
    height:100%;
    overflow:hidden !important;
  }
  html.contact-no-scroll body.contact-sdc-page{
    height:100dvh;
    min-height:100dvh;
    overflow:hidden !important;
  }
  .contact-sdc-page main{
    height:calc(100dvh - 92px);
    min-height:0;
    overflow:hidden;
  }
  .contact-sdc-page .sdc-contact-main{
    height:100%;
    min-height:0;
  }
  .contact-sdc-page .sdc-contact-grid{
    height:100%;
    min-height:0;
    padding-top:clamp(22px,3.6vh,42px);
    padding-bottom:clamp(22px,3.6vh,42px);
  }
  .contact-sdc-page .footer{
    height:92px !important;
    min-height:92px !important;
  }
}

@media(min-width:1001px) and (max-height:780px){
  .contact-sdc-page .sdc-contact-grid{
    padding-top:20px;
    padding-bottom:20px;
  }
  .contact-sdc-page .sdc-contact-copy h1{
    margin-bottom:12px;
    font-size:clamp(42px,4vw,56px);
  }
  .contact-sdc-page .sdc-contact-copy>p{
    font-size:16px;
    line-height:1.48;
  }
  .contact-sdc-page .sdc-contact-benefits{
    gap:7px;
    margin-top:16px;
    padding-top:16px;
  }
  .contact-sdc-page .sdc-contact-form{
    gap:11px 16px;
    padding:22px 24px;
  }
  .contact-sdc-page .sdc-contact-form input,
  .contact-sdc-page .sdc-contact-form select,
  .contact-sdc-page .sdc-contact-form textarea{
    margin-top:5px;
    padding:9px 11px;
  }
  .contact-sdc-page .sdc-contact-form textarea{
    min-height:68px;
    max-height:68px;
    resize:none;
  }
}

@media(max-width:1000px){
  html.contact-no-scroll{
    height:auto;
    overflow-y:auto !important;
  }
  html.contact-no-scroll body.contact-sdc-page{
    height:auto;
    min-height:0;
    overflow-y:visible !important;
  }
}

/* =========================================================
   V66 — TRANSICIÓN SUAVE DEL MENÚ MÓVIL
   El panel aparece con un desplazamiento corto y fundido.
   La transición sólo responde al botón de menú y no participa
   del scroll vertical de las páginas.
   ========================================================= */
@media(max-width:1000px){
  .header .main-nav{
    display:flex !important;
    position:fixed !important;
    top:74px !important;
    right:0 !important;
    bottom:0 !important;
    left:0 !important;
    z-index:2002 !important;
    width:100% !important;
    height:calc(100dvh - 74px) !important;
    max-height:calc(100dvh - 74px) !important;
    margin:0 !important;
    padding:24px clamp(24px,7vw,70px) 34px !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:0 !important;
    background:#fff !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    -webkit-overflow-scrolling:touch;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-12px);
    transform-origin:top center;
    box-shadow:0 18px 38px rgba(6,27,68,.12);
    transition:
      opacity .20s ease,
      transform .22s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear .22s;
    will-change:opacity,transform;
  }
  .header .main-nav.open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
    transition-delay:0s;
  }
  .header .main-nav a{
    opacity:0;
    transform:translateY(7px) !important;
    transition:
      opacity .17s ease,
      transform .19s cubic-bezier(.22,.61,.36,1) !important;
  }
  .header .main-nav.open a{
    opacity:1;
    transform:translateY(0) !important;
  }
  .header .main-nav.open a:nth-child(1){transition-delay:.025s !important}
  .header .main-nav.open a:nth-child(2){transition-delay:.045s !important}
  .header .main-nav.open a:nth-child(3){transition-delay:.065s !important}
  .header .main-nav.open a:nth-child(4){transition-delay:.085s !important}
  .header .main-nav.open a:nth-child(5){transition-delay:.105s !important}
  .header .main-nav.open a:nth-child(6){transition-delay:.125s !important}
  .header .main-nav.open a:nth-child(7){transition-delay:.145s !important}
}

@media(max-width:640px){
  .header .main-nav{
    top:68px !important;
    height:calc(100dvh - 68px) !important;
    max-height:calc(100dvh - 68px) !important;
    padding:18px 24px 28px !important;
  }
}

@supports not (height:100dvh){
  @media(max-width:1000px){
    .header .main-nav{
      height:calc(100vh - 74px) !important;
      max-height:calc(100vh - 74px) !important;
    }
  }
  @media(max-width:640px){
    .header .main-nav{
      height:calc(100vh - 68px) !important;
      max-height:calc(100vh - 68px) !important;
    }
  }
}

@media(max-width:1000px) and (prefers-reduced-motion:reduce){
  .header .main-nav,
  .header .main-nav a{
    transition:none !important;
    transform:none !important;
  }
}