/* =========================================================================
   URRETA — Home
   Artboard 1980 x 17384 px  →  123.75rem x 1086.5rem
   ========================================================================= */

/* ================================ HERO ================================= */

.hero__bg,
.hero__overlay {
  position: absolute;
  top: 6.875rem;                     /* 110 */
  left: 0;
  width: 123.8431rem;                /* 1981.49 */
  height: 72.6668rem;                /* 1162.668 */
}
.hero__bg {
  object-fit: cover;
  transform: scaleX(-1);             /* Figma: -scale-x-100 */
}
.hero__overlay { background: rgba(76, 76, 76, 0.6); }

.hero__logo {
  position: absolute;
  top: 19.9375rem;                   /* 319 */
  left: 75.8044rem;                  /* 1212.87 */
  width: 22.6875rem;                 /* 363 */
  height: 14.0625rem;                /* 225 */
}
.hero__logo img { width: 100%; height: 100%; }

.hero__claim {
  position: absolute;
  top: 45.85rem;                     /* 733.6 */
  left: 69.2775rem;                  /* 1108.44 */
  width: 35.7544rem;                 /* 572.07 */
  height: 10.3219rem;                /* 165.15 */
  overflow: hidden;
}
.hero__claim img { position: absolute; max-width: none; }
.hero__claim .c-a { top: 13.60%; left: 27.31%; width: 53.47%; height: 44.86%; }
.hero__claim .c-b { top: 55.58%; left: 22.70%; width: 77.30%; height: 44.42%; }
.hero__claim .c-c { top: -0.30%; left: 0;      width: 88.47%; height: 55.83%; }

.hero__btn {
  position: absolute;
  top: 62.1525rem;                   /* 994.44 (centro) */
  left: 87.1481rem;                  /* 1394.37 (centro) */
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 2.25rem;             /* 16 / 36 */
  border: 0.0903rem solid var(--c-white);   /* 1.444 */
  border-radius: 4.5109rem;          /* 72.175 */
  background: rgba(255, 255, 255, 0);
  font-size: 1.5rem;
  font-weight: 300;
  line-height: normal;
  color: var(--c-white);
  white-space: nowrap;
  overflow: hidden;
  transition:
    background var(--t-medio) var(--e-suave),
    color      var(--t-medio) var(--e-suave),
    transform  var(--t-medio) var(--e-suave),
    box-shadow var(--t-medio) var(--e-suave);
}
.hero__btn:hover,
.hero__btn:focus-visible {
  background: rgba(255, 255, 255, 1);
  color: var(--c-primary);
  transform: translate(-50%, -50%) scale(1.04);
  box-shadow: 0 0.75rem 1.75rem rgba(0, 0, 0, 0.28);
}
.hero__btn:active { transform: translate(-50%, -50%) scale(0.99); }

/* ============================== SERVICIOS =============================== */

.servicios__titulo {
  position: absolute;
  top: 146.7538rem;                  /* 2348.06 (centro) */
  left: 16.8081rem;                  /* 268.93 */
  width: 41.375rem;                  /* 662 */
  transform: translateY(-50%);
  font-size: 4rem;                   /* 64 */
  font-weight: 200;
  line-height: normal;
  color: var(--c-primary);
}

/* Tarjeta con forma de pestaña de carpeta.
   La forma es un SVG de 436x734 anclado arriba a la izquierda y recortado
   por la altura de la tarjeta: por eso la muesca cae siempre a la misma
   distancia del borde superior en las dos alturas. */
/* La pestaña se ancla por su BASE, no por su techo: así crecer de alto la
   levanta sola y no hace falta compensar con un transform.
   Es lo que mantiene la base clavada durante la animación — con `top` +
   `translateY` el alto se interpola en el hilo principal y el transform en
   el compositor, no avanzan al mismo compás, y en los primeros fotogramas
   la caja entera daba un salto de ~16 px. */
.tab {
  position: absolute;
  width: 27.2834rem;                 /* 436.535 */
  overflow: hidden;
  transition: height var(--t-largo) var(--e-entrada);
}
.tab--alto  { height: 32.2445rem; }  /* 515.912 */
.tab--corto { height: 18.1526rem; }  /* 290.441 */

/* --- Estado HOVER -----------------------------------------------------
   La pestaña SUBE: al estar anclada por la base, crecer de alto levanta el
   borde superior y descubre la lista de coberturas. Sólo se anima una
   propiedad, así que no hay nada con lo que desincronizarse.

   La silueta (SVG de 436x734) y el contenido siguen anclados arriba de la
   caja, así que la muesca y el icono suben con el borde superior.

   No se toca el z-index: el apilado lo decide el orden del marcado, de modo
   que las pestañas que van delante siguen delante aunque la de atrás crezca.
   -------------------------------------------------------------------- */
.tab--alto:hover,
.tab--alto:focus-within  { height: 45.8825rem; }   /* 734.12 */
.tab--corto:hover,
.tab--corto:focus-within { height: 38.286rem; }    /* 612.576 */

/* Lista de coberturas — misma retícula que las tarjetas de Continuidad:
   texto de 16.93/28.22 y viñeta cuadrada de 10.18 sangrada 20.86. */
.tab__lista {
  flex: none;
  width: 100%;
  opacity: 0;
  transform: translateY(0.75rem);
  transition:
    opacity   var(--t-medio) var(--e-suave),
    transform var(--t-largo) var(--e-entrada);
}
.tab:hover .tab__lista,
.tab:focus-within .tab__lista {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 90ms;
}

.tab__lista p {
  position: relative;
  margin: 0;
  padding-left: 1.3038rem;           /* 20.86 */
  font-size: 1.0581rem;              /* 16.929 */
  font-weight: 400;
  line-height: 1.7635rem;            /* 28.216 */
}
.tab__lista p::before {
  content: '';
  position: absolute;
  top: 0.5519rem;                    /* 8.83 */
  left: 0;
  width: 0.6364rem;                  /* 10.183 */
  height: 0.6364rem;
  background: currentColor;
}

/* Fianzas reparte sus doce coberturas en dos columnas: se llena primero la
   de la izquierda, por eso el flujo es por columnas. */
.tab__lista--dos {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(6, 1.7635rem);       /* renglón de 28.22 */
  grid-auto-columns: 10.4025rem;                  /* 166.44 entre columnas */
  width: 21.7431rem;                              /* 347.89 */
  align-content: start;
}
/* El texto de Figma mide 160.58 y arranca tras la sangría de la viñeta:
   la caja del renglón (181.44) es más ancha que el paso entre columnas. */
.tab__lista--dos p { width: 11.34rem; }           /* 181.44 */

.tab--alto  .tab__lista { color: var(--c-cream); }
.tab--corto .tab__lista { color: var(--c-primary); }

/* El icono acompaña el gesto con un ligero acercamiento */
.tab__cont > img { transition: transform var(--t-largo) var(--e-entrada); }
.tab:hover .tab__cont > img,
.tab:focus-within .tab__cont > img { transform: scale(1.06); }

.tab__forma {
  position: absolute;
  top: 0;
  left: 0;
  width: 27.25rem;                   /* 436 */
  height: 45.875rem;                 /* 734 */
  max-width: none;
}

/* Borde de las pestañas crema. En el diseño solo aparece con el cursor
   encima: es la misma silueta trazada, superpuesta a la de relleno, que
   entra con un cruce de opacidad. */
.tab__borde {
  position: absolute;
  top: 0;
  left: 0;
  width: 27.25rem;                   /* 436 — igual que .tab__forma */
  height: 45.875rem;                 /* 734 */
  max-width: none;
  opacity: 0;
  transition: opacity var(--t-medio) var(--e-suave);
}
.tab--corto:hover .tab__borde,
.tab--corto:focus-within .tab__borde { opacity: 1; }

.tab__cont {
  position: absolute;
  top: 3.6144rem;                    /* 57.83 */
  left: 3.7903rem;                   /* 60.645 */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.5625rem;                    /* 25 */
  width: 19.625rem;                  /* 314 */
}

.tab__label {
  font-size: 2rem;                   /* 32 */
  font-weight: 200;
  line-height: normal;
}
.tab__label--g { font-size: 2.25rem; }          /* 36 */
.tab--alto  .tab__label { color: var(--c-cream); }
.tab--corto .tab__label { color: var(--c-primary); }

/* Iconos: cada uno conserva su proporcion original */
.ico-automoviles    { width: 3.25rem;   height: 2.5625rem; }
.ico-vida           { width: 4.1994rem; height: 2.8581rem; }
.ico-fianzas        { width: 3.0544rem; height: 3.6706rem; }
.ico-gastos-medicos { width: 2.71rem;   height: 3.7431rem; }
.ico-danos          { width: 3.8881rem; height: 3.5744rem; }
.ico-afinidad       { width: 3.6844rem; height: 3.5119rem; }

/* --- Marco de las pestañas -------------------------------------------
   Las seis viven dentro de un mismo contenedor recortado. Es justo lo
   bastante alto para que quepan abiertas, y lo que se salga de ahí no se ve.

     borde superior = pestaña alta abierta = 165.7238 − 13.638 = 152.0858rem
     borde inferior = base de las cortas   = 180 + 18.1526     = 198.1526rem
     alto                                                      =  46.0668rem

   Cada pestaña se coloca por su distancia a la BASE del marco:
   46.0668 − (posición en el artboard − 152.0858) − alto en reposo.
   -------------------------------------------------------------------- */
.servicios__tabs {
  position: absolute;
  top: 152.0858rem;
  left: 0;
  width: 123.75rem;
  height: 46.0668rem;
  overflow: hidden;
}

/* Posiciones dentro del marco, medidas desde su base */
.tab--automoviles { left: 16.8381rem; bottom: 0.1087rem; }  /* artboard 165.7994 */
.tab--vida        { left: 45.3713rem; bottom: 0.1843rem; }  /* artboard 165.7238 */
.tab--fianzas     { left: 73.92rem;   bottom: 0.1843rem; }  /* artboard 165.7238 */
/* Las cortas arrancan en 180rem del artboard, no en 179.8913: su base queda
   1.7 px por debajo de la de las altas y tapa el filo del degradado que se
   asomaba por abajo cuando los bordes coincidían al píxel. */
.tab--gastos      { left: 22.5531rem; bottom: 0; }          /* artboard 180 */
.tab--danos       { left: 51.0863rem; bottom: 0; }          /* artboard 180 */
.tab--afinidad    { left: 79.62rem;   bottom: 0; }          /* artboard 180 */

/* ========================= SOMOS UN HUB (titular) ======================= */

.hub__titulo {
  position: absolute;
  top: 106.2188rem;                  /* 1699.5 (centro) */
  left: 15.6206rem;                  /* 249.93 */
  width: 41.375rem;                  /* 662 */
  transform: translateY(-50%);
  font-size: 4rem;
  font-weight: 200;
  line-height: normal;
  color: var(--c-primary);
}
.hub__texto {
  position: absolute;
  top: 122.8438rem;                  /* 1965.5 (centro) */
  left: 15.6206rem;
  width: 41.375rem;
  height: 9.9375rem;                 /* 159 */
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 300;
  line-height: 2.5rem;               /* 40 */
  color: var(--c-primary);
}

/* ==================== ILUSTRACION "lo que construyes" =================== */

.hub__arte {
  position: absolute;
  top: 86.1563rem;                   /* 1378.5 */
  left: 66.2313rem;                  /* 1059.7 */
  width: 41.8963rem;                 /* 670.34 */
  height: 53.8578rem;                /* 861.725 */
}
.hub__arte > img,
.hub__arte > .hub__mascara { position: absolute; }

/* La forma recortada: misma silueta que la mascara, alineada a la caja */
.hub__mascara {
  inset: 0;
  overflow: hidden;
  -webkit-mask-image: url('data:image/svg+xml;base64,PHN2ZyBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIiBvdmVyZmxvdz0idmlzaWJsZSIgc3R5bGU9ImRpc3BsYXk6IGJsb2NrOyIgd2lkdGg9IjY3MC4zNCIgaGVpZ2h0PSI4NjEuNzI1IiB2aWV3Qm94PSIwIDAgNjcwLjM0IDg2MS43MjUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGlkPSJjbGlwcGF0aCI+CjxwYXRoIGlkPSJWZWN0b3IiIGQ9Ik0yMi4yMzk5IDgwNS4xMThIMzA2LjY2NEMzMTcuNDE1IDgwNS4xMTggMzI2LjEyNiA4MTMuODI5IDMyNi4xMjYgODI0LjU4MVY4NDIuMjYyQzMyNi4xMjYgODUzLjAxMyAzMzQuODM4IDg2MS43MjUgMzQ1LjU4OSA4NjEuNzI1SDY0OC4wODhDNjYwLjM3NSA4NjEuNzI1IDY3MC4zNCA4NTEuNzYgNjcwLjM0IDgzOS40NzNWNzYuMTY4M0M2NzAuMzQgNjMuODgxMSA2NjAuMzc1IDUzLjkxNjIgNjQ4LjA4OCA1My45MTYySDQ1MS45ODRDNDM5LjcyMiA1My45MTYyIDQyOS43NjkgNDMuOTc1OCA0MjkuNzY5IDMxLjcwMDlWMjIuMjE1MkM0MjkuNzY5IDkuOTUyNjIgNDE5LjgyOSAwIDQwNy41NTQgMEgyMi4yMTUzQzkuOTUyNjQgMCAwIDkuOTQwMzQgMCAyMi4yMTUyVjc4Mi44NjZDMCA3OTUuMTUzIDkuOTY0ODkgODA1LjExOCAyMi4yNTIxIDgwNS4xMThIMjIuMjM5OVoiIGZpbGw9ImJsYWNrIi8+CjwvZz4KPC9zdmc+Cg==');
          mask-image: url('data:image/svg+xml;base64,PHN2ZyBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIiBvdmVyZmxvdz0idmlzaWJsZSIgc3R5bGU9ImRpc3BsYXk6IGJsb2NrOyIgd2lkdGg9IjY3MC4zNCIgaGVpZ2h0PSI4NjEuNzI1IiB2aWV3Qm94PSIwIDAgNjcwLjM0IDg2MS43MjUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGlkPSJjbGlwcGF0aCI+CjxwYXRoIGlkPSJWZWN0b3IiIGQ9Ik0yMi4yMzk5IDgwNS4xMThIMzA2LjY2NEMzMTcuNDE1IDgwNS4xMTggMzI2LjEyNiA4MTMuODI5IDMyNi4xMjYgODI0LjU4MVY4NDIuMjYyQzMyNi4xMjYgODUzLjAxMyAzMzQuODM4IDg2MS43MjUgMzQ1LjU4OSA4NjEuNzI1SDY0OC4wODhDNjYwLjM3NSA4NjEuNzI1IDY3MC4zNCA4NTEuNzYgNjcwLjM0IDgzOS40NzNWNzYuMTY4M0M2NzAuMzQgNjMuODgxMSA2NjAuMzc1IDUzLjkxNjIgNjQ4LjA4OCA1My45MTYySDQ1MS45ODRDNDM5LjcyMiA1My45MTYyIDQyOS43NjkgNDMuOTc1OCA0MjkuNzY5IDMxLjcwMDlWMjIuMjE1MkM0MjkuNzY5IDkuOTUyNjIgNDE5LjgyOSAwIDQwNy41NTQgMEgyMi4yMTUzQzkuOTUyNjQgMCAwIDkuOTQwMzQgMCAyMi4yMTUyVjc4Mi44NjZDMCA3OTUuMTUzIDkuOTY0ODkgODA1LjExOCAyMi4yNTIxIDgwNS4xMThIMjIuMjM5OVoiIGZpbGw9ImJsYWNrIi8+CjwvZz4KPC9zdmc+Cg==');
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
}
.hub__foto {
  position: absolute;
  top: -15.2075rem;                  /* -243.32 */
  left: -47.9656rem;                 /* -767.45 */
  width: 105.05rem;                  /* 1680.8 */
  height: 69.9688rem;                /* 1119.5 */
  max-width: none;
  opacity: 0.78;
}
.hub__detalle {
  position: absolute;
  top: 23.1438rem;                   /* 370.3 */
  left: 5.7663rem;                   /* 92.26 */
  width: 39.8844rem;                 /* 638.15 */
  height: 50.85rem;                  /* 813.6 */
  max-width: none;
}
.hub__forma { inset: 0; width: 100%; height: 100%; }
/* Tinte de marca sobre la foto */
.hub__tinte { inset: 0; width: 100%; height: 100%; mix-blend-mode: color; }

.hub__subrayado {
  top: 9.1313rem;                    /* 146.1 */
  left: 6.5213rem;                   /* 104.34 */
  width: 28.8438rem;                 /* 461.5 */
  height: 4.8875rem;                 /* 78.2 */
}
.hub__arte p {
  position: absolute;
  color: var(--c-cream);
  line-height: normal;
}
.hub__l1 { top: 9.5625rem; left: 8.3156rem;  width: 13.525rem;  font-size: 1.75rem; font-weight: 400; }
.hub__l2 { top: 9.5625rem; left: 25.1688rem; width: 5.4563rem;  font-size: 1.75rem; font-weight: 400; }
.hub__l3 { top: 13.15rem;  left: 10.6938rem; width: 20.4938rem; font-size: 3.9069rem; font-weight: 300; white-space: nowrap; }

/* ============================== PROTECCION ============================== */

.proteccion__texto {
  position: absolute;
  top: 211.2469rem;                  /* 3379.95 */
  left: 62.5rem;                     /* 1000 */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3.875rem;                     /* 62 */
  width: 49.0625rem;                 /* 785 */
  color: var(--c-primary);
}
.proteccion__titulo {
  width: 49.6511rem;                 /* 794.418 */
  font-size: 4.0625rem;              /* 65 */
  font-weight: 200;
  line-height: normal;
}
.proteccion__bajada {
  width: 100%;
  height: 4.5rem;                    /* 72 */
  font-size: 1.5rem;
  font-weight: 300;
  line-height: 2.8116rem;            /* 44.985 */
}

/* Fotos: el espejo va en el contenedor, igual que en el FAQ */
.foto-card { position: absolute; overflow: hidden; }
.foto-card__flip { position: absolute; inset: 0; transform: scaleX(-1); }
.foto-card img { position: absolute; max-width: none; }

.proteccion__f1 {
  top: 206.7469rem; left: 33.7325rem;              /* 3307.95 / 539.72 */
  width: 14.3594rem; height: 14.3344rem;           /* 229.75 x 229.35 */
  border-radius: 1.4058rem;                        /* 22.492 */
  box-shadow: 0 1.2652rem 2.8116rem rgba(143, 70, 100, 0.35);
}
.proteccion__f1 img { left: -68.4%; top: -44.07%; width: 242.59%; height: 243.01%; }

.proteccion__f2 {
  top: 215.4094rem; left: 15.6025rem;              /* 3446.55 / 249.64 */
  width: 14.2971rem; height: 14.2721rem;           /* 228.753 x 228.354 */
  border-radius: 1.4058rem;
  box-shadow: 0 1.2652rem 2.8116rem rgba(143, 70, 100, 0.35);
}
.proteccion__f2 img { left: -26.87%; top: -16.78%; width: 149.79%; height: 150.05%; }

.proteccion__f3 {
  top: 225.7163rem; left: 33.7325rem;              /* 3611.46 / 539.72 */
  width: 14.2971rem; height: 14.2971rem;
  border-radius: 1.3125rem;                        /* 21 */
  box-shadow: 0 1.125rem 2.5313rem rgba(143, 70, 100, 0.35);
}
.proteccion__f3 img { left: -58.52%; top: -39.89%; width: 185.9%; height: 185.9%; }

/* ============================ MAPA NACIONAL ============================= */

.mapa-seccion {
  position: absolute;
  top: 248.5438rem;                  /* 3976.7 */
  left: 0;
  width: 123.75rem;
  height: 66.4446rem;                /* 1063.113 */
  background: #E7E8EB;
}

.mapa {
  position: absolute;
  top: 255.2744rem;                  /* 4084.39 */
  left: 15.5231rem;                  /* 248.37 */
  width: 77.25rem;                   /* 1236 */
  height: 54.5rem;                   /* 872 */
  overflow: hidden;
}
.mapa__t { position: absolute; display: block; max-width: none; }
.mapa__t img { position: absolute; display: block; max-width: none; }
.mapa__sello { position: absolute; top: 66.35%; left: 5.18%; width: 15.70%; height: 22.14%; overflow: hidden; }

.mapa__leyenda {
  position: absolute;
  top: 270.8606rem;                  /* 4333.77 (centro) */
  left: 71.8706rem;                  /* 1149.93 */
  width: 43.1346rem;                 /* 690.153 */
  height: 11.4rem;                   /* 182.399 */
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 3rem;                   /* 48 */
  font-weight: 200;
  line-height: normal;
  color: #4C4C4C;
}

/* ============================= CREDENCIALES ============================= */

.credenciales__panel {
  position: absolute;
  top: 321.3688rem;                  /* 5141.9 */
  left: 15.5625rem;                  /* 249 */
  width: 92.625rem;                  /* 1482 */
  height: 60.5065rem;                /* 968.104 */
  border-radius: 0.9375rem;          /* 15 */
  background: linear-gradient(to bottom, #FFEEE7, #F9E9EC);
}

.credenciales__grid {
  position: absolute;
  top: 326.3719rem;                  /* 5221.95 */
  left: 20.2954rem;                  /* 324.727 */
  width: 83.1591rem;                 /* 1330.546 */
  height: 50.5rem;                   /* 808 */
}

.cred {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.4618rem;                    /* 23.389 */
  width: 14.2311rem;                 /* 227.698 */
  color: var(--c-primary);
}

.cred__cifra {
  width: 100%;
  font-size: 4.1274rem;              /* 66.039 */
  font-weight: 200;
  line-height: normal;
}
.cred__cifra--texto {
  font-size: 2.7902rem;              /* 44.643 */
  font-weight: 300;
}

.cred__linea {
  width: 4.4604rem;                  /* 71.367 */
  height: var(--linea-2);
  border-radius: 0.0625rem;
  background: var(--c-primary);
  flex: none;
}

.cred__label {
  width: 100%;
  font-size: 1.4558rem;              /* 23.292 */
  font-weight: 400;
  line-height: 2.4263rem;            /* 38.82 */
}

/* Rejilla 4 x 2 */
.cred--c1 { left: 3.5469rem; }
.cred--c2 { left: 24.9619rem; }
.cred--c3 { left: 46.3769rem; }
.cred--c4 { left: 67.7913rem; }
.cred--r1 { top: 4.9944rem; }
.cred--r2 { top: 31.4944rem; }

/* ========================== ENFOQUE ESTRATEGICO ======================== */

.enfoque__titulo {
  position: absolute;
  top: 399.2419rem;                  /* 6387.87 (centro) */
  left: 15.6206rem;                  /* 249.93 */
  width: 44.5525rem;                 /* 712.84 */
  height: 10.3125rem;                /* 165 */
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 4rem;
  font-weight: 200;
  line-height: normal;
  color: var(--c-primary);
}

.enf { position: absolute; }

.enf__forma {
  position: absolute;
  top: 0;
  left: 0;
  height: 28.1021rem;                /* 449.634 */
  max-width: none;
}

.enf__cont {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.6861rem;                    /* 26.978 */
}

.enf__icono {
  position: relative;
  height: 4.8765rem;                 /* 78.024 */
  overflow: hidden;
  flex: none;
}
.enf__icono .capa { position: absolute; display: block; max-width: none; }
.enf__icono .capa img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }

.enf__titulo {
  font-size: 2.2482rem;              /* 35.971 */
  font-weight: 300;
  line-height: normal;
  color: var(--c-primary);
}
.enf__texto {
  font-size: 1.1241rem;              /* 17.985 */
  font-weight: 300;
  line-height: 1.9109rem;            /* 30.575 */
  color: var(--c-primary);
}
.enf__texto p { margin: 0; }

/* --- Tarjeta 1: Analisis estrategico --- */
.enf--1                { top: 387.7106rem; left: 78.17rem; }
.enf--1 .enf__forma    { width: 29.8755rem;
                         filter: drop-shadow(0 0.2248rem 0.1124rem rgba(143, 70, 100, 0.25)); }
.enf--1 .enf__cont     { top: 2.7481rem; left: 2.6975rem; }
.enf--1 .enf__icono    { width: 4.8765rem; }
.enf--1 .enf__titulo   { width: 27.1776rem; }
.enf--1 .enf__texto    { width: 24.1178rem; }

/* --- Tarjeta 2: Configuracion de coberturas --- */
.enf--2                { top: 416.9994rem; left: 15.5456rem; }
.enf--2 .enf__forma    { width: 30.1894rem; }
.enf--2 .enf__cont     { top: 2.6744rem; left: 3.3419rem; }
.enf--2 .enf__icono    { width: 4.9161rem; }
.enf--2 .enf__titulo,
.enf--2 .enf__texto    { width: 25.2919rem; }

/* --- Tarjeta 3: Red de aseguradoras --- */
.enf--3                { top: 416.9256rem; left: 46.9313rem; }
.enf--3 .enf__forma    { width: 30.034rem; }
.enf--3 .enf__cont     { top: 2.6744rem; left: 3.325rem; }
.enf--3 .enf__icono    { width: 4.9161rem; }
.enf--3 .enf__titulo   { width: 25.3324rem; }
.enf--3 .enf__texto    { width: 22.6247rem; }

/* --- Tarjeta 4: Acompanamiento constante --- */
.enf--4                { top: 416.9994rem; left: 78.1619rem; }
.enf--4 .enf__forma    { width: 30.0339rem; }
.enf--4 .enf__cont     { top: 2.6744rem; left: 3.3337rem; }
.enf--4 .enf__icono    { width: 4.9161rem; }
.enf--4 .enf__titulo   { width: 25.2348rem; }
.enf--4 .enf__texto    { width: 23.3243rem; }

/* ========================== BANDA FOTOGRAFICA ========================== */
/* Frame 40: la foto desborda el alto declarado del frame y la seccion
   oscura siguiente se superpone encima. */

/* La foto se queda quieta arriba mientras la pestaña gris de "Continuidad"
   sube por encima. Es `position: sticky` puro: el riel absoluto marca el
   tramo y la foto se pega al borde superior del viewport mientras dura.

       alto del riel = (arranque de la pestaña − arranque de la foto) + alto
                     = (523.5081 − 450.875) + 76.8315 = 149.4646rem

   Con ese alto la foto se suelta justo cuando el borde superior de la
   pestaña llega al borde superior del viewport, o sea cuando ya la tapa por
   completo. El cálculo no depende del alto del viewport. */
.banda-track {
  position: absolute;
  top: 450.875rem;                   /* 7114 + 100 de padding */
  left: 0;
  width: 123.75rem;
  height: 149.4646rem;
  pointer-events: none;              /* el riel invade la sección siguiente */
}

.banda-equipo {
  position: sticky;
  top: 0;
  width: 123.75rem;
  height: 76.8315rem;                /* 1229.304 */
  overflow: hidden;
}
.banda-equipo img {
  position: absolute;
  left: 0;
  top: -27.67%;
  width: 100%;
  height: 142.83%;
  max-width: none;
  transform: scaleX(-1);             /* Figma: left-full + ancho negativo */
}

/* ===================== CONTINUIDAD Y RESPALDO (oscura) ================== */
/* El fondo es una forma con pestaña: el borde superior sube en los
   primeros 632px y baja en el resto (Union de dos rectangulos). */

.continuidad__fondo {
  position: absolute;
  top: 523.5081rem;                  /* 8376.13 */
  left: 0;
  width: 123.75rem;
  height: 155.0875rem;               /* 2481.4 */
}
.continuidad__fondo img { width: 100%; height: 100%; }

/* El titular se queda centrado en vertical mientras las tarjetas blancas de
   la derecha desfilan a su lado. También es `position: sticky` puro: el riel
   va desde su posición del artboard hasta la base de la cuarta tarjeta
   (638.1875 + 29.1875 = 667.375rem), y el `top` descuenta media altura del
   propio titular para que el anclaje quede centrado y no pegado arriba. */
.continuidad__titulo-track {
  position: absolute;
  top: 549.6875rem;                  /* 8795 */
  left: 15.625rem;                   /* 250 */
  width: 43.75rem;                   /* 700 */
  height: 117.6875rem;               /* hasta la base de .cont-card--4 */
  pointer-events: none;
}

.continuidad__titulo {
  position: sticky;
  top: calc(50vh - 6.6716rem);       /* centro del viewport − media altura */
  width: 100%;
  height: 13.3432rem;                /* 213.491 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 4rem;
  font-weight: 200;
  line-height: normal;
  color: #E7E8EB;
}

.cont-card {
  position: absolute;
  left: 62.5rem;                     /* 1000 */
  width: 37.5302rem;                 /* 600.483 */
  height: 29.1875rem;                /* 467 */
}
.cont-card--1 { top: 545rem; }       /* 8720 */
.cont-card--2 { top: 576.0625rem; }  /* 9217 */
.cont-card--3 { top: 607.125rem; }   /* 9714 */
.cont-card--4 { top: 638.1875rem; }  /* 10211 */

.cont-card__forma { position: absolute; inset: 0; width: 100%; height: 100%; }

.cont-card__cont { position: absolute; }
.cont-card--1 .cont-card__cont { top: 4.205rem;  left: 6.3731rem; width: 21.7554rem; }
.cont-card--2 .cont-card__cont { top: 5.0388rem; left: 6.375rem;  width: 24.75rem; }
.cont-card--3 .cont-card__cont { top: 7.6813rem; left: 6.375rem;  width: 22.25rem; }
.cont-card--4 .cont-card__cont { top: 4.2138rem; left: 6.3625rem; width: 22.3693rem; }

.cont-card__titulo {
  font-size: 2.5rem;                 /* 40 */
  font-weight: 300;
  line-height: normal;
  color: #4C4C4C;
}
.cont-card--1 .cont-card__titulo { width: 20.4521rem; }
.cont-card--2 .cont-card__titulo { width: 15.9192rem; }
.cont-card--3 .cont-card__titulo { width: 22.2529rem; }
.cont-card--4 .cont-card__titulo { width: 15.9192rem; }

/* La vineta cuadrada era en el maquetado original un <span> por renglon,
   colocado a mano con el `top` que le tocaba. Eso ataba la lista a tener
   exactamente los renglones del diseno: anadir uno desde el editor dejaba
   la vineta atras. Ahora es el ::before del propio parrafo, asi que cae
   sola en su sitio, respeta los renglones que ocupan dos lineas y admite
   cualquier numero de puntos. */
.cont-card__lista {
  position: absolute;
  left: 0;
  width: 100%;
  --vineta-hueco: 1.3038rem;         /* 20.86 — separacion vineta ↔ texto */
  --vineta-anidada: 1.5871rem;       /* sangria extra de los renglones hijos */
}
.cont-card__lista p {
  position: relative;
  margin: 0;
  padding-left: var(--vineta-hueco);
  font-size: 1.0581rem;              /* 16.929 */
  font-weight: 400;
  line-height: 1.7635rem;            /* 28.216 */
  color: #4C4C4C;
  white-space: pre-wrap;
}
.cont-card__lista p.anidado {
  padding-left: calc(var(--vineta-hueco) + var(--vineta-anidada));
}

.cont-card__lista p::before {
  content: '';
  position: absolute;
  top: 0.5519rem;                    /* alineada con la primera linea */
  left: 0;
  width: 0.6364rem;                  /* 10.183 */
  height: 0.6364rem;
  background: #4C4C4C;
}
.cont-card__lista p.anidado::before { left: var(--vineta-anidada); }

/* Anchos de la columna de texto por tarjeta.
   En Figma el ancho indicado es el del TEXTO, que ya va desplazado por la
   sangria de la vineta: el contenedor mide sangria + ancho de texto. */
.cont-card--1 .cont-card__lista { width: 21.7378rem; }   /* 20.86 + 326.945 */
.cont-card--2 .cont-card__lista { width: 24.72rem; }     /* 20.86 + 374.66  */
.cont-card--3 .cont-card__lista { width: 21.7378rem; }   /* 20.86 + 326.945 */
.cont-card--4 .cont-card__lista { width: 22.387rem; }    /* 20.42 + 337.772 */
.cont-card--4 .cont-card__lista {
  --vineta-hueco: 1.2763rem;         /* 20.42 */
  --vineta-anidada: 1.6519rem;
}


/* =========================== NUESTRA ESTRUCTURA ========================= */

.estructura__intro {
  position: absolute;
  top: 691.0275rem;                  /* 11056.44 */
  left: 15.625rem;                   /* 250 */
  width: 79.8544rem;                 /* 1277.67 */
  height: 16.4218rem;                /* 262.748 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 4rem;
  font-weight: 200;
  line-height: normal;
  color: var(--c-primary);
}

.estructura__grid {
  position: absolute;
  top: 713.5275rem;                  /* 11416.44 */
  left: 6.3531rem;                   /* 101.65 */
  width: 111.0431rem;                /* 1776.694 */
  height: 46.2106rem;                /* 739.373 */
}

.est {
  position: absolute;
  width: 26.3546rem;                 /* 421.674 */
  height: 22.1679rem;                /* 354.687 */
}
.est__forma { position: absolute; inset: 0; width: 100%; height: 100%; }
.est__foto  { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.est__cont {
  position: absolute;
  top: 1.8688rem;                    /* 29.9 */
  left: 3.3469rem;                   /* 53.55 */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 20.0938rem;                 /* 321.5 */
  height: 17.6738rem;                /* 282.781 */
  background: var(--c-white);
}

/* .est__cont reparte sus tres piezas con `space-between`, asi que la altura
   del titulo decide donde cae el icono. El maquetado original la fijaba
   metiendo un segundo parrafo vacio (&#8203;) en los titulos de una linea:
   un apano del exportador de Figma que ademas obligaba a que cada titulo
   trajera su relleno. Dos renglones de minimo hacen lo mismo y valen para
   cualquier texto que escriba el editor. */
.est__titulo {
  width: 100%;
  min-height: 2lh;
  font-size: 2rem;                   /* 32 */
  font-weight: 300;
  line-height: normal;
  color: var(--c-primary);
}
.est__titulo--sm { font-size: 1.875rem; }   /* 30 */
.est__titulo p { margin: 0; }

.est__icono { position: relative; flex: none; }
.est__icono .capa { position: absolute; display: block; max-width: none; }
.est__icono .capa img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }
.est__icono > img { width: 100%; height: 100%; }

.est__texto {
  width: 100%;
  height: 4.1906rem;                 /* 67.049 */
  font-size: 1.3663rem;              /* 21.86 */
  font-weight: 400;
  line-height: 2.2771rem;            /* 36.433 */
  color: var(--c-primary);
}

/* Rejilla 4 x 2 (gap 30) */
.est--c1 { left: 0; }
.est--c2 { left: 28.2294rem; }       /* 451.67 */
.est--c3 { left: 56.4594rem; }       /* 903.35 */
.est--c4 { left: 84.6888rem; }       /* 1355.02 */
.est--r1 { top: 0; }
.est--r2 { top: 24.0431rem; }        /* 384.69 */

/* Tamanos de icono */
.ic-ventas      { width: 3.793rem;  height: 3.8737rem; }
.ic-cobranza    { width: 3.875rem;  height: 3.9375rem; }
.ic-areas       { width: 3.5625rem; height: 4.6875rem; overflow: hidden; }
.ic-operaciones { width: 2.9375rem; height: 3.625rem; }
.ic-atencion    { width: 3.5625rem; height: 3.3125rem; }
.ic-siniestros  { width: 3.1875rem; height: 3.875rem; }
.ic-tecnica     { width: 3.375rem;  height: 3.125rem; }

/* ============================ BANNER ATARDECER ========================= */

.banner {
  position: absolute;
  top: 770.1994rem;                  /* 12323.19 */
  left: 7.4331rem;                   /* 118.93 */
  width: 108.8836rem;                /* 1742.137 */
  height: 55.7773rem;                /* 892.437 */
  overflow: hidden;
  -webkit-mask-image: url('data:image/svg+xml;base64,PHN2ZyBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIiBvdmVyZmxvdz0idmlzaWJsZSIgc3R5bGU9ImRpc3BsYXk6IGJsb2NrOyIgd2lkdGg9IjE3NDIuMTQiIGhlaWdodD0iODkyLjQzNyIgdmlld0JveD0iMCAwIDE3NDIuMTQgODkyLjQzNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggaWQ9IlN1YnRyYWN0IiBkPSJNMTI1Mi44NSA0MS4zNTE2QzEyNTIuODUgNDkuNjM1OCAxMjU5LjU3IDU2LjM1MTYgMTI2Ny44NSA1Ni4zNTE2SDE3MjcuMTRDMTczNS40MiA1Ni4zNTE2IDE3NDIuMTQgNjMuMDY3MyAxNzQyLjE0IDcxLjM1MTZWODc3LjQzN0MxNzQyLjE0IDg4NS43MjEgMTczNS40MiA4OTIuNDM3IDE3MjcuMTQgODkyLjQzN0g0NjYuNzM2QzQ1OC40NTIgODkyLjQzNyA0NTEuNzM2IDg4NS43MjEgNDUxLjczNiA4NzcuNDM3Vjg1MS4wOTlDNDUxLjczNiA4NDIuODE0IDQ0NS4wMjEgODM2LjA5OSA0MzYuNzM2IDgzNi4wOTlIMTVDNi43MTU3MyA4MzYuMDk5IDAgODI5LjM4MyAwIDgyMS4wOTlWMjE1LjQ2MkMwIDIwNy4xNzggNi43MTU3MyAyMDAuNDYyIDE1IDIwMC40NjJINDEuNDc1NkM0OS43NTk5IDIwMC40NjIgNTYuNDc1NiAxOTMuNzQ2IDU2LjQ3NTYgMTg1LjQ2MlYxNUM1Ni40NzU2IDYuNzE1NzMgNjMuMTkxMyAwIDcxLjQ3NTYgMEgxMjM3Ljg1QzEyNDYuMTQgMCAxMjUyLjg1IDYuNzE1NzMgMTI1Mi44NSAxNVY0MS4zNTE2WiIgZmlsbD0idXJsKCNwYWludDBfbGluZWFyXzIwMDRfMTU0NSkiLz4KPGRlZnM+CjxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhcl8yMDA0XzE1NDUiIHgxPSI0Ni4yOTUyIiB5MT0iMTE2My43OSIgeDI9IjEzNjEuNTMiIHkyPSIzMjEuMTYyIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CjxzdG9wIHN0b3AtY29sb3I9IiM5NTFGOTkiLz4KPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjRUY2MDYwIi8+CjwvbGluZWFyR3JhZGllbnQ+CjwvZGVmcz4KPC9zdmc+Cg==');
          mask-image: url('data:image/svg+xml;base64,PHN2ZyBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIiBvdmVyZmxvdz0idmlzaWJsZSIgc3R5bGU9ImRpc3BsYXk6IGJsb2NrOyIgd2lkdGg9IjE3NDIuMTQiIGhlaWdodD0iODkyLjQzNyIgdmlld0JveD0iMCAwIDE3NDIuMTQgODkyLjQzNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggaWQ9IlN1YnRyYWN0IiBkPSJNMTI1Mi44NSA0MS4zNTE2QzEyNTIuODUgNDkuNjM1OCAxMjU5LjU3IDU2LjM1MTYgMTI2Ny44NSA1Ni4zNTE2SDE3MjcuMTRDMTczNS40MiA1Ni4zNTE2IDE3NDIuMTQgNjMuMDY3MyAxNzQyLjE0IDcxLjM1MTZWODc3LjQzN0MxNzQyLjE0IDg4NS43MjEgMTczNS40MiA4OTIuNDM3IDE3MjcuMTQgODkyLjQzN0g0NjYuNzM2QzQ1OC40NTIgODkyLjQzNyA0NTEuNzM2IDg4NS43MjEgNDUxLjczNiA4NzcuNDM3Vjg1MS4wOTlDNDUxLjczNiA4NDIuODE0IDQ0NS4wMjEgODM2LjA5OSA0MzYuNzM2IDgzNi4wOTlIMTVDNi43MTU3MyA4MzYuMDk5IDAgODI5LjM4MyAwIDgyMS4wOTlWMjE1LjQ2MkMwIDIwNy4xNzggNi43MTU3MyAyMDAuNDYyIDE1IDIwMC40NjJINDEuNDc1NkM0OS43NTk5IDIwMC40NjIgNTYuNDc1NiAxOTMuNzQ2IDU2LjQ3NTYgMTg1LjQ2MlYxNUM1Ni40NzU2IDYuNzE1NzMgNjMuMTkxMyAwIDcxLjQ3NTYgMEgxMjM3Ljg1QzEyNDYuMTQgMCAxMjUyLjg1IDYuNzE1NzMgMTI1Mi44NSAxNVY0MS4zNTE2WiIgZmlsbD0idXJsKCNwYWludDBfbGluZWFyXzIwMDRfMTU0NSkiLz4KPGRlZnM+CjxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhcl8yMDA0XzE1NDUiIHgxPSI0Ni4yOTUyIiB5MT0iMTE2My43OSIgeDI9IjEzNjEuNTMiIHkyPSIzMjEuMTYyIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CjxzdG9wIHN0b3AtY29sb3I9IiM5NTFGOTkiLz4KPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjRUY2MDYwIi8+CjwvbGluZWFyR3JhZGllbnQ+CjwvZGVmcz4KPC9zdmc+Cg==');
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
}
/* La foto es mas ancha que la mascara: Figma la encuadra desplazada */
.banner img {
  position: absolute;
  left: -9.61%;
  top: -34.50%;
  width: 121.17%;
  height: 151.18%;
  max-width: none;
}

.banner__texto {
  position: absolute;
  top: 808.6706rem;                  /* 12938.73 (centro) */
  left: 15.6206rem;                  /* 249.93 */
  width: 79.8544rem;                 /* 1277.67 */
  transform: translateY(-50%);
  font-size: 4rem;
  font-weight: 200;
  line-height: normal;
  color: var(--c-cream);
}

.banner__sello {
  position: absolute;
  top: 778.2131rem;                  /* 12451.41 */
  left: 84.4375rem;                  /* 1351 */
  width: 20rem;                      /* 320 */
  height: 19.875rem;                 /* 318 */
  overflow: hidden;
}
.banner__sello img { position: absolute; display: block; max-width: none; }

/* ============================== TESTIMONIOS ============================= */

.testimonios__titulo {
  position: absolute;
  top: 836.8419rem;                  /* 13389.47 (centro) */
  left: 15.6206rem;                  /* 249.93 */
  width: 44.5525rem;                 /* 712.84 */
  height: 10.3125rem;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 4rem;
  font-weight: 200;
  line-height: normal;
  color: var(--c-primary);
}

/* Las dos flechas exportadas de Figma son los dos ESTADOS del mismo botón,
   no dos botones distintos:

     flecha-izq.svg  círculo crema con borde rosa  → estado normal
     flecha-der.svg  círculo rosa relleno          → estado hover

   Cada una apunta hacia su lado, así que en el botón donde la dirección no
   coincide se gira 180°: el círculo es concéntrico y queda igual. El cambio
   de estado es un cruce de opacidad entre las dos capas. */
.testimonios__nav {
  position: absolute;
  top: 834.7525rem;                  /* 13356.04 */
  width: 4.179rem;                   /* 66.864 */
  height: 4.179rem;
  transition: transform var(--t-medio) var(--e-suave);
}
.testimonios__nav--prev { left: 96.9975rem; }   /* 1551.96 */
.testimonios__nav--next { left: 103.9956rem; }  /* 1663.93 */

.testimonios__nav img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transition: opacity var(--t-medio) var(--e-suave);
}
.testimonios__nav-hover { opacity: 0; }
.testimonios__nav:hover .testimonios__nav-normal,
.testimonios__nav:focus-visible .testimonios__nav-normal { opacity: 0; }
.testimonios__nav:hover .testimonios__nav-hover,
.testimonios__nav:focus-visible .testimonios__nav-hover { opacity: 1; }

/* Se gira la capa cuya flecha mira al lado contrario del botón */
.testimonios__nav--prev .testimonios__nav-hover,
.testimonios__nav--next .testimonios__nav-normal { transform: rotate(180deg); }

.testimonios__nav:active { transform: scale(0.94); }
.testimonios__nav.slick-disabled { opacity: 0.35; pointer-events: none; }

/* --- Carrusel (Slick) --------------------------------------------------
   El riel se extiende medio hueco a cada lado para que, con el margen
   interior de cada diapositiva, las tarjetas caigan en las mismas
   posiciones del artboard: 36.1864rem de ancho y 1.3784rem de separación.
   -------------------------------------------------------------------- */
.testimonios__slider {
  position: absolute;
  top: 844.3756rem;                  /* 13510.01 */
  left: 5.5608rem;                   /* 6.25 − medio hueco */
  width: 112.6944rem;
}
.testi-slide { padding: 0 0.6892rem; }          /* medio hueco */
.testi-slide:focus,
.testi-slide:focus-visible { outline: none; }

/* Reparto antes de que Slick tome el control: evita el salto inicial */
.testimonios__slider:not(.slick-initialized) { display: flex; }
.testimonios__slider:not(.slick-initialized) .testi-slide {
  flex: none;
  width: 37.5648rem;
}
.testimonios__slider:not(.slick-initialized) .testi-slide:nth-child(n + 4) { display: none; }

.testi {
  position: relative;
  height: 42.7081rem;                /* 683.329 */
  border-radius: 0.9375rem;
  background: linear-gradient(to bottom, #FFEEE7, #F9E9EC);
  overflow: hidden;
  transition:
    transform  var(--t-largo) var(--e-suave),
    box-shadow var(--t-largo) var(--e-suave);
}
.testi:hover {
  transform: translateY(-0.5rem);
  box-shadow: 0 1rem 2.25rem rgba(143, 70, 100, 0.18);
}

.testi__cont {
  position: absolute;
  top: 3.6869rem;                    /* 13569 − 13510 */
  left: 4.4625rem;                   /* 10.7125 − 6.25 */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 27.2666rem;
  height: 34.75rem;
  color: var(--c-primary);
}

.testi__cita {
  width: 100%;
  font-size: 1.5rem;
  font-weight: 300;
  line-height: 2.8116rem;
}

.testi__autor {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  width: 100%;
}
.testi__avatar { width: 4.1948rem; height: 4.1948rem; border-radius: 50%; }
.testi__nombre { font-size: 1.5rem; font-weight: 700; line-height: 2.8116rem; }
.testi__rol    { font-size: 1.5rem; font-weight: 300; line-height: 2.8116rem; }

/* ======================= TU EXPERIENCIA (formulario) ==================== */

.experiencia__panel {
  position: absolute;
  top: 893.8125rem;                  /* 14301 */
  left: 6.25rem;                     /* 100 */
  width: 111.25rem;                  /* 1780 */
  height: 32.25rem;                  /* 516 */
  border-radius: 0.9375rem;
  background: var(--c-white);
  overflow: hidden;
}

.experiencia__texto {
  position: absolute;
  top: 900.1875rem;                  /* 14403 */
  left: 13.5rem;                     /* 216 */
  width: 21.3125rem;                 /* 341 */
  height: 20rem;                     /* 320 */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  color: var(--c-primary);
}
.experiencia__titulo  { width: 100%; font-size: 2rem; font-weight: 200; line-height: normal; }
.experiencia__bajada  { width: 100%; height: 5.25rem; font-size: 1.0581rem; font-weight: 400; line-height: 1.7635rem; }

.exp-campo {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.9375rem;                    /* 15 */
}
.exp-campo input {
  width: 100%;
  font-size: 1.5rem;
  font-weight: 300;
  line-height: 2.8116rem;
  color: #4C4C4C;
  outline: none;
}
.exp-campo input::placeholder { color: rgba(76, 76, 76, 0.3); }
.exp-campo__linea {
  width: 27.9797rem;                 /* 447.675 */
  height: var(--linea-2);
  background: var(--c-primary);
  flex: none;
}

.exp-campo--1 { top: 900.1875rem; left: 46.4792rem; width: 31.25rem; }
.exp-campo--2 { top: 900.1875rem; left: 79.4583rem; width: 30.7917rem; }
.exp-campo--3 { top: 908.2083rem; left: 46.4792rem; width: 31.25rem; }
.exp-campo--4 { top: 908.2083rem; left: 79.4583rem; width: 30.7917rem; }

.experiencia__cta {
  position: absolute;
  top: 916.25rem;                    /* 14660 */
  left: 46.5rem;                     /* 744 */
  width: 60.625rem;                  /* 970 */
}