/* =========================================================
   DIVINE HEALING — PAGE
   ========================================================= */

.wsf-healing-page {

    --healing-black: #0c0b09;
    --healing-brown: #1c1711;
    --healing-deep: #12100c;
    --healing-gold: #c39a51;
    --healing-gold-soft: #9e7942;
    --healing-cream: #eee3cf;
    --healing-muted: #bbae97;

    min-height: 100vh;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(195,154,81,.12),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #17130e 0%,
            #0d0c09 55%,
            #080807 100%
        );

    color: var(--healing-cream);

    overflow: hidden;
}


/* =========================================================
   HERO
   ========================================================= */

.wsf-healing-hero {

    position: relative;

    min-height: 610px;

    display: flex;

    align-items: center;
    justify-content: center;

    padding:
        clamp(70px,9vw,120px)
        24px
        80px;

    text-align: center;

    overflow: hidden;
}


.wsf-healing-hero::before {

    content: "";

    position: absolute;

    width: 650px;
    height: 650px;

    left: 50%;
    top: -390px;

    transform: translateX(-50%);

    border-radius: 50%;

    background:
        rgba(195,154,81,.11);

    filter: blur(100px);

    pointer-events: none;
}


.wsf-healing-hero::after {

    content: "";

    position: absolute;

    left: 7%;
    right: 7%;
    bottom: 0;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(195,154,81,.36),
            transparent
        );
}


.wsf-healing-hero__inner {

    position: relative;

    z-index: 2;

    max-width: 900px;

    margin: 0 auto;
}


.wsf-healing-back {

    display: inline-block;

    margin-bottom: 55px;

    font-family:
        Arial,
        sans-serif;

    font-size: .66rem;

    font-weight: 600;

    letter-spacing: .20em;

    text-decoration: none;

    color:
        rgba(216,190,142,.54);
}


.wsf-healing-hero h1 {

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(3.5rem,9vw,7rem);

    line-height: .84;

    font-weight: 400;

    letter-spacing: .015em;

    color: #f0e4cf;
}


.wsf-healing-rule {

    display: flex;

    align-items: center;
    justify-content: center;

    width:
        min(350px,72%);

    margin:
        34px
        auto
        30px;

    gap: 13px;
}


.wsf-healing-rule span {

    width: 100%;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(195,154,81,.64),
            transparent
        );
}


.wsf-healing-rule i {

    font-size: .62rem;

    font-style: normal;

    color: var(--healing-gold);
}


.wsf-healing-slogan {

    max-width: 700px;

    margin: 0 auto;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(1.1rem,2.3vw,1.45rem);

    line-height: 1.75;

    font-style: italic;

    color:
        rgba(238,227,207,.72);
}


.wsf-healing-watermark {

    position: absolute;

    left: 50%;
    bottom: -48px;

    transform:
        translateX(-50%);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(7rem,20vw,17rem);

    line-height: 1;

    font-weight: 700;

    letter-spacing: .03em;

    white-space: nowrap;

    color:
        rgba(195,154,81,.025);

    pointer-events: none;
}


/* =========================================================
   START HERE
   ========================================================= */

.wsf-healing-start {

    width:
        min(1100px,calc(100% - 28px));

    margin:
        0
        auto;

    padding:
        95px
        0
        100px;
}


.wsf-healing-start__header {

    max-width: 650px;

    margin:
        0
        auto
        45px;

    text-align: center;
}


.wsf-healing-start__header > span {

    display: block;

    margin-bottom: 13px;

    font-family:
        Arial,
        sans-serif;

    font-size: .65rem;

    letter-spacing: .29em;

    color: var(--healing-gold);
}


.wsf-healing-start__header h2 {

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(2.3rem,5vw,4rem);

    font-weight: 400;

    letter-spacing: .04em;

    color: var(--healing-cream);
}


.wsf-healing-start__header p {

    margin:
        18px
        0
        0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 1rem;

    font-style: italic;

    color:
        rgba(238,227,207,.50);
}


/* =========================================================
   FEATURED TEACHING 01
   ========================================================= */

.wsf-healing-teaching {

    position: relative;

    display: grid;

    grid-template-columns:
        minmax(170px,.40fr)
        minmax(0,1.6fr);

    min-height: 470px;

    overflow: hidden;

    text-decoration: none;

    background:
        radial-gradient(
            circle at 78% 15%,
            rgba(195,154,81,.14),
            transparent 30%
        ),
        repeating-linear-gradient(
            115deg,
            rgba(255,255,255,.010) 0 2px,
            rgba(0,0,0,.012) 2px 4px,
            transparent 4px 9px
        ),
        linear-gradient(
            145deg,
            #2d2417 0%,
            #1b1710 48%,
            #0f0e0b 100%
        );

    border:
        1px solid
        rgba(195,154,81,.38);

    box-shadow:
        0 28px 70px
        rgba(0,0,0,.40);

    color: var(--healing-cream);

    transition:
        transform .30s ease,
        border-color .30s ease;
}


.wsf-healing-teaching:hover {

    transform:
        translateY(-6px);

    border-color:
        rgba(215,176,102,.68);
}


.wsf-healing-teaching::after {

    content: "";

    position: absolute;

    inset: 16px;

    border:
        1px solid
        rgba(195,154,81,.09);

    pointer-events: none;
}


/* NUMBER PANEL */

.wsf-healing-teaching__number {

    position: relative;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    min-width: 0;

    background:
        linear-gradient(
            180deg,
            #352918,
            #17130d
        );

    border-right:
        1px solid
        rgba(195,154,81,.25);
}


.wsf-healing-teaching__number::before {

    content: "";

    position: absolute;

    top: 12%;
    bottom: 12%;
    right: 14px;

    width: 1px;

    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(195,154,81,.34),
            transparent
        );
}


.wsf-healing-teaching__number span {

    margin-bottom: 8px;

    font-family:
        Arial,
        sans-serif;

    font-size: .60rem;

    letter-spacing: .25em;

    color:
        rgba(215,176,102,.66);
}


.wsf-healing-teaching__number strong {

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(4rem,8vw,6.6rem);

    line-height: 1;

    font-weight: 400;

    color: var(--healing-gold);
}


/* FEATURE BODY */

.wsf-healing-teaching__body {

    position: relative;

    z-index: 2;

    display: flex;

    flex-direction: column;

    justify-content: center;

    padding:
        65px
        clamp(40px,7vw,90px);
}


.wsf-healing-teaching__label {

    display: block;

    margin-bottom: 20px;

    font-family:
        Arial,
        sans-serif;

    font-size: .64rem;

    letter-spacing: .25em;

    color:
        rgba(195,154,81,.72);
}


.wsf-healing-teaching__body h3 {

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(2.5rem,6vw,5.2rem);

    line-height: .92;

    font-weight: 400;

    color: #f0e4cf;
}


.wsf-healing-teaching__line {

    width: 95px;
    height: 1px;

    margin:
        30px
        0
        25px;

    background:
        rgba(195,154,81,.54);
}


.wsf-healing-teaching__body p {

    max-width: 560px;

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(1rem,2vw,1.15rem);

    line-height: 1.75;

    font-style: italic;

    color:
        rgba(238,227,207,.65);
}


.wsf-healing-teaching__enter {

    display: flex;

    align-items: center;
    justify-content: space-between;

    max-width: 560px;

    margin-top: 40px;

    padding-top: 18px;

    border-top:
        1px solid
        rgba(195,154,81,.15);

    font-family:
        Arial,
        sans-serif;

    font-size: .66rem;

    font-weight: 700;

    letter-spacing: .18em;

    color: var(--healing-gold);
}


.wsf-healing-teaching__enter b {

    font-size: 1.3rem;

    font-weight: 400;

    transition:
        transform .25s ease;
}


.wsf-healing-teaching:hover
.wsf-healing-teaching__enter b {

    transform:
        translateX(6px);
}


/* =========================================================
   MORE TEACHINGS
   ========================================================= */

.wsf-healing-library {

    position: relative;

    padding:
        72px
        0
        85px;

    border-top:
        1px solid
        rgba(195,154,81,.12);

    background:
        linear-gradient(
            180deg,
            rgba(195,154,81,.025),
            transparent
        );
}


.wsf-healing-library__header {

    max-width: 700px;

    margin:
        0
        auto
        42px;

    padding:
        0
        24px;

    text-align: center;
}


.wsf-healing-library__eyebrow {

    display: block;

    margin-bottom: 13px;

    font-family:
        Arial,
        sans-serif;

    font-size: .62rem;

    letter-spacing: .28em;

    color: var(--healing-gold);
}


.wsf-healing-library__header h2 {

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(2.2rem,5vw,3.8rem);

    font-weight: 400;

    color: var(--healing-cream);
}


.wsf-healing-library__rule {

    display: flex;

    align-items: center;

    width: 200px;

    margin:
        20px
        auto;

    gap: 11px;
}


.wsf-healing-library__rule span {

    flex: 1;

    height: 1px;

    background:
        rgba(195,154,81,.28);
}


.wsf-healing-library__rule i {

    color: var(--healing-gold);

    font-size: .4rem;

    font-style: normal;
}


.wsf-healing-library__header p {

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 1rem;

    font-style: italic;

    color:
        rgba(238,227,207,.48);
}


/* =========================================================
   HORIZONTAL CAROUSEL
   ========================================================= */

.wsf-healing-carousel {

    width: 100%;

    overflow: hidden;
}


.wsf-healing-track {

    display: flex;

    gap: 20px;

    overflow-x: auto;

    scroll-snap-type: x mandatory;

    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;

    padding:
        0
        max(24px,calc((100vw - 1100px) / 2))
        16px;
}


.wsf-healing-track::-webkit-scrollbar {

    display: none;
}


/* =========================================================
   SMALL TEACHING CARDS
   ========================================================= */

.wsf-healing-small-card {

    position: relative;

    flex:
        0
        0
        min(520px,72vw);

    min-height: 310px;

    display: grid;

    grid-template-columns:
        105px
        minmax(0,1fr);

    overflow: hidden;

    scroll-snap-align: start;

    color: var(--healing-cream);

    text-decoration: none;

    border:
        1px solid
        rgba(195,154,81,.34);

    background:
        radial-gradient(
            circle at 85% 8%,
            rgba(195,154,81,.10),
            transparent 34%
        ),
        repeating-linear-gradient(
            115deg,
            rgba(255,255,255,.008) 0 2px,
            rgba(0,0,0,.012) 2px 4px,
            transparent 4px 9px
        ),
        linear-gradient(
            145deg,
            #251d13,
            #12100c 62%,
            #0b0a08
        );

    box-shadow:
        0 18px 45px
        rgba(0,0,0,.30);

    transition:
        transform .25s ease,
        border-color .25s ease;
}


a.wsf-healing-small-card:hover {

    transform:
        translateY(-4px);

    border-color:
        rgba(215,176,102,.62);
}


.wsf-healing-small-card::after {

    content: "";

    position: absolute;

    inset: 10px;

    border:
        1px solid
        rgba(195,154,81,.08);

    pointer-events: none;
}


.wsf-healing-small-card__number {

    position: relative;

    z-index: 2;

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    background:
        linear-gradient(
            180deg,
            rgba(61,46,25,.78),
            rgba(24,19,13,.92)
        );

    border-right:
        1px solid
        rgba(195,154,81,.20);
}


.wsf-healing-small-card__number span {

    margin-bottom: 8px;

    font-family:
        Arial,
        sans-serif;

    font-size: .52rem;

    letter-spacing: .22em;

    color:
        rgba(215,176,102,.62);
}


.wsf-healing-small-card__number strong {

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 3.4rem;

    line-height: 1;

    font-weight: 400;

    color: var(--healing-gold);
}


.wsf-healing-small-card__content {

    position: relative;

    z-index: 2;

    display: flex;

    flex-direction: column;

    justify-content: center;

    padding:
        34px
        34px;
}


.wsf-healing-small-card__label {

    display: block;

    margin-bottom: 13px;

    font-family:
        Arial,
        sans-serif;

    font-size: .56rem;

    letter-spacing: .23em;

    color:
        rgba(195,154,81,.68);
}


.wsf-healing-small-card h3 {

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(1.8rem,3.6vw,2.8rem);

    line-height: .98;

    font-weight: 400;

    color: #f0e4cf;
}


.wsf-healing-small-card p {

    margin:
        19px
        0
        0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: .95rem;

    line-height: 1.55;

    font-style: italic;

    color:
        rgba(238,227,207,.56);
}


.wsf-healing-small-card__enter {

    display: inline-block;

    margin-top: 27px;

    font-family:
        Arial,
        sans-serif;

    font-size: .58rem;

    font-weight: 700;

    letter-spacing: .18em;

    color: var(--healing-gold);
}


/* =========================================================
   COMING SOON CARD
   ========================================================= */

.wsf-healing-small-card--coming {

    opacity: .72;
}


.wsf-healing-coming {

    display: inline-block;

    align-self: flex-start;

    margin-top: 25px;

    padding:
        8px
        11px;

    border:
        1px solid
        rgba(195,154,81,.28);

    font-family:
        Arial,
        sans-serif;

    font-size: .54rem;

    letter-spacing: .20em;

    color:
        rgba(215,176,102,.72);
}


/* =========================================================
   SWIPE INDICATOR
   ========================================================= */

.wsf-healing-swipe {

    display: flex;

    align-items: center;

    width:
        min(1100px,calc(100% - 48px));

    margin:
        8px
        auto
        0;

    gap: 12px;

    color:
        rgba(195,154,81,.54);
}


.wsf-healing-swipe__line {

    flex: 1;

    max-width: 75px;

    height: 1px;

    background:
        rgba(195,154,81,.23);
}


.wsf-healing-swipe__text {

    font-family:
        Arial,
        sans-serif;

    font-size: .52rem;

    letter-spacing: .19em;
}


.wsf-healing-swipe__arrow {

    font-size: 1rem;

    color: var(--healing-gold);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 820px) {

    .wsf-healing-hero {

        min-height: 530px;
    }


    .wsf-healing-teaching {

        grid-template-columns:
            150px
            minmax(0,1fr);

        min-height: 430px;
    }


    .wsf-healing-teaching__body {

        padding:
            55px
            42px;
    }


    .wsf-healing-small-card {

        flex-basis: 58vw;
    }

}


/* =========================================================
   PHONE
   ========================================================= */

@media (max-width: 600px) {

    .wsf-healing-hero {

        min-height: auto;

        padding:
            55px
            20px
            65px;
    }


    .wsf-healing-back {

        margin-bottom: 42px;
    }


    .wsf-healing-slogan {

        font-size: 1.08rem;

        line-height: 1.7;
    }


    .wsf-healing-start {

        width:
            calc(100% - 20px);

        padding:
            68px
            0
            72px;
    }


    .wsf-healing-start__header {

        margin-bottom: 32px;

        padding:
            0
            15px;
    }


    .wsf-healing-teaching {

        grid-template-columns: 1fr;

        min-height: auto;
    }


    .wsf-healing-teaching__number {

        min-height: 135px;

        flex-direction: row;

        gap: 15px;

        border-right: 0;

        border-bottom:
            1px solid
            rgba(195,154,81,.25);
    }


    .wsf-healing-teaching__number::before {

        display: none;
    }


    .wsf-healing-teaching__number span {

        margin: 0;
    }


    .wsf-healing-teaching__number strong {

        font-size: 4.2rem;
    }


    .wsf-healing-teaching__body {

        padding:
            48px
            27px
            44px;
    }


    .wsf-healing-teaching__body h3 {

        font-size:
            clamp(2.45rem,11vw,3.7rem);
    }


    .wsf-healing-teaching__enter {

        margin-top: 32px;
    }


    .wsf-healing-library {

        padding:
            60px
            0
            68px;
    }


    .wsf-healing-library__header {

        margin-bottom: 32px;
    }


    .wsf-healing-track {

        gap: 13px;

        padding:
            0
            12vw
            14px
            10px;
    }


    .wsf-healing-small-card {

        flex:
            0
            0
            84vw;

        min-height: 300px;

        grid-template-columns:
            84px
            minmax(0,1fr);
    }


    .wsf-healing-small-card__number strong {

        font-size: 2.8rem;
    }


    .wsf-healing-small-card__content {

        padding:
            28px
            23px;
    }


    .wsf-healing-small-card h3 {

        font-size:
            clamp(1.8rem,8vw,2.6rem);
    }


    .wsf-healing-swipe {

        width:
            calc(100% - 28px);

        margin-top: 6px;
    }

}


/* =========================================================
   DESKTOP
   ========================================================= */

@media (min-width: 1100px) {

    .wsf-healing-small-card {

        flex-basis: 500px;
    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .wsf-healing-teaching,
    .wsf-healing-small-card,
    .wsf-healing-teaching__enter b {

        transition: none;
    }

}