/* Crown & Compass Global — About Us page styles
   Extracted from the current global stylesheet in original cascade order.
   Keep the current global style.css unchanged during the first live test. */

/* =========================================================
   ABOUT PAGE — HERO
   ========================================================= */

.about-page{
    background:#ffffff;
}


/* HERO */

.about-hero{
    position:relative;

    min-height:610px;

    display:flex;
    align-items:center;

    overflow:hidden;

    padding:
        120px
        32px
        95px;

    background:
        radial-gradient(
            circle at 78% 42%,
            rgba(224,199,127,.14),
            transparent 34%
        ),
        linear-gradient(
            120deg,
            #1D2952 0%,
            #343F68 55%,
            #293861 100%
        );
}


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

.about-hero-inner{
    position:relative;
    z-index:3;

    display:grid;
    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(340px, .85fr);

    gap:70px;

    width:min(1280px, 100%);
    margin:0 auto;

    align-items:center;
}


/* =========================================================
   LEFT COPY
   ========================================================= */

.about-hero-copy{
    max-width:760px;
}


.about-hero .hero-breadcrumb{
    margin-bottom:22px;
}


.about-hero-eyebrow{
    display:block;

    margin-bottom:14px;

    color:#E0C77F;

    font-family:"Assistant", sans-serif;
    font-size:11px;
    font-weight:700;

    letter-spacing:.19em;
    text-transform:uppercase;
}


.about-hero h1{
    margin:
        0
        0
        24px;

    color:#F4F1E8;

    font-family:"Lora", serif;

    font-size:clamp(48px, 5.5vw, 72px);
    font-weight:600;

    line-height:1.02;
}


.about-hero-lede{
    max-width:700px;

    margin:
        0
        0
        34px;

    color:
        rgba(244,241,232,.84);

    font-family:"Assistant", sans-serif;

    font-size:18px;
    line-height:1.75;
}


/* CTA */

.about-hero-cta{
    display:inline-flex;
    align-items:center;
    gap:10px;

    padding:
        14px
        24px;

    color:#1D2952;

    background:
        linear-gradient(
            110deg,
            #B6810D 0%,
            #D4A017 48%,
            #F0DEAE 100%
        );

    border-radius:4px;

    font-family:"Assistant", sans-serif;

    font-size:13px;
    font-weight:700;

    letter-spacing:.06em;

    text-transform:uppercase;

    text-decoration:none;

    box-shadow:
        0 8px 20px
        rgba(212,160,23,.18);

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


.about-hero-cta:hover{
    transform:translateY(-3px);

    box-shadow:
        0 14px 28px
        rgba(212,160,23,.28);
}


.about-hero-seal-mark{
    color:#E0C77F;

    font-family:"Lora", serif;

    font-size:48px;
    font-weight:600;

    letter-spacing:.08em;
}

/* =========================================================
   ABOUT HERO — BACKGROUND ART
   ========================================================= */

.about-hero-bg{
    position:absolute;
    inset:0;

    z-index:0;

    overflow:hidden;

    pointer-events:none;
}


.about-hero-bg img{
    width:100%;
    height:100%;

    object-fit:cover;

    object-position:center center;

    display:block;
}

.about-hero{
    position:relative;

    min-height:520px;

    display:flex;
    align-items:center;

    overflow:hidden;

    padding:
        90px
        32px
        65px;

    background:#1D2952;
}
.about-hero-inner{
    position:relative;
    z-index:3;

    width:min(1280px, 100%);
    margin:0 auto;
}

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

@media (max-width:900px){


    .about-hero-inner{
        grid-template-columns:1fr;
        gap:40px;
    }

    .about-hero-brand{
        min-height:300px;
    }

    .about-hero-seal-placeholder{
        width:260px;
        height:260px;
    }


}


@media (max-width:650px){


    .about-hero{
        min-height:auto;

        padding:
            100px
            24px
            72px;
    }

    .about-hero h1{
        font-size:44px;
    }

    .about-hero-lede{
        font-size:16px;
    }

    .about-hero-brand{
        min-height:250px;
    }


}

.about-hero::after{
    content:"";

    position:absolute;
    inset:0;

    z-index:1;

    pointer-events:none;

    background:

        /* LEFT — strong readability fade */
        linear-gradient(
            90deg,
            rgba(8,18,43,.97) 0%,
            rgba(8,18,43,.90) 20%,
            rgba(8,18,43,.60) 39%,
            rgba(8,18,43,.22) 55%,
            rgba(8,18,43,0) 72%
        ),

        /* ALL EDGES — cinematic vignette */
        radial-gradient(
            ellipse at center,
            rgba(8,18,43,0) 38%,
            rgba(8,18,43,.10) 58%,
            rgba(8,18,43,.35) 78%,
            rgba(8,18,43,.85) 100%
        );
}

.about-hero-bg img{
    width:100%;
    height:100%;

    object-fit:cover;
    object-position:center center;

    display:block;

    transform:scale(1.015);

    animation:
        aboutHeroDrift
        10s
        ease-in-out
        infinite alternate;
}

@keyframes aboutHeroDrift{

    0%{
        transform:
            scale(1.015)
            translate3d(0,0,0);
    }

    100%{
        transform:
            scale(1.035)
            translate3d(-8px,-4px,0);
    }

}

.about-hero::before{
    content:"";

    position:absolute;

    z-index:2;

    width:360px;
    height:360px;

    right:23%;
    top:50%;

    transform:
        translateY(-50%)
        scale(.96);

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(240,222,174,.16) 0%,
            rgba(212,160,23,.08) 36%,
            rgba(212,160,23,0) 72%
        );

    pointer-events:none;

    animation:
        aboutCoreGlow
        2s
        ease-in-out
        infinite;
}

@keyframes aboutCoreGlow{

    0%,
    100%{
        opacity:.45;
        transform:
            translateY(-50%)
            scale(.96);
    }

    50%{
        opacity:.85;
        transform:
            translateY(-50%)
            scale(1.05);
    }

}

/* =========================================================
   ABOUT — WHAT WE BELIEVE
   ========================================================= */

.about-belief{
    position:relative;

    padding:
        clamp(100px, 10vw, 165px)
        32px;

    background:#F4F1E8;
    color:#1B1B1F;

    overflow:hidden;
}


/* Subtle architectural line */

.about-belief::before{
    content:"";

    position:absolute;

    top:0;
    left:50%;

    width:min(1280px, calc(100% - 64px));
    height:1px;

    transform:translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(212,160,23,.55),
            transparent
        );
}


.about-belief-inner{
    width:min(1280px, 100%);
    margin:0 auto;

    display:grid;

    grid-template-columns:
        minmax(300px, .85fr)
        minmax(420px, 1.15fr);

    gap:
        clamp(70px, 9vw, 150px);

    align-items:start;
}


/* -----------------------------------------
   LEFT SIDE
   ----------------------------------------- */

.about-section-eyebrow{
    display:block;

    margin-bottom:24px;

    font-family:"Assistant", sans-serif;

    font-size:12px;
    font-weight:700;

    letter-spacing:.22em;
    text-transform:uppercase;

    color:#B8840C;
}


.about-belief-heading h2{
    margin:0;

    max-width:540px;

    font-family:"Lora", serif;

    font-size:
        clamp(42px, 4.4vw, 68px);

    line-height:1.08;
    font-weight:600;

    letter-spacing:-.025em;

    color:#1D2952;
}


.about-belief-heading h2 em{
    display:block;

    margin-top:10px;

    font-weight:400;
    font-style:italic;

    color:#B8840C;
}


/* Small gold architectural detail */

.about-belief-heading::after{
    content:"";

    display:block;

    width:72px;
    height:2px;

    margin-top:38px;

    background:
        linear-gradient(
            90deg,
            #B8840C,
            #E0C77F
        );
}


/* -----------------------------------------
   RIGHT SIDE
   ----------------------------------------- */

.about-belief-content{
    max-width:680px;

    font-family:"Assistant", sans-serif;

    font-size:17px;
    line-height:1.85;

    color:#34363D;
}


.about-belief-content p{
    margin:
        0
        0
        26px;
}


.about-belief-content p:last-child{
    margin-bottom:0;
}


.about-belief-lead{
    font-family:"Lora", serif !important;

    font-size:
        clamp(23px, 2vw, 29px) !important;

    line-height:1.5 !important;

    color:#1D2952 !important;
}


/* The emotional pivot */

.about-belief-statement{
    position:relative;

    margin:
        44px
        0 !important;

    padding:
        24px
        0
        24px
        28px;

    border-left:
        2px solid #D4A017;

    font-family:"Lora", serif !important;

    font-size:
        clamp(25px, 2.2vw, 32px) !important;

    line-height:1.4 !important;

    font-weight:600;

    color:#1D2952 !important;
}


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

@media (max-width:900px){


    .about-belief{
        padding:
            90px
            24px;
    }


    .about-belief-inner{
        grid-template-columns:1fr;

        gap:60px;
    }


    .about-belief-heading h2{
        max-width:650px;
    }


    .about-belief-content{
        max-width:none;
    }


}


@media (max-width:600px){


    .about-belief{
        padding:
            72px
            22px;
    }


    .about-belief-inner{
        gap:48px;
    }


    .about-belief-heading h2{
        font-size:
            clamp(38px, 11vw, 50px);
    }


    .about-belief-content{
        font-size:16px;

        line-height:1.75;
    }


    .about-belief-statement{
        margin:
            36px
            0 !important;

        padding-left:20px;
    }


}

/* ==========================================
   ABOUT — BELIEF CALLOUT EMPHASIS
   ========================================== */

.belief-better{
    display: inline-block;

    font-family: "Lora", serif;
    font-style: italic;
    font-weight: 600;

    background: linear-gradient(
        110deg,
        #8f6507 0%,
        #d4a017 32%,
        #f0deae 55%,
        #d4a017 76%,
        #8f6507 100%
    );

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

    -webkit-text-fill-color: transparent;
    color: transparent;

    background-size: 200% auto;

    animation: beliefGoldShimmer 7s ease-in-out infinite;
}

@keyframes beliefGoldShimmer {
    0%,
    100% {
        background-position: 0% center;
    }

    50% {
        background-position: 100% center;
    }
}

/* ==========================================
   ABOUT — BELIEF COMPASS ART
   ========================================== */

.belief-left{
    position: relative;
    overflow: visible;
}

.belief-compass{
    position: relative;

    width: 430px;
    height: 430px;

    margin-top: 38px;
    margin-left: -85px;

    opacity: 0.42;

    pointer-events: none;
}


/* ORBIT RINGS */

.belief-compass-orbit{
    position: absolute;

    top: 50%;
    left: 50%;

    border: 1px solid rgba(212, 160, 23, 0.38);
    border-radius: 50%;

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

.orbit-one{
    width: 230px;
    height: 230px;
}

.orbit-two{
    width: 310px;
    height: 310px;

    border-color: rgba(212, 160, 23, 0.25);
}

.orbit-three{
    width: 395px;
    height: 395px;

    border-color: rgba(212, 160, 23, 0.15);
}


/* CENTRAL COMPASS */

.belief-compass-star{
    position: absolute;

    width: 145px;
    height: 145px;

    top: 50%;
    left: 50%;

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

    animation: beliefCompassRotate 38s linear infinite;
}

.belief-compass-star::before,
.belief-compass-star::after{
    content: "";

    position: absolute;

    top: 50%;
    left: 50%;

    background: linear-gradient(
        to bottom,
        rgba(212, 160, 23, 0.05),
        rgba(212, 160, 23, 0.65),
        rgba(212, 160, 23, 0.05)
    );

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

.belief-compass-star::before{
    width: 2px;
    height: 145px;
}

.belief-compass-star::after{
    width: 145px;
    height: 2px;
}


/* DIAGONAL POINTS */

.star-north,
.star-east,
.star-south,
.star-west{
    position: absolute;

    top: 50%;
    left: 50%;

    width: 75px;
    height: 1px;

    transform-origin: left center;

    background: linear-gradient(
        90deg,
        rgba(212,160,23,.65),
        rgba(212,160,23,0)
    );
}

.star-north{
    transform: rotate(45deg);
}

.star-east{
    transform: rotate(135deg);
}

.star-south{
    transform: rotate(225deg);
}

.star-west{
    transform: rotate(315deg);
}


/* CENTER */

.belief-compass-center{
    position: absolute;

    top: 50%;
    left: 50%;

    width: 62px;
    height: 62px;

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

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

    border: 1px solid rgba(212,160,23,.6);
    border-radius: 50%;

    background: rgba(244,241,232,.85);

    font-family: "Lora", serif;
    font-size: 15px;
    letter-spacing: .08em;

    color: #b7830c;
}


/* ORBITING GOLD POINTS */

.belief-compass-node{
    position: absolute;

    width: 9px;
    height: 9px;

    border-radius: 50%;

    background: linear-gradient(
        135deg,
        #8f6507,
        #d4a017,
        #f0deae
    );

    box-shadow: 0 0 14px rgba(212,160,23,.28);
}

.node-one{
    top: 14%;
    left: 28%;
}

.node-two{
    top: 54%;
    right: 3%;
}

.node-three{
    bottom: 8%;
    left: 22%;
}


/* SUBTLE ROTATION */

@keyframes beliefCompassRotate {

    from {
        transform:
            translate(-50%, -50%)
            rotate(0deg);
    }

    to {
        transform:
            translate(-50%, -50%)
            rotate(360deg);
    }
}


/* ACCESSIBILITY */

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


    .belief-compass-star,
.belief-better{
        animation: none;
    }


}

.belief-left{
    position:relative;
    min-width:0;
}

/* =========================================================
   ABOUT — HOW WE WORK
   ========================================================= */

.about-how{
    position:relative;

    padding:
        110px
        32px
        120px;

    background:
        linear-gradient(
            180deg,
            #1D2952 0%,
            #27345E 100%
        );

    overflow:hidden;
}


.about-how-inner{
    width:min(1280px, 100%);
    margin:0 auto;
}


/* HEADING */

.about-how-heading{
    max-width:820px;

    margin:
        0
        auto
        80px;

    text-align:center;
}


.about-how-heading .about-section-eyebrow{
    color:#E0C77F;
}


.about-how-heading h2{
    margin:
        18px
        0
        24px;

    color:#F4F1E8;

    font-family:"Lora", serif;

    font-size:
        clamp(40px, 4vw, 60px);

    line-height:1.12;
}


.about-how-heading h2 em{
    display:block;

    margin-top:8px;

    color:#E0C77F;

    font-weight:400;
    font-style:italic;
}


.about-how-heading p{
    margin:0 auto;

    max-width:760px;

    color:
        rgba(244,241,232,.76);

    font-family:"Assistant", sans-serif;

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


/* PATH */

.about-how-path{
    position:relative;

    display:grid;
    grid-template-columns:repeat(5, 1fr);

    gap:30px;
}


.about-how-line{
    position:absolute;

    top:39px;
    left:8%;
    right:8%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(224,199,127,.20) 8%,
            rgba(224,199,127,.48) 25%,
            rgba(212,160,23,.55) 50%,
            rgba(224,199,127,.48) 75%,
            rgba(224,199,127,.20) 92%,
            transparent 100%
        );
}


/* STEP */

.about-how-step{
    position:relative;
    z-index:2;

    text-align:center;

    padding:
        0
        12px;
}


/* GOLD PROCESS NODES */

.about-how-node{
    width:78px;
    height:78px;

    margin:
        0
        auto
        26px;

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

    border-radius:50%;

    /* Radiant Gold → Champagne */
    background:
        linear-gradient(
            135deg,
            #9F7208 0%,
            #D4A017 32%,
            #E0C77F 67%,
            #F0DEAE 100%
        );

    border:
        1px solid
        rgba(240,222,174,.85);

    box-shadow:
        0 0 0 8px rgba(29,41,82,.88),
        0 8px 24px rgba(0,0,0,.12);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        filter .3s ease;

    position:relative;
    overflow:hidden;
}


/* subtle metallic sheen */

.about-how-node::after{
    content:"";

    position:absolute;
    inset:-40%;

    background:
        linear-gradient(
            115deg,
            transparent 35%,
            rgba(255,255,255,.38) 48%,
            transparent 61%
        );

    transform:translateX(-100%) rotate(10deg);

    transition:transform .65s ease;
}


/* NAVY NUMBERS */

.about-how-node span{
    position:relative;
    z-index:2;

    color:#1D2952;

    font-family:"Lora", serif;

    font-size:18px;
    font-weight:700;
}


/* HOVER */

.about-how-step:hover .about-how-node{
    transform:
        translateY(-7px)
        scale(1.05);

    filter:brightness(1.06);

    box-shadow:
        0 0 0 8px rgba(29,41,82,.88),
        0 14px 32px rgba(212,160,23,.28),
        0 0 24px rgba(224,199,127,.14);
}


.about-how-step:hover .about-how-node::after{
    transform:translateX(100%) rotate(10deg);
}


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

@media (max-width:1000px){


    .about-how-path{
        grid-template-columns:1fr;

        gap:38px;

        max-width:760px;

        margin:0 auto;
    }


    .about-how-line{
        top:0;
        bottom:0;

        left:39px;

        right:auto;

        width:1px;
        height:auto;

        background:
            linear-gradient(
                180deg,
                transparent,
                rgba(212,160,23,.50) 8%,
                rgba(224,199,127,.70) 50%,
                rgba(212,160,23,.50) 92%,
                transparent
            );
    }


    .about-how-step{
        display:grid;

        grid-template-columns:
            78px
            1fr;

        column-gap:28px;

        text-align:left;

        padding:0;
    }


    .about-how-node{
        margin:0;

        grid-row:
            1 / span 2;
    }


    .about-how-step h3{
        align-self:end;
    }


}


@media (max-width:600px){


    .about-how{
        padding:
            80px
            22px
            90px;
    }


    .about-how-heading{
        margin-bottom:60px;
    }


    .about-how-heading p{
        font-size:16px;
    }


}

/* =========================================================
   ABOUT US — HOW WE WORK
   FINAL TEXT COLOR OVERRIDE
   ========================================================= */

.about-how{
    background:
        linear-gradient(
            180deg,
            #1D2952 0%,
            #27345E 100%
        ) !important;
}


/* SECTION INTRO */

.about-how-heading .about-section-eyebrow{
    color:#E0C77F !important;
}

.about-how-heading h2{
    color:#F4F1E8 !important;
}

.about-how-heading h2 em{
    color:#E0C77F !important;
}

.about-how-heading p{
    color:rgba(244,241,232,.78) !important;
}


/* STEP HEADINGS */

.about-how-step h3{
    color:#F4F1E8 !important;

    font-family:"Lora", serif !important;
    font-size:25px !important;
    font-weight:600 !important;
}


/* STEP BODY COPY */

.about-how-step p{
    color:rgba(244,241,232,.72) !important;

    font-family:"Assistant", sans-serif !important;
    font-size:15px !important;
    line-height:1.65 !important;
}


/* GOLD NODES */

.about-how-node{
    background:
        linear-gradient(
            135deg,
            #9F7208 0%,
            #D4A017 32%,
            #E0C77F 67%,
            #F0DEAE 100%
        ) !important;

    border:
        1px solid
        rgba(240,222,174,.85) !important;
}


/* NAVY NUMBERS */

.about-how-node span{
    color:#1D2952 !important;
}


/* CONNECTING LINE */

.about-how-line{
    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(224,199,127,.20) 8%,
            rgba(224,199,127,.48) 25%,
            rgba(212,160,23,.55) 50%,
            rgba(224,199,127,.48) 75%,
            rgba(224,199,127,.20) 92%,
            transparent 100%
        ) !important;
}

/* =========================================================
   ABOUT US — BRAND SIGNATURE
   ========================================================= */

.about-signature{
    position:relative;

    background:#F4F1E8;

    padding:
        115px
        32px
        125px;

    overflow:hidden;
}


/* faint top/bottom transition lines */

.about-signature::before,
.about-signature::after{
    content:"";

    position:absolute;

    left:50%;

    width:min(760px, 68%);
    height:1px;

    transform:translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(212,160,23,.30),
            rgba(224,199,127,.65),
            rgba(212,160,23,.30),
            transparent
        );
}

.about-signature::before{
    top:0;
}

.about-signature::after{
    bottom:0;
}


.about-signature-inner{
    width:min(1100px, 100%);

    margin:0 auto;

    display:flex;
    flex-direction:column;

    align-items:center;

    gap:22px;

    text-align:center;
}


/* EACH STATEMENT */

.about-signature-line{
    position:relative;

    color:#1D2952;

    font-family:"Lora", serif;

    font-size:
        clamp(38px, 4.4vw, 64px);

    font-weight:600;

    line-height:1.12;

    letter-spacing:-.02em;

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


/* middle line gets gold italic emphasis */

.about-signature-line:nth-child(2){
    color:#B8840C;

    font-style:italic;
    font-weight:400;
}


/* subtle hover lift */

.about-signature-line:hover{
    transform:translateY(-4px);

    text-shadow:
        0 8px 20px rgba(29,41,82,.08);
}


.about-signature-line:nth-child(2):hover{
    color:#D4A017;

    text-shadow:
        0 0 12px rgba(212,160,23,.18);
}


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

@media (max-width:700px){


    .about-signature{
        padding:
            85px
            22px
            95px;
    }

    .about-signature-inner{
        gap:18px;
    }

    .about-signature-line{
        font-size:
            clamp(32px, 10vw, 46px);
    }


}

/* =========================================================
   ABOUT SIGNATURE — IDLE BACKGROUND MOTION
   ========================================================= */

.about-signature{
    isolation:isolate;
}

.about-signature-inner{
    position:relative;
    z-index:3;
}

.about-signature-motion{
    position:absolute;
    inset:0;

    z-index:1;

    overflow:hidden;
    pointer-events:none;

    opacity:.22;
}


/* LARGE NAVIGATION RINGS */

.signature-ring{
    position:absolute;

    border-radius:50%;

    border:
        1px solid
        rgba(212,160,23,.22);

    animation:
        signatureRingDrift
        18s
        ease-in-out
        infinite alternate;
}

.ring-1{
    width:520px;
    height:520px;

    left:-170px;
    top:-210px;
}

.ring-2{
    width:690px;
    height:690px;

    right:-250px;
    bottom:-370px;

    border-color:
        rgba(29,41,82,.15);

    animation-duration:22s;
}

.ring-3{
    width:360px;
    height:360px;

    right:15%;
    top:-190px;

    border-color:
        rgba(212,160,23,.14);

    animation-duration:15s;
}


/* DRIFT */

@keyframes signatureRingDrift{

    from{
        transform:
            translate3d(0,0,0)
            scale(1);
    }

    to{
        transform:
            translate3d(18px,-10px,0)
            scale(1.035);
    }

}


/* LITTLE GOLD NODES */

.signature-node{
    position:absolute;

    width:8px;
    height:8px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            #F0DEAE 0%,
            #D4A017 55%,
            rgba(212,160,23,0) 100%
        );

    box-shadow:
        0 0 8px rgba(212,160,23,.30),
        0 0 18px rgba(212,160,23,.14);

    animation:
        signatureNodeFloat
        9s
        ease-in-out
        infinite alternate;
}

.node-a{
    left:18%;
    bottom:18%;
}

.node-b{
    right:21%;
    top:23%;

    animation-duration:12s;
    animation-delay:-4s;
}


@keyframes signatureNodeFloat{

    from{
        transform:
            translate3d(0,0,0)
            scale(.8);

        opacity:.45;
    }

    to{
        transform:
            translate3d(22px,-14px,0)
            scale(1.2);

        opacity:1;
    }

}


/* VERY SOFT BREATHING LIGHT */

.signature-glow{
    position:absolute;

    width:560px;
    height:260px;

    left:50%;
    top:50%;

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

    border-radius:50%;

    background:
        radial-gradient(
            ellipse,
            rgba(224,199,127,.14) 0%,
            rgba(212,160,23,.06) 42%,
            rgba(212,160,23,0) 72%
        );

    filter:blur(12px);

    animation:
        signatureGlowPulse
        6s
        ease-in-out
        infinite;
}


@keyframes signatureGlowPulse{

    0%,
    100%{
        opacity:.35;

        transform:
            translate(-50%,-50%)
            scale(.92);
    }

    50%{
        opacity:.75;

        transform:
            translate(-50%,-50%)
            scale(1.08);
    }

}


/* ACCESSIBILITY */

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


    .signature-ring,
.signature-node,
.signature-glow{
        animation:none;
    }


}

/* =========================================================
   ABOUT SIGNATURE — BRIGHTER GOLD + BLUE MOTION
   ========================================================= */

.about-signature-motion{
    position:absolute;
    inset:0;
    z-index:1;
    overflow:hidden;
    pointer-events:none;

    /* brighter overall */
    opacity:.48;
}


/* =========================================================
   NAVIGATION RINGS
   ========================================================= */

.signature-ring{
    position:absolute;
    border-radius:50%;

    animation:
        signatureRingDrift
        18s
        ease-in-out
        infinite alternate;
}


/* GOLD OUTER RING */

.ring-1{
    width:520px;
    height:520px;

    left:-170px;
    top:-210px;

    border:1.5px solid rgba(212,160,23,.48);

    box-shadow:
        0 0 22px rgba(212,160,23,.08),
        inset 0 0 25px rgba(212,160,23,.04);
}


/* BLUE RING */

.ring-2{
    width:690px;
    height:690px;

    right:-250px;
    bottom:-370px;

    border:1.5px solid rgba(52,63,104,.52);

    box-shadow:
        0 0 28px rgba(29,41,82,.12),
        inset 0 0 30px rgba(52,63,104,.08);

    animation-duration:22s;
}


/* GOLD + BLUE INNER RING */

.ring-3{
    width:360px;
    height:360px;

    right:15%;
    top:-190px;

    border:1px solid rgba(212,160,23,.38);

    box-shadow:
        0 0 0 12px rgba(52,63,104,.025),
        0 0 24px rgba(212,160,23,.07);

    animation-duration:15s;
}


@keyframes signatureRingDrift{

    from{
        transform:
            translate3d(0,0,0)
            scale(1);
    }

    to{
        transform:
            translate3d(20px,-12px,0)
            scale(1.04);
    }

}


/* =========================================================
   FLOATING NODES
   ========================================================= */

.signature-node{
    position:absolute;

    width:10px;
    height:10px;

    border-radius:50%;

    animation:
        signatureNodeFloat
        9s
        ease-in-out
        infinite alternate;
}


/* GOLD NODE */

.node-a{
    left:18%;
    bottom:18%;

    background:
        radial-gradient(
            circle,
            #F4E6B7 0%,
            #D4A017 45%,
            rgba(212,160,23,0) 100%
        );

    box-shadow:
        0 0 10px rgba(212,160,23,.60),
        0 0 24px rgba(212,160,23,.30),
        0 0 40px rgba(212,160,23,.12);
}


/* BLUE NODE */

.node-b{
    right:21%;
    top:23%;

    background:
        radial-gradient(
            circle,
            #AAB5E0 0%,
            #343F68 48%,
            rgba(52,63,104,0) 100%
        );

    box-shadow:
        0 0 10px rgba(52,63,104,.70),
        0 0 25px rgba(52,63,104,.35),
        0 0 45px rgba(29,41,82,.18);

    animation-duration:12s;
    animation-delay:-4s;
}


@keyframes signatureNodeFloat{

    from{
        transform:
            translate3d(0,0,0)
            scale(.9);

        opacity:.65;
    }

    to{
        transform:
            translate3d(24px,-16px,0)
            scale(1.3);

        opacity:1;
    }

}


/* =========================================================
   CENTRAL GOLD + BLUE BREATHING GLOW
   ========================================================= */

.signature-glow{
    position:absolute;

    width:680px;
    height:320px;

    left:50%;
    top:50%;

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

    border-radius:50%;

    background:
        radial-gradient(
            ellipse,
            rgba(224,199,127,.25) 0%,
            rgba(212,160,23,.12) 25%,
            rgba(52,63,104,.09) 48%,
            rgba(29,41,82,.045) 62%,
            transparent 76%
        );

    filter:blur(10px);

    animation:
        signatureGlowPulse
        6s
        ease-in-out
        infinite;
}


@keyframes signatureGlowPulse{

    0%,
    100%{
        opacity:.55;

        transform:
            translate(-50%,-50%)
            scale(.94);
    }

    50%{
        opacity:1;

        transform:
            translate(-50%,-50%)
            scale(1.08);
    }

}


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

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


    .signature-ring,
.signature-node,
.signature-glow{
        animation:none;
    }


}

/* =========================================================
   ABOUT US — OUR FOUNDER
   ========================================================= */

.about-founder{
    position:relative;

    padding:
        110px
        32px
        125px;

    background:#FBF9F2;

    overflow:hidden;
}


.about-founder-inner{
    width:min(1120px, 100%);
    margin:0 auto;
    display:block;
}

.about-founder-copy{
    position:relative;

    width:min(850px, 100%);

    margin:
        0
        0
        0
        auto;
}


/* =========================================================
   LEFT — FOUNDER SEAL
   ========================================================= */

.about-founder-visual{
    display:flex;
    justify-content:center;
    align-items:center;
}


.about-founder-seal{
    position:relative;

    display:block;

    width:min(420px, 100%);

    text-decoration:none;

    transition:
        transform .35s ease,
        filter .35s ease;
}


.about-founder-seal img{
    display:block;

    width:100%;
    height:auto;

    transition:
        transform .4s ease,
        filter .4s ease;
}


.about-founder-seal:hover img{
    transform:scale(1.035);

    filter:
        brightness(1.06)
        drop-shadow(0 0 8px rgba(212,160,23,.22))
        drop-shadow(0 10px 24px rgba(29,41,82,.12));
}


/* LinkedIn hover label */

.founder-seal-hover{
    position:absolute;

    left:50%;
    bottom:-18px;

    transform:
        translateX(-50%)
        translateY(8px);

    opacity:0;

    padding:
        9px
        16px;

    white-space:nowrap;

    background:#1D2952;

    color:#F0DEAE;

    font-family:"Assistant", sans-serif;

    font-size:13px;
    font-weight:700;

    letter-spacing:.06em;

    border:
        1px solid
        rgba(212,160,23,.35);

    box-shadow:
        0 8px 20px
        rgba(29,41,82,.14);

    transition:
        opacity .3s ease,
        transform .3s ease;
}


.about-founder-seal:hover .founder-seal-hover{
    opacity:1;

    transform:
        translateX(-50%)
        translateY(0);
}


/* =========================================================
   RIGHT — COPY
   ========================================================= */

.about-founder-copy .about-section-eyebrow{
    margin-bottom:16px;

    color:#B8840C;
}


.about-founder-copy h2{
    margin:0;

    color:#1D2952;

    font-family:"Lora", serif;

    font-size:
        clamp(44px, 4.2vw, 62px);

    line-height:1.08;

    font-weight:600;
}


.about-founder-title{
    margin:
        10px
        0
        0;

    color:#B8840C !important;

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

    font-size:16px !important;

    font-weight:700;

    letter-spacing:.08em;

    text-transform:uppercase;
}


.about-founder-rule{
    width:72px;
    height:2px;

    margin:
        26px
        0
        30px;

    background:
        linear-gradient(
            90deg,
            #8A650F,
            #D4A017,
            #F0DEAE
        );
}


.about-founder-copy > p{
    margin:
        0
        0
        22px;

    color:#34343A !important;

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

    font-size:17px !important;

    line-height:1.75 !important;
}


/* Final principle callout */

.about-founder-principle{
    margin-top:34px !important;

    padding:
        24px
        0
        24px
        28px;

    border-left:
        2px solid
        #D4A017;

    color:#1D2952 !important;
}


.about-founder-principle strong{
    color:#1D2952;

    font-family:"Lora", serif;

    font-size:20px;

    line-height:1.55;

    font-weight:600;
}


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

@media (max-width:900px){


    .about-founder-inner{
        grid-template-columns:1fr;

        gap:65px;
    }


    .about-founder-seal{
        width:min(360px, 82vw);
    }


}


@media (max-width:600px){


    .about-founder{
        padding:
            80px
            22px
            90px;
    }


    .about-founder-copy > p{
        font-size:16px !important;
    }


}

/* =========================================================
   FOUNDER SIGNATURE STAMP
   ========================================================= */

.founder-stamp{
    position:absolute;

    width:250px;

    left:-285px;
    top:105px;

    display:block;

    transform:rotate(-5deg);

    text-decoration:none;

    opacity:.88;

    transition:
        transform .4s ease,
        opacity .4s ease,
        filter .4s ease;
}


.founder-stamp img{
    display:block;

    width:100%;
    height:auto;
}


/* hover */

.founder-stamp:hover{
    opacity:1;

    transform:
        rotate(-2deg)
        scale(1.055);

    filter:
        drop-shadow(
            0 8px 18px
            rgba(29,41,82,.12)
        );
}


/* LinkedIn micro-label */

.founder-stamp-link{
    position:absolute;

    left:50%;
    bottom:-26px;

    transform:
        translateX(-50%)
        translateY(5px);

    white-space:nowrap;

    opacity:0;

    color:#1D2952;

    font-family:"Assistant", sans-serif;

    font-size:12px;
    font-weight:700;

    letter-spacing:.08em;

    text-transform:uppercase;

    transition:
        opacity .3s ease,
        transform .3s ease;
}


.founder-stamp:hover .founder-stamp-link{
    opacity:1;

    transform:
        translateX(-50%)
        translateY(0);
}

.founder-stamp{
    animation:
        founderStampIdle
        7s
        ease-in-out
        infinite;
}

/* =========================================================
   FOUNDER EMBOSSED SIGNATURE STAMP
   ========================================================= */

.founder-stamp{
    display:block !important;
    position:relative !important;

    left:auto !important;
    right:auto !important;
    top:auto !important;

    width:600px;
    height:auto;

    margin-left:auto !important;
    margin-right:auto !important;
    margin-top:0;
    margin-bottom:26px;

    padding:0;

    background:transparent !important;
    box-shadow:none !important;
    border:none !important;
    border-radius:0;

    transform:none !important;
    animation:none !important;
    overflow:visible;
}

.founder-stamp img{
    display:block;
    width:100%;
    height:auto;

    margin:0 auto;

    opacity:1;

    transform:none !important;
    animation:none !important;

    filter:
        drop-shadow(-1px -1px 1px rgba(255,255,255,.9))
        drop-shadow(1.5px 1.5px 1.5px rgba(52,63,104,.18))
        contrast(1.15);
}

/* =========================================================
   HOVER — DEEPEN THE EMBOSS
   ========================================================= */

.founder-stamp:hover{
    opacity:1;

    transform:
        rotate(-3deg)
        scale(1.035);
}


.founder-stamp:hover img{
    opacity:.92;

    filter:
        drop-shadow(-3px -3px 2px rgba(255,255,255,1))
        drop-shadow(3px 3px 3px rgba(29,41,82,.22));
}


/* =========================================================
   LINKEDIN LABEL
   ========================================================= */

.founder-stamp-link{
    position:absolute;

    left:50%;
    bottom:-34px;

    transform:
        translateX(-50%)
        translateY(7px);

    opacity:0;

    white-space:nowrap;

    color:#1D2952;

    font-family:"Assistant", sans-serif;

    font-size:11px;
    font-weight:700;

    letter-spacing:.12em;

    text-transform:uppercase;

    transition:
        opacity .3s ease,
        transform .3s ease;
}


.founder-stamp:hover .founder-stamp-link{
    opacity:1;

    transform:
        translateX(-50%)
        translateY(0);
}

@media (max-width:900px){


    .about-founder-copy{
        width:100%;
        margin:0;
    }

    .founder-stamp{
        position:relative;

        width:min(250px, 70vw);

        left:auto;
        top:auto;

        margin:
            10px
            auto
            55px;

        transform:rotate(-5deg);
    }


}

/* =========================================================
   FOUNDER EMBOSSED STAMP — CENTERED ABOVE NAME
   ========================================================= */

.founder-stamp{
    position:relative;

    display:block;

    width:250px;

    margin:
        0
        auto
        22px;

    padding:10px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.98) 0%,
            rgba(248,248,246,.95) 58%,
            rgba(232,234,238,.55) 78%,
            rgba(244,241,232,0) 100%
        );

    box-shadow:
        0 14px 34px rgba(29,41,82,.05);

    text-decoration:none;

    transform:none !important;
    animation:none !important;
}


.founder-stamp img{
    display:block;

    width:100%;
    height:auto;

    transform:scale(1.28);

    opacity:.95;

    filter:
        drop-shadow(-2px -2px 1px rgba(255,255,255,1))
        drop-shadow(2px 2px 2px rgba(52,63,104,.24));

    animation:none !important;
}


.founder-stamp:hover{
    transform:
        rotate(-1deg)
        scale(1.025);

    box-shadow:
        0 20px 42px rgba(29,41,82,.08);
}

.founder-stamp:hover img{
    opacity:1;

    filter:
        drop-shadow(-3px -3px 2px rgba(255,255,255,1))
        drop-shadow(3px 3px 3px rgba(52,63,104,.30))
        contrast(1.12);
}

.about-founder-heading{
    text-align:center;
}


.about-founder-heading .about-founder-rule{
    margin:
        26px
        auto
        30px;
}

.about-founder-inner{
    width:min(1120px, 100%);
    margin:0 auto;
}

.about-founder-copy{
    position:relative;

    width:min(900px, 100%);

    margin:0 auto;

    text-align:left;
}

.about-founder-heading{
    text-align:center;
}

.about-founder-heading .about-founder-rule{
    margin:
        26px
        auto
        30px;
}

/* =========================================================
   FOUNDER SECTION — STOP ALL IDLE MOTION
   ========================================================= */

.about-founder,
.about-founder-inner,
.about-founder-copy,
.about-founder-heading,
.founder-stamp,
.founder-stamp img,
.about-founder-copy p,
.about-founder-copy h2,
.about-founder-title{
    animation:none !important;
}

.founder-stamp{
    margin-top:0 !important;
}

/* ==========================================
   FOUNDER STAMP — FINAL OVERRIDE
   ========================================== */

.founder-stamp{
    width: 950px !important;
    height: auto !important;
    max-width: none !important;

    margin: 0 auto 20px !important;
    padding: 0 !important;

    display: block !important;

    /* NO HOVER MOVEMENT */
    transform: none !important;
    transition: none !important;
    animation: none !important;
}

.founder-stamp:hover{
    transform: none !important;
}

.founder-stamp img{
    width: 950px !important;
    height: auto !important;
    max-width: none !important;

    display: block !important;
    margin: 0 auto !important;

    transform: none !important;
    transition: none !important;
    animation: none !important;
}

/* Kill any image hover animation too */
.founder-stamp:hover img{
    transform: none !important;
    filter: none !important;
}

.founder-stamp{
    margin: 0 auto -350px !important;
}

.founder-stamp img{
    position: relative !important;
    left: -22px !important;
}

.about-founder-inner{
    transform: translateY(-240px);
}

/* ==========================================
   FOUNDER SECTION — FINAL POSITION / HEIGHT
   ========================================== */

.about-founder-inner{
    transform: translateY(-240px);
}

.about-founder{
    padding-bottom: 0 !important;
    margin-bottom: -200px;
}

/* ==========================================
   FOUNDER STAMP — COMPLETELY STATIC
   ========================================== */

.founder-stamp,
.founder-stamp:hover,
.founder-stamp:focus,
.founder-stamp:active{
    transform: none !important;
    animation: none !important;
    transition: none !important;
    filter: none !important;
}

.founder-stamp img,
.founder-stamp:hover img,
.founder-stamp:focus img,
.founder-stamp:active img{
    transform: none !important;
    animation: none !important;
    transition: none !important;
    filter: none !important;
}


/* KEEP OUR FINAL POSITIONING */

.founder-stamp{
    margin: 0 auto -350px !important;
}

.founder-stamp img{
    position: relative !important;
    left: -22px !important;
}

.about-founder-inner{
    transform: translateY(-240px);
}

/* ==========================================
   FOUNDER CLOSING STATEMENT
   ========================================== */

.founder-closing{
    margin-top: 42px;
    padding-top: 28px;

    text-align: center;

    border-top: 1px solid rgba(212, 160, 23, 0.45);
}


/* SMALL GOLD LABEL */

.founder-closing-label{
    display: block;

    margin-bottom: 16px;

    font-family: "Assistant", sans-serif;
    font-size: 11px;
    font-weight: 700;

    letter-spacing: 0.22em;
    text-transform: uppercase;

    color: #D4A017;
}


/* MAIN CLOSING THOUGHT */

.founder-closing-statement{
    margin: 0 auto;

    font-family: "Lora", serif;
    font-size: clamp(20px, 1.45vw, 26px);
    font-weight: 600;
    line-height: 1.55;

    color: #1D2952;
}


/* EACH THOUGHT GETS ITS OWN LINE */

.founder-closing-statement span{
    display: block;
}


/* GOLD EMPHASIS ON THE FINAL LINE */

.founder-closing-statement span:last-child{
    margin-top: 3px;

    font-style: italic;
    color: #BC8810;
}

.founder-closing-statement{
    margin: 0 auto;

    font-family: "Lora", serif;
    font-size: clamp(21px, 1.5vw, 27px);
    font-weight: 500;
    line-height: 1.65;

    color: #1D2952;
}

.founder-closing-statement span{
    display: block;
}

/* First two statements */
.founder-closing-statement span:nth-child(1),
.founder-closing-statement span:nth-child(2){
    font-family: "Lora", serif;
    font-style: normal;
    font-weight: 500;
}

/* Final founder principle */
.founder-closing-statement span:last-child{
    margin-top: 5px;

    font-family: "Lora", serif;
    font-style: italic;
    font-weight: 500;

    color: #BC8810;
}

/* =========================================================
   ABOUT HERO — MOBILE BALANCED ARTWORK
   ========================================================= */

@media (max-width:650px){


    .about-hero{
        background:#1D2952 !important;
    }

    .about-hero-bg img{
        width:100% !important;
        height:100% !important;

        object-fit:cover !important;
        object-position:72% center !important;

        animation:
            aboutHeroDriftMobile
            10s
            ease-in-out
            infinite alternate !important;
    }


}

@keyframes aboutHeroDriftMobile{

    0%{
        transform:
            scale(1)
            translate3d(0,0,0);
    }

    100%{
        transform:
            scale(1.01)
            translate3d(-2px,-1px,0);
    }

}

/* =========================================================
   ABOUT FOUNDER — MOBILE STAMP POSITION
   ========================================================= */

@media (max-width:650px){


    .founder-stamp{
        width:700px !important;
        max-width:none !important;

        margin-left:50% !important;
        margin-right:0 !important;

        transform:
            translateX(-50%)
            translateY(-95px) !important;
    }

    .founder-stamp img{
        width:700px !important;
        max-width:none !important;

        left:0 !important;

        margin:0 !important;
    }


}

@media (max-width:650px){


    .founder-content{
        transform:translateY(70px) !important;
    }


}

/* =========================================================
   ABOUT FOUNDER — MOBILE MOVE WHOLE SECTION DOWN
   ========================================================= */

@media (max-width:650px){


    .about-founder-inner{
        transform:translateY(-90px) !important;
    }


}

/* =========================================================
   ABOUT FOUNDER — MOBILE
   Preserve perfect position + restore bottom space
   ========================================================= */

@media (max-width:650px){


    .about-founder{
        min-height:auto !important;
        height:auto !important;

        /* compensate for moving inner content downward */
        padding-bottom:135px !important;

        overflow:visible !important;
    }


}