/* Portada: "Nuestras soluciones" (lo genera herramientas/soluciones_portada.py)
   Como la sección original: una tarjeta por gama con lista de ventajas y carrusel de robots.
   En escritorio, las tarjetas se apilan unas sobre otras al hacer scroll. */
.amv-sol { padding: clamp(56px, 8vw, 112px) clamp(16px, 4vw, 32px); font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; color: #16181d; }
.amv-sol *, .amv-sol *::before, .amv-sol *::after { box-sizing: border-box; }
.amv-sol img { border-radius: 0 !important; box-shadow: none !important; }
.amv-sol ul { list-style: none; margin: 0; padding: 0; }
.amv-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.amv-sol__dentro { max-width: 1120px; margin: 0 auto; }
.amv-sol__intro { text-align: center; max-width: 680px; margin: 0 auto clamp(28px, 4vw, 48px); }
.amv-sol__ante { margin: 0 0 8px; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #1f8f91; }
.amv-sol__h { margin: 0 0 10px !important; font-family: "Poppins", sans-serif !important; font-weight: 700 !important; color: #16181d !important; }
.amv-sol__sub { margin: 0; font-size: 15px; line-height: 1.6; color: #5f6570; }

/* Pila de tarjetas */
.amv-sol__pila { display: flex; flex-direction: column; gap: 24px; }
.amv-sol__tarjeta { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: clamp(24px, 4vw, 56px); align-items: center; padding: clamp(28px, 3.6vw, 48px); border-radius: 32px; background: rgba(250, 251, 252, .92); -webkit-backdrop-filter: blur(24px) saturate(1.5); backdrop-filter: blur(24px) saturate(1.5); box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 18px 50px rgba(15, 23, 42, .07); }
@media (min-width: 1025px) and (min-height: 760px) {
  .amv-sol__tarjeta { position: sticky; top: calc(96px + var(--i, 0) * 18px); }
  /* Para que se note la tarjeta que sube: fondo opaco, filo claro arriba, sombra hacia arriba
     y la de debajo se encoge y se oscurece un poco (--tapada lo pone el script, de 0 a 1) */
  .amv-sol__tarjeta { background: #fff; border: 1px solid rgba(15, 23, 42, .07); transform-origin: 50% 0; transform: scale(calc(1 - var(--tapada, 0) * .045)); will-change: transform; }
  .amv-sol__tarjeta + .amv-sol__tarjeta { box-shadow: 0 -1px 0 rgba(255, 255, 255, .9) inset, 0 -18px 44px rgba(15, 23, 42, .12), 0 18px 50px rgba(15, 23, 42, .07); }
  .amv-sol__tarjeta::after { content: ""; position: absolute; inset: -1px; border-radius: inherit; background: #0f172a; opacity: calc(var(--tapada, 0) * .14); pointer-events: none; }
  .amv-sol__tarjeta::before { content: ""; position: absolute; top: 0; left: 48px; right: 48px; height: 3px; border-radius: 0 0 3px 3px; background: linear-gradient(90deg, rgba(42, 171, 173, 0), #2aabad 30%, #7fdadc 70%, rgba(42, 171, 173, 0)); }
}

/* Texto */
.amv-sol__num { margin: 0 0 6px; font-size: 13px; font-weight: 600; letter-spacing: .08em; color: #1f8f91; }
.amv-sol__titulo { margin: 0 0 8px !important; font-family: "Poppins", sans-serif !important; font-size: clamp(26px, 18px + 1.7vw, 40px) !important; font-weight: 700 !important; line-height: 1.08 !important; letter-spacing: -.025em !important; color: #16181d !important; text-wrap: balance; }
.amv-sol__titulo a { color: inherit !important; text-decoration: none; transition: color .2s ease; }
.amv-sol__titulo a:hover { color: #1f8f91 !important; }
.amv-sol__lema { margin: 0 0 18px; font-size: 15px; line-height: 1.6; color: #5f6570; max-width: 460px; }
.amv-sol__lista { margin-bottom: 24px !important; max-width: 480px; }
.amv-sol__lista li { display: flex; align-items: center; gap: 16px; padding: 13px 0; border-bottom: 1px solid rgba(22, 24, 29, .08); font-size: 15px; line-height: 1.45; color: #16181d; }
.amv-sol__lista li:last-child { border-bottom: 0; }
.amv-sol__icono { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; color: #1f8f91; background: rgba(42, 171, 173, .1); transition: background-color .3s ease, color .3s ease, transform .4s cubic-bezier(.32, .72, 0, 1); }
.amv-sol__icono svg { width: 22px; height: 22px; }
.amv-sol__lista li:hover .amv-sol__icono { background: #2aabad; color: #fff; transform: rotate(-6deg); }
.amv-sol .amv-sol__info { display: inline-flex; align-items: center; height: 46px; padding: 0 26px; border-radius: 999px; font-size: 14.5px; font-weight: 600; text-decoration: none; background: #2aabad; color: #fff !important; border: 1px solid #2aabad; transition: background-color .2s ease, color .2s ease; }
.amv-sol .amv-sol__info:hover { background: #fff; color: #2aabad !important; }

/* Carrusel */
.amv-sol__carrusel { position: relative; padding: 22px 22px 18px; border-radius: 28px; background: #fff; }
.amv-sol__pista { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.amv-sol__pista::-webkit-scrollbar { display: none; }
.amv-sol__slide { position: relative; flex: 0 0 100%; scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; text-align: center; }
.amv-sol__foto { display: block; width: 100%; max-width: 330px; aspect-ratio: 1 / 1; }
.amv-sol__foto img { width: 100% !important; height: 100% !important; object-fit: contain; transition: transform .6s cubic-bezier(.32, .72, 0, 1); }
.amv-sol__foto:hover img { transform: scale(1.04); }
.amv-sol__desc { margin: 4px 0 14px; font-size: 13.5px; color: #5f6570; }
.amv-sol .amv-sol__ver { display: inline-flex; align-items: center; height: 42px; padding: 0 26px; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; color: #16181d !important; background: transparent; border: 1px solid #2aabad; transition: background-color .2s ease, color .2s ease; }
.amv-sol .amv-sol__ver:hover { background: #2aabad; color: #fff !important; }
.amv-sol__sello { position: absolute; top: 0; left: 0; z-index: 1; padding: 5px 10px; border-radius: 999px; background: #16181d; color: #fff; font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.amv-sol__sello--pronto { background: #fff3e0; color: #8a4b00; }
.amv-sol .amv-sol__flecha { position: absolute; top: 42%; z-index: 2; width: 40px; height: 40px; padding: 0; border-radius: 999px; display: grid; place-items: center; background: #2aabad; color: #fff; border: 1px solid #2aabad !important; cursor: pointer; box-shadow: none; transition: background-color .2s ease, color .2s ease, transform .3s cubic-bezier(.32, .72, 0, 1); }
.amv-sol .amv-sol__flecha:hover { background: #fff; color: #2aabad; }
.amv-sol .amv-sol__flecha:focus-visible { outline: 2px solid #2aabad; outline-offset: 2px; }
.amv-sol__flecha svg { width: 20px; height: 20px; }
.amv-sol__flecha--ant { left: -20px; }
.amv-sol__flecha--sig { right: -20px; }
.amv-sol .amv-sol__flecha--ant:hover { transform: translateX(-2px); }
.amv-sol .amv-sol__flecha--sig:hover { transform: translateX(2px); }
.amv-sol__puntos { display: flex; justify-content: center; gap: 6px; margin-top: 14px; }
.amv-sol .amv-sol__punto { width: 7px; height: 7px; min-height: 0; padding: 0; border-radius: 999px; border: 0 !important; background: rgba(22, 24, 29, .18); cursor: pointer; box-shadow: none; transition: width .35s cubic-bezier(.32, .72, 0, 1), background-color .3s ease; }
.amv-sol .amv-sol__punto[aria-current="true"] { width: 22px; background: #2aabad; }

/* Tablet y móvil */
@media (max-width: 900px) {
  .amv-sol__tarjeta { grid-template-columns: minmax(0, 1fr); border-radius: 28px; }
  .amv-sol__lista, .amv-sol__lema { max-width: none; }
  .amv-sol__flecha--ant { left: 8px; }
  .amv-sol__flecha--sig { right: 8px; }
  .amv-sol__foto { max-width: 280px; }
}
@media (max-width: 520px) {
  .amv-sol__tarjeta { padding: 22px 18px; gap: 20px; }
  .amv-sol__lista li { gap: 12px; padding: 11px 0; font-size: 14.5px; }
  .amv-sol__icono { flex-basis: 36px; width: 36px; height: 36px; }
  .amv-sol .amv-sol__info { width: 100%; justify-content: center; }
  .amv-sol__carrusel { padding: 16px 12px 14px; border-radius: 22px; }
  .amv-sol .amv-sol__flecha { width: 36px; height: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  .amv-sol * { transition: none !important; }
  .amv-sol__pista { scroll-behavior: auto; }
}
