@charset "utf-8";
/* ═══════════════════════════════════════════════════════════════════════
   Let's talk — página 4 del PDF (1920 × 2095,6 pt).
   Necesita base.css cargado antes.

   Coordenadas: la y del PDF menos el inicio de la sección.
   ═══════════════════════════════════════════════════════════════════════ */

.heroe       {height:69.63rem;background:var(--azul);overflow:hidden}
.contacto    {height:79.69rem;background:var(--violeta);overflow:hidden}
.seguir      {height:39.34rem;background:var(--blanco)}
.pie-seccion {height:20.90rem;background:var(--blanco);overflow:hidden}

/* ═══ HÉROE ═══════════════════════════════════════ y del PDF 0 → 696,3 */

.heroe h1{font-weight:400;font-size:inherit}

.caja-smart{
  left:55.69rem;top:28.45rem;
  width:36.94rem;height:10.75rem;
  border-radius:1.05rem;
  background:var(--amarillo-caja);
  transform:rotate(-5.66deg);
}
.hr-smart{
  left:61.01rem;top:calc(37.69rem - var(--asc-sans) * 7.1rem);
  font-size:7.1rem;color:var(--violeta-texto);
  transform:rotate(-5.66deg);
  transform-origin:left calc(var(--asc-sans) * 1em);
}
.hr-decision{left:89.15rem;top:calc(37.27rem - var(--asc-serif) * 12rem);font-size:12rem;color:var(--blanco)}
.hr-click   {left:59.34rem;top:calc(44.47rem - var(--asc-sans) * 7.1rem); font-size:7.1rem;color:var(--blanco)}
.hr-away    {left:98.43rem;top:calc(44.47rem - var(--asc-sans) * 9.3rem); font-size:9.3rem;color:var(--violeta)}
.hr-punto   {left:121.07rem;top:calc(44.47rem - var(--asc-sans) * 8rem);  font-size:8rem;  color:var(--violeta)}

.cursor{position:absolute;left:123.593rem;top:38.34rem;width:13.214rem;height:13.66rem}

/* ═══ CONTACTO ══════════════════════════════ y del PDF − 696,3 ═══════ */

/* La foto sangra por la izquierda y el PDF la recorta en x 862,55. Se
   reproduce con un contenedor de ese ancho y overflow oculto: la imagen va
   dentro en su sitio, sin deformarla. El fondo negro es el del propio
   diseño, que asoma donde la foto no llega. */
.foto{
  position:absolute;
  left:0;top:0;
  width:86.255rem;height:79.69rem;
  overflow:hidden;
  background:#000;
}
.foto img{
  position:absolute;
  left:-15.096rem;top:-44.847rem;
  width:110.158rem;height:163.595rem;
  max-width:none;
}
/* El PDF oscurece la foto, igual que la de cabecera de Nosotros pero más:
   factor 0,451, o sea negro al 54,9 %. El ajuste hay que hacerlo en las
   esquinas: en el centro lo falsean la caja violeta y "brands!", que van
   encima y suben el resultado a 0,79. */
.foto .velo{
  position:absolute;inset:0;
  background:#000;opacity:.549;
}

.caja-elevating{
  left:15.98rem;top:27.98rem;
  width:54.39rem;height:10.65rem;
  border-radius:3.01rem;
  background:var(--violeta);
  transform:rotate(-1.31deg);
}
.ct-lema{position:static}
.ct-elev  {left:17.63rem;top:calc(35.68rem - var(--asc-sans) * 7.1rem);font-size:7.1rem;color:var(--blanco)}
/* " your " lleva espacio delante: +0,3 em de Atyp a 71 pt */
.ct-your  {left:52.74rem;top:calc(35.68rem - var(--asc-sans) * 7.1rem);font-size:7.1rem;color:var(--blanco)}
.ct-brands{
  left:23.49rem;top:calc(49.56rem - var(--asc-serif) * 12rem);
  font-size:12rem;color:var(--blanco);
  transform:rotate(-4.45deg);
  transform-origin:left calc(var(--asc-serif) * 1em);
}

.contacto h2{font-weight:400;font-size:inherit}
.ct-contacto{left:102.92rem;top:calc(14.84rem - var(--asc-sans) * 7.1rem);font-size:7.1rem;color:var(--amarillo-caja)}
.ct-us      {left:137.12rem;top:calc(14.84rem - var(--asc-serif) * 12rem);font-size:12rem;color:var(--blanco)}

/* ── El formulario ───────────────────────────────────────────────────── */
/* El rótulo va ENCIMA del campo, no dentro: en el diseño es una etiqueta
   suelta y debajo una caja clara. */

.formulario{position:static}
.campo{position:static}

.campo label{
  position:absolute;
  display:block;
  white-space:nowrap;
  left:94.15rem;
  font-family:var(--fuente-sans);
  /* El diseño usa aquí Ubuntu Light, que es mucho más fina que cualquier
     ajuste de Atyp. Con el peso de texto (105) los rótulos salían al doble
     de tinta que en el PDF. Se usa el mínimo del eje —40— que es lo más
     cerca que se puede llegar sin la fuente original. */
  font-variation-settings:'wght' 40,'ital' 0;
  line-height:calc(var(--asc-sans) + var(--desc-sans));
  font-size:2.9rem;color:var(--blanco);
}
.c1 label{top:calc(21.10rem - var(--asc-sans) * 2.9rem)}
.c2 label{top:calc(32.12rem - var(--asc-sans) * 2.9rem);left:93.9rem}
.c3 label{top:calc(43.64rem - var(--asc-sans) * 2.9rem)}
.c4 label{top:calc(55.91rem - var(--asc-sans) * 2.9rem);left:93.2rem}

.campo input{
  position:absolute;
  left:93.46rem;
  width:67.68rem;height:5.47rem;
  border:0;
  border-radius:1.78rem;
  background:#fefef2;
  font-family:var(--fuente-sans);
  font-size:2.9rem;
  color:var(--violeta);
  padding:0 1.8rem;
}
.c1 input{top:22.75rem}
.c2 input{top:33.77rem}
.c3 input{top:45.29rem}
.c4 input{top:57.56rem}

.enviar{
  position:absolute;
  left:149.91rem;top:64.66rem;
  width:11.74rem;height:5.74rem;
  border-radius:1.37rem;
  background:var(--amarillo-caja);
  font-family:var(--fuente-sans);
  font-variation-settings:'wght' 110,'ital' 0;
  font-size:2.471rem;
  color:var(--blanco);
  line-height:5.74rem;
}

/* ═══ FOLLOW US ═════════════════════════════ y del PDF − 1493,2 ══════ */

.seguir h2{font-weight:400;font-size:inherit}

.sg-follow{left:34.05rem;top:calc(15.86rem - var(--asc-sans) * 7.1rem);font-size:7.1rem;color:var(--violeta)}
.caja-us{
  left:51.88rem;top:14.28rem;
  width:22.28rem;height:8.52rem;
  border-radius:2.89rem;
  background:var(--amarillo);
  transform:rotate(-4.45deg);
}
/* OJO: get_text() da para este "us" el origen (561,1 · 1651,8), que es el de
   la línea; el real del fragmento es (571,1 · 1710,3) y sólo lo devuelve
   get_texttrace(). Con el del dict la palabra quedaba 58 px por encima de su
   caja amarilla. Es el segundo de los dos únicos casos del PDF, junto con
   "Values" de la página 2. */
.sg-us{left:57.11rem;top:calc(21.71rem - var(--asc-serif) * 12rem);font-size:12rem;color:var(--violeta)}

.sg-iconos{position:absolute;left:84.634rem;top:13.741rem;width:70.294rem;height:7.381rem}
.zona-red{position:absolute;top:13.6rem;height:7.6rem;display:block}
.r-fb{left:84.4rem; width:5rem}
.r-ig{left:102.8rem;width:7rem}
.r-tt{left:124.5rem;width:6.5rem}
.r-in{left:150.9rem;width:4.5rem}

/* En el PDF va en Ubuntu Light, a la espera de que el cliente confirme el
   cambio a Atyp. docs/05-PENDIENTE-CLIENTE.md, punto 12. */
.sg-usuario{left:138.74rem;top:calc(25.31rem - var(--asc-sans) * 3.5rem);font-size:3.5rem;color:var(--azul)}

/* ═══ PIE ═══════════════════════════════════ y del PDF − 1886,6 ══════ */

.logo-pie{left:9.5rem;top:4.64rem;width:14.79rem;height:11.78rem}
.mosaico {left:76.14rem;top:0;width:115.885rem;height:20.897rem}

/* ═══ COLUMNA FLOTANTE DE REDES ═══════════════════════════════════════ */

.redes{left:171.862rem;top:85.321rem;height:47.446rem}
.z-mail{top:.6rem}
.z-fb  {top:7.4rem}
.z-ig  {top:13.8rem}
.z-tt  {top:20.2rem}
.z-in  {top:26.6rem}
.z-wa  {top:38.5rem;height:9.5rem}