/* =========================================
   ESTILOS GENERALES (BASE)
========================================= */
.home-branches { padding: 3rem 0; color: var(--white); }
.menu__title { text-align: center; font-size: 2rem; margin: 0.5rem auto; text-transform: capitalize; }
.menu__title--gold { text-align: center; font-size: 2rem; font-style: italic; font-family: var(--seravek); margin: 0.5rem auto; color: var(--gold); }
.menu__title--blue { text-align: center; font-size: 2rem; font-style: italic; margin: 0.5rem auto; color: var(--blue); }
.menu__text { text-align: center; font-size: 1.5rem; font-style: italic; margin: 3.5rem auto; }
.home-branches-urls { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 2rem; margin-top: 2rem; margin: 0 auto; }

.home-branch { padding: 1rem 2rem; border-radius: 10px; margin: 0 auto; width: 100%; max-width: 500px; display: flex; gap: 2rem; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.home-branch__image-container { display: flex; text-decoration: none; position: relative; width: 100%; aspect-ratio: 1 / 1; overflow: hidden; transition-duration: 0.3s; }
.home-branch__image { position: relative; }
.home-branch__overlay { transition-duration: 0.3s; background-color: transparent; opacity: 0; z-index: 1; transform: translateY(100%); }
.home-branch__image-container:hover { transform: scale(1.1); }
.home-branch__image-container:hover .home-branch__overlay { opacity: 1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(31, 32, 64, 0.5), rgba(0, 0, 0, 0)); background-color: rgba(0, 0, 0, 0.5); display: flex; justify-content: center; align-items: center; font-size: 2.5rem; font-family: "Lato", sans-serif; z-index: 1; transform: translateY(0%); border-radius: 10px; }
.home-branch__overlay a { color: var(--white); text-decoration: none; display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; text-align: center; margin: auto; }
.home-branch__caption { position: absolute; bottom: 0; right: 0; width: 70%; height: 60%; background-color: var(--blue); clip-path: polygon(100% 0%, 100% 100%, 0% 100%, 10% 85%, 30% 80%, 50% 60%, 70% 40%, 90% 15%, 100% 0%); display: flex; align-items: flex-end; justify-content: flex-end; padding: 1.2rem 2rem; box-sizing: border-box; pointer-events: none; transition: background-color 0.3s ease, opacity 0.3s ease; z-index: 2; }
.home-branch__caption-text { color: var(--white); font-size: 1.8rem; font-family: var(--seravek); font-weight: 500; }
.home-branch__caption--blue { background-color: var(--blue); }
.home-branch__caption--gold { background-color: var(--gold); }
.home-branch__image-container:hover .home-branch__caption { opacity: 0; }

.home-menus__text { text-align: center; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 2rem 0; box-sizing: border-box; font-size: 1.5rem; }
.menu__title--services { text-align: center; font-size: 2rem; font-style: italic; font-family: var(--seravek); color: var(--white); }
.home-services { background-color: var(--blue); color: var(--white); font-size: 1.5rem; }

.home-contact { color: var(--blue); margin: 3rem 0; }
.home-contact__title { text-align: center; font-size: 2rem; margin: 0.5rem auto; }
.home-contact__branch { width: 90%; margin: 2rem auto; text-align: left; display: flex; gap: 2rem; flex-direction: column; align-items: center; justify-content: center; font-size: 1.5rem; max-width: 450px; }
.branch-schedule { text-align: center; }
.branch-name { font-family: "Lato", sans-serif; font-size: 2rem; text-transform: uppercase; text-align: center; }
.branch-contact { display: flex; flex-direction: column; gap: 0.5rem; justify-content: flex-start; }
.branch-contact a { color: inherit; text-decoration: none; }

/* CARRUSEL RESERVACIONES (SPLIDE) */
#reservaciones.splide { position: relative; }
#reservaciones.splide .splide__arrows { display: flex; justify-content: space-between; position: absolute; top: 50%; left: 0; right: 0; width: 100%; padding: 0 1rem; box-sizing: border-box; transform: translateY(-50%); pointer-events: none; z-index: 10; }
#reservaciones.splide .splide__arrow { pointer-events: auto; background: var(--blue); opacity: 0.7; transition: opacity 0.3s; }
#reservaciones.splide .splide__arrow:hover { opacity: 1; }
#reservaciones.splide .splide__arrow svg { fill: var(--white); }
#reservaciones.splide .splide__pagination { bottom: -2rem; }
#reservaciones.splide .splide__pagination__page.is-active { background: var(--gold); }
.reservations .splide__slide { padding: 2rem 0; }
.menus-urls { display: flex; flex-direction: column; justify-content: center; align-content: center; align-items: center; gap: 1rem; }
.home-branch__button { display: block; font-size: 1rem; max-width: 22rem; min-width: auto; width: 35%; }

/* BENEFICIOS */
.home-benefits .section__body { display: flex; align-items: center; gap: 4rem; }
.home-benefits .benefits-title { margin-bottom: 2rem; }
.home-benefits .benefits-list { margin: 0; padding: 0; list-style: none; }
.home-benefits .benefits-list p { font-size: 1.2rem; line-height: 1.6; margin-bottom: 2rem; }
.home-benefits .image-container { position: relative; width: 100%; aspect-ratio: 1 / 1; overflow: hidden; }
.home-benefits .image-container img { width: 100%; height: 100%; object-fit: cover; }
.home-benefits .splide__pagination { position: relative; bottom: -1rem; margin-top: 1rem; }
.home-benefits .splide__pagination__page { background: transparent; border: 2px solid var(--white, white); opacity: 1; transition: background-color 0.3s, transform 0.3s; }
.home-benefits .splide__pagination__page.is-active { background: var(--white, white); transform: scale(1.2); }
.benefit-text { text-align: center; }
.benefit-text * { font-family: "Lato", sans-serif; }
.benefit-description { padding-bottom: 2rem; text-align: center; }
.benefit-description .button { display: inline-block; margin-top: 2rem; }

/* AJUSTES DE DISEÑO SLIDER LOCALES */
#slider-locales { width: 100%; max-width: 1100px; margin: 0 auto; padding-bottom: 3.5rem; overflow: hidden; }
#slider-locales .splide__list { display: flex !important; flex-wrap: nowrap !important; width: 100%; height: 100%; margin: 0 !important; padding: 0 !important; }
#slider-locales .splide__slide { display: flex; justify-content: center; align-items: center; min-width: 100%; }
#slider-locales .home-branch { width: 100%; max-width: 100%; margin: 0; position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1.5rem; }
#slider-locales .home-branch__image-container { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 15px; box-shadow: 0 8px 30px rgba(0,0,0,0.12); }
#slider-locales .home-branch__image-container img { transition: transform 0.4s ease; }
#slider-locales .home-branch__info { width: 100%; padding: 1rem 1rem 0 1rem; }
#slider-locales .home-branch__info-name { color: var(--gold) !important; font-size: 1.35rem !important; font-family: var(--seravek), "Lato", sans-serif !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 1.5px !important; white-space: nowrap !important; display: block !important; }
#slider-locales .home-branch:hover .home-branch__image-container img { transform: scale(1.08); }
#slider-locales .splide__pagination { bottom: -1rem; }
#slider-locales .splide__pagination__page { background: #ccc; border: none; }
#slider-locales .splide__pagination__page.is-active { background: var(--gold); transform: scale(1.3); }

/* REDISEÑO PREMIUM: SECCIÓN "NOSOTROS" */
.presentation { background: var(--white) !important; padding: 0 0 4rem 0 !important; min-height: auto !important; border: none !important; }
.presentation .container { max-width: 1000px !important; margin: 0 auto; padding: 0 2rem; }
.presentation__header { text-align: center; margin-bottom: 4rem !important; }
.presentation__title { color: var(--gold) !important; font-size: 2.2rem !important; font-family: var(--seravek) !important; font-weight: 700 !important; margin: 0 !important; }
.presentation__body { display: flex !important; flex-direction: row !important; align-items: center !important; gap: 4rem !important; }
.presentation__content { width: 50% !important; }
.presentation__text { color: var(--blue) !important; font-size: 1.25rem !important; line-height: 1.5 !important; text-align: left !important; }
.presentation__visual { width: 50% !important; }
.presentation__image-wrapper { box-shadow: none !important; border-radius: 0 !important; }
.presentation__image-wrapper img { width: 100% !important; height: auto !important; display: block !important; transform: none !important; }

/* SOLUCIÓN DE EMERGENCIA: SLIDER RESERVAS */
#reservaciones .home-contact__branch { max-width: 100% !important; text-align: center !important; }
#reservaciones .branch-contact { align-items: center !important; justify-content: center !important; width: 100% !important; }
#reservaciones .branch-phone, #reservaciones .branch-email, #reservaciones .branch-address { display: flex !important; justify-content: center !important; align-items: center !important; text-align: center !important; width: 100% !important; }
#reservaciones .splide__arrows, #reservaciones .splide__arrow { display: none !important; opacity: 0 !important; visibility: hidden !important; }
#reservaciones .splide__pagination { bottom: -1rem !important; }
#reservaciones .splide__pagination__page { background: rgba(255,255,255,0.4) !important; border: none !important; width: 10px !important; height: 10px !important; transition: transform 0.3s ease, background-color 0.3s ease !important; }
#reservaciones .splide__pagination__page.is-active { background: var(--gold) !important; transform: scale(1.4) !important; }
#reservas { padding: 0 !important; margin: 0 !important; min-height: auto !important; }
#reservaciones .splide__track { padding-bottom: 2rem !important; }

/* ESTANDARIZACIÓN DE TEXTOS */
.home-branches .home-branches__title { color: var(--gold) !important; font-size: 2.2rem !important; font-family: var(--seravek) !important; font-weight: 700 !important; margin-bottom: 1.5rem !important; }
.home-branches .section__text { color: var(--blue) !important; font-size: 1.25rem !important; line-height: 1.5 !important; font-weight: 400 !important; max-width: 700px !important; margin: 0 auto 3.5rem auto !important; }

/* TARJETAS AZULES PREMIUM Y CARRUSELES */
.card-azul-premium { background-color: rgba(22, 64, 122, 0.96) !important; border-radius: 16px; padding: 2.5rem 2rem; width: 100%; max-width: 480px; margin: 0; box-shadow: 0 15px 35px rgba(0,0,0,0.3); text-align: center; color: white; }
.reserva-full-bg .splide__slide { height: 90vh; display: flex; align-items: center; justify-content: flex-end; padding: 0 10%; background-size: cover; background-position: center; }
.reserva-full-bg, #reservas { padding: 0 !important; margin: 0 !important; border: none !important; }
.home-benefits, #beneficios { padding-bottom: 0 !important; margin-bottom: 0 !important; border-bottom: none !important; }

/* =========================================
   MEDIA QUERIES GLOBALES (Desktop & Tablet)
========================================= */
@media screen and (min-width: 1025px) {
    .home-branches, .section-eventos, .presentation, .home-benefits { min-height: 100vh !important; display: flex !important; flex-direction: column; justify-content: center; }
    .reserva-full-bg .splide__slide { height: 100vh !important; }
    #slider-locales .splide__track { overflow: visible; }
    #slider-locales .splide__list { transform: none !important; justify-content: center; gap: 3rem; }
    #slider-locales .splide__slide { min-width: calc(50% - 1.5rem); max-width: calc(50% - 1.5rem); }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
    .home-benefits .image-container { padding: 0 3rem; box-sizing: border-box; }
    .home-benefits .section__body { gap: 2rem; }
}
@media screen and (max-width: 1024px) {
    .card-azul-premium { max-width: 85% !important; padding: 2.5rem !important; }
    .reserva-full-bg .splide__slide { justify-content: center !important; padding: 0 5% !important; }
    .section-eventos .container { justify-content: center !important; }
}

/* =========================================
   CANDADO DE EMERGENCIA GENERAL
========================================= */
html, body { width: 100vw !important; max-width: 100vw !important; overflow-x: hidden !important; position: relative; margin: 0; padding: 0; }
* { box-sizing: border-box !important; }

/* =========================================
   MEDIA QUERIES MÓVILES RESTANTES
========================================= */
@media screen and (max-width: 768px) {
    .home-menus__text { padding: 2rem 1rem; }
    .home-contact { margin-bottom: 5rem; }
    .menu__title, .menu__title--gold, .menu__title--blue { font-size: 1.5rem; }
    .menu__text { font-size: 1.1rem; margin: 1.5rem auto; }
    .home-benefits { padding-top: 4rem; }
    .home-benefits .section__body { flex-direction: column; gap: 2rem; }
    .home-benefits .section__column { width: 100%; }
    .home-branch__button { width: 100%; box-sizing: border-box; }
    .home-branch { width: 90%; }
    .branch-contact { font-size: 1.1rem; width: 90%; }
    .home-benefits .benefits-title { margin-top: 4rem; }
    .home-contact__branch .branch-name { font-size: 1.7rem; }
    .home-benefits .image-container { display: none; }
    #reservaciones .home-contact__branch { padding: 2.5rem 1.5rem !important; }
    .card-azul-premium { max-width: 95% !important; padding: 1.5rem 1rem !important; }
    .card-azul-premium h2, .card-azul-premium h3 { font-size: 1.5rem !important; letter-spacing: 1px !important; }
    .card-azul-premium p, .card-azul-premium div, .section__text { font-size: 0.95rem !important; }
    .card-azul-premium .button { padding: 0.8rem 1rem !important; font-size: 0.8rem !important; width: 100%; }
    .reserva-full-bg .splide__slide { height: auto !important; min-height: 85vh !important; padding: 4rem 1rem !important; justify-content: center !important; }
    .section-eventos { padding: 4rem 1rem !important; }
    .section-eventos .container { justify-content: center !important; }
    #slider-locales .home-branch { gap: 1rem; }
    #slider-locales .home-branch__image-container { aspect-ratio: auto !important; }
    #slider-locales .home-branch__image-container img { width: 100% !important; height: auto !important; object-fit: contain !important; border-radius: 12px; }
    #slider-locales .home-branch__info-name { font-size: 1.1rem !important; }
    .home-branches .home-branches__title { font-size: 1.8rem !important; }
    .home-branches .section__text { font-size: 1.1rem !important; padding: 0 1rem; }
    .presentation { max-width: 100vw !important; overflow-x: hidden !important; }
    .presentation .container { padding: 0 1.5rem !important; width: 100% !important; }
    .presentation__title { font-size: 1.7rem !important; line-height: 1.3 !important; padding: 0 !important; margin-bottom: 2rem !important; }
    .presentation__text { font-size: 1.05rem !important; text-align: center !important; margin-bottom: 1.5rem !important; }
    .presentation__body { flex-direction: column !important; gap: 2.5rem !important; }
    .presentation__content, .presentation__visual { width: 100% !important; }
    .presentation__image-wrapper { width: 100% !important; display: flex; justify-content: center; }
    .presentation__image-wrapper img { width: 100% !important; max-width: 400px !important; height: auto !important; object-fit: contain !important; border-radius: 12px !important; }
}

/* =========================================
   REDISEÑO MÓVIL PÁGINA CORPORATIVA Y FORMULARIOS
========================================= */
.branch-corporate-intro, .alliances, .cta { max-width: 100vw !important; overflow-x: hidden !important; box-sizing: border-box !important; }

@media screen and (max-width: 768px) {
    .branch-corporate-intro .row { display: flex !important; flex-direction: column !important; gap: 2rem !important; }
    .branch-corporate-intro .col { width: 100% !important; max-width: 100vw !important; padding: 0 1.5rem !important; box-sizing: border-box !important; }
    .corporate-presentation__text { width: 100% !important; padding: 0 !important; overflow: hidden !important; }
    .corporate-presentation__text ul, .corporate-presentation__text ol, .corporate-presentation__text li { width: 100% !important; max-width: 100% !important; padding-left: 1rem !important; margin-right: 0 !important; box-sizing: border-box !important; word-wrap: break-word !important; }
    /* Corrección de imagen corporativa en celular para que no se deforme */
    .branch-corporate-intro .home-menus__image { min-height: 300px !important; height: 40vh !important; width: 100% !important; }
    .branch-corporate-intro .home-menus__image img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
}

.premium-dropdown { width: 100% !important; padding: 12px 15px !important; border: 2px solid #c89c3d !important; border-radius: 8px !important; background-color: #fcfcfc !important; color: #16407a !important; font-family: var(--seravek), "Lato", sans-serif !important; font-size: 1rem !important; font-weight: 600 !important; margin-top: 8px !important; margin-bottom: 15px !important; box-sizing: border-box !important; transition: all 0.3s ease !important; cursor: pointer; }
.premium-dropdown:focus { outline: none !important; border-color: #16407a !important; box-shadow: 0 0 8px rgba(22, 64, 122, 0.2) !important; }
.contact, .awards { max-width: 100vw !important; overflow-x: hidden !important; box-sizing: border-box !important; }

@media screen and (max-width: 768px) {
    .contact .row { display: flex !important; flex-direction: column !important; gap: 2rem !important; }
    .contact .col { width: 100% !important; max-width: 100vw !important; padding: 0 1.5rem !important; box-sizing: border-box !important; }
    .contact__presentation, .contact__form { width: 100% !important; max-width: 100vw !important; overflow: hidden !important; box-sizing: border-box !important; }
    .contact__presentation * { max-width: 100% !important; word-wrap: break-word !important; box-sizing: border-box !important; }
    .contact-form__form { width: 100% !important; padding: 1rem !important; background: #f9f9f9 !important; border-radius: 12px !important; }
}

/* =========================================
   DISEÑO PREMIUM: BOTONES DUALES (BENEFICIOS)
========================================= */
.modern-benefits-wrapper { display: flex !important; justify-content: center !important; align-items: center !important; gap: 1.5rem !important; margin-top: 2rem !important; flex-wrap: wrap !important; }
.btn-modern { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important; padding: 0.9rem 2rem !important; font-family: var(--seravek), "Lato", sans-serif !important; font-size: 0.95rem !important; font-weight: 700 !important; border-radius: 50px !important; text-decoration: none !important; text-transform: uppercase !important; letter-spacing: 1px !important; transition: all 0.3s ease !important; box-shadow: 0 6px 20px rgba(0,0,0,0.15) !important; border: none !important; }
.btn-modern--gold { background: linear-gradient(135deg, #c89c3d 0%, #b08732 100%) !important; color: #ffffff !important; }
.btn-modern--blue { background: linear-gradient(135deg, #16407a 0%, #0d284f 100%) !important; color: #ffffff !important; }
.btn-modern:hover { transform: translateY(-5px) !important; box-shadow: 0 10px 25px rgba(0,0,0,0.25) !important; color: #ffffff !important; }
@media screen and (max-width: 768px) { .modern-benefits-wrapper { flex-direction: column !important; gap: 1rem !important; width: 100% !important; } .btn-modern { width: 100% !important; box-sizing: border-box !important; } }

/* =========================================
   REDISEÑO BRUTAL PÁGINA CORPORATIVA (Forzado)
========================================= */
.page--contact, .page--contact * { box-sizing: border-box !important; }
.page--contact { width: 100vw !important; max-width: 100vw !important; overflow-x: hidden !important; background-color: #fcfcfc !important; }
.page--contact .row { margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; max-width: 100vw !important; }
.page--contact .container { max-width: 100vw !important; }
.page--contact a, .page--contact .button, .page--contact a[href*="whatsapp"] { max-width: 100% !important; white-space: normal !important; word-wrap: break-word !important; text-align: center !important; }
.branch-corporate-intro { padding: 6rem 0 !important; background: white; }
.corporate-presentation { text-align: center; }
.corporate-presentation__title { color: var(--blue) !important; font-size: 2.2rem !important; margin-bottom: 1.5rem !important; }
.corporate-presentation__title span { color: var(--gold) !important; display: block; }
.corporate-presentation__text { font-size: 1.15rem !important; line-height: 1.6 !important; color: #444 !important; }
.corporate-services__content { width: 100% !important; padding: 2rem 0 !important; }
.corporate-services__list { margin-left: 0 !important; padding-left: 2rem !important; width: 100% !important; }
.corporate-services__item { word-break: break-word !important; margin-bottom: 1rem !important; line-height: 1.4 !important; font-size: 1.1rem !important; }
.corporate-services__item i { color: var(--gold) !important; font-size: 1.2rem; }
.corporate-services__title { color: var(--gold) !important; font-size: 2rem !important; text-align: center; margin-bottom: 2rem !important; }
.branch-corporate-services.section--blue { background-color: var(--blue) !important; padding: 5rem 0 !important; color: white; }

@media screen and (min-width: 1025px) {
    .page--contact .row { display: flex !important; align-items: center !important; gap: 4rem !important; padding: 0 2rem !important; max-width: 1200px !important; margin: 0 auto !important; }
    .page--contact .col { flex: 1 !important; }
    .branch-corporate-intro .home-menus__image { height: 500px !important; border-radius: 12px; overflow: hidden; box-shadow: 0 15px 30px rgba(0,0,0,0.15); }
    .branch-corporate-intro .home-menus__image img, .corporate-services__slide-image img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
    .corporate-services__slide-image { height: 450px !important; border-radius: 12px; overflow: hidden; }
}

@media screen and (max-width: 768px) {
    .page--contact .row { display: flex !important; flex-direction: column !important; gap: 2.5rem !important; }
    .branch-corporate-intro .row, .branch-corporate-services .row { flex-direction: column-reverse !important; padding: 0 1.5rem !important; }
    .branch-corporate-intro .home-menus__image, .corporate-services__slide-image { height: 350px !important; width: 100% !important; }
    .branch-corporate-intro .home-menus__image img, .corporate-services__slide-image img { width: 100% !important; height: 100% !important; object-fit: cover !important; border-radius: 12px; }
    .corporate-presentation__text { font-size: 1.05rem !important; }
    .corporate-services__list { padding-left: 1.5rem !important; }
    .awards, .cta, .contact { padding: 4rem 1.5rem !important; }
}

/* =========================================
   ARMONIZACIÓN FUNCIONAL EXCLUSIVA HEADER
========================================= */
.header .logo-container, .header__logo-wrapper { display: flex !important; align-items: center !important; gap: 15px !important; }
.header .logo img, .header__logo img { max-height: 90px !important; width: auto !important; display: block !important; }
.header .menu__title, .header .menu__title--gold, .header__title, .header__subtitle { font-size: 1.1rem !important; font-weight: 500 !important; margin: 0 !important; letter-spacing: 0.5px; line-height: 1.2; }
@media screen and (max-width: 768px) { .header .logo-container { flex-direction: column !important; text-align: center; } .header .logo img { max-height: 70px !important; } .header .menu__title { font-size: 0.95rem !important; } }
.page--contact .contact .form-group input, .page--contact .contact .form-group select, .page--contact .contact .form-group textarea { max-width: 100% !important; width: 100% !important; font-size: 0.95rem !important; padding: 10px 15px !important; border-radius: 6px !important; box-sizing: border-box !important; }
.page--contact .form__button { width: auto !important; max-width: 100% !important; padding: 0.8rem 2.5rem !important; font-size: 1rem !important; font-weight: 700 !important; border-radius: 50px !important; box-sizing: border-box !important; white-space: normal !important; word-wrap: break-word !important; }
.corporate-presentation__text, .contact__presentation, .home-benefits .section__text { max-width: 750px !important; margin: 0 auto 3rem auto !important; font-size: 1.15rem !important; line-height: 1.7 !important; color: #333 !important; text-align: center; }
.page--contact a[href*="whatsapp"], .page--contact .button--whatsapp { max-width: 100% !important; box-sizing: border-box !important; white-space: normal !important; word-wrap: break-word !important; display: inline-block !important; padding: 0.8rem 1.5rem !important; text-align: center; }
@media screen and (max-width: 768px) { .page--contact .col { width: 100% !important; padding: 0 !important; } .branch-corporate-intro .container, .corporate-services__content, .contact .container, .awards .container, .cta .container { padding: 3rem 1.5rem !important; text-align: center; } .corporate-presentation__text { font-size: 1.05rem !important; padding: 0 !important; } }



/* =========================================
   RECUADRO AZUL PREMIUM (SECCIÓN CORPORATIVA)
========================================= */
.home-events__content {
    background-color: rgba(22, 64, 122, 0.85) !important; /* Azul corporativo con 85% de transparencia */
    backdrop-filter: blur(8px); /* Efecto cristal moderno (desenfoca el fondo) */
    border-radius: 20px !important; /* Bordes suaves y redondeados */
    padding: 3rem 2.5rem !important; /* Más respiro interior (minimalismo) */
    max-width: 600px !important; /* Evita que se estire demasiado en PC */
    margin: 0 auto !important; /* Centrado perfecto */
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2) !important; /* Sombra elegante */
    border: 1px solid rgba(255, 255, 255, 0.1); /* Borde sutil brillante */
    text-align: center !important;
}

/* Tipografía del texto dentro del recuadro */
.home-events__content p {
    color: #ffffff !important;
    font-family: var(--seravek), "Lato", sans-serif !important;
    font-size: 1.25rem !important;
    line-height: 1.6 !important;
    font-weight: 300 !important; /* Letra más fina y elegante */
    margin-bottom: 2.5rem !important;
    letter-spacing: 0.5px !important;
}

/* Botón "Cotiza Aquí" dentro del recuadro */
.home-events__content .button {
    background: linear-gradient(135deg, #c89c3d 0%, #b08732 100%) !important; /* Dorado premium */
    color: white !important;
    padding: 1rem 3rem !important;
    border-radius: 50px !important; /* Botón en forma de píldora */
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease !important;
    display: inline-block !important;
}

.home-events__content .button:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 20px rgba(200, 156, 61, 0.4) !important; /* Sombra dorada al pasar el ratón */
}

/* Adaptación para móviles */
@media screen and (max-width: 768px) {
    .home-events__content {
        padding: 2rem 1.5rem !important;
        border-radius: 16px !important;
        width: 90% !important;
    }
    .home-events__content p {
        font-size: 1.1rem !important;
    }
}

/* =========================================
   💥 BOMBA NUCLEAR PARA SAFARI (iOS) 💥
========================================= */

@media screen and (max-width: 768px) {
    
    /* 1. EL CORSÉ PARA EL INPUT DE FECHA */
    /* Obligamos al contenedor del formulario a no dejar salir nada */
    .contact-form__form,
    .page--contact .contact .form-group {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important; /* Si algo intenta salirse, se corta */
        box-sizing: border-box !important;
    }

    /* Forzamos el input de fecha a comportarse */
    .page--contact .contact .form-group input[type="date"],
    .contact-form__form input[type="date"] {
        -webkit-appearance: none !important; 
        appearance: none !important;
        width: 100% !important; 
        min-width: 100% !important; /* Safari a veces necesita min-width en lugar de width */
        max-width: 100% !important;
        box-sizing: border-box !important;
        min-height: 48px !important; 
        display: block !important;
        margin: 0 !important;
        background-color: #ffffff !important; /* Evita fondos transparentes raros en iOS */
        padding: 10px !important;
    }

    /* 2. RESURRECCIÓN DE LA IMAGEN CORPORATIVA */
    /* Safari colapsa los sliders (Splide). Usaremos aspect-ratio para forzar el espacio */
    .corporate-services__slide-item {
        display: block !important;
        width: 100% !important;
    }

    .corporate-services__slide-image {
        display: block !important;
        width: 100% !important;
        /* En lugar de height fijo, forzamos un cuadrado perfecto. Safari AMA esto */
        aspect-ratio: 1 / 1 !important; 
        min-height: 300px !important; /* Seguro de vida */
        position: relative !important;
        overflow: hidden !important;
        border-radius: 12px !important;
        margin-bottom: 1.5rem !important; 
        background-color: #16407a !important; /* Fondo azul para saber si la caja existe */
    }

    .corporate-services__slide-image img.image,
    .corporate-services__slide-image img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        position: relative !important; /* Quitamos el absolute que marea a Safari */
    }
}

/* =========================================
   REDISEÑO: SECCIÓN BIG BEN (APILADA)
========================================= */

/* Forzamos la columna única */
.presentation__body--stacked {
    display: flex !important;
    flex-direction: column !important; /* Elementos apilados verticalmente */
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
}

/* El texto y la imagen ocupan todo el ancho, pero con un límite para verse elegantes */
.presentation__content--full,
.presentation__visual--full {
    width: 100% !important;
    max-width: 1000px !important; /* Límite para que no se deforme en PC */
    margin: 0 auto !important;
}

/* Ajustes de la imagen para que se adapte perfecta */
.presentation__visual--full img {
    width: 100% !important;
    max-height: 600px !important; /* Altura máxima para que no ocupe toda la pantalla */
    object-fit: cover !important; /* Recorte inteligente */
}

/* Ajustes para celular */
@media screen and (max-width: 768px) {
    .presentation__title {
        font-size: 1.8rem !important;
    }
    .presentation__text {
        font-size: 1.1rem !important;
        padding: 0 1rem !important;
        margin-bottom: 2rem !important;
    }
    .presentation__visual--full img {
        max-height: 350px !important;
        border-radius: 12px !important;
    }
}

/* =========================================
   REDISEÑO: SECCIÓN "NOSOTROS" (COLUMNA ÚNICA)
========================================= */

/* Centramos el título */
.presentation__header {
    text-align: center !important;
    margin-bottom: 2rem !important;
    width: 100% !important;
}

/* Forzamos la estructura a una sola columna (Apilada) */
.presentation__body {
    display: flex !important;
    flex-direction: column !important; /* Magia: pone el texto arriba y la imagen abajo */
    align-items: center !important;
    justify-content: center !important;
    gap: 3rem !important; /* Espacio agradable entre texto e imagen */
    width: 100% !important;
}

/* El texto y la imagen ocupan todo el ancho disponible, pero con un límite elegante */
.presentation__content,
.presentation__visual {
    width: 100% !important;
    max-width: 1000px !important; /* Límite para que no se deforme en PC */
    margin: 0 auto !important;
}

/* Ajustes del texto descriptivo */
.presentation__text .p1,
.presentation__text p {
    text-align: center !important;
    font-size: 1.25rem !important;
    line-height: 1.7 !important;
    max-width: 900px !important; /* Un poco más angosto que la imagen para que se vea premium */
    margin: 0 auto !important;
    color: var(--blue, #16407a) !important;
    font-weight: 400 !important;
}

/* El contenedor de la foto */
.presentation__image-wrapper {
    width: 100% !important;
    box-shadow: 0 15px 35px rgba(0,0,0,0.15) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    margin: 0 auto !important;
    display: flex !important;
    justify-content: center !important;
}

/* La imagen adaptándose maravillosamente */
.presentation__image-wrapper img {
    width: 100% !important;
    height: auto !important;
    max-height: 550px !important; /* Altura máxima para que no parezca un muro gigante */
    object-fit: cover !important; /* Recorte inteligente para que nunca se deforme */
    display: block !important;
    border-radius: 16px !important;
}

/* =========================================
   ADAPTACIÓN PARA CELULARES
========================================= */
@media screen and (max-width: 768px) {
    .presentation__body { gap: 1.5rem !important; }
    
    .presentation__text .p1,
    .presentation__text p {
        font-size: 1.05rem !important;
        padding: 0 1rem !important;
    }
    
    .presentation__image-wrapper img {
        max-height: 300px !important; /* Más pequeña en cel */
        border-radius: 12px !important;
    }
}

/* =========================================
   🚨 ACTUALIZACIÓN DEFINITIVA: REDISEÑO BENEFICIOS (MUELLE GIGANTE) 🚨
   Técnica de Sub-elemento para "Zoom" sin afectar altura
========================================= */

/* 1. EL CONTENEDOR: Mantenemos la altura original (75vh), blindamos overflow horizontal */
.home-benefits {
    background-color: #fcfcfc !important; 
    padding: 10rem 0 !important; 
    min-height: 100vh !important; 
    border: none !important;
    
    /* 🛑 CANDADOS CRUCIALES 🛑 */
    position: relative !important; /* Necesario para el sub-elemento */
    overflow: hidden !important; /* Corta el exceso de la imagen a la izquierda */
    background-image: none !important; /* Quitamos el fondo antiguo del elemento principal */
}

/* 2. EL SUB-ELEMENTO (La imagen real): Aquí aplicamos el Zoom */
.home-benefits::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    height: 100% !important; /* Ocupa todo el alto de la sección */
    
    /* 🛑 EL ARREGLO DEL ANCHO (ZOOM) 🛑 */
    /* Hacemos la imagen un 60% más ancha que la pantalla para lograr el zoom */
    width: 180% !important; 
    
    /* Mantenemos el filtro y tu imagen */
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.95), rgba(22, 64, 122, 0.1)), 
                      url('https://restaurantebigbentrujillo.com/wp-content/uploads/2026/03/Muelle-Ilustracion-scaled.jpg') !important;
                      
    /* Escalamos la imagen para que llene su ancho exagerado de 160% */
    background-size: cover !important; 
    
    /* 🛑 ALINEACIÓN A LA DERECHA 🛑 */
    /* Pegamos la imagen a la derecha para que el muelle sea visible y el "recorte" sea a la izquierda */
    background-position: right 69% !important; /* La empuja bastante hacia arriba */
    /* o prueba con 30%, 10%, etc. hasta que quede a tu gusto */
    
    background-repeat: no-repeat !important;
    background-attachment: scroll !important; 
    
    /* Aseguramos que esté detrás del texto */
    z-index: 1 !important; 
}

/* 3. Asegurar que el contenido esté sobre la nueva imagen de fondo */
.home-benefits .container,
.home-benefits .section__body {
    position: relative !important;
    z-index: 2 !important; /* Por encima de ::before (z-index 1) */
}

/* 4. LA ESTRUCTURA (Texto): Una sola columna centrada */
.home-benefits .section__body {
    display: block !important; 
    text-align: center !important; 
    max-width: 900px !important; 
    margin: 0 auto !important; 
    width: 100% !important;
}

/* ❌ ELIMINAR LA IMAGEN DE LA DERECHA ORIGINAL (CF7) ❌ */
.home-benefits .section__column:has(.image-container),
.home-benefits .image-container {
    display: none !important; 
}

/* Forzamos que la columna de texto ocupe todo el ancho */
.home-benefits .section__column {
    width: 100% !important;
    padding: 0 1.5rem !important;
}

/* 5. LA TIPOGRAFÍA (Ajuste Compacto y Gris Elegante) */
.home-benefits .benefits-title {
    color: var(--menu-gold, #c89c3d) !important; 
    font-family: var(--seravek), "Lato", sans-serif !important;
    font-size: 2.8rem !important; 
    font-weight: 700 !important;
    text-align: center !important;
    
    /* 🛑 Reducido para acercarlo al texto */
    margin-bottom: 1rem !important; 
    
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
}

.home-benefits .benefits-list p {
    /* 🛑 Gris carbón en lugar de negro puro */
    color: #555555 !important; 
    
    font-family: "Lato", sans-serif !important;
    font-size: 1.35rem !important; 
    font-weight: 500 !important; 
    
    /* 🛑 Interlineado y márgenes reducidos */
    line-height: 1.5 !important; 
    text-align: center !important;
    max-width: 750px !important;
    margin: 0 auto 0.5rem auto !important; 
}

/* 🛑 EL MATA-FANTASMAS: Oculta los párrafos vacíos de WordPress */
.home-benefits .benefits-list p:empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Acercamos los botones al texto */
.modern-benefits-wrapper {
    margin-top: 1.5rem !important;
}

/* 6. Adaptación para Celulares: Reducimos el zoom y mantenemos compacto */
@media screen and (max-width: 768px) {
    .home-benefits {
        padding: 4rem 1rem !important;
        min-height: auto !important; 
    }
    
    .home-benefits::before {
        width: 120% !important; 
        background-position: right center !important;
    }
    
    .home-benefits .benefits-title {
        font-size: 2rem !important;
        margin-bottom: 1rem !important;
    }
    
    .home-benefits .benefits-list p {
        font-size: 1.15rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    .modern-benefits-wrapper {
        margin-top: 1rem !important;
    }
}

/* =========================================
   🔄 REORDENAR ELEMENTOS: SECCIÓN EVENTOS (RECUADRO AZUL)
========================================= */

/* Convertimos el recuadro en una columna flexible */
.home-events__content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Todos los elementos normales se quedan arriba (orden 1) */
.home-events__content > * {
    order: 1;
}

/* Movemos el botón para que quede en la penúltima posición (orden 2) */
.home-events__content .button,
.home-events__content a {
    order: 2 !important;
    margin-top: 1rem !important;
    margin-bottom: 2rem !important; /* Espacio para separar del texto final */
}

/* Movemos el último párrafo ("Eleva la experiencia...") al final de todo (orden 3) */
.home-events__content p:last-of-type {
    order: 3 !important;
    margin-bottom: 0 !important; 
    font-size: 1.15rem !important; /* Un poco más pequeño para verse como "nota especial" */
    font-weight: 300 !important;
    opacity: 0.9 !important; /* Ligeramente tenue para mayor elegancia */
}

/* =========================================
   🚨 REDISEÑO DEFINITIVO: SECCIÓN CARTA 🚨
   Texto a la izquierda, Carrusel estético a la derecha
========================================= */

/* 1. EL CONTENEDOR GENERAL */
.home-menus.section {
    padding: 8rem 0 !important;
    background-color: var(--blue, #16407a) !important;
}

/* Limitamos el ancho general para que no se desparrame en monitores gigantes */
.home-menus .container {
    max-width: 1100px !important;
    margin: 0 auto !important;
    padding: 0 2rem !important;
}

/* 2. ESTRUCTURA DE 2 COLUMNAS (Armonía perfecta) */
.home-menus__wrapper {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important; /* Mitad texto, mitad carrusel */
    gap: 5rem !important; /* Espacio limpio entre ambas cosas */
    align-items: center !important; 
}

/* 3. COLUMNA IZQUIERDA: TEXTO Y BOTONES */
.home-menus__content-col {
    text-align: left !important; /* Obligamos a todo a irse a la izquierda */
}

.home-menus .section__title {
    font-family: var(--seravek), sans-serif !important; /* Tipografía oficial */
    color: var(--gold, #c89c3d) !important;
    font-size: 3.2rem !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    margin-bottom: 1.5rem !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    text-align: left !important; 
}

.home-menus .section__text {
    font-family: "Lato", sans-serif !important; /* Tipografía oficial */
    color: #ffffff !important;
    font-size: 1.25rem !important;
    line-height: 1.7 !important;
    font-weight: 300 !important; /* Minimalista y limpio */
    margin-bottom: 3rem !important;
    opacity: 0.9 !important;
    text-align: left !important; 
    max-width: 90% !important; /* Para que las líneas no se hagan tan largas */
}

.home-menus .url-list {
    display: flex !important;
    justify-content: flex-start !important; /* Botones alineados a la izquierda */
    gap: 1.5rem !important;
    flex-wrap: wrap !important;
}

/* 4. COLUMNA DERECHA: EL CARRUSEL */
.home-menus__image-col {
    width: 100% !important;
    max-width: 450px !important; /* ¡LA CLAVE! Evita que el carrusel se haga monstruoso */
    margin: 0 auto !important; 
}

/* Blindaje de esquinas y sombras */
#slider-cartas {
    border-radius: 20px !important;
    overflow: hidden !important; /* Esto corta las esquinas rebeldes */
    box-shadow: 0 25px 50px rgba(0,0,0,0.3) !important; /* Sombra premium flotante */
    height: auto !important; /* Anulamos basuras heredadas */
    background-color: #000 !important; /* Fondo por si la foto tarda en cargar */
}

#slider-cartas .splide__track {
    border-radius: 20px !important;
    overflow: hidden !important;
}

/* Las imágenes con proporción elegante */
#slider-cartas .splide__slide img,
.home-menus__image-container img.estatica {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4/5 !important; /* Proporción vertical tipo retrato fotográfico */
    object-fit: cover !important;
    display: block !important;
    border-radius: 20px !important;
}

/* Toque fino a la paginación (los puntitos) */
#slider-cartas .splide__pagination {
    bottom: 1.5rem !important;
}
#slider-cartas .splide__pagination__page {
    background: #ffffff !important;
    opacity: 0.4 !important;
    transition: all 0.3s ease !important;
}
#slider-cartas .splide__pagination__page.is-active {
    background: var(--gold, #c89c3d) !important;
    opacity: 1 !important;
    transform: scale(1.4) !important;
}

/* 5. ADAPTACIÓN A MÓVILES */
@media screen and (max-width: 992px) {
    .home-menus__wrapper {
        grid-template-columns: 1fr !important; /* Se apila uno sobre otro */
        gap: 4rem !important;
    }
    .home-menus__content-col,
    .home-menus .section__title,
    .home-menus .section__text {
        text-align: center !important; /* En celular sí se ve mejor centrado */
        max-width: 100% !important;
    }
    .home-menus .url-list {
        justify-content: center !important;
    }
    .home-menus.section {
        padding: 5rem 0 !important;
    }
}