.elementor-876 .elementor-element.elementor-element-cf70522{--display:flex;--min-height:60vh;--justify-content:center;--margin-top:-250px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:120px;--padding-bottom:120px;--padding-left:50px;--padding-right:50px;}.elementor-876 .elementor-element.elementor-element-cf70522:not(.elementor-motion-effects-element-type-background), .elementor-876 .elementor-element.elementor-element-cf70522 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#131109;}.elementor-876 .elementor-element.elementor-element-49df819{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:180px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--z-index:999;}.elementor-876 .elementor-element.elementor-element-49df819.e-con{--align-self:center;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-876 .elementor-element.elementor-element-8b77786.elementor-element{--align-self:center;}.elementor-876 .elementor-element.elementor-element-8b77786{z-index:999;}.elementor-876 .elementor-element.elementor-element-8b77786 .elementor-heading-title{font-family:"Cormorant", Sans-serif;font-size:43.2px;font-weight:600;color:#ECE4D2;}.elementor-876 .elementor-element.elementor-element-8b870cc{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-876 .elementor-element.elementor-element-f3fbd87 .elementor-button{background-color:#61CE7000;font-family:"Inter", Sans-serif;font-size:12.48px;font-weight:500;fill:#181206;color:#181206;border-radius:0px 0px 0px 0px;}.elementor-876 .elementor-element.elementor-element-f3fbd87{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-876 .elementor-element.elementor-element-c70a7c9 .elementor-button{background-color:#61CE7000;font-family:"Inter", Sans-serif;font-size:12.48px;font-weight:500;fill:#181206;color:#181206;border-radius:0px 0px 0px 0px;}.elementor-876 .elementor-element.elementor-element-c70a7c9{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-876 .elementor-element.elementor-element-341af8e{--display:flex;--min-height:70vh;border-style:solid;--border-style:solid;border-width:0px 0px 1px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:1px;--border-left-width:0px;border-color:#8A6E36;--border-color:#8A6E36;--padding-top:120px;--padding-bottom:120px;--padding-left:60px;--padding-right:60px;}.elementor-876 .elementor-element.elementor-element-341af8e:not(.elementor-motion-effects-element-type-background), .elementor-876 .elementor-element.elementor-element-341af8e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0B0A08;}.elementor-876 .elementor-element.elementor-element-d490c1c{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-876 .elementor-element.elementor-element-07b6304{--display:flex;}.elementor-876 .elementor-element.elementor-element-9f26b5f .elementor-heading-title{font-family:"Inter", Sans-serif;font-size:11.52px;font-weight:600;text-transform:uppercase;letter-spacing:0.32em;color:#C9A24A;}.elementor-876 .elementor-element.elementor-element-b14511f .elementor-heading-title{font-family:"Cormorant", Sans-serif;font-size:43.2px;font-weight:600;line-height:1.6em;color:#ECE4D2;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-876 .elementor-element.elementor-element-11cc6d1{width:var( --container-widget-width, 84.397% );max-width:84.397%;--container-widget-width:84.397%;--container-widget-flex-grow:0;font-family:"Inter", Sans-serif;font-size:16px;font-weight:400;color:#948C7B;}.elementor-876 .elementor-element.elementor-element-11cc6d1.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-876 .elementor-element.elementor-element-11cc6d1 p{margin-block-end:9px;}.elementor-876 .elementor-element.elementor-element-ef340ec{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-876 .elementor-element.elementor-element-ef8ca2e .elementor-button{background-color:#61CE7000;}.elementor-876 .elementor-element.elementor-element-fc56cd2 .elementor-button{background-color:#61CE7000;}.elementor-876 .elementor-element.elementor-element-0086323{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-876 .elementor-element.elementor-element-9a7b65a{--display:flex;}.elementor-876 .elementor-element.elementor-element-f610815{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-876 .elementor-element.elementor-element-d40a563{--display:flex;border-style:solid;--border-style:solid;border-width:0px 0px 1px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:1px;--border-left-width:0px;border-color:#C9A24A52;--border-color:#C9A24A52;--padding-top:120px;--padding-bottom:120px;--padding-left:0px;--padding-right:0px;}.elementor-876 .elementor-element.elementor-element-d40a563:not(.elementor-motion-effects-element-type-background), .elementor-876 .elementor-element.elementor-element-d40a563 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0B0A08;}.elementor-876 .elementor-element.elementor-element-aa89bb3{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-876 .elementor-element.elementor-element-f8bfa13{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;text-align:center;}.elementor-876 .elementor-element.elementor-element-f8bfa13.elementor-element{--align-self:center;}.elementor-876 .elementor-element.elementor-element-f8bfa13 .elementor-heading-title{font-family:"Inter", Sans-serif;font-size:11.52px;font-weight:600;text-transform:uppercase;letter-spacing:0.32em;color:#C9A24A;}.elementor-876 .elementor-element.elementor-element-b139f5e{width:var( --container-widget-width, 50% );max-width:50%;--container-widget-width:50%;--container-widget-flex-grow:0;text-align:center;}.elementor-876 .elementor-element.elementor-element-b139f5e.elementor-element{--align-self:center;}.elementor-876 .elementor-element.elementor-element-b139f5e .elementor-heading-title{font-family:"Cormorant", Sans-serif;font-size:43.2px;font-weight:600;color:#ECE4D2;}.elementor-876 .elementor-element.elementor-element-1a0da0a{width:var( --container-widget-width, 42% );max-width:42%;--container-widget-width:42%;--container-widget-flex-grow:0;text-align:center;font-family:"Inter", Sans-serif;font-size:16px;font-weight:400;color:#948C7B;}.elementor-876 .elementor-element.elementor-element-1a0da0a p{margin-block-end:9px;}.elementor-876 .elementor-element.elementor-element-43b427c{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-876 .elementor-element.elementor-element-4e56cfa .elementor-button{background-color:#61CE7000;font-family:"Inter", Sans-serif;font-size:12.48px;font-weight:500;fill:#181206;color:#181206;border-radius:0px 0px 0px 0px;}.elementor-876 .elementor-element.elementor-element-4e56cfa{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-876 .elementor-element.elementor-element-8b870cc{--width:42%;}.elementor-876 .elementor-element.elementor-element-43b427c{--width:52%;}}@media(max-width:767px){.elementor-876 .elementor-element.elementor-element-8b77786{text-align:center;}.elementor-876 .elementor-element.elementor-element-341af8e{--padding-top:50px;--padding-bottom:50px;--padding-left:20px;--padding-right:20px;}.elementor-876 .elementor-element.elementor-element-9f26b5f{text-align:center;}.elementor-876 .elementor-element.elementor-element-b14511f{text-align:center;}.elementor-876 .elementor-element.elementor-element-b14511f .elementor-heading-title{font-size:31px;}.elementor-876 .elementor-element.elementor-element-11cc6d1{--container-widget-width:856px;--container-widget-flex-grow:0;width:var( --container-widget-width, 856px );max-width:856px;text-align:center;}.elementor-876 .elementor-element.elementor-element-ef340ec{--justify-content:center;}.elementor-876 .elementor-element.elementor-element-b139f5e{--container-widget-width:481px;--container-widget-flex-grow:0;width:var( --container-widget-width, 481px );max-width:481px;}.elementor-876 .elementor-element.elementor-element-1a0da0a{--container-widget-width:297px;--container-widget-flex-grow:0;width:var( --container-widget-width, 297px );max-width:297px;}}/* Start custom CSS for container, class: .elementor-element-cf70522 *//* =========================================================
   JERICHO OVERTROWN PUBLISHING
   TESTIMONIALS HERO — FINAL
   ELEMENTOR MAIN CONTAINER — CUSTOM CSS

   ✓ EXISTING HERO HEIGHT PRESERVED
   ✓ NO HEIGHT FORCE
   ✓ SAME CINEMATIC GOLD AURORA
   ✓ SAME AMBIENT LIGHT
   ✓ TITLE ANIMATION
   ✓ GOLD LINE UNDER TITLE
   ✓ BUTTON UNDER GOLD LINE
   ✓ RESPONSIVE
========================================================= */


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

.elementor-876 .elementor-element.elementor-element-cf70522 {
    position: relative;
    isolation: isolate;
    overflow: hidden;

    /* IMPORTANT:
       Existing Elementor height will remain unchanged.
       No min-height / fixed height added here.
    */

    background:
        radial-gradient(
            650px 420px at 50% 40%,
            rgba(214, 167, 73, 0.13),
            transparent 68%
        ),
        radial-gradient(
            500px 500px at 10% 20%,
            rgba(178, 128, 39, 0.10),
            transparent 70%
        ),
        radial-gradient(
            550px 500px at 90% 80%,
            rgba(207, 157, 57, 0.075),
            transparent 70%
        ),
        #0d0c08;

    background-size:
        120% 120%,
        140% 140%,
        140% 140%,
        100% 100%;

    animation:
        joTestimonialBackground
        18s ease-in-out
        infinite alternate;

    border-bottom:
        1px solid rgba(201,157,64,.28);
}


/* =========================================================
   MOVING GOLDEN AURORA
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522::before {
    content: "";

    position: absolute;

    width: 75%;
    height: 180%;

    left: -25%;
    top: -45%;

    background:
        linear-gradient(
            105deg,
            transparent 20%,
            rgba(225,181,91,.025) 35%,
            rgba(225,181,91,.16) 48%,
            rgba(255,219,133,.07) 53%,
            rgba(225,181,91,.025) 60%,
            transparent 75%
        );

    filter: blur(28px);

    transform: rotate(-12deg);

    animation:
        joTestimonialAurora
        10s
        cubic-bezier(.45,.05,.55,.95)
        infinite alternate;

    pointer-events: none;

    z-index: 0;
}


/* =========================================================
   AMBIENT LIGHT / DEPTH
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522::after {
    content: "";

    position: absolute;

    width: 520px;
    height: 520px;

    left: 50%;
    top: 45%;

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

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(224,180,84,.12) 0%,
            rgba(224,180,84,.055) 28%,
            rgba(224,180,84,.015) 50%,
            transparent 72%
        );

    filter: blur(20px);

    animation:
        joTestimonialAmbient
        7s
        ease-in-out
        infinite;

    pointer-events: none;

    z-index: 1;
}


/* =========================================================
   ELEMENTOR INNER CONTENT
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522 > .e-con-inner {
    position: relative;
    z-index: 5;
}


/* =========================================================
   PREMIUM LIGHT VIGNETTE
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522 > .e-con-inner::before {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.28),
            transparent 25%,
            transparent 75%,
            rgba(0,0,0,.28)
        );

    pointer-events: none;

    z-index: -1;
}


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

.elementor-876 .elementor-element.elementor-element-cf70522 .elementor-widget-heading {
    position: relative;

    z-index: 10;

    opacity: 0;

    animation:
        joTestimonialTitle
        1.2s
        cubic-bezier(.16,1,.3,1)
        .15s
        forwards;
}


/* =========================================================
   TITLE
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522 .elementor-heading-title {
    position: relative;

    text-shadow:
        0 2px 20px rgba(0,0,0,.45),
        0 0 35px rgba(211,165,72,.06);

    transition:
        text-shadow .5s ease,
        transform .5s ease;
}


/* =========================================================
   TITLE HOVER
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522
.elementor-widget-heading:hover
.elementor-heading-title {

    text-shadow:
        0 3px 25px rgba(0,0,0,.55),
        0 0 45px rgba(211,165,72,.13);

    transform:
        translateY(-2px);
}


/* =========================================================
   GOLD ACCENT LINE
   TITLE KE NEECHE
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522
.elementor-widget-heading::after {

    content: "";

    display: block;

    width: 0;
    height: 2px;

    margin:
        20px auto 0;

    background:
        linear-gradient(
            90deg,
            transparent,
            #cda446,
            #f0ce7a,
            #cda446,
            transparent
        );

    box-shadow:
        0 0 12px rgba(205,164,70,.35);

    animation:
        joTestimonialGoldLine
        1.2s
        cubic-bezier(.16,1,.3,1)
        1s
        forwards;
}


/* =========================================================
   BUTTON WIDGET
   GOLD LINE KE BAAD BUTTON
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522
.elementor-widget-button {

    position: relative;

    z-index: 10;

    opacity: 0;

    animation:
        joTestimonialButton
        1s
        cubic-bezier(.16,1,.3,1)
        .65s
        forwards;
}


/* =========================================================
   BUTTON
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522
.elementor-button {

    position: relative;

    overflow: hidden;

    isolation: isolate;

    transition:
        transform .4s cubic-bezier(.16,1,.3,1),
        box-shadow .4s ease,
        background-color .4s ease;

    box-shadow:
        0 8px 25px rgba(0,0,0,.28);
}


/* =========================================================
   BUTTON SHINE
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522
.elementor-button::before {

    content: "";

    position: absolute;

    width: 45%;
    height: 200%;

    top: -50%;
    left: -90%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.32),
            transparent
        );

    transform:
        rotate(18deg);

    transition:
        left .7s cubic-bezier(.16,1,.3,1);

    z-index: -1;
}


/* =========================================================
   BUTTON HOVER
========================================================= */

.elementor-876 .elementor-element.elementor-element-cf70522
.elementor-button:hover {

    transform:
        translateY(-5px)
        scale(1.025);

    box-shadow:
        0 15px 35px rgba(0,0,0,.42),
        0 0 30px rgba(210,166,73,.16);
}


.elementor-876 .elementor-element.elementor-element-cf70522
.elementor-button:hover::before {
    left: 145%;
}


/* =========================================================
   BACKGROUND ANIMATION
========================================================= */

@keyframes joTestimonialBackground {

    0% {
        background-position:
            45% 40%,
            5% 15%,
            95% 85%,
            center;
    }

    50% {
        background-position:
            55% 55%,
            18% 28%,
            82% 70%,
            center;
    }

    100% {
        background-position:
            50% 35%,
            30% 10%,
            70% 90%,
            center;
    }
}


/* =========================================================
   AURORA ANIMATION
========================================================= */

@keyframes joTestimonialAurora {

    0% {
        transform:
            translateX(-15%)
            rotate(-12deg)
            scale(.95);

        opacity: .35;
    }

    50% {
        opacity: .85;
    }

    100% {
        transform:
            translateX(95%)
            rotate(-12deg)
            scale(1.08);

        opacity: .40;
    }
}


/* =========================================================
   AMBIENT LIGHT ANIMATION
========================================================= */

@keyframes joTestimonialAmbient {

    0% {
        transform:
            translate(-50%,-50%)
            scale(.72);

        opacity: .45;
    }

    50% {
        transform:
            translate(-50%,-50%)
            scale(1.12);

        opacity: 1;
    }

    100% {
        transform:
            translate(-50%,-50%)
            scale(.82);

        opacity: .55;
    }
}


/* =========================================================
   TITLE ENTRANCE
========================================================= */

@keyframes joTestimonialTitle {

    0% {
        opacity: 0;

        transform:
            translateY(38px)
            scale(.96);

        filter:
            blur(8px);
    }

    100% {
        opacity: 1;

        transform:
            translateY(0)
            scale(1);

        filter:
            blur(0);
    }
}


/* =========================================================
   GOLD LINE ANIMATION
========================================================= */

@keyframes joTestimonialGoldLine {

    0% {
        width: 0;
    }

    100% {
        width: 55px;
    }
}


/* =========================================================
   BUTTON ENTRANCE
========================================================= */

@keyframes joTestimonialButton {

    0% {
        opacity: 0;

        transform:
            translateY(25px)
            scale(.94);
    }

    100% {
        opacity: 1;

        transform:
            translateY(0)
            scale(1);
    }
}


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

@media (max-width:1024px) {

    .elementor-876 .elementor-element.elementor-element-cf70522::after {
        width: 400px;
        height: 400px;
    }
}


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

@media (max-width:767px) {

    /*
       IMPORTANT:
       No height/min-height added here.
       Elementor ki existing hero height preserved rahegi.
    */

    .elementor-876 .elementor-element.elementor-element-cf70522 {

        background-size:
            180% 180%,
            190% 190%,
            190% 190%,
            100% 100%;
    }


    .elementor-876 .elementor-element.elementor-element-cf70522::before {

        width: 120%;

        left: -45%;

        filter:
            blur(24px);
    }


    .elementor-876 .elementor-element.elementor-element-cf70522::after {

        width: 300px;
        height: 300px;
    }


    .elementor-876 .elementor-element.elementor-element-cf70522
    .elementor-button:hover {

        transform:
            translateY(-3px)
            scale(1.01);
    }
}


/* =========================================================
   ACCESSIBILITY
========================================================= */

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

    .elementor-876 .elementor-element.elementor-element-cf70522,
    .elementor-876 .elementor-element.elementor-element-cf70522::before,
    .elementor-876 .elementor-element.elementor-element-cf70522::after,
    .elementor-876 .elementor-element.elementor-element-cf70522 .elementor-widget-heading,
    .elementor-876 .elementor-element.elementor-element-cf70522 .elementor-widget-button,
    .elementor-876 .elementor-element.elementor-element-cf70522 .elementor-widget-heading::after {

        animation:
            none !important;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-ef340ec *//* PREMIUM JERICHO BUTTON */

.elementor-876 .elementor-element.elementor-element-ef340ec .elementor-button {
    position: relative;
    overflow: hidden;
    isolation: isolate;

    background: linear-gradient(
        135deg,
        #e7c579 0%,
        #c9a24a 50%,
        #b88a35 100%
    );

    color: #131109;
    border: 1px solid rgba(240,206,122,.55);
    border-radius: 4px;

    padding: 15px 30px;

    box-shadow:
        0 8px 25px rgba(0,0,0,.28);

    transition:
        transform .4s cubic-bezier(.16,1,.3,1),
        box-shadow .4s ease,
        background .4s ease;
}

.elementor-876 .elementor-element.elementor-element-ef340ec .elementor-button::before {
    content: "";
    position: absolute;
    width: 45%;
    height: 220%;
    top: -60%;
    left: -100%;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.38),
        transparent
    );

    transform: rotate(18deg);
    transition: left .75s cubic-bezier(.16,1,.3,1);
    z-index: -1;
}

.elementor-876 .elementor-element.elementor-element-ef340ec .elementor-button:hover {
    transform: translateY(-5px) scale(1.025);

    background: linear-gradient(
        135deg,
        #f0ce7a 0%,
        #d9b35e 50%,
        #c9a24a 100%
    );

    color: #0d0c08;

    box-shadow:
        0 15px 35px rgba(0,0,0,.42),
        0 0 30px rgba(210,166,73,.18);
}

.elementor-876 .elementor-element.elementor-element-ef340ec .elementor-button:hover::before {
    left: 145%;
}

@media (max-width:767px) {
    .elementor-876 .elementor-element.elementor-element-ef340ec .elementor-button {
        padding: 13px 24px;
    }

    .elementor-876 .elementor-element.elementor-element-ef340ec .elementor-button:hover {
        transform: translateY(-3px) scale(1.01);
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-341af8e *//* ============================================================
   JERICHO PUBLISHING
   TESTIMONY ARCH — CINEMATIC GOLD EDITION
   Mouse Glow + Depth + Animated Gold Edge
============================================================ */

.arch-frame {
    --mouse-x: 50%;
    --mouse-y: 50%;

    position: relative;
    width: 100%;
    max-width: 620px;
    min-height: 520px;
    margin: 0 auto;

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

    overflow: hidden;
    box-sizing: border-box;

    isolation: isolate;

    background:
        radial-gradient(
            circle 260px at var(--mouse-x) var(--mouse-y),
            rgba(201,162,74,.17),
            rgba(201,162,74,.055) 38%,
            transparent 72%
        ),
        radial-gradient(
            ellipse at 50% 20%,
            rgba(201,162,74,.09),
            transparent 58%
        ),
        linear-gradient(
            145deg,
            #18150d 0%,
            #0d0c08 45%,
            #070705 100%
        );

    border-radius: 340px 340px 0 0;

    box-shadow:
        inset 0 0 80px rgba(201,162,74,.035),
        0 0 0 1px rgba(201,162,74,.10),
        0 30px 80px rgba(0,0,0,.48);

    transition:
        box-shadow .6s ease,
        transform .6s ease;
}


/* ============================================================
   OUTER ARCH
============================================================ */

.arch-frame::before {
    content: "";

    position: absolute;
    inset: 0;

    left: 6%;
    right: 6%;
    top: 0;
    bottom: -1px;

    border-radius: 330px 330px 0 0;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.025),
            transparent 32%,
            rgba(201,162,74,.025)
        );

    border: 1px solid rgba(201,162,74,.68);
    border-bottom: none;

    box-sizing: border-box;

    z-index: 1;

    box-shadow:
        0 0 7px rgba(201,162,74,.28),
        0 0 22px rgba(201,162,74,.14),
        inset 0 0 20px rgba(201,162,74,.035);

    pointer-events: none;
}


/* ============================================================
   INNER ARCH
============================================================ */

.arch-frame::after {
    content: "";

    position: absolute;

    left: 11%;
    right: 11%;
    top: 4.5%;
    bottom: 0;

    border-radius: 300px 300px 0 0;

    border: 1px solid rgba(201,162,74,.40);
    border-bottom: none;

    box-sizing: border-box;

    z-index: 2;

    box-shadow:
        0 0 8px rgba(201,162,74,.22),
        0 0 30px rgba(201,162,74,.08),
        inset 0 0 22px rgba(201,162,74,.025);

    pointer-events: none;
}


/* ============================================================
   ADD THIS ELEMENT INSIDE .arch-frame
   <span class="arch-mouse-glow"></span>
============================================================ */

.arch-mouse-glow {
    position: absolute;

    width: 340px;
    height: 340px;

    left: var(--mouse-x);
    top: var(--mouse-y);

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

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(221,183,94,.18) 0%,
            rgba(201,162,74,.10) 22%,
            rgba(201,162,74,.045) 42%,
            transparent 72%
        );

    filter: blur(18px);

    opacity: .85;

    z-index: 3;

    pointer-events: none;

    transition:
        left .08s linear,
        top .08s linear,
        opacity .4s ease;

    mix-blend-mode: screen;
}


/* ============================================================
   SECONDARY MOUSE LIGHT
============================================================ */

.arch-frame .arch-mouse-glow::after {
    content: "";

    position: absolute;

    inset: 30%;

    border-radius: 50%;

    background: rgba(232,201,125,.22);

    filter: blur(22px);

    animation: archCorePulse 3.5s ease-in-out infinite;
}

@keyframes archCorePulse {

    0%,
    100% {
        opacity: .35;
        transform: scale(.82);
    }

    50% {
        opacity: .85;
        transform: scale(1.18);
    }
}


/* ============================================================
   QUOTE CONTENT
============================================================ */

.arch-quote {
    position: relative;

    z-index: 6;

    width: 100%;
    max-width: 455px;

    padding: 0 28px 62px;

    box-sizing: border-box;

    text-align: center;
}


/* ============================================================
   DECORATIVE TOP LIGHT
============================================================ */

.arch-quote::before {
    content: "";

    position: absolute;

    top: -35px;
    left: 50%;

    width: 90px;
    height: 1px;

    transform: translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent,
            #C9A24A,
            transparent
        );

    box-shadow:
        0 0 8px rgba(201,162,74,.65),
        0 0 20px rgba(201,162,74,.25);

    opacity: .7;
}


/* ============================================================
   QUOTE MARK
============================================================ */

.arch-quote p {
    position: relative;

    margin: 0 0 25px 0 !important;

    font-family: "Cormorant Garamond", serif !important;

    font-style: italic !important;

    font-size: 25px !important;

    font-weight: 500 !important;

    line-height: 1.45 !important;

    letter-spacing: .005em !important;

    color: #EEE7D8 !important;

    text-shadow:
        0 0 1px rgba(255,255,255,.2),
        0 0 18px rgba(201,162,74,.07);

    transition:
        transform .5s ease,
        text-shadow .5s ease;
}


/* Large elegant quote symbol */

.arch-quote p::before {
    content: "“";

    display: block;

    height: 30px;

    margin-bottom: 4px;

    font-family: "Cormorant Garamond", serif;

    font-size: 68px;

    font-style: normal;

    line-height: .8;

    color: #C9A24A;

    text-shadow:
        0 0 8px rgba(201,162,74,.55),
        0 0 28px rgba(201,162,74,.20);

    opacity: .9;
}


/* ============================================================
   AUTHOR
============================================================ */

.arch-quote span {
    position: relative;

    display: inline-flex;

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

    gap: 10px;

    margin: 0 !important;

    font-family: "Inter", sans-serif !important;

    font-size: 10px !important;

    font-weight: 600 !important;

    line-height: 1.4 !important;

    letter-spacing: .19em !important;

    text-transform: uppercase !important;

    color: #C9A24A !important;

    text-shadow:
        0 0 12px rgba(201,162,74,.22);
}


/* Left gold line */

.arch-quote span::before {
    content: "";

    width: 30px;
    height: 1px;

    flex: 0 0 30px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #C9A24A
        );

    box-shadow:
        0 0 7px rgba(201,162,74,.45);
}


/* Right gold line */

.arch-quote span::after {
    content: "";

    width: 30px;
    height: 1px;

    flex: 0 0 30px;

    background:
        linear-gradient(
            90deg,
            #C9A24A,
            transparent
        );

    box-shadow:
        0 0 7px rgba(201,162,74,.45);
}


/* ============================================================
   HOVER — CINEMATIC LIGHT
============================================================ */

.arch-frame:hover {

    box-shadow:
        inset 0 0 100px rgba(201,162,74,.045),
        0 0 0 1px rgba(201,162,74,.20),
        0 0 35px rgba(201,162,74,.12),
        0 35px 90px rgba(0,0,0,.58);
}


.arch-frame:hover .arch-mouse-glow {
    opacity: 1;
}


.arch-frame:hover .arch-quote p {

    transform: translateY(-4px);

    text-shadow:
        0 0 2px rgba(255,255,255,.25),
        0 0 22px rgba(201,162,74,.14);
}


/* ============================================================
   GOLD EDGE SHIMMER
============================================================ */

.arch-frame {
    background-size:
        auto,
        auto,
        200% 200%;

    animation: archBackgroundMove 12s ease-in-out infinite;
}

@keyframes archBackgroundMove {

    0% {
        background-position:
            var(--mouse-x) var(--mouse-y),
            50% 20%,
            0% 50%;
    }

    50% {
        background-position:
            var(--mouse-x) var(--mouse-y),
            50% 20%,
            100% 50%;
    }

    100% {
        background-position:
            var(--mouse-x) var(--mouse-y),
            50% 20%,
            0% 50%;
    }
}


/* ============================================================
   SUBTLE ARCH BREATHING
============================================================ */

.arch-frame::before {
    animation: archBorderBreath 5s ease-in-out infinite;
}

@keyframes archBorderBreath {

    0%,
    100% {
        box-shadow:
            0 0 7px rgba(201,162,74,.28),
            0 0 22px rgba(201,162,74,.14),
            inset 0 0 20px rgba(201,162,74,.035);
    }

    50% {
        box-shadow:
            0 0 10px rgba(201,162,74,.42),
            0 0 34px rgba(201,162,74,.20),
            inset 0 0 28px rgba(201,162,74,.055);
    }
}


/* ============================================================
   SVG OFF
============================================================ */

.arch-svg {
    display: none !important;
}


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

@media (max-width: 1024px) {

    .arch-frame {
        min-height: 470px;
    }

    .arch-quote {
        max-width: 420px;
        padding-bottom: 52px;
    }

    .arch-quote p {
        font-size: 23px !important;
    }

    .arch-mouse-glow {
        width: 290px;
        height: 290px;
    }
}


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

@media (max-width: 760px) {

    .arch-frame {
        min-height: 430px;

        border-radius: 240px 240px 0 0;
    }

    .arch-frame::before {
        left: 4%;
        right: 4%;
        border-radius: 250px 250px 0 0;
    }

    .arch-frame::after {
        left: 9%;
        right: 9%;
        border-radius: 220px 220px 0 0;
    }

    .arch-quote {
        max-width: 370px;
        padding: 0 22px 44px;
    }

    .arch-quote p {
        font-size: 21px !important;
        line-height: 1.42 !important;
    }

    .arch-quote p::before {
        font-size: 58px;
    }

    .arch-mouse-glow {
        width: 250px;
        height: 250px;
    }
}


/* ============================================================
   SMALL MOBILE
============================================================ */

@media (max-width: 480px) {

    .arch-frame {
        min-height: 390px;

        border-radius: 210px 210px 0 0;
    }

    .arch-frame::before {
        left: 3%;
        right: 3%;
        border-radius: 220px 220px 0 0;
    }

    .arch-frame::after {
        left: 8%;
        right: 8%;
        top: 5%;
        border-radius: 195px 195px 0 0;
    }

    .arch-quote {
        padding:
            0 18px 38px;
    }

    .arch-quote p {
        font-size: 19px !important;
        line-height: 1.43 !important;
    }

    .arch-quote p::before {
        font-size: 52px;
    }

    .arch-quote span {
        font-size: 8.5px !important;
        letter-spacing: .15em !important;
    }

    .arch-quote span::before,
    .arch-quote span::after {
        width: 20px;
        flex-basis: 20px;
    }

    .arch-mouse-glow {
        width: 210px;
        height: 210px;
        filter: blur(20px);
    }
}


/* ============================================================
   TOUCH DEVICES
============================================================ */

@media (hover: none) {

    .arch-frame {
        animation: none;
    }

    .arch-frame .arch-mouse-glow {
        left: 50%;
        top: 45%;
        opacity: .45;
    }

    .arch-frame:hover .arch-quote p {
        transform: none;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-43b427c *//* =========================================================
   PREMIUM BUTTON SYSTEM
========================================================= */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    font-family: 'Inter', sans-serif;
    font-size: 0.78rem;
    line-height: 1;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 600;

    min-height: 48px;
    padding: 13px 26px;

    border-radius: 2px;
    border: 1px solid #C9A24A;

    color: #15110b !important;

    background: linear-gradient(
        180deg,
        #E7C579,
        #C9A24A
    );

    transition:
        color .3s var(--ease),
        background .3s var(--ease),
        border-color .3s var(--ease),
        transform .3s var(--ease),
        box-shadow .3s var(--ease);

    white-space: nowrap;
    cursor: pointer;

    text-decoration: none !important;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
}


/* =========================================================
   BUTTON HOVER
========================================================= */

.btn:hover {
    color: #15110b !important;

    background: linear-gradient(
        180deg,
        #E7C579,
        #C9A24A
    );

    border-color: #E0C477;

    transform: translateY(-2px);

    box-shadow:
        0 10px 25px rgba(91, 63, 28, 0.18);
}


/* =========================================================
   BUTTON ACTIVE
========================================================= */

.btn:active {
    transform: translateY(0);

    box-shadow:
        0 4px 12px rgba(91, 63, 28, 0.12);
}


/* =========================================================
   GHOST BUTTON
========================================================= */

.btn-ghost {
    background: transparent !important;
    color: #C9A24A52 !important;
    border: 1px solid #C9A24A52 !important;

    box-shadow: none;
    text-decoration: none !important;

    transition:
        color .3s var(--ease),
        border-color .3s var(--ease),
        background .3s var(--ease),
        transform .3s var(--ease),
        box-shadow .3s var(--ease);
}


/* =========================================================
   GHOST HOVER
========================================================= */

.btn-ghost:hover {
    background: transparent !important;
    color: #ECE4D2 !important;
    border-color: #C9A24A !important;

    transform: translateY(-2px);

    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.16);
}


/* =========================================================
   GHOST ACTIVE
========================================================= */

.btn-ghost:active {
    background: transparent !important;
    color: #ECE4D2 !important;

    transform: translateY(0);

    box-shadow:
        0 4px 12px rgba(0, 0, 0, 0.10);
}


/* =========================================================
   FOCUS
========================================================= */

.btn:focus,
.btn:focus-visible,
.btn-ghost:focus,
.btn-ghost:focus-visible {
    outline: none !important;
    box-shadow: none;
}


/* =========================================================
   ICON
========================================================= */

.btn svg,
.btn i {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;

    color: currentColor;

    transition:
        color .3s var(--ease),
        transform .3s var(--ease);
}


/* =========================================================
   NORMAL BUTTON ICON HOVER
========================================================= */

.btn:not(.btn-ghost):hover svg,
.btn:not(.btn-ghost):hover i {
    color: #C9A24A !important;
    transform: translateX(3px);
}


/* =========================================================
   GHOST BUTTON ICON HOVER
========================================================= */

.btn-ghost:hover svg,
.btn-ghost:hover i {
    color: #C9A24A !important;
    transform: translateX(3px);
}


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

@media (max-width: 767px) {
    .btn-ghost {
        padding: 12px 22px;
    }
}/* End custom CSS */