/* Rejilla: secciones, filas y columnas (equivalente a la rejilla de Divi con separación 3). */

.sec {
  position: relative;
  padding: var(--seccion-relleno) 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.sec-ac { padding: 0; }
.sec.con-divisor { position: relative; }

.fila {
  position: relative;
  width: var(--fila-ancho);
  max-width: var(--fila-max);
  margin: auto;
  padding: var(--fila-relleno) 0;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}
.fila::after { content: ""; display: block; clear: both; }
.cols-iguales, .cols-iguales > .fila { align-items: stretch; }
.fila-int { width: 100%; position: relative; display: flex; flex-wrap: wrap; align-items: flex-start; }

.col {
  position: relative;
  z-index: 2;
  min-height: 1px;
  margin-right: var(--hueco-columna);
  background-position: center;
  background-size: cover;
}
.col.ultima, .col:last-child { margin-right: 0; }
.col-4-4 { width: 100%; }
.col-1-2 { width: var(--col-1-2); }
.col-1-3 { width: var(--col-1-3); }
.col-2-3 { width: var(--col-2-3); }
.col-1-4 { width: var(--col-1-4); }
.col-3-4 { width: var(--col-3-4); }
.col-1-5 { width: 15.6%; }
.col-1-6 { width: 12.083%; }
.col-2-5 { width: 36.7%; }
.col-3-5 { width: 57.8%; }
.col-int { margin-right: var(--hueco-columna); }
.col-int.ultima { margin-right: 0; }
.fila-int > .col-4-4 { width: 100%; margin-right: 0; }

/* Separación vertical entre módulos según el ancho de la columna */
.col-4-4 > .mod { margin-bottom: var(--modulo-margen); }
.col-1-2 > .mod { margin-bottom: 5.82%; }
.col-1-3 > .mod { margin-bottom: 9.27%; }
.col-2-3 > .mod { margin-bottom: 4.242%; }
.col-1-4 > .mod { margin-bottom: 13.174%; }
.col-3-4 > .mod { margin-bottom: 3.735%; }
.col > .mod:last-child { margin-bottom: 0; }

/* Fondos que Divi pinta con elementos: parallax, máscara, patrón, vídeo y separadores */
.parallax-env { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.parallax {
  position: absolute; inset: 0;
  background-position: top center; background-size: cover; background-repeat: no-repeat;
}
.parallax.parallax-css { background-attachment: fixed; }
.mascara, .patron { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.mascara { background-size: calc(100% + 2px) calc(100% + 2px); background-repeat: no-repeat; background-position: 50%; overflow: hidden; }
.video-fondo { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.video-fondo video { width: 100%; height: 100%; object-fit: cover; }
.divisor-sup, .divisor-inf {
  display: block; position: absolute; left: 0; right: 0; width: 100%; height: 100%;
  background-repeat: repeat-x; pointer-events: none; z-index: 1;
}
.divisor-sup { top: 0; }
.divisor-inf { bottom: 0; }
.sec > .fila, .sec > .mod { z-index: 2; }

/* Constructor: el contenido arranca justo bajo la cabecera */
.divi { position: relative; }

@media only screen and (min-width: 981px) {
  /* Parallax «verdadero» de Divi: se aproxima con fondo fijo en escritorio */
  .con-parallax .parallax { background-attachment: fixed; }
}

@media only screen and (max-width: 980px) {
  .sec { padding: 18px 0; }
  .sec-ac { padding: 0; }
  .fila, .fila-int { padding: 1px 0; display: block; }
  /* Como en Divi, la columna contiene los márgenes de sus hijos (p. ej. el de un blockquote final) */
  .col, .col-int { display: flow-root; width: 100% !important; margin-right: 0 !important; margin-bottom: 30px; }
  .col.ultima, .col-int.ultima { margin-bottom: 0; }
  .col.vacia { display: none; }
  .col > .mod { margin-bottom: 30px; }
}

@media only screen and (max-width: 767px) {
  .sec { padding: 5px 0; }
  .sec-ac { padding: 0; }
  .fila, .fila-int { padding: 0; }
}