/* ==========================================================
   SACRED BASKINTA V1
   ========================================================== */

.bk-sacred-page {
    background:#fff;
}

.bk-sacred-hero {
    position:relative;
    min-height:520px;
    display:flex;
    align-items:flex-end;
    background:
        linear-gradient(
            180deg,
            rgba(6,36,51,.12),
            rgba(6,36,51,.72)
        ),
        url('/wp-content/uploads/baskinta-archive/baskinta-churches-hero.jpg')
        center center / cover no-repeat;
    color:#fff;
}

.bk-sacred-hero-copy {
    position:relative;
    z-index:2;
    max-width:760px;
    padding:90px 0 70px;
}

.bk-sacred-hero .bk-kicker {
    color:#fff;
}

.bk-sacred-hero h1 {
    max-width:720px;
    margin:8px 0 16px;
    color:#fff;
    font-family:var(--bk-type-display);
    font-size:clamp(44px,6vw,78px);
    font-weight:500;
    line-height:.98;
    letter-spacing:-.035em;
}

.bk-sacred-hero p {
    max-width:620px;
    margin:0;
    color:rgba(255,255,255,.9);
    font-size:16px;
    line-height:1.7;
}


.bk-sacred-intro {
    padding:72px 0;
}

.bk-sacred-intro-grid {
    display:grid;
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    gap:70px;
    align-items:start;
}

.bk-sacred-intro-grid p {
    margin:0 0 17px;
    color:#61747d;
    font-size:14px;
    line-height:1.8;
}


.bk-sacred-directory {
    padding:70px 0 80px;
    background:#f5f8f9;
}

.bk-sacred-count {
    display:flex;
    align-items:baseline;
    gap:8px;
    color:#6b7d86;
}

.bk-sacred-count strong {
    color:#0877a6;
    font-size:28px;
    line-height:1;
}

.bk-sacred-count span {
    font-size:11px;
}


.bk-sacred-filters {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:25px 0 28px;
}

.bk-sacred-filter {
    min-height:36px;
    padding:0 15px;
    border:1px solid #d6e0e5;
    border-radius:999px;
    background:#fff;
    color:#536a75;
    font-size:10px;
    font-weight:800;
    cursor:pointer;
}

.bk-sacred-filter:hover {
    border-color:#0877a6;
    color:#0877a6;
}

.bk-sacred-filter.is-active {
    border-color:#0877a6;
    background:#0877a6;
    color:#fff;
}


.bk-sacred-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
}

.bk-sacred-card {
    min-width:0;
    display:flex;
    flex-direction:column;
    border:1px solid #dfe7ea;
    border-radius:14px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 6px 18px rgba(12,53,71,.045);
}

.bk-sacred-card[hidden] {
    display:none !important;
}

.bk-sacred-card-top {
    display:flex;
    align-items:center;
    gap:9px;
    padding:16px 18px 12px;
    border-bottom:1px solid #edf1f3;
}

.bk-sacred-symbol {
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    flex:0 0 30px;
    border-radius:50%;
    background:#eef6f8;
    color:#0877a6;
    font-size:14px;
    font-weight:800;
}

.bk-sacred-type {
    color:#0877a6;
    font-size:8px;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.bk-sacred-card-body {
    flex:1;
    padding:18px;
}

.bk-sacred-card h3 {
    margin:0 0 5px;
    color:#164b63;
    font-family:var(--bk-type-display);
    font-size:22px;
    font-weight:600;
    line-height:1.12;
}

.bk-sacred-ar {
    display:block;
    margin-bottom:13px;
    color:#8a9aa2;
    font-size:12px;
}

.bk-sacred-card p {
    margin:0 0 17px;
    color:#657881;
    font-size:11px;
    line-height:1.65;
}

.bk-sacred-meta {
    display:flex;
    flex-wrap:wrap;
    gap:8px 18px;
}

.bk-sacred-meta span {
    color:#405965;
    font-size:10px;
    line-height:1.45;
}

.bk-sacred-meta small {
    display:block;
    margin-bottom:2px;
    color:#93a1a8;
    font-size:7px;
    font-weight:800;
    letter-spacing:.09em;
    text-transform:uppercase;
}

.bk-sacred-card-footer {
    min-height:52px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:12px 18px;
    border-top:1px solid #edf1f3;
}

.bk-sacred-map-focus {
    padding:0;
    border:0;
    background:transparent;
    color:#0877a6;
    font-size:9px;
    font-weight:800;
    cursor:pointer;
}

.bk-sacred-phone {
    color:#82929a;
    font-size:9px;
}


.bk-sacred-map-section {
    padding:78px 0;
    background:#fff;
}

.bk-sacred-map-shell {
    margin-top:28px;
    padding:10px;
    border:1px solid #dce5ea;
    border-radius:16px;
    background:#fff;
    box-shadow:0 8px 26px rgba(12,53,71,.06);
}

.bk-sacred-map {
    width:100%;
    height:560px;
    min-height:560px;
    border-radius:11px;
    background:#eaf1f3;
}

.bk-sacred-map-icon-wrap {
    background:transparent !important;
    border:0 !important;
}

.bk-sacred-map-icon {
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:3px solid #fff;
    border-radius:50%;
    background:#d15b52;
    color:#fff;
    font-size:14px;
    font-weight:800;
    box-shadow:0 4px 12px rgba(0,0,0,.24);
}

.bk-sacred-popup span {
    display:block;
    margin-bottom:4px;
    color:#0877a6;
    font-size:8px;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.bk-sacred-popup strong {
    color:#164b63;
    font-size:12px;
}


.bk-sacred-closing {
    padding:85px 0;
    background:#164b63;
    color:#fff;
}

.bk-sacred-closing-inner {
    max-width:760px;
    margin:0 auto;
    text-align:center;
}

.bk-sacred-closing .bk-kicker {
    color:#87d5e8;
}

.bk-sacred-closing .bk-editorial-title {
    color:#fff;
}

.bk-sacred-closing p {
    max-width:650px;
    margin:18px auto 0;
    color:rgba(255,255,255,.78);
    font-size:14px;
    line-height:1.8;
}


@media(max-width:980px) {

    .bk-sacred-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

}


@media(max-width:767px) {

    .bk-sacred-hero {
        min-height:440px;
    }

    .bk-sacred-hero-copy {
        padding:70px 0 45px;
    }

    .bk-sacred-intro {
        padding:50px 0;
    }

    .bk-sacred-intro-grid {
        grid-template-columns:1fr;
        gap:24px;
    }

    .bk-sacred-directory {
        padding:50px 0;
    }

    .bk-sacred-grid {
        grid-template-columns:1fr;
    }

    .bk-sacred-map {
        height:430px;
        min-height:430px;
    }

    .bk-sacred-map-section {
        padding:55px 0;
    }

}


/* ==========================================================
   SACRED BASKINTA V2 — EDITORIAL REFINEMENT
   ========================================================== */

/* Main editorial canvas */

.bk-sacred-intro .bk-nature-container,
.bk-sacred-directory .bk-nature-container,
.bk-sacred-map-section .bk-nature-container {

    width:min(calc(100% - 64px), 1380px);
    margin-left:auto;
    margin-right:auto;
}


/* Intro should not stretch */

.bk-sacred-intro-grid {

    grid-template-columns:
        minmax(320px,.8fr)
        minmax(0,1.2fr);

    gap:80px;
}


/* Directory */

.bk-sacred-grid {

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:20px;
}


/*
 * Introduce a visual header to every photo-less card.
 * This is intentionally NOT pretending to be photography.
 */

.bk-sacred-card-top {

    min-height:92px;

    position:relative;

    align-items:flex-end;

    padding:18px 20px;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 82% 15%,
            rgba(80,190,215,.20),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #164b63 0%,
            #1c6078 55%,
            #0877a6 100%
        );

    border-bottom:0;
}


.bk-sacred-card-top::after {

    content:"";

    position:absolute;

    width:150px;
    height:150px;

    right:-55px;
    top:-75px;

    border:1px solid rgba(255,255,255,.16);
    border-radius:50%;
}


.bk-sacred-symbol {

    position:relative;
    z-index:2;

    width:34px;
    height:34px;

    flex:0 0 34px;

    background:rgba(255,255,255,.94);
    color:#164b63;
}


.bk-sacred-type {

    position:relative;
    z-index:2;

    color:#fff;
}


/* Card body */

.bk-sacred-card {

    min-height:330px;
    border-radius:15px;
}


.bk-sacred-card-body {

    padding:22px 21px 18px;
}


.bk-sacred-card h3 {

    font-size:23px;
    line-height:1.12;
}


.bk-sacred-card p {

    font-size:11px;
    line-height:1.7;

    color:#61747d;
}


/* Arabic title becomes part of identity */

.bk-sacred-ar {

    margin-top:7px;
    margin-bottom:15px;

    color:#84959d;

    font-size:12px;
}


/* Better metadata */

.bk-sacred-meta {

    margin-top:18px;
    padding-top:14px;

    border-top:1px solid #edf1f3;
}


/* Footer */

.bk-sacred-card-footer {

    min-height:55px;

    padding:13px 21px;

    background:#fbfcfc;
}


/* Map */

.bk-sacred-map-shell {

    margin-top:28px;
}


/* Dark closing section stays full width */

.bk-sacred-closing .bk-nature-container {

    width:min(calc(100% - 64px), 1100px);
    margin-left:auto;
    margin-right:auto;
}


@media(max-width:1100px) {

    .bk-sacred-intro .bk-nature-container,
    .bk-sacred-directory .bk-nature-container,
    .bk-sacred-map-section .bk-nature-container {

        width:calc(100% - 40px);
    }

}


@media(max-width:900px) {

    .bk-sacred-grid {

        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}


@media(max-width:767px) {

    .bk-sacred-intro .bk-nature-container,
    .bk-sacred-directory .bk-nature-container,
    .bk-sacred-map-section .bk-nature-container,
    .bk-sacred-closing .bk-nature-container {

        width:calc(100% - 28px);
    }


    .bk-sacred-intro-grid {

        grid-template-columns:1fr;
        gap:25px;
    }


    .bk-sacred-grid {

        grid-template-columns:1fr;
        gap:14px;
    }


    .bk-sacred-card {

        min-height:0;
    }

}



/* ==========================================================
   SACRED BASKINTA — APPROVED HERO
   St. Rock / Mar Roukoz
   ========================================================== */

.bk-sacred-hero {

    background-image:
        linear-gradient(
            90deg,
            rgba(7,35,49,.76) 0%,
            rgba(7,35,49,.58) 38%,
            rgba(7,35,49,.25) 68%,
            rgba(7,35,49,.10) 100%
        ),
        url('/wp-content/uploads/2026/09/st-rock-hero-photo.jpg');

    background-position:
        center center;

    background-size:
        cover;

    background-repeat:
        no-repeat;
}



/* ==========================================================
   BASKINTA LOCKED INNER-PAGE HERO STANDARD
   Canonical reference: Discover Baskinta
   ========================================================== */


/*
 * HERO GEOMETRY
 */

.bk-sacred-hero {

    position:
        relative;

    min-height:
        520px;

    display:
        flex;

    align-items:
        center;

    color:
        #fff;

    background-size:
        cover;

    background-position:
        center center;
}


/*
 * Use the same content canvas as the approved
 * Discover Baskinta hero.
 */

.bk-sacred-hero > .bk-nature-container {

    width:
        min(
            calc(100% - 64px),
            1440px
        );

    margin-left:
        auto;

    margin-right:
        auto;
}


/*
 * HERO COPY
 *
 * Discover standard:
 * width:min(700px,65%)
 */

.bk-sacred-hero-copy {

    position:
        relative;

    z-index:
        2;

    width:
        min(
            700px,
            65%
        );

    max-width:
        none;

    padding:
        0;
}


/*
 * KICKER
 */

.bk-sacred-hero .bk-kicker {

    display:
        block;

    margin:
        0 0 12px;

    color:
        #fff;
}


/*
 * HEADLINE
 *
 * Same editorial typography family and treatment
 * as Discover Baskinta.
 */

.bk-sacred-hero h1 {

    max-width:
        none;

    margin:
        0 0 20px;

    color:
        #fff !important;

    font-family:
        var(--bk-type-editorial)
        !important;

    font-weight:
        700 !important;

    letter-spacing:
        -.04em !important;

    line-height:
        .95 !important;

    /*
     * Use the site's canonical hero scale rather than
     * the Churches-specific 78px treatment.
     */

    font-size:
        clamp(
            52px,
            5.4vw,
            74px
        ) !important;
}


/*
 * DESCRIPTION
 *
 * Exact Discover proportions.
 */

.bk-sacred-hero p {

    max-width:
        610px;

    margin:
        0 0 27px;

    color:
        #fff;

    font-size:
        17px;

    line-height:
        1.55;
}


/*
 * APPROVED ST. ROCK IMAGE
 *
 * Keep image full bleed.
 * Darkening is concentrated behind the copy.
 */

.bk-sacred-hero {

    background-image:
        linear-gradient(
            90deg,
            rgba(7,35,49,.70) 0%,
            rgba(7,35,49,.52) 36%,
            rgba(7,35,49,.20) 67%,
            rgba(7,35,49,.06) 100%
        ),
        url('/wp-content/uploads/2026/09/st-rock-hero-photo.jpg');
}


/*
 * MOBILE — same behavior philosophy as Discover.
 */

@media(max-width:767px) {

    .bk-sacred-hero {

        min-height:
            520px;

        background-position:
            60% center;
    }


    .bk-sacred-hero > .bk-nature-container {

        width:
            calc(100% - 28px);
    }


    .bk-sacred-hero-copy {

        width:
            100%;

        padding:
            0;
    }


    .bk-sacred-hero h1 {

        font-size:
            clamp(
                43px,
                13vw,
                58px
            ) !important;
    }


    .bk-sacred-hero p {

        max-width:
            100%;

        font-size:
            14px;

        line-height:
            1.55;
    }

}



/* Sacred registry V2 */

.bk-sacred-locality {

    display:block;

    margin:
        -7px 0 14px;

    color:
        #0877a6;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        .09em;

    text-transform:
        uppercase;
}



/* ==========================================================
   SACRED BASKINTA — PHOTOGRAPHIC CARDS V1
   Canonical thumbnail ratio: 3:2
   ========================================================== */

.bk-sacred-card-photo {

    position:relative;

    aspect-ratio:
        3 / 2;

    width:
        100%;

    overflow:
        hidden;

    background:
        #164b63;
}


.bk-sacred-card-image {

    display:block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    object-position:
        center;

    transition:
        transform .45s ease;
}


.bk-sacred-card:hover
.bk-sacred-card-image {

    transform:
        scale(1.035);
}


.bk-sacred-photo-overlay {

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(7,35,49,0) 42%,
            rgba(7,35,49,.72) 100%
        );

    pointer-events:
        none;
}


.bk-sacred-photo-label {

    position:absolute;

    left:
        18px;

    right:
        18px;

    bottom:
        16px;

    display:flex;

    align-items:center;

    gap:
        9px;

    z-index:
        2;
}


.bk-sacred-card-photo
.bk-sacred-symbol {

    background:
        rgba(255,255,255,.94);

    color:
        #164b63;
}


.bk-sacred-card-photo
.bk-sacred-type {

    color:
        #fff;

    text-shadow:
        0 1px 5px
        rgba(0,0,0,.25);
}


/*
 * Cards with photography and cards without photography
 * retain identical body geometry.
 */

.bk-sacred-card-photo +
.bk-sacred-card-body,
.bk-sacred-card-top +
.bk-sacred-card-body {

    flex:
        1;
}


/*
 * Once photographs exist, the card itself should
 * remain restrained rather than excessively tall.
 */

.bk-sacred-card {

    min-height:
        0;
}

