/* =========================================================
   ELAH.IO / HYPNOPOP BRIDGE
   /elah_fm/
========================================================= */

.hypnopop-page {
    --hp-bg: #07060a;
    --hp-bg-soft: #0d0a12;
    --hp-panel: rgba(255, 255, 255, 0.025);
    --hp-border: rgba(255, 255, 255, 0.075);
    --hp-border-bright: rgba(224, 111, 255, 0.22);
    --hp-text: #f4eef6;
    --hp-muted: #9a8fa0;
    --hp-muted-dark: #6d6472;
    --hp-violet: #c14cff;
    --hp-magenta: #f14bd6;
    --hp-blue: #50c8ff;
    --hp-lavender: #caa9dc;
    --hp-shell: 1240px;

    background: var(--hp-bg);
    color: var(--hp-text);
    overflow-x: hidden;
}


.hypnopop-page main {
    overflow: hidden;
}


.hypnopop-shell {
    width: min(
        calc(100% - 48px),
        var(--hp-shell)
    );

    margin-inline: auto;
}


.hypnopop-eyebrow {
    margin: 0 0 18px;

    color: #b687ca;

    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.19em;
    line-height: 1.4;

    text-transform: uppercase;
}


.hypnopop-page h1,
.hypnopop-page h2,
.hypnopop-page h3,
.hypnopop-page p {
    text-wrap: pretty;
}


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

.hypnopop-hero {
    position: relative;

    padding:
        clamp(80px, 8vw, 130px)
        0
        0;

    background:
        radial-gradient(
            circle at 78% 35%,
            rgba(109, 39, 143, 0.15),
            transparent 28%
        ),
        radial-gradient(
            circle at 25% 10%,
            rgba(76, 40, 108, 0.10),
            transparent 30%
        ),
        #07060a;

    border-bottom:
        1px solid
        rgba(255, 255, 255, 0.045);
}


.hypnopop-ambient {
    position: absolute;

    border-radius: 50%;

    filter: blur(80px);

    pointer-events: none;
}


.hypnopop-ambient-one {
    width: 440px;
    height: 440px;

    top: 120px;
    right: 7%;

    background:
        rgba(194, 60, 255, 0.08);
}


.hypnopop-ambient-two {
    width: 300px;
    height: 300px;

    left: 8%;
    bottom: 100px;

    background:
        rgba(59, 154, 255, 0.045);
}


.hypnopop-hero-grid {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(0, 0.92fr)
        minmax(390px, 0.8fr);

    align-items: center;

    gap:
        clamp(40px, 7vw, 110px);

    min-height:
        min(760px, 80vh);
}


.hypnopop-hero-copy {
    padding-bottom: 70px;
}


.hypnopop-hero h1 {
    max-width: 760px;

    margin: 0;

    color: #f4eef6;

    font-size:
        clamp(
            56px,
            6.9vw,
            103px
        );

    font-weight: 430;

    line-height: 0.94;

    letter-spacing: -0.062em;
}


.hypnopop-hero h1 span {
    display: block;

    margin-top: 10px;

    background:
        linear-gradient(
            90deg,
            #f4eef6 0%,
            #d9b5e8 42%,
            #d969ef 100%
        );

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}


.hypnopop-hero-lead {
    max-width: 650px;

    margin:
        34px
        0
        0;

    color: #aaa0ae;

    font-size:
        clamp(
            18px,
            1.65vw,
            23px
        );

    line-height: 1.64;
}


.hypnopop-actions {
    display: flex;
    flex-wrap: wrap;

    gap: 12px;

    margin-top: 38px;
}


.hypnopop-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 54px;

    padding:
        0
        25px;

    border-radius: 12px;

    font-size: 14px;
    font-weight: 500;

    text-decoration: none;

    transition:
        background 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}


.hypnopop-button-primary {
    border:
        1px solid
        rgba(220, 102, 255, 0.34);

    background:
        linear-gradient(
            135deg,
            rgba(141, 56, 171, 0.24),
            rgba(90, 46, 129, 0.13)
        );

    color: #f5eef8;

    box-shadow:
        0 12px 35px
        rgba(128, 45, 167, 0.12);
}


.hypnopop-button-primary span {
    margin-left: 18px;

    color: #d673f1;
}


.hypnopop-button-primary:hover {
    border-color:
        rgba(232, 137, 255, 0.55);

    background:
        linear-gradient(
            135deg,
            rgba(160, 69, 193, 0.32),
            rgba(101, 53, 143, 0.18)
        );

    transform:
        translateY(-2px);
}


.hypnopop-button-secondary {
    border:
        1px solid
        rgba(255, 255, 255, 0.08);

    background:
        rgba(255, 255, 255, 0.022);

    color: #aaa0ae;
}


.hypnopop-button-secondary:hover {
    border-color:
        rgba(255, 255, 255, 0.15);

    background:
        rgba(255, 255, 255, 0.04);

    color: #ded4e1;

    transform:
        translateY(-2px);
}


.hypnopop-microcopy {
    margin:
        25px
        0
        0;

    color: #625a66;

    font-size: 12px;
    letter-spacing: 0.025em;
}


.hypnopop-hero-visual {
    position: relative;

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

    min-height: 600px;
}


.hypnopop-logo-aura {
    position: absolute;

    width: 82%;
    aspect-ratio: 1;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(213, 76, 255, 0.15) 0%,
            rgba(101, 55, 165, 0.08) 35%,
            transparent 70%
        );

    filter: blur(22px);

    animation:
        hypnopopAura 7s
        ease-in-out
        infinite alternate;
}


.hypnopop-main-logo {
    position: relative;
    z-index: 2;

    display: block;

    width:
        min(
            100%,
            580px
        );

    height: auto;

    filter:
        drop-shadow(
            0 30px 55px
            rgba(0, 0, 0, 0.55)
        )
        drop-shadow(
            0 0 26px
            rgba(207, 60, 255, 0.10)
        );
}


@keyframes hypnopopAura {
    from {
        transform: scale(0.94);
        opacity: 0.7;
    }

    to {
        transform: scale(1.05);
        opacity: 1;
    }
}


.hypnopop-mantra {
    position: relative;
    z-index: 3;

    border-top:
        1px solid
        rgba(255, 255, 255, 0.045);

    background:
        rgba(255, 255, 255, 0.012);
}


.hypnopop-mantra-inner {
    min-height: 74px;

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

    gap: 18px;
}


.hypnopop-mantra span {
    color: #857a89;

    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.2em;
}


.hypnopop-mantra i {
    width: 3px;
    height: 3px;

    flex: 0 0 3px;

    border-radius: 50%;

    background:
        rgba(211, 106, 239, 0.52);
}


/* =========================================================
   SHARED SECTIONS
========================================================= */

.hypnopop-section {
    padding:
        clamp(90px, 10vw, 155px)
        0;

    border-bottom:
        1px solid
        rgba(255, 255, 255, 0.045);
}


.hypnopop-page h2 {
    margin: 0;

    color: #eee7f1;

    font-size:
        clamp(
            46px,
            5.2vw,
            74px
        );

    font-weight: 420;

    line-height: 1;

    letter-spacing: -0.052em;
}


.hypnopop-page h2 span {
    color: #b883c9;
}


.hypnopop-editorial-grid,
.hypnopop-practitioner-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 0.93fr)
        minmax(300px, 0.72fr);

    gap:
        clamp(50px, 9vw, 140px);
}


.hypnopop-copy {
    color: #8f8593;

    font-size: 16px;
    line-height: 1.78;
}


.hypnopop-copy p {
    margin:
        0
        0
        22px;
}


.hypnopop-copy-lead {
    color: #d1c7d5;

    font-size: 20px;
    line-height: 1.62;
}


/* =========================================================
   INTRO
========================================================= */

.hypnopop-intro {
    background:
        linear-gradient(
            180deg,
            #08070c,
            #09070d
        );
}


/* =========================================================
   PROCESS
========================================================= */

.hypnopop-process-section {
    position: relative;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(117, 60, 143, 0.065),
            transparent 34%
        ),
        #07060a;
}


.hypnopop-section-heading {
    max-width: 790px;

    margin-bottom: 60px;
}


.hypnopop-section-heading > p:last-child {
    max-width: 570px;

    margin:
        25px
        0
        0;

    color: #7d737f;

    font-size: 16px;
    line-height: 1.65;
}


.hypnopop-process-grid {
    display: grid;

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

    border-top:
        1px solid
        var(--hp-border);

    border-bottom:
        1px solid
        var(--hp-border);
}


.hypnopop-process-card {
    min-height: 390px;

    padding:
        30px
        28px
        34px;

    border-right:
        1px solid
        var(--hp-border);

    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.018),
            transparent
        );
}


.hypnopop-process-card:last-child {
    border-right: 0;
}


.hypnopop-step {
    display: block;

    margin-bottom: 44px;

    color: #625968;

    font-size: 10px;
    letter-spacing: 0.17em;
}


.hypnopop-symbol {
    width: 68px;
    height: 68px;

    position: relative;

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

    margin-bottom: 35px;

    border:
        1px solid
        rgba(211, 94, 241, 0.20);

    border-radius: 50%;

    color: #d871ee;

    box-shadow:
        inset
        0 0 24px
        rgba(201, 78, 242, 0.045);
}


.hypnopop-symbol-orbit {
    width: 37px;
    height: 19px;

    position: absolute;

    border:
        1px solid
        rgba(82, 196, 255, 0.45);

    border-radius: 50%;

    transform: rotate(-18deg);
}


.hypnopop-symbol-core {
    position: relative;

    font-size: 13px;
    font-weight: 600;
}


.hypnopop-symbol-lines {
    font-size: 34px;
    font-weight: 300;
}


.hypnopop-symbol-wave {
    font-size: 12px;
    letter-spacing: 2px;

    transform: scaleY(1.8);
}


.hypnopop-symbol-heart {
    font-size: 37px;
    font-weight: 200;
}


.hypnopop-process-card h3 {
    margin:
        0
        0
        16px;

    color: #e4dce8;

    font-size: 21px;
    font-weight: 500;
    letter-spacing: -0.025em;
}


.hypnopop-process-card p {
    margin: 0;

    color: #7c737f;

    font-size: 14px;
    line-height: 1.72;
}


/* =========================================================
   ORIGIN
========================================================= */

.hypnopop-origin-section {
    background:
        #0a080d;
}


.hypnopop-origin-grid {
    display: grid;

    grid-template-columns:
        120px
        minmax(0, 880px);

    justify-content: center;

    gap: 55px;
}


.hypnopop-origin-number {
    padding-top: 7px;

    color: #4b444e;

    font-size: 13px;
    letter-spacing: 0.12em;
}


.hypnopop-origin-copy h2 {
    max-width: 760px;
}


.hypnopop-origin-question {
    max-width: 790px;

    margin:
        42px
        0
        0;

    color: #c7b9cd;

    font-size:
        clamp(
            24px,
            3vw,
            38px
        );

    line-height: 1.35;
    letter-spacing: -0.025em;
}


.hypnopop-origin-text {
    display: grid;

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

    gap: 32px;

    margin-top: 60px;

    padding-top: 32px;

    border-top:
        1px solid
        var(--hp-border);
}


.hypnopop-origin-text p {
    margin: 0;

    color: #7c727f;

    font-size: 14px;
    line-height: 1.72;
}


/* =========================================================
   EXPERIENCE
========================================================= */

.hypnopop-experience-section {
    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(83, 55, 105, 0.05),
            transparent 42%
        ),
        #07060a;
}


.hypnopop-section-heading-centered {
    margin:
        0
        auto
        72px;

    text-align: center;
}


.hypnopop-experience-grid {
    display: grid;

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

    gap: 1px;

    background:
        rgba(255, 255, 255, 0.055);
}


.hypnopop-experience-grid article {
    min-height: 270px;

    padding:
        34px;

    background:
        #09080d;
}


.hypnopop-experience-grid article > span {
    color: #5f5663;

    font-size: 10px;
    letter-spacing: 0.14em;
}


.hypnopop-experience-grid strong {
    display: block;

    margin-top: 55px;

    color: #e2d9e5;

    font-size: 21px;
    font-weight: 500;
}


.hypnopop-experience-grid p {
    margin:
        15px
        0
        0;

    color: #79707c;

    font-size: 14px;
    line-height: 1.7;
}


/* =========================================================
   PRACTITIONER
========================================================= */

.hypnopop-practitioner-section {
    background:
        #0a080d;
}


.hypnopop-text-link {
    display: inline-flex;

    margin-top: 10px;

    color: #bd87d0;

    font-size: 14px;
    font-weight: 500;

    text-decoration: none;
}


.hypnopop-text-link span {
    margin-left: 12px;
}


.hypnopop-text-link:hover {
    color: #dda9ed;
}


/* =========================================================
   FINAL CTA
========================================================= */

.hypnopop-final {
    position: relative;

    padding:
        clamp(100px, 12vw, 175px)
        0;

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(187, 63, 232, 0.10),
            transparent 30%
        ),
        #07060a;

    text-align: center;

    overflow: hidden;
}


.hypnopop-final-glow {
    position: absolute;

    width: 480px;
    height: 480px;

    top: 50%;
    left: 50%;

    border-radius: 50%;

    transform:
        translate(-50%, -50%);

    background:
        rgba(151, 48, 197, 0.07);

    filter: blur(100px);
}


.hypnopop-final-inner {
    position: relative;
    z-index: 2;

    max-width: 850px;
}


.hypnopop-final-logo {
    display: block;

    width:
        min(
            260px,
            52vw
        );

    height: auto;

    margin:
        0
        auto
        45px;
}


.hypnopop-final h2 span {
    display: block;
}


.hypnopop-final-inner > p:not(.hypnopop-eyebrow) {
    max-width: 570px;

    margin:
        28px
        auto
        0;

    color: #8f8492;

    font-size: 17px;
    line-height: 1.7;
}


.hypnopop-final-button {
    margin-top: 36px;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1050px) {

    .hypnopop-hero-grid {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(330px, 0.72fr);

        gap: 35px;
    }


    .hypnopop-hero-visual {
        min-height: 480px;
    }


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


    .hypnopop-process-card:nth-child(2) {
        border-right: 0;
    }


    .hypnopop-process-card:nth-child(-n+2) {
        border-bottom:
            1px solid
            var(--hp-border);
    }

}


@media (max-width: 780px) {

    .hypnopop-shell {
        width:
            min(
                calc(100% - 32px),
                var(--hp-shell)
            );
    }


    .hypnopop-hero {
        padding-top: 68px;
    }


    .hypnopop-hero-grid {
        grid-template-columns: 1fr;

        min-height: auto;

        gap: 5px;
    }


    .hypnopop-hero-copy {
        padding-bottom: 0;
    }


    .hypnopop-hero h1 {
        font-size:
            clamp(
                50px,
                15vw,
                78px
            );
    }


    .hypnopop-hero-lead {
        font-size: 17px;
    }


    .hypnopop-actions {
        flex-direction: column;
    }


    .hypnopop-button {
        width: 100%;
    }


    .hypnopop-hero-visual {
        min-height: auto;

        padding:
            40px
            0
            45px;
    }


    .hypnopop-main-logo {
        width:
            min(
                100%,
                520px
            );
    }


    .hypnopop-mantra {
        overflow-x: auto;

        scrollbar-width: none;
    }


    .hypnopop-mantra::-webkit-scrollbar {
        display: none;
    }


    .hypnopop-mantra-inner {
        width: max-content;

        min-width: 100%;

        padding:
            0
            20px;

        gap: 22px;
    }


    .hypnopop-editorial-grid,
    .hypnopop-practitioner-grid {
        grid-template-columns: 1fr;

        gap: 42px;
    }


    .hypnopop-process-grid {
        grid-template-columns: 1fr;
    }


    .hypnopop-process-card {
        min-height: auto;

        border-right: 0;

        border-bottom:
            1px solid
            var(--hp-border);
    }


    .hypnopop-process-card:nth-child(2) {
        border-bottom:
            1px solid
            var(--hp-border);
    }


    .hypnopop-process-card:last-child {
        border-bottom: 0;
    }


    .hypnopop-origin-grid {
        grid-template-columns: 1fr;

        gap: 20px;
    }


    .hypnopop-origin-number {
        padding-top: 0;
    }


    .hypnopop-origin-text {
        grid-template-columns: 1fr;

        gap: 22px;
    }


    .hypnopop-experience-grid {
        grid-template-columns: 1fr;
    }


    .hypnopop-experience-grid article {
        min-height: auto;
    }


    .hypnopop-experience-grid strong {
        margin-top: 35px;
    }

}


@media (max-width: 500px) {

    .hypnopop-shell {
        width:
            min(
                calc(100% - 26px),
                var(--hp-shell)
            );
    }


    .hypnopop-section {
        padding:
            86px
            0;
    }


    .hypnopop-hero {
        padding-top: 48px;
    }


    .hypnopop-hero h1 {
        font-size: 49px;
    }


    .hypnopop-hero-lead {
        margin-top: 26px;

        font-size: 16px;
    }


    .hypnopop-microcopy {
        font-size: 11px;
        line-height: 1.55;
    }


    .hypnopop-page h2 {
        font-size: 42px;
    }


    .hypnopop-copy-lead {
        font-size: 18px;
    }


    .hypnopop-process-card {
        padding:
            28px
            20px
            32px;
    }


    .hypnopop-origin-question {
        font-size: 24px;
    }


    .hypnopop-final {
        padding:
            95px
            0;
    }

}


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

    .hypnopop-logo-aura {
        animation: none;
    }


    .hypnopop-button {
        transition: none;
    }

}
/* =========================================
   TYPE SCALE BOOST
   Add this at the bottom of elah-fm.css
========================================= */

.hypnopop-eyebrow {
    font-size: 13px;
    letter-spacing: 0.22em;
}

.hypnopop-hero-lead {
    font-size: clamp(20px, 1.8vw, 26px);
    line-height: 1.7;
}

.hypnopop-microcopy {
    font-size: 13px;
    line-height: 1.7;
}

.hypnopop-copy {
    font-size: 18px;
    line-height: 1.9;
}

.hypnopop-copy-lead {
    font-size: 24px;
    line-height: 1.75;
}

.hypnopop-section-heading > p:last-child {
    font-size: 18px;
    line-height: 1.8;
    color: #8f8593;
}

.hypnopop-process-card h3 {
    font-size: 30px;
    line-height: 1.15;
    margin-bottom: 18px;
}

.hypnopop-process-card p {
    font-size: 17px;
    line-height: 1.85;
    color: #8d8391;
}

.hypnopop-step {
    font-size: 12px;
    letter-spacing: 0.2em;
}

.hypnopop-origin-question {
    font-size: clamp(28px, 3.2vw, 42px);
    line-height: 1.42;
}

.hypnopop-origin-text p {
    font-size: 17px;
    line-height: 1.9;
    color: #8c8290;
}

.hypnopop-experience-grid strong {
    font-size: 26px;
    line-height: 1.2;
}

.hypnopop-experience-grid p {
    font-size: 17px;
    line-height: 1.85;
    color: #8d8391;
}

.hypnopop-text-link {
    font-size: 16px;
}

.hypnopop-final-inner > p:not(.hypnopop-eyebrow) {
    font-size: 18px;
    line-height: 1.8;
}

.hypnopop-mantra span {
    font-size: 11px;
    letter-spacing: 0.22em;
}


/* =========================================
   MOBILE TUNING
========================================= */

@media (max-width: 780px) {

    .hypnopop-copy {
        font-size: 17px;
        line-height: 1.85;
    }

    .hypnopop-copy-lead {
        font-size: 21px;
        line-height: 1.75;
    }

    .hypnopop-section-heading > p:last-child {
        font-size: 17px;
    }

    .hypnopop-process-card h3 {
        font-size: 26px;
    }

    .hypnopop-process-card p,
    .hypnopop-origin-text p,
    .hypnopop-experience-grid p,
    .hypnopop-final-inner > p:not(.hypnopop-eyebrow) {
        font-size: 16px;
        line-height: 1.8;
    }

    .hypnopop-experience-grid strong {
        font-size: 23px;
    }

    .hypnopop-origin-question {
        font-size: 28px;
    }
}

@media (max-width: 500px) {

    .hypnopop-eyebrow {
        font-size: 12px;
    }

    .hypnopop-hero-lead {
        font-size: 18px;
    }

    .hypnopop-copy {
        font-size: 16px;
    }

    .hypnopop-copy-lead {
        font-size: 19px;
    }

    .hypnopop-process-card h3 {
        font-size: 24px;
    }

    .hypnopop-process-card p,
    .hypnopop-origin-text p,
    .hypnopop-experience-grid p {
        font-size: 15.5px;
    }

    .hypnopop-experience-grid strong {
        font-size: 21px;
    }
}
/* Hide process step numbers */
.hypnopop-step {
    display: none !important;
}
@media (max-width: 768px) {
    .hypnopop-eyebrow {
        display: block;
        margin-top: 18px;
        margin-bottom: 18px;
        line-height: 1.5;
    }
}