/* =========================================================================
   ISAAC AUTOMOCIÓ — ajustes para convivir con Elementor y con el tema
   ---------------------------------------------------------------------
   La hoja principal (isaac-base.css) es la misma del diseño original. Aquí
   solo se corrige lo que cambia al pasar de un HTML plano a WordPress:
   las envolturas que añade Elementor y los márgenes que pone el tema.
   ========================================================================= */

/* ------------------------------------------------------------------ anchos */
/* Cada widget del plugin dibuja su propia sección a sangre y coloca dentro
   su envoltura `.env`. La caja centrada de Elementor sobra: si la dejamos,
   el fondo de la sección se queda a 1140 px y se ve un marco blanco. */
.elementor-section > .elementor-container:has(> .elementor-column > .elementor-widget-wrap > [class*="elementor-widget-isaac-"]) {
  max-width: none;
}
[class*="elementor-widget-isaac-"] > .elementor-widget-container { width: 100%; }
.elementor-widget-isaac-hero,
.elementor-widget-isaac-cinta { width: 100%; }

/* El tema puede reservar espacio alrededor del contenido; estas páginas se
   maquetan solas de borde a borde. */
.isaac-marco .elementor-widget-wrap { padding: 0; }
.isaac-marco .site-main,
.isaac-marco .entry-content { margin: 0; padding: 0; max-width: none; }

/* ------------------------------------------------- secciones encadenadas */
/* Un bloque marcado como «continúa la sección anterior» no repite el espacio
   superior. No basta con quitarle su propio relleno: el bloque de arriba sigue
   teniendo el suyo por abajo, así que además se sube para comérselo. Sin esto
   quedan dos secciones separadas por un hueco del doble de lo normal. */
.seccion--continua {
  padding-top: 0;
  margin-top: calc(-1 * var(--ritmo));
}

/* ----------------------------------------------------- bloques de servicio */
/* En el HTML original los seis servicios vivían dentro de la misma sección y
   `:first-of-type` bastaba para quitar la línea del primero. Aquí cada uno es
   un widget independiente, así que todos son «el primero» de su envoltura y
   hay que reponer la separación desde fuera. */
.elementor-widget-isaac-servicio .servicio { border-top: 1px solid var(--linea); }
.elementor-widget-isaac-servicio:first-child .servicio { border-top: 0; padding-top: 0; }
.seccion--tinta .elementor-widget-isaac-servicio .servicio { border-top-color: #2A2D33; }

/* ------------------------------------------------- contacto a dos columnas */
/* El `display:flex` se declara aquí y no se da por supuesto: viene de la hoja
   de Elementor y no conviene que la maqueta dependa de que no la cambien. */
.isaac-2col > .elementor-container {
  display: flex;
  flex-wrap: wrap;
  max-width: var(--ancho);
  margin-inline: auto;
  padding-inline: var(--margen);
  align-items: start;
  gap: clamp(2.5rem, 6vw, 5rem);
}
/* Los anchos se dejan al reparto flexible en vez de a porcentajes fijos: con
   `gap` de por medio, 45 % + 55 % suma más del 100 % y la segunda columna se
   caería debajo. Así además pasan solas a una columna en pantallas estrechas. */
.isaac-2col > .elementor-container > .elementor-column {
  width: auto !important;
  flex: 1 1 24rem;
  min-width: 0;
}
.isaac-2col > .elementor-container > .elementor-column:last-child { flex-grow: 1.25; }

@media (max-width: 60rem) {
  .isaac-2col > .elementor-container > .elementor-column { flex-basis: 100%; }
}

/* ------------------------------------------------------------- formulario */
/* Trampa para robots: fuera de la vista pero sin `display:none`, que algunos
   rellenadores automáticos detectan y esquivan. */
.isaac-trampa {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden; clip-path: inset(50%);
  white-space: nowrap;
}

.aviso-form[data-tipo] { display: block; }

/* ------------------------------------------------------------------ ficha */
.ficha--suelta { margin-inline: auto; max-width: 30rem; }

/* --------------------------------------------------------- redes del pie */
.pie__redes {
  display: flex; flex-wrap: wrap; gap: .35rem 1.25rem;
  margin-top: 1.25rem; padding: 0; list-style: none;
}
.pie__redes a {
  font-family: var(--dato);
  font-size: .6875rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

/* Los menús del pie llegan como <ul> de WordPress con sus propias clases. */
.pie nav ul,
.pie .menu { list-style: none; margin: 0; padding: 0; }

/* --------------------------------------------------- ancla de «ir al contenido» */
#isaac-principal { display: block; height: 0; scroll-margin-top: 6rem; }

/* ------------------------------------------------ dentro del editor visual */
/* En el editor no hay cabecera fija, así que el tirón hacia arriba de la
   portada dejaría el titular cortado por el borde del lienzo. */
.elementor-editor-active .hero.hero--foto,
.elementor-editor-preview .hero.hero--foto { margin-top: 0; }
.elementor-editor-active .hero.hero--foto { min-height: 40rem; }