.listado-tours {
position: relative;
padding: 20px 80px;
color: var(--ft-body-text, #202C64);
}
.listado-tours__viewport {
overflow: hidden;
position: relative;
}
.listado-tours__track {
position: relative;
width: 100%;
height: auto;
}
.listado-tours__lista {
display: flex;
list-style: none;
margin: 0;
padding: 0;
will-change: transform;
}
.listado-tours__slide {
flex: 0 0 auto;
box-sizing: border-box;
padding: 0 12px;
}
@media (min-width: 768px) {
.listado-tours__slide--altura-igual {
display: flex;
align-items: stretch;
}
}
.listado-tours__card {
display: flex;
flex-direction: column;
border: 1px solid #202C64;
border-radius: 40px;
overflow: hidden;
height: 100%;
transition: 0.3s ease-in-out;
}
.listado-tours__card:hover {
background: #202C64;
}
.listado-tours__card:hover .listado-tours__titulo, .listado-tours__card:hover .listado-tours__extracto {
color: var(--ft-white, #FFFFFF);
}
.listado-tours__card:hover .listado-tours__extracto a {
color: var(--ft-white, #FFFFFF);
}
.listado-tours__media {
display: block;
width: 100%;
overflow: hidden;
background: var(--ft-light, #F5F5F7);
}
.listado-tours__imagen {
width: 100%;
height: 100%;
object-fit: cover;
aspect-ratio: 1 / 0.61;
display: block;
}
.listado-tours__cuerpo {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
padding: 24px 28px 32px;
gap: 16px;
flex: 1;
}
.listado-tours__titulo {
margin: 0;
font-family: var(--ft-font, "Inter", system-ui, sans-serif);
font-weight: var(--ft-fw-bold, 700);
font-size: 20px;
line-height: 1.25;
color: var(--ft-primary, #202C64);
}
.listado-tours__titulo a {
color: inherit;
text-decoration: none;
transition: color 0.2s ease;
}
.listado-tours__titulo a:hover {
color: var(--ft-secondary, #E42421);
}
.listado-tours__extracto {
margin: 0;
font-family: var(--ft-font, "Inter", system-ui, sans-serif);
font-size: 16px;
line-height: 1.25;
color: var(--ft-body-text, #202C64);
flex: 1;
margin-bottom: 0px !important;
}
.listado-tours__reservar {
display: inline-block;
margin-top: 4px;
padding: 12px 32px;
background: var(--ft-secondary, #E42421);
color: var(--ft-white, #FFFFFF);
font-family: var(--ft-font, "Inter", system-ui, sans-serif);
font-weight: var(--ft-fw-bold, 700);
font-size: 0.9rem;
letter-spacing: 1.5px;
text-transform: uppercase;
text-decoration: none;
border-radius: 999px;
transition: background 0.25s ease, transform 0.2s ease;
}
.listado-tours__reservar:hover,
.listado-tours__reservar:focus {
background: #c91d1a;
color: var(--ft-white, #FFFFFF);
outline: none;
}
.listado-tours__reservar:focus-visible {
box-shadow: 0 0 0 3px rgba(228, 36, 33, 0.4);
} .listado-tours__flecha {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 48px;
height: 48px;
background: var(--ft-primary, #202C64);
color: var(--ft-white, #FFFFFF);
border: none;
border-radius: 6px;
cursor: pointer;
font-size: 1.8rem;
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
transition: background 0.2s ease, transform 0.2s ease;
}
.listado-tours__flecha:hover,
.listado-tours__flecha:focus {
background: #161f4a;
outline: none;
}
.listado-tours__flecha:focus-visible {
box-shadow: 0 0 0 3px rgba(32, 44, 100, 0.4);
}
.listado-tours__flecha:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.listado-tours__flecha--prev {
left: 8px;
}
.listado-tours__flecha--next {
right: 8px;
} @media (max-width: 991px) {
.listado-tours {
padding: 50px 70px;
}
.listado-tours__extracto  {
display: none;
}
} @media (max-width: 767px) {
.listado-tours {
padding: 40px 16px;
}
.listado-tours__viewport {
overflow: visible;
}
.listado-tours__lista {
flex-direction: column;
gap: 20px;
}
.listado-tours__slide {
width: 100%;
padding: 0;
}
.listado-tours__flecha {
display: none;
}
}