@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@1,400;1,500;1,600&display=swap');

/**
 * Estilos específicos para widgets de Priego en Elementor
 */


/* Forzar visibilidad en el editor de Elementor para elementos con reveal */
.elementor-editor-active .scroll-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
}

/* Ajustes del carrusel en el editor */
.elementor-editor-active .carousel-track {
    display: flex !important;
}

.elementor-editor-active .carousel-slide {
    opacity: 1 !important;
    visibility: visible !important;
}

/* ==========================================
/* ==========================================
   TARJETA FLIP (VOLTEABLE) PREMIUM
   ========================================== */
.priego-flip-card {
    /* Curva unica del hover de la tarjeta. Entra despacio y aterriza despacio: las
       curvas tipo (0.22,1,...) recorren el 60% en el primer cuarto de tiempo y eso
       es lo que se percibe como un tiron. La heredan los estilos 2, 3 y 4. */
    --priego-flip-ease: cubic-bezier(0.4, 0.05, 0.25, 1);

    /* Curva del giro. Simetrica a proposito (acelera y frena por igual): un ease-out en
       una rotacion de 180 grados llega al canto en un parpadeo y luego se arrastra. */
    --priego-flip-turn: cubic-bezier(0.62, 0.02, 0.34, 1);

    background-color: transparent;
    perspective: 1300px; /* Mas cerca que antes: el giro gana volumen sin deformar */
    perspective-origin: 50% 45%;
    width: 100%;
    position: relative;
    transition: transform 1.4s var(--priego-flip-ease);
    will-change: transform;
}

/* La tarjeta se aleja un pelin al empezar a girar y avanza al aterrizar. El truco esta en
   los puntos de control fuera del rango 0-1 de la curva: hacen que el valor se pase por
   debajo del inicial y por encima del final, sin keyframes ni JS. */
.priego-flip-card.flip-hover:is(:hover, :focus-within),
.priego-flip-card.flip-click.flipped {
    /* Con la elevacion incluida: esta regla gana por especificidad a
       `.priego-flip-card:hover`, asi que si solo pusiera scale() las tarjetas que giran
       perderian los -6px que si tienen las demas. */
    transform: translateY(-6px) scale(1.03);
    transition-duration: var(--flip-duration, 1.5s);
    transition-timing-function: cubic-bezier(0.45, -0.32, 0.5, 1.28);
}

/* El giro 3D proyecta la cara girada más ancha que la tarjeta; en la última
   columna eso empujaba el ancho de página y aparecía scroll horizontal.
   clip en X contiene la proyección a la caja del widget; visible en Y deja
   ver la elevación (-6px) y la sombra superior/inferior en hover. */
.elementor-widget-priego-flip-card {
    overflow-x: clip;
    overflow-y: visible;
}
/* Elevación de la tarjeta al pasar el cursor */
.priego-flip-card:hover {
    transform: translateY(-6px);
}

/* Enlace de contenedor completo: overlay transparente que hace clicable toda la tarjeta.
   z-index por encima de cualquier capa interna (máx. usado: 20). */
.priego-card-stretched-link {
    position: absolute;
    inset: 0;
    z-index: 40;
    display: block;
    font-size: 0;
    text-indent: -9999px;
    overflow: hidden;
    cursor: pointer;
}
.priego-flip-card:has(> .priego-card-stretched-link) {
    cursor: pointer;
}

/* El enlace que cubre la tarjeta no tenia foco visible: navegando con teclado no habia
   forma de saber donde estabas. El anillo va en oro Priego y por fuera del borde. */
.priego-card-stretched-link:focus-visible {
    outline: 3px solid #c89628;
    outline-offset: 4px;
    border-radius: inherit;
}

/* Con el giro por hover, el reverso era inalcanzable sin raton. Los selectores de giro
   escuchan tambien :focus-within, asi que al tabular al enlace la tarjeta se voltea y su
   contenido se lee igual que con el puntero. */

/* Quien pide menos movimiento en su sistema recibe el cambio de cara sin recorrido:
   la tarjeta sigue funcionando, solo deja de girar, hacer zoom y destellar. */
@media (prefers-reduced-motion: reduce) {
    .priego-flip-card,
    .priego-flip-card-inner,
    .priego-flip-card-front,
    .priego-flip-card-back,
    .priego-flip-bg-overlay,
    .priego-flip-card .back-header h3,
    .priego-flip-card .back-header p,
    .priego-flip-card .back-footer,
    .priego-flip-card .front-header,
    .priego-flip-card .front-footer {
        transition-duration: 0.01ms !important;
        transition-delay: 0ms !important;
    }

    .priego-flip-card.flip-hover:is(:hover, :focus-within),
    .priego-flip-card.flip-click.flipped {
        transform: none;
    }

    .priego-flip-card-front::after,
    .priego-flip-card-back::after {
        display: none;
    }
}

.priego-flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform var(--flip-duration, 1.5s) var(--priego-flip-turn);
    transform-style: preserve-3d;
    will-change: transform;
}

/* DIRECCIONES DE GIRO */
/* Giro Izquierda */
.priego-flip-card.flip-left.flip-hover:is(:hover, :focus-within) .priego-flip-card-inner,
.priego-flip-card.flip-left.flip-click.flipped .priego-flip-card-inner {
    transform: rotateY(-180deg);
}

/* Giro Derecha */
.priego-flip-card.flip-right.flip-hover:is(:hover, :focus-within) .priego-flip-card-inner,
.priego-flip-card.flip-right.flip-click.flipped .priego-flip-card-inner {
    transform: rotateY(180deg);
}

/* Giro Arriba */
.priego-flip-card.flip-up.flip-hover:is(:hover, :focus-within) .priego-flip-card-inner,
.priego-flip-card.flip-up.flip-click.flipped .priego-flip-card-inner {
    transform: rotateX(180deg);
}

/* Giro Abajo */
.priego-flip-card.flip-down.flip-hover:is(:hover, :focus-within) .priego-flip-card-inner,
.priego-flip-card.flip-down.flip-click.flipped .priego-flip-card-inner {
    transform: rotateX(-180deg);
}

/* CARAS DE LA TARJETA (FRONT / BACK) */
.priego-flip-card-front,
.priego-flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden; /* Safari */
    backface-visibility: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    box-sizing: border-box;
    transform: rotateX(0deg); /* Fix de contexto 3D */
    transform-style: preserve-3d;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.08); /* Sombra inicial suave */
    transition: box-shadow 1.4s var(--priego-flip-ease);
}

.priego-flip-card:hover .priego-flip-card-front,
.priego-flip-card:hover .priego-flip-card-back {
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.16); /* Sombra profunda al elevarse */
}

/* Base de la cara: SIEMPRE clara.
   Es lo que se ve por detras de un logo PNG con transparencia — la capa borrosa de una
   imagen transparente es igual de transparente, asi que el color de la cara queda a la
   vista — y tambien cuando la cara no tiene imagen configurada. Con un navy aqui,
   cualquier logo recortado aparecia sobre un cuadro oscuro. Crema del tema, la misma
   de la ficha de lugar. El filo es neutro para que se aprecie tanto sobre la crema
   como sobre una foto oscura. */
.priego-flip-card.flip-hover .priego-flip-card-front,
.priego-flip-card.flip-hover .priego-flip-card-back,
.priego-flip-card.flip-click .priego-flip-card-front,
.priego-flip-card.flip-click .priego-flip-card-back {
    background: linear-gradient(160deg, #ffffff 0%, #f4f1eb 100%);
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(148, 163, 184, 0.18);
}

.priego-flip-card.flip-hover:is(:hover, :focus-within) .priego-flip-card-front,
.priego-flip-card.flip-hover:is(:hover, :focus-within) .priego-flip-card-back,
.priego-flip-card.flip-click.flipped .priego-flip-card-front,
.priego-flip-card.flip-click.flipped .priego-flip-card-back {
    box-shadow: 0 30px 70px rgba(11, 18, 38, 0.28), inset 0 0 0 1px rgba(148, 163, 184, 0.28);
}

/* Destello especular que cruza la cara mientras gira: es lo que hace que se lea como una
   superficie fisica girando y no como una imagen que cambia. ::before esta ocupado por el
   doble marco (.framed), de ahi el ::after. */
.priego-flip-card.flip-hover .priego-flip-card-front::after,
.priego-flip-card.flip-hover .priego-flip-card-back::after,
.priego-flip-card.flip-click .priego-flip-card-front::after,
.priego-flip-card.flip-click .priego-flip-card-back::after {
    content: '';
    position: absolute;
    top: -30%;
    left: -60%;
    width: 45%;
    height: 160%;
    pointer-events: none;
    background: linear-gradient(100deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.07) 45%,
        rgba(255, 255, 255, 0.13) 50%,
        rgba(255, 255, 255, 0.07) 55%,
        rgba(255, 255, 255, 0) 100%);
    transform: translateX(0) rotate(8deg);
    opacity: 0;
    transition: transform var(--flip-duration, 1.5s) var(--priego-flip-turn),
                opacity var(--flip-duration, 1.5s) var(--priego-flip-turn);
}

.priego-flip-card.flip-hover:is(:hover, :focus-within) .priego-flip-card-front::after,
.priego-flip-card.flip-hover:is(:hover, :focus-within) .priego-flip-card-back::after,
.priego-flip-card.flip-click.flipped .priego-flip-card-front::after,
.priego-flip-card.flip-click.flipped .priego-flip-card-back::after {
    transform: translateX(360%) rotate(8deg);
    opacity: 1;
}

.priego-flip-card-front {
    z-index: 2;
}

.priego-flip-card-back {
    z-index: 1;
}

/* ROTACIÓN INICIAL CARA POSTERIOR */
.priego-flip-card.flip-left .priego-flip-card-back {
    transform: rotateY(-180deg);
}
.priego-flip-card.flip-right .priego-flip-card-back {
    transform: rotateY(180deg);
}
.priego-flip-card.flip-up .priego-flip-card-back {
    transform: rotateX(180deg);
}
.priego-flip-card.flip-down .priego-flip-card-back {
    transform: rotateX(-180deg);
}

/* ELEMENTOS DE FONDO Y DISEÑO INTERNO */

/* contain (no cover): la imagen se ve entera, nunca cortada por los bordes. El hueco que
   sobra cuando su proporcion no cuadra con la tarjeta lo cubre la crema de la cara, sin
   relleno intermedio: un logo tiene que leerse solido, no flotando sobre su propia copia
   desenfocada. Sin zoom en hover: con contain, ampliar volveria a recortar. */
.priego-flip-bg-image {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center;
    z-index: -2;
}

/* Velo minimo: cae SOLO en la banda donde se apoya el texto y el resto de la foto queda
   sin tocar. La mitad superior va limpia del todo (0 de opacidad), asi una imagen clara
   se ve clara. Es la unica forma de tener texto blanco legible sin apagar la foto:
   oscurecer poco y muy localizado, en vez de un velo general. */
.priego-flip-bg-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg,
            rgba(11, 18, 38, 0) 0%,
            rgba(11, 18, 38, 0) 46%,
            rgba(11, 18, 38, 0.14) 57%,
            rgba(11, 18, 38, 0.44) 70%,
            rgba(11, 18, 38, 0.72) 84%,
            rgba(11, 18, 38, 0.88) 100%);
    transition: opacity 1.3s var(--priego-flip-ease);
}

/* La cara posterior coloca el texto ARRIBA (titulo + descripcion) y el boton abajo:
   su velo va al reves. Antes ambas caras compartian un degradado pensado para el
   frontal, y por eso el texto de detras caia justo en la zona limpia. */
.priego-flip-card-back .priego-flip-bg-overlay {
    background:
        linear-gradient(180deg,
            rgba(11, 18, 38, 0.56) 0%,
            rgba(11, 18, 38, 0.38) 26%,
            rgba(11, 18, 38, 0.12) 46%,
            rgba(11, 18, 38, 0) 62%,
            rgba(11, 18, 38, 0.36) 100%);
}

/* Red de seguridad independiente de la foto: la sombra mantiene el contraste
   aunque la imagen sea muy clara justo detras de una linea de texto.
   El subtitulo queda fuera: va sobre un chip solido y ahi la sombra solo ensuciaria. */
.priego-flip-card-front .front-title,
.priego-flip-card-front .front-desc,
.priego-flip-card-back .back-title,
.priego-flip-card-back .back-desc {
    text-shadow: 0 1px 2px rgba(11, 18, 38, 0.55), 0 8px 24px rgba(11, 18, 38, 0.35);
}

.priego-flip-card-front .front-footer,
.priego-flip-card-back .back-header {
    overflow-wrap: anywhere;
}

/* Descripciones largas: dentro de la cara hay altura fija, mejor scroll que recorte.
   min-height:0 es lo que permite que un hijo flex se encoja y saque scroll en lugar de
   desbordar y empujar al boton fuera de la tarjeta.
   Los margenes negativos llevan la banda hasta los bordes de la tarjeta y devuelven el
   p-8 de la cara como padding propio: el texto queda donde estaba, pero el difuminado de
   abajo puede cubrir el ancho completo sin dejar costuras laterales. */
.priego-flip-card-back .back-header {
    position: relative;
    min-height: 0;
    overflow: hidden auto;
    /* width:auto anula el w-full del markup. Con width:100% los margenes negativos NO
       ensanchan el bloque: lo desplazan 2rem a la izquierda y el lado derecho se sale de
       la cara, que lo recorta. Con auto, el ancho lo deducen los propios margenes. */
    width: auto;
    margin: -2rem -2rem 0;
    padding: 2rem 2rem 3.5rem;
}

/* Difuminado local del fondo bajo el bloque de "Mas informacion". No es un panel: no tiene
   borde, ni sombra, ni esquinas. Desenfoca la propia imagen de fondo solo en esa banda.

   Es dinamico porque la capa mide inset:0 del bloque de texto, no una altura fija: con una
   descripcion corta cubre poco y con una larga se estira sola. El padding inferior de
   3.5rem es lo que le da aire por debajo de la ultima linea.

   La tinta acompana al desenfoque porque solo desenfocar no garantiza nada: una foto clara
   sigue siendo clara despues de un blur(24px). El contraste lo pone el rgba, el blur pone
   la limpieza. Y de paso funciona de red: si el navegador no compone backdrop-filter
   dentro del contexto 3D de la cara, el texto se sigue leyendo igual.

   El mask apaga las dos cosas hacia abajo: sin el habria una linea recta donde acaba. */
.priego-flip-card-back .back-header::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(180deg,
        rgba(11, 18, 38, 0.30) 0%,
        rgba(11, 18, 38, 0.24) 55%,
        rgba(11, 18, 38, 0.10) 100%);
    -webkit-backdrop-filter: blur(24px) saturate(130%);
    backdrop-filter: blur(24px) saturate(130%);
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 68%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(180deg, #000 0%, #000 68%, rgba(0, 0, 0, 0) 100%);
}

.priego-flip-card-back .back-header::-webkit-scrollbar { width: 4px; }
.priego-flip-card-back .back-header::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.28);
    border-radius: 4px;
}

/* Misma idea que en el reverso, calibrada para el frontal.
   Aqui el desenfoque va mas bajo (14px frente a 24px) a proposito: el frontal es el estado
   en reposo y en las tarjetas de logo esta banda cae sobre la parte alta de la imagen. Con
   un blur fuerte se ablandaria el borde del logo, que es justo lo que tiene que verse
   solido. Asi que en el frontal el trabajo lo hace la tinta y el blur solo acompana.
   La altura la marca el contenido (inset:0 del bloque), no un valor fijo. */
/* Chip rosa con texto blanco. El contraste no depende ya de la foto: el chip lo aporta el
   propio fondo, asi que aqui no hace falta ni velo ni desenfoque detras.
   El rosa lo pinta el control "Color del Subtitulo" de Elementor (mismo valor que tenia
   como color de texto, ahora aplicado al fondo); el blanco vive en el CSS. */
.priego-flip-card-front .front-subtitle {
    display: inline-block;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    background: #db6889; /* Rosa Priego, por si el control quedara vacio */
    /* !important: el control "Color del Titulo" de Elementor tambien apunta a este texto
       en algunas combinaciones y su regla gana por especificidad. El blanco es lo que
       hace legible el chip, no debe poder sobrescribirse. */
    color: #fff !important;
    font-size: 11px;
    letter-spacing: 0.14em;
    box-shadow: 0 4px 12px rgba(11, 18, 38, 0.16);
}


/* INTEGRACIÓN CON EL DOBLE MARCO (.framed) */
.priego-flip-card-front.framed::before,
.priego-flip-card-back.framed::before {
    inset: -6px !important;
    border-radius: inherit;
    pointer-events: none;
}

/* MICRO-ANIMACIONES EN CASCADA INTERIOR (ELEMENTOS TRASERO) */
.priego-flip-card .back-header h3,
.priego-flip-card .back-header p,
.priego-flip-card .back-footer {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.9s var(--priego-flip-ease), transform 0.9s var(--priego-flip-ease);
}

.priego-flip-card .back-footer {
    transform: translateY(16px);
}

/* Entrada desfasada. Los retardos estan calculados sobre el giro: la cara posterior se
   pone de frente a mitad de recorrido, asi que el texto arranca justo despues y no antes,
   cuando todavia se veria de canto. */
.priego-flip-card.flip-hover:is(:hover, :focus-within) .back-header h3,
.priego-flip-card.flip-click.flipped .back-header h3 {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.55s;
}

.priego-flip-card.flip-hover:is(:hover, :focus-within) .back-header p,
.priego-flip-card.flip-click.flipped .back-header p {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.7s;
}

.priego-flip-card.flip-hover:is(:hover, :focus-within) .back-footer,
.priego-flip-card.flip-click.flipped .back-footer {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.85s;
}

/* Salida de la cara frontal: se retira mientras la tarjeta empieza a girar, en vez de
   quedarse rigida hasta desaparecer de golpe al llegar al canto. */
.priego-flip-card.flip-hover .front-header,
.priego-flip-card.flip-hover .front-footer,
.priego-flip-card.flip-click .front-header,
.priego-flip-card.flip-click .front-footer {
    transition: opacity 0.7s var(--priego-flip-ease), transform 0.7s var(--priego-flip-ease);
}

.priego-flip-card.flip-hover:is(:hover, :focus-within) .front-header,
.priego-flip-card.flip-click.flipped .front-header {
    opacity: 0;
    transform: translateY(-12px);
}

.priego-flip-card.flip-hover:is(:hover, :focus-within) .front-footer,
.priego-flip-card.flip-click.flipped .front-footer {
    opacity: 0;
    transform: translateY(14px);
}

/* DISEÑO DE BOTÓN INTERACTIVO */
.priego-flip-card .back-button {
    position: relative;
    overflow: hidden;
    z-index: 1;
    border-radius: 100px;
    transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

.priego-flip-card .back-button::before {
    content: '';
    position: absolute;
    inset: 0;
    background: currentColor;
    opacity: 0;
    z-index: -1;
    transition: opacity 0.3s ease;
}

.priego-flip-card .back-button:hover::before {
    opacity: 0.08;
}

/* Asegurar que el botón sea siempre visible si la tarjeta no gira (no-flip) */
.priego-flip-card.no-flip .back-footer {
    opacity: 1 !important;
    transform: none !important;
}

/* Asegurar que el fondo frontal de la tarjeta plana (no-flip) sea blanco editorial */
.priego-flip-card.no-flip .priego-flip-card-front {
    background-color: #ffffff !important;
    border-color: rgba(243, 244, 246, 0.8) !important;
}

/* Asegurar que la tarjeta plana (no-flip) fluya de forma relativa y auto-ajuste su altura al contenido, excepto en Estilo 2 */
.priego-flip-card.no-flip:not(.style-2),
.priego-flip-card.no-flip:not(.style-2) .priego-flip-card-inner,
.priego-flip-card.no-flip:not(.style-2) .priego-flip-card-front {
    position: relative !important;
    height: auto !important;
}

/* Correcciones de 3D para navegadores basados en Webkit (Safari) */
.priego-flip-card-inner {
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
}

.priego-flip-card-front,
.priego-flip-card-back {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* ==========================================
   CARRUSEL DE LUGARES ACF
   ========================================== */

/* Titulo del registro y su etiqueta de categoria, en serif. Van anidados bajo la raiz del
   carrusel a proposito: con un solo selector de clase empatarian en especificidad con la
   utilidad font-heading del markup y el resultado dependeria del orden de carga de las
   hojas. Con dos, ganan siempre sin necesidad de !important. */
.priego-lugares-carousel .priego-carousel-card__title,
.priego-lugares-carousel .priego-carousel-card__badge {
    font-family: 'Playfair Display', Georgia, serif;
}

/* ==========================================
   BOTONES DE NAVEGACIÓN PREMIUM
   ========================================== */
.priego-carousel-btn {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    border: 1px solid rgba(229, 231, 235, 0.8);
    color: #374151;
    background-color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02), 0 1px 3px rgba(0, 0, 0, 0.01);
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: pointer;
    position: relative;
    outline: none;
    z-index: 10;
}

/* Efecto de doble marco dinámico interior */
.priego-carousel-btn::after {
    content: '';
    position: absolute;
    inset: -3px;
    border-radius: 9999px;
    border: 1px solid #253c78;
    opacity: 0;
    transform: scale(0.9);
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none;
}

.priego-carousel-btn:hover {
    color: #ffffff !important;
    background-color: #253c78 !important; /* Navy de marca */
    border-color: #253c78 !important;
    box-shadow: 0 10px 25px rgba(37, 60, 120, 0.22) !important;
}

.priego-carousel-btn:hover::after {
    opacity: 0.4;
    transform: scale(1);
}

.priego-carousel-btn:active {
    transform: scale(0.92) !important;
}

.priego-carousel-btn svg {
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.priego-carousel-btn.btn-prev:hover svg {
    transform: translateX(-3px);
}

.priego-carousel-btn.btn-next:hover svg {
    transform: translateX(3px);
}

/* ==========================================
   ANCHO DE CARDS PERFECTO (3 ENTERAS EN DESKTOP)
   ========================================== */
.priego-lugares-carousel .carousel-track {
    width: 100% !important;
}

.priego-lugares-carousel .carousel-slide {
    flex: 0 0 100% !important;
    width: 100% !important; /* Mobile: 1 card entera */
}

@media (min-width: 640px) {
    .priego-lugares-carousel .carousel-slide {
        flex: 0 0 calc((100% - 24px) / 2) !important;
        width: calc((100% - 24px) / 2) !important; /* Tablet: 2 cards enteras con gap-6 */
    }
}

@media (min-width: 1024px) {
    .priego-lugares-carousel .carousel-slide {
        flex: 0 0 calc((100% - 48px) / 3) !important;
        width: calc((100% - 48px) / 3) !important; /* Desktop: 3 cards enteras con gap-6 */
    }
}

/* ==========================================
   CAROUSEL POSTER (PATRIMONIO) - RESPONSIVE SLIDE WIDTHS (CON CORTES)
   ========================================== */
.priego-patrimonio-carousel .carousel-slide {
    flex: 0 0 calc((100% - 48px) / 2) !important;
    width: calc((100% - 48px) / 2) !important; /* Mobile: 1 card entera y 2 mitades a los lados */
}

@media (min-width: 640px) {
    .priego-patrimonio-carousel .carousel-slide {
        flex: 0 0 calc((100% - 72px) / 3) !important;
        width: calc((100% - 72px) / 3) !important; /* Tablet: 2 cards enteras y 2 mitades a los lados */
    }
}

@media (min-width: 1024px) {
    .priego-patrimonio-carousel .carousel-slide {
        flex: 0 0 calc((100% - 96px) / 4) !important;
        width: calc((100% - 96px) / 4) !important; /* Desktop: 3 cards enteras y 2 mitades a los lados */
    }
}