/* ============================================================
   KBC — RESPONSIVE iPAD HORIZONTAL (992px - 1199px)
   Una sola media query. Reutiliza las clases de style.css /
   pages.css; !important solo donde hay que ganarle a reglas
   previas o a estilos inline del blade.

   iPad es tactil: todo lo que en desktop se revela con :hover
   se deja visible por defecto (overlays, "Learn more", etc.).
   Los efectos GSAP (pin, parallax, carruseles) siguen activos.
   ============================================================ */
@media (min-width: 992px) and (max-width: 1199.98px) {
    /* Escala de titulares kbc--font (iPad horizontal) */
    .kbc--font    { font-size: 88px; }
    .kbc--font-xl { font-size: 116px; }
    .kbc--font-lg { font-size: 102px; }
    .kbc--font-md { font-size: 66px; }
    .kbc--font-sm { font-size: 44px; }
    .kbc--font-xs { font-size: 30px; }

    section.kbc-hero-std,
.height-100.hero--section {
        height: calc(100vh - 100px);
    }
    .visit-intro .container-xxl{
        margin-top: -40px !important;
    }
    .aic-off{
        align-items: start !important;
    }
    /* ============================================================
       GLOBAL — GUTTERS
       ============================================================ */
    /* Bootstrap deja 12px: se iguala al padding del header (24px) */
    .container-xxl,
    .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    /* ============================================================
       GLOBAL — HEADER / NAV
       ============================================================ */
    /* el inner trae padding: 0 !important y el logo/boton tocaban el borde */
    .kbc-nav__inner {
        height: 76px;
        padding: 0 24px !important;
    }
    .kbc-nav__cross { width: 48px; height: 48px; }
    /* los 8 links no cabian: se compacta el pill */
    .kbc-nav__links {
        gap: 6px;
        padding: 14px 18px;
    }
    .kbc-nav__links li a { font-size: 14px; }
    .kbc-nav__links li a::before { width: 6px; height: 6px; }
    .kbc-nav__menu-btn {
        padding: 14px 24px;
        font-size: 15px;
        margin-top: -25px;
    }
    /* Mega menu */
    .kbc-mega { padding: 84px 24px 0; }
    .kbc-mega__inner { grid-template-columns: 210px 1fr 260px; }
    .kbc-mega__cat { padding: 11px 22px; font-size: 14px; }
    .kbc-mega__mid { padding: 24px 26px; }
    .kbc-mega__sub-title { font-size: 17px; }

    /* ============================================================
       GLOBAL — TACTIL: nada depende de :hover
       ============================================================ */
    /* Home — location cards */
    .kbc-loc-card__overlay,
    .kbc-loc-card:hover .kbc-loc-card__overlay { transform: none !important; }
    .kbc-loc-card__overlay::before { opacity: 1; }
    .kbc-loc-card:hover { transform: none !important; box-shadow: none; }
    .d-flex:has(.kbc-loc-card:hover) .kbc-loc-card:not(:hover) {
        transform: none !important;
        filter: none;
    }
    /* En staff/partnership/facility el hover solo agrega un CTA decorativo
       ("Learn more") y un marco: la card entera ya es clickeable, asi que
       no se fuerzan visibles para no recargar la vista. Solo se anula el
       zoom, que en tactil se quedaba pegado. */
    .staff-card__media:hover img,
    .partner-card:hover .partner-card__media img,
    .fac-type:hover .fac-type__img { transform: none; }

    /* ============================================================
       HOME
       ============================================================ */
    /* el titulo y la barra del hero llegaban al borde del viewport */
    .kbc-hero__title-wrap,
    .kbc-hero__bar {
        padding-left: 24px;
        padding-right: 24px;
    }
    .kbc-hero__title-wrap {
        bottom: 190px;
        gap: 32px;
    }
    .kbc-hero__title-svg--keystone { width: 380px; height: 48px; }
    .kbc-hero__title-svg--bible { width: 320px; height: 40px; }
    .kbc-hero__bar { height: 120px; bottom: 40px; }
    .kbc-hero__layer--statement > .container-fluid { width: 100%; padding: 0 24px; }
    .kbc-hero__statement-text { font-size: 30px; max-width: 620px; }
    /* One mission / locations */
    .kbc-one-mission { padding: 72px 0 56px; }
    .kbc-locations { padding: 72px 0 96px; }
    .floating-svg1 { width: 26%; }
    .kbc-loc-card { aspect-ratio: 3 / 4; }
    .kbc-loc-card__overlay { padding: 22px 16px; }
    .kbc-loc-card__name { font-size: 34px; }
    .kbc-loc-card__addr { font-size: 15px; }
    .kbc-loc-card__overlay ul { margin-top: 16px; font-size: 14px; }
    .kbc-loc-card__overlay li { gap: 12px; margin-bottom: 4px; }
    /* "Wednesday ->" partia la flecha a la linea siguiente */
    .kbc-loc-card__overlay li > span:first-child { min-width: 110px; }
    /* Gather (el pin horizontal sigue con GSAP) */
    .kbc-gather-carousel li { width: 420px; }
    .kbc-kidsyouth { padding: 72px 0; }

    /* ============================================================
       GOSPEL
       ============================================================ */
    .section-mod { padding: 80px 0; }
    .absolute--cross { width: 28%; }
    .video-card { width: calc(33.333% - 20px); }

    /* ============================================================
       ABOUT
       ============================================================ */
    .about-hero__bar { padding: 28px 26px; }
    .about-hero__b { padding: 28px 0; }
    
    .about-hero__statement { font-size: 21px; }
    .about-hero__cards { --bs-gutter-x: 28px; }
    .about-hero__cards h3 { font-size: 19px; }
    .about-hero__cards p { font-size: 15px; }
    .about-beliefs { padding: 64px 0; }
    .about-beliefs__card { padding: 36px; }
    .about-staff { padding: 56px 0; }
    .about-locations { padding: 96px 0; }
    .about-symbol { padding: 72px 0; }
    .about-symbol__cross { width: 38%; opacity: .3; }
    .about-pillars { padding: 88px 0; }
    .about-pillars__grid { gap: 40px 0; }
    .about-plan { padding: 72px 0; }
    .about-rooms { margin-top: 48px; padding: 96px 0; }

    /* ============================================================
       STAFF
       ============================================================ */
    /* la columna del filtro le robaba ancho al grid */
    .staff-team { padding: 64px 0 80px; }
    .staff-team__layout { gap: 28px; }
    .staff-filter-col { flex: 0 0 210px; }
    .staff-filter { width: 210px; gap: 10px; }
    .staff-filter__btn,
    .staff-filter__clean { padding: 10px 18px; font-size: 14px; }
    .staff-grid__sizer,
    .staff-card { width: 50%; }
    .staff-card__name { font-size: 28px; }
    /* Modal de bio */
    .staff-modal__dialog { gap: 28px; padding: 32px 30px 34px; }
    .staff-modal__name { font-size: 28px; }

    /* ============================================================
       WHAT WE BELIEVE
       ============================================================ */
    .wwb-statement { padding: 72px 0; }
    .wwb-foundation__card { padding: 36px; }
    .wwb-faith,
    .wwb-distinctives { padding: 56px 0 24px; }
    .wwb-faqs { padding: 56px 0 88px; }
    .wwb-modal__nav { width: 180px; }
    .wwb-modal__tabs { gap: 28px; }

    /* ============================================================
       WORSHIP MUSIC & PHILOSOPHY
       ============================================================ */
    .give-statement { padding: 72px 0 40px; }
    .wmp-playlist__card { padding: 0 32px; }
    .wmp-principles { padding: 72px 0 32px; }
    .wmp-songs { padding: 56px 0 88px; }
    .wmp-songs__cross { width: 460px; height: 460px; right: -120px; }
    .wmp-finally { padding: 24px 0 88px; }
    .wmp-finally__card { padding: 150px 40px 52px; }

    /* ============================================================
       PARTNERSHIP
       ============================================================ */
    .partnership-statement { padding: 80px 0 56px; }
    .partner-grid,
    .partnership-vintage__grid { gap: 16px; }
    .partnership-vintage { padding: 40px 0 72px; }
    .partnership-outreach { padding: 32px 0 64px; }
    .partnership-outreach__row { gap: 28px; }
    .partnership-outreach__logo img { height: 44px; max-width: 140px; }
    .partnership-banner { padding: 0 0 80px; }
    .partnership-banner__inner { min-height: 300px; }
    .partnership-banner__content { padding: 32px; }

    /* ============================================================
       FACILITY RESERVATIONS
       ============================================================ */
    .fac-values { padding: 64px 0 32px; }
    .fac-values__card { padding: 32px; }
    .fac-note { margin-top: 40px; }
    .fac-types { padding: 40px 0 56px; }
    .fac-cta__box { padding: 44px 40px; }
    .fac-cta__btn { right: 40px; bottom: 44px; }
    .fac-modal__dialog--detail { padding: 36px 32px 38px; }

    /* ============================================================
       ODESSA / WESLEY CHAPEL
       ============================================================ */
    .odessa-hero__foot { bottom: 56px; }
    .odessa-hero__title { font-size: 60px; }
    .odessa-hero__bar { padding: 28px 26px; }
    .odessa-hero__times { font-size: 22px; }
    .odessa-about-card,
    .odessa-info { padding: 32px 28px; }
    /* la rueda de fotos: arco mas cerrado para que quepan en pantalla */
    .visit-wheel { height: 52vh; min-height: 380px; }
    .visit-polaroid { width: 220px; height: 280px; margin: -140px 0 0 -110px; }
    .odessa-sermon { padding: 64px 0; }
    .odessa-ministries { padding: 0 0 80px; }
    .odessa-aside__cross { height: 220px; }
    .odessa-aside__card { padding: 26px; }

    /* ============================================================
       EVENTS (Odessa / Wesley Chapel)
       ============================================================ */
    .events-current { padding: 64px 0 80px; }
    .events-list { gap: 48px; }
    .events-item__desc { margin-bottom: 28px; }
    .events-modal__grid { gap: 28px; }

    /* ============================================================
       KIDS
       ============================================================ */
    .kids-statement { padding: 72px 0 88px; }
    /* el collage usa px fijos y se salia del viewport */
    .kids-collage { min-height: 420px; margin-top: 40px; }
    .kids-collage__item--1 { width: 150px; height: 150px; left: 1%;  top: 120px; }
    .kids-collage__item--2 { width: 165px; height: 165px; left: 20%; top: 15px; }
    .kids-collage__item--3 { width: 145px; height: 145px; left: 35%; top: 200px; }
    .kids-collage__item--4 { width: 170px; height: 170px; left: 57%; top: 105px; }
    .kids-collage__item--5 { width: 158px; height: 158px; left: 78%; top: 15px; }
    .kids-collage__item--6 { width: 145px; height: 145px; left: 84%; top: 205px; }
    .kids-block { padding: 72px 0; }
    .kids-group__title { font-size: 22px; }
    .kids-awana-cta { min-height: 0; padding: 96px 0 64px; }

    /* ============================================================
       YOUTH
       ============================================================ */
    .youth-statement { padding: 72px 0; }
    .youth-mission { padding: 24px 0 64px; }
    .youth-parallax { height: 56vh; min-height: 340px; }
    .youth-bio { padding: 64px 0; }
    .youth-events { padding: 16px 0 72px; }
    /* el padding-bottom de 250px dejaba un hueco enorme */
    .youth-drop { padding: 16px 0 96px; }
    .youth-drop__card { padding: 40px 36px; }

    /* ============================================================
       SERVE / LIVE IN GROUPS / STUDIES / SERMONS
       ============================================================ */
    .serve-main { padding: 80px 0; }
    .lig-groups { padding: 88px 0 72px; }
    .lig-block { margin-bottom: 56px; }
    .lig-faq-card { padding: 8px 32px; }
    .studies-intro { padding: 72px 0 32px; }
    .studies-current { padding: 24px 0 64px; }
    .studies-current__info { padding-left: 20px; }
    .studies-archive { padding: 24px 0 64px; }
    .sermons-list { padding: 16px 0 80px; }
    /* Sermon detail */
    .sermon-detail { padding: 56px 0 140px; }
    .sermon-detail__cover { max-width: 280px; }
    .sermon-player__inner { gap: 16px; padding: 14px 24px; }
    .sermon-player__cover { width: 68px; height: 68px; }

    /* ============================================================
       NEXT STEPS / PLAN A VISIT / GIVE / EMPLOYMENT
       ============================================================ */
    .ns-block { padding: 64px 0; }
    .ns-studies { padding: 48px 0; }
    .ns-studies__media { margin-top: 40px; }
    .visit-intro { padding-bottom: 72px; }
    .visit-first { padding: 72px 0; }
    /* Find a location: mismo layout que desktop (contenido sobre el mapa,
       a la izquierda). El texto ocupaba todo el ancho y se perdia sobre
       el mapa: se limita a la mitad y el degradado blanco del ::before
       se extiende para que quede legible. */
    .visit-locations { padding: 72px 0; }
    .visit-locations::before {
        background: linear-gradient(to right, #FFFFFF 0%, #FFFFFF 48%, rgba(255, 255, 255, 0) 88%);
    }
    .visit-locations__text {
        flex: 0 0 58%;
        max-width: 58%;
        padding-left: 24px;
        padding-right: 28px;
    }
    /* los anchos fijos (460/440px) se ajustan a la columna */
    .visit-locations__title {
        width: 100%;
        max-width: 100%;
        margin-bottom: 20px;
    }
    .visit-locations__intro {
        max-width: 100%;
        margin-bottom: 36px;
    }
    .visit-loc { margin-bottom: 32px; }
    .visit-loc:last-child { margin-bottom: 0; }
    .visit-kids { padding: 140px 0; }
    .visit-faq { padding: 72px 0; }
    .give-portal { padding: 32px 0 64px; }
    .give-ways { padding: 16px 0 80px; }
    .give-ways__grid { --bs-gutter-x: 28px; --bs-gutter-y: 28px; }
    .give-card { padding: 24px; min-height: 220px; }
    .give-card__desc { margin-top: 36px; }
    .employment-intro { padding: 72px 0 24px; }
    .employment-intro.mb-140 { margin-bottom: 72px !important; }
    .employment-jobs { padding: 24px 0 80px; }

    /* ============================================================
       FOOTER
       ============================================================ */
    .kbc-footer {
        border-radius: 120px 120px 0 0;
        padding: 88px 0 28px;
    }
    
    .kbc-footer .kbc-footer__closing .svgicon { width: 52%; }
}
