/* ============================================================
   Gumma — Base visual comun (Bloque 1: shell, header, mega-menus,
   menu mobile, footer). Medidas segun ESTILOS-ACTUALES.md y
   RESPONSIVE-ACTUAL.md (sitio vivo 25/08/2026). Ningun estilo
   proviene de codigo de terceros.
   ============================================================ */

/* ---------- reset minimo ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--gumma-font-body);
  font-size: var(--gumma-font-size-body-sm);
  line-height: 1.6;
  color: var(--gumma-color-text);
  background: var(--gumma-color-white);
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }
button { font: inherit; background: none; border: 0; cursor: pointer; padding: 0; }

.gm-container {
  max-width: var(--gumma-container-max);
  margin: 0 auto;
  padding-left: var(--gumma-page-gutter-desktop);
  padding-right: var(--gumma-page-gutter-desktop);
}

.gm-visually-hidden {
  position: absolute; width: 1px; height: 1px; margin: -1px;
  clip: rect(0 0 0 0); overflow: hidden; white-space: nowrap;
}

/* ============================================================
   HEADER desktop — blanco, ~93px, logo 149x33, nav Sora 12/700
   ============================================================ */
.gm-header {
  position: relative;
  background: var(--gumma-color-white);
  height: var(--gumma-header-height-desktop);
  z-index: var(--gumma-z-megamenu);
}
.gm-header__inner {
  max-width: 1265px;             /* ancho util medido del header */
  margin: 0 auto;
  height: 100%;
  padding: 0 var(--gumma-page-gutter-desktop);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.gm-header__logo img {
  width: var(--gumma-logo-w-desktop);
  height: var(--gumma-logo-h-desktop);
  object-fit: cover;             /* CONFIRMADO en el vivo */
}

/* navegacion desktop */
.gm-nav { display: flex; align-items: center; gap: 44px; }
.gm-nav__link,
.gm-nav__item > a,
.gm-nav__item > button {
  font-family: var(--gumma-font-ui);
  font-weight: 700;
  font-size: var(--gumma-font-size-nav);   /* 12px */
  line-height: 16.8px;
  letter-spacing: 0.6px;
  color: var(--gumma-color-text);
  text-transform: none;                    /* los textos ya vienen en mayusculas */
  display: inline-block;
  padding: 8px 0;
}
/* Hover: el relevamiento solo confirma la APERTURA del panel; la variacion
   visual del link esta PENDIENTE — no se inventa cambio de color. */

/* ============================================================
   MEGA-MENUS desktop (hover/focus) — panel blanco de ancho completo,
   arranca bajo el header (~y=82) y alcanza ~330px de alto.
   ============================================================ */
/* .gm-nav__item NO debe ser positioned: el containing block del panel
   absoluto tiene que ser .gm-header (position: relative, full-width) para
   que left/right:0 abarquen el viewport y no el ancho del boton. */
.gm-megamenu {
  position: absolute;
  left: 0; right: 0;
  top: calc(var(--gumma-header-height-desktop) - 11px);  /* ~y=82 medido */
  background: var(--gumma-color-white);
  min-height: var(--gumma-megamenu-height);
  display: none;
  padding: 10px;                 /* padding exterior observado */
  z-index: var(--gumma-z-megamenu);
}
.gm-nav__item:hover .gm-megamenu,
.gm-nav__item:focus-within .gm-megamenu { display: block; }

.gm-megamenu__inner {
  /* contenido interno medido: 744px arrancando en x≈423 (viewport 1280).
     El min() es solo guarda anti-overflow para desktops mas angostos. */
  width: min(744px, 100%);
  margin-left: min(423px, calc(100% - 744px));
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px 24px;
}
.gm-megamenu__title,
.gm-megamenu__all {
  font-family: var(--gumma-font-ui);
  font-weight: 700;
  font-size: 12px;
  line-height: 21.6px;
  color: var(--gumma-color-text);
  display: block;
  padding: 8px 12px;             /* celdas ~8x12 observadas */
}
.gm-megamenu__link {
  font-family: var(--gumma-font-heading);  /* Avenir 16/400/22.4 medido */
  font-weight: 400;
  font-size: 16px;
  line-height: 22.4px;
  display: block;
  padding: 4px 12px;
}
/* Mega-menu INDUSTRIAS: opciones y destinos CONFIRMADOS; su geometria NO
   fue medida (solo la del panel de Productos). Este layout de dos columnas
   es una implementacion PROVISIONAL local, no paridad confirmada. */
.gm-megamenu--industrias .gm-megamenu__inner {
  grid-template-columns: repeat(2, minmax(0, 240px));
}

/* ============================================================
   HEADER / MENU mobile (<=767px)
   ============================================================ */
.gm-menu-toggle { display: none; }

@media (max-width: 767px) {
  .gm-header {
    position: fixed;             /* header movil fijo (CONFIRMADO) */
    top: 0; left: 0; right: 0;
    height: var(--gumma-header-height-mobile);
    z-index: var(--gumma-z-header-mobile);
  }
  body { padding-top: var(--gumma-header-height-mobile); }
  .gm-header__inner { padding: 0 var(--gumma-page-gutter-mobile); }
  .gm-header__logo img {
    width: var(--gumma-logo-w-mobile);
    height: var(--gumma-logo-h-mobile);
  }
  .gm-nav { display: none; }     /* la navegacion horizontal se oculta */

  .gm-menu-toggle {
    display: inline-block;
    background: var(--gumma-color-gray);   /* #7D7D7D (CONFIRMADO) */
    color: var(--gumma-color-white);       /* color de texto: INFERIDO (no medido) */
    padding: 12px 30px;                    /* padding computado (CONFIRMADO) */
    font-family: var(--gumma-font-ui);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.6px;
  }
}

/* panel mobile full-screen (se monta oculto tambien en desktop) */
.gm-mobile-nav {
  position: fixed;
  inset: 0;
  z-index: var(--gumma-z-mobile-nav);      /* 100000 (CONFIRMADO) */
  display: none;
}
.gm-mobile-nav[data-open="true"] { display: block; }
.gm-mobile-nav__scrim {
  position: absolute; inset: 0;
  background: var(--gumma-overlay-scrim);  /* rgba(0,0,0,.6) (CONFIRMADO) */
}
.gm-mobile-nav__panel {
  position: absolute; inset: 0;
  background: var(--gumma-color-surface);  /* #F5F5F5 (CONFIRMADO) */
  overflow-y: auto;
  padding: 24px 0 32px;
}
.gm-mobile-nav__close {
  position: absolute;
  top: 16px; right: 16px;
  width: 40px; height: 40px;               /* 40x40 (CONFIRMADO) */
  font-size: 22px;
  line-height: 1;
  color: var(--gumma-color-text);
}
.gm-mobile-nav__list {
  margin-top: 64px;
  padding-left: 56px;                      /* items desde x≈56 (CONFIRMADO) */
}
.gm-mobile-nav__list > li { margin-bottom: 42px; }  /* separacion ≈42px */
.gm-mobile-nav__list a,
.gm-mobile-nav__list button {
  font-family: var(--gumma-font-ui);
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.6px;
  color: var(--gumma-color-text);
  text-align: left;
}
/* submenu INDUSTRIAS mobile: existencia CONFIRMADA ("Mas paginas de
   INDUSTRIAS"); apertura/contenido PENDIENTES. El toggle es una decision
   local TEMPORAL; se puebla con los 6 destinos confirmados del desktop. */
.gm-mobile-nav__sub { display: none; margin: 16px 0 0 16px; }
.gm-mobile-nav__sub[data-open="true"] { display: block; }
.gm-mobile-nav__sub li { margin-bottom: 14px; }
.gm-mobile-nav__sub a { font-weight: 400; font-size: 14px; }
.gm-mobile-nav__social {
  margin-top: 56px;
  padding-left: 56px;
  display: flex;
  gap: 24px;
}
.gm-mobile-nav__social a {
  font-family: var(--gumma-font-ui);
  font-size: 12px;
  font-weight: 700;
}
body.gm-scroll-locked { overflow: hidden; }

/* ============================================================
   MAIN (secciones restantes del Home llegan en proximos bloques)
   ============================================================ */
.gm-main { min-height: 40vh; }

/* ============================================================
   02. HERO Home — ESTILOS §5: area ~871px, imagen cover, overlay
   gradiente EXACTO, contenido a la izquierda con gutter 38.
   ============================================================ */
.gm-hero {
  position: relative;
  height: 871px;
  overflow: hidden;
  display: flex;
  align-items: center;
}
.gm-hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;             /* comportamiento cover CONFIRMADO */
  object-position: center;
}
.gm-hero__overlay {
  position: absolute;
  inset: 0;
  /* gradiente CONFIRMADO en el vivo */
  background: linear-gradient(360deg, rgb(0, 0, 0) 44.5843%, rgb(50, 65, 88) 100%);
  opacity: 1;
  mix-blend-mode: multiply;      /* la foto se ve a traves del overlay: INFERIDO */
}
.gm-hero__content {
  position: relative;
  padding-left: var(--gumma-page-gutter-desktop);
  color: var(--gumma-color-white);
}
.gm-hero__title {
  font-family: var(--gumma-font-heading);   /* Avenir 80/700/80/-4 medido */
  font-size: 80px;
  font-weight: 700;
  line-height: 80px;
  letter-spacing: -4px;
  margin: 0 0 24px;
  max-width: 596px;              /* bloque ~595.5px medido */
}
.gm-hero__sub {
  font-family: var(--gumma-font-ui);        /* Sora Light 22/400/33 medido */
  font-weight: 400;
  font-size: 22px;
  line-height: 33px;
  margin: 0 0 32px;
  max-width: 436px;
}
.gm-hero__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 128px;
  height: 49.48px;               /* 128 x 49.48 medido */
  background: var(--gumma-color-blue);      /* #28448E */
  border-radius: var(--gumma-radius-filter);/* 8px medido en CTA hero */
  font-family: var(--gumma-font-ui);
  font-weight: 700;
  font-size: 12px;
  line-height: 12px;
  color: var(--gumma-color-white);
}

/* ============================================================
   03. INDICADORES INICIALES — numeros Sora 60/400/72/-1.2 blancos,
   labels Sora Light 14/700/22.4 uppercase, 3 columnas.
   Fondo navy: INFERIDO (color de banda no medido; texto blanco si).
   ============================================================ */
.gm-stats {
  background: var(--gumma-color-navy);
  color: var(--gumma-color-white);
  padding: 88px 0;               /* spacing vertical: INFERIDO (sin token unico) */
}
.gm-stats__row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  text-align: center;
  gap: 24px;
}
.gm-stat__n {
  display: block;
  font-family: var(--gumma-font-ui);
  font-weight: 400;
  font-size: var(--gumma-font-size-stat);   /* 60px */
  line-height: 72px;
  letter-spacing: -1.2px;
}
.gm-stat__l {
  display: block;
  font-family: var(--gumma-font-ui);
  font-weight: 700;
  font-size: 14px;
  line-height: 22.4px;
  letter-spacing: -0.28px;
  text-transform: uppercase;
  margin-top: 8px;
}

/* ============================================================
   04. CATEGORIAS DE PRODUCTOS — 3 columnas (labels x=82/485/888,
   paso ~403px), label Sora 12/700/21.6, heading Avenir 35/700/42.
   Alto de imagen desktop: INFERIDO del ratio mobile 324x184.6.
   ============================================================ */
.gm-cats { padding: 80px 0; }    /* spacing: INFERIDO */
.gm-cats__eyebrow {
  font-family: var(--gumma-font-ui);
  font-weight: 700;
  font-size: 12px;
  line-height: 21.6px;
  letter-spacing: 2.4px;         /* label de seccion medido */
  text-transform: uppercase;
  margin: 0 0 8px;
}
.gm-cats__title {
  font-family: var(--gumma-font-heading);
  font-size: var(--gumma-font-size-h2);     /* 35px */
  font-weight: 700;
  line-height: 42px;
  letter-spacing: -0.7px;
  margin: 0 0 48px;
  max-width: 700px;
}
.gm-cats__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;                     /* paso 403 - col ~363: INFERIDO */
}
.gm-cat img {
  width: 100%;
  aspect-ratio: 324 / 184.6;     /* ratio confirmado en mobile; desktop INFERIDO */
  object-fit: cover;
}
.gm-cat__label {
  font-family: var(--gumma-font-ui);
  font-weight: 700;
  font-size: 12px;
  line-height: 21.6px;
  color: var(--gumma-color-text);
  margin: 16px 0 8px;
}
.gm-cat__desc {
  font-family: var(--gumma-font-body);      /* parrafo estandar 15/400/24 */
  font-size: 15px;
  line-height: 24px;
  margin: 0;
}

/* ---------- responsive del tramo (RESPONSIVE §2-3) ---------- */
@media (max-width: 767px) {
  .gm-hero { height: 660.3px; }
  .gm-hero__content { padding-left: 34px; }  /* x≈34.2 medido */
  .gm-hero__title {
    font-size: 45px;
    font-weight: 400;            /* peso computado 400 en mobile (CONFIRMADO) */
    line-height: 45px;
    letter-spacing: -2.25px;
    max-width: 286px;
  }
  .gm-hero__sub { font-size: 18px; line-height: 27px; max-width: 286px; }
  .gm-hero__cta { height: 48px; }
  .gm-stats { padding: 56px 0; } /* INFERIDO */
  .gm-stats__row { grid-template-columns: repeat(3, 1fr); } /* siguen 3 col (CONFIRMADO) */
  .gm-stat__n { font-size: 35px; line-height: 42px; }
  .gm-stat__l { font-size: 12px; line-height: 19.2px; }
  .gm-cats__title { font-size: 26px; line-height: 31.2px; max-width: 300px; }
  .gm-cats__grid { grid-template-columns: 1fr; gap: 40px; } /* 1 columna (CONFIRMADO) */
}

/* ============================================================
   05. EXPERIENCIA
   Contenido CONFIRMADO: 40 / 300 / 50 / 15.
   Desktop: numeros 60/72, labels 14/22.4; contador ~275px.
   Mobile: una columna; numeros 50/60, labels 12/19.2.
   Fondo navy y spacing vertical: INFERIDOS hasta validacion visual.
   ============================================================ */
.gm-experience {
  background: var(--gumma-color-navy);      /* INFERIDO */
  color: var(--gumma-color-white);
  padding: 80px 0 88px;                    /* INFERIDO */
}

.gm-experience__eyebrow {
  margin: 0 0 48px;
  font-family: var(--gumma-font-ui);
  font-size: 12px;
  font-weight: 700;
  line-height: 21.6px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
}

.gm-experience__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 275px));
  justify-content: space-between;
  gap: 16px;
}

.gm-experience__stat {
  text-align: center;
}

.gm-experience__n {
  display: block;
  font-family: var(--gumma-font-ui);
  font-size: var(--gumma-font-size-stat);
  font-weight: 400;
  line-height: 72px;
  letter-spacing: -1.2px;
}

.gm-experience__l {
  display: block;
  margin-top: 8px;
  font-family: var(--gumma-font-ui);
  font-size: 14px;
  font-weight: 700;
  line-height: 22.4px;
  letter-spacing: -0.28px;
  text-transform: uppercase;
}

@media (max-width: 767px) {
  .gm-experience {
    padding: 64px 0;                        /* INFERIDO */
  }

  .gm-experience__eyebrow {
    margin-bottom: 40px;                    /* INFERIDO */
  }

  .gm-experience__grid {
    grid-template-columns: 1fr;
    gap: 32px;                              /* INFERIDO */
  }

  .gm-experience__n {
    font-size: 50px;
    line-height: 60px;
  }

  .gm-experience__l {
    width: 100%;
    max-width: 313px;
    margin: 8px auto 0;
    font-size: 12px;
    line-height: 19.2px;
  }
}

/* ============================================================
   06. NOSOTROS
   Estructura validada contra Wix actual.

   Desktop:
   - imagen izquierda / contenido derecha
   - ancho practicamente completo
   - imagen horizontal con bordes redondeados

   Mobile:
   - contenido primero
   - eyebrow NOSOTROS oculto
   - CTA antes de la imagen
   - imagen de equipo al final, recortada ~333x305
   ============================================================ */
.gm-about {
  background: var(--gumma-color-white);
  padding: 56px 0 58px;
}

/* Este bloque no usa el max-width global de 1189px.
   Wix actual expande Nosotros casi al ancho completo. */
.gm-about > .gm-container {
  max-width: none;
  width: 100%;
  padding-left: var(--gumma-page-gutter-desktop);
  padding-right: var(--gumma-page-gutter-desktop);
}

.gm-about__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 88px;
  align-items: start;
}

.gm-about__media {
  overflow: hidden;
  border-radius: 10px;
}

.gm-about__img {
  display: block;
  width: 100%;
  aspect-ratio: 1.86 / 1;
  object-fit: cover;
  object-position: center;
}

.gm-about__content {
  min-width: 0;
}

.gm-about__eyebrow {
  margin: 0 0 24px;
  font-family: var(--gumma-font-ui);
  font-size: 12px;
  font-weight: 700;
  line-height: 21.6px;
  letter-spacing: 2.4px;
  color: var(--gumma-color-navy);
  text-transform: uppercase;
}

.gm-about__title {
  width: 100%;
  max-width: none;
  margin: 0 0 20px;
  font-family: var(--gumma-font-heading);
  font-size: 35px;
  font-weight: 700;
  line-height: 35px;
  letter-spacing: -0.7px;
  color: var(--gumma-color-navy);
}

.gm-about__copy {
  width: 100%;
  max-width: none;
  font-family: var(--gumma-font-heading);
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  color: var(--gumma-color-text);
}

.gm-about__copy p {
  margin: 0 0 22px;
}

.gm-about__copy p:last-child {
  margin-bottom: 0;
}

.gm-about__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 171px;
  min-height: 54px;
  margin-top: 30px;
  padding: 0 24px;
  border-radius: 8px;
  background: var(--gumma-color-blue);
  color: var(--gumma-color-white);
  font-family: var(--gumma-font-ui);
  font-size: 12px;
  font-weight: 700;
  line-height: 12px;
  text-decoration: none;
}

@media (max-width: 767px) {
  .gm-about {
    padding: 30px 0 48px;
  }

  .gm-about > .gm-container {
    padding-left: var(--gumma-page-gutter-mobile);
    padding-right: var(--gumma-page-gutter-mobile);
  }

  .gm-about__grid {
    display: flex;
    flex-direction: column;
    gap: 48px;
  }

  /* Wix mobile muestra primero texto+CTA y luego la foto. */
  .gm-about__content {
    order: 1;
    width: 100%;
  }

  .gm-about__media {
    order: 2;
    width: calc(100% + 8px);
    margin-left: -4px;
    margin-right: -4px;
    border-radius: 10px;
  }

  /* No aparece en el estado mobile actual de Wix. */
  .gm-about__eyebrow {
    display: none;
  }

  .gm-about__title {
    width: 100%;
    max-width: 324px;
    margin: 0 0 26px;
    font-size: 28px;
    line-height: 28px;
    letter-spacing: -0.56px;
  }

  .gm-about__copy {
    width: 100%;
    max-width: none;
    font-size: 16px;
    line-height: 23px;
  }

  .gm-about__copy p {
    margin-bottom: 24px;
  }

  .gm-about__cta {
    min-width: 173px;
    min-height: 48px;
    margin-top: 2px;
  }

  .gm-about__img {
    width: 100%;
    aspect-ratio: 349 / 306;
    object-fit: cover;
    object-position: center;
  }
}

/* ============================================================
   FOOTER — fondo navy, texto blanco, columnas (contenido CONFIRMADO
   en CONTENIDO-VISUAL-ACTUAL "Componentes globales > Footer")
   ============================================================ */
.gm-footer {
  background: var(--gumma-color-navy);
  color: var(--gumma-color-white);
  font-family: var(--gumma-font-body);     /* Avenir 15/400/24 medido */
  font-size: 15px;
  line-height: 24px;
}
.gm-footer__grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(4, 1fr) 1.1fr;
  gap: 32px;
  padding-top: 72px;
  padding-bottom: 48px;
}
.gm-footer__brand p { margin: 0 0 4px; }
.gm-footer__tagline { margin-top: 12px; }
.gm-footer h3 {
  font-family: var(--gumma-font-ui);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 2.4px;                   /* patron de label de seccion */
  margin: 0 0 16px;
}
.gm-footer li { margin-bottom: 10px; }
.gm-footer__legal {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  padding-top: 18px;
  padding-bottom: 22px;
  font-size: 13px;
}

@media (max-width: 767px) {
  /* RESPONSIVE §10: footer mobile = UNA sola columna alineada a la izquierda,
     con el orden documentado: (marca/descriptor) > Nosotros > Productos >
     Industrias > Noticias > Contacto+datos > Seguinos > credito.
     El bloque "marca/descriptor" NO se reproduce aun: no hay asset de logo
     de footer confirmado y company.tagline es null — no se inventa markup.
     Se reordenan SOLO los bloques existentes via CSS order (DOM intacto):
     1=CONTACTO/brand, 2=INDUSTRIAS, 3=PRODUCTOS, 4=NOSOTROS, 5=NOTICIAS,
     6=SEGUINOS (posiciones DOM). */
  .gm-footer__grid { grid-template-columns: 1fr; padding-top: 48px; gap: 28px; }
  .gm-footer__grid > :nth-child(4) { order: 1; }  /* NOSOTROS */
  .gm-footer__grid > :nth-child(3) { order: 2; }  /* PRODUCTOS */
  .gm-footer__grid > :nth-child(2) { order: 3; }  /* INDUSTRIAS */
  .gm-footer__grid > :nth-child(5) { order: 4; }  /* NOTICIAS */
  .gm-footer__grid > :nth-child(1) { order: 5; }  /* CONTACTO + datos */
  .gm-footer__grid > :nth-child(6) { order: 6; }  /* SEGUINOS */
  .gm-footer h3 { font-size: 12.92px; }           /* headings mobile (CONFIRMADO §10) */
  .gm-footer__legal { text-align: center; }       /* credito centrado (CONFIRMADO §10) */
  .gm-container {
    padding-left: var(--gumma-page-gutter-mobile);
    padding-right: var(--gumma-page-gutter-mobile);
  }
}


/* ============================================================
   07. INDUSTRIAS
   Desktop Wix actual:
   - carrusel horizontal
   - cards ~338x450
   - gap ~10px
   - siguiente card parcialmente visible

   Mobile Wix actual:
   - grilla 2 columnas
   - cards ~165x260 a 377px
   - sin control de carrusel
   ============================================================ */
.gm-industries {
  background: #f5f5f5;
  padding: 60px 0 58px;
  overflow: hidden;
}

.gm-industries > .gm-container {
  width: 100%;
  max-width: none;
  padding-left: clamp(
    var(--gumma-page-gutter-desktop),
    2.45vw,
    47px
  );
  padding-right: 0;
}

.gm-industries__eyebrow {
  margin: 0 0 22px;
  font-family: var(--gumma-font-ui);
  font-size: 12px;
  font-weight: 700;
  line-height: 21.6px;
  letter-spacing: 2.4px;
  color: var(--gumma-color-navy);
  text-transform: uppercase;
}

.gm-industries__title {
  margin: 0 38px 34px 0;
  font-family: var(--gumma-font-heading);
  font-size: 35px;
  font-weight: 700;
  line-height: 42px;
  letter-spacing: -0.7px;
  color: var(--gumma-color-navy);
}

.gm-industries__rail {
  position: relative;
}

.gm-industries__grid {
  display: flex;
  gap: 10px;
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.gm-industries__grid::-webkit-scrollbar {
  display: none;
}

.gm-industry-card {
  position: relative;
  flex: 0 0 338px;
  height: 450px;
  overflow: hidden;
  border-radius: 10px;
  background: #ddd;
  color: var(--gumma-color-navy);
  text-decoration: none;
}

.gm-industry-card__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.gm-industry-card__icon {
  position: absolute;
  top: 31px;
  left: 31px;
  display: block;
  width: 45px;
  height: 45px;
  object-fit: contain;
}

.gm-industry-card__label {
  position: absolute;
  left: 31px;
  bottom: 23px;
  display: inline-flex;
  align-items: center;
  min-height: 39px;
  padding: 0 17px;
  border-radius: 4px;
  background: var(--gumma-color-white);
  font-family: var(--gumma-font-ui);
  font-size: 11px;
  font-weight: 700;
  line-height: 12px;
  white-space: nowrap;
}

.gm-industry-card__marker {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  margin-right: 15px;
}

.gm-industries__next {
  position: absolute;
  z-index: 3;
  top: 50%;
  right: 20px;
  width: 52px;
  height: 52px;
  padding: 0 0 4px;
  border: 0;
  border-radius: 50%;
  background: var(--gumma-color-white);
  color: var(--gumma-color-navy);
  font-family: Arial, sans-serif;
  font-size: 42px;
  font-weight: 300;
  line-height: 48px;
  cursor: pointer;
  transform: translateY(-50%);
}

@media (max-width: 767px) {
  .gm-industries {
    padding: 28px 0 48px;
    overflow: visible;
  }

  .gm-industries > .gm-container {
    padding-left: var(--gumma-page-gutter-mobile);
    padding-right: var(--gumma-page-gutter-mobile);
  }

  .gm-industries__eyebrow {
    margin: 0 0 14px 7px;
    font-size: 12px;
    line-height: 21.6px;
  }

  .gm-industries__title {
    /* Compensacion mobile por fallback tipografico:
       Wix usa Avenir; 24px reproduce su corte de linea a 377px. */
    max-width: 334px;
    margin: 0 0 33px 7px;
    font-size: 24px;
    line-height: 31.2px;
    letter-spacing: -0.52px;
  }

  .gm-industries__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 10px;
    overflow: visible;
  }

  .gm-industry-card {
    width: 100%;
    height: 260px;
    min-width: 0;
    border-radius: 8px;
  }

  .gm-industry-card__icon {
    display: none;
  }

  .gm-industry-card__label {
    left: 10px;
    bottom: 18px;
    min-height: 32px;
    max-width: calc(100% - 20px);
    padding: 0 10px;
    font-size: 8px;
    line-height: 9.6px;
  }

  .gm-industry-card__label-text {
    order: 1;
    overflow: hidden;
    text-overflow: clip;
  }

  .gm-industry-card__marker {
    order: 2;
    width: 7px;
    height: 7px;
    margin-right: 0;
    margin-left: 8px;
  }

  .gm-industries__next {
    display: none;
  }
}

/* ============================================================
   Home / CTA de proyecto
   Referencia Wix confirmada:
   DSC07530.jpg / 6605c8_8bc20de42e664b6680a61e234d9dc34c
   ============================================================ */

.gm-project-cta {
  position: relative;
  width: 100%;
  height: clamp(420px, 32.5vw, 619px);
  overflow: hidden;
  background: #555;
}

.gm-project-cta__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 0% 100%;
}

.gm-project-cta__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.28);
}

.gm-project-cta__content {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 var(--gumma-page-gutter-desktop);
  text-align: center;
}

.gm-project-cta__title {
  max-width: 980px;
  margin: 0;
  color: #fff;
  font-family: var(--gumma-font-heading);
  font-size: 50px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -0.7px;
}

@media (max-width: 767px) {
  .gm-project-cta {
    height: clamp(220px, 61.3vw, 260px);
  }

  .gm-project-cta__content {
    padding-right: var(--gumma-page-gutter-mobile);
    padding-left: var(--gumma-page-gutter-mobile);
  }

  .gm-project-cta__title {
    max-width: 340px;
    font-size: 24px;
    line-height: 28.8px;
    /* Compensacion por fallback tipografico:
       -0.65px reproduce el corte de linea de Avenir en Wix a 377px. */
    letter-spacing: -0.65px;
  }
}

/* ============================================================
   Home / Clientes
   Wix actual:
   - dos galerias horizontales independientes
   - desktop: 178x86 / 177x86
   - mobile: 118x57 / 126x61
   - fondos y radios pertenecen a los PNG originales
   ============================================================ */

.gm-clients {
  width: 100%;
  padding: 56px 0 72px;
  overflow: hidden;
  background: #f5f5f5;
}

.gm-clients__header {
  width: 100%;
  max-width: none;
  padding-right: var(--gumma-page-gutter-desktop);
  padding-left: var(--gumma-page-gutter-desktop);
}

.gm-clients__eyebrow {
  margin: 0 0 44px;
  font-family: var(--gumma-font-ui);
  font-size: 12px;
  font-weight: 700;
  line-height: 21.6px;
  letter-spacing: 2.4px;
  color: #121212;
  text-align: center;
  text-transform: uppercase;
}

.gm-clients__rows {
  display: flex;
  flex-direction: column;
  gap: 43px;
  width: 100%;
}

.gm-clients__viewport {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.gm-clients__viewport::-webkit-scrollbar {
  display: none;
}

.gm-clients__track {
  display: flex;
  width: max-content;
}

.gm-clients__viewport--upper .gm-clients__track {
  gap: 40px;
}

.gm-clients__viewport--lower .gm-clients__track {
  gap: 50px;
}

.gm-client-logo {
  flex: 0 0 auto;
  display: block;
  scroll-snap-align: start;
}

.gm-clients__viewport--upper .gm-client-logo {
  width: 178px;
  height: 86px;
}

.gm-clients__viewport--lower .gm-client-logo {
  width: 177px;
  height: 86px;
}

.gm-client-logo__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (max-width: 767px) {
  .gm-clients {
    padding: 22px 0 52px;
  }

  .gm-clients__header {
    padding-right: 0;
    padding-left: 0;
  }

  .gm-clients__eyebrow {
    margin: 0 0 38px;
    font-size: 12px;
    font-weight: 400;
    line-height: 21.6px;
    letter-spacing: 2.4px;
  }

  .gm-clients__rows {
    gap: 58px;
  }

  .gm-clients__viewport--upper .gm-client-logo {
    width: 118px;
    height: 57px;
  }

  .gm-clients__viewport--lower .gm-client-logo {
    width: 126px;
    height: 61px;
  }

  .gm-clients__viewport--upper .gm-clients__track {
    gap: 40px;
  }

  .gm-clients__viewport--lower .gm-clients__track {
    gap: 50px;
  }
}

/* ============================================================
   Home / Noticias
   Wix actual:
   - cards horizontales
   - columnas cercanas a 300 px
   - title 22 / 700 / 26.4
   - fecha 10 / 700 / 16 uppercase
   - drag/swipe + controles prev/next
   ============================================================ */

.gm-news {
  width: 100%;
  padding: 76px 0 88px;
  overflow: hidden;
  background: #ffffff;
}

.gm-news__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 42px;
}

.gm-news__eyebrow {
  margin: 0;
  font-family: "Sora", Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 21.6px;
  letter-spacing: 2.4px;
  color: #121212;
  text-transform: uppercase;
}

.gm-news__controls {
  display: flex;
  align-items: center;
  gap: 10px;
}

.gm-news__control {
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
  border: 1px solid #121212;
  border-radius: 50%;
  background: transparent;
  color: #121212;
  font: inherit;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}

.gm-news__control:hover,
.gm-news__control:focus-visible {
  background: #121212;
  color: #ffffff;
}

.gm-news__viewport {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.gm-news__viewport::-webkit-scrollbar {
  display: none;
}

.gm-news__track {
  display: flex;
  gap: 24px;
  width: max-content;
}

.gm-news-card {
  flex: 0 0 300px;
  width: 300px;
  color: #121212;
  text-decoration: none;
  scroll-snap-align: start;
}

.gm-news-card__media {
  width: 100%;
  aspect-ratio: 300 / 205;
  margin-bottom: 18px;
  overflow: hidden;
  background: #eeeeee;
}

.gm-news-card__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 240ms ease;
}

.gm-news-card:hover .gm-news-card__img {
  transform: scale(1.025);
}

.gm-news-card__meta {
  display: flex;
  min-height: 20px;
  margin-bottom: 9px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.gm-news-card__category {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 7px;
  font-family: "Sora", Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 16px;
  letter-spacing: .5px;
  color: #57585a;
  text-transform: uppercase;
}

.gm-news-card__marker {
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
}

.gm-news-card__date {
  flex: 0 0 auto;
  font-family: "Sora", Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 16px;
  letter-spacing: .5px;
  color: #57585a;
  text-transform: uppercase;
}

.gm-news-card__title {
  margin: 0;
  font-family: "Avenir Next", Avenir, Arial, sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 26.4px;
  color: #121212;
}

@media (max-width: 767px) {
  .gm-news {
    padding: 52px 0 64px;
  }

  .gm-news__header {
    margin-bottom: 30px;
  }

  .gm-news__eyebrow {
    font-weight: 400;
  }

  .gm-news__controls {
    gap: 8px;
  }

  .gm-news__control {
    width: 36px;
    height: 36px;
    font-size: 18px;
  }

  .gm-news__track {
    gap: 18px;
  }

  .gm-news-card {
    flex-basis: min(284px, calc(100vw - 64px));
    width: min(284px, calc(100vw - 64px));
  }

  .gm-news-card__media {
    aspect-ratio: 284 / 194;
    margin-bottom: 16px;
  }

  .gm-news-card__title {
    font-size: 20px;
    line-height: 24px;
  }
}

/* ============================================================
   Home / Newsletter
   Wix actual:
   - bloque oscuro de aproximadamente 500 px
   - eyebrow 12 / 700 / 19.2, tracking 2.4
   - titulo Avenir ~44.47 / 700 / 44.47
   - CTA 16 / 400 / 19.2
   ============================================================ */

.gm-newsletter {
  display: flex;
  width: 100%;
  min-height: 500px;
  align-items: center;
  background: #121212;
  color: #ffffff;
}

.gm-newsletter__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 70px;
  padding-bottom: 70px;
  text-align: center;
}

.gm-newsletter__eyebrow {
  margin: 0 0 28px;
  font-family: "Sora", Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 19.2px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
}

.gm-newsletter__title {
  max-width: 760px;
  margin: 0 0 52px;
  font-family: "Avenir Next", Avenir, Arial, sans-serif;
  font-size: 44.47px;
  font-weight: 700;
  line-height: 44.47px;
  color: #ffffff;
}

.gm-newsletter__form {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 14px;
}

.gm-newsletter__field {
  display: flex;
  width: 360px;
  flex-direction: column;
  align-items: flex-start;
}

.gm-newsletter__label {
  margin-bottom: 7px;
  font-family: "Sora", Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 19.2px;
  letter-spacing: 2.4px;
}

.gm-newsletter__input {
  width: 100%;
  height: 43px;
  padding: 0 14px;
  border: 1px solid #ffffff;
  border-radius: 0;
  outline: 0;
  background: transparent;
  color: #ffffff;
  font-family: "Sora", Arial, sans-serif;
  font-size: 14px;
}

.gm-newsletter__input::placeholder {
  color: rgba(255, 255, 255, .75);
  opacity: 1;
}

.gm-newsletter__input:focus {
  outline: 1px solid #ffffff;
  outline-offset: 2px;
}

.gm-newsletter__input[aria-invalid="true"] {
  border-color: #ffffff;
  outline: 1px solid #ffffff;
}

.gm-newsletter__submit {
  width: 170px;
  height: 43px;
  padding: 0 20px;
  border: 1px solid #ffffff;
  border-radius: 0;
  background: #ffffff;
  color: #121212;
  font-family: "Sora", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 19.2px;
  cursor: pointer;
}

.gm-newsletter__submit:hover,
.gm-newsletter__submit:focus-visible {
  background: transparent;
  color: #ffffff;
}

.gm-newsletter__status {
  min-height: 19px;
  margin-top: 14px;
  font-family: "Sora", Arial, sans-serif;
  font-size: 11px;
  line-height: 16px;
}

@media (max-width: 767px) {
  .gm-newsletter {
    min-height: 500px;
  }

  .gm-newsletter__inner {
    padding-top: 56px;
    padding-bottom: 56px;
  }

  .gm-newsletter__eyebrow {
    margin-bottom: 24px;
    font-weight: 400;
  }

  .gm-newsletter__title {
    max-width: 330px;
    margin-bottom: 44px;
    font-size: 32px;
    line-height: 35px;
  }

  .gm-newsletter__form {
    flex-direction: column;
    align-items: center;
    gap: 18px;
  }

  .gm-newsletter__field {
    width: 250px;
  }

  .gm-newsletter__input {
    height: 40px;
  }

  .gm-newsletter__submit {
    width: 264px;
    height: 43.2px;
  }
}