/*
 * KTFM Connect — Premium Completion Pass
 * Scoped to .page-connect so existing site styles are preserved.
 */

.page-connect .connect-hero {
    min-height: min(940px, calc(100vh - 72px));
}

.page-connect .connect-hero__veil {
    background:
        linear-gradient(
            90deg,
            rgba(5, 22, 41, .97) 0%,
            rgba(5, 22, 41, .88) 40%,
            rgba(5, 22, 41, .56) 70%,
            rgba(5, 22, 41, .28) 100%
        ),
        linear-gradient(
            0deg,
            rgba(4, 18, 34, .74),
            transparent 52%
        );
}

.page-connect .connect-hero__content {
    width: min(900px, 74%);
}

.page-connect .connect-hero h1 {
    max-width: 900px;
    font-size: clamp(4rem, 7.4vw, 7.7rem);
}

.page-connect .connect-hero__statement {
    max-width: 650px;
    font-size: clamp(1.25rem, 2vw, 1.8rem);
}

.page-connect .connect-hero__intro {
    max-width: 720px;
    color: rgba(255,255,255,.78);
}

.page-connect .connect-hero__actions .button {
    min-height: 54px;
    box-shadow: 0 14px 34px rgba(0,0,0,.18);
}

/* Sticky page nav */
.page-connect .connect-nav {
    box-shadow: 0 10px 30px rgba(8,29,52,.07);
}

.page-connect .connect-nav__inner {
    overflow-x: auto;
    scrollbar-width: none;
}

.page-connect .connect-nav__inner::-webkit-scrollbar {
    display: none;
}

.page-connect .connect-nav__inner a {
    flex: 0 0 auto;
}

/* Welcome */
.page-connect .connect-welcome__grid {
    gap: clamp(50px, 8vw, 110px);
    align-items: center;
}

.page-connect .connect-welcome__visual {
    max-width: 580px;
}

.page-connect .connect-welcome__image {
    border-radius: 32px 150px 32px 32px;
    box-shadow: 0 35px 80px rgba(10,30,54,.13);
}

.page-connect .connect-welcome__pillars {
    gap: 10px;
}

.page-connect .connect-welcome__pillars article {
    padding: 20px;
    border: 1px solid rgba(13,39,68,.08);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(13,39,68,.06);
}

/* Premium pathways */
.page-connect .connect-pathways {
    background:
        radial-gradient(circle at 90% 0%, rgba(211,160,65,.14), transparent 30rem),
        #0b223d;
}

.page-connect .connect-pathways__head {
    align-items: end;
}

.page-connect .connect-pathways__track {
    gap: 16px;
    padding-bottom: 12px;
}

.page-connect .connect-pathway-card {
    min-height: 610px;
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 28px 70px rgba(0,0,0,.22);
}

.page-connect .connect-pathway-card__veil {
    background:
        linear-gradient(
            180deg,
            rgba(5,18,34,.06) 0%,
            rgba(5,18,34,.28) 34%,
            rgba(5,18,34,.94) 100%
        );
}

.page-connect .connect-pathway-card__content {
    padding: 30px;
}

.page-connect .connect-pathway-card__meta span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #ddb05b;
    color: #0c223c;
}

.page-connect .connect-pathway-card__content h3 {
    font-size: clamp(2rem, 3vw, 3.2rem);
}

.page-connect .connect-pathway-card__chips span {
    border-color: rgba(255,255,255,.14);
    background: rgba(255,255,255,.07);
}

/* Visit / locations */
.page-connect .connect-visit__stage {
    border-radius: 34px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(10,30,54,.15);
}

.page-connect .connect-visit__campuses {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 10px;
}

.page-connect .connect-visit__campuses a {
    min-height: 108px;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 16px;
    background: rgba(6,22,40,.7);
    backdrop-filter: blur(12px);
    transition:
        transform .2s ease,
        background .2s ease,
        border-color .2s ease;
}

.page-connect .connect-visit__campuses a:hover {
    transform: translateY(-4px);
    background: rgba(218,168,75,.14);
    border-color: rgba(218,168,75,.38);
}

.page-connect .connect-visit__campuses a > span {
    display: grid;
    gap: 3px;
}

.page-connect .connect-visit__campuses a strong {
    color: #fff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1rem;
    font-weight: 400;
}

.page-connect .connect-visit__campuses a em {
    color: rgba(255,255,255,.58);
    font-size: .62rem;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.page-connect .connect-visit__campuses a i {
    color: #e0b25d;
    font-style: normal;
}

/* Baptism */
.page-connect .connect-baptism {
    background:
        radial-gradient(circle at 15% 20%, rgba(224,178,90,.12), transparent 27rem),
        #f7f2e8;
}

.page-connect .connect-baptism__grid {
    display: grid;
    grid-template-columns: minmax(0,1.06fr) minmax(360px,.74fr);
    gap: clamp(50px, 8vw, 110px);
    align-items: center;
}

.page-connect .connect-baptism__content > p:not(.eyebrow) {
    max-width: 690px;
    color: #647083;
    line-height: 1.8;
}

.page-connect .connect-baptism__journey {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 28px;
}

.page-connect .connect-baptism__journey article {
    padding: 20px;
    border: 1px solid rgba(13,39,68,.09);
    border-radius: 18px;
    background: rgba(255,255,255,.7);
}

.page-connect .connect-baptism__journey span {
    display: inline-flex;
    margin-bottom: 18px;
    color: #ae7924;
    font-size: .66rem;
    font-weight: 900;
    letter-spacing: .08em;
}

.page-connect .connect-baptism__journey strong {
    display: block;
    color: #0e2948;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.25rem;
}

.page-connect .connect-baptism__journey p {
    margin: 7px 0 0;
    color: #6e7887;
    font-size: .8rem;
    line-height: 1.6;
}

.page-connect .connect-baptism__actions,
.page-connect .connect-membership__actions,
.page-connect .connect-groups__actions,
.page-connect .connect-faith__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 18px;
    align-items: center;
    margin-top: 26px;
}

.page-connect .connect-baptism__visual {
    position: relative;
    max-width: 520px;
    justify-self: end;
}

.page-connect .connect-baptism__image {
    border-radius: 180px 180px 28px 28px;
    box-shadow: 0 32px 80px rgba(13,39,68,.15);
}

.page-connect .connect-baptism__seal {
    position: absolute;
    right: -22px;
    bottom: 28px;
    display: grid;
    place-items: center;
    width: 128px;
    height: 128px;
    border: 1px solid rgba(222,173,79,.5);
    border-radius: 50%;
    background: #102944;
    color: #fff;
    text-align: center;
    box-shadow: 0 20px 45px rgba(0,0,0,.18);
}

.page-connect .connect-baptism__seal span,
.page-connect .connect-baptism__seal small {
    font-size: .52rem;
    letter-spacing: .08em;
}

.page-connect .connect-baptism__seal strong {
    color: #e0b15a;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.1rem;
}

/* Community */
.page-connect .connect-community__grid {
    gap: 16px;
}

.page-connect .connect-membership,
.page-connect .connect-groups {
    scroll-margin-top: 130px;
    border-radius: 26px;
    box-shadow: 0 24px 55px rgba(13,39,68,.07);
}

.page-connect .connect-membership__journey span,
.page-connect .connect-groups__types span {
    border-radius: 999px;
}

/* Serve */
.page-connect .connect-serve__grid {
    gap: clamp(50px, 8vw, 110px);
}

.page-connect .connect-serve__image {
    border-radius: 34px 150px 34px 34px;
    box-shadow: 0 35px 80px rgba(0,0,0,.18);
}

.page-connect .connect-serve__areas span {
    background: rgba(255,255,255,.065);
    border-color: rgba(255,255,255,.11);
}

.page-connect .connect-serve__actions .button {
    min-height: 52px;
}

/* Faith / prayer */
.page-connect #connect-salvation {
    scroll-margin-top: 130px;
}

.page-connect .connect-faith__salvation,
.page-connect .connect-faith__prayer {
    min-height: 430px;
    border-radius: 28px;
    box-shadow: 0 24px 65px rgba(13,39,68,.08);
}

.page-connect .connect-faith__prayer {
    background:
        radial-gradient(circle at 90% 0%, rgba(224,177,83,.2), transparent 24rem),
        #0d2948;
}

.page-connect .connect-faith__prayer .button {
    box-shadow: 0 12px 30px rgba(0,0,0,.18);
}

/* Contact */
.page-connect .connect-next__grid {
    gap: clamp(50px, 8vw, 110px);
}

.page-connect .connect-next__options span {
    border-radius: 14px;
}

/* Final invitation */
.page-connect .connect-cta__veil {
    background:
        linear-gradient(
            90deg,
            rgba(6,21,39,.94),
            rgba(6,21,39,.68) 58%,
            rgba(6,21,39,.28)
        );
}

.page-connect .connect-cta__actions .button {
    min-height: 52px;
}

/* Smooth local anchors */
.page-connect #connect-welcome,
.page-connect #connect-pathways,
.page-connect #connect-visit,
.page-connect #connect-baptism,
.page-connect #connect-community,
.page-connect #connect-serve,
.page-connect #connect-faith,
.page-connect #connect-next {
    scroll-margin-top: 118px;
}

@media (max-width: 1050px) {
    .page-connect .connect-hero__content {
        width: min(900px, 90%);
    }

    .page-connect .connect-visit__campuses {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .page-connect .connect-baptism__grid {
        grid-template-columns: 1fr 340px;
    }
}

@media (max-width: 820px) {
    .page-connect .connect-baptism__grid {
        grid-template-columns: 1fr;
    }

    .page-connect .connect-baptism__visual {
        justify-self: start;
        width: min(100%, 520px);
    }
}

@media (max-width: 650px) {
    .page-connect .connect-hero {
        min-height: 820px;
    }

    .page-connect .connect-hero__content {
        width: 100%;
    }

    .page-connect .connect-hero h1 {
        font-size: clamp(3.7rem, 16vw, 5.8rem);
    }

    .page-connect .connect-hero__actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .page-connect .connect-hero__actions .button {
        width: 100%;
        justify-content: center;
    }

    .page-connect .connect-visit__campuses,
    .page-connect .connect-baptism__journey {
        grid-template-columns: 1fr;
    }

    .page-connect .connect-baptism__seal {
        right: 14px;
        width: 112px;
        height: 112px;
    }

    .page-connect .connect-baptism__actions,
    .page-connect .connect-membership__actions,
    .page-connect .connect-groups__actions,
    .page-connect .connect-faith__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .page-connect .connect-baptism__actions .button,
    .page-connect .connect-membership__actions .button,
    .page-connect .connect-groups__actions .button,
    .page-connect .connect-faith__actions .button {
        width: 100%;
        justify-content: center;
    }
}