/* ===========================================================================
   CWB HOME · ajustes a mano
   ---------------------------------------------------------------------------
   Fecha : 22/08/2026
   Carga : DESPUES de cwb-home.css (que es generado y no se toca a mano).

   Este fichero existe porque hay cosas que la migracion de CSS no puede
   resolver sola: el hero de codewebbarcelona.com se monta dentro de una
   seccion de code26 (.csectionfullhome) que trae sus propias reglas, y algunas
   chocan con el layout del hero importado.

   REGLA: aqui solo van ajustes ACOTADOS al hero nuevo
   (.csectiontexthomewrap y descendientes). Nada global.
   =========================================================================== */

/* code26 centra el texto de su propio hero de home
   (.csectionfullhome .csectiontext { text-align:center }), porque el suyo es
   un titular gigante centrado. El de CWB va alineado a la izquierda -- medido
   en vivo el 22/08/2026: text-align "start". Sin esto, H1, titular, parrafo y
   botones salian todos centrados. */
.csectiontexthomewrap,
.csectiontexthomewrap * {
  text-align: left;
}

/* ...pero el `*` de arriba tambien alcanzaba a los botones, que van con su
   texto centrado. Se les devuelve lo suyo. */
.csectiontexthomewrap .cta {
  text-align: center;
}

/* El device sangra a proposito por la derecha (en CWB va de 838px a 2081px con
   viewport de 1658). Hay que evitar que eso genere scroll horizontal, pero SIN
   recortar en vertical.
   `overflow:hidden` -- que es lo que usa CWB -- recorta en los DOS ejes: en una
   pantalla baja, o si el titular crece una linea, se comeria el contenido del
   hero. `overflow-x:hidden` tampoco vale, porque obliga al navegador a calcular
   overflow-y como `auto` y crea un contenedor de scroll.
   `overflow-x:clip` es el unico que corta solo en horizontal y deja el eje
   vertical en `visible`. */
.csectionfullhome {
  overflow-x: clip;
  /* El overflow-y VA explicito. code26 trae un `section { overflow: hidden }`
     global (style.css), y por spec, si un eje queda en `clip` y el otro no es
     `clip` ni `visible`, el `clip` degrada a `hidden` -- con lo que volviamos a
     recortar en vertical sin darnos cuenta. Comprobado el 22/08/2026: computaba
     hidden/hidden aun forzando clip. */
  overflow-y: visible;
}

/* La raiz del problema: code26 le da al hero ALTO FIJO
   (`.csectionfull { height: calc(100vh - var(--headerheight)) }`). Con alto
   fijo, en cuanto el contenido pide mas -- pantalla baja, titular que salta de
   linea, otro idioma -- se sale y se corta.
   Pasa a min-height: llena la pantalla igual, pero si hace falta crece.
   Se conserva el calc del tema (100vh menos la cabecera fija) para que hero +
   cabecera sumen exactamente una pantalla, que es la intencion original. */
.csectionfullhome {
  height: auto;
  min-height: calc(100vh - var(--headerheight));
}

/* Los hijos llevaban height:100% contra el alto fijo del padre. Ahora que el
   padre es auto, eso resolveria a auto y romperia el reparto vertical: se pasan
   tambien a min-height. */
.csectionfullhome .csectiontext,
.csectionfullhome .csectiontexthomewrap,
.csectionfullhome .csectiontexthome {
  height: auto;
  min-height: 100%;
}

/* Titular grande del hero. code26 lo hereda de su `h1,.sh1`, que es
   calc(35px + 5.8vw) -> 131px en un portatil: pensado para su home, donde el
   titular es de tres palabras y ocupa toda la pantalla. Aqui el texto es mas
   largo y convive con el parrafo y el device, asi que se usa el valor del
   hero de codewebbarcelona.com, medido en vivo el 22/08/2026:
   calc(32px + 2.7vw) con line-height 0.9 -> 77px en el mismo portatil.
   Acotado al hero: el resto del sitio conserva la escala de code26. */
.csectiontexthome1 .sh1 {
  font-size: calc(32px + 2.7vw);
  line-height: 0.9;
}

/* Los dos botones del hero, uno al lado del otro y no pegados al parrafo.
   El padding-left va a 0 a proposito: .chomebot trae 20px propios de code26 y
   .csectiontexthome ya aplica var(--paddings) (otros 20px), asi que los botones
   arrancaban en 40px mientras el titular lo hacia en 20px. Ese era el margen
   izquierdo raro. */
.csectiontexthome .chomebot {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: var(--paddings);
  padding-left: 0;
}

/* --------------------------------------------------------------------------
   Cadena de alturas del hero.
   Al pasar el hero de `height` fija a `min-height`, el `height:100%` que traen
   los hijos (y sobre todo .cdevicehome) dejo de resolver: un porcentaje contra
   un padre en `auto` cae a `auto`, y el portatil se quedaba en 591px dentro de
   un hero de 841px. En CWB ocupa 680 de 841.
   Se rehace con flex, que si estira sin necesitar altura definida: asi se
   conserva la proporcion del original Y se mantiene el crecer-si-hace-falta.
   -------------------------------------------------------------------------- */
.csectionfullhome {
  display: flex;
  flex-direction: column;
}

.csectionfullhome > .csectiontext {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

.csectionfullhome .csectiontexthomewrap,
.csectionfullhome .csectiontexthome {
  flex: 1 1 auto;
}

/* El portatil entra mas hacia la izquierda: con el translateX(50%) original se
   veia una franja muy estrecha del dispositivo. Se reduce el desplazamiento
   para que asome bastante mas, sin dejar de sangrar por la derecha. */
/* El device se pinta POR ENCIMA del titular (comprobado con elementFromPoint el
   22/08/2026: en la zona de solape el elemento superior es un path del SVG, no
   el texto). Asi que no puede invadir la columna de texto o tapa el titular.
   En CWB no se solapan: el device arranca justo donde acaba el texto.
   41% deja su borde izquierdo en ~850px, con el titular terminando en 836. */
.csectionfullhome .cdevicehome {
  transform: translateX(41%);
}

/* Aire entre la cabecera de la seccion de servicios y las tarjetas del
   carrusel: se pegaban a la entradilla. --paddingsmid son solo 10px, poco
   para separar dos bloques. */
.csectionmodelhomeservices .cslickwrap {
  margin-top: var(--sectionmargin);
}

@media (max-width: 1000px) {
  /* En movil el hero de CWB si centra y el device pasa a ir debajo: eso ya lo
     trae cwb-home.css en su bloque de 1000px, asi que aqui solo hay que dejar
     de forzar la izquierda. */
  .csectiontexthomewrap,
  .csectiontexthomewrap * {
    text-align: center;
  }
  .csectiontexthome .chomebot {
    justify-content: center;
  }
}
