:root {
    --color-bg: #323629;
    --color-bg-alt: #f6f1e5;
    --color-primary: #d88b28;
    --color-primary-dark: #b06d18;
    --color-text: #f7f5ef;
    --color-text-dark: #1f2118;
    --radius-lg: 1.5rem;
    --radius-md: 1rem;
    --shadow-soft: 0 12px 30px rgba(0,0,0,0.25);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--color-text);
    background-color: var(--color-bg);
    line-height: 1.7;
    font-size: 16px;
}


/* UTILIDADES */

.container {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.section {
    padding: 4rem 0;
}

.section--alt {
    padding: 4rem 0;
    background-color: var(--color-bg-alt);
    color: var(--color-text-dark);
}

.section__intro {
    max-width: 620px;
    margin-bottom: 2rem;
}

.section__grid {
    display: grid;
    gap: 2.5rem;
}

.grid-4 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1.75rem;
}

.grid-3 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.75rem;
}

h1, h2, h3 {
    font-family: "Georgia", "Times New Roman", serif;
    letter-spacing: 0.03em;
}

h1 {
    font-size: clamp(2.2rem, 3vw, 2.8rem);
    margin-bottom: 1rem;
}

h2 {
    font-size: 1.8rem;
    margin-bottom: 1rem;
}

h3 {
    font-size: 1.2rem;
    margin-bottom: 0.75rem;
}

/* HEADER */

.header {
    position: sticky;
    top: 0;
    z-index: 50;
    background-color: rgba(50, 54, 41, 0.96);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(255,255,255,0.06);
}

.header__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.5rem;
}

.logo {
    text-decoration: none;
    color: var(--color-text);
    display: flex;
    flex-direction: column;
    gap: 0;
}

.logo__main {
    font-weight: 700;
    letter-spacing: 0.18em;
    font-size: 1.1rem;
}

.logo__sub {
    font-size: 0.75rem;
    text-transform: uppercase;
    opacity: 0.8;
}

.nav {
    display: flex;
    gap: 1rem;
    font-size: 0.95rem;
}

.nav a {
    color: var(--color-text);
    text-decoration: none;
    opacity: 0.85;
}

.nav a:hover {
    opacity: 1;
}

/* BOTONES */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.75rem 1.4rem;
    border-radius: 999px;
    border: none;
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
    color: #fff;
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
    text-decoration: none;
    box-shadow: var(--shadow-soft);
}

.btn:hover {
    filter: brightness(1.05);
}

.btn:not(.btn--ghost):hover,
.btn:not(.btn--ghost):focus-visible,
.btn:not(.btn--ghost):active {
    color: #fff !important;
    text-decoration: none !important;
    filter: none !important;
    background: linear-gradient(135deg, #f0a43a, #cf8420) !important;
}

.btn--outline {
    border-radius: 999px;
    border: 1px solid var(--color-primary);
    padding: 0.5rem 1.1rem;
    color: var(--color-primary);
    background: transparent;
    text-decoration: none;
    font-size: 0.9rem;
}

.btn--outline:hover {
    background-color: rgba(216,139,40,0.08);
}

/* HERO */

.hero {
    padding: 4rem 0 3rem;
    background: radial-gradient(circle at top left, #484f38 0, #323629 40%, #272a1f 100%);
}

.hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    gap: 2.5rem;
    align-items: center;
}

.hero__text p {
    max-width: 520px;
}

.hero__bullets {
    list-style: none;
    padding: 0;
    margin: 1rem 0 1.5rem;
}

.hero__bullets li::before {
    content: "\\2022";
    color: var(--color-primary);
    margin-right: 0.4rem;
}

.hero__cta {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-top: 0.5rem;
}

.hero__phone a {
    color: inherit;
    text-decoration: underline;
}

.hero__image img {
    width: 80%;
    border-radius: var(--radius-lg);
    object-fit: cover;
    box-shadow: var(--shadow-soft);
}

.hero__location {
    font-size: 0.9rem;
    opacity: 0.9;
}

/* CARDS & PRECIOS */

.card {
    background-color: rgba(50,54,41,0.92);
    border-radius: var(--radius-md);
    padding: 1.4rem 1.6rem;
    box-shadow: var(--shadow-soft);
}

.section--alt .card {
    background-color: #ffffff;
    border-radius: var(--radius-md);
    box-shadow: 0 10px 26px rgba(0,0,0,0.1);
}

.card--pricing {
    position: relative;
}

.card--full {
    grid-column: 1 / -1;
}

.price {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-primary);
    margin: 0.4rem 0 0.2rem;
}

.small {
    font-size: 0.9rem;
}

.tiny {
    font-size: 0.75rem;
    opacity: 0.8;
}

/* LISTAS */

.list {
    padding-left: 1.1rem;
    margin: 0.5rem 0 0;
}

.list li {
    margin-bottom: 0.4rem;
}

/* CTA RESERVAS */

.cta-box {
    background-color: var(--color-bg);
    color: var(--color-text);
    border-radius: var(--radius-md);
    padding: 1.8rem 1.6rem;
    box-shadow: var(--shadow-soft);
}

.section--alt .cta-box {
    background-color: #323629;
    color: var(--color-text);
}

.cta-box__phone a {
    color: var(--color-primary);
}

/* FAQ */

.faq__item {
    border-radius: var(--radius-md);
    background-color: rgba(255,255,255,0.9);
    padding: 1.2rem 1.4rem;
    margin-bottom: 0.8rem;
}

.faq__item h3 {
    margin-top: 0;
}

/* MAPA */

.map iframe {
    width: 100%;
    min-height: 260px;
    border: 0;
    border-radius: var(--radius-md);
    box-shadow: 0 10px 26px rgba(0,0,0,0.2);
}

/* FORMULARIO */

.form {
    display: grid;
    gap: 1rem;
}

.form__group {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.form label {
    font-size: 0.9rem;
    font-weight: 500;
}

.form input,
.form textarea {
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.25);
    padding: 0.65rem 0.9rem;
    background-color: rgba(0,0,0,0.18);
    color: var(--color-text);
    font: inherit;
}

.section--alt .form input,
.section--alt .form textarea {
    border-radius: 0.9rem;
    background-color: #f8f5ef;
    border-color: rgba(0,0,0,0.1);
    color: var(--color-text-dark);
}

.form textarea {
    border-radius: 0.9rem;
    min-height: 130px;
    resize: vertical;
}

.form-message {
    margin-bottom: 1rem;
    padding: 0.6rem 0.8rem;
    border-radius: 0.75rem;
    background-color: rgba(216,139,40,0.1);
    color: var(--color-text-dark);
}

/* IMÁGENES */

.img-rounded {
    width: 100%;
    border-radius: var(--radius-lg);
    object-fit: cover;
    box-shadow: var(--shadow-soft);
}

/* FOOTER */

.footer {
    background-color: #11130c;
    color: #ddd7c5;
    padding: 2.2rem 0;
    font-size: 0.9rem;
}

.footer__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1.3fr);
    gap: 1.8rem;
    align-items: flex-start;
}

.footer__links {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.footer__links a,
.footer__legal a {
    color: inherit;
    text-decoration: none;
    opacity: 0.9;
}

.footer__links a:hover,
.footer__legal a:hover {
    opacity: 1;
    text-decoration: underline;
}

/* RESPONSIVE */

@media (max-width: 900px) {
    .hero__grid,
    .section__grid,
    .footer__grid {
        grid-template-columns: 1fr;
    }

    .header__content {
        flex-wrap: wrap;
        gap: 0.9rem;
    }

    .nav {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 600px) {
    .hero {
        padding-top: 3rem;
    }

    .header__content {
        justify-content: center;
    }

    .nav {
        display: none; /* si quieres, aquí luego haces un menú hamburguesa */
    }
}


.logo {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

/* Tamaño del logo, ajusta a tu gusto */
.logo__img {
    height: 40px;
    width: auto;
    display: block;
}

/* Texto solo visible para lectores de pantalla */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}


.hero__location a {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.hero__location a:hover {
    color: var(--color-primary);
}






/* Layout general sección clínica */
.clinic__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    gap: 3rem;
    align-items: center;
}

.clinic__text p {
    max-width: 620px;
}

/* Tarjetas de puntos fuertes dentro del texto */
.clinic__highlights {
    margin-top: 1.8rem;
    display: grid;
    gap: 1rem;
}

@media (min-width: 768px) {
    .clinic__highlights {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.clinic-highlight {
    background-color: #ffffff;
    border-radius: 1rem;
    padding: 1rem 1.1rem;
    box-shadow: 0 10px 26px rgba(0,0,0,0.06);
}

.clinic-highlight h3 {
    font-size: 1rem;
    margin-bottom: 0.35rem;
}

.clinic-highlight p {
    font-size: 0.9rem;
    margin: 0;
}

/* Collage de fotos a la derecha */
.clinic__image-collage {
    position: relative;
    min-height: 260px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.clinic__photo {
    position: absolute;
    border-radius: 1.6rem;
    overflow: hidden;
    box-shadow: 0 18px 40px rgba(0,0,0,0.22);
}

.clinic__photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.clinic__photo--main {
    width: 230px;
    height: 280px;
    transform: translateX(-23%);   /* la de delante un poco más a la izquierda */
}

.clinic__photo--secondary {
    width: 230px;
    height: 280px;
    transform: translate(72%, -6%); /* la de atrás más a la derecha y un pelín arriba */
}

/* Responsive */
@media (max-width: 900px) {
    .clinic__grid {
        grid-template-columns: 1fr;
    }

    .clinic__image-collage {
        margin-top: 2rem;
        min-height: auto;
        height: 280px;
    }

    .clinic__photo--main {
        transform: translateX(0);
    }

    .clinic__photo--secondary {
        transform: translate(-35%, 18%);
    }
}

@media (max-width: 600px) {
    .clinic__image-collage {
        height: 250px;
    }

    .clinic__photo--main {
        width: 200px;
        height: 240px;
    }

    .clinic__photo--secondary {
        width: 160px;
        height: 190px;
    }
}

/* Contenedor de las tarjetas: más compacto */
.clinic__highlights {
    margin-top: 1.8rem;
    display: grid;
    gap: 1.2rem;
}

@media (min-width: 768px) {
    .clinic__highlights {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Tarjeta individual */
.clinic-highlight {
    background-color: #ffffff;
    border-radius: 1.4rem;
    padding: 1.1rem 1.3rem;
    box-shadow: 0 10px 24px rgba(0,0,0,0.06);
    border: 1px solid rgba(0,0,0,0.03);
}

/* Línea de color arriba (detalle elegante) */
.clinic-highlight::before {
    content: "";
    display: block;
    width: 32px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
    margin-bottom: 0.7rem;
}

/* Texto dentro de la tarjeta */
.clinic-highlight h3 {
    font-size: 1rem;
    margin: 0 0 0.35rem;
}

.clinic-highlight p {
    font-size: 0.9rem;
    margin: 0;
    color: #5a5648;
}


/* Fondo algo más claro para que se lea todo */
.section--precios {
    background: #2b3124; /* verde oscuro pero no tan negro */
    color: #f6f1e5;
}

/* Tarjetas de precios más limpias */
.section--precios .price-card {
    background: rgba(24, 28, 19, 0.96);
    border-radius: 1.6rem;
    padding: 1.5rem 1.6rem 1.6rem;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}

/* Título de cada tarjeta */
.section--precios .price-card h3 {
    margin-top: 0;
    margin-bottom: 0.4rem;
    color: #fffdf6;
}

/* Precio: bien visible */
.section--precios .price-card .price {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-primary);
    margin: 0 0 0.8rem;
}

/* Centrar la imagen dentro de la tarjeta de precios */
.price-card__image {
    display: flex;
    justify-content: center;   /* centrado horizontal */
    align-items: center;       /* por si las haces más altas */
    margin: 0.7rem auto 0.9rem;
    width: 100%;
}

.price-card__image img {
    display: block;
    max-width: 180px;          /* tamaño razonable, puedes subir/bajar esto */
    width: 100%;
    height: auto;
    border-radius: 1.1rem;
    object-fit: cover;
}


/* Texto descriptivo más claro */
.section--precios .price-card .small {
    font-size: 0.9rem;
    color: rgba(245, 242, 232, 0.9);
}

.section--precios .price-card .tiny {
    font-size: 0.78rem;
    color: rgba(245, 242, 232, 0.7);
    margin-top: 0.6rem;
}

/* Tarjeta extra-grande ocupando todo el ancho */
.section--precios .card--full {
    grid-column: 1 / -1;
}

/* Un poco más de aire entre precios en móvil */
@media (max-width: 768px) {
    .section--precios .price-card {
        padding: 1.3rem 1.3rem 1.4rem;
    }

    .price-card__image img {
        height: 120px;
    }
}


/* Grid de packs (ya usas grid-3, esto solo ajusta) */
.pack-grid {
    gap: 1.6rem;
}

/* Tarjeta de pack con imagen arriba */
.pack-card {
    background-color: #ffffff;
    color: var(--color-text-dark);
    border-radius: 1.6rem;
    padding: 1.2rem 1.3rem 1.4rem;
    box-shadow: 0 14px 32px rgba(0,0,0,0.08);
}

/* Imagen del pack */
.pack-card__image {
    width: 100%;
    margin-bottom: 0.8rem;
    border-radius: 1.2rem;
    overflow: hidden;
    background: #ddd;
}

.pack-card__image img {
    display: block;
    width: 100%;
    height: 150px;
    object-fit: cover;
}

/* Título y precio */
.pack-card h3 {
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.pack-card__price {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-primary);
    margin: 0.2rem 0 0.4rem;
}

/* Ajuste listas dentro de packs */
.pack-card .list {
    margin-top: 0.2rem;
    padding-left: 1rem;
}

.pack-card .list li {
    margin-bottom: 0.2rem;
}

/* Responsive */
@media (max-width: 768px) {
    .pack-card__image img {
        height: 130px;
    }
}




/* Sección precios */
.section--precios {
    padding: 4rem 0;
}

/* GRID: 5 columnas en escritorio */
.price-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 2.4rem;
}

/* Asegurarte de que Extra grande NO se estire a toda la fila */
.price-card.card--full {
    grid-column: auto;
}

/* Responsive (si quieres que se rompa en pantallas pequeñas) */
@media (max-width: 992px) {
    .price-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .price-grid {
        grid-template-columns: 1fr;
    }
}

/* Extra grande ocupa toda la fila */
.price-card.card--full {
    grid-column: 1 / -1;
}

/* Responsive */
@media (max-width: 992px) {
    .price-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .price-grid {
        grid-template-columns: 1fr;
    }
}


/* GRID: 5 columnas en escritorio */
.price-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 2.4rem;
}

/* Asegurarte de que Extra grande NO se estire a toda la fila */
.price-card.card--full {
    grid-column: auto;
}

/* Responsive (si quieres que se rompa en pantallas pequeñas) */
@media (max-width: 992px) {
    .price-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .price-grid {
        grid-template-columns: 1fr;
    }
}


/* Imagen del carrusel: se ve ENTERA */
.packs-slide img {
    width: 100%;
    height: auto;          /* que la altura se adapte a la imagen */
    max-height: 420px;     /* límite para que no se haga gigante; ajusta a tu gusto */
    object-fit: contain;   /* NO recorta, encaja la imagen completa */
    display: block;
    margin: 0 auto;
    background-color: #f4efe3; /* mismo tono que el fondo por si sobra espacio */
}


/* GRID: 3 columnas en escritorio */
.price-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2.4rem;
}

/* Tarjetas normales */
.price-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Extra grande ocupa 2 columnas (segunda fila) */
.price-card.card--xl {
    grid-column: span 2;
}

/* Responsive */
@media (max-width: 992px) {
    .price-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .price-card.card--xl {
        grid-column: span 2;
    }
}

@media (max-width: 600px) {
    .price-grid {
        grid-template-columns: 1fr;
    }

    .price-card.card--xl {
        grid-column: auto;
    }
}


/* ==== CARRUSEL 3 IMÁGENES REAL ==== */

.packs-carousel {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 3rem auto;
}

.packs-carousel__viewport {
    overflow: hidden;
    width: 100%;
}

.packs-carousel__track {
    display: flex;
    transition: transform 0.4s ease;
}

/* 3 imágenes por vista */
.packs-slide {
    flex: 0 0 33.333%;
    max-width: 33.333%;
    padding: 10px;
    box-sizing: border-box;
}

.packs-slide img {
    width: 100%;
    height: auto;
    border-radius: 16px;
    display: block;
}

/* Flechas */
.packs-carousel__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: rgba(0,0,0,0.08);
    border: none;
    cursor: pointer;
    z-index: 5;
}

.packs-carousel__nav--prev { left: -25px; }
.packs-carousel__nav--next { right: -25px; }

/* Dots */
.packs-carousel__dots {
    margin-top: 1rem;
    display: flex;
    gap: 6px;
    justify-content: center;
}

.packs-carousel__dots button {
    width: 10px;
    height: 10px;
    background: #ccc;
    border-radius: 999px;
    border: none;
}

.packs-carousel__dots button.is-active {
    background: #d88b28;
}


/* ==== CARRUSEL PROMOCIONES ==== */

.promos-carousel {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 2rem auto;
}

.promos-viewport {
    overflow: hidden;
}

.promos-track {
    display: flex;
    transition: transform 0.4s ease;
}

/* 3 tarjetas visibles */
.promo-card {
    flex: 0 0 33.333%;
    max-width: 33.333%;
    padding: 1rem;
    background: white;
    margin: 0.5rem;
    border-radius: 16px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
    text-align: left;
}

.promo-card h3 {
    margin-bottom: 0.3rem;
    font-size: 1.2rem;
}

.promo-card strong {
    display: block;
    margin-top: 0.5rem;
    font-size: 1.4rem;
    color: #d88b28;
}

/* Flechas */
.promos-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: rgba(0,0,0,0.08);
    border: none;
    cursor: pointer;
    z-index: 5;
}

.promos-prev { left: -45px; }
.promos-next { right: -45px; }

/* Dots */
.promos-dots {
    text-align: center;
    margin-top: 1rem;
}

.promos-dots button {
    width: 10px;
    height: 10px;
    display: inline-block;
    border-radius: 999px;
    background: #ccc;
    margin: 0 5px;
    border: none;
}

.promos-dots button.active {
    background: #d88b28;
}


/* ==== ARREGLO DEL CARRUSEL DE PROMOS ==== */

#promos .promos-carousel {
    max-width: 1100px;   /* igual que el carrusel de packs */
    margin: 0 auto;      /* centrado */
    position: relative;
}

/* Asegurar que las tarjetas se distribuyen bien */
#promos .promo-card {
    flex: 0 0 calc(100% / 3);
    max-width: calc(100% / 3);
}



/* Fondo de la sección de promociones */
#promos {
    position: relative;
    padding: 80px 0;
    background-color: #263024;   /* verde oscuro diferente al resto */
}


/* Tarjetas de promos: fondo blanco, texto visible */
.promo-card {
    background: #ffffff;
    color: #1f1f1f;
    opacity: 1;                  /* por si algún estilo anterior la dejaba transparente */
    border-radius: 18px;
    box-shadow: 0 12px 26px rgba(0,0,0,0.18);
}

/* Título del pack */
.promo-card h3 {
    color: #1c1c1c;
    font-weight: 600;
    margin-bottom: 0.4rem;
}

/* Descripción */
.promo-card p {
    color: #3b3b3b;
    font-size: 0.95rem;
    line-height: 1.45;
}

/* Precio en naranja corporativo */
.promo-card strong {
    display: block;
    margin-top: 0.75rem;
    font-size: 1.4rem;
    color: #d88b28;
}


/* SECCIÓN PROMOS NAVIDEÑA */
#promos {
    position: relative;
    padding: 80px 0;
    border-radius: 24px;
    overflow: hidden;

    /* Fondo navideño: verdes profundos con un toque de luz */
    background:
        radial-gradient(circle at top, #3f5535 0, #263024 40%, #181e16 100%);
}

/* Textura suave de “lucecitas / copitos” encima del fondo */
#promos::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.28;
    background-image:
        radial-gradient(circle, rgba(255,255,255,0.11) 0 2px, transparent 3px);
    background-size: 140px 140px;
    mix-blend-mode: screen;
}

/* Icono de árbol en todos los packs de Navidad */
.promo-card h3 {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.promo-card h3::before {
    content: "🎄";
    font-size: 1.1rem;
}


/* Flechas del carrusel de promos: visibles SIEMPRE */
.promos-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: none;
    cursor: pointer;
    z-index: 5;

    /* fondo claro para contraste */
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.35);
    color: #333;              /* color del símbolo ‹ › */
    opacity: 0.9;
    transition: transform 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
}

.promos-prev { left: -24px; }
.promos-next { right: -24px; }

.promos-nav:hover {
    opacity: 1;
    transform: translateY(-50%) scale(1.05);
    box-shadow: 0 6px 18px rgba(0,0,0,0.45);
}


/* Flechas del carrusel de promos: visibles SIEMPRE */
.promos-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: none;
    cursor: pointer;
    z-index: 5;

    /* fondo claro para contraste */
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.35);
    color: #333;              /* color del símbolo ‹ › */
    opacity: 0.9;
    transition: transform 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
}

.promos-prev { left: -54px; }
.promos-next { right: -54px; }

.promos-nav:hover {
    opacity: 1;
    transform: translateY(-50%) scale(1.05);
    box-shadow: 0 6px 18px rgba(0,0,0,0.45);
}


/* ====== AJUSTES HERO MÓVIL ====== */
@media (max-width: 768px) {
    .hero {
        padding-block: 3rem 2.5rem;
    }

    .hero__grid {
        display: block;              /* una columna */
    }

    .hero__text {
        text-align: left;
    }

    .hero__kicker {
        font-size: 0.85rem;
        margin-bottom: 0.75rem;
    }

    .hero h1 {
        font-size: 1.9rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }

    .hero__lead {
        font-size: 0.95rem;
        line-height: 1.5;
        margin-bottom: 1rem;
    }

    .hero__bullets {
        font-size: 0.9rem;
        margin-bottom: 1.5rem;
    }

    .hero__buttons {
        flex-direction: column;
        gap: 0.75rem;
        align-items: stretch;
    }

    .hero__buttons .btn {
        width: 100%;
        justify-content: center;
    }

    .hero__phone,
    .hero__location {
        display: block;
        font-size: 0.9rem;
        margin-top: 0.75rem;
    }

    .hero__image {
        margin-top: 2rem;
        display: flex;
        justify-content: center;
    }

    .hero__image-card {
        max-width: 260px;
        margin: 0 auto;
    }
}


/* Desktop: 3 promos por vista (ya lo tenías más o menos así) */
.promo-card {
    flex: 0 0 calc(100% / 3);
    max-width: calc(100% / 3);
}

/* Móvil: 1 promo por pantalla */
@media (max-width: 768px) {
    .promos-carousel {
        max-width: 100%;
    }

    .promo-card {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .promos-prev { left: 6px; }
    .promos-next { right: 6px; }
}


@media (max-width: 768px){
  .hero__image-card{
    max-width: 280px;
    width: 100%;
    margin: 18px auto 0;
    padding: 14px;
  }

  .hero__image-card img{
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
  }
}


/* ===== PROMOS CON IMAGEN ===== */
.promo-card--img{
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 12px 26px rgba(0,0,0,.18);
  display:flex;
  flex-direction:column;
}

.promo-media{
  position:relative;
  width:100%;
  aspect-ratio: 4 / 3;     /* Cambia a 1/1 si quieres cuadradas */
  background:#f3f3f3;
}

.promo-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.promo-badge{
  position:absolute;
  top:12px;
  left:12px;
  background:rgba(0,0,0,.55);
  color:#fff;
  padding:6px 10px;
  border-radius:999px;
  font-size:.85rem;
  backdrop-filter: blur(6px);
}

.promo-body{
  padding:16px 16px 18px;
}

.promo-body h3{
  margin:0 0 6px;
  display:flex;
  align-items:center;
  gap:.35rem;
}

.promo-body p{
  margin:0 0 12px;
  color:#3b3b3b;
  line-height:1.45;
  font-size:.95rem;
}

.promo-body strong{
  display:block;
  color:#d88b28;
  font-size:1.35rem;
}

/* Carrusel responsive: 3 en escritorio, 1 en móvil */
@media (min-width:768px){
  #promos .promo-card{ flex:0 0 calc((100% - 32px)/3); max-width:calc((100% - 32px)/3); }
}

@media (max-width:767px){
  #promos .promo-card{ flex:0 0 100%; max-width:100%; }
}


/* ===== Carrusel base ===== */
.packs-carousel__viewport{
  overflow: hidden;
}

.packs-carousel__track{
  display: flex;
  gap: 18px;
  align-items: stretch;
  will-change: transform;
}

/* Cada slide: “tarjeta” que contiene la imagen */
.packs-slide{
  flex: 0 0 100%;
  background: rgba(255,255,255,.08);
  border-radius: 22px;
  padding: 12px;                /* marco “crema” como en tu captura */
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
}

/* Imagen SIEMPRE bien dentro del slide */
.packs-slide img{
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 18px;
  object-fit: cover;            /* recorta bonito, no deforma */
  aspect-ratio: 4 / 5;          /* formato vertical tipo cartel */
}

/* Desktop: 3 a la vez */
@media (min-width: 900px){
  .packs-slide{
    flex: 0 0 calc((100% - 36px) / 3);   /* 2 gaps de 18px = 36 */
  }
}

/* Flechas visibles y cerca (no perdidas en Cuenca) */
.packs-carousel__nav{
  background: rgba(255,255,255,.92);
  color: #1f1f1f;
  border: 0;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 12px 26px rgba(0,0,0,.22);
}

.packs-carousel{
  position: relative;
}

.packs-carousel__nav--prev{
  position: absolute;
  left: -8px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
}

.packs-carousel__nav--next{
  position: absolute;
  right: -8px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
}

/* En móvil, que no se salgan fuera */
@media (max-width: 899px){
  .packs-carousel__nav--prev{ left: 6px; }
  .packs-carousel__nav--next{ right: 6px; }
}

/* Opcional: toque navideño suave sin “verde Hulk” */
.packs-carousel--navidad .packs-slide{
  background: rgba(255,255,255,.06);
}



.packs-carousel{ position:relative; }
.packs-carousel__viewport{ overflow:hidden; }
.packs-carousel__track{
  display:flex;
  gap:24px;
  padding: 10px 6px;
  scroll-behavior:smooth;
}

.packs-slide{
  flex: 0 0 calc((100% - 48px) / 3); /* 3 visibles (gap*2 = 48) */
  border-radius:18px;
  overflow:hidden;
  background: rgba(255,255,255,.08);
}

/* ✅ imagen entera (no recorte) */
.packs-slide img{
  width:100%;
  height:auto;
  display:block;
  object-fit:contain;
  background: transparent;
}

/* móvil: 1 visible */
@media (max-width: 768px){
  .packs-carousel__track{ gap:16px; }
  .packs-slide{ flex-basis: 85%; } /* 1 grande y asoma la siguiente */
}

/* Flechas visibles y cerca */
.packs-carousel__nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:44px; height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.35);
  background: rgba(0,0,0,.35);
  color:#fff;
  font-size:26px;
  display:grid;
  place-items:center;
  cursor:pointer;
  z-index:5;
}

.packs-carousel__nav--prev{ left:12px; }
.packs-carousel__nav--next{ right:12px; }

/* dots */
.packs-carousel__dots{
  display:flex;
  gap:10px;
  justify-content:center;
  margin-top:14px;
}
.packs-carousel__dots button{
  width:10px; height:10px;
  border-radius:999px;
  border:0;
  background: rgba(255,255,255,.35);
  cursor:pointer;
}
.packs-carousel__dots button.is-active{
  background:#d28a2a; /* tu naranja */
}


/* --- OVERRIDE: que los carteles NO se recorten --- */
.packs-slide{
  overflow: visible;          /* por si algún bloque lo estaba cortando */
}

/* la tarjeta puede tener marco, pero la imagen va ENTERA */
.packs-slide img{
  width: 100%;
  height: auto !important;
  max-height: 560px;
  object-fit: contain !important;  /* clave: no recorta */
  aspect-ratio: auto !important;   /* fuera ratio forzado */
  background: rgba(0,0,0,0.10);    /* relleno si sobra hueco */
  display: block;
}

/* si en tu track tienes gap, el translateX(-100%) se descuadra.
   Mejor: sin gap y usa padding en slides */
.packs-carousel__track{
  gap: 0 !important;
}

/* 3 por vista en desktop, 1 en móvil (igual que tu idea) */
@media (min-width: 900px){
  .packs-slide{ flex: 0 0 33.333% !important; max-width: 33.333% !important; padding: 10px; }
}
@media (max-width: 899px){
  .packs-slide{ flex: 0 0 100% !important; max-width: 100% !important; padding: 10px; }
}



/* ===== Carrusel packs (común) ===== */
.packs-carousel { position: relative; }
.packs-carousel__viewport { overflow: hidden; width: 100%; }
.packs-carousel__track {
  display: flex;
  gap: 18px;
  transition: transform .35s ease;
  will-change: transform;
}

/* 3 visibles en desktop */
.packs-slide {
  flex: 0 0 calc((100% - 36px) / 3); /* 2 gaps */
  background: rgba(255,255,255,.08);
  border-radius: 22px;
  padding: 12px;
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
}

/* ✅ IMAGEN ENTERA (no recorta) */
.packs-slide img{
  width: 100%;
  height: auto !important;
  display: block;
  object-fit: contain !important;
  border-radius: 18px;
  background: rgba(0,0,0,.08);
}

/* Móvil: 1 por vista */
@media (max-width: 899px){
  .packs-slide { flex: 0 0 100%; }
}

/* Flechas visibles */
.packs-carousel__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: rgba(255,255,255,.92);
  color: #1f1f1f;
  box-shadow: 0 12px 26px rgba(0,0,0,.22);
  z-index: 5;
}
.packs-carousel__nav--prev{ left: 8px; }
.packs-carousel__nav--next{ right: 8px; }

/* Dots */
.packs-carousel__dots{
  display:flex;
  gap:10px;
  justify-content:center;
  margin-top:14px;
}
.packs-carousel__dots button{
  width:10px; height:10px;
  border-radius:999px;
  border:0;
  background: rgba(255,255,255,.35);
  cursor:pointer;
}
.packs-carousel__dots button.is-active{ background:#d28a2a; }


/* ====== NAVIDAD (solo afecta a #promos) ====== */
.section--navidad{
  position: relative;
  overflow: hidden;
  /* menos verde “pantano” y más navidad elegante */
  background:
    radial-gradient(900px 420px at 50% 0%, rgba(255, 60, 60, .16), transparent 60%),
    radial-gradient(900px 420px at 10% 20%, rgba(255, 215, 0, .10), transparent 55%),
    radial-gradient(900px 520px at 90% 30%, rgba(120, 255, 200, .10), transparent 55%),
    linear-gradient(180deg, rgba(16, 18, 16, .72), rgba(16, 18, 16, .72));
}

/* puntitos tipo “copitos” sutiles (sin volverlo discoteca) */
.section--navidad::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.25;
  background-image: radial-gradient(#fff 1px, transparent 1.5px);
  background-size: 90px 90px;
  background-position: 0 0;
  filter: blur(.2px);
}

/* Header centrado */
.promos-header{
  text-align:center;
  max-width: 900px;
  margin: 0 auto 24px;
}

.promos-kicker{
  display:inline-flex;
  gap:.5rem;
  align-items:center;
  font-weight:600;
  letter-spacing:.02em;
  padding: .45rem .8rem;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.92);
  border: 1px solid rgba(255,255,255,.12);
  margin-bottom: 12px;
}

.promos-title{
  margin: 0 0 10px;
  color: #fff;
}

.promos-intro{
  color: rgba(255,255,255,.88);
  margin: 0;
}

/* Flechas que se vean (y no “fantasmas”) */
.packs-carousel--navidad .packs-carousel__nav{
  background: rgba(255,255,255,.92);
  color: #1b1b1b;
  border: 0;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  box-shadow: 0 10px 25px rgba(0,0,0,.25);
  opacity: .98;
}

.packs-carousel--navidad .packs-carousel__nav:hover{
  transform: translateY(-1px);
}

.packs-carousel--navidad .packs-carousel__nav--prev{ left: 10px; }
.packs-carousel--navidad .packs-carousel__nav--next{ right: 10px; }

/* Dots más visibles en fondo oscuro */
.packs-carousel--navidad .packs-carousel__dots button{
  background: rgba(255,255,255,.35);
}
.packs-carousel--navidad .packs-carousel__dots button.is-active{
  background: rgba(255, 190, 60, .95);
}

/* Mobile: que no quede el H2 cortado y el intro respirable */
@media (max-width: 600px){
  .promos-header{ text-align:left; }
  .promos-kicker{ margin-left:0; }
}

/* =========================================================
   CORPORATE POLISH (sin romper tu SEO ni tus secciones)
   ========================================================= */

/* Tipografía (ya la estás cargando en <head>, ahora se usa) */
body{
  font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

h1, h2, h3{
  font-family: "Playfair Display", "Georgia", "Times New Roman", serif;
}

/* Mejor scroll con header sticky */
:root{
  --header-offset: 86px;
  --color-border: rgba(255,255,255,.10);
}

section[id]{
  scroll-margin-top: var(--header-offset);
}

.anchor{
  display:block;
  height:0;
  scroll-margin-top: var(--header-offset);
}

/* Accesibilidad: skip link + foco visible */
.skip-link{
  position:absolute;
  left: 1rem;
  top: .75rem;
  z-index: 999;
  padding: .6rem .9rem;
  border-radius: 999px;
  background: #ffffff;
  color: #1f2118;
  text-decoration:none;
  transform: translateY(-180%);
  transition: transform .18s ease;
  box-shadow: 0 14px 30px rgba(0,0,0,.25);
}
.skip-link:focus{ transform: translateY(0); }

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible{
  outline: 3px solid rgba(216,139,40,.65);
  outline-offset: 3px;
}

/* Header más “corporativo” */
.header{
  border-bottom: 1px solid var(--color-border);
}
.header__content{
  gap: 1rem;
}

/* Botón ghost que usas en el hero */
.btn--ghost{
  background: rgba(255,255,255,.08);
  color: var(--color-text);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: none;
}
.btn--ghost:hover{
  background: rgba(255,255,255,.12);
}

/* Menú móvil sin drama */
.nav-toggle{
  display:none;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.22);
  cursor:pointer;
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
}
.nav-toggle__bar{
  display:block;
  width: 18px;
  height: 2px;
  background: rgba(255,255,255,.92);
  margin: 4px auto;
  border-radius: 999px;
}

@media (max-width: 600px){
  .nav{ display:none; }
  .nav-toggle{ display:inline-grid; place-items:center; }
  .nav.is-open{
    display:flex;
    width: 100%;
    justify-content:center;
    padding: .6rem 0 .2rem;
  }
  .header__content{
    justify-content: space-between;
  }
}

/* Links de navegación con subrayado fino al hover */
.nav a{
  position: relative;
  padding: .35rem .25rem;
}
.nav a::after{
  content:"";
  position:absolute;
  left:.25rem;
  right:.25rem;
  bottom:.1rem;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .18s ease;
  opacity:.9;
}
.nav a:hover::after{ transform: scaleX(1); }

/* Hero: un poco más “landing page” */
.hero__kicker{
  display:inline-flex;
  gap:.45rem;
  align-items:center;
  padding: .35rem .75rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.20);
  margin: 0 0 1rem;
  font-size: .9rem;
  opacity: .95;
}
.hero__lead{ font-size: 1.05rem; opacity: .95; }

.hero__buttons{
  display:flex;
  gap:.8rem;
  flex-wrap: wrap;
}

/* Cards: hover suave */
.card{
  transition: transform .16s ease, box-shadow .16s ease;
}
.card:hover{
  transform: translateY(-2px);
}

/* Formularios más “pro” */
.form input,
.form textarea{
  transition: border-color .16s ease, background-color .16s ease;
}
.form input:focus,
.form textarea:focus{
  border-color: rgba(216,139,40,.6);
  background-color: rgba(0,0,0,.24);
}

/* =========================================================
   FIX: clases de Promos (tu HTML usa promos-head/pill/subtitle)
   ========================================================= */
.promos-head{
  text-align:center;
  max-width: 900px;
  margin: 0 auto 22px;
}
.promos-pill{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding: .45rem .85rem;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.92);
  border: 1px solid rgba(255,255,255,.14);
  font-weight: 600;
  letter-spacing: .01em;
  margin-bottom: 12px;
}
.promos-title{
  margin: 0 0 10px;
  color:#fff;
}
.promos-subtitle{
  margin:0;
  color: rgba(255,255,255,.88);
  line-height: 1.55;
}

/* Reduce motion si el usuario lo pide (sí, hay gente que se marea con tus transiciones) */
@media (prefers-reduced-motion: reduce){
  *{ scroll-behavior:auto !important; }
  .packs-carousel__track,
  .promos-track,
  .card,
  .skip-link,
  .nav a::after{ transition:none !important; }
}


/* Section con fondo de imagen */
.section--bg.reservas-bg{
  position: relative;
  isolation: isolate;
  background-image: url("img/seeda1.webp"); /* <- tu archivo */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: clamp(48px, 6vw, 88px) 0;
}


/* Capa oscura para que el texto se lea */
.section--bg.reservas-bg::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(1200px 600px at 20% 10%, rgba(0,0,0,.55), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.25) 100%);
}

/* Tarjeta */
.reservas-card{
  max-width: 880px;
  background: rgba(15, 15, 15, .55);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  padding: clamp(18px, 3vw, 34px);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 60px rgba(0,0,0,.35);
}

/* Textos */
#reservas h2{ color: #fff; margin-bottom: 10px; }
#reservas p{ color: rgba(255,255,255,.88); }
#reservas .muted{ color: rgba(255,255,255,.78); }

/* Lista con “chips” suaves */
#reservas .list--soft li{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  padding: 12px 14px;
  margin: 10px 0;
  color: rgba(255,255,255,.9);
}
#reservas .list--soft li::marker{ color: var(--color-primary); }

/* CTA */
#reservas .cta-row{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 18px;
}
#reservas .btn.btn--ghost{
  background: transparent;
  border: 1px solid rgba(255,255,255,.28);
  color: #fff;
}
#reservas .btn.btn--ghost:hover{
  border-color: rgba(255,255,255,.5);
}


/* 1) Menos alto del section */
.section--bg.reservas-bg{
  padding: clamp(28px, 3.5vw, 52px) 0; /* antes 48-88 */
}

/* 2) Tarjeta más compacta */
.reservas-card{
  max-width: 760px;                 /* antes 880 */
  border-radius: 18px;              /* antes 22 */
  padding: clamp(14px, 2vw, 22px);  /* antes 18-34 */
  box-shadow: 0 12px 36px rgba(0,0,0,.30); /* menos “mazacote” */
}

/* 3) Titular y textos más contenidos */
#reservas h2{
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.15;
  margin-bottom: 8px;
}
#reservas p{
  font-size: 0.98rem;
  line-height: 1.55;
  margin: 10px 0;
}

/* 4) Lista tipo “chips” menos altos */
#reservas .list--soft{
  margin: 12px 0;
  padding-left: 18px; /* para que el marker no se coma el borde */
}
#reservas .list--soft li{
  padding: 10px 12px;  /* antes 12 14 */
  margin: 8px 0;       /* antes 10 */
  border-radius: 12px; /* antes 14 */
  font-size: 0.98rem;
  line-height: 1.45;
}

/* 5) CTA más compacta */
#reservas .cta-row{
  margin-top: 14px; /* antes 18 */
  gap: 10px;
}

/* Si tus .btn son grandes a nivel global, los encogemos SOLO aquí */
#reservas .btn{
  padding: 10px 14px;
  font-size: 0.95rem;
  border-radius: 12px;
}


@media (max-width: 520px){
  .section--bg.reservas-bg{ padding: 22px 0; }
  .reservas-card{ padding: 14px; }
  #reservas .list--soft li{ padding: 9px 11px; }
}


/* FAQ acordeón */
.section__head{ max-width: 820px; margin-bottom: 18px; }
.section__head .muted{ opacity: .85; }

.faq-accordion{
  display: grid;
  gap: 12px;
  max-width: 980px;
}

.faq-a{
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  border-radius: 16px;
  overflow: hidden;
}

.faq-a__q{
  list-style: none;
  cursor: pointer;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  font-weight: 650;
}

.faq-a__q::-webkit-details-marker{ display:none; }

.faq-a__icon{
  width: 14px;
  height: 14px;
  border-right: 2px solid var(--color-primary);
  border-bottom: 2px solid var(--color-primary);
  transform: rotate(-45deg);
  transition: transform .18s ease;
  opacity: .9;
}

.faq-a[open] .faq-a__icon{
  transform: rotate(45deg);
}

.faq-a__a{
  padding: 0 16px 14px 16px;
  border-top: 1px solid rgba(255,255,255,.08);
}

.faq-a__a p{
  margin: 12px 0 0;
  opacity: .9;
  line-height: 1.55;
}

.faq-a:focus-within{
  outline: 2px solid rgba(255,255,255,.12);
  outline-offset: 2px;
}


/* UBICACIÓN: texto y enlaces sin azul raro */
#ubicacion a{ color: inherit; text-decoration: none; }
#ubicacion a:hover{ text-decoration: underline; }

.location__info .muted{ opacity:.86; max-width: 62ch; }

/* Tarjeta compacta de datos (en vez de 3 pastillas enormes) */
.location-card{
  margin: 14px 0 14px;
  padding: 12px 14px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  display: grid;
  gap: 10px;
}
.location-row{
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 12px;
  align-items: start;
}
.location-k{
  font-weight: 700;
  opacity: .95;
}
.location-v{
  opacity: .92;
}

/* Botonera */
.location__actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 10px;
}

/* Botón WhatsApp más “pro” (sin verde discoteca) */
.btn--whatsapp{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none !important;
}
.btn--whatsapp::before{
  content: "💬";
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.18);
  font-size: 14px;
  line-height: 1;
}

/* MAPA */
.map--card{
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  box-shadow: 0 14px 44px rgba(0,0,0,.22);
}
.map--card iframe{
  width: 100% !important;
  height: clamp(280px, 32vw, 420px) !important;
  border: 0 !important;
  display:block;
}
.map__note{ padding: 10px 12px; opacity: .85; }

/* Responsive */
@media (max-width: 640px){
  .location-row{ grid-template-columns: 1fr; }
  .location-k{ opacity: .9; }
}


/* CONTACTO */
.contact .muted{ opacity:.86; max-width: 60ch; }

.contact__badges{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 16px;
}

.badge{
  display:inline-flex;
  align-items:center;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  font-size: .92rem;
  line-height: 1;
  white-space: nowrap;
}

.form__actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 10px;
}

.media-card{
  margin:0;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  box-shadow: 0 14px 44px rgba(0,0,0,.18);
}
.media-card img{
  width:100%;
  height:auto;
  display:block;
}


/* Botón reseñas con icono */
.location__actions a[href*="maps/place"]{
  text-decoration: none !important;
}
.location__actions a[href*="maps/place"]::before{
  content: "★";
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.18);
  margin-right: 10px;
  font-size: 14px;
  line-height: 1;
}


.btn--whatsapp{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}


/* Placeholders más elegantes */
.form input::placeholder,
.form textarea::placeholder{
  opacity: .65;
}

/* Galería 2 imágenes */
.gallery-2{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  align-items: start;
}

.media-card--mini{
  padding: 10px;
  border-radius: 18px;
}

.media-card--mini img{
  width: 100%;
  height: auto;      /* <- se adapta al tamaño real */
  object-fit: initial;
  display: block;
  border-radius: 14px;
}

@media (max-width: 900px){
  .gallery-2{
    grid-template-columns: 1fr; /* en móvil se apilan, mejor */
  }
  .media-card--mini img{
    height: 200px;
  }
}


.footer{
  padding: 42px 0;
  background: rgba(0,0,0,.22);
  border-top: 1px solid rgba(255,255,255,.08);
}

.footer__grid{
  display: grid;
  grid-template-columns: 1.4fr .8fr 1fr;
  gap: 22px;
  align-items: start;
}

.footer__title{
  font-weight: 750;
  margin: 0 0 10px;
  opacity: .95;
}

.footer__brand .footer__line{
  margin: 10px 0;
  opacity: .92;
}

.footer a{
  color: inherit;
  text-decoration: none;
}

.footer a:hover{
  text-decoration: underline;
}

.footer__sep{ opacity: .65; margin: 0 8px; }

.footer__links{
  display: grid;
  gap: 10px;
}

.footer__social{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.footer__socialLink{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  text-decoration: none !important;
  font-size: .95rem;
}

.footer__socialLink svg{ display:block; opacity:.95; }

.footer__legalLinks{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  opacity: .9;
}

@media (max-width: 980px){
  .footer__grid{
    grid-template-columns: 1fr;
  }
  .footer__socialLink span{
    display: none; /* en móvil quedan iconos limpios */
  }
}


.wa-float{
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 999;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 999px;
  background: var(--color-primary);
  color: #fff;
  text-decoration: none !important;
  box-shadow: 0 14px 44px rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.18);
}

.wa-float:hover{ filter: brightness(1.05); }

.wa-float svg{ display:block; }

@media (max-width: 520px){
  .wa-float__text{ display:none; } /* en móvil solo icono */
  .wa-float{ padding: 12px; border-radius: 999px; }
}


.legal{
  max-width: 900px;
}
.legal h1{ margin-bottom: 12px; }
.legal h2{ margin-top: 22px; }
.legal p, .legal li{ line-height: 1.65; opacity: .92; }
.legal ul{ margin: 10px 0 18px; }


/* Cookie banner */
.cookie[hidden]{ display:none !important; }

.cookie{
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: end center;
  padding: 14px;
  background: rgba(0,0,0,.45);
}

.cookie__card{
  width: min(920px, 100%);
  border-radius: 18px;
  padding: 16px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(15, 15, 15, .72);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 60px rgba(0,0,0,.35);
}

.cookie__title{
  margin: 0 0 6px 0;
  color: #fff;
  font-size: 1.15rem;
}

.cookie__text{
  margin: 0 0 12px 0;
  color: rgba(255,255,255,.86);
  line-height: 1.5;
}

.cookie__actions{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.cookie__btn{
  white-space: nowrap;
}

.cookie__settings{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.10);
  display: grid;
  gap: 10px;
}

.cookie__opt{
  display: flex;
  gap: 10px;
  align-items: center;
  color: rgba(255,255,255,.88);
  user-select: none;
}

.cookie__opt input{
  width: 18px;
  height: 18px;
}

.cookie__saveRow{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 4px;
}

.cookie__link{
  color: rgba(255,255,255,.88);
  text-decoration: underline;
}

/* Reabrir */
.cookie-reopen[hidden]{ display:none !important; }

.cookie-reopen{
  position: fixed;
  left: 16px;
  bottom: 16px;
  z-index: 999;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(15,15,15,.62);
  color: rgba(255,255,255,.92);
  backdrop-filter: blur(8px);
  cursor: pointer;
}

.cookie-reopen:hover{ filter: brightness(1.06); }

@media (max-width: 520px){
  .cookie{ place-items: end stretch; }
  .cookie__card{ border-radius: 16px; }
}



/* Páginas legales centradas */
.legal,
main.legal,
body.legal main{
  max-width: 980px;
  margin: 0 auto;
  padding: clamp(22px, 4vw, 48px) 16px;
}

/* Si tu contenido está dentro de .container, lo forzamos igual */
.legal .container{
  max-width: 980px;
  margin: 0 auto;
}

/* Mejor lectura */
.legal h1{
  margin-bottom: 16px;
}
.legal h2{
  margin-top: 28px;
}
.legal p,
.legal li{
  line-height: 1.7;
  opacity: .92;
}
.legal ul{
  margin: 12px 0 18px;
}


/* Honeypot invisible para humanos */
.hp-field{
  position: absolute !important;
  left: -9999px !important;
  width: 1px; height: 1px;
  overflow: hidden;
}

/* Mensajes del formulario */
.form-message{
  margin: 14px 0 16px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
}
.form-message.is-ok{
  border-color: rgba(120,255,170,.25);
}
.form-message.is-error{
  border-color: rgba(255,140,140,.25);
}


.cookie__title{
  display: flex;
  align-items: center;
  gap: 10px;
}

.cookie__icon{
  width: 36px;
  height: 36px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.18);
}


.cookie-reopen{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

@media (max-width: 520px){
  .cookie-reopen__text{
    display: none; /* en móvil solo icono */
  }
}


/* Imagen móvil por defecto oculta */
.hero__image--mobile { display: none; }

/* Móvil: mostrar imagen arriba y ocultar la imagen de la columna derecha */
@media (max-width: 768px){

  /* Ocultamos la imagen “desktop” */
  .hero__image--desktop { display: none; }

  /* Mostramos la imagen móvil */
  .hero__image--mobile{
    display: block;
    margin: 10px 0 12px;
  }

  /* Compacta para que entre en primera pantalla */
  .hero__image--mobile .hero__image-card{
    border-radius: 18px;
    overflow: hidden;
  }

  .hero__image--mobile .hero__image-card img{
    width: 100%;
    height: clamp(140px, 22vh, 210px);
    object-fit: cover;
    object-position: center top;
    display: block;
  }

  /* Ajustes de espaciado (para ganar “above the fold”) */
  .hero__kicker{ margin-bottom: 10px; }
  .hero__lead{ margin-bottom: 10px; }
  .hero__bullets{ margin: 10px 0 0; }

  /* Si tu H1 es enorme en móvil, lo controlamos un poco */
  .hero h1{
    font-size: clamp(34px, 8.5vw, 44px);
    line-height: 1.05;
  }
}


/* ===============================
   HERO IMAGEN - FIX MÓVIL
================================ */

@media (max-width: 768px){

  /* La imagen móvil va antes de los botones y se ve entera */
  .hero__image--mobile{
    display:block;
    margin: 16px 0 20px;
  }

  /* Ocultamos la imagen lateral de desktop */
  .hero__grid > .hero__image:not(.hero__image--mobile){
    display:none;
  }

  /* Quitamos alturas fijas y recortes */
  .hero__image--mobile .hero__image-card{
    aspect-ratio: auto;
    height: auto;
    overflow: visible;
    border-radius: 20px;
  }

  .hero__image--mobile img{
    width: 100%;
    height: auto;
    max-height: 52vh; /* clave: entra en primera pantalla */
    object-fit: contain; /* NO recorta */
    display: block;
  }
}


/* ===============================
   HERO IMAGEN: desktop vs móvil
   (pon esto al FINAL del styles.css)
================================ */

/* Base: que la imagen no se quede en 80% */
.hero__image img{
  width: 100% !important;
  height: auto;
  display: block;
}

/* Desktop: imagen lateral (puede recortar un poco, queda “pro”) */
.hero__image--desktop .hero__image-card{
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-soft);
}
.hero__image--desktop img{
  height: clamp(360px, 44vw, 520px);
  object-fit: cover;
  object-position: center;
}

/* Móvil: por defecto oculta la de desktop, muestra la mobile */
.hero__image--mobile{ display: none; }

@media (max-width: 768px){

  .hero__image--desktop{ display: none; }
  .hero__image--mobile{ display: block; margin: 14px 0 18px; }

  /* Móvil: la imagen NO se recorta */
  .hero__image--mobile .hero__image-card{
    border-radius: 18px;
    overflow: visible;       /* clave: no cortar */
    box-shadow: var(--shadow-soft);
    background: rgba(0,0,0,.10); /* por si sobra “aire” */
    padding: 10px;           /* marco bonito */
  }

  .hero__image--mobile img{
    width: 100% !important;
    height: auto !important;
    max-height: 42vh;        /* entra en primera pantalla */
    object-fit: contain !important; /* clave: se ve ENTERA */
  }
}


@media (min-width: 769px){
  .hero__image--desktop img{
    height: clamp(420px, 48vw, 580px);
    object-fit: cover;
    object-position: center 15%;
  }
}


@media (max-width: 768px){
  .slider__prev,
  .slider__next,
  .carousel__prev,
  .carousel__next,
  .carousel__arrow,
  .splide__arrow,
  .swiper-button-prev,
  .swiper-button-next{
    display:none !important;
  }
}

/* El contenedor que se desplaza (track / wrapper) */
.carousel__track,
.slider__track,
.splide__track,
.swiper{
  touch-action: pan-y; /* permite scroll vertical, swipe horizontal lo manejamos nosotros */
}


/* Ocultar flechas en móvil (packs + promos) */
@media (max-width: 768px){
  .packs-carousel .packs-carousel__nav,
  #promos .promos-nav{
    display: none !important;
  }
}


@media (max-width: 768px){
  /* Oculta flechas reales en móvil */
  .packs-carousel__nav,
  .promos-nav{
    display: none !important;
  }

  /* El swipe lo haremos nosotros: permite scroll vertical normal */
  .packs-carousel__viewport,
  .promos-viewport{
    touch-action: pan-y;
  }
}

.local-links a{
  color: inherit;
  text-decoration: underline; /* o none si lo prefieres */
  font-weight: 600;
}

.local-links a:hover{
  text-decoration: underline;
  opacity: .85;
}


@media (max-width: 768px){

  .promos-head{
    text-align: center;
  }

  .promos-pill{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    max-width: 100%;
    padding: 10px 14px;
    border-radius: 999px;
    font-size: 14px;
    line-height: 1.2;
    margin-bottom: 14px;
  }

  .promos-title{
    font-size: clamp(28px, 7.4vw, 36px);
    line-height: 1.05;
    margin: 0 0 10px;
    text-wrap: balance; /* si el navegador lo soporta, mejor */
  }

  .promos-title .emoji{
    display: inline-block;
    transform: translateY(1px);
    margin-left: 6px;
  }

  .promos-subtitle{
    font-size: 15px;
    line-height: 1.45;
    margin: 0 auto;
    max-width: 36ch; /* más compacto y legible en móvil */
  }
}

@media (max-width: 900px){
  .clinic__photo--main{ z-index: 1; }
  .clinic__photo--secondary{ z-index: 2; }
}

/* o al revés */
@media (max-width: 900px){
  .clinic__photo--main{ z-index: 2; }
  .clinic__photo--secondary{ z-index: 1; }
}


/* En móvil: mostrar solo la foto principal del collage */
@media (max-width: 900px){
  .clinic__image-collage{
    height: auto;            /* ya no necesitamos altura fija */
    min-height: 0;
    display: block;
  }

  .clinic__photo{
    position: static;        /* que deje de ser absolute */
    transform: none !important;
    width: 100% !important;
    height: auto !important;
    max-width: 420px;        /* opcional: que no se haga gigante en tablet */
    margin: 0 auto;          /* centrada */
  }

  .clinic__photo--main{
    z-index: auto;
  }

  .clinic__photo--secondary{
    display: none !important; /* adiós a la secundaria */
  }

  .clinic__photo img{
    width: 100%;
    height: auto;
    object-fit: cover;
  }
}

/* Móvil pequeño: un pelín más compacta */
@media (max-width: 600px){
  .clinic__photo{ max-width: 360px; }
}



/* ==============================
   FIX PRECIOS (móvil + tablet)
   Pegar al FINAL del styles.css
============================== */

/* Grid limpio y predecible */
.price-grid{
  display: grid;
  gap: 1.4rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Tablet */
@media (max-width: 900px){
  .price-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Móvil */
@media (max-width: 600px){
  .price-grid{
    grid-template-columns: 1fr;
  }
}

/* Cards: que no “bailen” alturas */
.price-card{
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Imagen: tamaño estable y sin recortes raros */
.price-card__image{
  display: flex;
  justify-content: center;
  align-items: center;
  margin: .75rem 0 1rem;
}

.price-card__image img{
  width: 100%;
  max-width: 220px;     /* ajusta si quieres más grande */
  height: auto;
  object-fit: contain;
  display: block;
  border-radius: 16px;
}

/* En móvil: un pelín más compacta */
@media (max-width: 600px){
  .section--precios .price-card{
    padding: 1.2rem 1.2rem 1.3rem;
  }

  .price-card__image img{
    max-width: 200px;
  }
}



/* GRID de tarjetas (ofertas/packs) */
.offers-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 18px;
}

@media (max-width: 980px){
  .offers-grid{ grid-template-columns: 1fr; }
}

/* Tarjeta */
.offer-card{
  position: relative;
  display: block;
  text-decoration: none;
  border-radius: 18px;
}

/* Recorte para imágenes verticales */
.media-clip{
  width: 100%;
  overflow: hidden;
  border-radius: 18px;
  background: #111;
  box-shadow: 0 10px 28px rgba(0,0,0,.10);
}

.media-clip img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}

/* Ofertas y Packs apaisados */
.media-clip--offer{ aspect-ratio: 16 / 9; }
.media-clip--pack{  aspect-ratio: 16 / 10; }

/* Etiqueta */
.offer-tag{
  position: absolute;
  left: 12px;
  bottom: 12px;
  background: #fff;
  color: #111;
  padding: .45rem .7rem;
  border-radius: 999px;
  font-size: 12px;
  letter-spacing: .08em;
}


.media-clip img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 50%; /* centro por defecto */
}

/* PACKS: mueve el foco un poco hacia donde está el texto */
#packs .offer-card:nth-child(1) .media-clip img{ object-position: 20% 45%; } /* Pack completo: texto izquierda */
#packs .offer-card:nth-child(2) .media-clip img{ object-position: 50% 40%; } /* Novias: suele ir centrado */
#packs .offer-card:nth-child(3) .media-clip img{ object-position: 60% 45%; } /* Básico: texto izquierda pero sujeto derecha */

/* OFERTAS: tus nav suelen tener “Pack” y estrella abajo a la izquierda */
#ofertas .offer-card:nth-child(1) .media-clip img{ object-position: 35% 65%; }
#ofertas .offer-card:nth-child(2) .media-clip img{ object-position: 35% 65%; }
#ofertas .offer-card:nth-child(3) .media-clip img{ object-position: 35% 65%; }

.media-clip img{
  object-fit: contain;
  background: #111; /* relleno */
}


/* Grid responsive */
.offers-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

@media (max-width: 980px){
  .offers-grid{ grid-template-columns: 1fr; }
}

/* Card */
.offer-card{
  display:block;
  position:relative;
  text-decoration:none;
  border-radius: 22px;
}

/* CONTENEDOR MEDIA (sirve para IMG o VIDEO) */
.media-clip{
  width:100%;
  overflow:hidden;
  border-radius: 22px;
  background:#111;
  box-shadow: 0 14px 40px rgba(0,0,0,.18);
}

/* MÁS GRANDE (antes 16/9 o 16/10 se quedaba bajo). Esto sube altura */
.media-clip--offer{ aspect-ratio: 16 / 7; }  /* ofertas más “banner” */
.media-clip--pack { aspect-ratio: 16 / 8; }  /* packs un pelín más alto */

/* IMG y VIDEO rellenan sin bandas */
.media-clip img,
.media-clip video{
  width:100%;
  height:100%;
  display:block;
  object-fit: cover;        /* rellena */
  object-position: 50% 50%; /* centrado */
}

/* Etiqueta */
.offer-tag{
  position:absolute;
  left: 14px;
  bottom: 14px;
  background:#fff;
  color:#111;
  padding: .5rem .75rem;
  border-radius:999px;
  font-size: 12px;
  letter-spacing:.08em;
}


/* ===== PROMOS (OFERTAS + PACKS) LIMPIAS, SIN RECORTES ===== */

.promos-section{
  background: #323629; /* verde oscuro */
  color: #fff;
  padding: 56px 0;
}

.promos-section .promos-head{
  text-align: center;
  max-width: 920px;
  margin: 0 auto 22px;
}

.promos-section .promos-title{
  margin: 10px 0 10px;
  color:#fff;
}

.promos-section .promos-subtitle{
  color: rgba(255,255,255,.88);
}

.promos-section .promos-pill{
  display:inline-flex;
  gap:.5rem;
  align-items:center;
  padding:.55rem .9rem;
  border-radius:999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  color:#fff;
}

.promos-section .btn.btn--ghost{
  border-color: rgba(255,255,255,.35);
  color:#fff;
  background: transparent;
}
.promos-section .btn.btn--ghost:hover{
  background: rgba(255,255,255,.08);
}

/* Grid */
.promos-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

@media (max-width: 980px){
  .promos-grid{ grid-template-columns: 1fr; }
}

/* Card */
.promo-card{
  display:block;
  text-decoration:none;
  color: inherit;
  border-radius: 22px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 16px 44px rgba(0,0,0,.22);
  overflow: hidden;
}

.promo-media{
  /* CLAVE: padding para que el borde redondo NO corte texto del cartel */
  padding: 14px;
  background: rgba(0,0,0,.18);
}

.promo-media img{
  width: 100%;
  height: 240px;          /* altura consistente */
  object-fit: contain;     /* ENTERA, sin recorte */
  display:block;
  border-radius: 16px;     /* redondeo interno, no corta el contenido */
  background: rgba(255,255,255,.04);
}

@media (max-width: 980px){
  .promo-media img{ height: 210px; }
}

.promo-meta{
  display:flex;
  justify-content: space-between;
  align-items:center;
  gap: 10px;
  padding: 14px 16px 16px;
}

.promo-badge{
  display:inline-flex;
  align-items:center;
  padding: .45rem .7rem;
  border-radius:999px;
  background:#fff;
  color:#111;
  font-size: 12px;
  letter-spacing:.06em;
}

.promo-link{
  color: rgba(255,255,255,.9);
  font-size: 13px;
  opacity: .9;
}

.promos-section .tiny{
  color: rgba(255,255,255,.7);
}


/* ===== OFERTAS: banners limpios, imagen GRANDE sin recorte ===== */
#ofertas{
  background:#323629;
  color:#fff;
  padding: 56px 0;
}

#ofertas .promos-head{
  text-align:center;
  max-width: 920px;
  margin: 0 auto 22px;
}

#ofertas .promos-pill{
  display:inline-flex;
  gap:.5rem;
  align-items:center;
  padding:.55rem .9rem;
  border-radius:999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  color:#fff;
}

#ofertas .promos-title{ color:#fff; margin: 12px 0 10px; }
#ofertas .promos-subtitle{ color: rgba(255,255,255,.88); }

#ofertas .btn.btn--ghost{
  border-color: rgba(255,255,255,.35);
  color:#fff;
  background: transparent;
}
#ofertas .btn.btn--ghost:hover{
  background: rgba(255,255,255,.08);
}

#ofertas .promos-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

@media (max-width: 980px){
  #ofertas .promos-grid{ grid-template-columns: 1fr; }
}

/* Card horizontal */
#ofertas .promo-card{
  display:block;
  text-decoration:none;
  color: inherit;
  border-radius: 20px;
  overflow:hidden;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 16px 44px rgba(0,0,0,.22);
}

/* Zona de imagen como "banner" */
#ofertas .promo-media{
  aspect-ratio: 16 / 7;              /* clave: forma horizontal bonita */
  background: rgba(0,0,0,.18);
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 10px;                      /* evita que el borde corte el diseño del cartel */
}

/* Imagen grande y ENTERA */
#ofertas .promo-media img{
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  display:block;
  object-fit: contain;                /* no recorta */
  border-radius: 14px;
  background: rgba(255,255,255,.04);
}

#ofertas .promo-meta{
  display:flex;
  justify-content: space-between;
  align-items:center;
  gap: 10px;
  padding: 12px 14px 14px;
}

#ofertas .promo-badge{
  display:inline-flex;
  align-items:center;
  padding: .45rem .7rem;
  border-radius:999px;
  background:#fff;
  color:#111;
  font-size: 12px;
  letter-spacing:.06em;
}

#ofertas .promo-link{
  color: rgba(255,255,255,.9);
  font-size: 13px;
  opacity: .9;
}

#ofertas .tiny{
  color: rgba(255,255,255,.7);
}


/* ===== Ofertas con el mismo color CLARO que Packs ===== */
.promos-navidad{
  background: #f3efe4 !important; /* beige claro (igual vibe que Packs) */
  color: #111 !important;
  padding: 76px 0 !important;
}

/* Texto */
.promos-navidad .promos-title{
  color: #111 !important;
}

.promos-navidad .promos-subtitle{
  color: rgba(0,0,0,.72) !important;
}

/* Pill superior */
.promos-navidad .promos-pill{
  background: rgba(0,0,0,.05) !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  color: rgba(0,0,0,.85) !important;
}

/* Botón ghost (si lo usas en esta sección) */
.promos-navidad .btn.btn--ghost{
  border-color: rgba(0,0,0,.22) !important;
  color: #111 !important;
  background: transparent !important;
}
.promos-navidad .btn.btn--ghost:hover{
  background: rgba(0,0,0,.06) !important;
}

/* Carrusel: tarjetas para fondo claro */
.promos-navidad .packs-slide{
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.10) !important;
}

/* Badge destacada en claro */
.promos-navidad .badge-destacada{
  background: #fff !important;
  color: #111 !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.14) !important;
}

/* Nota inferior */
.promos-navidad .promos-note{
  color: rgba(0,0,0,.55) !important;
}
.promos-navidad .promos-head .btn{
  margin-top: 22px !important;
}




/* ===== CAMBIAR EL FILO/ MARCO BLANCO A VERDE ===== */
/* Si el “filo blanco” es borde del slide */
.promos-navidad .packs-slide{
  border: 2px solid rgba(50, 54, 41, .45) !important; /* verde oscuro suavizado */
  background: rgba(50, 54, 41, .06) !important;       /* un toque para integrarlo */
}

/* Si el blanco es un borde interno o padding que se ve como marco */
.promos-navidad .packs-slide img{
  border-radius: 18px !important;
}

/* Si tienes un wrapper que pinta e/* =========================
   OFERTAS (MÓVIL): que funcione el carrusel
   ========================= */

/* En móvil queremos 1 slide por pantalla */
@media (max-width: 768px){
  /* Asegura que NO se ocultan las slides */
  .promos-navidad .packs-slide{
    display: block !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* Permite ver flechas en móvil (tu CSS global las ocultaba) */
  .promos-navidad .packs-carousel__nav{
    display: grid !important;
  }

  /* Evita “cosas raras” con gaps/anchos */
  .promos-navidad .packs-carousel__track{
    gap: 0 !important;
  }

  .promos-navidad .packs-slide{
    padding: 10px !important;
  }
}

.promos-navidad .packs-slide{
  box-shadow: 0 18px 50px rgba(0,0,0,.10) !important;
}

/* ===== Reseñas en formato 3 cards (solo imágenes) ===== */
.reviews-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

@media (max-width: 980px){
  .reviews-grid{
    grid-template-columns: 1fr; /* en móvil se apilan */
  }
}

.review-card{
  display: block;
  border-radius: 22px;
  overflow: hidden;
  background: rgba(50,54,41,.06);
  border: 2px solid rgba(50,54,41,.18);  /* filo verde */
  box-shadow: 0 18px 48px rgba(0,0,0,.10);
  text-decoration: none;
}

/* Altura “card” consistente */
.review-card img{
  width: 100%;
  height: 360px;              /* ajusta si quieres más/menos alto */
  display: block;
  object-fit: cover;          /* llena toda la card */
  object-position: center top;/* prioriza parte superior si hay texto */
}

@media (max-width: 520px){
  .review-card img{
    height: 420px; /* en móvil suelen ser capturas verticales, mejor más alto */
  }
}


/* Enlace interno bajo el hero (bonito y discreto) */
.hero .muted a{
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(255,255,255,.35);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.hero .muted a:hover{
  text-decoration-color: rgba(255,255,255,.85);
}

.hero .muted a:focus-visible{
  outline: 2px solid currentColor;
  outline-offset: 3px;
  border-radius: 6px;
}

/* HERO desktop: reduce el tamaño del vídeo sin cortar y sin descentrar */
.hero__image--desktop .hero__image-card{
  /* limita la “caja” del media */
  max-width: 520px;                 /* ajusta: 480-560 según te guste */
  margin-left: auto;                /* mantiene alineado a la derecha del grid */
  margin-right: 0;
  
  display: flex;
  align-items: center;
  justify-content: center;

  /* reduce el hueco arriba: que el contenedor se adapte mejor */
  padding-top: 0 !important;
}


/* La card manda: bordes redondos + recorte limpio */
.hero__image--desktop .hero__image-card{
  border-radius: 28px;      /* ajusta a tu gusto */
  overflow: hidden;         /* CLAVE para que el vídeo respete el borde */
  box-shadow: 0 18px 50px rgba(0,0,0,.25);
}

/* El vídeo ocupa toda la card */
.hero__image--desktop .hero__image-card video.hero__media{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;        /* rellena TODO (puede recortar) */
  object-position: center;  /* centra el recorte */
}

/* Asegura una altura decente para que no quede enano */
.hero__image--desktop .hero__image-card{
  height: clamp(420px, 62vh, 620px);
  max-width: 560px;         /* controla el ancho en escritorio */
  margin-left: auto;
}





/* Grid de vídeos */
.videos-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}
@media (max-width: 980px){
  .videos-grid{ grid-template-columns: 1fr; }
}

/* Contenedor consistente */
.media-clip--video{
  aspect-ratio: 16 / 9; /* cambia a 4/5 si tus vídeos son verticales */
}

/* El vídeo SIEMPRE entero, sin recortes */
.media-clip video{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  object-position: 50% 50%;
  position: relative;
  z-index: 2;
  background: transparent;
}

/* Reels verticales (sin recortes) */
.media-clip--reel{
  aspect-ratio: 9 / 16;
}

/* Opcional: limita el alto para que no se hagan gigantes en desktop */
@media (min-width: 981px){
  .media-clip--reel{
    max-height: 520px;
  }
}

.videos-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

@media (max-width: 980px){
  .videos-grid{ grid-template-columns: 1fr; }
}

/* Cada tarjeta reel no ocupa todo el ancho de su columna */
.videos-grid .media-clip--reel{
  width: min(320px, 100%);
  margin: 0 auto; /* centrado */
}


.reels-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}
@media (max-width: 980px){
  .reels-grid{ grid-template-columns: 1fr; }
}

/* Card de vídeo: referencia para posicionar el icono */
.hero__video-wrap{
  position: relative;
  border-radius: 28px;
  overflow: hidden; /* respeta bordes */
}

/* Vídeo ocupa el div completo (con bordes) */
.hero__video-wrap video.hero__media{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;      /* rellena la card */
  object-position: center;
}

/* Tamaño del contenedor (ajusta a gusto) */
.hero__image--desktop .hero__video-wrap{
  height: clamp(420px, 62vh, 620px);
  max-width: 560px;
  margin-left: auto;
  box-shadow: 0 18px 50px rgba(0,0,0,.25);
}

/* Botón sonido abajo a la derecha */
.hero__sound{
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 10;

  width: 44px;
  height: 44px;
  border-radius: 999px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(255,255,255,.22);
  background: rgba(0,0,0,.38);
  color: #fff;

  cursor: pointer;
  backdrop-filter: blur(8px);
}

.hero__sound:hover{
  background: rgba(0,0,0,.50);
}

.hero__sound-ic{
  font-size: 18px;
  line-height: 1;
}


/* Grid de vídeos */
.videos-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

@media (max-width: 980px){
  .videos-grid{ grid-template-columns: 1fr; }
}

/* Reel card */
.media-clip--reel{
  position: relative;
  border-radius: 22px;
  overflow: hidden;           /* bordes perfectos */
  box-shadow: 0 18px 48px rgba(0,0,0,.12);
  background: rgba(50,54,41,.06);
  border: 2px solid rgba(50,54,41,.18);
  height: clamp(420px, 60vh, 620px);  /* tamaño bonito */
}

/* Vídeo llena la card */
.media-clip--reel .reel-video{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;          /* rellena (recorta un poco si hace falta) */
  object-position: center;
}

/* Botón sonido abajo derecha */
.reel-sound{
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 10;

  width: 44px;
  height: 44px;
  border-radius: 999px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(255,255,255,.22);
  background: rgba(0,0,0,.38);
  color: #fff;

  cursor: pointer;
  backdrop-filter: blur(8px);
}

.reel-sound:hover{
  background: rgba(0,0,0,.50);
}

.reel-sound__ic{
  font-size: 18px;
  line-height: 1;
}


/* Reels: que rellenen el contenedor (RECORTA un poco, pero adiós negro) */
.media-clip--reel{
  aspect-ratio: 9 / 16;
  background: #000; /* por si acaso */
}

/* El vídeo llena todo el marco */
.media-clip--reel video{
  width: 100%;
  height: 100%;
  object-fit: cover;      /* <-- CLAVE */
  object-position: 50% 50%;
  display: block;
  position: relative;
  z-index: 2;
  background: #000;
}


.videos-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

@media (max-width: 980px){
  .videos-grid{ grid-template-columns: 1fr; }
}

.media-clip--reel{
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  height: clamp(420px, 60vh, 620px);
  border: 2px solid rgba(50,54,41,.18);
  box-shadow: 0 18px 48px rgba(0,0,0,.12);
  background: rgba(50,54,41,.06);
}

/* vídeo ocupa toda la card */
.media-clip--reel .reel-video{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}

/* botón play centrado */
.reel-play{
  position:absolute;
  inset:0;
  z-index:9;
  display:flex;
  align-items:center;
  justify-content:center;

  background: linear-gradient(to top, rgba(0,0,0,.35), rgba(0,0,0,.05));
  color:#fff;
  border:0;
  cursor:pointer;
  font-size: 56px;
}

/* icono sonido abajo derecha */
.reel-sound{
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 10;

  width: 44px;
  height: 44px;
  border-radius: 999px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(255,255,255,.22);
  background: rgba(0,0,0,.38);
  color: #fff;

  cursor: pointer;
  backdrop-filter: blur(8px);
}

.reel-sound__ic{
  font-size: 18px;
  line-height: 1;
}


.reel-play{
  position:absolute;
  inset:0;
  z-index:9;
  display:flex;
  align-items:center;
  justify-content:center;

  background: linear-gradient(to top, rgba(0,0,0,.35), rgba(0,0,0,.05));
  color:#fff;
  border:0;
  cursor:pointer;
  font-size: 56px;
  transition: opacity .15s ease;
}

/* cuando está reproduciendo, lo dejamos sutil (pero sigue clicable) */
.media-clip--reel.is-playing .reel-play{
  opacity: 0;
}

.media-clip--reel.is-playing:hover .reel-play{
  opacity: 1; /* al hover vuelve a verse para pausar */
}


.footer__social{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}

.footer__socialLink{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:999px;
  text-decoration:none;
  color: inherit;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}

.footer__socialLink i{
  font-size: 18px;
  line-height: 1;
  opacity: .95;
}

.footer__socialLink:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.22);
}

.footer__socialLink:focus-visible{
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* Imagen editorial: se ve completa, sin recorte */
.media-clip--editorial{
  aspect-ratio: auto;      /* clave */
  padding: 0;
}

.media-clip--editorial img{
  width: 100%;
  height: auto;            /* clave */
  object-fit: contain;     /* por seguridad */
  border-radius: 22px;
}

.two-col{
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 22px;
  align-items: start;
}

@media (max-width: 980px){
  .two-col{
    grid-template-columns: 1fr;
  }
}

/* Tarjeta de imagen */
.media-card{
  margin: 0;
  border-radius: 22px;
  overflow: hidden;
  background: rgba(0,0,0,.18);
  box-shadow: 0 14px 40px rgba(0,0,0,.18);

  /* CLAVE: evita que la foto sea un monstruo */
  max-width: 420px;
  margin-left: auto;  /* la pega a la derecha en desktop */
}

@media (max-width: 980px){
  .media-card{
    max-width: 100%;
    margin-left: 0;
  }
}

.media-card img{
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 980px){
  .hero__image-card.hero__video-wrap{
    border-radius: 26px;      /* ajusta: 18-30 */
    overflow: hidden;         /* CLAVE: recorta el video a la forma redondeada */
  }

  .hero__image-card.hero__video-wrap video,
  .hero__image-card.hero__video-wrap img{
    border-radius: 26px;      /* extra seguridad por si algún estilo raro pisa */
    overflow: hidden;
  }
}


.form-message{
  margin: 14px 0 18px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.10);
  font-weight: 600;
  line-height: 1.35;
}

.form-message.is-ok{
  background: rgba(46, 204, 113, .12);
  border-color: rgba(46, 204, 113, .35);
}

.form-message.is-error{
  background: rgba(231, 76, 60, .12);
  border-color: rgba(231, 76, 60, .35);
}

.contact h2{
  margin-bottom: 10px;
}

.contact .muted{
  max-width: 60ch;
  font-size: 1.05rem;
  line-height: 1.6;
  color: rgba(0,0,0,.72); /* ajusta si tu fondo es muy claro/oscuro */
  margin-bottom: 16px;
}

/* fila de badges */
.contact__badges{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0 18px;
}

/* badge "de verdad" */
.badge{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.8);
  border: 1px solid rgba(0,0,0,.10);
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
  font-weight: 600;
  font-size: .95rem;
  color: rgba(0,0,0,.85);
  white-space: nowrap;
}

/* iconitos “gratis” sin librerías */
.badge::before{
  content: "✓";
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(227, 170, 74, .20);  /* tono cálido */
  color: rgba(0,0,0,.80);
  font-size: .9rem;
  line-height: 1;
}


.contact__badges{
  padding: 10px;
  border-radius: 16px;
  background: rgba(0,0,0,.03);
  border: 1px solid rgba(0,0,0,.05);
}


/* CONTACTO: panel + jerarquía + badges */
.contact__panel{
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 18px 55px rgba(0,0,0,.10);
}

.contact__kicker{
  display:inline-block;
  font-weight: 700;
  font-size: .85rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(0,0,0,.65);
  margin: 0 0 8px;
}

.contact__title{
  margin: 0 0 10px;
}

.contact__lead{
  max-width: 62ch;
  font-size: 1.05rem;
  line-height: 1.65;
  color: rgba(0,0,0,.74);
  margin: 0 0 14px;
}

.contact__badges{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 16px;
  padding: 10px;
  border-radius: 16px;
  background: rgba(0,0,0,.03);
  border: 1px solid rgba(0,0,0,.05);
}

.badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(0,0,0,.10);
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
  font-weight: 650;
  font-size: .95rem;
  color: rgba(0,0,0,.88);
  white-space: nowrap;
}

.badge::before{
  content: "✓";
  width: 20px;
  height: 20px;
  display:grid;
  place-items:center;
  border-radius: 999px;
  background: rgba(227,170,74,.22);
  color: rgba(0,0,0,.80);
  font-size: .9rem;
  line-height: 1;
}

.badge--map::before{ content:"📍"; }
.badge--calendar::before{ content:"📅"; }
.badge--wa::before{ content:"💬"; }

/* Mensaje enviado / error */
.form-message{
  margin: 14px 0 18px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.10);
  font-weight: 650;
  line-height: 1.35;
}

.form-message.is-ok{
  background: rgba(46, 204, 113, .12);
  border-color: rgba(46, 204, 113, .35);
}

.form-message.is-error{
  background: rgba(231, 76, 60, .12);
  border-color: rgba(231, 76, 60, .35);
}

/* Panel derecha */
.contact__mediaPanel{
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 24px;
  padding: 18px;
  box-shadow: 0 18px 55px rgba(0,0,0,.08);
}

.contact__mediaTitle{
  margin: 0 0 12px;
}


.btn--ghost{
  background: rgba(255,255,255,.18);
  color: #ffffff;
  border: 1px solid rgba(255,255,255,.35);
  box-shadow: none;
}

.btn--ghost:hover{
  background: rgba(255,255,255,.26);
}


.section--bg a{ 
  color: rgba(255,255,255,.92) !important;
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,.28);
}
.section--bg a:hover{
  color:#fff !important;
  border-bottom-color: rgba(255,255,255,.65);
}


.page-h1{
  font-size: 1.6rem;
  margin: 0 0 .25rem;
}


/* ===============================
   HERO – AJUSTES MÓVIL (SEO + UX)
   =============================== */

@media (max-width: 768px) {

  /* 1. LIMPIEZA: fuera ruido arriba */
  .hero__kicker,
  .hero__kicker + .muted {
    display: none;
  }

  /* 2. HERO MÁS COMPACTO */
  .hero {
    padding-top: 20px;
    padding-bottom: 24px;
  }

  /* 3. H1 PROTAGONISTA */
  .hero h1 {
    margin-top: 0;
    margin-bottom: 10px;
    font-size: clamp(28px, 7vw, 34px);
    line-height: 1.15;
  }

  /* 4. TEXTO PRINCIPAL MÁS LEGIBLE */
  .hero__lead {
    font-size: 15px;
    line-height: 1.5;
    margin-bottom: 14px;
  }

  /* 5. BOTONES VISIBLES SIN SCROLL */
  .hero__buttons {
    margin-top: 12px;
    gap: 10px;
  }

  .hero__buttons .btn {
    padding: 12px 16px;
    font-size: 15px;
    border-radius: 999px;
  }

  /* 6. VÍDEO MÁS ABAJO Y SIN COMER PANTALLA */
  .hero__image--mobile {
    margin-top: 14px;
  }

  .hero__video-wrap {
    max-height: 360px;
    overflow: hidden;
    border-radius: 18px;
  }

  /* 7. ICONO WHATSAPP NO MOLESTA */
  .wa-float {
    bottom: 16px;
    right: 16px;
  }
}


/* ==============================
   FIX carruseles (móvil) + links “no azul”
   No rompe botones (.btn) ni nav
   ============================== */

/* --- LINKS: evita azul cutre en contenido --- */
.section a:not(.btn),
main a:not(.btn) {
  color: #b8771e;                 /* tono oro SEEDA */
  text-decoration: underline;
  text-decoration-color: rgba(184, 119, 30, .35);
  text-underline-offset: 4px;
  text-decoration-thickness: 2px;
  transition: text-decoration-color .2s ease, color .2s ease;
}

.section a:not(.btn):hover,
main a:not(.btn):hover {
  color: #d28a2a;
  text-decoration-color: rgba(210, 138, 42, .75);
}

.section a:not(.btn):focus-visible,
main a:not(.btn):focus-visible {
  outline: 2px solid rgba(210, 138, 42, .55);
  outline-offset: 3px;
  border-radius: 6px;
}

/* --- CARRUSEL: que JS mande (transform), no scroll nativo --- */
.packs-carousel { position: relative; }
.packs-carousel__viewport {
  overflow: hidden;               /* importante: sin overflow-x auto */
  width: 100%;
  touch-action: pan-y;            /* deja scroll vertical de página */
}

.packs-carousel__track {
  display: flex;
  will-change: transform;
  transition: transform .35s ease;
}

/* Desktop: 3 por vista (tu JS ya calcula 3) */
.packs-slide {
  flex: 0 0 calc(100% / 3);
}

/* Móvil: 1 por vista */
@media (max-width: 899px) {
  .packs-slide { flex: 0 0 100%; }
  .packs-carousel__track { gap: 0; }   /* sin saltitos raros */
}

/* Dots: no “scroll” raro, siempre centrados */
.packs-carousel__dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 12px;
  overflow: hidden;
}



/* ==============================
   RESEÑAS: swipe nativo en móvil (arregla el carrusel)
   ============================== */
@media (max-width: 768px){

  #resenas .packs-carousel__viewport{
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    touch-action: pan-x !important; /* clave */
  }

  #resenas .packs-carousel__track{
    display: flex !important;
    gap: 16px !important;
    padding: 0 12px 10px !important;
    transform: none !important;     /* desactiva el movimiento por translate */
  }

  #resenas .packs-slide{
    flex: 0 0 88% !important;       /* 1 tarjeta grande y asoma la siguiente */
    max-width: 88% !important;
    scroll-snap-align: start;
  }

  #resenas .packs-carousel__viewport::-webkit-scrollbar{
    display: none;
  }

  /* en móvil no queremos flechas */
  #resenas .packs-carousel__nav{
    display: none !important;
  }
}


@media (max-width: 768px){
  .packs-carousel__dots{
    pointer-events: none;
    opacity: .6;
  }
}


/* ======================================================
   AJUSTES VISUALES – LINKS + TIPOGRAFÍA (SEGUROS)
   Pegar AL FINAL del styles.css
   ====================================================== */

/* ---- LINKS (adiós azul navegador) ---- */
a{
  color: var(--color-primary-dark);
  text-decoration: underline;
  text-decoration-color: rgba(176, 109, 24, .45);
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
  transition: color .2s ease, text-decoration-color .2s ease;
}

a:hover{
  color: var(--color-primary);
  text-decoration-color: rgba(216, 139, 40, .85);
}

a:focus-visible{
  outline: 2px solid rgba(216, 139, 40, .7);
  outline-offset: 3px;
  border-radius: 6px;
}

/* En fondos oscuros (hero / header) */
.hero a,
.header a{
  color: var(--color-text);
  text-decoration-color: rgba(247, 245, 239, .35);
}

.hero a:hover,
.header a:hover{
  text-decoration-color: rgba(247, 245, 239, .85);
}

/* ---- TIPOGRAFÍA MODERNA (sin Google Fonts) ---- */
h1, h2, h3{
  font-family: system-ui, -apple-system, BlinkMacSystemFont,
               "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  letter-spacing: -0.01em;
}

/* Pesos equilibrados (no cambia tamaños) */
h1{ font-weight: 800; }
h2{ font-weight: 750; }
h3{ font-weight: 700; }

/* ---- Enlaces tipo "Ver también" más finos ---- */
.links-row a{
  font-weight: 600;
}

.links-row a:not(:last-child)::after{
  content: " · ";
  color: rgba(0,0,0,.35);
  text-decoration: none;
}


/* ======================================================
   PACKS: look más "premium" (solo estética)
   Pegar AL FINAL del styles.css
   ====================================================== */

#packs .container{
  max-width: 980px;          /* evita líneas eternas */
}

#packs .page-h1{
  font-size: clamp(30px, 3.4vw, 44px);
  line-height: 1.08;
  margin-bottom: 10px;
}

#packs .section__intro{
  font-size: 1.05rem;
  line-height: 1.65;
  max-width: 70ch;
  opacity: .92;
}

/* Bloque de enlaces "Ver también" como etiqueta elegante */
#packs .muted{
  max-width: 75ch;
}

#packs .muted a{
  font-weight: 650;
}

#packs .muted a:not(:last-child)::after{
  content: " · ";
  color: rgba(0,0,0,.28);
  text-decoration: none;
}

/* Checklist en tarjetas suaves */
#packs .checklist{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
  padding: 0;
  list-style: none;
}

#packs .checklist li{
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 16px;
  padding: 12px 14px;
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

/* Responsive checklist */
@media (max-width: 860px){
  #packs .checklist{ grid-template-columns: 1fr; }
}

/* CTA: separación y look más aireado */
#packs .cta-row{
  gap: 12px;
  flex-wrap: wrap;
}

#packs .cta-row .btn{
  border-radius: 999px;
  padding: 12px 18px;
}

/* Carrusel: un poco más premium */
#packs .packs-slide img{
  border-radius: 22px;
  box-shadow: 0 16px 34px rgba(0,0,0,.12);
}

/* FAQ un poco más limpio */
#packs #faq-packs h2{
  margin-top: 6px;
  font-size: 1.35rem;
}

/* En móvil: permitir scroll vertical aunque estés tocando el carrusel */
@media (max-width: 768px){
  .packs-carousel__viewport{
    touch-action: pan-y; /* clave: pan-y deja subir/bajar */
  }
}

@media (max-width: 768px){
  .packs-carousel__viewport{
    -webkit-overflow-scrolling: touch;
  }
}


/* ==============================
   Swiper (SEEDA) - global
   ============================== */
.seeda-swiper{
  margin-top: 12px;
}

.seeda-swiper .swiper-slide img{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 22px;
}

/* Dots */
.seeda-swiper .swiper-pagination-bullet{
  opacity: .35;
}
.seeda-swiper .swiper-pagination-bullet-active{
  opacity: 1;
}


/* =========================
   Swiper (SEEDA) carousels
   ========================= */

.seeda-swiper {
  width: 100%;
  margin-top: 16px;
}

.seeda-swiper .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

.seeda-swiper .swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 18px;
}

/* Flechas */
.seeda-swiper .swiper-button-prev,
.seeda-swiper .swiper-button-next {
  color: rgba(255,255,255,.85);
  text-shadow: 0 6px 18px rgba(0,0,0,.35);
}

.seeda-swiper .swiper-button-prev::after,
.seeda-swiper .swiper-button-next::after {
  font-size: 18px;
}

/* Dots */
.seeda-swiper .swiper-pagination-bullet {
  opacity: .35;
}

.seeda-swiper .swiper-pagination-bullet-active {
  opacity: 1;
}

/* Mejor experiencia táctil */
.seeda-swiper {
  touch-action: pan-y;
}

/* ===== HERO: FIX TITULO MÓVIL ===== */
@media (max-width: 768px){

  .hero{
    padding-top: 16px;
    padding-bottom: 24px;
  }

  .hero h1{
    font-size: clamp(26px, 6.8vw, 32px);
    line-height: 1.15;
    margin: 0 0 10px;
  }

  .hero__lead{
    font-size: 15px;
    line-height: 1.5;
    margin-bottom: 12px;
  }
}

/* ===== HERO: centrar título SOLO en móvil ===== */
@media (max-width: 768px){
  .hero .hero__text{
    text-align: center;
  }

  .hero .hero__text h1{
    margin-left: auto;
    margin-right: auto;
    max-width: 22ch;  /* para que quede bonito en 2-3 líneas */
    text-wrap: balance;
  }

  /* opcional: centra también el texto de debajo */
  .hero .hero__lead{
    margin-left: auto;
    margin-right: auto;
    max-width: 42ch;
  }

  /* opcional: lista de bullets centrada pero con texto alineado normal */
  .hero .hero__bullets{
    display: inline-block;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (max-width: 768px){
  .hero .hero__text h1{ text-align: center; }
}


/* === Conócenos / Clínica === */
.clinic {
  padding-top: clamp(28px, 4vw, 56px);
  padding-bottom: clamp(28px, 4vw, 56px);
}

.clinic__header {
  max-width: 900px;
  margin-bottom: clamp(18px, 3vw, 28px);
}

.clinic__eyebrow {
  font-size: 0.95rem;
  opacity: 0.75;
  margin: 0 0 10px;
  letter-spacing: 0.02em;
}

.clinic__title {
  font-size: clamp(1.9rem, 3.2vw, 3rem);
  line-height: 1.08;
  margin: 0 0 12px;
}

.clinic__subtitle {
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  opacity: 0.85;
  margin: 0 0 18px;
  max-width: 70ch;
}

.clinic__cta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* Grid principal */
.clinic__grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: clamp(16px, 3vw, 28px);
  align-items: start;
}

.clinic__panel {
  background: rgba(255,255,255,0.55);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 18px;
  padding: clamp(16px, 2.4vw, 22px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
  backdrop-filter: blur(6px);
}

.clinic__h2 {
  margin-top: 0;
  margin-bottom: 10px;
  font-size: clamp(1.2rem, 1.5vw, 1.4rem);
}

.clinic__links {
  margin-top: 12px;
  opacity: 0.9;
}

.clinic__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.clinic-card {
  background: rgba(255,255,255,0.45);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 16px;
  padding: 14px;
}

.clinic-card h3 {
  margin: 0 0 6px;
  font-size: 1rem;
}

.clinic-card p {
  margin: 0;
  opacity: 0.85;
  font-size: 0.95rem;
}

/* Media / collage */
.clinic__media {
  position: sticky;
  top: 88px;
}

.clinic__collage {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.clinic__img {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 16px 40px rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.2);
}

.clinic__img img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  aspect-ratio: 3 / 4;
}

.clinic__img--a {
  transform: translateY(8px);
}

.clinic__img--b {
  transform: translateY(-8px);
}

.clinic__badge {
  position: absolute;
  left: 12px;
  bottom: 12px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(0,0,0,0.08);
  font-size: 0.9rem;
  backdrop-filter: blur(6px);
}

.clinic__badge--right {
  left: auto;
  right: 12px;
}

.clinic__mini {
  margin-top: 12px;
  display: grid;
  gap: 10px;
}

.clinic__miniItem {
  background: rgba(255,255,255,0.45);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 16px;
  padding: 12px 14px;
}

.clinic__miniItem strong {
  display: block;
  margin-bottom: 2px;
}

.clinic__miniItem span {
  opacity: 0.8;
  font-size: 0.95rem;
}

/* Responsive */
@media (max-width: 980px) {
  .clinic__grid {
    grid-template-columns: 1fr;
  }
  .clinic__media {
    position: static;
  }
  .clinic__cards {
    grid-template-columns: 1fr;
  }
  .clinic__collage {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 767px){
  .hero{ padding-top: 14px; }
  .hero__grid{ padding-top: 0; }
  .hero__text{ padding-top: 0; }
  .hero__text > h1{ margin-top: 0; margin-bottom: 10px; }
  .hero__text > p{ margin-top: 0; }
  .hero__lead{ margin-top: 10px; }
  .hero__bullets{ margin-top: 10px; }
}


/* Accesible pero invisible */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}


/* Flotantes */
.float-btn{
  position: fixed;
  right: 20px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 10px rgba(0,0,0,0.3);
  text-decoration: none;
  z-index: 100000;
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.float-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.35);
}

.whatsapp-float{
  bottom: 90px;
  background: #25D366;
  color: #fff;
  font-size: 26px;
}

.whatsapp-float{
  bottom: 20px;   /* mismo bottom que cookies */
  background: #25D366;
  color: #fff;
  font-size: 26px;
}

/* HERO: foto visible en móvil, hero más "premium" */
.hero__image--mobile-intext{
  display: none;
  margin: 12px 0 14px;
}

@media (max-width: 900px){
  .hero__image--mobile-intext{ display:block; }
  .hero__image--desktop{ display:none; } /* evita duplicidad en móvil */
  .hero__lead{ margin-top: 10px; }
  .hero__bullets{ margin-top: 10px; }
}

/* Estética imagen móvil */
.hero__image--mobile-intext .hero__image-card{
  overflow: hidden;
  border-radius: 22px;
  box-shadow: 0 20px 50px rgba(0,0,0,.25);
}

.hero__image--mobile-intext img{
  width: 100%;
  height: auto;
  display: block;
}

/* ======================================================
   SEEDA UI refresh (professional, clear, responsive)
   Added as final override layer to keep existing structure.
   ====================================================== */
:root{
  --seeda-panel: #3a3f31;
  --seeda-panel-soft: rgba(255,255,255,0.08);
  --seeda-border-dark: rgba(255,255,255,0.14);
  --seeda-border-light: rgba(34,37,29,0.10);
}

html{
  scroll-behavior: smooth;
}

body{
  font-family: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--color-text);
  letter-spacing: 0.01em;
}

h1, h2, h3{
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  letter-spacing: 0.01em;
  text-wrap: balance;
}

p{
  text-wrap: pretty;
}

.section{
  padding: clamp(52px, 7vw, 92px) 0;
}

.section__intro{
  margin-bottom: clamp(20px, 3vw, 34px);
}

.header{
  background: rgba(43,47,36,0.92);
  border-bottom: 1px solid var(--seeda-border-dark);
  box-shadow: 0 8px 26px rgba(0,0,0,0.24);
}

.nav a{
  font-weight: 500;
}

.hero{
  background: radial-gradient(circle at 12% 8%, #4a513a 0, #33372b 42%, #24281e 100%);
}

.hero__copy-card{
  background: rgba(0,0,0,0.24);
  border: 1px solid var(--seeda-border-dark);
  box-shadow: 0 18px 40px rgba(0,0,0,0.22);
}

.hero__lead,
.hero__bullets li{
  color: rgba(247,245,239,0.94);
}

.hero__bullets li::before{
  content: "\\2022";
  color: var(--color-primary);
  font-weight: 700;
}

.hero__buttons .btn{
  min-height: 46px;
}

.btn{
  border-radius: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.btn--ghost{
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.26);
}

.card{
  border: 1px solid var(--seeda-border-dark);
  background: linear-gradient(180deg, rgba(72,78,60,0.72), rgba(43,47,36,0.82));
  border-radius: 18px;
}

.section--alt .card{
  border: 1px solid var(--seeda-border-light);
  border-radius: 18px;
  background: #ffffff;
}

.faq__item{
  border: 1px solid var(--seeda-border-light);
  border-radius: 14px;
}

.form input,
.form textarea{
  border-radius: 12px;
}

.footer{
  border-top: 1px solid rgba(255,255,255,0.08);
  background: #171910;
}

.footer__title{
  font-weight: 700;
  margin: 0 0 10px;
}

.footer__socialLink{
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 999px;
  padding: 8px 12px;
}

.float-btn.whatsapp-float{
  width: 56px;
  height: 56px;
  box-shadow: 0 12px 30px rgba(0,0,0,0.34);
}

@media (max-width: 980px){
  .container{
    padding: 0 1.1rem;
  }

  .hero__grid{
    gap: 1.2rem;
  }
}

@media (max-width: 768px){
  .hero{
    padding-top: 20px;
  }

  .hero__copy-card{
    border-radius: 18px;
  }

  .hero__buttons{
    width: 100%;
  }

  .hero__buttons .btn{
    width: 100%;
  }

  .nav.is-open{
    background: rgba(36,40,31,0.98);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 12px;
    padding: 10px;
    margin-top: 8px;
  }

  .nav.is-open a{
    width: 100%;
    text-align: left;
    padding: 8px 10px;
    border-radius: 8px;
  }
}

/* ======================================================
   Site-wide completion pass (all sections/pages)
   ====================================================== */
.section--bg{
  background: linear-gradient(180deg, #2f3427 0%, #25291f 100%);
  color: var(--color-text);
}

.section--bg h1,
.section--bg h2,
.section--bg h3{
  color: #fff;
}

.section--bg p,
.section--bg li{
  color: rgba(247,245,239,0.9);
}

.cta-row{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.checklist{
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.checklist li{
  background: rgba(255,255,255,0.78);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 14px;
  padding: 10px 12px;
  color: rgba(0,0,0,0.84);
}

.section--bg .checklist li{
  background: rgba(255,255,255,0.1);
  border-color: rgba(255,255,255,0.16);
  color: rgba(247,245,239,0.95);
}

.muted{
  color: rgba(0,0,0,0.66);
}

.section--bg .muted{
  color: rgba(247,245,239,0.76);
}

.media-clip{
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,0.1);
  box-shadow: 0 16px 38px rgba(0,0,0,0.18);
  background: rgba(255,255,255,0.3);
}

.media-clip img,
.media-clip video{
  display: block;
  width: 100%;
  height: auto;
}

.videos-grid{
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0,1fr));
  margin-top: 16px;
}

.legal-page__card{
  background: #fff;
  color: var(--color-text-dark);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 18px;
  padding: clamp(18px, 3vw, 32px);
  box-shadow: 0 16px 36px rgba(0,0,0,0.1);
}

.legal-page__card h1,
.legal-page__card h2,
.legal-page__card h3{
  color: #1f2118;
}

.legal-page__card h2{
  margin-top: 22px;
}

.legal-page__card ul{
  padding-left: 1.1rem;
}

.legal-page__card p,
.legal-page__card li{
  color: rgba(31,33,24,0.84);
}

@media (max-width: 980px){
  .videos-grid{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px){
  .cta-row .btn{
    width: 100%;
  }

  .checklist li{
    border-radius: 12px;
  }
}

/* ======================================================
   Premium phase: motion + spacing + polish
   ====================================================== */
:root{
  --premium-ease: cubic-bezier(.2,.7,.2,1);
}

main > .section{
  position: relative;
}

main > .section + .section{
  border-top: 1px solid rgba(0,0,0,0.04);
}

.section.hero .container,
.section--precios .container,
.section#faq .container,
.section#resenas .container{
  max-width: 1160px;
}

.section.hero h1{
  font-size: clamp(2rem, 4.2vw, 3.2rem);
  line-height: 1.08;
  margin-bottom: 12px;
}

.section.hero .hero__lead{
  max-width: 66ch;
  font-size: clamp(1rem, 1.55vw, 1.14rem);
  line-height: 1.62;
}

.section h2{
  font-size: clamp(1.55rem, 2.5vw, 2.2rem);
  line-height: 1.14;
}

.section p{
  max-width: 72ch;
}

.section .card,
.section .e-card,
.section .faq-a,
.section .legal-page__card{
  backdrop-filter: blur(3px);
}

.section .btn{
  transition: transform .24s var(--premium-ease), box-shadow .24s var(--premium-ease), filter .24s var(--premium-ease);
}

.section .btn:hover{
  transform: translateY(-2px);
}

.section .btn:active{
  transform: translateY(0);
}

.faq-a{
  transition: border-color .22s ease, box-shadow .22s ease, background-color .22s ease;
}

.faq-a:hover{
  border-color: rgba(216,139,40,0.4);
  box-shadow: 0 12px 26px rgba(0,0,0,0.07);
}

/* reveal animation */
[data-reveal]{
  opacity: 0;
  transform: translateY(18px) scale(.985);
  transition: opacity .6s var(--premium-ease), transform .6s var(--premium-ease);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}

[data-reveal].is-inview{
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* visual rhythm for SEO landing blocks */
.section.hero + .section .container,
.section.hero + .section.section--alt .container{
  padding-top: clamp(6px, 1vw, 12px);
}

.section .cta-row{
  margin-top: 12px;
}

.legal-page__card{
  max-width: 980px;
  margin: 0 auto;
}

.legal-page__card h1{
  margin-bottom: 16px;
}

.legal-page__card h2{
  margin-bottom: 8px;
}

.legal-page__card p + h2{
  margin-top: 20px;
}

@media (max-width: 980px){
  .section{
    padding: clamp(44px, 9vw, 68px) 0;
  }

  .section.hero h1{
    font-size: clamp(1.85rem, 7.8vw, 2.45rem);
  }
}

@media (max-width: 768px){
  main > .section + .section{
    border-top: none;
  }

  .section.hero .hero__lead{
    font-size: .98rem;
  }

  .section p{
    max-width: 100%;
  }

  .section .card,
  .section .e-card,
  .legal-page__card{
    border-radius: 16px;
  }

  [data-reveal]{
    transition-duration: .46s;
    transform: translateY(12px) scale(.99);
  }
}

@media (prefers-reduced-motion: reduce){
  html{
    scroll-behavior: auto;
  }

  [data-reveal]{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .section .btn,
  .faq-a{
    transition: none !important;
  }
}

/* ======================================================
   Premium fixes requested: hero + bullets + reviews
   ====================================================== */

/* Bullet robusto (evita textos rotos como "\2022") */
.hero .hero__bullets{
  list-style: none !important;
  padding: 0 !important;
}

.hero .hero__bullets li{
  position: relative;
  padding-left: 18px;
}

.hero .hero__bullets li::before{
  content: "" !important;
  position: absolute;
  left: 0;
  top: .72em;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: linear-gradient(180deg, #e19a31, #c67d1f);
  margin: 0 !important;
  opacity: 1 !important;
}

/* Hero proporcionado y más elegante */
.hero .hero__grid{
  grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr);
  gap: clamp(20px, 3vw, 42px);
}

.hero .hero__copy-card h1{
  font-size: clamp(2rem, 4.05vw, 3.45rem);
  line-height: 1.1;
  margin-bottom: 12px;
}

.hero .hero__copy-card{
  border-radius: 24px;
  padding: clamp(16px, 2vw, 24px);
}

.hero .hero__lead{
  max-width: 50ch;
}

.hero .hero__image-card{
  border-radius: 28px;
}

/* Reseñas: quitar sensación de “mini tarjetas perdidas” */
#resenas{
  padding-top: clamp(48px, 7vw, 82px);
  padding-bottom: clamp(42px, 6vw, 72px);
}

#resenas .strip__head{
  margin-bottom: 10px;
}

#resenas .seeda-swiper{
  padding: 8px 34px 6px;
}

#resenas .seeda-swiper .swiper-slide{
  display: flex;
  align-items: center;
  justify-content: center;
}

#resenas .seeda-swiper .swiper-slide img{
  width: min(100%, 360px);
  aspect-ratio: 4 / 5;
  height: auto;
  object-fit: contain;
  object-position: center center;
  margin: 0 auto;
  border-radius: 24px;
  border: 1px solid rgba(226,157,59,.45);
  box-shadow: 0 20px 42px rgba(0,0,0,.22);
  background: transparent;
}

#resenas .seeda-swiper .swiper-button-prev,
#resenas .seeda-swiper .swiper-button-next{
  color: rgba(255,255,255,.88) !important;
}

#resenas .seeda-swiper .swiper-pagination{
  margin-top: 10px;
}

@media (max-width: 980px){
  .hero .hero__grid{
    grid-template-columns: 1fr;
  }

  .hero .hero__copy-card h1{
    font-size: clamp(1.9rem, 8vw, 2.65rem);
  }
}

/* ======================================================
   Header + Cookies + Floating buttons (requested polish)
   ====================================================== */

/* Header impact */
.header{
  position: sticky;
  top: 0;
  z-index: 80;
  background: linear-gradient(180deg, rgba(28,31,24,.94) 0%, rgba(31,35,27,.9) 100%) !important;
  border-bottom: 1px solid rgba(221,169,83,.2) !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.35) !important;
}

.header__glow{
  position: absolute;
  inset: auto 0 0 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(221,169,83,.75), transparent);
  pointer-events: none;
}

.header__content{
  min-height: 74px;
}

.logo__img{
  height: 44px;
  width: auto;
}

@media (min-width: 901px){
  .nav{
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    padding: 8px 10px;
    gap: 4px;
  }

  .nav a{
    border-radius: 999px;
    padding: 8px 12px;
  }

  .nav a:hover{
    background: rgba(255,255,255,.08);
  }
}

.nav__cta{
  background: linear-gradient(135deg, #e19a31, #c57d1f) !important;
  color: #fff !important;
  border-radius: 999px;
  padding: 8px 14px !important;
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 10px 24px rgba(0,0,0,.24);
}

.nav__cta::after{
  display: none !important;
}

.nav__cta:hover{
  transform: translateY(-1px);
  filter: brightness(1.05);
}

/* Cookies UX */
.cookie{
  background: rgba(8,10,8,.38) !important;
  backdrop-filter: blur(3px);
  place-items: end right !important;
  padding: 18px !important;
}

.cookie__card{
  width: min(560px, 100%) !important;
  border-radius: 20px !important;
  border: 1px solid rgba(232,181,94,.28) !important;
  background: linear-gradient(180deg, rgba(24,28,21,.96), rgba(17,20,15,.96)) !important;
  padding: 18px 18px 16px !important;
}

.cookie__title{
  font-size: 1.05rem !important;
  margin-bottom: 8px !important;
}

.cookie__text{
  color: rgba(255,255,255,.9) !important;
  font-size: .95rem;
  margin-bottom: 14px !important;
}

.cookie__actions{
  gap: 8px !important;
}

.cookie__btn{
  min-height: 42px;
  border-radius: 10px !important;
  font-size: .93rem;
}

.cookie__settings{
  margin-top: 10px !important;
  padding-top: 10px !important;
}

.cookie__opt{
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 10px;
  padding: 10px 12px;
}

.cookie__saveRow{
  margin-top: 8px !important;
}

.cookie-reopen{
  right: 20px;
  left: auto !important;
  bottom: 86px;
  border: 1px solid rgba(232,181,94,.4) !important;
  background: rgba(20,22,18,.92) !important;
  color: #f7f5ef !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.28);
}

.cookie-reopen:hover{
  background: rgba(30,34,26,.96) !important;
}

/* Floating buttons */
.float-btn{
  z-index: 999 !important;
}

.whatsapp-float{
  right: 20px !important;
  bottom: 20px !important;
  width: 58px !important;
  height: 58px !important;
  background: linear-gradient(180deg, #2fe277 0%, #25D366 100%) !important;
  border: 1px solid rgba(255,255,255,.45);
  color: #fff !important;
}

.whatsapp-float,
.whatsapp-float:hover,
.whatsapp-float:focus-visible{
  color: #fff !important;
  text-decoration: none !important;
}

.whatsapp-float:hover{
  background: linear-gradient(180deg, #38eb81 0%, #22c25e 100%) !important;
  box-shadow: 0 14px 30px rgba(16,120,57,.45) !important;
  filter: none !important;
}

.whatsapp-float i{
  color: #fff !important;
}

body.cookie-open .whatsapp-float,
body.cookie-open .cookie-reopen{
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
}

@media (max-width: 900px){
  .header__content{
    min-height: 66px;
  }

  .logo__img{
    height: 38px;
  }
}

@media (max-width: 600px){
  .cookie{
    place-items: end stretch !important;
    padding: 10px !important;
  }

  .cookie__card{
    width: 100% !important;
    border-radius: 16px !important;
  }

  .cookie-reopen{
    bottom: 82px;
  }
}

/* ======================================================
   Redesign v3 (requested): new header + cookies side swap
   ====================================================== */

/* Header reset from previous "capsule" concept */
.header__glow{
  display: none !important;
}

.header{
  background: rgba(22,25,20,.94) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.24) !important;
}

.header__content{
  min-height: 64px !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  gap: 14px !important;
}

.logo__img{
  height: 34px !important;
  width: auto;
}

/* Nav clean and lighter */
@media (min-width: 901px){
  .nav{
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    gap: 14px !important;
  }

  .nav a{
    padding: 6px 2px !important;
    border-radius: 0 !important;
    font-size: .96rem;
    font-weight: 600;
    color: rgba(247,245,239,.88) !important;
  }

  .nav a:hover{
    background: transparent !important;
    color: #fff !important;
  }
}

.nav a::after{
  height: 2px !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -2px !important;
}

/* CTA subtle, not bulky */
.nav__cta{
  background: transparent !important;
  border: 1px solid rgba(221,169,83,.65) !important;
  color: #f0cb8b !important;
  border-radius: 10px !important;
  padding: 6px 12px !important;
  box-shadow: none !important;
}

.nav__cta:hover{
  background: rgba(221,169,83,.12) !important;
  color: #ffdb9f !important;
  transform: none !important;
}

/* Cookies: to the other side + better icon shell */
.cookie-reopen{
  left: 20px !important;
  right: auto !important;
  bottom: 22px !important;
  min-height: 42px;
  border-radius: 12px !important;
  padding: 10px 12px !important;
}

.cookie-reopen i{
  font-size: 15px;
  color: #f0cb8b;
}

.cookie-reopen__text{
  font-weight: 600;
}

/* keep whatsapp on the right and visually separated */
.whatsapp-float{
  right: 20px !important;
  left: auto !important;
  bottom: 20px !important;
}

@media (max-width: 900px){
  .header__content{
    min-height: 60px !important;
  }

  .logo__img{
    height: 31px !important;
  }
}

@media (max-width: 600px){
  .cookie-reopen{
    left: 12px !important;
    bottom: 84px !important;
  }
}

/* ======================================================
   Header redesign v4 (full rebuild)
   ====================================================== */
.header{
  background: rgba(16,19,15,.88) !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
  backdrop-filter: blur(12px);
  box-shadow: 0 8px 26px rgba(0,0,0,.25) !important;
}

.header__topline{
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
}

.header__toplineIn{
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
}

.header__metaLink{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: .83rem;
  color: rgba(247,245,239,.78) !important;
  text-decoration: none !important;
  border: 0 !important;
}

.header__metaLink:hover{
  color: #fff !important;
}

.header__content{
  min-height: 72px !important;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 20px !important;
}

.logo__img{
  height: 42px !important;
}

.nav{
  display: flex;
  justify-content: center;
  gap: 18px !important;
}

.nav a{
  color: rgba(247,245,239,.88) !important;
  font-size: .99rem;
  font-weight: 600;
  text-decoration: none !important;
  border: 0 !important;
}

.nav a:hover{
  color: #fff !important;
}

.nav a::after{
  bottom: -4px !important;
  height: 2px !important;
  left: 0 !important;
  right: 0 !important;
}

.header__book{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 12px;
  text-decoration: none !important;
  color: #fff !important;
  background: linear-gradient(135deg, #e19a31, #bf761a);
  border: 1px solid rgba(255,255,255,.2);
  box-shadow: 0 10px 22px rgba(0,0,0,.25);
  font-weight: 700;
}

.header__book:hover{
  filter: brightness(1.05);
  transform: translateY(-1px);
}

.nav__bookMobile{
  display: none;
}

/* Neutralize older header/call-to-action variants */
.header__glow,
.nav__cta{
  display: none !important;
}

@media (max-width: 1100px){
  .nav{
    gap: 12px !important;
  }
  .nav a{
    font-size: .94rem;
  }
}

@media (max-width: 900px){
  .header__topline{
    display: none;
  }

  .header__content{
    min-height: 62px !important;
    grid-template-columns: auto auto;
    justify-content: space-between;
    gap: 12px !important;
  }

  .logo__img{
    height: 34px !important;
  }

  .header__book{
    display: none;
  }

  .nav{
    display: none;
  }

  .nav.is-open{
    display: grid !important;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 8px;
    gap: 6px !important;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(20,23,18,.96) !important;
  }

  .nav.is-open a{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 44px !important;
    padding: 10px 8px !important;
    border-radius: 8px !important;
    text-align: center !important;
  }

  .nav__bookMobile{
    display: inline-flex;
    justify-content: center;
    grid-column: 1 / -1;
    margin-top: 6px;
    border-radius: 10px !important;
    padding: 10px 12px !important;
    color: #fff !important;
    background: linear-gradient(135deg, #e19a31, #bf761a);
  }
}

/* ======================================================
   Home hero redesign v5 (less zoom, cleaner premium)
   SEO text/content unchanged
   ====================================================== */
#inicio.hero{
  padding-top: clamp(14px, 2.2vw, 26px) !important;
  padding-bottom: clamp(18px, 2.8vw, 34px) !important;
  background: linear-gradient(110deg, #2f3428 0%, #283025 55%, #232a20 100%) !important;
}

#inicio.hero .hero__grid{
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr) !important;
  gap: clamp(16px, 2.2vw, 28px) !important;
  align-items: stretch !important;
}

#inicio.hero .hero__copy-card{
  padding: clamp(14px, 1.5vw, 18px) !important;
  border-radius: 16px !important;
  background: rgba(16,18,14,.34) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.18) !important;
}

#inicio.hero h1{
  font-size: clamp(1.78rem, 2.9vw, 2.9rem) !important;
  line-height: 1.1 !important;
  margin: 6px 0 10px !important;
  max-width: 13.8ch;
}

#inicio.hero .hero__lead{
  font-size: clamp(.98rem, 1.05vw, 1.08rem) !important;
  line-height: 1.44 !important;
  margin-bottom: 10px !important;
  color: rgba(247,245,239,.9) !important;
  max-width: 50ch;
}

#inicio.hero .hero__kicker{
  display: inline-block !important;
  white-space: normal !important;
  font-size: .88rem !important;
  line-height: 1.3 !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  max-width: 100%;
}

#inicio.hero .hero__bullets{
  margin-top: 6px !important;
  gap: 2px;
}

#inicio.hero .hero__bullets li{
  font-size: 1rem !important;
  line-height: 1.28 !important;
}

#inicio.hero .hero__cta{
  margin-top: 10px !important;
}

#inicio.hero .hero__buttons .btn{
  min-height: 40px !important;
  padding: 9px 14px !important;
  border-radius: 10px !important;
  font-size: .98rem !important;
}

#inicio.hero .hero__image-card{
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
}

#inicio.hero .hero__image-card img,
#inicio.hero .hero__image-card video{
  max-height: 500px;
  width: auto;
  max-width: 100%;
  object-fit: contain !important;
}

@media (max-width: 980px){
  #inicio.hero .hero__grid{
    grid-template-columns: 1fr !important;
  }

  #inicio.hero .hero__image--desktop{
    order: -1;
  }
}

@media (max-width: 768px){
  #inicio.hero h1{
    font-size: clamp(1.78rem, 8vw, 2.35rem) !important;
    max-width: 100%;
  }

  #inicio.hero .hero__copy-card{
    padding: 14px !important;
    border-radius: 14px !important;
  }

  #inicio.hero .hero__buttons .btn{
    width: 100%;
  }
}

/* ======================================================
   Home hero redesign v6 (modern editorial / 2026 look)
   ====================================================== */
#inicio.hero{
  background:
    radial-gradient(900px 320px at 16% 6%, rgba(226,165,74,.13) 0%, rgba(226,165,74,0) 60%),
    linear-gradient(120deg, #1f251d 0%, #212a1f 48%, #1c231b 100%) !important;
  padding-top: clamp(22px, 3vw, 38px) !important;
  padding-bottom: clamp(20px, 3vw, 36px) !important;
}

#inicio.hero .hero__grid{
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr) !important;
  gap: clamp(20px, 2.8vw, 36px) !important;
  align-items: center !important;
}

#inicio.hero .hero__copy-card{
  background: linear-gradient(180deg, rgba(13,16,12,.28), rgba(13,16,12,.18)) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 24px !important;
  padding: clamp(18px, 2vw, 26px) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,.24) !important;
}

#inicio.hero .hero__kicker{
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  white-space: normal !important;
  padding: 7px 12px !important;
  border-radius: 999px !important;
  font-size: .9rem !important;
  line-height: 1.25 !important;
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}

#inicio.hero h1{
  font-family: "Poppins", system-ui, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  font-size: clamp(2rem, 3.2vw, 3.15rem) !important;
  line-height: 1.04 !important;
  margin: 14px 0 12px !important;
  max-width: 12.2ch !important;
}

#inicio.hero .hero__lead{
  font-size: clamp(1rem, 1.12vw, 1.15rem) !important;
  line-height: 1.48 !important;
  color: rgba(247,245,239,.92) !important;
  margin-bottom: 12px !important;
}

#inicio.hero .hero__bullets{
  margin: 8px 0 0 !important;
  display: grid;
  gap: 8px;
}

#inicio.hero .hero__bullets li{
  padding-left: 0 !important;
  font-size: clamp(.98rem, 1.05vw, 1.08rem) !important;
  line-height: 1.3 !important;
}

#inicio.hero .hero__bullets li::before{
  content: "✓" !important;
  position: static !important;
  display: inline-block;
  width: 20px;
  margin-right: 8px !important;
  color: #e1a54a !important;
  font-weight: 700;
  background: transparent !important;
}

#inicio.hero .hero__copy-card .card{
  margin-top: 14px !important;
  border-radius: 14px !important;
  padding: 12px 14px !important;
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: none !important;
}

#inicio.hero .hero__buttons{
  margin-top: 14px !important;
  gap: 10px !important;
}

#inicio.hero .hero__buttons .btn{
  min-height: 44px !important;
  border-radius: 12px !important;
  padding: 10px 16px !important;
  font-size: .98rem !important;
  font-weight: 650 !important;
}

#inicio.hero .hero__buttons .btn.btn--ghost{
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.24) !important;
}

#inicio.hero .hero__image-card{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 26px !important;
  box-shadow: 0 18px 46px rgba(0,0,0,.26) !important;
}

#inicio.hero .hero__image-card img,
#inicio.hero .hero__image-card video{
  max-height: 560px !important;
}

@media (max-width: 980px){
  #inicio.hero .hero__grid{
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  #inicio.hero .hero__image--desktop{
    order: -1;
  }

  #inicio.hero .hero__image-card img,
  #inicio.hero .hero__image-card video{
    max-height: 420px !important;
  }
}

/* ======================================================
   Home hero redesign v7 (clean professional baseline)
   ====================================================== */
#inicio.hero{
  background: #222a20 !important;
  padding-top: 14px !important;
  padding-bottom: 22px !important;
}

#inicio.hero .container{
  max-width: 1180px;
}

#inicio.hero .hero__grid{
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr) !important;
  gap: 22px !important;
  align-items: center !important;
}

#inicio.hero .hero__copy-card{
  padding: 16px 18px !important;
  border-radius: 14px !important;
  background: rgba(0,0,0,.18) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: none !important;
}

#inicio.hero .hero__kicker{
  font-size: .86rem !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.04) !important;
}

#inicio.hero h1{
  font-family: "Poppins", system-ui, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
  font-size: clamp(1.95rem, 3vw, 2.85rem) !important;
  line-height: 1.06 !important;
  margin: 10px 0 8px !important;
  max-width: 12.8ch !important;
}

#inicio.hero .hero__lead{
  font-size: clamp(.98rem, 1.08vw, 1.08rem) !important;
  line-height: 1.43 !important;
  margin-bottom: 8px !important;
}

#inicio.hero .hero__bullets{
  margin-top: 6px !important;
  display: grid;
  gap: 5px;
}

#inicio.hero .hero__bullets li{
  font-size: 1rem !important;
  line-height: 1.28 !important;
}

#inicio.hero .hero__bullets li::before{
  content: "•" !important;
  display: inline-block;
  position: static !important;
  width: 14px;
  color: #d89636 !important;
  font-weight: 700;
  margin-right: 6px !important;
  background: transparent !important;
}

#inicio.hero .hero__copy-card .card{
  margin-top: 10px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.05) !important;
  box-shadow: none !important;
}

#inicio.hero .hero__buttons{
  margin-top: 10px !important;
  gap: 8px !important;
}

#inicio.hero .hero__buttons .btn{
  min-height: 40px !important;
  padding: 9px 14px !important;
  border-radius: 10px !important;
  font-size: .97rem !important;
}

#inicio.hero .hero__image-card{
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.02) !important;
  box-shadow: none !important;
}

#inicio.hero .hero__image-card img,
#inicio.hero .hero__image-card video{
  max-height: 470px !important;
}

@media (max-width: 980px){
  #inicio.hero .hero__grid{
    grid-template-columns: 1fr !important;
  }

  #inicio.hero .hero__image--desktop{
    order: -1;
  }

  #inicio.hero .hero__image-card img,
  #inicio.hero .hero__image-card video{
    max-height: 360px !important;
  }
}

/* ======================================================
   Mobile polish (hero + fixed buttons)
   ====================================================== */
@media (max-width: 768px){
  .header__content{
    min-height: 58px !important;
  }

  .logo__img{
    height: 30px !important;
  }

  #inicio.hero{
    padding-top: 8px !important;
    padding-bottom: 16px !important;
  }

  #inicio.hero .hero__image--desktop{
    display: none !important;
  }

  #inicio.hero .hero__image--mobile-intext{
    display: block !important;
    margin: 4px 0 10px !important;
  }

  #inicio.hero .hero__image--mobile-intext .hero__image-card{
    border-radius: 12px !important;
  }

  #inicio.hero .hero__image--mobile-intext img{
    width: 100%;
    max-height: 160px !important;
    object-fit: cover !important;
    object-position: center 8%;
  }

  #inicio.hero .hero__copy-card{
    padding: 12px !important;
    border-radius: 12px !important;
  }

  #inicio.hero .hero__kicker{
    display: block !important;
    font-size: .82rem !important;
    line-height: 1.25 !important;
    margin-bottom: 8px !important;
  }

  #inicio.hero h1{
    font-size: clamp(1.95rem, 9vw, 2.35rem) !important;
    line-height: 1.03 !important;
    margin-bottom: 8px !important;
  }

  #inicio.hero .hero__lead{
    font-size: 1.02rem !important;
    line-height: 1.36 !important;
    margin-bottom: 8px !important;
  }

  #inicio.hero .hero__bullets{
    gap: 6px !important;
    margin-top: 6px !important;
  }

  #inicio.hero .hero__bullets li{
    font-size: 1rem !important;
    line-height: 1.24 !important;
  }

  #inicio.hero .hero__copy-card .card{
    margin-top: 8px !important;
    padding: 10px !important;
  }

  #inicio.hero .hero__buttons{
    gap: 8px !important;
  }

  #inicio.hero .hero__buttons .btn{
    width: 100%;
    min-height: 42px !important;
  }

  /* deja espacio para flotantes y evita que tapen el CTA */
  #inicio.hero .hero__cta{
    padding-bottom: 84px !important;
  }

  .whatsapp-float{
    width: 52px !important;
    height: 52px !important;
    right: 10px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 12px) !important;
  }

  .cookie-reopen{
    left: 10px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 12px) !important;
    min-height: 38px !important;
    padding: 8px 10px !important;
  }
}

/* ======================================================
   Mobile hero priority fix (cleaner and less clutter)
   ====================================================== */
@media (max-width: 768px){
  main{
    padding-bottom: 74px;
  }

  #inicio.hero{
    padding-top: 6px !important;
    padding-bottom: 12px !important;
  }

  #inicio.hero .hero__grid{
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  /* keep trust image visible on mobile, but controlled */
  #inicio.hero .hero__image--mobile-intext{
    display: block !important;
    margin: 0 0 10px !important;
  }

  #inicio.hero .hero__image--mobile-intext .hero__image-card{
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.18) !important;
    background: rgba(255,255,255,.03) !important;
  }

  #inicio.hero .hero__image--mobile-intext img{
    width: 100% !important;
    height: 180px !important;
    object-fit: cover !important;
    object-position: center 15% !important;
    display: block;
  }

  #inicio.hero .hero__text{
    text-align: left !important;
  }

  #inicio.hero .hero__copy-card{
    margin-top: 0 !important;
    padding: 12px !important;
    border-radius: 12px !important;
    background: rgba(11,14,11,.32) !important;
    border: 1px solid rgba(255,255,255,.09) !important;
    box-shadow: none !important;
  }

  #inicio.hero .hero__kicker{
    display: block !important;
    font-size: .78rem !important;
    line-height: 1.25 !important;
    padding: 6px 9px !important;
    margin-bottom: 8px !important;
    text-align: center !important;
  }

  #inicio.hero h1{
    font-size: clamp(1.78rem, 8.2vw, 2.18rem) !important;
    line-height: 1.06 !important;
    letter-spacing: -0.01em !important;
    margin: 0 0 8px !important;
    max-width: 100% !important;
    text-align: left !important;
  }

  #inicio.hero .hero__lead{
    font-size: 1.03rem !important;
    line-height: 1.36 !important;
    margin: 0 0 8px !important;
    text-align: left !important;
  }

  #inicio.hero .hero__bullets{
    margin-top: 2px !important;
    gap: 4px !important;
  }

  #inicio.hero .hero__bullets li{
    font-size: .98rem !important;
    line-height: 1.26 !important;
    margin: 0 !important;
  }

  #inicio.hero .hero__copy-card .card{
    margin-top: 8px !important;
    padding: 9px 10px !important;
    border-radius: 10px !important;
  }

  #inicio.hero .hero__cta{
    margin-top: 8px !important;
    padding-bottom: 0 !important;
  }

  #inicio.hero .hero__buttons{
    gap: 8px !important;
  }

  #inicio.hero .hero__buttons .btn{
    width: 100% !important;
    min-height: 42px !important;
  }

  .whatsapp-float{
    width: 50px !important;
    height: 50px !important;
    right: 10px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 10px) !important;
  }

  .cookie-reopen{
    width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    left: 10px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 10px) !important;
    padding: 0 !important;
    justify-content: center;
  }

  .cookie-reopen__text{
    display: none !important;
  }
}

/* ======================================================
   Packs destacados (ofertas) refinement
   ====================================================== */
#ofertas.promos-navidad{
  padding-top: clamp(44px, 6vw, 70px) !important;
  padding-bottom: clamp(36px, 5vw, 60px) !important;
  background: #f3f0e7 !important;
}

#ofertas .container{
  max-width: 1180px;
}

#ofertas .promos-head{
  max-width: 760px;
  margin: 0 auto 18px;
  text-align: center;
}

#ofertas .promos-pill{
  font-size: .9rem !important;
  font-weight: 650;
  color: #3a3b32 !important;
  background: #ebe7dc !important;
  border: 1px solid rgba(26,30,24,.14) !important;
  padding: 8px 14px !important;
}

#ofertas .promos-title{
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: clamp(2rem, 3vw, 2.7rem) !important;
  letter-spacing: -0.01em;
  color: #1f2118 !important;
  margin: 12px 0 10px !important;
}

#ofertas .promos-subtitle{
  color: rgba(31,33,24,.82) !important;
  font-size: clamp(1rem, 1.1vw, 1.14rem);
  line-height: 1.55;
  margin: 0 auto 14px !important;
  max-width: 62ch;
}

#ofertas .promos-cta{
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

#ofertas .promos-cta .btn{
  min-height: 42px;
  padding: 10px 16px !important;
  border-radius: 10px !important;
  font-weight: 650;
  box-shadow: 0 10px 22px rgba(0,0,0,.1);
  color: #fff !important;
  text-decoration: none !important;
  border-bottom: 0 !important;
}

#ofertas .promos-cta .btn:hover{
  color: #fff !important;
  text-decoration: none !important;
  background: linear-gradient(135deg, #f0a43a, #cf8420) !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.14);
}

#ofertas .promos-cta .btn:focus-visible{
  color: #fff !important;
  outline: 2px solid rgba(207,132,32,.45) !important;
  outline-offset: 2px;
}

#ofertas .seeda-swiper{
  margin-top: 16px !important;
  padding: 20px 18px 24px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(31,33,24,.08);
  border-radius: 34px;
  box-shadow: 0 18px 40px rgba(28,31,24,.08);
}

#ofertas .seeda-swiper .swiper-slide{
  align-items: stretch !important;
}

#ofertas .seeda-swiper .swiper-slide img{
  width: 100% !important;
  aspect-ratio: 4 / 5;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 28px !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.12) !important;
  background: #ddd8ca;
}

#ofertas .seeda-swiper .swiper-wrapper{
  align-items: stretch !important;
}

#ofertas .seeda-swiper .swiper-slide{
  height: auto !important;
  min-height: 520px;
}

/* Ajuste fino para la imagen central (pack mitades) */
#ofertas .seeda-swiper .swiper-slide:nth-child(2) img{
  object-position: center center !important;
}

#ofertas .seeda-swiper .swiper-button-prev,
#ofertas .seeda-swiper .swiper-button-next{
  color: rgba(31,33,24,.8) !important;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  background: rgba(255,255,255,.8);
  border: 1px solid rgba(31,33,24,.12);
}

#ofertas .seeda-swiper .swiper-button-prev::after,
#ofertas .seeda-swiper .swiper-button-next::after{
  font-size: 13px !important;
  font-weight: 800;
}

#ofertas .seeda-swiper .swiper-pagination{
  margin-top: 10px;
}

#ofertas .promos-note{
  margin-top: 10px !important;
  font-size: .98rem;
  color: rgba(31,33,24,.72);
}

@media (max-width: 768px){
  #ofertas .promos-head{
    margin-bottom: 12px;
  }

  #ofertas .promos-cta{
    width: 100%;
  }

  #ofertas .promos-cta .btn{
    width: 100%;
  }

  #ofertas .seeda-swiper{
    padding-bottom: 8px;
  }

  #ofertas .seeda-swiper .swiper-slide{
    min-height: auto;
  }
}

/* ======================================================
   SEO landings: Chiclana / San Fernando
   Keep these pages independent from the home hero styling
   ====================================================== */
.seo-landing{
  padding-top: clamp(28px, 4vw, 56px) !important;
  padding-bottom: clamp(28px, 4vw, 52px) !important;
  background: linear-gradient(120deg, #252c22 0%, #20271e 52%, #1b2119 100%) !important;
}

.seo-landing .container{
  max-width: 1040px;
}

.seo-landing h1{
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: clamp(2.35rem, 4.3vw, 4.4rem) !important;
  line-height: 1.04 !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 16px !important;
  max-width: 12ch;
  color: #f6f2e8;
}

.seo-landing .hero__lead{
  max-width: 30ch;
  font-size: clamp(1.06rem, 1.5vw, 1.3rem) !important;
  line-height: 1.55 !important;
  color: rgba(247,245,239,.9) !important;
  margin: 0 0 18px !important;
}

.seo-landing .muted{
  max-width: 72ch;
  font-size: 1.02rem;
  line-height: 1.65;
  color: rgba(247,245,239,.78) !important;
}

.seo-landing .media-clip.media-clip--pack{
  aspect-ratio: 16 / 7 !important;
  border-radius: 22px !important;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.03) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.2) !important;
}

.seo-landing .media-clip.media-clip--pack img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 34% !important;
}

.seo-landing .cta-row{
  gap: 12px !important;
  margin-top: 18px !important;
}

.seo-landing .cta-row .btn{
  min-height: 46px;
  padding: 11px 18px !important;
  border-radius: 12px !important;
  color: #fff !important;
  text-decoration: none !important;
}

.seo-landing .cta-row .btn.btn--ghost{
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  color: #f6f2e8 !important;
}

.seo-landing a:not(.btn){
  color: #e39a32 !important;
  text-decoration-color: rgba(227,154,50,.35) !important;
}

.seo-landing a:not(.btn):hover{
  color: #f0b45b !important;
  text-decoration-color: rgba(240,180,91,.7) !important;
}

@media (max-width: 900px){
  .seo-landing{
    padding-top: 20px !important;
    padding-bottom: 26px !important;
  }

  .seo-landing h1{
    font-size: clamp(2rem, 8vw, 2.75rem) !important;
    max-width: 100%;
  }

  .seo-landing .hero__lead{
    max-width: 100%;
    font-size: 1.02rem !important;
  }

  .seo-landing .media-clip.media-clip--pack{
    aspect-ratio: 16 / 10 !important;
    border-radius: 16px !important;
  }

  .seo-landing .cta-row .btn{
    width: 100%;
  }
}







/* ======================================================
   Home index redesign: SEO + CRO + responsive
   ====================================================== */
.home-hero{
  padding: clamp(28px, 4vw, 56px) 0 clamp(34px, 5vw, 70px) !important;
  background:
    radial-gradient(circle at 12% 18%, rgba(197,143,46,.18), transparent 28%),
    radial-gradient(circle at 82% 20%, rgba(255,255,255,.05), transparent 24%),
    linear-gradient(135deg, #20261e 0%, #242d22 45%, #1a1f18 100%) !important;
}

.home-hero .container{
  max-width: 1180px;
}

.home-hero__grid{
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
  gap: clamp(26px, 3vw, 46px);
  align-items: center;
}

.home-hero__copy{
  display: grid;
  gap: 18px;
}

.home-hero__eyebrow{
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  width: fit-content;
  max-width: 100%;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  color: rgba(247,245,239,.9);
  font-size: .95rem;
  line-height: 1.35;
}

.home-hero h1{
  margin: 0;
  max-width: 11ch;
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: clamp(3rem, 5.3vw, 5.4rem) !important;
  line-height: .98 !important;
  letter-spacing: -0.03em;
  color: #f7f4ec;
}

.home-hero__lead{
  margin: 0;
  max-width: 33ch;
  color: rgba(247,245,239,.9);
  font-size: clamp(1.08rem, 1.55vw, 1.34rem);
  line-height: 1.58;
}

.home-hero__trust{
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.home-hero__trustItem{
  position: relative;
  padding-left: 26px;
  color: rgba(247,245,239,.94);
  font-size: 1.03rem;
  line-height: 1.45;
}

.home-hero__trustItem::before{
  content: "";
  position: absolute;
  left: 0;
  top: .5em;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(135deg, #f0b24f, #d78823);
  box-shadow: 0 0 0 4px rgba(240,178,79,.14);
}

.home-hero__contact{
  display: grid;
  gap: 6px;
  padding: 18px 20px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 22px !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.18) !important;
}

.home-hero__contact p{
  margin: 0;
  color: rgba(247,245,239,.88);
}

.home-hero__contact a{
  color: #f0b24f !important;
  text-decoration-color: rgba(240,178,79,.4) !important;
}

.home-hero__phone{
  white-space: nowrap !important;
  display: inline-block;
}

.home-hero__cta{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.home-hero__cta .btn{
  min-height: 50px;
  padding: 13px 22px !important;
  border-radius: 14px !important;
  text-decoration: none !important;
}

.home-hero__cta .btn.btn--ghost{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  color: #f7f4ec !important;
}

.home-hero__links{
  display: flex;
  flex-wrap: wrap;
  gap: 14px 18px;
}

.home-hero__links a{
  color: #f0b24f !important;
  font-weight: 600;
  text-decoration-color: rgba(240,178,79,.32) !important;
}

.home-hero__media{
  display: grid;
  gap: 14px;
}

.home-hero__imageWrap{
  position: relative;
  overflow: hidden;
  border-radius: 30px;
  min-height: 540px;
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 30px 60px rgba(0,0,0,.2);
}

.home-hero__imageWrap::after{
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 38%;
  background: linear-gradient(180deg, transparent, rgba(15,17,13,.12));
  pointer-events: none;
}

.home-hero__imageWrap img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  display: block;
}

.home-hero__badge{
  padding: 18px 20px;
  border-radius: 20px;
  background: rgba(13,15,12,.52);
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 18px 34px rgba(0,0,0,.18);
}

.home-hero__badgeLabel{
  display: inline-block;
  margin-bottom: 6px;
  color: rgba(240,178,79,.95);
  font-size: .83rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.home-hero__badge strong{
  display: block;
  color: #f7f4ec;
  font-size: 1.16rem;
  line-height: 1.3;
}

.home-hero__badge p{
  margin: 8px 0 0;
  color: rgba(247,245,239,.82);
  line-height: 1.55;
}

.home-tech{
  background: #f4f0e7 !important;
}

.home-tech .container{
  max-width: 1180px;
}

.home-tech__intro{
  max-width: 760px;
  margin: 0 auto 26px;
  text-align: center;
}

.home-tech__intro h2{
  margin: 12px 0 12px;
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: clamp(2.2rem, 4vw, 3.45rem) !important;
  line-height: 1.02;
  color: #1d2118;
}

.home-tech__intro p{
  margin: 0;
  color: rgba(29,33,24,.8);
  font-size: 1.08rem;
  line-height: 1.65;
}

.section-pill{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 8px 16px;
  border-radius: 999px;
  background: #ece7dc;
  border: 1px solid rgba(29,33,24,.12);
  color: #44453b;
  font-size: .92rem;
  font-weight: 700;
}

.home-tech__types{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.home-tech__type{
  height: 100%;
  padding: 22px !important;
  border-radius: 20px !important;
  background: #fffdf8 !important;
  border: 1px solid rgba(29,33,24,.08) !important;
  box-shadow: 0 14px 30px rgba(27,30,22,.06) !important;
}

.home-tech__type--featured{
  background: linear-gradient(135deg, #21281e, #2a3426) !important;
  border-color: rgba(240,178,79,.28) !important;
}

.home-tech__typeLabel{
  display: inline-block;
  margin-bottom: 12px;
  color: #b16f18;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.home-tech__type h3{
  margin: 0 0 10px;
  font-size: 1.42rem;
  line-height: 1.2;
  color: #1d2118;
}

.home-tech__type p{
  margin: 0;
  color: rgba(29,33,24,.76);
  line-height: 1.6;
}

.home-tech__type--featured .home-tech__typeLabel,
.home-tech__type--featured h3,
.home-tech__type--featured p{
  color: #f7f4ec;
}

.home-tech__grid{
  display: grid;
  grid-template-columns: 1.2fr .9fr .9fr;
  gap: 16px;
}

.home-tech__panel{
  height: 100%;
  padding: 24px !important;
  border-radius: 22px !important;
  background: #fffdf8 !important;
  border: 1px solid rgba(29,33,24,.08) !important;
  box-shadow: 0 16px 36px rgba(27,30,22,.07) !important;
}

.home-tech__panel--highlight{
  background: linear-gradient(135deg, #242c20, #303a2a) !important;
  border-color: rgba(240,178,79,.26) !important;
}

.home-tech__panel h3{
  margin: 0 0 12px;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 1.7rem;
  line-height: 1.12;
  color: #1d2118;
}

.home-tech__panel p{
  margin: 0 0 12px;
  color: rgba(29,33,24,.8);
  line-height: 1.7;
}

.home-tech__panel ul{
  margin: 0;
  padding-left: 18px;
  color: rgba(29,33,24,.84);
  line-height: 1.7;
}

.home-tech__panel--highlight h3,
.home-tech__panel--highlight p,
.home-tech__panel--highlight ul{
  color: #f7f4ec;
}

.home-tech__footer{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 18px;
  padding: 22px 24px !important;
  border-radius: 22px !important;
  background: linear-gradient(135deg, #fbf8ef, #f0ebdf) !important;
  border: 1px solid rgba(29,33,24,.1) !important;
}

.home-tech__footer p{
  margin: 0;
  color: rgba(29,33,24,.82);
  line-height: 1.65;
}

.home-tech__footerLinks{
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.home-tech__footerLinks a{
  color: #b16f18 !important;
  font-weight: 700;
  text-decoration-color: rgba(177,111,24,.3) !important;
}

@media (max-width: 1080px){
  .home-hero__grid,
  .home-tech__grid{
    grid-template-columns: 1fr;
  }

  .home-tech__types{
    grid-template-columns: 1fr;
  }

  .home-hero h1,
  .home-hero__lead{
    max-width: 100%;
  }

  .home-hero__imageWrap{
    min-height: 460px;
  }

  .home-tech__footer{
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 768px){
  .home-hero{
    padding-top: 20px !important;
    padding-bottom: 26px !important;
  }

  .home-hero__grid{
    gap: 18px;
  }

  .home-hero__copy{
    gap: 14px;
  }

  .home-hero__eyebrow{
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: 10px 14px;
    font-size: .9rem;
  }

  .home-hero h1{
    font-size: clamp(2.35rem, 11vw, 3.35rem) !important;
    text-align: center;
  }

  .home-hero__lead,
  .home-hero__contact p{
    text-align: center;
  }

  .home-hero__trust{
    gap: 10px;
  }

  .home-hero__trustItem{
    font-size: .98rem;
    line-height: 1.4;
  }

  .home-hero__contact{
    padding: 16px !important;
    border-radius: 18px !important;
  }

  .home-hero__cta{
    display: grid;
    grid-template-columns: 1fr;
  }

  .home-hero__cta .btn{
    width: 100%;
    justify-content: center;
  }

  .home-hero__links{
    justify-content: center;
    gap: 10px 14px;
  }

  .home-hero__media{
    order: -1;
  }

  .home-hero__imageWrap{
    min-height: 280px;
    max-height: 360px;
    border-radius: 22px;
  }

  .home-hero__imageWrap img{
    object-position: center top;
  }

  .home-hero__badge{
    padding: 16px;
    border-radius: 18px;
  }

  .home-tech{
    padding-top: 34px !important;
    padding-bottom: 34px !important;
  }

  .home-tech__intro{
    margin-bottom: 18px;
  }

  .home-tech__intro p,
  .home-tech__panel p,
  .home-tech__type p,
  .home-tech__footer p{
    font-size: .98rem;
    line-height: 1.6;
  }

  .home-tech__type,
  .home-tech__panel,
  .home-tech__footer{
    padding: 18px !important;
    border-radius: 18px !important;
  }

  .home-tech__panel h3{
    font-size: 1.42rem;
  }

  .home-tech__footerLinks{
    width: 100%;
    gap: 10px;
  }
}

/* ======================================================
   Home cleanup: typography spacing + image centering
   ====================================================== */
.header{
  background: rgba(16,19,15,.92) !important;
}

.header__content{
  min-height: 76px !important;
}

.logo{
  display: inline-flex;
  align-items: center;
  line-height: 0;
}

.logo__img{
  display: block;
  height: 46px !important;
  width: auto;
  max-height: none;
}

.home-hero__eyebrow{
  padding: 12px 18px !important;
  line-height: 1.55 !important;
}

.home-hero{
  background:
    radial-gradient(circle at 14% 22%, rgba(201,154,69,.12), transparent 24%),
    linear-gradient(135deg, #1c211a 0%, #21271e 48%, #171b16 100%) !important;
}

.home-hero h1{
  max-width: 10.6ch;
  font-size: clamp(2.85rem, 4.9vw, 5rem) !important;
  line-height: 1.06 !important;
  letter-spacing: -0.02em !important;
}

.home-hero__lead{
  max-width: 34ch;
  font-size: clamp(1.05rem, 1.45vw, 1.28rem);
  line-height: 1.72 !important;
}

.home-hero__trust{
  gap: 14px;
}

.home-hero__trustItem{
  line-height: 1.6 !important;
}

.home-hero__imageWrap{
  min-height: 510px;
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.home-hero__imageWrap img{
  width: 100%;
  height: 100%;
  object-fit: cover !important;
  object-position: center 24% !important;
}

.home-tech__intro h2,
#ofertas .promos-title,
#precios .strip__head h2,
#resenas .strip__head h2,
#ubicacion .strip__head h2{
  line-height: 1.12 !important;
  letter-spacing: -0.015em;
}

#ofertas .seeda-swiper .swiper-slide{
  min-height: 540px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

#ofertas .seeda-swiper .swiper-slide img{
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
}

#precios .price-grid{
  align-items: stretch;
}

#precios .price-card{
  padding: 28px 24px !important;
}

#precios .price-card h3{
  margin-bottom: 10px;
  line-height: 1.1;
}

#precios .price-card .price{
  margin-bottom: 16px;
  line-height: 1.1;
}

#precios .price-card .small{
  line-height: 1.65;
}

#precios .price-card__image{
  min-height: 300px;
  margin: 0 0 18px;
  border-radius: 30px;
  overflow: hidden;
}

#precios .price-card__image img{
  width: 100% !important;
  max-width: 280px !important;
  max-height: 280px;
  object-fit: contain !important;
  object-position: center center !important;
  border-radius: 30px;
}

@media (max-width: 768px){
  .home-hero h1{
    font-size: clamp(2.2rem, 9.2vw, 3.05rem) !important;
    line-height: 1.08 !important;
  }

  .header__content{
    min-height: 68px !important;
  }

  .logo__img{
    height: 38px !important;
  }

  .home-hero__lead{
    max-width: 100%;
    line-height: 1.64 !important;
  }

  .home-hero__imageWrap{
    min-height: 320px;
    max-height: 360px;
  }

  .home-hero__imageWrap img{
    object-position: center 18% !important;
  }

  #ofertas .seeda-swiper .swiper-slide{
    min-height: auto;
  }

  #precios .price-card{
    padding: 22px 20px !important;
  }

  #precios .price-card__image{
    min-height: 220px;
  }

  #precios .price-card__image img{
    max-width: 220px !important;
    max-height: 220px;
  }
}

/* ======================================================
   Home final polish: rounded, cleaner, consistent
   ====================================================== */
.home-hero .container,
#reservas .container,
#faq .container,
#resenas .container,
#ubicacion .container{
  max-width: 1180px;
}

.home-hero{
  padding-top: clamp(24px, 4vw, 44px) !important;
  padding-bottom: clamp(34px, 5vw, 62px) !important;
}

.home-hero__grid{
  gap: clamp(24px, 3vw, 38px);
}

.home-hero__copy{
  padding: clamp(22px, 3vw, 32px);
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.025));
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 44px rgba(0,0,0,.16);
}

.home-hero__eyebrow{
  border-radius: 999px !important;
}

.home-hero__contact{
  border-radius: 24px !important;
}

.home-hero__imageWrap{
  border-radius: 34px !important;
}

.home-hero__badge{
  border-radius: 24px !important;
}

#reservas{
  padding-top: clamp(34px, 5vw, 56px) !important;
  padding-bottom: clamp(34px, 5vw, 56px) !important;
}

.reservas-card{
  border-radius: 30px !important;
  padding: clamp(22px, 3vw, 32px) !important;
  background: linear-gradient(180deg, rgba(15,15,15,.56), rgba(15,15,15,.42)) !important;
  box-shadow: 0 22px 48px rgba(0,0,0,.24) !important;
}

#faq{
  background: #f5f1e8;
}

#faq .container{
  padding: clamp(24px, 3vw, 34px);
  border-radius: 34px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(31,33,24,.08);
  box-shadow: 0 18px 40px rgba(28,31,24,.06);
}

#faq .section__head{
  margin-bottom: 22px;
}

#faq .faq-accordion{
  max-width: 100%;
  gap: 14px;
}

#faq .faq-a{
  border-radius: 22px !important;
  background: #fffdf8 !important;
  border: 1px solid rgba(31,33,24,.08) !important;
  box-shadow: 0 10px 24px rgba(28,31,24,.04);
}

#faq .faq-a__q{
  padding: 18px 20px;
}

#faq .faq-a__a{
  padding: 0 20px 18px 20px;
  border-top-color: rgba(31,33,24,.08);
}

#resenas{
  background: #f5f1e8;
  overflow: hidden;
}

#resenas .container{
  padding: clamp(24px, 3vw, 34px);
  border-radius: 34px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(31,33,24,.08);
  box-shadow: 0 18px 40px rgba(28,31,24,.06);
}

#resenas .seeda-swiper{
  padding: 18px 22px 20px;
  border-radius: 30px;
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(31,33,24,.06);
}

#resenas .seeda-swiper .swiper-slide img{
  border-radius: 26px !important;
}

#ubicacion{
  background: #f5f1e8;
}

#ubicacion .container{
  padding: clamp(24px, 3vw, 34px);
  border-radius: 34px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(31,33,24,.08);
  box-shadow: 0 18px 40px rgba(28,31,24,.06);
}

#ubicacion .grid{
  gap: 18px !important;
}

#ubicacion .card{
  border-radius: 26px !important;
  border: 1px solid rgba(31,33,24,.08) !important;
  box-shadow: 0 12px 28px rgba(28,31,24,.05);
  background: #fffdf8 !important;
}

#ubicacion iframe{
  display: block;
}

@media (max-width: 768px){
  .home-hero__copy,
  #faq .container,
  #resenas .container,
  #ubicacion .container{
    padding: 18px;
    border-radius: 26px;
  }

  .home-hero__imageWrap,
  .reservas-card,
  #resenas .seeda-swiper,
  #ubicacion .card,
  #faq .faq-a{
    border-radius: 22px !important;
  }

  #faq .faq-a__q{
    padding: 16px 16px;
  }

  #faq .faq-a__a{
    padding: 0 16px 16px 16px;
  }
}

/* ======================================================
   Index reset: clean, sober, responsive
   ====================================================== */
.home-hero{
  background: linear-gradient(135deg, #171c16 0%, #1d241c 55%, #161b15 100%) !important;
  padding-top: clamp(24px, 4vw, 44px) !important;
  padding-bottom: clamp(32px, 5vw, 56px) !important;
}

.home-hero__copy{
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.home-hero__eyebrow{
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
}

.home-hero h1{
  font-size: clamp(2.9rem, 5vw, 4.9rem) !important;
  line-height: 1.04 !important;
}

.home-hero__lead{
  line-height: 1.68 !important;
}

.home-hero__imageWrap{
  min-height: 500px;
  border-radius: 28px !important;
  background: rgba(255,255,255,.03) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.18) !important;
}

.home-hero__imageWrap img{
  object-fit: contain !important;
  object-position: center bottom !important;
}

.home-hero__badge{
  border-radius: 20px !important;
  background: rgba(255,255,255,.06) !important;
}

#ofertas,
#faq,
#resenas,
#ubicacion{
  background: #f5f1e8 !important;
}

#ofertas .seeda-swiper{
  padding: 8px 0 14px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  height: auto !important;
  overflow: visible !important;
}

#ofertas .seeda-swiper .swiper-wrapper{
  align-items: flex-start !important;
  height: auto !important;
}

#ofertas .seeda-swiper .swiper-slide{
  min-height: auto !important;
  height: auto !important;
  display: flex !important;
  align-items: flex-start !important;
}

#ofertas .seeda-swiper .swiper-slide img{
  width: 100% !important;
  height: auto !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center top !important;
  border-radius: 26px !important;
  box-shadow: 0 12px 30px rgba(28,31,24,.08) !important;
  background: transparent !important;
}

#precios{
  background: linear-gradient(135deg, #1c2119 0%, #232a20 100%) !important;
}

#precios .price-card{
  border-radius: 28px !important;
}

#precios .price-card__image{
  min-height: auto !important;
  border-radius: 26px !important;
  overflow: hidden;
}

#precios .price-card__image img{
  width: 100% !important;
  max-width: 260px !important;
  height: auto !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center top !important;
  border-radius: 26px !important;
}

#faq .container,
#resenas .container,
#ubicacion .container{
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#faq .section__head,
#resenas .strip__head,
#ubicacion .strip__head{
  margin-bottom: 18px;
}

#faq h2,
#resenas h2,
#ubicacion h2,
#faq p,
#resenas p,
#ubicacion p{
  color: #1f231c !important;
}

#faq .faq-a{
  background: #fffdf8 !important;
  border: 1px solid rgba(31,35,28,.08) !important;
  border-radius: 22px !important;
  box-shadow: 0 10px 24px rgba(28,31,24,.05) !important;
}

#resenas .seeda-swiper{
  padding: 4px 0 8px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  height: auto !important;
  overflow: hidden !important;
}

#resenas .seeda-swiper .swiper-wrapper{
  align-items: flex-start !important;
  height: auto !important;
  transition-timing-function: ease !important;
}

#resenas .seeda-swiper .swiper-slide{
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  height: auto !important;
}

#resenas .seeda-swiper .swiper-slide img{
  width: min(100%, 340px) !important;
  height: 460px !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center 12% !important;
  border-radius: 24px !important;
  box-shadow: 0 12px 28px rgba(28,31,24,.08) !important;
}

@media (max-width: 768px){
  #resenas .seeda-swiper .swiper-slide img{
    height: 420px !important;
    object-position: center 10% !important;
  }
}

#resenas .seeda-swiper .swiper-pagination{
  margin-top: 2px !important;
}

#resenas .btn.btn--ghost,
#ubicacion .btn.btn--ghost{
  color: #1f231c !important;
  border-color: rgba(31,35,28,.16) !important;
  background: rgba(255,255,255,.72) !important;
}

#ubicacion .card{
  border-radius: 24px !important;
  background: #fffdf8 !important;
  border: 1px solid rgba(31,35,28,.08) !important;
  box-shadow: 0 12px 28px rgba(28,31,24,.05) !important;
}

#ubicacion .card h3,
#ubicacion .card p,
#ubicacion .card a{
  color: #1f231c !important;
}

@media (max-width: 768px){
  .home-hero h1{
    font-size: clamp(2.2rem, 9vw, 3rem) !important;
  }

  .home-hero__imageWrap{
    min-height: 320px;
    max-height: 360px;
  }

  #ofertas .seeda-swiper .swiper-slide img,
  #precios .price-card__image img{
    border-radius: 22px !important;
  }
}

@media (max-width: 768px){
  .home-hero h1{
    text-align: left !important;
  }

  .home-hero__imageWrap{
    min-height: 220px !important;
    max-height: 260px !important;
  }

  .home-hero__eyebrow{
    justify-content: flex-start !important;
    text-align: left !important;
    font-size: .86rem !important;
    line-height: 1.45 !important;
  }

  .home-hero__lead,
  .home-hero__contact p,
  .home-hero__trustItem{
    text-align: left !important;
  }

  .home-hero__links{
    display: none !important;
  }

  #contenido{
    padding-bottom: 110px;
  }

  .whatsapp-float{
    bottom: calc(env(safe-area-inset-bottom, 0px) + 86px) !important;
  }

  .cookie-reopen{
    bottom: calc(env(safe-area-inset-bottom, 0px) + 86px) !important;
  }
}

/* Top strip fix on home/header */
html,
body{
  background: #111411 !important;
}

.header,
.header__topline{
  background: #111411 !important;
}

/* ======================================================
   Home mobile cleanup: compact, readable, no overlaps
   ====================================================== */
@media (max-width: 768px){
  .home-hero .container,
  #ofertas .container,
  #precios .container,
  #reservas .container,
  #faq .container,
  #resenas .container,
  #ubicacion .container{
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .home-hero{
    padding-top: 16px !important;
    padding-bottom: 28px !important;
  }

  .home-hero__grid{
    gap: 18px !important;
  }

  .home-hero__copy{
    padding: 0 !important;
  }

  .home-hero__eyebrow{
    display: block !important;
    width: 100% !important;
    padding: 12px 16px !important;
    border-radius: 24px !important;
    font-size: .82rem !important;
    line-height: 1.5 !important;
    text-align: left !important;
  }

  .home-hero h1{
    max-width: none !important;
    margin-top: 14px !important;
    font-size: clamp(2rem, 8vw, 2.7rem) !important;
    line-height: 1.06 !important;
    letter-spacing: -0.02em !important;
    text-align: left !important;
  }

  .home-hero__lead{
    max-width: none !important;
    font-size: 1.02rem !important;
    line-height: 1.58 !important;
    margin-top: 12px !important;
    text-align: left !important;
  }

  .home-hero__trust{
    gap: 12px !important;
    margin-top: 16px !important;
  }

  .home-hero__trustItem{
    padding-left: 22px !important;
    font-size: .98rem !important;
    line-height: 1.45 !important;
    text-align: left !important;
  }

  .home-hero__trustItem::before{
    top: .55em !important;
    width: 10px !important;
    height: 10px !important;
  }

  .home-hero__contact{
    margin-top: 16px !important;
    padding: 14px !important;
    border-radius: 18px !important;
  }

  .home-hero__contact p{
    font-size: .97rem !important;
    line-height: 1.55 !important;
  }

  .home-hero__cta{
    margin-top: 16px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .home-hero__cta .btn{
    min-height: 52px !important;
    width: 100% !important;
    justify-content: center !important;
  }

  .home-hero__links{
    display: none !important;
  }

  .home-hero__media{
    order: -1 !important;
  }

  .home-hero__imageWrap{
    min-height: 220px !important;
    max-height: 250px !important;
    border-radius: 22px !important;
  }

  .home-hero__imageWrap img{
    object-fit: contain !important;
    object-position: center bottom !important;
  }

  .home-hero__badge{
    margin-top: 12px !important;
    padding: 14px !important;
    border-radius: 18px !important;
  }

  .home-hero__badge strong{
    display: block;
    margin-bottom: 6px;
    font-size: 1rem;
    line-height: 1.35;
  }

  #faq,
  #resenas,
  #ubicacion{
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }

  #faq .section__head,
  #resenas .strip__head,
  #ubicacion .strip__head{
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: start !important;
    gap: 12px !important;
    margin-bottom: 14px !important;
  }

  #faq h2,
  #resenas h2,
  #ubicacion h2{
    font-size: clamp(1.95rem, 8.2vw, 2.35rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.02em !important;
    margin: 0 !important;
  }

  #faq .muted,
  #resenas .section__intro,
  #ubicacion .section__intro{
    margin-bottom: 14px !important;
    font-size: 1rem !important;
    line-height: 1.62 !important;
  }

  #faq .btn,
  #resenas .btn,
  #ubicacion .btn{
    min-height: 50px !important;
  }

  #faq .btn.btn--ghost,
  #resenas .btn.btn--ghost,
  #ubicacion .btn.btn--ghost{
    width: fit-content !important;
    max-width: 100% !important;
  }

  #faq .faq-a__q{
    padding: 16px 18px !important;
    font-size: 1.02rem !important;
    line-height: 1.4 !important;
  }

  #faq .faq-a__icon{
    width: 12px !important;
    height: 12px !important;
    margin-left: 12px !important;
    flex: 0 0 auto !important;
  }

  #faq .cta-row{
    margin-top: 14px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  #faq .cta-row .btn{
    width: 100% !important;
    justify-content: center !important;
  }

  #resenas .seeda-swiper{
    padding-bottom: 26px !important;
  }

  #resenas .seeda-swiper .swiper-slide img{
    width: min(100%, 300px) !important;
    height: 380px !important;
    object-position: center 8% !important;
  }

  #resenas .seeda-swiper .swiper-pagination{
    bottom: 0 !important;
  }

  #ubicacion .grid{
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  #ubicacion .card{
    padding: 16px !important;
  }

  #ubicacion .card h3{
    font-size: 1.5rem !important;
    line-height: 1.08 !important;
  }

  #ubicacion iframe{
    height: 280px !important;
  }

  #contenido{
    padding-bottom: 132px !important;
  }

  .float-btn.whatsapp-float{
    width: 50px !important;
    height: 50px !important;
    right: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 12px) !important;
  }

  .cookie-reopen{
    left: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 12px) !important;
    width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    justify-content: center !important;
  }

  .cookie-reopen__text{
    display: none !important;
  }
}

/* ======================================================
   Landing fix: depilacion laser diodo
   ====================================================== */
.landing-faq{
  background: #f5f1e8 !important;
}

.landing-faq .container{
  max-width: 1120px;
}

.landing-faq h2,
.landing-faq p,
.landing-faq .faq-a__q,
.landing-faq .faq-a__a p{
  color: #1f231c !important;
}

.landing-faq .faq-accordion{
  max-width: 100%;
}

.landing-faq .faq-a{
  background: #fffdf8 !important;
  border: 1px solid rgba(31,35,28,.08) !important;
  border-radius: 22px !important;
  box-shadow: 0 10px 24px rgba(28,31,24,.05) !important;
}

.landing-faq .faq-a__q{
  padding: 18px 20px;
}

.landing-faq .faq-a__a{
  padding: 0 20px 18px 20px;
  border-top: 1px solid rgba(31,35,28,.08);
}

.landing-faq .btn.btn--ghost,
.landing-reserve .btn.btn--ghost{
  color: #1f231c !important;
  border-color: rgba(31,35,28,.16) !important;
  background: rgba(255,255,255,.74) !important;
}

.landing-reserve{
  background: linear-gradient(135deg, #21281e 0%, #2a3326 100%) !important;
}

.landing-reserve h2,
.landing-reserve p,
.landing-reserve .muted{
  color: #f5f2e8 !important;
}

.landing-reserve a:not(.btn){
  color: #f0b24f !important;
}

/* ======================================================
   Header + landing titles final alignment
   ====================================================== */
.header__content{
  min-height: 72px !important;
}

.logo{
  line-height: 1 !important;
  overflow: visible !important;
}

.logo__img{
  display: block !important;
  height: 42px !important;
  width: auto !important;
  max-height: 42px !important;
}

.seo-landing{
  padding-top: clamp(22px, 3vw, 40px) !important;
  padding-bottom: clamp(24px, 3.2vw, 44px) !important;
}

.seo-landing .container{
  max-width: 1120px !important;
}

.seo-landing h1{
  max-width: 18ch !important;
  font-size: clamp(2rem, 3.35vw, 3rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.018em !important;
  margin-bottom: 14px !important;
}

.seo-landing .hero__lead{
  max-width: 46ch !important;
  font-size: clamp(1rem, 1.15vw, 1.16rem) !important;
  line-height: 1.62 !important;
}

.seo-landing .muted{
  max-width: 68ch !important;
}

.seo-landing .media-clip.media-clip--pack{
  aspect-ratio: 16 / 6.8 !important;
}

.seo-landing .media-clip.media-clip--pack img{
  object-position: center 32% !important;
}

@media (max-width: 900px){
  .header__content{
    min-height: 62px !important;
  }

  .logo__img{
    height: 34px !important;
    max-height: 34px !important;
  }

  .seo-landing h1{
    max-width: none !important;
    font-size: clamp(1.85rem, 7.2vw, 2.5rem) !important;
    line-height: 1.1 !important;
  }

  .seo-landing .hero__lead{
    max-width: 100% !important;
    font-size: 1rem !important;
  }

  .seo-landing .media-clip.media-clip--pack{
    aspect-ratio: 16 / 9.2 !important;
  }
}

/* ======================================================
   Home top alignment with internal landings
   ====================================================== */
.home-hero{
  padding-top: clamp(22px, 3vw, 40px) !important;
  padding-bottom: clamp(24px, 3.2vw, 44px) !important;
}

.home-hero .container{
  max-width: 1120px !important;
}

.home-hero__grid{
  grid-template-columns: minmax(0, 1fr) minmax(320px, .92fr) !important;
  gap: clamp(22px, 2.8vw, 34px) !important;
  align-items: start !important;
}

.home-hero__copy{
  padding-top: 0 !important;
}

.home-hero__eyebrow{
  max-width: 740px;
  padding: 10px 16px !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.04) !important;
}

.home-hero h1{
  max-width: 10ch !important;
  font-size: clamp(2.4rem, 4.1vw, 4rem) !important;
  line-height: 1.05 !important;
  margin-top: 6px !important;
}

.home-hero__lead{
  max-width: 38ch !important;
}

.home-hero__imageWrap{
  min-height: 460px !important;
  border-radius: 26px !important;
}

@media (max-width: 900px){
  .home-hero{
    padding-top: 20px !important;
    padding-bottom: 28px !important;
  }

  .home-hero .container{
    max-width: 1120px !important;
  }

  .home-hero__grid{
    grid-template-columns: 1fr !important;
  }

  .home-hero__eyebrow,
  .home-hero__lead{
    max-width: 100% !important;
  }

  .home-hero h1{
    max-width: none !important;
    font-size: clamp(2rem, 7.4vw, 2.8rem) !important;
  }
}

/* Home top strip closer to internal pages */
.home-hero__copy{
  max-width: 700px !important;
}

.home-hero__eyebrow{
  max-width: 680px !important;
  margin-bottom: 2px !important;
  padding: 8px 14px !important;
  font-size: .98rem !important;
  line-height: 1.45 !important;
  opacity: .92;
}

.home-hero h1{
  margin-top: 0 !important;
}

/* ======================================================
   Header hard lock: same top area on all pages
   ====================================================== */
.header{
  background: #111411 !important;
}

.header__topline{
  display: block !important;
  min-height: 38px !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  background: #111411 !important;
}

.header__toplineIn{
  min-height: 38px !important;
  align-items: center !important;
}

.header__content{
  min-height: 72px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  align-items: center !important;
}

.logo{
  display: inline-flex !important;
  align-items: center !important;
  min-height: 42px !important;
}

.logo__img{
  height: 42px !important;
  max-height: 42px !important;
  width: auto !important;
}

@media (max-width: 900px){
  .header__topline{
    display: none !important;
  }

  .header__content{
    min-height: 62px !important;
  }

  .logo__img{
    height: 34px !important;
    max-height: 34px !important;
  }
}

/* Final home top spacing fix */
.home-hero{
  padding-top: 0 !important;
}

.home-hero__eyebrow{
  margin-top: 0 !important;
}

.home-hero h1{
  margin-top: 0 !important;
}

@media (max-width: 900px){
  .home-hero{
    padding-top: 0 !important;
  }
}

/* ======================================================
   Asistente conversacional
   ====================================================== */
.assistant-float{
  right: 20px !important;
  bottom: 92px !important;
  background: linear-gradient(180deg, #f0b24f 0%, #d98f2d 100%) !important;
  color: #fff !important;
  z-index: 1001 !important;
}

.assistant-float i{
  color: #fff !important;
  font-size: 1.1rem !important;
  line-height: 1 !important;
}

.assistant-chat{
  position: fixed;
  right: 20px;
  bottom: 156px;
  width: min(380px, calc(100vw - 24px));
  max-height: min(76vh, 680px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  border-radius: 24px;
  overflow: hidden;
  z-index: 1000;
  border: 1px solid rgba(255,255,255,.08);
  background: #f7f3ea;
  box-shadow: 0 24px 54px rgba(7,10,8,.34);
}

.assistant-chat[hidden]{
  display: none !important;
}

.assistant-chat__head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  background: linear-gradient(135deg, #151913 0%, #1d231a 100%);
  color: #f7f4ec;
}

.assistant-chat__brand{
  display: flex;
  align-items: center;
  gap: 12px;
}

.assistant-chat__brand p{
  margin: 2px 0 0;
  font-size: .88rem;
  color: rgba(247,244,236,.76);
}

.assistant-chat__avatar{
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(180deg, #f0b24f 0%, #d98f2d 100%);
  color: #fff;
  font-weight: 700;
}

.assistant-chat__close{
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: #fff;
  cursor: pointer;
}

.assistant-chat__messages{
  padding: 16px;
  overflow: auto;
  min-height: 0;
  background:
    radial-gradient(circle at top right, rgba(240,178,79,.12), transparent 26%),
    #f7f3ea;
}

.assistant-chat__row{
  display: flex;
  margin-bottom: 10px;
}

.assistant-chat__row--assistant{
  justify-content: flex-start;
}

.assistant-chat__row--user{
  justify-content: flex-end;
}

.assistant-chat__bubble{
  max-width: 86%;
  padding: 12px 14px;
  border-radius: 18px;
  font-size: .97rem;
  line-height: 1.5;
}

.assistant-chat__bubble--assistant{
  background: #fffdf8;
  color: #1f231c;
  border: 1px solid rgba(31,35,28,.08);
  border-bottom-left-radius: 8px;
}

.assistant-chat__bubble--user{
  background: linear-gradient(180deg, #f0b24f 0%, #d98f2d 100%);
  color: #fff;
  border-bottom-right-radius: 8px;
}

.assistant-chat__typing{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.assistant-chat__typing span{
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: rgba(31,35,28,.34);
  animation: assistantTyping 1s infinite ease-in-out;
}

.assistant-chat__typing span:nth-child(2){ animation-delay: .15s; }
.assistant-chat__typing span:nth-child(3){ animation-delay: .3s; }

@keyframes assistantTyping{
  0%, 80%, 100% { transform: translateY(0); opacity: .35; }
  40% { transform: translateY(-2px); opacity: 1; }
}

.assistant-chat__footer{
  padding: 14px;
  border-top: 1px solid rgba(31,35,28,.08);
  background: rgba(255,255,255,.72);
}

.assistant-chat__choices{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.assistant-chat__choice{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(31,35,28,.12);
  background: #fff;
  color: #1f231c;
  text-decoration: none;
  font-weight: 600;
  cursor: pointer;
}

.assistant-chat__choice:hover{
  background: #fff7eb;
  border-color: rgba(217,143,45,.3);
}

.assistant-chat__choice.is-secondary{
  background: transparent;
  color: rgba(31,35,28,.78);
}

body.cookie-open .assistant-float,
body.cookie-open .assistant-chat{
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 768px){
  .assistant-float{
    right: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 72px) !important;
    width: 50px !important;
    height: 50px !important;
  }

  .assistant-chat{
    right: 12px;
    left: 12px;
    width: auto;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 132px);
    max-height: min(72vh, 600px);
    border-radius: 20px;
  }

  .assistant-chat__messages{
    padding: 14px;
    padding-bottom: 8px;
  }

  .assistant-chat__footer{
    padding: 8px 10px 10px;
  }

  .assistant-chat__choices{
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    padding-bottom: 2px;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .assistant-chat__choices::-webkit-scrollbar{
    display: none;
  }

  .assistant-chat__choice{
    flex: 0 0 auto;
    width: auto;
    min-width: 132px;
    min-height: 40px;
    padding: 10px 14px;
    font-size: .92rem;
    line-height: 1.25;
    text-align: center;
    scroll-snap-align: start;
  }
}

@media (max-width: 420px){
  .assistant-chat{
    bottom: calc(env(safe-area-inset-bottom, 0px) + 118px);
  }

  .assistant-chat__choice{
    min-width: 124px;
    padding: 10px 12px;
  }
}

/* ======================================================
   Home hero final alignment with internal landings
   ====================================================== */
.home-hero{
  padding-top: 0 !important;
  padding-bottom: clamp(28px, 4vw, 52px) !important;
  background: linear-gradient(120deg, #252c22 0%, #20271e 52%, #1b2119 100%) !important;
}

.home-hero .container{
  max-width: 1040px !important;
  padding-top: clamp(18px, 3vw, 32px) !important;
}

.home-hero__grid{
  align-items: start !important;
  gap: 40px !important;
}

.home-hero__eyebrow{
  display: none !important;
}

.home-hero h1{
  font-size: clamp(2.35rem, 4.3vw, 4.4rem) !important;
  line-height: 1.04 !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 16px !important;
  max-width: 12ch !important;
}

.home-hero__lead{
  max-width: 30ch !important;
  font-size: clamp(1.06rem, 1.5vw, 1.3rem) !important;
  line-height: 1.55 !important;
  margin: 0 0 18px !important;
}

.home-hero__serviceArea{
  margin: -4px 0 18px !important;
  color: rgba(247,245,239,.76) !important;
  font-size: .98rem !important;
  line-height: 1.5 !important;
}

.home-hero__serviceArea strong{
  color: #f7f4ec !important;
  font-weight: 600 !important;
}

.home-hero__trust{
  margin: 0 0 18px !important;
}

.home-hero__contact{
  margin: 0 0 18px !important;
  border-radius: 18px !important;
}

.home-hero__cta{
  margin-top: 0 !important;
}

.home-hero__imageWrap{
  min-height: 460px !important;
  border-radius: 22px !important;
}

.home-hero__imageWrap img{
  object-fit: cover !important;
  object-position: center 24% !important;
}

.home-hero__badge{
  border-radius: 18px !important;
}

@media (max-width: 900px){
  .home-hero{
    padding-top: 0 !important;
    padding-bottom: 26px !important;
  }

  .home-hero .container{
    max-width: none !important;
    padding-top: 14px !important;
  }

  .home-hero h1{
    max-width: 100% !important;
    font-size: clamp(2rem, 8vw, 2.75rem) !important;
  }

  .home-hero__lead{
    max-width: 100% !important;
    font-size: 1.02rem !important;
  }

  .home-hero__imageWrap{
    min-height: auto !important;
    border-radius: 16px !important;
  }
}

@media (max-width: 420px){
  .assistant-chat__choices{
    grid-template-columns: 1fr;
  }
}

/* ======================================================
   Cookies final final: single bottom bar, no page overlay
   ====================================================== */
.cookie{
  inset: auto 0 0 0 !important;
  display: block !important;
  padding: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  pointer-events: none !important;
}

.cookie__card{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(17,20,16,.98) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 -10px 30px rgba(8,10,7,.16) !important;
  padding: 12px 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  pointer-events: auto !important;
}

.cookie__title{
  margin: 0 !important;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

.cookie__text{
  margin: 0 !important;
  flex: 1 1 auto !important;
  font-size: .95rem !important;
  line-height: 1.4 !important;
}

.cookie__actions{
  margin: 0 !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
}

.cookie__btn{
  min-height: 40px !important;
  padding: 8px 14px !important;
  border-radius: 10px !important;
}

.cookie__settings{
  grid-column: auto !important;
  display: none !important;
}

.cookie__icon{
  width: 30px !important;
  height: 30px !important;
}

@media (max-width: 900px){
  .cookie__card{
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    padding: 12px !important;
  }

  .cookie__title{
    width: auto !important;
  }

  .cookie__text{
    flex-basis: 100% !important;
  }

  .cookie__actions{
    width: 100% !important;
    flex-wrap: wrap !important;
  }
}

/* ======================================================
   Cookies final: barra inferior ligera, sin modal
   ====================================================== */
.cookie{
  position: fixed !important;
  inset: auto 0 0 0 !important;
  display: block !important;
  padding: 14px !important;
  background: transparent !important;
  z-index: 1300 !important;
  pointer-events: none !important;
}

.cookie__card{
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 14px 16px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(17,20,16,.96) !important;
  box-shadow: 0 18px 44px rgba(8,10,7,.24) !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  pointer-events: auto !important;
}

.cookie__title{
  margin: 0 !important;
  font-size: 1rem !important;
  white-space: nowrap !important;
}

.cookie__text{
  margin: 0 !important;
  font-size: .98rem !important;
  line-height: 1.45 !important;
  color: rgba(247,244,236,.88) !important;
}

.cookie__actions{
  display: inline-flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  margin: 0 !important;
}

.cookie__btn{
  min-height: 42px !important;
  padding: 10px 16px !important;
  border-radius: 12px !important;
}

.cookie__settings{
  grid-column: 1 / -1 !important;
  margin-top: 4px !important;
  padding-top: 12px !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
}

.cookie__opt{
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
}

.cookie__saveRow{
  margin-top: 12px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
}

.cookie__link{
  color: #f5c16d !important;
}

body.cookie-open .whatsapp-float,
body.cookie-open .assistant-float{
  bottom: 122px !important;
}

@media (max-width: 900px){
  .cookie{
    padding: 10px !important;
  }

  .cookie__card{
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 12px !important;
    border-radius: 16px !important;
  }

  .cookie__title{
    white-space: normal !important;
  }

  .cookie__actions{
    justify-content: stretch !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
  }

  .cookie__btn{
    width: 100% !important;
    min-width: 0 !important;
  }

  body.cookie-open .whatsapp-float{
    bottom: calc(env(safe-area-inset-bottom, 0px) + 158px) !important;
  }

  body.cookie-open .assistant-float{
    bottom: calc(env(safe-area-inset-bottom, 0px) + 220px) !important;
  }
}

/* Home hero cleanup after deploy mismatch */
.home-hero__eyebrow { display: none !important; }
.home-hero__lead { margin-top: 18px !important; }
.home-hero__serviceArea { margin-top: 18px !important; }

/* Home first viewport: less zoom */
.home-hero {
  padding-top: clamp(28px, 4vw, 52px) !important;
}
.home-hero__grid {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.9fr) !important;
  gap: clamp(24px, 3vw, 42px) !important;
}
.home-hero__copy {
  max-width: 660px !important;
}
.home-hero h1 {
  font-size: clamp(2.05rem, 4.4vw, 3.95rem) !important;
  line-height: 1.02 !important;
  max-width: 10ch;
}
.home-hero__lead {
  font-size: clamp(1rem, 1.55vw, 1.15rem) !important;
  max-width: 34ch;
}
.home-hero__trust {
  gap: 10px !important;
  margin-top: 18px !important;
}
.home-hero__contact {
  margin-top: 18px !important;
  padding: 18px 20px !important;
}
.home-hero__cta {
  margin-top: 18px !important;
}
.home-hero__imageWrap {
  max-height: 660px;
}
.home-hero__imageWrap img {
  min-height: 0 !important;
  max-height: 660px;
  object-fit: contain !important;
  object-position: center bottom !important;
}
.home-hero__badge {
  display: none !important;
}

@media (max-width: 1200px) {
  .home-hero h1 {
    font-size: clamp(1.95rem, 4.1vw, 3.5rem) !important;
  }
  .home-hero__imageWrap,
  .home-hero__imageWrap img {
    max-height: 560px;
  }
}

/* Mobile stabilization: home + assistant */
@media (max-width: 680px) {
  html, body {
    overflow-x: hidden !important;
    width: 100% !important;
  }

  body > * {
    max-width: 100% !important;
  }

  .container,
  .home-hero,
  .home-hero__grid,
  .home-hero__copy,
  .home-hero__media,
  .home-hero__imageWrap,
  .section,
  .section .container {
    overflow-x: clip !important;
  }

  .home-hero {
    padding-top: 18px !important;
  }

  .home-hero__grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .home-hero__copy {
    max-width: none !important;
    width: 100% !important;
    padding: 0 !important;
  }

  .home-hero h1 {
    max-width: 9ch !important;
    font-size: clamp(2rem, 10vw, 3rem) !important;
    line-height: 0.98 !important;
    margin-bottom: 14px !important;
  }

  .home-hero__lead,
  .home-hero__serviceArea,
  .home-hero__trust,
  .home-hero__contact {
    max-width: none !important;
  }

  .home-hero__contact {
    padding: 16px !important;
  }

  .home-hero__imageWrap,
  .home-hero__imageWrap img {
    max-height: 380px !important;
  }

  .assistant-chat {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 126px) !important;
    max-height: min(56vh, 460px) !important;
  }

  .assistant-chat__messages {
    min-height: 0 !important;
    max-height: none !important;
  }

  .assistant-chat__footer {
    padding: 8px 10px 10px !important;
  }

  .assistant-chat__choices {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    overflow: visible !important;
  }

  .assistant-chat__choice {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    padding: 10px 12px !important;
    font-size: 0.92rem !important;
  }

  .assistant-float {
    bottom: calc(env(safe-area-inset-bottom, 0px) + 86px) !important;
  }

  .whatsapp-float {
    bottom: calc(env(safe-area-inset-bottom, 0px) + 18px) !important;
  }

  .cookie-reopen {
    bottom: calc(env(safe-area-inset-bottom, 0px) + 18px) !important;
    left: 12px !important;
  }
}

@media (max-width: 420px) {
  .assistant-chat__choices {
    grid-template-columns: 1fr !important;
  }
}

/* Assistant mobile: compact 2x2 choices */
@media (max-width: 680px) {
  .assistant-chat__choices {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    overflow: visible !important;
    align-items: stretch !important;
  }

  .assistant-chat__choice {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 38px !important;
    padding: 10px 10px !important;
    border-radius: 16px !important;
    font-size: 0.9rem !important;
    line-height: 1.15 !important;
    text-align: center !important;
    justify-content: center !important;
    white-space: normal !important;
  }

  .assistant-chat__footer {
    padding-top: 6px !important;
  }
}

@media (max-width: 420px) {
  .assistant-chat__choices {
    grid-template-columns: 1fr !important;
  }
}

/* Final mobile polish: H1 + assistant layout */
@media (max-width: 680px) {
  .home-hero h1 {
    max-width: none !important;
    font-size: clamp(1.95rem, 8.6vw, 2.7rem) !important;
    line-height: 0.96 !important;
    letter-spacing: -0.03em !important;
    margin: 0 0 14px !important;
  }

  .home-hero__copy {
    padding-right: 72px !important;
  }

  .assistant-chat {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 132px) !important;
    max-height: min(48vh, 380px) !important;
    border-radius: 22px !important;
  }

  .assistant-chat__head {
    padding: 14px 14px 12px !important;
  }

  .assistant-chat__brand {
    gap: 10px !important;
  }

  .assistant-chat__brand strong {
    font-size: 1rem !important;
  }

  .assistant-chat__brand p {
    font-size: 0.92rem !important;
    line-height: 1.35 !important;
  }

  .assistant-chat__messages {
    padding: 10px 12px 6px !important;
    gap: 8px !important;
  }

  .assistant-chat__bubble {
    max-width: 100% !important;
    padding: 12px 14px !important;
    font-size: 0.96rem !important;
    line-height: 1.4 !important;
  }

  .assistant-chat__footer {
    padding: 6px 10px 10px !important;
  }

  .assistant-chat__choices {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    gap: 8px !important;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-snap-type: x proximity;
  }

  .assistant-chat__choices::-webkit-scrollbar {
    display: none !important;
  }

  .assistant-chat__choice {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 118px !important;
    min-height: 38px !important;
    padding: 10px 14px !important;
    border-radius: 999px !important;
    font-size: 0.9rem !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  .assistant-float {
    width: 52px !important;
    height: 52px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 86px) !important;
  }

  .whatsapp-float {
    width: 56px !important;
    height: 56px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 18px) !important;
  }
}

/* Mobile final pass: order, spacing, floats, assistant */
@media (max-width: 680px) {
  main {
    padding-bottom: 118px !important;
  }

  .home-hero__copy {
    order: 1 !important;
    padding-right: 0 !important;
    padding-bottom: 8px !important;
  }

  .home-hero__media {
    order: 2 !important;
  }

  .home-hero h1 {
    font-size: clamp(1.9rem, 8vw, 2.45rem) !important;
    line-height: 0.98 !important;
    max-width: 11ch !important;
  }

  .home-hero__trust {
    margin-bottom: 10px !important;
  }

  .home-hero__contact,
  .home-hero__cta {
    margin-right: 74px !important;
  }

  .assistant-float {
    width: 48px !important;
    height: 48px !important;
    right: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 78px) !important;
  }

  .whatsapp-float {
    width: 54px !important;
    height: 54px !important;
    right: 10px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 14px) !important;
  }

  .cookie-reopen {
    left: 10px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 14px) !important;
  }

  .assistant-chat {
    left: 10px !important;
    right: 10px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 132px) !important;
    max-height: min(44vh, 340px) !important;
    border-radius: 20px !important;
  }

  .assistant-chat__messages {
    padding: 10px !important;
  }

  .assistant-chat__footer {
    padding: 6px 8px 8px !important;
  }

  .assistant-chat__choices {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    overflow: visible !important;
  }

  .assistant-chat__choice {
    min-width: 0 !important;
    width: 100% !important;
    min-height: 36px !important;
    padding: 8px 10px !important;
    white-space: normal !important;
    border-radius: 14px !important;
    font-size: 0.88rem !important;
  }
}

@media (max-width: 420px) {
  .home-hero__contact,
  .home-hero__cta {
    margin-right: 66px !important;
  }

  .assistant-chat__choices {
    grid-template-columns: 1fr !important;
  }
}

/* Mobile lock: photo first + full-width assistant */
@media (max-width: 680px) {
  .home-hero__grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
  }

  .home-hero__media {
    order: 1 !important;
  }

  .home-hero__copy {
    order: 2 !important;
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
  }

  .home-hero__imageWrap {
    border-radius: 24px !important;
    max-height: none !important;
  }

  .home-hero__imageWrap img {
    width: 100% !important;
    height: 300px !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center top !important;
    background: transparent !important;
  }

  .home-hero h1 {
    max-width: none !important;
    font-size: clamp(2rem, 8.4vw, 2.7rem) !important;
    line-height: 0.98 !important;
    margin: 0 0 12px !important;
  }

  .home-hero__lead,
  .home-hero__serviceArea,
  .home-hero__trust,
  .home-hero__contact,
  .home-hero__cta {
    margin-right: 0 !important;
    max-width: none !important;
  }

  .assistant-chat {
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 126px) !important;
    max-height: min(46vh, 360px) !important;
    border-radius: 18px !important;
  }

  .assistant-chat__head {
    padding: 12px !important;
  }

  .assistant-chat__brand strong {
    font-size: 0.98rem !important;
  }

  .assistant-chat__brand p {
    font-size: 0.9rem !important;
    line-height: 1.3 !important;
  }

  .assistant-chat__messages {
    padding: 8px 10px 4px !important;
    gap: 6px !important;
  }

  .assistant-chat__bubble {
    padding: 10px 12px !important;
    font-size: 0.94rem !important;
    line-height: 1.35 !important;
  }

  .assistant-chat__footer {
    padding: 6px 8px 8px !important;
  }

  .assistant-chat__choices {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    overflow: visible !important;
  }

  .assistant-chat__choice {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 36px !important;
    padding: 8px 10px !important;
    border-radius: 14px !important;
    font-size: 0.88rem !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    text-align: center !important;
    justify-content: center !important;
  }

  .assistant-float {
    width: 48px !important;
    height: 48px !important;
    right: 10px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 78px) !important;
  }

  .whatsapp-float {
    width: 54px !important;
    height: 54px !important;
    right: 8px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 14px) !important;
  }

  .cookie-reopen {
    left: 8px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 14px) !important;
  }
}

@media (max-width: 420px) {
  .assistant-chat {
    left: 6px !important;
    right: 6px !important;
  }

  .assistant-chat__choices {
    grid-template-columns: 1fr !important;
  }

  .home-hero__imageWrap img {
    height: 260px !important;
  }
}

/* Mobile final lock: readable hero + bottom-sheet assistant */
@media (max-width: 680px) {
  html,
  body {
    overflow-x: hidden !important;
  }

  body.assistant-open {
    overflow: hidden !important;
  }

  main {
    padding-bottom: 154px !important;
  }

  .home-hero {
    padding-top: 18px !important;
  }

  .home-hero__grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .home-hero__media {
    order: 1 !important;
  }

  .home-hero__copy {
    order: 2 !important;
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .home-hero__imageWrap {
    min-height: 0 !important;
  }

  .home-hero__imageWrap img {
    width: 100% !important;
    height: 230px !important;
    object-fit: contain !important;
    object-position: center top !important;
  }

  .home-hero h1 {
    max-width: none !important;
    margin: 0 0 14px !important;
    font-size: clamp(2.12rem, 8.9vw, 2.7rem) !important;
    line-height: .94 !important;
    letter-spacing: -0.02em !important;
    text-wrap: balance;
  }

  .home-hero__lead,
  .home-hero__serviceArea,
  .home-hero__trust,
  .home-hero__contact,
  .home-hero__cta {
    max-width: none !important;
    margin-right: 0 !important;
  }

  .home-hero__lead {
    margin-bottom: 16px !important;
    font-size: 1.02rem !important;
    line-height: 1.56 !important;
  }

  .home-hero__trust {
    margin: 0 0 16px !important;
  }

  .home-hero__contact {
    margin: 0 0 16px !important;
  }

  .home-hero__cta {
    margin-top: 0 !important;
  }

  .assistant-float,
  .whatsapp-float {
    right: 12px !important;
    width: 52px !important;
    height: 52px !important;
  }

  .assistant-float {
    bottom: calc(env(safe-area-inset-bottom, 0px) + 108px) !important;
  }

  .whatsapp-float {
    bottom: calc(env(safe-area-inset-bottom, 0px) + 44px) !important;
  }

  .cookie-manage-float {
    left: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 44px) !important;
    width: 42px !important;
    height: 42px !important;
  }

  .assistant-chat {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    top: auto !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 108px) !important;
    transform: none !important;
    display: flex !important;
    flex-direction: column !important;
    max-height: min(58vh, 520px) !important;
    border-radius: 22px !important;
  }

  .assistant-chat__head {
    padding: 14px 16px !important;
  }

  .assistant-chat__messages {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 14px !important;
  }

  .assistant-chat__footer {
    flex: 0 0 auto !important;
    padding: 12px 12px 14px !important;
  }

  .assistant-chat__choices {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    overflow: visible !important;
  }

  .assistant-chat__choice {
    min-height: 44px !important;
    padding: 10px 12px !important;
    border-radius: 999px !important;
    font-size: .94rem !important;
    line-height: 1.2 !important;
    white-space: normal !important;
  }
}

@media (max-width: 390px) {
  .assistant-chat__choices {
    grid-template-columns: 1fr !important;
  }
}

/* Home desktop: recover Elysion Pro block and close right-side gap */
@media (min-width: 681px) {
  .home-hero__media {
    align-content: start !important;
    grid-template-rows: auto auto !important;
  }

  .home-hero__badge {
    display: block !important;
    margin-top: 10px !important;
    padding: 18px 20px !important;
    border-radius: 20px !important;
    background: rgba(255,255,255,.045) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 18px 34px rgba(0,0,0,.18) !important;
  }

  .home-hero__badgeLabel {
    display: inline-block !important;
    margin-bottom: 6px !important;
  }

  .home-hero__badge strong {
    display: block !important;
    margin-bottom: 8px !important;
  }
}

/* Mobile final spacing: taller chat and floats closer together */
@media (max-width: 680px) {
  .assistant-float {
    right: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 92px) !important;
  }

  .whatsapp-float {
    right: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 30px) !important;
  }

  .assistant-chat {
    bottom: calc(env(safe-area-inset-bottom, 0px) + 98px) !important;
    max-height: min(68vh, 620px) !important;
  }
}

/* Final tighten: desktop Elysion block + mobile float spacing */
@media (min-width: 681px) {
  .home-hero__media {
    display: grid !important;
    align-content: start !important;
    gap: 12px !important;
  }

  .home-hero__badge {
    display: block !important;
    margin-top: 0 !important;
    width: 100% !important;
    max-width: 560px !important;
  }
}

@media (max-width: 680px) {
  .assistant-chat {
    bottom: calc(env(safe-area-inset-bottom, 0px) + 78px) !important;
    max-height: min(72vh, 640px) !important;
  }

  .assistant-float {
    right: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 80px) !important;
  }

  .whatsapp-float {
    right: 12px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 20px) !important;
  }
}

/* Final header + favicon + assistant polish */
html,
body {
  margin: 0 !important;
  padding: 0 !important;
}

body {
  padding-top: 0 !important;
}

.header {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.header__topline {
  margin-top: 0 !important;
  min-height: 32px !important;
}

.header__toplineIn {
  min-height: 32px !important;
}

.header__content {
  min-height: 66px !important;
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  column-gap: 18px !important;
}

.logo__img {
  max-height: 46px !important;
}

.nav {
  gap: 24px !important;
}

.header__book {
  min-height: 50px !important;
  padding: 0 22px !important;
}

.home-hero {
  padding-top: 10px !important;
}

.assistant-float {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.18) !important;
}

.assistant-float::before,
.assistant-float::after {
  display: none !important;
}

.assistant-float i {
  text-shadow: none !important;
}

@media (max-width: 900px) {
  .header__topline {
    display: none !important;
  }

  .header__content {
    min-height: 60px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .logo__img {
    max-height: 36px !important;
  }
}

/* Home hero close-out: badge inline on the left column */
.home-hero__badge--inline {
  display: block !important;
  margin: 0 0 18px !important;
  max-width: 620px !important;
}

.home-hero__media > .home-hero__badge {
  display: none !important;
}

@media (max-width: 680px) {
  .home-hero__badge--inline {
    display: none !important;
  }
}

/* Home hero: Elysion block under image on desktop */
.home-hero__badge--media {
  display: block !important;
  margin-top: 0 !important;
  width: 100% !important;
  max-width: 560px !important;
}

.home-hero__badge--inline {
  display: none !important;
}

@media (min-width: 681px) {
  .home-hero__media {
    align-content: start !important;
    grid-template-rows: auto auto !important;
    gap: 14px !important;
  }
}

@media (max-width: 680px) {
  .home-hero__badge--media {
    display: none !important;
  }
}

/* Force desktop media badge visible after previous hide rule */
.home-hero__media > .home-hero__badge--media {
  display: block !important;
}

@media (max-width: 680px) {
  .home-hero__media > .home-hero__badge--media {
    display: none !important;
  }
}

/* Home tech: single featured card layout */
.home-tech__types:has(> :only-child) {
  grid-template-columns: minmax(320px, 560px) !important;
  justify-content: center !important;
}

.home-tech__types:has(> :only-child) .home-tech__type {
  max-width: 560px !important;
}

/* Home hero desktop: close right column gap */
@media (min-width: 681px) {
  .home-hero__grid {
    align-items: stretch !important;
  }

  .home-hero__media {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-self: stretch !important;
    height: 100% !important;
    gap: 18px !important;
  }

  .home-hero__imageWrap {
    flex: 1 1 auto !important;
    min-height: 420px !important;
    max-height: none !important;
  }

  .home-hero__imageWrap img {
    height: 100% !important;
    max-height: none !important;
  }

  .home-hero__badge--media {
    margin-top: auto !important;
    flex: 0 0 auto !important;
    max-width: none !important;
    width: 100% !important;
  }
}

/* Hero desktop final balance: natural title + fixed media height */
@media (min-width: 681px) {
  .home-hero__grid {
    align-items: start !important;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 430px) !important;
    gap: 32px !important;
  }

  .home-hero h1 {
    max-width: 12ch !important;
    font-size: clamp(2.5rem, 4.6vw, 4.35rem) !important;
    line-height: .98 !important;
  }

  .home-hero__media {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    align-self: start !important;
  }

  .home-hero__imageWrap {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: 4 / 5 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 24px !important;
  }

  .home-hero__imageWrap img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center 18% !important;
    display: block !important;
  }

  .home-hero__badge--media {
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    border-radius: 18px !important;
  }
}

@media (min-width: 1000px) {
  .home-hero .container {
    max-width: 1240px !important;
    padding-left: 32px !important;
    padding-right: 32px !important;
  }

  .home-hero__grid {
    grid-template-columns: minmax(0, 1.1fr) minmax(420px, 500px) !important;
    gap: 48px !important;
    align-items: center !important;
  }

  .home-hero__copy {
    gap: 22px !important;
  }

  .home-hero h1 {
    max-width: 8.8ch !important;
    font-size: clamp(3.25rem, 5.3vw, 5.4rem) !important;
    line-height: .94 !important;
    margin: 0 0 10px !important;
  }

  .home-hero__lead {
    max-width: 30ch !important;
    font-size: 1.22rem !important;
    line-height: 1.58 !important;
    margin: 0 !important;
  }

  .home-hero__serviceArea,
  .home-hero__trustItem,
  .home-hero__contact p {
    font-size: 1.02rem !important;
  }

  .home-hero__imageWrap {
    aspect-ratio: auto !important;
    height: 500px !important;
    min-height: 500px !important;
    max-height: 500px !important;
    border-radius: 28px !important;
    background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)) !important;
    padding: 20px 20px 0 !important;
  }

  .home-hero__badge--media {
    padding: 20px 22px !important;
    border-radius: 20px !important;
  }
}

@media (min-width: 1000px) {
  .home-hero__imageWrap img {
    object-fit: contain !important;
    object-position: center center !important;
    transform: none !important;
    width: 100% !important;
    height: 100% !important;
  }
}

/* Final overflow fix */
html,
body {
  max-width: 100%;
  overflow-x: clip;
}

body {
  position: relative;
}

.home-hero,
.home-hero .container,
.home-hero__grid,
.home-hero__copy,
.home-hero__media,
.home-hero__imageWrap,
main,
#contenido {
  max-width: 100%;
  overflow-x: clip;
}

/* Home hero final reset */
@media (min-width: 901px) {
  .home-hero {
    padding-top: 28px !important;
    padding-bottom: 44px !important;
  }

  .home-hero .container {
    max-width: 1280px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
  }

  .home-hero__grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.12fr) minmax(420px, 500px) !important;
    gap: 44px !important;
    align-items: start !important;
  }

  .home-hero__copy {
    display: grid !important;
    gap: 18px !important;
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .home-hero h1 {
    margin: 0 !important;
    max-width: 12.5ch !important;
    font-size: clamp(3rem, 4.4vw, 4.6rem) !important;
    line-height: 0.98 !important;
    letter-spacing: -0.02em !important;
    text-wrap: pretty;
  }

  .home-hero__lead {
    margin: 0 !important;
    max-width: 31ch !important;
    font-size: 1.15rem !important;
    line-height: 1.58 !important;
  }

  .home-hero__serviceArea,
  .home-hero__trustItem,
  .home-hero__contact p,
  .home-hero__links a {
    font-size: 1rem !important;
    line-height: 1.55 !important;
  }

  .home-hero__trust {
    margin: 2px 0 0 !important;
    gap: 10px !important;
  }

  .home-hero__contact {
    margin: 0 !important;
    padding: 18px 20px !important;
    border-radius: 20px !important;
  }

  .home-hero__cta {
    margin: 0 !important;
    gap: 12px !important;
  }

  .home-hero__links {
    margin-top: -2px !important;
    gap: 10px 18px !important;
  }

  .home-hero__media {
    display: grid !important;
    grid-template-rows: auto auto auto !important;
    gap: 14px !important;
    align-self: start !important;
    margin: 0 !important;
  }

  .home-hero__imageWrap {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    height: 560px !important;
    min-height: 560px !important;
    max-height: 560px !important;
    padding: 22px 22px 0 !important;
    overflow: hidden !important;
    border-radius: 24px !important;
    background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025)) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
  }

  .home-hero__imageWrap--secondary {
    height: 210px !important;
    min-height: 210px !important;
    max-height: 210px !important;
    padding: 14px !important;
    align-items: center !important;
    background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)) !important;
  }

  .home-hero__imageWrap::after {
    display: none !important;
  }

  .home-hero__imageWrap img {
    display: block !important;
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center bottom !important;
    transform: none !important;
  }

  .home-hero__imageWrap--secondary img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    border-radius: 16px !important;
    background: #d88b28 !important;
  }

  .home-hero__badge--media,
  .home-hero__media > .home-hero__badge--media {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 18px 20px !important;
    border-radius: 18px !important;
    position: static !important;
    background: rgba(18,22,17,.62) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
  }
}

@media (max-width: 900px) {
  .home-hero .container {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .home-hero__grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .home-hero__copy,
  .home-hero__media {
    width: 100% !important;
    max-width: none !important;
  }

  .home-hero__media {
    order: -1 !important;
    gap: 12px !important;
  }

  .home-hero__imageWrap {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    min-height: 320px !important;
    max-height: 380px !important;
    padding: 16px 16px 0 !important;
  }

  .home-hero__imageWrap::after {
    display: none !important;
  }

  .home-hero__imageWrap img {
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
    object-position: center bottom !important;
    transform: none !important;
  }

  .home-hero__imageWrap--secondary {
    display: none !important;
    min-height: 180px !important;
    max-height: 220px !important;
    padding: 12px !important;
    align-items: center !important;
  }

  .home-hero__imageWrap--secondary img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    border-radius: 14px !important;
    background: #d88b28 !important;
  }

  .home-hero h1 {
    max-width: none !important;
    font-size: clamp(2.15rem, 7.8vw, 3rem) !important;
    line-height: 1.02 !important;
    margin: 0 0 10px !important;
  }

  .home-hero__lead,
  .home-hero__serviceArea,
  .home-hero__contact,
  .home-hero__links {
    max-width: none !important;
  }

  .home-hero__cta {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .home-hero__cta .btn {
    width: 100% !important;
  }
}