* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

html {
    font-size: 62.5%;
    overflow-x: hidden;
    scroll-behavior: smooth;
}




/* =========================
   NAVBAR
========================= */

#opportunity-finder,
#web-development,
#reviews,
#seo,
#google-profile,
#email-automation,
#social-media,
#tender-lists,
#about,
#contact {
    scroll-margin-top: 8rem;
}

.navbar {
    position: fixed;
    top: 2.4rem;
    left: 50%;
    width: calc(100% - 7rem);
    max-width: 148rem;
    transform: translateX(-50%);
    z-index: 100;
}

.navDropdown {
position: relative;
}

.navDropdownTrigger {
display: flex;
align-items: center;
gap: 0.4rem;
cursor: pointer;
}

.navDropdownTrigger span {
display: inline-block;
transition: transform 0.25s ease;
}

.navDropdown:hover .navDropdownTrigger span {
transform: rotate(180deg);
}

.navDropdownMenu {
position: absolute;
top: calc(100% - 0.1rem);
left: 50%;
width: 19rem;
padding: 0.7rem;
background: #3f454c;
border-radius: 0.8rem;
opacity: 0;
visibility: hidden;
transform: translateX(-50%) translateY(-0.6rem);
transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
z-index: 1000;
}

.navDropdown.navDropdownOpen .navDropdownMenu {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateX(-50%) translateY(0);
}

.navDropdown.navDropdownOpen .navDropdownArrow {
transform: translateY(0.15rem) rotate(225deg);
border-color: #a95738;
}

.navDropdownLink {
display: block;
padding: 0.8rem 1rem;
color: #ffffff;
font-size: 1.8rem;
text-decoration: none;
border-radius: 0.5rem;
white-space: nowrap;
}


.navDropdownLink:hover {
background: #a95738;
color: #ffffff;
}

.navDropdownArrow {
position: relative;
display: inline-block;
width: 0.65rem;
height: 0.65rem;
margin-left: 0.15rem;
border-right: 0.13rem solid currentColor;
border-bottom: 0.13rem solid currentColor;
transform: translateY(-0.15rem) rotate(45deg);
transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s ease;
}

.navDropdown:hover .navDropdownArrow {
transform: translateY(0.15rem) rotate(225deg);
border-color: #a95738;
}

.navbarInner {
    min-height: 8rem;
    padding: 1.2rem 1.5rem 1.2rem 2.6rem;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 4rem;
    border: 1px solid rgba(210, 208, 204, 0.7);
    border-radius: 1.6rem;
    background: #fff;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow:
        0 1rem 3rem rgba(63, 69, 76, 0.08),
        0 0.3rem 1rem rgba(63, 69, 76, 0.04);
}

.navBrand {
display: flex;
align-items: center;
text-decoration: none;
}

.navBrandLogo {
display: block;
width: auto;
height: 5rem;
object-fit: contain;
}

.navLogoMark {
    position: relative;
    width: 4.2rem;
    height: 4.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.navLogoMark::before {
    content: "";
    position: absolute;
    inset: 0.4rem;
    border: 0.3rem solid #a95738;
    transform: rotate(30deg);
    border-radius: 0.25rem;
}

.navLogoMark::after {
    content: "";
    position: absolute;
    width: 1.8rem;
    height: 1.8rem;
    border: 0.25rem solid #a95738;
    transform: rotate(30deg);
    border-radius: 0.2rem;
}

.navLogoMark span {
    position: absolute;
    width: 0.28rem;
    height: 3rem;
    background: #a95738;
}

.navLogoMark span:nth-child(1) {
    transform: rotate(30deg);
}

.navLogoMark span:nth-child(2) {
    transform: rotate(90deg);
}

.navLogoMark span:nth-child(3) {
    transform: rotate(150deg);
}

.navBrandText {
    display: flex;
    flex-direction: column;
    line-height: 1;
}

.navBrandMain {
    font-family: "Anton", sans-serif;
    font-size: 2rem;
    font-weight: 400;
    letter-spacing: 0.12em;
    color: #3f454c;
}

.navBrandSub {
    margin-top: 0.55rem;
    font-family: "Inter", sans-serif;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.25em;
    color: #a95738;
}

.navLinks {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(2.4rem, 3vw, 5.5rem);
}

.navLink {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 1rem 0;
    font-family: "Inter", sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    color: #3f454c;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    transition: color 0.2s ease;
}

.navLink::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0.5rem;
    width: 100%;
    height: 0.15rem;
    background: #a95738;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.25s ease;
}

.navLink:hover {
    color: #a95738;
}

.navLink:hover::after {
    transform: scaleX(1);
    transform-origin: left;
}

.navDropdown span {
    position: relative;
    top: -0.15rem;
    font-size: 1.4rem;
}

.navCta {
    min-width: 18.5rem;
    padding: 1.7rem 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    border-radius: 0.8rem;
    background: #a95738;
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow:
        0 0.6rem 1.6rem rgba(169, 87, 56, 0.16);
    transition:
        transform 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;
}

.navCta:hover {
    transform: translateY(-2px);
    background: #3f454c;
    box-shadow:
        0 1rem 2.4rem rgba(169, 87, 56, 0.22);
}

.navCtaArrow {
    font-size: 2rem;
    line-height: 1;
    transition: transform 0.2s ease;
}

.navCta:hover .navCtaArrow {
    transform: translateX(0.4rem);
}

.navBurger {
    display: none;
    width: 4.8rem;
    height: 4.8rem;
    padding: 0;
    border: 0;
    border-radius: 0.8rem;
    background: #a95738;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.5rem;
    z-index: 102;
}

.navBurger span {
    display: block;
    width: 2rem;
    height: 2px;
    background: #d2d0cc;
    border-radius: 999px;
    transition:
        transform 0.3s ease,
        opacity 0.3s ease;
}

.navBurger.navBurgerActive span:nth-child(1) {
    transform: translateY(0.7rem) rotate(45deg);
}

.navBurger.navBurgerActive span:nth-child(2) {
    opacity: 0;
}

.navBurger.navBurgerActive span:nth-child(3) {
    transform: translateY(-0.7rem) rotate(-45deg);
}

.navMobileMenu {
    position: absolute;
    top: calc(100% + 1rem);
    left: 0;
    width: 100%;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    border: 1px solid rgba(210, 208, 204, 0.7);
    border-radius: 1.6rem;
    background: rgba(210, 208, 204, 0.96);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow:
        0 1.5rem 4rem rgba(63, 69, 76, 0.12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-1rem);
    pointer-events: none;
    transition:
        opacity 0.3s ease,
        transform 0.3s ease,
        visibility 0.3s ease;
}

.navMobileMenu.navMobileMenuActive {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.navMobileLink {
    padding: 1.4rem 1.2rem;
    border-bottom: 1px solid rgba(63, 69, 76, 0.07);
    font-family: "Inter", sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none;
    color: #3f454c;
    transition:
        color 0.2s ease,
        padding-left 0.2s ease;
}

.navMobileLink:hover {
    color: #a95738;
    padding-left: 1.7rem;
}

.navMobileSectionTitle {
display: block;
padding: 1.4rem 1.2rem 0.8rem;
font-family: "Inter", sans-serif;
font-size: 1.3rem;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
color: #3f454c;
}

.navMobileServices {
display: flex;
flex-direction: column;
padding: 0 0 1rem 1.8rem;
}

.navMobileServiceLink {
padding: 1rem 1.2rem;
font-family: "Inter", sans-serif;
font-size: 1.2rem;
font-weight: 600;
text-decoration: none;
color: #74777c;
border-left: 1px solid rgba(169, 87, 56, 0.28);
transition:
color 0.2s ease,
padding-left 0.2s ease,
border-color 0.2s ease;
}

.navMobileServiceLink:hover {
padding-left: 1.7rem;
color: #a95738;
border-color: #a95738;
}

.navMobileCta {
    margin-top: 1.2rem;
    padding: 1.6rem 1.8rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 0.8rem;
    background: #a95738;
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
}

.hero {
    position: relative;
    padding: 4.8rem;
    padding-top: 12.8rem;
    min-height: 90vh;
    overflow: hidden;
    background: #d2d0cc;
    isolation: isolate;
}

.hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        transparent 45%,
        rgba(63, 69, 76, 0.58) 100%
    );
    pointer-events: none;
    z-index: 1;
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("/imgs/heroBackground.jpg");
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
    mask-image: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 30%,
        rgba(63, 69, 76, 0.468) 45%,
        rgb(63, 69, 76) 62%,
        #3f454c 78%,
        #3f454c 100%
    );
    -webkit-mask-image: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 30%,
        rgba(63, 69, 76, 0.15) 45%,
        rgba(63, 69, 76, 0.941) 62%,
        #3f454c 78%,
        #3f454c 100%
    );
    z-index: -1;
}


.heroBox {
    margin: 0 auto;
    height: 100%;
    max-width: 150rem;
}

.heroContainer {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 3rem;
    padding: 0 6rem;
}

.heroTextContainer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    z-index: 5;
}

.heroEyebrow {
    margin: 0 0 2.6rem;
    font-family: "Inter", sans-serif;
    font-size: 1.4rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #a95738;
}

.heroHeader {
    margin: 0;
    display: flex;
    flex-direction: column;
    min-width: 30rem;
}

.heroHeaderMain {
    font-family: "Anton", sans-serif;
    font-size: 6rem;
    font-weight: 400;
    line-height: 0.94;
    letter-spacing: -0.02em;
    color: #3f454c;
}

.heroHeaderAccent {
    margin-top: 0.5rem;
    font-family: "Cormorant Garamond", serif;
    font-size: 4.8rem;
    font-style: italic;
    font-weight: 600;
    line-height: 0.9;
    letter-spacing: -0.035em;
    color: #a95738;
}

.heroAccentLine {
    width: 8rem;
    height: 0.3rem;
    margin: 2rem 0 2rem;
    background: #a95738;
}

.heroText {
    max-width: 46rem;
    margin: 0 0 3rem;
    font-family: "Inter", sans-serif;
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.7;
    color: #3f454c;
}

.heroBtnBox {
    display: flex;
    align-items: center;
    gap: 1.4rem;
}

.heroBtn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.6rem 2rem;
    min-width: 22rem;
    font-family: "Inter", sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    text-decoration: none;
    border-radius: 0.8rem;
    transition:
        transform 0.2s ease,
        background 0.2s ease,
        color 0.2s ease;
}

.heroBtn:hover {
    transform: translateY(-2px);
}

.heroBtnPrimary {
    background: #a95738;
    color: #ffffff;
    box-shadow:
        0 0.8rem 2rem rgba(169, 87, 56, 0.2),
        0 0 2.4rem rgba(169, 87, 56, 0.08);
}

.heroBtnPrimary:hover {
    background: #3f454c;
}

.heroBtnSecondary {
    background: rgba(210, 208, 204, 0.32);
    color: #3f454c;
    border: 1px solid #74777c;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.heroBtnSecondary:hover {
    background: #74777c;
    color: #ffffff;
}

.heroBtnArrow {
    font-size: 2.2rem;
    line-height: 1;
}

.heroStats {
    width: 100%;
    display: none;
    margin-top: 4.4rem;
    padding-top: 2.6rem;
    border-top: 1px solid rgba(116, 119, 124, 0.3);
}

.heroStat {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 0 3rem;
    font-family: "Inter", sans-serif;
}

.heroStat:first-child {
    padding-left: 0;
}

.heroStat + .heroStat {
    border-left: 1px solid rgba(116, 119, 124, 0.34);
}

.heroStat strong {
    font-size: 2.2rem;
    font-weight: 700;
    color: #3f454c;
}

.heroStat span {
    font-size: 1.15rem;
    line-height: 1.4;
    color: #ffffff;
}

.heroCarouselContainer {
    position: relative;
    width: 100%;
    height: 65rem;
    display: flex;
    align-items: center;
    justify-content: center;
    perspective: 120rem;
}

.heroCarousel {
    position: relative;
    width: 18rem;
    height: 28rem;
    transform-style: preserve-3d;
    z-index: 2;
    animation: carouselSpin 18s linear infinite;
}

.carouselCard {
    position: absolute;
    width: 20rem;
    height: 30rem;
    top: 0;
    left: 0;
    border-radius: 2rem;
    overflow: hidden;
    background: #d2d0cc;
    border: 1px solid rgba(210, 208, 204, 0.44);
    box-shadow:
        0 2rem 5rem rgba(63, 69, 76, 0.2),
        0 0 2rem rgba(169, 87, 56, 0.06);
    transform:
        rotateY(calc(var(--i) * 51.428deg))
        translateZ(28rem);
    backface-visibility: visible;
}

.carouselCard img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

@keyframes carouselSpin {
    from {
        transform:
            rotateX(-14deg)
            rotateZ(-10deg)
            rotateY(0deg);
    }
    to {
        transform:
            rotateX(-14deg)
            rotateZ(-10deg)
            rotateY(360deg);
    }
}

.heroGrowText {
    position: absolute;
    top: -3rem;
    left: 40%;
    transform: translateX(-50%);
    font-size: 35rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 2rem;
    font-family: "Anton", sans-serif;
    color: #fff;
    opacity: .75;
    white-space: nowrap;
    user-select: none;
    pointer-events: none;
    -webkit-mask-image: linear-gradient(
        to bottom,
        #3f454c 0%,
        #3f454c 45%,
        rgba(63, 69, 76, 0.7) 45%,
        rgba(63, 69, 76, 0.25) 72%,
        transparent 100%
    );
    mask-image: linear-gradient(
        to bottom,
        #3f454c 0%,
        #3f454c 45%,
        rgba(63, 69, 76, 0.7) 59%,
        rgba(63, 69, 76, 0.25) 77%,
        transparent 100%
    );
    z-index: 0;
}

.carouselGlowRing {
    position: absolute;
    left: 57%;
    bottom: -13.5rem;
    width: 82rem;
    height: 38rem;
    transform: translateX(-50%);
    border-radius: 50%;
    border: 1px solid rgba(169, 87, 56, 0.86);
    box-shadow:
        0 0 4px rgba(210, 208, 204, 0.92),
        0 0 10px rgba(169, 87, 56, 0.88),
        0 0 24px rgba(169, 87, 56, 0.58),
        0 0 52px rgba(169, 87, 56, 0.3),
        0 0 90px rgba(63, 69, 76, 0.16),
        inset 0 0 10px rgba(210, 208, 204, 0.28);
    pointer-events: none;
    z-index: 1;
}

.carouselGlowRing::before {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    padding: 3px;
    background: conic-gradient(
        from var(--glow-angle),
        transparent 0deg,
        transparent 235deg,
        rgba(169, 87, 56, 0.08) 265deg,
        rgba(169, 87, 56, 0.42) 295deg,
        rgba(169, 87, 56, 0.94) 322deg,
        #d2d0cc 340deg,
        rgba(169, 87, 56, 0.76) 352deg,
        transparent 360deg
    );
    -webkit-mask:
        linear-gradient(#d2d0cc 0 0) content-box,
        linear-gradient(#d2d0cc 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    filter:
        drop-shadow(0 0 5px rgba(210, 208, 204, 0.95))
        drop-shadow(0 0 14px rgba(169, 87, 56, 0.82))
        drop-shadow(0 0 30px rgba(169, 87, 56, 0.42))
        drop-shadow(0 0 48px rgba(63, 69, 76, 0.22));
    animation: glowSpin 5s linear infinite;
}

.carouselGlowRing::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 88%;
    height: 70%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse at center,
            rgba(169, 87, 56, 0.24) 0%,
            rgba(169, 87, 56, 0.15) 30%,
            rgba(116, 119, 124, 0.08) 55%,
            rgba(63, 69, 76, 0.03) 68%,
            transparent 80%
        );
    filter: blur(2.4rem);
    z-index: -1;
}

@keyframes glowSpin {
    from {
        --glow-angle: 0deg;
    }
    to {
        --glow-angle: 360deg;
    }
}




.videoCarouselSection {
    position: relative;
    padding: 10rem 5rem 8rem;
    background: #d2d0cc;
    overflow: hidden;
}

.videoCarouselContainer {
    width: min(150rem, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 32rem 1fr;
    gap: 8rem;
    align-items: start;
}

.videoCarouselIntro {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.videoCarouselEyebrow {
    margin: 0 0 1.2rem;
    font-family: "Inter", sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #a95738;
}

.videoCarouselEyebrowLine {
    width: 6rem;
    height: 2px;
    margin-bottom: 3rem;
    background: #a95738;
}

.videoCarouselHeading {
    margin: 0;
    display: flex;
    flex-direction: column;
}

.videoCarouselHeadingMain {
    font-family: "Anton", sans-serif;
    font-size: 4.6rem;
    font-weight: 400;
    line-height: 0.95;
    color: #3f454c;
}

.videoCarouselHeadingAccent {
    margin-top: 0.4rem;
    font-family: "Cormorant Garamond", serif;
    font-size: 5.4rem;
    font-style: italic;
    font-weight: 600;
    line-height: 0.95;
    color: #a95738;
}

.videoCarouselText {
    max-width: 30rem;
    margin: 3rem 0;
    font-family: "Inter", sans-serif;
    font-size: 1.7rem;
    line-height: 1.7;
    color: #3f454c;
}

.videoCarouselButton {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.5rem;
    padding: 1.4rem 1.8rem;
    border: 1px solid rgba(63, 69, 76, 0.35);
    border-radius: 0.6rem;
    font-family: "Inter", sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    background-color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    color: #3f454c;
    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease;
        z-index: 5;
}

.videoCarouselButton:hover {
    transform: translateY(-2px);
    border-color: #a95738;
    color: #a95738;
}

.videoCarouselButtonArrow {
    font-size: 1.7rem;
}

.videoCarouselProcess {
    --videoCarouselAccent: #a95738;
    --videoCarouselGlow: #a95738;
    --videoCarouselHot: #d2d0cc;
    --videoCarouselBg: #d2d0cc;
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 5rem;
    min-height: 34rem;
    padding: 2rem 2rem 5rem;
    overflow: visible;
}

.videoCarouselStep {
    position: relative;
    min-height: 27rem;
    padding-top: 7rem;
    z-index: 2;
}

.videoCarouselStepNumber {
    position: absolute;
    top: -1rem;
    left: 0;
    font-family: "Anton", sans-serif;
    font-size: 10rem;
    font-weight: 400;
    line-height: 1;
    opacity: 0.55;
    color: #fff;
    pointer-events: none;
    user-select: none;
    z-index: 0;
}

.videoCarouselStepHeader {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    z-index: 4;
}

.videoCarouselStepIcon {
    position: relative;
    width: 4.4rem;
    height: 4.4rem;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--videoCarouselAccent);
    color: #ffffff;
    box-shadow:
        0 0.5rem 1.4rem rgba(169, 87, 56, 0.18);
    transition:
        box-shadow 0.3s ease,
        background 0.3s ease;
}

.videoCarouselStepIcon span {
    font-family: "Inter", sans-serif;
    font-size: 1.8rem;
    line-height: 1;
}

.videoCarouselStepTitle {
    margin: 0;
    font-family: "Inter", sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    color: #3f454c;
}

.videoCarouselStepCopy {
    position: relative;
    max-width: 19rem;
    margin: 2rem 0 0 5.9rem;
    font-family: "Inter", sans-serif;
    font-size: 1.5rem;
    line-height: 1.7;
    color: #3f454c;
    z-index: 3;
}

.videoCarouselStepLine {
    position: absolute;
    left: 2.2rem;
    top: 11.4rem;
    bottom: 0;
    width: 1px;
    background:
        linear-gradient(
            to bottom,
            rgba(116, 119, 124, 0.34),
            rgba(116, 119, 124, 0.22)
        );
    overflow: hidden;
    z-index: 1;
}

.videoCarouselStepGlow {
    position: absolute;
    left: 50%;
    top: -7rem;
    width: 4px;
    height: 7rem;
    transform: translateX(-50%);
    border-radius: 999px;
    background:
        linear-gradient(
            to bottom,
            transparent 0%,
            rgba(169, 87, 56, 0.12) 15%,
            rgba(169, 87, 56, 0.52) 35%,
            var(--videoCarouselGlow) 52%,
            var(--videoCarouselHot) 62%,
            var(--videoCarouselGlow) 72%,
            rgba(169, 87, 56, 0.34) 87%,
            transparent 100%
        );
    box-shadow:
        0 0 4px rgba(210, 208, 204, 0.95),
        0 0 10px rgba(169, 87, 56, 0.82),
        0 0 20px rgba(169, 87, 56, 0.62),
        0 0 35px rgba(169, 87, 56, 0.26);
    opacity: 0;
    animation: videoCarouselVerticalEnergy 10s linear infinite;
}

.videoCarouselStepOne .videoCarouselStepGlow {
    animation-delay: 0s;
}

.videoCarouselStepTwo .videoCarouselStepGlow {
    animation-delay: 1.4s;
}

.videoCarouselStepThree .videoCarouselStepGlow {
    animation-delay: 2.8s;
}

.videoCarouselStepFour .videoCarouselStepGlow {
    animation-delay: 4.2s;
}

@keyframes videoCarouselVerticalEnergy {
    0% {
        top: -7rem;
        opacity: 0;
    }
    2% {
        opacity: 1;
    }
    10% {
        opacity: 1;
    }
    14% {
        top: calc(100% - 3.5rem);
        opacity: 1;
    }
    17% {
        top: 100%;
        opacity: 0;
    }
    100% {
        top: 100%;
        opacity: 0;
    }
}

.videoCarouselStepNode {
    position: absolute;
    left: 1.72rem;
    bottom: -0.48rem;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: #a95738;
    box-shadow:
        0 0 0 4px var(--videoCarouselBg);
    z-index: 5;
    animation: videoCarouselNodeEnergy 10s linear infinite;
}

.videoCarouselStepOne .videoCarouselStepNode {
    animation-delay: 0s;
}

.videoCarouselStepTwo .videoCarouselStepNode {
    animation-delay: 1.4s;
}

.videoCarouselStepThree .videoCarouselStepNode {
    animation-delay: 2.8s;
}

.videoCarouselStepFour .videoCarouselStepNode {
    animation-delay: 4.2s;
}

@keyframes videoCarouselNodeEnergy {
    0%,
    11% {
        transform: scale(1);
        background: #a95738;
        box-shadow:
            0 0 0 4px var(--videoCarouselBg);
    }
    14% {
        transform: scale(1.45);
        background: var(--videoCarouselHot);
        box-shadow:
            0 0 0 4px var(--videoCarouselBg),
            0 0 5px rgba(210, 208, 204, 1),
            0 0 12px rgba(169, 87, 56, 0.92),
            0 0 24px rgba(169, 87, 56, 0.68),
            0 0 40px rgba(169, 87, 56, 0.28);
    }
    19%,
    100% {
        transform: scale(1);
        background: #a95738;
        box-shadow:
            0 0 0 4px var(--videoCarouselBg);
    }
}

.videoCarouselProcessBaseline {
    position: absolute;
    left: 4.2rem;
    right: 1rem;
    bottom: 5rem;
    height: 1px;
    background: rgba(169, 87, 56, 0.26);
    box-shadow:
        0 0 0.3rem rgba(169, 87, 56, 0.18),
        0 0 0.8rem rgba(169, 87, 56, 0.12);
    overflow: visible;
    z-index: 1;
}

.videoCarouselProcessBaselineGlow {
    position: absolute;
    top: 50%;
    left: 0;
    width: 6rem;
    height: 0.5rem;
    transform: translateY(-50%);
    border-radius: 13px;
    background:
        radial-gradient(
            ellipse at center,
            rgba(210, 208, 204, 0.98) 0%,
            rgba(169, 87, 56, 0.88) 18%,
            rgba(169, 87, 56, 0.62) 42%,
            rgba(169, 87, 56, 0.18) 68%,
            transparent 100%
        );
    filter:
        drop-shadow(0 0 0.2rem rgba(210, 208, 204, 0.84))
        drop-shadow(0 0 0.6rem rgba(169, 87, 56, 0.52))
        drop-shadow(0 0 1.2rem rgba(169, 87, 56, 0.22));
    opacity: 0;
    pointer-events: none;
    animation: videoCarouselHorizontalEnergy 10s linear infinite;
}

@keyframes videoCarouselHorizontalEnergy {
    0%,
    57% {
        left: 0;
        opacity: 0;
    }
    59% {
        left: 0;
        opacity: 1;
    }
    62% {
        opacity: 1;
    }
    82% {
        left: calc(100% - 14rem);
        opacity: 1;
    }
    86% {
        left: calc(100% - 14rem);
        opacity: 0;
    }
    100% {
        left: 0;
        opacity: 0;
    }
}

.videoCarouselStage {
    position: relative;
    width: 100%;
    max-width: 125rem;
    height: 42rem;
    margin: 2rem auto 3rem;
    margin-top: -5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    perspective: 140rem;
    overflow: visible;
    isolation: isolate;
}

.videoCarouselStage::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 51%;
    width: 108rem;
    height: 28rem;
    transform: translate(-50%, -50%);
    border: 1px solid rgba(169, 87, 56, 0.22);
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
}

.videoCarouselStage::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 51%;
    width: 88rem;
    height: 21rem;
    transform: translate(-50%, -50%);
    border: 1px solid rgba(169, 87, 56, 0.12);
    border-radius: 50%;
    box-shadow:
        0 0 3rem rgba(169, 87, 56, 0.045);
    pointer-events: none;
    z-index: 0;
}

.videoCarouselTrack {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 31rem;
    transform: translate(-50%, -50%);
    transform-style: preserve-3d;
    overflow: visible;
    z-index: 2;
}

.videoCarouselTrack::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -3rem;
    width: 58rem;
    height: 7rem;
    transform: translateX(-50%);
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse at center,
            rgba(63, 69, 76, 0.16) 0%,
            rgba(63, 69, 76, 0.08) 42%,
            transparent 74%
        );
    filter: blur(1.7rem);
    pointer-events: none;
    z-index: -1;
}

.videoCarouselCard {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 39rem;
    height: 25rem;
    margin: 0;
    border-radius: 1.2rem;
    overflow: hidden;
    background: #3f454c;
    cursor: pointer;
    transform-style: preserve-3d;
    transform-origin: center center;
    box-shadow:
        0 2.5rem 5rem rgba(63, 69, 76, 0.18),
        0 0.6rem 1.5rem rgba(63, 69, 76, 0.09);
    transition:
        transform 850ms cubic-bezier(0.22, 1, 0.36, 1),
        opacity 650ms ease,
        filter 650ms ease,
        box-shadow 650ms ease;
    will-change:
        transform,
        opacity;
    backface-visibility: hidden;
}

.videoCarouselCard::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            to bottom,
            transparent 55%,
            rgba(63, 69, 76, 0.08) 75%,
            rgba(63, 69, 76, 0.18) 100%
        );
    pointer-events: none;
    z-index: 2;
}

.videoCarouselVideo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    background: #3f454c;
    pointer-events: none;
}

.videoCarouselPositionCenter {
    z-index: 10;
    opacity: 1;
    filter:
        brightness(1)
        saturate(1);
    transform:
        translate(-50%, -50%)
        translateX(0)
        translateY(0)
        translateZ(12rem)
        rotateY(0deg)
        scale(1.08);
    box-shadow:
        0 3rem 6rem rgba(63, 69, 76, 0.22),
        0 1rem 2rem rgba(63, 69, 76, 0.12);
}

.videoCarouselPositionLeft {
    z-index: 7;
    opacity: 0.95;
    filter:
        brightness(0.9)
        saturate(0.88);
    transform:
        translate(-50%, -50%)
        translateX(-26rem)
        translateY(1.7rem)
        translateZ(-2rem)
        rotateY(34deg)
        scale(0.88);
}

.videoCarouselPositionRight {
    z-index: 7;
    opacity: 0.95;
    filter:
        brightness(0.9)
        saturate(0.88);
    transform:
        translate(-50%, -50%)
        translateX(26rem)
        translateY(1.7rem)
        translateZ(-2rem)
        rotateY(-34deg)
        scale(0.88);
}

.videoCarouselPositionFarLeft {
    z-index: 4;
    opacity: 0.82;
    filter:
        brightness(0.8)
        saturate(0.75);
    transform:
        translate(-50%, -50%)
        translateX(-43rem)
        translateY(3.7rem)
        translateZ(-12rem)
        rotateY(54deg)
        scale(0.72);
}

.videoCarouselPositionFarRight {
    z-index: 4;
    opacity: 0.82;
    filter:
        brightness(0.8)
        saturate(0.75);
    transform:
        translate(-50%, -50%)
        translateX(43rem)
        translateY(3.7rem)
        translateZ(-12rem)
        rotateY(-54deg)
        scale(0.72);
}

.videoCarouselPositionLeft:hover {
    filter:
        brightness(1)
        saturate(1);
    transform:
        translate(-50%, -50%)
        translateX(-26rem)
        translateY(0.8rem)
        translateZ(1rem)
        rotateY(31deg)
        scale(0.91);
}

.videoCarouselPositionRight:hover {
    filter:
        brightness(1)
        saturate(1);
    transform:
        translate(-50%, -50%)
        translateX(26rem)
        translateY(0.8rem)
        translateZ(1rem)
        rotateY(-31deg)
        scale(0.91);
}

.videoCarouselPositionFarLeft:hover {
    opacity: 1;
    filter:
        brightness(0.95)
        saturate(0.95);
}

.videoCarouselPositionFarRight:hover {
    opacity: 1;
    filter:
        brightness(0.95)
        saturate(0.95);
}

.videoCarouselPositionCenter:hover .videoCarouselPlayIndicator {
    transform:
        translate(-50%, -50%)
        scale(1.08);
    background: #a95738;
    box-shadow:
        0 0.8rem 2.5rem rgba(169, 87, 56, 0.34);
}

.videoCarouselCenterPlay {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 7rem;
    height: 7rem;
    transform: translate(-50%, -50%);
    display: grid;
    place-items: center;
    border: 1px solid rgba(210, 208, 204, 0.58);
    border-radius: 50%;
    background: rgba(169, 87, 56, 0.94);
    box-shadow:
        0 1rem 3rem rgba(63, 69, 76, 0.24),
        0 0 2rem rgba(169, 87, 56, 0.28);
    cursor: pointer;
    z-index: 10;
    transition:
        transform 250ms ease,
        background 250ms ease,
        box-shadow 250ms ease;
}

.videoCarouselCenterPlay:hover {
    transform:
        translate(-50%, -50%)
        scale(1.08);
    background: #a95738;
    box-shadow:
        0 1.2rem 3.5rem rgba(63, 69, 76, 0.28),
        0 0 2.5rem rgba(169, 87, 56, 0.4);
}

.videoCarouselCenterPlayIcon {
    width: 0;
    height: 0;
    margin-left: 0.4rem;
    border-top: 0.9rem solid transparent;
    border-bottom: 0.9rem solid transparent;
    border-left: 1.4rem solid #d2d0cc;
}

.videoCarouselDots {
    position: absolute;
    left: 50%;
    bottom: 2.5rem !important;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.9rem;
    z-index: 20;
}

.videoCarouselDot {
    appearance: none;
    width: 0.8rem;
    height: 0.8rem;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(116, 119, 124, 0.24);
    cursor: pointer;
    transition:
        background 250ms ease,
        transform 250ms ease,
        box-shadow 250ms ease;
}

.videoCarouselDot:hover {
    background: rgba(169, 87, 56, 0.52);
}

.videoCarouselDotActive {
    background: #a95738;
    transform: scale(1.18);
    box-shadow:
        0 0 0.7rem rgba(169, 87, 56, 0.22);
}

.videoCarouselRingBackground {
    position: absolute;
    left: 50%;
    top: 51%;
    width: 138rem;
    transform: translate(-50%, -50%);
    pointer-events: none;
    user-select: none;
    z-index: 0;
}

.videoCarouselRingBackgroundImg {
    display: block;
    width: 140rem;
    height: auto;
    object-fit: contain;
    pointer-events: none;
    user-select: none;
    margin-left: -3rem;
    opacity: 1;
    transform-origin: center;
    animation: videoCarouselRingFloat 5s ease-in-out infinite alternate;
}

@keyframes videoCarouselRingFloat {
    0% {
        transform:
            translateY(0)
            scaleX(1)
            scaleY(1);
    }
    50% {
        transform:
            translateY(-0.4rem)
            scaleX(1.012)
            scaleY(0.99);
    }
    100% {
        transform:
            translateY(0.3rem)
            scaleX(0.995)
            scaleY(1.008);
    }
}

.videoCarouselImage {
    width: 100%;
}

.socialSection {
    position: relative;
    width: 100%;
    min-height: 74rem;
    padding: 4rem 4rem 4rem;
    overflow: hidden;
    background:
        radial-gradient(
            ellipse at 50% 42%,
            #e3e1dd 0%,
            #d8d6d2 48%,
            #d2d0cc 100%
        );
    isolation: isolate;
}

.socialContainer {
    position: relative;
    width: min(150rem, 100%);
    min-height: 64rem;
    margin: 0 auto;
    z-index: 2;
}

.socialBackground {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.socialAmbientGlow {
    position: absolute;
    left: 50%;
    top: 45%;
    width: 90rem;
    height: 52rem;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse at center,
            rgba(210, 208, 204, 0.98) 0%,
            rgba(169, 87, 56, 0.16) 32%,
            rgba(116, 119, 124, 0.08) 53%,
            transparent 76%
        );
    filter: blur(0.5rem);
}

.socialOrbit {
    position: absolute;
    top: 48%;
    width: 66rem;
    height: 66rem;
    transform: translateY(-50%);
    border-radius: 50%;
    opacity: 0.72;
}

.socialOrbitLeft {
    left: -25rem;
}

.socialOrbitRight {
    right: -25rem;
}

.socialOrbitRing {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border: 1px solid rgba(169, 87, 56, 0.22);
    border-radius: 50%;
    box-shadow: 0 0 1.8rem rgba(169, 87, 56, 0.04);
}

.socialOrbitRingOne {
    width: 100%;
    height: 100%;
}

.socialOrbitRingTwo {
    width: 80%;
    height: 80%;
    border-color: rgba(169, 87, 56, 0.18);
}

.socialOrbitRingThree {
    width: 61%;
    height: 61%;
    border-color: rgba(116, 119, 124, 0.16);
}

.socialOrbitRingFour {
    width: 42%;
    height: 42%;
    border-color: rgba(169, 87, 56, 0.13);
}

.socialOrbitDot {
    position: absolute;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: #a95738;
    box-shadow:
        0 0 0.6rem rgba(169, 87, 56, 0.55),
        0 0 1.5rem rgba(169, 87, 56, 0.22);
}

.socialOrbitDotOne {
    left: 4%;
    top: 59%;
}

.socialOrbitDotTwo {
    right: 7%;
    top: 37%;
}

.socialOrbitDotThree {
    right: 12%;
    bottom: 14%;
}

.socialHeading {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    z-index: 10;
}

.socialEyebrow {
    margin: 0 0 1.5rem;
    font-family: "Inter", sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #a95738;
}

.socialTitle {
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-family: "Cormorant Garamond", serif;
    font-weight: 500;
    line-height: 0.86;
    letter-spacing: -0.045em;
    color: #3f454c;
}

.socialTitleTop,
.socialTitleBottom {
    display: block;
    font-size: clamp(6rem, 6.6vw, 10rem);
}

.socialTitleBottom {
    font-style: italic;
}

.socialTitleBottom em {
    font-style: italic;
    color: #a95738;
}

.socialVisual {
    position: relative;
    display: grid;
    grid-template-columns:
        minmax(34rem, 1fr)
        minmax(30rem, 38rem)
        minmax(30rem, 1fr);
    align-items: center;
    gap: clamp(3rem, 4vw, 7rem);
    min-height: 45rem;
    margin-top: -5rem;
    perspective: 72rem;
    perspective-origin: 50% 42%;
    transform-style: preserve-3d;
    z-index: 5;
}

.socialWebsiteArea,
.socialVideoArea {
    position: relative;
    min-width: 0;
    display: flex;
    align-items: center;
    transform-style: preserve-3d;
}

.socialWebsiteArea {
    justify-content: flex-end;
}

.socialVideoArea {
    justify-content: flex-start;
}

.socialWebsiteCard {
    position: relative;
    width: 40rem;
    height: 35rem;
    flex-shrink: 0;
    overflow: hidden;
    border: 4px solid #fff;
    border-radius: 2rem;
    background: #74777c;
    transform:
        rotateY(35deg)
        rotateZ(-1.8deg);
    box-shadow:
        -2.5rem 3rem 3rem rgba(63, 69, 76, 0.24),
        -6rem 6rem 7rem rgba(63, 69, 76, 0.18),
        -10rem 10rem 13rem rgba(63, 69, 76, 0.11),
        0 1.2rem 2rem rgba(63, 69, 76, 0.16),
        0 0 3rem rgba(169, 87, 56, 0.06);
    transform-origin: center bottom;
    transform-style: preserve-3d;
    z-index: 3;
    animation:
        socialWebsiteFloat
        7s
        ease-in-out
        infinite alternate;
}

@keyframes socialCardFloatLeft {
    from {
        transform:
            translateY(0)
            translateZ(1rem)
            rotateX(7deg)
            rotateY(20deg)
            rotateZ(0.8deg);
    }
    to {
        transform:
            translateY(-0.6rem)
            translateZ(1rem)
            rotateX(7deg)
            rotateY(20deg)
            rotateZ(0.8deg);
    }
}

.socialWebsiteImage {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.socialVideoCard {
    position: relative;
    width: 31rem;
    height: 43rem;
    flex-shrink: 0;
    border: 4px solid #fff;
    overflow: hidden;
    border-radius: 2rem;
    background: #3f454c;
    transform:
        translateX(5rem)
        translateZ(-3rem)
        rotateX(-4deg)
        rotateY(-60deg)
        rotateZ(-1deg);
    box-shadow:
        3rem 4rem 4rem rgba(63, 69, 76, 0.25),
        7rem 8rem 9rem rgba(63, 69, 76, 0.2),
        12rem 14rem 16rem rgba(63, 69, 76, 0.12),
        0 1rem 2rem rgba(63, 69, 76, 0.18),
        0 0 3rem rgba(169, 87, 56, 0.06);
    transform-origin: center bottom;
    transform-style: preserve-3d;
    z-index: 3;
    animation:
        socialVideoFloat
        7.5s
        ease-in-out
        infinite alternate;
}



@keyframes socialCardFloatRight {
    from {
        transform:
            translateY(0)
            translateZ(1rem)
            rotateX(7deg)
            rotateY(-20deg)
            rotateZ(-0.8deg);
    }
    to {
        transform:
            translateY(-0.7rem)
            translateZ(1rem)
            rotateX(7deg)
            rotateY(-20deg)
            rotateZ(-0.8deg);
    }
}

.socialVideo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #3f454c;
}

.socialWebsiteArea::after,
.socialVideoArea::after {
    content: "";
    position: absolute;
    bottom: -1rem;
    width: 31rem;
    height: 7rem;
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse at center,
            rgba(63, 69, 76, 0.3) 0%,
            rgba(63, 69, 76, 0.16) 38%,
            rgba(63, 69, 76, 0.05) 60%,
            transparent 76%
        );
    filter: blur(1.25rem);
    pointer-events: none;
    z-index: 0;
}

.socialWebsiteArea::after {
    right: 1rem;
    transform:
        translateY(2.3rem)
        rotate(1.5deg);
}

.socialVideoArea::after {
    left: 0;
    transform:
        translateY(2.3rem)
        rotate(-1.5deg);
}

.socialCardBadge {
    position: absolute;
    min-height: 3.8rem;
    padding: 0.65rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    border: 1px solid rgba(210, 208, 204, 0.18);
    border-radius: 999px;
    background:
        linear-gradient(
            135deg,
            #b86443,
            #a95738
        );
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    box-shadow:
        0 0.6rem 1.4rem rgba(63, 69, 76, 0.2),
        0 0 1.8rem rgba(169, 87, 56, 0.12);
    z-index: 8;
}

.socialWebsiteBadge {
    left: 1.4rem;
    bottom: 1.3rem;
}

.socialFacebookBadge {
    right: 1.5rem;
    top: 1.5rem;
}

.socialBadgeGlobe {
    font-size: 1.8rem;
    line-height: 1;
}

.socialFacebookIcon {
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #d2d0cc;
    color: #a95738;
    font-family: Arial, sans-serif;
    font-size: 1.5rem;
    font-weight: 900;
}

.socialCenter {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 8rem;
    text-align: center;
    z-index: 6;
}

.socialCenterText {
    max-width: 31rem;
    margin: 1.3rem 0;
    font-family: "Inter", sans-serif;
    font-size: 1.45rem;
    font-weight: 500;
    line-height: 1.75;
    color: #3f454c;
}

.socialConnector {
    position: relative;
    width: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.socialConnectorLine {
    width: 1px;
    height: 5rem;
    background:
        linear-gradient(
            to bottom,
            rgba(169, 87, 56, 0.95),
            rgba(169, 87, 56, 0.22)
        );
    box-shadow: 0 0 0.8rem rgba(169, 87, 56, 0.1);
}

.socialConnectorBottom .socialConnectorLine {
    background:
        linear-gradient(
            to bottom,
            rgba(169, 87, 56, 0.22),
            rgba(169, 87, 56, 0.95)
        );
}

.socialConnectorDot {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    border-radius: 50%;
    background: #a95738;
    box-shadow:
        0 0 0.6rem rgba(169, 87, 56, 0.5),
        0 0 1.4rem rgba(169, 87, 56, 0.2);
}

.testimonialSection {
    position: relative;
    width: 100%;
    padding: 10rem 5rem 7rem;
    overflow: hidden;
    background:
        radial-gradient(
            ellipse at 55% 48%,
            #e1dfdb 0%,
            #d8d6d2 50%,
            #d2d0cc 100%
        );
    isolation: isolate;
}

.testimonialSection::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("/imgs/heroBackground.png");
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
    mask-image: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 30%,
        rgba(63, 69, 76, 0.32) 45%,
        rgba(63, 69, 76, 0.78) 62%,
        #3f454c 78%,
        #3f454c 100%
    );
    -webkit-mask-image: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 30%,
        rgba(63, 69, 76, 0.12) 45%,
        rgba(63, 69, 76, 0.75) 62%,
        #3f454c 78%,
        #3f454c 100%
    );
    opacity: 0.62;
    z-index: -1;
}

.testimonialBackground {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.testimonialOrbit {
    position: absolute;
    border: 1px solid rgba(169, 87, 56, 0.16);
    border-radius: 50%;
    box-shadow: 0 0 3rem rgba(169, 87, 56, 0.04);
}

.testimonialOrbitOne {
    width: 68rem;
    height: 68rem;
    right: -28rem;
    top: -18rem;
}

.testimonialOrbitTwo {
    width: 92rem;
    height: 42rem;
    left: -35rem;
    bottom: -23rem;
    transform: rotate(-8deg);
}

.testimonialContainer {
    position: relative;
    width: min(150rem, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns:
        minmax(38rem, 48rem)
        minmax(60rem, 1fr);
    align-items: center;
    gap: clamp(6rem, 8vw, 13rem);
    z-index: 2;
}

.testimonialIntro {
    position: relative;
    z-index: 10;
}

.testimonialEyebrow {
    margin: 0 0 1.2rem;
    font-family: "Inter", sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0.17em;
    text-transform: uppercase;
    color: #a95738;
}

.testimonialEyebrowLine {
    width: 5.5rem;
    height: 2px;
    margin-bottom: 3rem;
    background: #a95738;
}

.testimonialHeading {
    margin: 0;
    display: flex;
    flex-direction: column;
}

.testimonialHeadingMain {
    font-family: "Anton", sans-serif;
    font-size: clamp(5rem, 5vw, 7.4rem);
    font-weight: 400;
    line-height: 0.94;
    color: #3f454c;
    white-space: nowrap;
}

.testimonialHeadingAccent {
    margin-top: 0.5rem;
    font-family: "Cormorant Garamond", serif;
    font-size: clamp(5.6rem, 5.5vw, 8rem);
    font-style: italic;
    font-weight: 600;
    line-height: 0.9;
    color: #a95738;
}

.testimonialIntroText {
    max-width: 44rem;
    margin: 3rem 0;
    font-family: "Inter", sans-serif;
    font-size: 1.6rem;
    line-height: 1.75;
    color: #3f454c;
}

.testimonialButton {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    min-width: 20rem;
    gap: 3rem;
    padding: 1.5rem 1.8rem;
    border: 1px solid rgba(63, 69, 76, 0.38);
    border-radius: 0.7rem;
    font-family: "Inter", sans-serif;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: 0.035em;
    text-decoration: none;
    text-transform: uppercase;
    color: #3f454c;
    transition:
        transform 250ms ease,
        color 250ms ease,
        border-color 250ms ease,
        background 250ms ease;
}

.testimonialButton:hover {
    transform: translateY(-2px);
    color: #ffffff;
    border-color: #a95738;
    background: #a95738;
}

.testimonialButtonArrow {
    font-size: 1.6rem;
}

.testimonialScene {
    position: relative;
    min-height: 57rem;
    display: flex;
    align-items: center;
    justify-content: center;
    perspective: 130rem;
    perspective-origin: 50% 45%;
    transform-style: preserve-3d;
    z-index: 5;
}

.testimonialMixerImage {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    user-select: none;
    filter:
        drop-shadow(0 1.2rem 0.8rem rgba(63, 69, 76, 0.18))
        drop-shadow(0 2.5rem 2rem rgba(63, 69, 76, 0.2))
        drop-shadow(0 4rem 4.5rem rgba(63, 69, 76, 0.12));
}

.testimonialMixer {
    position: absolute;
    left: -28rem;
    top: 30rem;
    width: 53rem;
    z-index: 3;
    pointer-events: none;
    opacity: 50%;
    transform: rotate(-2deg);
    transform-origin: center bottom;
}

.testimonialMixer::after {
    content: "";
    position: absolute;
    left: 8%;
    bottom: -1.2rem;
    width: 78%;
    height: 4.5rem;
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse at center,
            rgba(63, 69, 76, 0.32) 0%,
            rgba(63, 69, 76, 0.2) 35%,
            rgba(63, 69, 76, 0.08) 58%,
            transparent 76%
        );
    filter: blur(1rem);
    transform: scaleX(1.05);
    pointer-events: none;
    z-index: -1;
}

.testimonialSlateStack {
    position: relative;
    width: 72rem;
    height: 48rem;
    transform-style: preserve-3d;
    z-index: 5;
}

.testimonialSlate {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 38rem;
    height: 45rem;
    border-radius: 1.6rem;
    background:
        radial-gradient(
            circle at 15% 20%,
            rgba(63, 69, 76, 0.07) 0 1px,
            transparent 1.5px
        ),
        radial-gradient(
            circle at 68% 45%,
            rgba(116, 119, 124, 0.065) 0 1px,
            transparent 1.6px
        ),
        radial-gradient(
            circle at 38% 78%,
            rgba(210, 208, 204, 0.34) 0 1px,
            transparent 1.5px
        ),
        linear-gradient(
            135deg,
            rgba(210, 208, 204, 0.5) 0%,
            rgba(210, 208, 204, 0.16) 35%,
            rgba(63, 69, 76, 0.06) 100%
        ),
        #fff;
    background-size:
        2.4rem 2.4rem,
        3rem 3rem,
        2rem 2rem,
        100% 100%,
        100% 100%;
    transform-style: preserve-3d;
    transform-origin: center bottom;
    box-shadow:
        inset -0.25rem 0 0 rgba(63, 69, 76, 0.13),
        inset 0 -0.25rem 0 rgba(63, 69, 76, 0.1),
        0 1.2rem 2.2rem rgba(63, 69, 76, 0.12),
        0 3.5rem 6rem rgba(63, 69, 76, 0.16),
        0 0 3rem rgba(169, 87, 56, 0.035);
    transition:
        transform 700ms cubic-bezier(0.22, 1, 0.36, 1),
        filter 500ms ease,
        opacity 500ms ease;
    will-change: transform;
}

.testimonialSlate::before {
    content: "";
    position: absolute;
    top: 0.8rem;
    left: 100%;
    width: 1.4rem;
    height: calc(100% - 1.6rem);
    border-radius: 0 0.8rem 0.8rem 0;
    background:
        linear-gradient(
            to right,
            #a6a5a1 0%,
            #74777c 50%,
            #3f454c 100%
        );
    transform: rotateY(90deg);
    transform-origin: left center;
    box-shadow:
        inset -0.15rem 0 0 rgba(63, 69, 76, 0.24);
    pointer-events: none;
    backface-visibility: hidden;
    z-index: -1;
}

.testimonialSlate::after {
    content: "";
    position: absolute;
    left: 0.8rem;
    top: 100%;
    width: calc(100% - 1.6rem);
    height: 1.4rem;
    border-radius: 0 0 0.9rem 0.9rem;
    background:
        linear-gradient(
            to bottom,
            #a6a5a1 0%,
            #74777c 55%,
            #3f454c 100%
        );
    transform: rotateX(-90deg);
    transform-origin: top center;
    box-shadow:
        inset 0 -0.15rem 0 rgba(63, 69, 76, 0.24);
    pointer-events: none;
    backface-visibility: hidden;
    z-index: -1;
}

.testimonialSlateInner {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 4rem 3.5rem 3.2rem;
    display: flex;
    flex-direction: column;
    z-index: 3;
}

.testimonialQuoteMark {
    height: 5.5rem;
    font-family: Georgia, serif;
    font-size: 8rem;
    font-weight: 700;
    line-height: 0.8;
    color: #a95738;
}

.testimonialQuote {
    margin: 1.5rem 0 2.4rem;
    font-family: "Inter", sans-serif;
    font-size: 1.55rem;
    font-weight: 500;
    line-height: 1.65;
    color: #3f454c;
}

.testimonialQuoteFeatured {
    font-size: 1.75rem;
    line-height: 1.6;
}

.testimonialQuoteDivider {
    width: 5rem;
    height: 2px;
    margin-bottom: 2.4rem;
    background: #a95738;
}

.testimonialAuthor {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.testimonialAuthor strong {
    font-family: "Anton", sans-serif;
    font-size: 1.7rem;
    font-weight: 400;
    letter-spacing: 0.02em;
    color: #3f454c;
}

.testimonialAuthor span {
    font-family: "Inter", sans-serif;
    font-size: 1.15rem;
    color: #3f454c;
}

.testimonialStars {
    margin-top: 1.6rem;
    font-size: 1.5rem;
    letter-spacing: 0.18em;
    color: #a95738;
}

.testimonialSlateFront {
    z-index: 10;
    transform:
        translate(-50%, -50%)
        translateX(-7rem)
        translateZ(10rem)
        rotateX(-2deg)
        rotateY(-14deg)
        rotateZ(1deg);
}

.testimonialSlateMiddle {
    z-index: 7;
    filter:
        brightness(0.93)
        saturate(0.8);
    transform:
        translate(-50%, -50%)
        translateX(14rem)
        translateY(0.8rem)
        translateZ(-5rem)
        rotateX(-2deg)
        rotateY(-10deg)
        rotateZ(0.5deg)
        scale(0.93);
}

.testimonialSlateBack {
    z-index: 4;
    filter:
        brightness(0.86)
        saturate(0.68);
    transform:
        translate(-50%, -50%)
        translateX(29rem)
        translateY(1.5rem)
        translateZ(-13rem)
        rotateY(-6deg)
        rotateZ(0.2deg)
        scale(0.86);
}

.testimonialSlateFront:hover {
    transform:
        translate(-50%, -50%)
        translateX(-7rem)
        translateY(-1rem)
        translateZ(13rem)
        rotateX(-1deg)
        rotateY(-8deg)
        rotateZ(0.7deg);
}

.testimonialStamp {
    position: absolute;
    right: 3rem;
    bottom: 3rem;
    width: 9rem;
    height: 9rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    border: 2px solid rgba(169, 87, 56, 0.8);
    border-radius: 50%;
    transform: rotate(-8deg);
    font-family: "Inter", sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.13em;
    text-align: center;
    text-transform: uppercase;
    color: #a95738;
    box-shadow:
        inset 0 0 1.5rem rgba(169, 87, 56, 0.04),
        0 0 1.4rem rgba(169, 87, 56, 0.05);
}

.testimonialStampIcon {
    margin: 0.3rem 0;
    font-size: 2rem;
}

.testimonialFloorShadow {
    position: absolute;
    left: 53%;
    bottom: 5rem;
    width: 61rem;
    height: 8rem;
    transform:
        translateX(-50%)
        rotate(-2deg);
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse at center,
            rgba(63, 69, 76, 0.3) 0%,
            rgba(63, 69, 76, 0.16) 42%,
            rgba(63, 69, 76, 0.05) 62%,
            transparent 78%
        );
    filter: blur(1.6rem);
    pointer-events: none;
    z-index: -1;
}

.testimonialControls {
    position: absolute;
    right: 2rem;
    bottom: -3rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    z-index: 20;
}

.testimonialArrow {
    width: 4.5rem;
    height: 4.5rem;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: #fff;
    color: #3f454c;
    font-size: 1.8rem;
    cursor: pointer;
    box-shadow:
        0 0.5rem 1.4rem rgba(63, 69, 76, 0.1);
    transition:
        transform 200ms ease,
        background 200ms ease,
        color 200ms ease,
        box-shadow 200ms ease;
}

.testimonialArrow:hover {
    transform: translateY(-2px);
    background: #a95738;
    color: #ffffff;
    box-shadow:
        0 0.8rem 1.8rem rgba(169, 87, 56, 0.2);
}

.testimonialArrowNext {
    background: #a95738;
    color: #ffffff;
}

.testimonialDots {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.testimonialDot {
    width: 0.65rem;
    height: 0.65rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #fff;
    cursor: pointer;
}

.testimonialDotActive {
    background: #a95738;
    transform: scale(1.25);
    box-shadow:
        0 0 0.8rem rgba(169, 87, 56, 0.18);
}

.testimonialStats {
    position: relative;
    width: min(100rem, calc(100% - 8rem));
    margin: 3rem auto 0;
    padding-top: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(4rem, 7vw, 10rem);
    border-top: 1px solid rgba(116, 119, 124, 0.22);
    z-index: 4;
}

.testimonialStat {
    min-width: 15rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.testimonialStatIcon {
    width: 4rem;
    height: 4rem;
    margin-bottom: 0.7rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #fff;
    font-size: 1.6rem;
    color: #3f454c;
    box-shadow:
        inset 0 0 0 1px rgba(116, 119, 124, 0.12);
}

.testimonialStat strong {
    font-family: "Cormorant Garamond", serif;
    font-size: 3.8rem;
    font-weight: 600;
    line-height: 1;
    color: #a95738;
}

.testimonialStat span:last-child {
    margin-top: 0.6rem;
    font-family: "Inter", sans-serif;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #3f454c;
}

.testimonialStatDivider {
    width: 1px;
    height: 5rem;
    background: rgba(169, 87, 56, 0.24);
}



.opportunitySection {
    position: relative;
    width: 100%;
    padding:
        2rem
        5rem;
    overflow: hidden;
    background:
        radial-gradient(
            ellipse at 62% 46%,
            #e1dfdb 0%,
            #d8d6d2 48%,
            #d2d0cc 100%
        );
    isolation: isolate;
}

.opportunityBackground {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.opportunityGlow {
    position: absolute;
    left: 62%;
    top: 47%;
    width: 100rem;
    height: 65rem;
    transform:
        translate(-50%, -50%);
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse at center,
            rgba(210, 208, 204, 0.94) 0%,
            rgba(169, 87, 56, 0.14) 45%
        );
}

.opportunityOrbit {
    position: absolute;
    border: 1px solid rgba(169, 87, 56, 0.1);
    border-radius: 50%;
}

.opportunityOrbitOne {
    width: 55rem;
    height: 55rem;
    right: -20rem;
    top: -23rem;
}

.opportunityOrbitTwo {
    width: 74rem;
    height: 31rem;
    left: -32rem;
    bottom: -18rem;
    transform: rotate(-10deg);
}

.opportunityContainer {
    position: relative;
    width: min(155rem, 100%);
    min-height: 62rem;
    margin: 0 auto;
    display: grid;
    grid-template-columns:
        minmax(32rem, 63rem)
        minmax(70rem, 150rem);
    align-items: center;
    gap: 0;
    z-index: 3;
}

.opportunityIntro {
    position: relative;
    transform: translateX(8rem);
    pointer-events: none;
    z-index: 20;
}

.opportunityEyebrow {
    margin: 0 0 1.2rem;
    font-family: "Inter", sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #a95738;
}

.opportunityEyebrowLine {
    width: 5rem;
    height: 2px;
    margin-bottom: 4rem;
    background: #a95738;
}

.opportunityHeading {
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.opportunityHeadingAccent {
    font-family: "Cormorant Garamond", serif;
    font-size: clamp(5.3rem, 5vw, 7.5rem);
    font-style: italic;
    font-weight: 600;
    line-height: 0.9;
    color: #a95738;
}

.opportunityHeadingMain {
    margin-top: 1rem;
    font-family: "Anton", sans-serif;
    font-size: clamp(5rem, 4.8vw, 7rem);
    font-weight: 400;
    line-height: 0.95;
    color: #3f454c;
}

.opportunityIntroText {
    max-width: 39rem;
    margin: 3.5rem 0 3.2rem;
    font-family: "Inter", sans-serif;
    font-size: 1.55rem;
    line-height: 1.75;
    color: #3f454c;
}

.opportunityButton {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    min-width: 26rem;
    gap: 3rem;
    padding: 1.8rem 2.2rem;
    border-radius: 0.8rem;
    background:
        linear-gradient(
            135deg,
            #b76647,
            #8f452f
        );
    box-shadow:
        0 1rem 2rem rgba(169, 87, 56, 0.18);
    font-family: "Inter", sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-decoration: none;
    color: #ffffff;
    transition:
        transform 220ms ease,
        box-shadow 220ms ease;
        
}

.opportunityButton:hover {
    transform: translateY(-2px);
    box-shadow:
        0 1.4rem 2.8rem rgba(169, 87, 56, 0.24);
}

.opportunityButtonArrow {
    font-size: 2rem;
}

.opportunityMap {
    position: relative;
    width: calc(100% + 8rem);
    margin-left: -18rem;
    aspect-ratio: 16 / 10;
    border-radius: 3rem;
    perspective: 140rem;
    transform-style: preserve-3d;
    isolation: isolate;
    z-index: 2;
}

.opportunityMapImage {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: inherit;
    filter:
        saturate(0.45)
        contrast(0.94)
        brightness(1.03)
        sepia(0.08);
    z-index: 0;
}

.opportunityPin {
    position: absolute;
    left: var(--x);
    top: var(--y);
    width: 4.4rem;
    height: 5.5rem;
    padding: 0;
    border: 0;
    background: transparent;
    transform: translate(-50%, -100%);
    cursor: pointer;
    z-index: 8;
    transition: transform 250ms ease;
}

.opportunityPin:hover {
    transform:
        translate(-50%, -100%)
        translateY(-0.6rem)
        scale(1.06);
}

.opportunityPinIcon {
    position: absolute;
    left: 50%;
    top: 0;
    width: 3.5rem;
    height: 4.5rem;
    transform: translateX(-50%);
    border-radius: 50% 50% 50% 0;
    background:
        linear-gradient(
            145deg,
            #bb6a4b,
            #a95738
        );
    box-shadow:
        0 0.7rem 1.5rem rgba(169, 87, 56, 0.24);
    rotate: -45deg;
}

.opportunityPinIcon span {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 1.15rem;
    height: 1.15rem;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #d2d0cc;
}

.opportunityPinPulse {
    position: absolute;
    left: 63%;
    bottom: -30%;
    width: 5.5rem;
    height: 2.2rem;
    transform:
        translateX(-50%)
        scale(0.35);
    border: 0.4rem solid rgba(169, 87, 56, 0.5);
    border-radius: 50%;
    opacity: 0;
    pointer-events: none;
    z-index: -1;
    animation: opportunityPinRipple 10s ease-out infinite;
}

.opportunityPinActive .opportunityPinPulse {
    opacity: 1;
    scale: 1;
    animation: opportunityPinRipple 2.2s ease-out infinite;
}

@keyframes opportunityPinRipple {
    0%,
    4% {
        transform:
            translateX(-50%)
            scale(0.35);
        opacity: 0;
    }
    6% {
        opacity: 0.75;
    }
    15% {
        transform:
            translateX(-50%)
            scale(1);
        opacity: 0.4;
    }
    23% {
        transform:
            translateX(-50%)
            scale(1.75);
        opacity: 0;
    }
    100% {
        transform:
            translateX(-50%)
            scale(1.75);
        opacity: 0;
    }
}

.opportunityMiniCard {
    position: absolute;
    min-width: 18rem;
    padding: 1.25rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 1.1rem;
    border: 1px solid rgba(210, 208, 204, 0.78);
    border-radius: 1.3rem;
    background: #fff;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow:
        0 1.2rem 2.8rem rgba(63, 69, 76, 0.12);
    cursor: pointer;
    z-index: 10;
    transition:
        transform 250ms ease,
        box-shadow 250ms ease;
}

.opportunityMiniCard:hover {
    transform: translateY(-0.4rem);
    box-shadow:
        0 1.7rem 3.4rem rgba(63, 69, 76, 0.16);
}

.opportunityMiniCardOne {
    left: 14%;
    top: 14%;
    z-index: 1000;
}

.opportunityMiniCardTwo {
    right: 7%;
    top: 14%;
}

.opportunityMiniCardThree {
    right: 18%;
    bottom: 7%;
}

.opportunityMiniIcon {
    width: 3.5rem;
    height: 3.5rem;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 0.8rem;
    background: rgba(169, 87, 56, 0.12);
    font-size: 1.8rem;
    color: #a95738;
}

.opportunityMiniContent {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
}

.opportunityMiniContent strong {
    font-family: "Inter", sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    color: #3f454c;
}

.opportunityMiniContent span {
    font-family: "Inter", sans-serif;
    font-size: 0.9rem;
    color: #3f454c;
}

.opportunityProjectCard {
    position: absolute;
    left: 46%;
    top: 51%;
    width: 40rem;
    height: 25rem;
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    transform:
        translate(-50%, -50%)
        translateZ(6rem)
        rotateX(1.5deg)
        rotateY(-2deg);
    transform-style: preserve-3d;
    overflow: hidden;
    border: 1px solid rgba(210, 208, 204, 0.78);
    border-radius: 2.2rem;
    background: #fff;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    box-shadow:
        0 2rem 4rem rgba(63, 69, 76, 0.15),
        0 4rem 7rem rgba(63, 69, 76, 0.12);
    z-index: 15;
    transition:
        transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
}

.opportunityProjectCard:hover {
    transform:
        translate(-50%, -50%)
        translateY(-0.7rem)
        translateZ(8rem)
        rotateX(1deg)
        rotateY(-1deg);
}

.opportunityProjectContent {
    padding: 3rem 2.8rem;
    display: flex;
    flex-direction: column;
}

.opportunityProjectStatus {
    align-self: flex-start;
    margin-bottom: 1.7rem;
    padding: 0.75rem 1.7rem;
    border-radius: 0.8rem;
    background: #a95738;
    font-family: "Inter", sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #ffffff;
}

.opportunityProjectTitle {
    margin: 0;
    font-family: "Inter", sans-serif;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.25;
    color: #3f454c;
}

.opportunityProjectDistance {
    margin-top: 1rem;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    font-family: "Inter", sans-serif;
    font-size: 1.1rem;
    color: #3f454c;
}

.opportunityProjectLocationIcon {
    font-size: 1.8rem;
    color: #a95738;
}

.opportunityProjectDivider {
    width: 100%;
    height: 1px;
    margin: 2rem 0;
    background: rgba(116, 119, 124, 0.16);
}

.opportunityProjectDetails {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    list-style: none;
}

.opportunityProjectDetails li {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-family: "Inter", sans-serif;
    font-size: 1.05rem;
    color: #3f454c;
}

.opportunityProjectDetailIcon {
    width: 2rem;
    color: #a95738;
}

.opportunityProjectButton {
    margin-top: auto;
    padding: 1.3rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid rgba(169, 87, 56, 0.18);
    border-radius: 0.9rem;
    background: rgba(169, 87, 56, 0.06);
    font-family: "Inter", sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: #a95738;
    cursor: pointer;
}

.opportunityProjectVisual {
position: relative;
padding: 0;
display: flex;
align-items: stretch;
justify-content: stretch;
border-left: 1px solid rgba(116, 119, 124, 0.12);
background: #84402d;
overflow: hidden;
}

.opportunityBlueprint {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
background: #84402d;
}

.opportunityBlueprintImage {
width: 100%;
height: 100%;
display: block;
object-fit: contain;
object-position: center;
}

.opportunityConnection {
    position: absolute;
    right: 16%;
    top: 53%;
    width: 18rem;
    height: 4rem;
    display: flex;
    align-items: center;
    pointer-events: none;
    z-index: 112;
}

.opportunityConnectionLine {
    width: 100%;
    border-top: 3px dashed rgba(169, 87, 56, 0.78);
}

.opportunityConnectionArrow {
    margin-left: 0.2rem;
    font-size: 2.2rem;
    color: #a95738;
}

.opportunityClientCard {
    position: absolute;
    right: 0;
    top: 50%;
    width: 19rem;
    min-height: 24rem;
    padding: 2rem 1.8rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform:
        translateY(-50%)
        translateZ(4rem)
        rotateY(-2deg);
    border: 1px solid rgba(210, 208, 204, 0.78);
    border-radius: 2rem;
    background: #fff;
    box-shadow:
        0 1.8rem 4rem rgba(63, 69, 76, 0.15);
    z-index: 14;
}

.opportunityClientImageWrap {
    position: relative;
    width: 13rem;
    height: 13rem;
}

.opportunityClientImage {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: 50%;
    box-shadow:
        0 0.8rem 2rem rgba(63, 69, 76, 0.16);
}

.opportunityClientCheck {
    position: absolute;
    right: -0.5rem;
    bottom: 0.4rem;
    width: 4rem;
    height: 4rem;
    display: grid;
    place-items: center;
    border: 0.5rem solid #d2d0cc;
    border-radius: 50%;
    background: #a95738;
    font-family: "Inter", sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    color: #ffffff;
}

.opportunityClientLabel {
    margin-top: 2rem;
    font-family: "Inter", sans-serif;
    font-size: 1.4rem;
    font-weight: 700;
    color: #a95738;
}

.opportunityClientLine {
    width: 5rem;
    height: 2px;
    margin-top: 1.5rem;
    background: #a95738;
}


.webDevSection {
    position: relative;
    width: 100%;
    padding: 8rem 5rem;
    overflow: hidden;
    background:
        radial-gradient(
            ellipse at center,
            #e2e0dc 0%,
            #d8d6d2 55%,
            #d2d0cc 100%
        );
}

.webDevContainer {
    width: min(145rem, 100%);
    margin: 0 auto;
}

.webDevPanel {
    position: relative;
    min-height: 55rem;
    display: grid;
    grid-template-columns:
        minmax(38rem, 1fr)
        minmax(50rem, 1.15fr);
    align-items: stretch;
    overflow: hidden;
    border-radius: 2.8rem;
    background:
        linear-gradient(
            135deg,
            #3f454c 0%,
            #4c5055 38%,
            #74777c 100%
        );
    box-shadow:
        0 2.5rem 5rem rgba(63, 69, 76, 0.18),
        0 0.8rem 1.8rem rgba(63, 69, 76, 0.1);
    isolation: isolate;
}

.webDevContent {
    position: relative;
    padding: 6rem 6rem 6rem 6.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #ffffff;
    z-index: 5;
}

.webDevEyebrow {
    margin: 0;
    font-family: "Inter", sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #ffffff;
}

.webDevEyebrowLine {
    width: 6rem;
    height: 2px;
    margin: 1rem 0 3.4rem;
    background: #a95738;
    box-shadow: 0 0 1rem rgba(169, 87, 56, 0.28);
}

.webDevHeading {
    margin: 0;
    display: flex;
    flex-direction: column;
}

.webDevHeadingMain {
    font-family: "Anton", sans-serif;
    font-size: clamp(5rem, 5vw, 7.2rem);
    font-weight: 400;
    line-height: 0.95;
    color: #ffffff;
}

.webDevHeadingAccent {
    margin-top: 1rem;
    font-family: "Cormorant Garamond", serif;
    font-size: clamp(5.6rem, 5.5vw, 7.8rem);
    font-style: italic;
    font-weight: 600;
    line-height: 0.9;
    color: #a95738;
}

.webDevText {
    max-width: 50rem;
    margin: 3.5rem 0 0;
    font-family: "Inter", sans-serif;
    font-size: 1.75rem;
    line-height: 1.7;
    color: #ffffff;
}

.webDevActions {
    margin-top: 4rem;
    display: flex;
    align-items: center;
    gap: 2rem;
}

.webDevPrimaryButton,
.webDevArrowButton {
    width: 23rem;
    height: 5.4rem;
    box-sizing: border-box;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0 2.4rem;
    border-radius: 0.8rem;

    font-family: "Inter", sans-serif;
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    text-decoration: none;

    transition:
        transform 500ms cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 220ms ease,
        background 220ms ease;
}

.webDevPrimaryButton {
    background: #a95738;
    color: #fff;

    box-shadow:
        0 1rem 2rem rgba(30, 33, 36, 0.24),
        0 0 2rem rgba(169, 87, 56, 0.1);
}

.webDevArrowButton {
    background: #fff;
    color: #a95738;

    box-shadow:
        0 1rem 2rem rgba(30, 33, 36, 0.22);
}

.webDevPrimaryButton:hover {
    transform: translateY(-0.3rem);
    background: #b96647;

    box-shadow:
        0 1.5rem 2.8rem rgba(30, 33, 36, 0.3),
        0 0 2.4rem rgba(169, 87, 56, 0.16);
}

.webDevActions.isSwitched .webDevArrowButton {
    transform: translateX(-25rem);
}

.webDevActions.isSwitched .webDevPrimaryButton {
    transform: translateX(25rem);
}

@media (hover: none) and (pointer: coarse) {
.webDevArrowButton,
.webDevPrimaryButton {
transition:
transform 520ms cubic-bezier(0.22, 1, 0.36, 1),
box-shadow 220ms ease,
background 220ms ease;
}

.webDevArrowButton.webDevTouchBounce {
scale: 0.92;
rotate: -2deg;
}

.webDevPrimaryButton.webDevTouchBounce {
scale: 1.04;
rotate: 1deg;
}
}

.webDevMedia {
    position: relative;
    margin: 3rem 3rem 3rem 0;
    min-height: 49rem;
    overflow: visible;
    border-radius: 2.4rem;
    background: #272c31;
    z-index: 4;
    isolation: isolate;
}

.webDevMedia::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: #272c31;
    z-index: 1;
    pointer-events: none;
}

.webDevVideo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: inherit;
    z-index: 2;
}

.webDevMediaShade {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            to bottom,
            rgba(63, 69, 76, 0.03),
            rgba(63, 69, 76, 0.2)
        );
    pointer-events: none;
    z-index: 2;
}

.webDevPlayButton {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 9rem;
    height: 9rem;
    transform: translate(-50%, -50%);
    display: none;
    place-items: center;
    border: 1px solid rgba(210, 208, 204, 0.18);
    border-radius: 50%;
    background: rgba(169, 87, 56, 0.94);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow:
        0 1rem 3rem rgba(30, 33, 36, 0.32),
        0 0 2rem rgba(169, 87, 56, 0.08);
    cursor: pointer;
    z-index: 5;
    transition:
        transform 220ms ease,
        background 220ms ease,
        box-shadow 220ms ease;
}

.webDevPlayButton:hover {
    transform:
        translate(-50%, -50%)
        scale(1.07);
    background: rgba(169, 87, 56, 0.94);
    box-shadow:
        0 1rem 3rem rgba(30, 33, 36, 0.34),
        0 0 2.6rem rgba(169, 87, 56, 0.26);
}

.webDevPlayIcon {
    width: 0;
    height: 0;
    margin-left: 0.6rem;
    border-top: 1.4rem solid transparent;
    border-bottom: 1.4rem solid transparent;
    border-left: 2.2rem solid #fff;
}

.webDevGlow {
    position: absolute;
    left: 42%;
    bottom: -13rem;
    width: 42rem;
    height: 42rem;
    border-radius: 50%;
    background:
        radial-gradient(
            circle at center,
            rgba(169, 87, 56, 0.32) 0%,
            rgba(169, 87, 56, 0.14) 34%,
            rgba(210, 208, 204, 0.06) 52%,
            transparent 72%
        );
    filter: blur(1.4rem);
    pointer-events: none;
    z-index: 1;
}

.webDevOrbit {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 6;
}

.webDevOrbitOne {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 86rem;
    height: 42rem;
    transform:
        translate(-50%, -50%)
        rotate(-18deg);
    border-radius: 50%;
    background:
        conic-gradient(
            from 0deg,
            #a95738 0deg,
            #c07252 45deg,
            #d2d0cc 95deg,
            #eceae6 125deg,
            #d2d0cc 155deg,
            #74777c 185deg,
            #a95738 215deg,
            #8e4933 250deg,
            #d2d0cc 300deg,
            #eceae6 330deg,
            #a95738 360deg
        );
    padding: 0.55rem;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    filter:
        drop-shadow(0 0 0.8rem rgba(210, 208, 204, 0.62))
        drop-shadow(0 0 1.8rem rgba(169, 87, 56, 0.58))
        drop-shadow(0 0 3rem rgba(169, 87, 56, 0.2));
    pointer-events: none;
    z-index: 0;
    animation: webDevHaloOrbit 8s ease-in-out infinite alternate;
}

.webDevOrbitOne::after {
    content: "";
    position: absolute;
    inset: -1.2rem;
    border-radius: inherit;
    background:
        conic-gradient(
            from 0deg,
            rgba(169, 87, 56, 0.72) 0deg,
            rgba(169, 87, 56, 0.4) 55deg,
            rgba(210, 208, 204, 0.55) 105deg,
            rgba(232, 230, 226, 0.72) 130deg,
            rgba(210, 208, 204, 0.5) 160deg,
            rgba(116, 119, 124, 0.34) 190deg,
            rgba(169, 87, 56, 0.42) 215deg,
            rgba(169, 87, 56, 0.68) 255deg,
            rgba(210, 208, 204, 0.5) 305deg,
            rgba(232, 230, 226, 0.68) 335deg,
            rgba(169, 87, 56, 0.72) 360deg
        );
    padding: 1.4rem;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    filter: blur(1.2rem);
    opacity: 0.92;
    pointer-events: none;
    z-index: -1;
}

@keyframes webDevHaloOrbit {
    0% {
        transform:
            translate(-50%, -50%)
            rotate(-18deg)
            scaleX(1)
            scaleY(1);
    }

    50% {
        transform:
            translate(-50%, -50%)
            rotate(-14deg)
            scaleX(1.04)
            scaleY(0.96);
    }

    100% {
        transform:
            translate(-50%, -50%)
            rotate(-20deg)
            scaleX(0.98)
            scaleY(1.03);
    }
}

.webDevOrbitTwo {
    left: 44%;
    bottom: -10rem;
    width: 27rem;
    height: 27rem;
    border: 1px solid rgba(169, 87, 56, 0.28);
    transform: rotate(-12deg);
    opacity: 0.75;
    box-shadow:
        0 0 2rem rgba(169, 87, 56, 0.12);
}




.folder {
position: relative;
width: 100%;
padding:
4.8rem
4.8rem;
overflow: hidden;
}

.folderHalo {
position: absolute;
left: 72%;
top: 52%;
width: 170rem;
height: 100rem;
transform: translate(-50%, -50%) rotate(-28deg);
pointer-events: none;
z-index: 1;
}

.folderHaloRing {
position: absolute;
left: 50%;
top: 50%;
border: 0.5rem solid rgba(169, 87, 56, 0.48);
border-radius: 50%;
transform: translate(-50%, -50%);
transform-origin: center;
box-shadow: 0 0 2.5rem rgba(169, 87, 56, 0.16);
}

.folderHaloRingOne {
width: 90rem;
height: 48rem;
animation: folderHaloPulseOne 5.5s ease-in-out infinite;
}

.folderHaloRingTwo {
width: 125rem;
height: 68rem;
border-color: rgba(169, 87, 56, 0.32);
animation: folderHaloPulseTwo 5.5s ease-in-out 0.6s infinite;
}

.folderHaloRingThree {
width: 160rem;
height: 90rem;
border-color: rgba(169, 87, 56, 0.2);
animation: folderHaloPulseThree 5.5s ease-in-out 1.2s infinite;
}

@keyframes folderHaloPulseOne {
0%, 100% {
transform: translate(-50%, -50%) scale(0.94);
opacity: 0.55;
}
50% {
transform: translate(-50%, -50%) scale(1.06);
opacity: 1;
}
}

@keyframes folderHaloPulseTwo {
0%, 100% {
transform: translate(-50%, -50%) scale(0.92);
opacity: 0.45;
}
50% {
transform: translate(-50%, -50%) scale(1.08);
opacity: 0.9;
}
}

@keyframes folderHaloPulseThree {
0%, 100% {
transform: translate(-50%, -50%) scale(0.9);
opacity: 0.35;
}
50% {
transform: translate(-50%, -50%) scale(1.1);
opacity: 0.8;
}
}

.folder::before {
content: "";
position: absolute;
inset: 0;
background-image: url("/imgs/folderBackground.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
opacity: 0.5;
pointer-events: none;
z-index: 0;
}

.folderCornerImg {
position: absolute;
top: -7rem;
left: -5rem;
width: 31rem;
height: auto;
object-fit: contain;
transform:
rotate(110deg);
transform-origin: center;
z-index: 4;
pointer-events: none;
user-select: none;
filter:
drop-shadow(
0 1.5rem 2rem
rgba(63, 69, 76, 0.20)
);
}

.folderBox {
position: relative;
width: min(170rem, 100%);
margin: 0 auto;
z-index: 2;
}

.folderContainer {
position: relative;
width: 100%;
min-height: 72rem;
display: grid;
grid-template-columns:
minmax(0, 1.35fr)
minmax(36rem, 0.65fr);
align-items: center;
gap: clamp(5rem, 7vw, 12rem);
}

.folderContent {
position: relative;
width: 100%;
max-width: 48rem;
display: flex;
flex-direction: column;
align-items: flex-start;
z-index: 10;
}

.folderEyebrow {
position: relative;
display: inline-flex;
padding-bottom: 1.2rem;
font-family:
"Inter",
sans-serif;
font-size: 1.15rem;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
color: #a95738;
}

.folderEyebrow::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 0.25rem;
background: #a95738;
}

.folderHeading {
margin:
4rem
0
0;
display: flex;
flex-direction: column;
align-items: flex-start;
line-height: 1;
}

.folderHeadingScript {
position: relative;
font-family:
"Cormorant Garamond",
serif;
font-size:
clamp(
5.2rem,
5vw,
7.2rem
);
font-weight: 500;
font-style: italic;
line-height: 0.9;
color: #a95738;
}

.folderHeadingMain {
margin-top: 1.3rem;
font-family:
"Anton",
sans-serif;
font-size:
clamp(
5.4rem,
5vw,
7.4rem
);
font-weight: 400;
line-height: 0.95;
letter-spacing: -0.02em;
color: #3f454c;
}

.folderHeadingLine {
width: 5rem;
height: 0.25rem;
margin:
4.5rem
auto
0;
align-self: center;
background:
rgba(169, 87, 56, 0.45);
}

.folderDescription {
max-width: 40rem;
margin:
4rem
0
0;
font-family:
"Inter",
sans-serif;
font-size:
clamp(
1.6rem,
1.35vw,
2rem
);
font-weight: 400;
line-height: 1.75;
color: #3f454c;
}

.folderButton {
min-width: 23rem;
margin-top: 5rem;
padding:
1.8rem
2.5rem;
display: inline-flex;
align-items: center;
justify-content: space-between;
gap: 3rem;
border-radius: 0.7rem;
background:
linear-gradient(
135deg,
#8f452f,
#a95738
);
box-shadow:
0 1.2rem 2.5rem
rgba(169, 87, 56, 0.16);
font-family:
"Inter",
sans-serif;
font-size: 1.5rem;
font-weight: 600;
text-decoration: none;
color: #ffffff;
transition:
transform 220ms ease,
box-shadow 220ms ease;
}

.folderButtonArrow {
display: inline-block;
font-size: 2.2rem;
font-weight: 300;
line-height: 1;
transition:
transform 220ms ease;
}

.folderButton:hover {
transform:
translateY(-0.3rem);
box-shadow:
0 1.7rem 3rem
rgba(169, 87, 56, 0.24);
}

.folderButton:hover .folderButtonArrow {
transform:
translateX(0.5rem);
}

.folderVisual {
position: relative;
width: 100%;
min-height: 70rem;
display: flex;
align-items: center;
justify-content: center;
perspective: 140rem;
transform-style: preserve-3d;
isolation: isolate;
}

.folderVisualGlow {
position: absolute;
left: 50%;
bottom: 2rem;
width: 74rem;
height: 32rem;
transform:
translateX(-50%);
border-radius: 50%;
background:
radial-gradient(
ellipse at center,
rgba(169, 87, 56, 0.22) 0%,
rgba(169, 87, 56, 0.11) 35%,
rgba(169, 87, 56, 0.035) 58%,
transparent 78%
);
filter: blur(2.2rem);
pointer-events: none;
z-index: 0;
}

.folderVisualRing {
position: absolute;
left: 50%;
bottom: 5.5rem;
width: 72rem;
height: 25rem;
transform: translateX(-50%);
border: 1.5rem solid #a95738;
border-radius: 50%;
box-shadow:
inset 0 0.35rem 0 rgba(210, 208, 204, 0.18),
inset 0 -0.7rem 1rem rgba(63, 69, 76, 0.45),
0 0.8rem 0 #84402d,
0 1.3rem 0 #3f454c,
0 2rem 2.8rem rgba(63, 69, 76, 0.28);
z-index: 2;
pointer-events: none;
}

.folderVisualInnerRing {
position: absolute;
left: 50%;
bottom: 6.5rem;
width: 68rem;
height: 22rem;
transform: translateX(-50%);
border-radius: 50%;
pointer-events: none;
z-index: 3;
}

.folderVisualInnerRing::before {
content: "";
position: absolute;
inset: 0;
border-radius: 50%;
border: 0.45rem solid rgba(210, 208, 204, 0.95);
box-shadow:
0 0 0.5rem rgba(210, 208, 204, 0.95),
0 0 1.2rem rgba(210, 208, 204, 0.85),
0 0 2.4rem rgba(210, 208, 204, 0.45);
filter: brightness(1.15);
pointer-events: none;
}

.folderVisualInnerRing::after {
content: "";
position: absolute;
left: 50%;
bottom: -0.15rem;
width: 100%;
height: 55%;
transform: translateX(-50%);
border-radius: 0 0 50% 50% / 0 0 100% 100%;
border-bottom: 0.55rem solid #dedcd8;
box-shadow:
0 0 0.7rem rgba(210, 208, 204, 1),
0 0 1.6rem rgba(210, 208, 204, 0.85),
0 0 3rem rgba(210, 208, 204, 0.5);
pointer-events: none;
}

.folderVisualDots {
position: absolute;
left: 50%;
bottom: 0;
width: 82rem;
height: 32rem;
transform: translateX(-50%);
border: 0.25rem dotted rgba(210, 208, 204, 0.9);
border-radius: 50%;
z-index: 1;
pointer-events: none;
}

.folderCard {
position: absolute;
left: 50%;
top: 50%;
border:
1px
solid
rgba(116, 119, 124, 0.16);
border-radius: 2rem;
background: #fff;
box-shadow:
0 2rem 4rem rgba(63, 69, 76, 0.12),
0 0.6rem 1.6rem rgba(63, 69, 76, 0.06);
transform-style: preserve-3d;
transform-origin: center bottom;
overflow: hidden;
cursor: pointer;
transition:
transform 0.85s cubic-bezier(0.22, 1, 0.36, 1),
width 0.85s cubic-bezier(0.22, 1, 0.36, 1),
height 0.85s cubic-bezier(0.22, 1, 0.36, 1),
padding 0.85s cubic-bezier(0.22, 1, 0.36, 1),
box-shadow 0.6s ease;
will-change: transform;
}

.folderCard::before {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(
circle at 20% 30%,
rgba(116, 119, 124, 0.035) 0 1px,
transparent 1.5px
),
radial-gradient(
circle at 68% 70%,
rgba(210, 208, 204, 0.18) 0 1px,
transparent 1.5px
);
background-size:
2rem 2rem,
2.5rem 2.5rem;
opacity: 0.6;
pointer-events: none;
z-index: 0;
}

.folderCard.folderPositionCenter {
width: 38rem;
height: 52rem;
padding:
7rem
4rem
5rem;
transform:
translate(-50%, -50%)
translateX(0)
translateY(3rem)
translateZ(10rem)
rotateY(0deg)
rotateZ(0deg);
z-index: 10;
}

.folderCard.folderPositionLeft {
width: 25rem;
height: 39rem;
padding:
4rem
3rem;
transform:
translate(-50%, -50%)
translateX(-22rem)
translateY(2rem)
translateZ(-2rem)
rotateY(18deg)
rotateZ(-4deg);
z-index: 5;
}

.folderCard.folderPositionRight {
width: 25rem;
height: 39rem;
padding:
4rem
3rem;
transform:
translate(-50%, -50%)
translateX(22rem)
translateY(2rem)
translateZ(-2rem)
rotateY(-18deg)
rotateZ(4deg);
z-index: 5;
}

.folderCard.folderPositionBack {
width: 27rem;
height: 20rem;
padding: 3.5rem 3rem;
transform:
translate(-50%, -50%)
translateX(0)
translateY(-29rem)
translateZ(-4rem)
rotateY(0deg)
rotateZ(0deg);
z-index: 3;
overflow: hidden;
}
.folderCard.folderCardShake {
animation:
folderCardShake
0.28s
ease;
}

@keyframes folderCardShake {
0%,
100% {
translate: 0 0;
}
25% {
translate: -0.45rem 0;
}
50% {
translate: 0.4rem 0;
}
75% {
translate: -0.2rem 0;
}
}

.folderCardMain {
width: 38rem;
height: 52rem;
padding:
7rem
4rem
5rem;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
transform:
translate(-50%, -50%)
translateY(3rem)
translateZ(10rem);
z-index: 10;
overflow: visible;
border-radius: 13px;
}

.folderCardMainIcon {
position: relative;
width: 11rem;
height: 8rem;
margin-bottom: 3.2rem;
rotate: 180deg;
}

.folderCardMain.folderPositionBack .folderCardMainIcon {
    display: none;
}

.folderCardPerson {
position: absolute;
display: block;
background: #a95738;
}

.folderCardPerson::before {
content: "";
position: absolute;
left: 50%;
width: 3.8rem;
height: 3.8rem;
transform:
translateX(-50%);
border-radius: 50%;
background: #a95738;
}

.folderCardPerson::after {
content: "";
position: absolute;
left: 50%;
bottom: 0;
transform:
translateX(-50%);
width: 6.2rem;
height: 4rem;
border-radius:
3.2rem
3.2rem
0.8rem
0.8rem;
background: #a95738;
}

.folderCardPersonOne {
left: 1rem;
bottom: 0;
width: 5.5rem;
height: 6.2rem;
}

.folderCardPersonTwo {
right: 0.3rem;
bottom: -0.5rem;
width: 5.8rem;
height: 6.6rem;
}

.folderCardMainTitle {
position: relative;
margin: 0;
font-family:
"Cormorant Garamond",
serif;
font-size: 2.6rem;
font-weight: 700;
line-height: 0.96;
color: #a95738;
z-index: 2;
}

.folderCardMain.folderPositionCenter .folderCardMainTitle {
font-size: 4.6rem;
}

.folderCardMainDivider {
width: 5rem;
height: 0.3rem;
margin:
3rem
0
2.8rem;
background:
rgba(169, 87, 56, 0.35);
z-index: 2;
}

.folderCardMainText {
position: relative;
max-width: 26rem;
margin: 0;
font-family:
"Inter",
sans-serif;
font-size: 1.55rem;
line-height: 1.65;
color: #3f454c;
z-index: 2;
}

.folderCardBottomAccent {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 4rem;
overflow: hidden;
border-radius: 0 0 1.3rem 1.3rem;
background:
linear-gradient(
90deg,
#8b432f 0%,
#a95738 50%,
#8b432f 100%
);
z-index: 1;
}

.folderCardBottomAccent::before {
content: "";
position: absolute;
overflow: visible;
left: 50%;
top: -7.5rem;
width: 150%;
height: 10rem;
transform: translateX(-50%);
border-radius: 0 0 50% 50% / 0 0 100% 100%;
background: #fff;
z-index: 2;
}

.folderCardBadge {
position: absolute;
left: 50%;
bottom: -2.7rem;
width: 8rem;
height: 8rem;
transform:
translateX(-50%);
display: grid;
place-items: center;
border:
0.35rem
solid
#d2d0cc;
border-radius: 50%;
background:
linear-gradient(
145deg,
#914832,
#a95738
);
box-shadow:
0 1rem 2rem rgba(63, 69, 76, 0.18);
color: #ffffff;
font-family:
"Inter",
sans-serif;
font-size: 2.7rem;
font-weight: 700;
z-index: 5;
}

.folderCard .folderCardBottomAccent,
.folderCard .folderCardBadge {
opacity: 0;
visibility: hidden;
transition:
opacity 0.35s ease,
visibility 0.35s ease;
}

.folderCard.folderPositionCenter .folderCardBottomAccent,
.folderCard.folderPositionCenter .folderCardBadge {
opacity: 1;
visibility: visible;
}

.folderCard.folderPositionCenter {
align-items: center;
justify-content: flex-start;
text-align: center;
border-radius: 1.3rem;
overflow: visible;
background: #fff;
box-shadow:
0 3rem 5rem rgba(63, 69, 76, 0.18),
0 1rem 2rem rgba(63, 69, 76, 0.10);
}

.folderCard.folderPositionCenter .folderCardIcon {
width: 9rem;
height: 8rem;
margin-bottom: 3rem;
font-size: 4rem;
display: grid;
place-items: center;
color: #a95738;
}

.folderCard.folderPositionCenter .folderCardSmallTitle {
margin: 0;
font-family:
"Cormorant Garamond",
serif;
font-size: 4.6rem;
font-weight: 700;
line-height: 0.96;
color: #a95738;
}

.folderCard.folderPositionCenter .folderCardDivider {
width: 5rem;
height: 0.3rem;
margin:
3rem
0
2.8rem;
background:
rgba(169, 87, 56, 0.35);
}

.folderCard.folderPositionCenter .folderCardSmallText {
max-width: 26rem;
margin: 0;
font-family:
"Inter",
sans-serif;
font-size: 1.55rem;
line-height: 1.65;
color: #3f454c;
}

.folderCardMessaging,
.folderCardReviews {
width: 25rem;
height: 39rem;
padding:
4rem
3rem;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}

.folderCardMessaging {
transform:
translate(-50%, -50%)
translateX(-22rem)
translateY(2rem)
translateZ(-2rem)
rotateY(18deg)
rotateZ(-4deg);
z-index: 5;
}

.folderCardReviews {
transform:
translate(-50%, -50%)
translateX(22rem)
translateY(2rem)
translateZ(-2rem)
rotateY(-18deg)
rotateZ(4deg);
z-index: 5;
}

.folderCardPlanning {
width: 27rem;
height: 20rem;
padding:
3.5rem
3rem;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
transform:
translate(-50%, -50%)
translateY(-29rem)
translateZ(-4rem);
z-index: 3;
}

.folderCardIcon {
position: relative;
width: 6rem;
height: 6rem;
margin-bottom: 1.8rem;
display: grid;
place-items: center;
font-family:
"Inter",
sans-serif;
font-size: 3rem;
font-weight: 700;
color: #a95738;
z-index: 2;
}

.folderCardSmallTitle {
position: relative;
margin: 0;
font-family:
"Cormorant Garamond",
serif;
font-size: 2.3rem;
font-weight: 700;
line-height: 1.05;
color: #a95738;
z-index: 2;
}

.folderCardDivider {
width: 4rem;
height: 0.25rem;
margin:
2.2rem
0;
background:
rgba(169, 87, 56, 0.25);
z-index: 2;
}

.folderCardSmallText {
position: relative;
max-width: 15rem;
margin: 0;
font-family:
"Inter",
sans-serif;
font-size: 1.15rem;
line-height: 1.7;
color: #3f454c;
z-index: 2;
}

.footerHero {
position: relative;
width: 100%;
min-height: 62rem;
display: flex;
flex-direction: column;
justify-content: flex-end;
overflow: hidden;
background-image:
url("/imgs/footerBackground.jpg");
background-repeat: no-repeat;
background-position-y:
55%;
background-size: cover;
isolation: isolate;
}

.footerHeroOverlay {
position: absolute;
inset: 0;
background:
linear-gradient(
to bottom,
transparent 0%,
transparent 30%,
rgba(169, 87, 56, 0.08) 38%,
rgba(169, 87, 56, 0.55) 47%,
rgba(169, 87, 56, 0.92) 58%,
#a95738 72%,
#a95738 100%
);
pointer-events: none;
z-index: 0;
}

.footerHeroContent {
position: relative;
width: min(150rem, calc(100% - 8rem));
margin: 0 auto;
padding:
6rem
0
5rem;
display: grid;
grid-template-columns:
1fr
1px
1.4fr
1px
1fr;
align-items: center;
gap: clamp(4rem, 6vw, 9rem);
color: #ffffff;
z-index: 3;
}

.footerHeroDivider {
width: 1px;
height: 20rem;
background:
rgba(210, 208, 204, 0.2);
}

.footerHeroLinks {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 1.3rem;
}

.footerHeroLinks > a {
position: relative;
font-family:
"Inter",
sans-serif;
font-size: 1.2rem;
font-weight: 600;
color: #ffffff;
text-decoration: none;
transition:
transform 200ms ease,
color 200ms ease;
}

.footerHeroLinks > a:hover {
transform:
translateX(0.5rem);
color: #ffffff;
}

.footerHeroSocials {
margin-top: 2rem;
display: flex;
align-items: center;
gap: 1rem;
}

.footerHeroSocials a {
width: 3.6rem;
height: 3.6rem;
display: grid;
place-items: center;
border:
1px
solid
rgba(210, 208, 204, 0.55);
border-radius: 50%;
font-family:
"Inter",
sans-serif;
font-size: 1.5rem;
font-weight: 700;
text-decoration: none;
color: #ffffff;
transition:
background 200ms ease,
color 200ms ease,
transform 200ms ease;
}

.footerHeroSocials a:hover {
transform:
translateY(-0.3rem);
background: #d2d0cc;
color: #a95738;
}

.footerHeroNewsletter {
max-width: 44rem;
margin: 0 auto;
text-align: center;
}

.footerHeroEyebrow {
margin-bottom: 0.8rem;
font-family:
"Inter",
sans-serif;
font-size: 0.95rem;
font-weight: 700;
letter-spacing: 0.15em;
text-transform: uppercase;
color:
#ffffff;
}

.footerHeroHeading {
margin: 0;
font-family:
"Cormorant Garamond",
serif;
font-size: 4rem;
font-weight: 600;
line-height: 1;
color: #ffffff;
}

.footerHeroText {
max-width: 34rem;
margin:
1.2rem
auto
2.5rem;
font-family:
"Cormorant Garamond",
serif;
font-size: 1.5rem;
font-style: italic;
line-height: 1.5;
color:
#ffffff;
}

.footerHeroForm {
display: flex;
flex-direction: column;
gap: 1rem;
}

.footerHeroForm input {
width: 100%;
height: 4.3rem;
padding:
0
1.4rem;
border:
1px
solid
rgba(210, 208, 204, 0.5);
border-radius: 0.3rem;
background:
rgba(210, 208, 204, 0.035);
outline: none;
font-family:
"Inter",
sans-serif;
font-size: 1.1rem;
color: #ffffff;
transition:
border-color 200ms ease,
background 200ms ease;
}

.footerHeroForm input::placeholder {
color:
#ffffff;
}

.footerHeroForm input:focus {
border-color: #ffffff;
background:
rgba(210, 208, 204, 0.07);
}

.footerHeroFormRow {
display: grid;
grid-template-columns:
1fr
auto;
gap: 1rem;
}

.footerHeroForm button {
min-width: 10rem;
padding:
0
1.8rem;
border: 0;
border-radius: 0.3rem;
background: #d2d0cc;
font-family:
"Inter",
sans-serif;
font-size: 1rem;
font-weight: 800;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #a95738;
cursor: pointer;
transition:
transform 200ms ease,
background 200ms ease;
}

.footerHeroForm button:hover {
transform:
translateY(-0.2rem);
background: #d2d0cc;
}

.footerHeroContact {
display: flex;
flex-direction: column;
align-items: flex-end;
text-align: right;
}

.footerHeroMessage {
display: flex;
align-items: center;
gap: 1.3rem;
font-family:
"Inter",
sans-serif;
font-size: 1.15rem;
font-weight: 700;
text-decoration: none;
color: #ffffff;
}

.footerHeroMessage span:last-child {
font-size: 1.8rem;
transition:
transform 200ms ease;
}

.footerHeroMessage:hover span:last-child {
transform:
translateX(0.5rem);
}

.footerHeroContactDetails {
margin-top: 4rem;
font-family:
"Inter",
sans-serif;
font-size: 1.1rem;
line-height: 1.8;
color:
#ffffff;
}

.footerHeroContactDetails a {
display: inline-block;
margin-bottom: 1rem;
color: #ffffff;
text-decoration: none;
font-weight: 700;
}

.footerHeroBottom {
position: relative;
width: 100%;
min-height: 6rem;
padding:
0
5rem;
display: flex;
align-items: center;
justify-content: space-between;
border-top:
1px
solid
rgba(210, 208, 204, 0.08);
background:
rgba(63, 69, 76, 0.16);
font-family:
"Inter",
sans-serif;
font-size: 0.9rem;
color:
#ffffff;
z-index: 4;
}

.footerHeroBottomLinks {
display: flex;
align-items: center;
gap: 2rem;
}

.footerHeroBottomLinks a {
color:
#ffffff;
text-decoration: none;
transition:
color 200ms ease;
}

.footerHeroBottomLinks a:hover {
color: #ffffff;
}

.googleProfile {
position: relative;
width: 100%;
min-height: 74rem;
overflow: hidden;
background: #d2d0cc;
isolation: isolate;
}

.googleProfileContainer {
position: relative;
width: min(170rem, calc(100% - 7rem));
min-height: 74rem;
margin: 0 auto;
z-index: 10;
}

.googleProfileBg {
position: absolute;
inset: 0;
overflow: hidden;
pointer-events: none;
z-index: 0;
}

.googleProfileBgBurgundy {
position: absolute;
inset: 0 28% 0 0;
background:
radial-gradient(
circle at 28% 35%,
rgba(169, 87, 56, 0.3),
transparent 38%
),
radial-gradient(
circle at 65% 65%,
rgba(210, 208, 204, 0.12),
transparent 42%
),
linear-gradient(
135deg,
#3f454c 0%,
#744737 35%,
#a95738 68%,
#744737 100%
);
z-index: 1;
}

.googleProfileBgBurgundy::before {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(
ellipse at center,
transparent 35%,
rgba(63, 69, 76, 0.32) 100%
);
pointer-events: none;
}

.googleProfileBgBurgundy::after {
content: "";
position: absolute;
inset: 0;
opacity: 0.16;
background-image:
radial-gradient(
circle,
rgba(210, 208, 204, 0.2) 0 0.7px,
transparent 0.9px
);
background-size: 1.8rem 1.8rem;
mix-blend-mode: soft-light;
pointer-events: none;
}

.googleProfileBgCream {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 32%;
background:
radial-gradient(
circle at 62% 28%,
#dedcd8 0%,
#d2d0cc 42%,
#c3c2bf 100%
);
z-index: 1;
}

.googleProfileBgCurve {
position: absolute;
top: -18%;
left: 69%;
width: 44rem;
height: 145%;
transform: translateX(-50%) rotate(8deg);
border-radius: 55% 0 0 55% / 50% 0 0 50%;
background:
linear-gradient(
90deg,
rgba(143, 69, 47, 0.95) 0%,
rgba(169, 87, 56, 0.72) 28%,
rgba(210, 208, 204, 0.14) 75%,
rgba(210, 208, 204, 0) 100%
);
filter: blur(0.2rem);
opacity: 0.7;
z-index: 2;
}

.googleProfileBgCurve::after {
content: "";
position: absolute;
top: 0;
right: 2.5rem;
width: 0.25rem;
height: 100%;
background:
linear-gradient(
to bottom,
transparent 0%,
rgba(210, 208, 204, 0.2) 10%,
rgba(210, 208, 204, 0.75) 35%,
rgba(169, 87, 56, 0.85) 58%,
rgba(210, 208, 204, 0.6) 78%,
transparent 100%
);
box-shadow: 0 0 1rem rgba(169, 87, 56, 0.35);
border-radius: 999px;
}

.googleProfileOrbit {
position: absolute;
border-radius: 50%;
pointer-events: none;
}

.googleProfileOrbitOne {
left: 35%;
top: -24rem;
width: 98rem;
height: 91rem;
transform: rotate(-13deg);
border: 0.35rem solid rgba(169, 87, 56, 0.55);
box-shadow: 0 0 1rem rgba(169, 87, 56, 0.22);
z-index: 3;
}

.googleProfileOrbitTwo {
left: 29%;
bottom: -42rem;
width: 104rem;
height: 70rem;
transform: rotate(-12deg);
border: 0.45rem solid rgba(210, 208, 204, 0.8);
box-shadow:
0 0 0.8rem rgba(210, 208, 204, 0.65),
0 0 2rem rgba(169, 87, 56, 0.35);
z-index: 4;
}

.googleProfileOrbitThree {
left: 47%;
bottom: -33rem;
width: 85rem;
height: 60rem;
transform: rotate(-16deg);
border: 0.15rem solid rgba(210, 208, 204, 0.52);
z-index: 4;
}

.googleProfileMapTexture {
position: absolute;
top: 0;
right: 0;
width: 41%;
height: 100%;
opacity: 0.22;
background-image:
linear-gradient(
28deg,
transparent 46%,
rgba(116, 119, 124, 0.16) 47%,
rgba(116, 119, 124, 0.16) 48%,
transparent 49%
),
linear-gradient(
-37deg,
transparent 47%,
rgba(116, 119, 124, 0.13) 48%,
rgba(116, 119, 124, 0.13) 49%,
transparent 50%
),
linear-gradient(
74deg,
transparent 48%,
rgba(116, 119, 124, 0.1) 49%,
rgba(116, 119, 124, 0.1) 50%,
transparent 51%
);
background-size:
13rem 13rem,
16rem 16rem,
21rem 21rem;
mask-image:
linear-gradient(
to left,
#000 0%,
#000 72%,
transparent 100%
);
-webkit-mask-image:
linear-gradient(
to left,
#000 0%,
#000 72%,
transparent 100%
);
z-index: 2;
}

.googleProfileContent {
position: relative;
width: 52%;
min-height: 74rem;
padding: 5.8rem 0 1.8rem;
display: grid;
grid-template-columns: minmax(0, 51rem) 15rem;
grid-template-rows: 1fr auto;
column-gap: 5.5rem;
align-items: center;
color: #ffffff;
z-index: 10;
}

.googleProfileIntro {
width: 51rem;
align-self: start;
}

.googleProfileEyebrow {
position: relative;
display: inline-flex;
padding-bottom: 1.3rem;
font-family: "Inter", sans-serif;
font-size: 1.5rem;
font-weight: 700;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #ffffff;
}

.googleProfileEyebrow::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 7.8rem;
height: 0.28rem;
border-radius: 999px;
background: rgba(210, 208, 204, 0.92);
}

.googleProfileHeading {
margin: 4.6rem 0 0;
display: flex;
flex-direction: column;
align-items: flex-start;
line-height: 1;
}

.googleProfileHeadingMain {
font-family: "Anton", sans-serif;
font-size: 7rem;
font-weight: 400;
line-height: 0.98;
letter-spacing: -0.025em;
white-space: nowrap;
color: #ffffff;
}

.googleProfileHeadingAccent {
margin-top: 0.5rem;
font-family: "Cormorant Garamond", serif;
font-size: 7rem;
font-weight: 500;
font-style: italic;
line-height: 0.95;
letter-spacing: -0.03em;
white-space: nowrap;
color: #ffffff;
}

.googleProfileText {
max-width: 46rem;
margin: 2.6rem 0 0;
font-family: "Inter", sans-serif;
font-size: 1.9rem;
font-weight: 400;
line-height: 1.7;
color: #ffffff;
}

.googleProfileButton {
min-width: 28.5rem;
margin-top: 3rem;
padding: 1.65rem 2.3rem;
display: inline-flex;
align-items: center;
justify-content: space-between;
gap: 3rem;
border: 1px solid rgba(210, 208, 204, 0.38);
border-radius: 0.8rem;
background: #fff;
box-shadow:
0 1.2rem 2.8rem rgba(63, 69, 76, 0.18),
0 0.2rem 0.5rem rgba(63, 69, 76, 0.08);
font-family: "Inter", sans-serif;
font-size: 1.55rem;
font-weight: 800;
letter-spacing: 0.035em;
text-transform: uppercase;
text-decoration: none;
color: #a95738;
transition:
transform 220ms ease,
box-shadow 220ms ease,
background 220ms ease;
}

.googleProfileButton:hover {
transform: translateY(-0.3rem);
background: #dedcd8;
box-shadow:
0 1.8rem 3.6rem rgba(63, 69, 76, 0.24),
0 0.4rem 0.8rem rgba(63, 69, 76, 0.1);
}

.googleProfileButtonArrow {
display: inline-block;
font-size: 2.8rem;
font-weight: 300;
line-height: 1;
transition: transform 220ms ease;
}

.googleProfileButton:hover .googleProfileButtonArrow {
transform: translateX(0.5rem);
}

.googleProfileBusinessMini {
position: relative;
align-self: center;
min-height: 27rem;
padding-left: 3.7rem;
display: flex;
flex-direction: column;
justify-content: center;
gap: 2rem;
transform: translate(-1.5rem, -2rem);
}

.googleProfileBusinessMini::before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 1px;
height: 24rem;
transform: translateY(-50%);
background:
linear-gradient(
to bottom,
transparent 0%,
rgba(210, 208, 204, 0.35) 15%,
rgba(210, 208, 204, 0.28) 85%,
transparent 100%
);
}

.googleProfileGoogleIcon {
position: relative;
width: 7rem;
height: 7rem;
flex: 0 0 7rem;
display: grid;
place-items: center;
}

.googleProfileGoogleIcon img {
width: 6.5rem !important;
height: 6.5rem !important;
max-width: 6.5rem !important;
max-height: 6.5rem !important;
display: block;
object-fit: contain;
}

.googleProfileBusinessMiniText {
display: flex;
flex-direction: column;
font-family: "Inter", sans-serif;
font-size: 2.2rem;
font-weight: 600;
line-height: 1.12;
color: #ffffff;
}

.googleProfileBenefits {
position: absolute;
left: 0;
bottom: 1.7rem;
grid-column: 1 / -1;
width: 82rem;
min-height: 9.6rem;
margin: 0;
padding: 1.2rem 1.6rem;
display: grid;
grid-template-columns: repeat(3, 1fr) 7rem;
align-items: center;
border: 1px solid rgba(210, 208, 204, 0.2);
border-radius: 1.4rem;
background:
linear-gradient(
135deg,
rgba(63, 69, 76, 0.56),
rgba(116, 119, 124, 0.38)
);
backdrop-filter: blur(1.4rem);
-webkit-backdrop-filter: blur(1.4rem);
box-shadow:
inset 0 1px 0 rgba(210, 208, 204, 0.07),
0 1.6rem 3rem rgba(63, 69, 76, 0.12);
}

.googleProfileBenefit {
min-height: 6.2rem;
padding: 0 1.8rem;
display: grid;
grid-template-columns: 4.8rem 1fr;
align-items: center;
gap: 1.3rem;
}

.googleProfileBenefit + .googleProfileBenefit {
border-left: 1px solid rgba(210, 208, 204, 0.2);
}

.googleProfileBenefitIcon {
width: 4.6rem;
height: 4.6rem;
display: grid;
place-items: center;
border: 1px solid rgba(210, 208, 204, 0.45);
border-radius: 50%;
background: rgba(210, 208, 204, 0.03);
box-shadow:
inset 0 0 1.4rem rgba(210, 208, 204, 0.03);
font-family: "Inter", sans-serif;
font-size: 2.2rem;
color: #ffffff;
}

.googleProfileBenefitCopy {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.55rem;
}

.googleProfileBenefitCopy strong {
font-family: "Inter", sans-serif;
font-size: 1.45rem;
font-weight: 700;
color: #ffffff;
}

.googleProfileBenefitCopy span {
max-width: 16rem;
font-family: "Inter", sans-serif;
font-size: 1.15rem;
font-weight: 400;
line-height: 1.45;
color: #ffffff;
}

.googleProfileBenefitEnd {
height: 100%;
display: grid;
place-items: center;
border-left: 1px solid rgba(210, 208, 204, 0.2);
font-family: "Inter", sans-serif;
font-size: 2.8rem;
color: #ffffff;
}

.googleProfileListing {
position: absolute;
top: 4rem;
left: 55.2%;
width: 46.5rem;
min-height: 0;
overflow: visible;
border: 1px solid rgba(116, 119, 124, 0.16);
border-radius: 1.9rem;
background: #fff;
box-shadow:
0 3rem 6rem rgba(63, 69, 76, 0.2),
0 1rem 2.5rem rgba(63, 69, 76, 0.12),
inset 0 1px 0 rgba(222, 220, 216, 0.88);
z-index: 20;
}

.googleProfileListingImageWrap {
position: relative;
width: calc(100% - 1.8rem);
height: 17.8rem;
margin: 0.9rem auto 0;
overflow: visible;
border-radius: 1.5rem;
}

.googleProfileListingImage {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
border-radius: 1.5rem;
filter:
saturate(0.88)
contrast(1.03);
}

.googleProfileListingBrand {
position: absolute;
left: 2.4rem;
bottom: -2rem;
width: 8rem;
height: 8rem;
display: grid;
place-items: center;
border: 0.15rem solid #8f452f;
border-radius: 50%;
box-shadow:
0 1.3rem 2.8rem rgba(63, 69, 76, 0.16);
z-index: 3;
}

.googleProfileListingBrandMark {
font-family: "Inter", sans-serif;
font-size: 4.2rem;
font-weight: 800;
line-height: 1;

    width: 100%;
   
align-self: center;
justify-self: center;

}

.googleProfileListingBody {
position: relative;
padding: 1.8rem 1.9rem 0;
z-index: 4;
}

.googleProfileListingHeader {
position: relative;
padding-left: 0.4rem;
z-index: 5;
}

.googleProfileListingTitle {
position: relative;
margin: 0;
font-family: "Inter", sans-serif;
font-size: 3rem;
font-weight: 700;
line-height: 1.15;
letter-spacing: -0.025em;
color: #3f454c;
z-index: 6;
}

.googleProfileListingRatingRow {
margin-top: 0.8rem;
display: flex;
align-items: center;
gap: 0.8rem;
font-family: "Inter", sans-serif;
}

.googleProfileListingRatingRow strong {
font-size: 1.7rem;
font-weight: 500;
color: #3f454c;
}

.googleProfileListingStars {
display: flex;
align-items: center;
gap: 0.15rem;
color: #a95738;
font-size: 1.7rem;
line-height: 1;
}

.googleProfileListingReviewCount {
font-size: 1.5rem;
color: #3f454c;
}

.googleProfileListingMeta {
margin-top: 0.9rem;
display: flex;
align-items: center;
gap: 0.7rem;
font-family: "Inter", sans-serif;
font-size: 1.5rem;
color: #3f454c;
}

.googleProfileListingMetaDot {
opacity: 0.65;
}

.googleProfileListingOpen {
color: #a95738;
font-weight: 600;
}

.googleProfileListingActions {
margin-top: 1.9rem;
padding: 1.35rem 0 1.6rem;
display: grid;
grid-template-columns: repeat(4, 1fr);
border-bottom: 1px solid rgba(63, 69, 76, 0.12);
}

.googleProfileListingAction {
appearance: none;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.7rem;
border: 0;
background: transparent;
font-family: "Inter", sans-serif;
font-size: 1.1rem;
font-weight: 600;
color: #a95738;
cursor: pointer;
transition:
transform 180ms ease,
color 180ms ease;
}

.googleProfileListingAction:hover {
transform: translateY(-0.25rem);
color: #3f454c;
}

.googleProfileListingActionIcon {
width: 4.3rem;
height: 4.3rem;
display: grid;
place-items: center;
border: 1px solid rgba(169, 87, 56, 0.45);
border-radius: 50%;
background: #d2d0cc;
box-shadow:
0 0.4rem 1rem rgba(63, 69, 76, 0.05);
font-size: 2rem;
line-height: 1;
color: #a95738;
}

.googleProfileListingAddress {
min-height: 7.8rem;
display: grid;
grid-template-columns: 4.7rem 1fr 12rem;
align-items: stretch;
border-bottom: 1px solid rgba(63, 69, 76, 0.12);
}

.googleProfileListingAddressIcon {
display: grid;
place-items: center;
font-size: 2.4rem;
color: #a95738;
}

.googleProfileListingAddressText {
display: flex;
flex-direction: column;
justify-content: center;
gap: 0.45rem;
font-family: "Inter", sans-serif;
font-size: 1.35rem;
line-height: 1.35;
color: #3f454c;
}

.googleProfileListingAddressMap {
position: relative;
overflow: hidden;
display: grid;
place-items: center;
background:
linear-gradient(
35deg,
transparent 45%,
rgba(116, 119, 124, 0.13) 46%,
rgba(116, 119, 124, 0.13) 48%,
transparent 49%
),
linear-gradient(
-35deg,
transparent 46%,
rgba(116, 119, 124, 0.12) 47%,
rgba(116, 119, 124, 0.12) 49%,
transparent 50%
),
#d2d0cc;
background-size:
6rem 6rem,
7rem 7rem;
}

.googleProfileListingAddressPin {
position: relative;
width: 3.6rem;
height: 3.6rem;
display: grid;
place-items: center;
border-radius: 50% 50% 50% 0;
transform: rotate(-45deg);
background: #a95738;
color: transparent;
box-shadow:
0 0.5rem 1.2rem rgba(169, 87, 56, 0.2);
}

.googleProfileListingAddressPin::after {
content: "";
width: 1.1rem;
height: 1.1rem;
border-radius: 50%;
background: #d2d0cc;
}

.googleProfileListingReviews {
min-height: 8.3rem;
padding: 1.2rem 0.4rem;
display: flex;
align-items: center;
justify-content: space-between;
}

.googleProfileListingReviewsText {
display: flex;
flex-direction: column;
gap: 0.7rem;
font-family: "Inter", sans-serif;
color: #3f454c;
}

.googleProfileListingReviewsText > span {
font-size: 1.4rem;
font-weight: 500;
}

.googleProfileListingReviewsScore {
display: flex;
align-items: center;
gap: 0.8rem;
}

.googleProfileListingReviewsScore strong {
font-size: 2rem;
font-weight: 500;
}

.googleProfileListingReviewsScore > span {
font-size: 1.2rem;
color: #3f454c;
}

.googleProfileListingReviewsArrow {
font-family: "Inter", sans-serif;
font-size: 3.8rem;
font-weight: 300;
line-height: 1;
color: #a95738;
}

.googleProfileListingGoogleBadge {
position: absolute;
top: 3.4rem;
right: -4.9rem;
width: 8rem;
height: 8rem;
display: grid;
place-items: center;
overflow: hidden;
border: 0.6rem solid #84402d;
border-radius: 50%;
background: #fff;
box-shadow:
0 1.5rem 3rem rgba(63, 69, 76, 0.16);
z-index: 30;
}

.googleProfileListingGoogleBadge img {
width: 5rem !important;
height: 5rem !important;
max-width: 5rem !important;
max-height: 5rem !important;
display: block;
object-fit: contain;
}

.googleProfileMapArea {
position: absolute;
top: 0;
right: calc((100vw - 100%) / -2);
width: 34vw;
height: 100%;
overflow: hidden;
z-index: 8;
}

.googleProfileMapBase {
position: absolute;
inset: 0;
background:
radial-gradient(
circle at 60% 42%,
rgba(222, 220, 216, 0.85) 0%,
rgba(210, 208, 204, 0.9) 35%,
rgba(190, 190, 188, 0.96) 100%
);
}

.googleProfileMapBase::before {
content: "";
position: absolute;
inset: 0;
background:
linear-gradient(
34deg,
transparent 47%,
rgba(116, 119, 124, 0.14) 48%,
rgba(116, 119, 124, 0.14) 49%,
transparent 50%
),
linear-gradient(
-28deg,
transparent 46%,
rgba(116, 119, 124, 0.12) 47%,
rgba(116, 119, 124, 0.12) 48%,
transparent 49%
),
linear-gradient(
74deg,
transparent 48%,
rgba(116, 119, 124, 0.09) 49%,
rgba(116, 119, 124, 0.09) 50%,
transparent 51%
);
background-size:
14rem 14rem,
18rem 18rem,
22rem 22rem;
opacity: 0.85;
}

.googleProfileMapBase::after {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(
circle at 50% 50%,
transparent 35%,
rgba(169, 87, 56, 0.04) 100%
);
}

.googleProfileMapRoads {
position: absolute;
inset: 0;
pointer-events: none;
}

.googleProfileRoad {
position: absolute;
display: block;
height: 0.18rem;
border-radius: 999px;
background: rgba(116, 119, 124, 0.18);
}

.googleProfileRoadOne {
width: 48rem;
top: 23%;
left: -8rem;
transform: rotate(21deg);
}

.googleProfileRoadTwo {
width: 43rem;
top: 48%;
left: 5%;
transform: rotate(-31deg);
}

.googleProfileRoadThree {
width: 36rem;
top: 67%;
left: 10%;
transform: rotate(13deg);
}

.googleProfileRoadFour {
width: 30rem;
top: 35%;
right: -7rem;
transform: rotate(68deg);
}

.googleProfileLocation {
position: absolute;
left: 69%;
top: 46%;
width: 20rem;
height: 20rem;
transform: translate(-50%, -50%);
display: grid;
place-items: center;
z-index: 10;
}

.googleProfileLocationRing {
position: absolute;
border-radius: 50%;
pointer-events: none;
}

.googleProfileLocationRingOne {
width: 8rem;
height: 8rem;
border: 0.18rem solid rgba(169, 87, 56, 0.28);
background: rgba(169, 87, 56, 0.035);
box-shadow: 0 0 2rem rgba(169, 87, 56, 0.06);
}

.googleProfileLocationRingTwo {
width: 14rem;
height: 14rem;
border: 0.18rem solid rgba(169, 87, 56, 0.17);
}

.googleProfileLocationRingThree {
width: 20rem;
height: 20rem;
border: 0.15rem solid rgba(169, 87, 56, 0.09);
}

.googleProfileLocationPin {
position: relative;
width: 5.7rem;
height: 5.7rem;
transform:
translateY(-0.8rem)
rotate(-45deg);
border-radius: 50% 50% 50% 0;
background:
linear-gradient(
145deg,
#8f452f,
#a95738
);
box-shadow:
0 1.2rem 2.4rem rgba(169, 87, 56, 0.22),
0 0 0 0.5rem rgba(210, 208, 204, 0.6);
z-index: 5;
}

.googleProfileLocationPin span {
position: absolute;
left: 50%;
top: 50%;
width: 1.8rem;
height: 1.8rem;
transform:
translate(-50%, -50%)
rotate(45deg);
border-radius: 50%;
background: #d2d0cc;
box-shadow:
inset 0 0.3rem 0.6rem rgba(63, 69, 76, 0.08);
}

.googleProfileFloatingGoogle {
display: none;
}

.googleProfileReviewCard {
position: absolute;
width: 21.5rem;
min-height: 10.3rem;
padding: 1.4rem 1.5rem;
display: grid;
grid-template-columns: 4.2rem 1fr;
align-items: center;
gap: 1rem;
border: 1px solid rgba(210, 208, 204, 0.22);
border-radius: 1.7rem;
background:
linear-gradient(
145deg,
rgba(63, 69, 76, 0.97),
rgba(169, 87, 56, 0.97)
);
box-shadow:
0 2rem 4rem rgba(63, 69, 76, 0.2),
inset 0 1px 0 rgba(210, 208, 204, 0.08);
color: #ffffff;
transform: none;
z-index: 16;
margin-right: 2rem;
}

.googleProfileReviewCardOne {
top: 9rem;
right: -0.5rem;
bottom: auto;
}

.googleProfileReviewCardTwo {
top: 47rem;
right: -0.5rem;
bottom: auto;
}

.googleProfileReviewGoogle {
width: 3.5rem;
height: 3.5rem;
display: grid;
place-items: center;
flex: 0 0 3.5rem;
}

.googleProfileReviewGoogle img {
width: 2.8rem !important;
height: 2.8rem !important;
max-width: 2.8rem !important;
max-height: 2.8rem !important;
display: block;
object-fit: contain;
}

.googleProfileReviewContent {
display: flex;
flex-direction: column;
align-items: flex-start;
}

.googleProfileReviewContent p {
margin: 0 0 0.6rem;
font-family: "Inter", sans-serif;
font-size: 1.3rem;
font-weight: 500;
line-height: 1.35;
color: #ffffff;
}

.googleProfileReviewStars {
display: flex;
align-items: center;
gap: 0.1rem;
font-size: 1.55rem;
line-height: 1;
color: #ffffff;
}

.emailResponse {
position: relative;
width: 100%;
min-height: 86rem;
overflow: hidden;
background: #d2d0cc;
isolation: isolate;
}

.emailResponseImageMobile {
display: none;
}

.emailResponseContainer {
position: relative;
width: min(170rem, calc(100% - 8rem));
min-height: 86rem;
margin: 0 auto;
display: grid;
grid-template-columns: 58% 42%;
z-index: 10;
}

.emailResponseBackground {
position: absolute;
inset: 0;
overflow: hidden;
pointer-events: none;
z-index: 0;
}

.emailResponseCream {
position: absolute;
inset: 0 43% 0 0;
background:
radial-gradient(
circle at 34% 35%,
rgba(222, 220, 216, 0.95) 0%,
rgba(210, 208, 204, 0.9) 40%,
rgba(194, 193, 190, 0.96) 100%
);
z-index: 1;
}

.emailResponseCream::before {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(
ellipse at center,
transparent 36%,
rgba(116, 119, 124, 0.045) 100%
);
}

.emailResponseBurgundy {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 49%;
background:
radial-gradient(
circle at 28% 34%,
rgba(169, 87, 56, 0.24),
transparent 38%
),
radial-gradient(
circle at 82% 70%,
rgba(63, 69, 76, 0.52),
transparent 48%
),
linear-gradient(
135deg,
#a95738 0%,
#8e4933 38%,
#5a4c46 72%,
#3f454c 100%
);
z-index: 1;
}

.emailResponseBurgundy::before {
content: "";
position: absolute;
inset: 0;
background:
linear-gradient(
90deg,
rgba(210, 208, 204, 0.02),
transparent 28%
);
}

.emailResponseBurgundy::after {
content: "";
position: absolute;
inset: 0;
opacity: 0.13;
background-image:
radial-gradient(
circle,
rgba(210, 208, 204, 0.7) 0 0.7px,
transparent 0.9px
);
background-size: 2rem 2rem;
mask-image:
linear-gradient(
to left,
#000 0%,
#000 55%,
transparent 100%
);
-webkit-mask-image:
linear-gradient(
to left,
#000 0%,
#000 55%,
transparent 100%
);
}

.emailResponseGlow {
position: absolute;
left: 42%;
top: 50%;
width: 95rem;
height: 58rem;
transform: translate(-50%, -50%) rotate(-12deg);
border-radius: 50%;
background:
radial-gradient(
ellipse at center,
rgba(169, 87, 56, 0.16) 0%,
rgba(169, 87, 56, 0.1) 30%,
rgba(169, 87, 56, 0.04) 52%,
transparent 74%
);
filter: blur(1.8rem);
animation: emailResponseGlowFloat 9s ease-in-out infinite;
z-index: 2;
}

.emailResponseOrbit {
position: absolute;
left: 42%;
top: 50%;
border-radius: 50%;
transform-origin: center;
pointer-events: none;
}

.emailResponseOrbitOuter {
width: 108rem;
height: 67rem;
transform: translate(-50%, -50%) rotate(-13deg);
border: 0.5rem solid rgba(169, 87, 56, 0.9);
box-shadow:
0 0 0.8rem rgba(169, 87, 56, 0.48),
0 0 2rem rgba(169, 87, 56, 0.3),
0 0 4rem rgba(63, 69, 76, 0.16);
animation: emailResponseOrbitOuterMove 14s ease-in-out infinite;
z-index: 3;
}

.emailResponseOrbitOuter::before {
content: "";
position: absolute;
inset: -1rem;
border: 0.15rem solid rgba(210, 208, 204, 0.5);
border-radius: inherit;
filter: blur(0.3rem);
}

.emailResponseOrbitInner {
width: 102rem;
height: 61rem;
transform: translate(-50%, -50%) rotate(-10deg);
border: 0.16rem solid rgba(210, 208, 204, 0.84);
box-shadow:
0 0 0.8rem rgba(210, 208, 204, 0.42),
0 0 2rem rgba(169, 87, 56, 0.18);
animation: emailResponseOrbitInnerMove 18s ease-in-out infinite reverse;
z-index: 4;
}

.emailResponseOrbitInner::after {
content: "";
position: absolute;
inset: -0.7rem;
border-radius: inherit;
border: 0.12rem solid rgba(169, 87, 56, 0.52);
}

.emailResponseDots {
position: absolute;
top: 7rem;
right: 3rem;
width: 16rem;
height: 14rem;
opacity: 0.28;
background-image:
radial-gradient(
circle,
rgba(210, 208, 204, 0.75) 0 0.8px,
transparent 1px
);
background-size: 1.5rem 1.5rem;
mask-image:
linear-gradient(
135deg,
transparent 0%,
#000 40%,
#000 100%
);
-webkit-mask-image:
linear-gradient(
135deg,
transparent 0%,
#000 40%,
#000 100%
);
z-index: 2;
}

.emailResponseVisual {
position: relative;
min-width: 0;
min-height: 86rem;
z-index: 10;
}

.emailResponseContent {
position: relative;
min-width: 0;
min-height: 86rem;
z-index: 10;
}

@keyframes emailResponseOrbitOuterMove {
0% {
transform: translate(-50%, -50%) rotate(-13deg) scale(1);
}
50% {
transform: translate(-48.5%, -51.5%) rotate(-8deg) scale(1.025);
}
100% {
transform: translate(-50%, -50%) rotate(-13deg) scale(1);
}
}

@keyframes emailResponseOrbitInnerMove {
0% {
transform: translate(-50%, -50%) rotate(-10deg) scale(1);
}
50% {
transform: translate(-51.5%, -48.5%) rotate(-16deg) scale(0.985);
}
100% {
transform: translate(-50%, -50%) rotate(-10deg) scale(1);
}
}

@keyframes emailResponseGlowFloat {
0% {
transform: translate(-50%, -50%) rotate(-12deg) scale(1);
opacity: 0.9;
}
50% {
transform: translate(-48%, -52%) rotate(-8deg) scale(1.04);
opacity: 1;
}
100% {
transform: translate(-50%, -50%) rotate(-12deg) scale(1);
opacity: 0.9;
}
}

.emailResponseVisual {
position: relative;
min-width: 0;
min-height: 86rem;
display: flex;
align-items: center;
justify-content: flex-start;
z-index: 10;
}

.emailResponseImageWrap {
position: relative;
width: 112rem;
margin-left: -1rem;
transform:
translateY(1rem)
rotate(-0.4deg);
filter:
drop-shadow(0 3rem 5rem rgba(63, 69, 76, 0.16))
drop-shadow(0 1rem 2rem rgba(63, 69, 76, 0.1));
z-index: 12;
}

.emailResponseImageWrap::before {
content: "";
position: absolute;
left: 18%;
right: 7%;
bottom: -2.5rem;
height: 8rem;
border-radius: 50%;
background:
radial-gradient(
ellipse at center,
rgba(63, 69, 76, 0.18) 0%,
rgba(63, 69, 76, 0.08) 42%,
transparent 72%
);
filter: blur(1.8rem);
transform: scaleX(0.94);
z-index: -1;
}

.emailResponseImage {
position: relative;
width: 100%;
height: auto;
display: block;
object-fit: contain;
z-index: 2;
}

.emailResponseContent {
position: relative;
min-width: 0;
min-height: 86rem;
display: flex;
align-items: center;
justify-content: flex-end;
padding-left: 8rem;
color: #ffffff;
z-index: 20;
}

.emailResponseContentInner {
position: relative;
width: 100%;
max-width: 58rem;
transform: translateY(-1rem);
}

.emailResponseEyebrow {
position: relative;
display: inline-flex;
align-items: center;
padding-bottom: 1.4rem;
font-family: "Inter", sans-serif;
font-size: 1.45rem;
font-weight: 700;
line-height: 1;
letter-spacing: 0.14em;
text-transform: uppercase;
color: #ffffff;
}

.emailResponseEyebrow::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 8rem;
height: 0.28rem;
border-radius: 999px;
background: #a95738;
box-shadow: 0 0 1.2rem rgba(169, 87, 56, 0.28);
}

.emailResponseHeading {
margin: 4.2rem 0 0;
display: flex;
flex-direction: column;
align-items: flex-start;
}

.emailResponseHeadingMain {
display: block;
font-family: "Anton", sans-serif;
font-size: 7rem;
font-weight: 400;
line-height: 0.98;
letter-spacing: -0.025em;
white-space: nowrap;
color: #ffffff;
}

.emailResponseHeadingAccent {
display: block;
margin-top: 0.6rem;
font-family: "Cormorant Garamond", serif;
font-size: 7.2rem;
font-weight: 500;
font-style: italic;
line-height: 0.95;
letter-spacing: -0.035em;
white-space: nowrap;
color: #ffffff;
}

.emailResponseText {
max-width: 53rem;
margin: 3rem 0 0;
font-family: "Inter", sans-serif;
font-size: 1.75rem;
font-weight: 400;
line-height: 1.7;
color: #ffffff;
}

.emailResponseFeatures {
position: relative;
width: 100%;
margin-top: 4.5rem;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
column-gap: 4.5rem;
row-gap: 3.6rem;
}

.emailResponseFeature {
position: relative;
min-width: 0;
display: grid;
grid-template-columns: 6.2rem minmax(0, 1fr);
align-items: center;
gap: 1.7rem;
}

.emailResponseFeatureIcon {
position: relative;
width: 6.2rem;
height: 6.2rem;
display: grid;
place-items: center;
border: 1px solid rgba(210, 208, 204, 0.55);
border-radius: 50%;
background:
linear-gradient(
145deg,
rgba(210, 208, 204, 0.09),
rgba(116, 119, 124, 0.025)
);
box-shadow:
inset 0 1px 0 rgba(210, 208, 204, 0.13),
0 1rem 2.2rem rgba(63, 69, 76, 0.15),
0 0 1.8rem rgba(169, 87, 56, 0.08);
}

.emailResponseFeatureIcon::before {
content: "";
position: absolute;
inset: 0.45rem;
border: 1px solid rgba(210, 208, 204, 0.08);
border-radius: 50%;
}

.emailResponseFeatureIcon span {
position: relative;
display: block;
font-family: "Inter", sans-serif;
font-size: 2.5rem;
font-weight: 400;
line-height: 1;
color: #ffffff;
z-index: 2;
}

.emailResponseFeatureCopy {
min-width: 0;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.65rem;
}

.emailResponseFeatureCopy strong {
font-family: "Inter", sans-serif;
font-size: 1.6rem;
font-weight: 700;
line-height: 1.2;
color: #ffffff;
}

.emailResponseFeatureCopy span {
max-width: 19rem;
font-family: "Inter", sans-serif;
font-size: 1.2rem;
font-weight: 400;
line-height: 1.5;
color: #ffffff;
}

.emailResponseFeature::after {
content: "";
position: absolute;
left: 7.9rem;
right: 0;
bottom: -1.8rem;
height: 1px;
background:
linear-gradient(
to right,
rgba(210, 208, 204, 0.13),
transparent
);
}

.emailResponseFeature:nth-last-child(-n + 2)::after {
display: none;
}

.getFoundSection {
    position: relative;
    width: 100%;
    min-height: 74rem;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 18% 20%,
            rgba(226, 224, 220, 0.98) 0%,
            rgba(216, 214, 210, 0.96) 35%,
            rgba(210, 208, 204, 0.98) 100%
        );
    isolation: isolate;
}

.getFoundSection::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(
            circle at 76% 26%,
            rgba(169, 87, 56, 0.04),
            transparent 35%
        );
    pointer-events: none;
}

.getFoundContainer {
    position: relative;
    width: min(182rem, calc(100% - 5rem));
    min-height: 74rem;
    margin: 0 auto;
    padding: 5rem 0;
    display: grid;
    grid-template-columns: 45rem minmax(0, 1fr);
    align-items: center;
    column-gap: 2rem;
    z-index: 2;
}

.getFoundIntro {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0 1rem 0 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
}

.getFoundEyebrow {
    width: max-content;
    min-height: 5rem;
    padding: 0.8rem 2rem;
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    border: 1px solid rgba(169, 87, 56, 0.13);
    border-radius: 999px;
    background: rgba(210, 208, 204, 0.72);
    box-shadow:
        inset 0 1px 0 rgba(226, 224, 220, 0.8),
        0 1rem 2.5rem rgba(63, 69, 76, 0.04);
    font-family: "Inter", sans-serif;
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #a95738;
}

.getFoundEyebrowIcon {
    width: 2.8rem;
    height: 2.8rem;
    display: grid;
    place-items: center;
    flex: 0 0 2.8rem;
    font-size: 2.2rem;
    color: #a95738;
}

.getFoundHeading {
    width: 100%;
    margin: 3.8rem 0 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.getFoundHeadingScript {
    display: block;
    font-family: "Cormorant Garamond", serif;
    font-size: 6rem;
    font-weight: 500;
    font-style: italic;
    line-height: 0.9;
    letter-spacing: -0.035em;
    color: #a95738;
}

.getFoundHeadingMain {
    display: block;
    margin-top: 1rem;
    font-family: "Cormorant Garamond", serif;
    font-size: 8.8rem;
    font-weight: 700;
    line-height: 0.9;
    letter-spacing: -0.045em;
    color: #3f454c;
}

.getFoundHeadingMain span {
    color: #a95738;
}

.getFoundAccentLine {
    width: 8rem;
    height: 0.2rem;
    margin-top: 4.2rem;
    background: #a95738;
}

.getFoundIntroText {
    width: 100%;
    max-width: none;
    margin: 3.4rem 0 0;
    padding-right: 1rem;
    font-family: "Inter", sans-serif;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.75;
    color: #3f454c;
}

.getFoundButton {
    width: 32rem;
    min-height: 6.4rem;
    margin-top: 3.6rem;
    padding: 1.5rem 2.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 3rem;
    border-radius: 0.7rem;
    background:
        linear-gradient(
            135deg,
            #a95738,
            #8f452f
        );
    box-shadow:
        0 1.2rem 2.5rem rgba(169, 87, 56, 0.15),
        inset 0 1px 0 rgba(210, 208, 204, 0.13);
    font-family: "Inter", sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    color: #ffffff;
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.getFoundButton:hover {
    transform: translateY(-0.25rem);
    box-shadow:
        0 1.7rem 3rem rgba(169, 87, 56, 0.2),
        inset 0 1px 0 rgba(210, 208, 204, 0.13);
}

.getFoundButtonArrow {
    font-size: 2.3rem;
    font-weight: 400;
    transition: transform 0.25s ease;
}

.getFoundButton:hover .getFoundButtonArrow {
    transform: translateX(0.5rem);
}

.getFoundTrust {
    width: 100%;
    margin-top: 2.7rem;
    display: flex;
    align-items: center;
    gap: 1.3rem;
    font-family: "Inter", sans-serif;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.4;
    color: #3f454c;
}

.getFoundTrustIcon {
    width: 3.8rem;
    height: 3.8rem;
    display: grid;
    place-items: center;
    flex: 0 0 3.8rem;
    border-radius: 50%;
    background: rgba(169, 87, 56, 0.06);
    color: #a95738;
    font-size: 1.8rem;
}

.getFoundCards {
    position: relative;
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem;
    align-items: stretch;
}

.getFoundCard {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(116, 119, 124, 0.1);
    border-radius: 1.6rem;
    background: #fff;
    box-shadow:
        0 2rem 4rem rgba(63, 69, 76, 0.08),
        0 0.4rem 1rem rgba(63, 69, 76, 0.04);
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.getFoundCard:hover {
    transform: translateY(-0.7rem);
    box-shadow:
        0 2.8rem 5rem rgba(63, 69, 76, 0.12),
        0 0.6rem 1.3rem rgba(63, 69, 76, 0.05);
}

.getFoundCardImageWrap {
    position: relative;
    width: 100%;
    height: 30rem;
    overflow: visible;
}

.getFoundCardImage {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: 1.5rem 1.5rem 0 0;
}

.getFoundCardImageWrap::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 1.5rem 1.5rem 0 0;
    background:
        linear-gradient(
            to bottom,
            transparent 55%,
            rgba(63, 69, 76, 0.1) 100%
        );
    pointer-events: none;
}

.getFoundCardBadge {
    position: absolute;
    left: 2.4rem;
    bottom: -3rem;
    width: 6.4rem;
    height: 6.4rem;
    display: grid;
    place-items: center;
    border: 0.35rem solid #d2d0cc;
    border-radius: 50%;
    background:
        linear-gradient(
            145deg,
            #b76647,
            #8f452f
        );
    box-shadow:
        0 1rem 2rem rgba(169, 87, 56, 0.18),
        inset 0 1px 0 rgba(210, 208, 204, 0.18);
    color: #ffffff;
    z-index: 5;
}

.getFoundCardBadge span {
    font-family: "Inter", sans-serif;
    font-size: 2.6rem;
    line-height: 1;
}

.getFoundCardBody {
    position: relative;
    min-height: 35rem;
    padding: 4.8rem 2.5rem 2.5rem;
    display: flex;
    flex-direction: column;
}

.getFoundCardBody h3 {
    margin: 0;
    font-family: "Cormorant Garamond", serif;
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.025em;
    color: #3f454c;
}

.getFoundCardBody > p {
    width: 100%;
    max-width: none;
    margin: 1.3rem 0 0;
    font-family: "Inter", sans-serif;
    font-size: 1.35rem;
    font-weight: 400;
    line-height: 1.65;
    color: #3f454c;
}

.getFoundCardList {
    width: 100%;
    margin: 2rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    list-style: none;
}

.getFoundCardList li {
    width: 100%;
    display: grid;
    grid-template-columns: 1.6rem minmax(0, 1fr);
    align-items: start;
    gap: 0.9rem;
    font-family: "Inter", sans-serif;
    font-size: 1.15rem;
    font-weight: 400;
    line-height: 1.45;
    color: #3f454c;
}

.getFoundCheck {
    width: 1.5rem;
    height: 1.5rem;
    margin-top: 0.1rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #a95738;
    font-size: 0.9rem;
    font-weight: 800;
    color: #ffffff;
}

.getFoundCardLink {
    width: max-content;
    margin-top: auto;
    padding-top: 2.4rem;
    display: inline-flex;
    align-items: center;
    gap: 1.4rem;
    font-family: "Inter", sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    color: #a95738;
    transition: gap 0.25s ease;
}

.getFoundCardLink span:last-child {
    font-size: 1.8rem;
}

.getFoundCardLink:hover {
    gap: 1.9rem;
}

.getFoundBackground {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.getFoundBackground::before {
    content: "";
    position: absolute;
    inset: -15%;
    background:
        radial-gradient(
            circle at 18% 30%,
            rgba(169, 87, 56, 0.22) 0%,
            rgba(169, 87, 56, 0.09) 18%,
            transparent 42%
        ),
        radial-gradient(
            circle at 72% 68%,
            rgba(169, 87, 56, 0.16) 0%,
            rgba(169, 87, 56, 0.07) 24%,
            transparent 48%
        );
    filter: blur(2rem);
    animation: getFoundBackgroundPulse 10s ease-in-out infinite;
}

.getFoundBackgroundOrb {
    position: absolute;
    border-radius: 50%;
    will-change: transform;
}

.getFoundBackgroundOrbOne {
    top: -28rem;
    left: -22rem;
    width: 88rem;
    height: 88rem;
    background:
        radial-gradient(
            circle at center,
            rgba(169, 87, 56, 0.28) 0%,
            rgba(169, 87, 56, 0.14) 32%,
            rgba(169, 87, 56, 0.05) 54%,
            transparent 74%
        );
    filter: blur(1rem);
    animation: getFoundOrbOneMove 10s ease-in-out infinite;
}

.getFoundBackgroundOrbTwo {
    top: 8rem;
    left: 36%;
    width: 78rem;
    height: 78rem;
    background:
        radial-gradient(
            circle at center,
            rgba(169, 87, 56, 0.22) 0%,
            rgba(169, 87, 56, 0.1) 35%,
            rgba(169, 87, 56, 0.04) 56%,
            transparent 76%
        );
    filter: blur(1.4rem);
    animation: getFoundOrbTwoMove 13s ease-in-out infinite;
}

.getFoundBackgroundOrbThree {
    right: -28rem;
    bottom: -30rem;
    width: 100rem;
    height: 100rem;
    background:
        radial-gradient(
            circle at center,
            rgba(169, 87, 56, 0.24) 0%,
            rgba(169, 87, 56, 0.11) 34%,
            rgba(169, 87, 56, 0.045) 58%,
            transparent 76%
        );
    filter: blur(1.2rem);
    animation: getFoundOrbThreeMove 15s ease-in-out infinite;
}

.getFoundBackgroundGrid {
    position: absolute;
    inset: -10%;
    opacity: 0.22;
    background-image:
        linear-gradient(
            rgba(169, 87, 56, 0.11) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(169, 87, 56, 0.11) 1px,
            transparent 1px
        );
    background-size: 5rem 5rem;
    mask-image:
        radial-gradient(
            ellipse at center,
            #000 0%,
            rgba(0, 0, 0, 0.95) 45%,
            transparent 90%
        );
    -webkit-mask-image:
        radial-gradient(
            ellipse at center,
            #000 0%,
            rgba(0, 0, 0, 0.95) 45%,
            transparent 90%
        );
    animation: getFoundGridDrift 12s linear infinite;
}

.getFoundBackgroundLine {
    position: absolute;
    border-radius: 50%;
    will-change: transform;
}

.getFoundBackgroundLineOne {
    top: 6rem;
    left: -8%;
    width: 110rem;
    height: 48rem;
    border: 0.35rem solid rgba(169, 87, 56, 0.28);
    box-shadow:
        0 0 2rem rgba(169, 87, 56, 0.12),
        0 0 5rem rgba(169, 87, 56, 0.08);
    transform: rotate(-10deg);
    animation: getFoundLineOneMove 11s ease-in-out infinite;
}

.getFoundBackgroundLineOne::before {
    content: "";
    position: absolute;
    inset: 1.5rem;
    border-radius: inherit;
    border: 0.14rem solid rgba(210, 208, 204, 0.58);
}

.getFoundBackgroundLineTwo {
    right: -12%;
    bottom: -2rem;
    width: 100rem;
    height: 42rem;
    border: 0.32rem solid rgba(169, 87, 56, 0.24);
    box-shadow:
        0 0 2rem rgba(169, 87, 56, 0.1),
        0 0 5rem rgba(169, 87, 56, 0.07);
    transform: rotate(12deg);
    animation: getFoundLineTwoMove 14s ease-in-out infinite;
}

.getFoundBackgroundLineTwo::before {
    content: "";
    position: absolute;
    inset: 1.8rem;
    border-radius: inherit;
    border: 0.14rem solid rgba(210, 208, 204, 0.5);
}

.getFoundBackground::after {
    content: "";
    position: absolute;
    top: -30%;
    left: -35%;
    width: 70%;
    height: 170%;
    background:
        linear-gradient(
            110deg,
            transparent 0%,
            rgba(210, 208, 204, 0.03) 30%,
            rgba(210, 208, 204, 0.5) 48%,
            rgba(210, 208, 204, 0.08) 56%,
            transparent 70%
        );
    transform: rotate(6deg);
    filter: blur(1rem);
    animation: getFoundLightSweep 8s ease-in-out infinite;
}

@keyframes getFoundBackgroundPulse {
    0% {
        transform: scale(1);
        opacity: 0.85;
    }

    50% {
        transform: scale(1.08);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 0.85;
    }
}

@keyframes getFoundOrbOneMove {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(16rem, 10rem, 0) scale(1.14);
    }

    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@keyframes getFoundOrbTwoMove {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(-14rem, 12rem, 0) scale(0.92);
    }

    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@keyframes getFoundOrbThreeMove {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(-18rem, -10rem, 0) scale(1.12);
    }

    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@keyframes getFoundGridDrift {
    0% {
        background-position: 0 0, 0 0;
    }

    100% {
        background-position: 10rem 10rem, 10rem 10rem;
    }
}

@keyframes getFoundLineOneMove {
    0% {
        transform: translate3d(0, 0, 0) rotate(-10deg) scale(1);
    }

    50% {
        transform: translate3d(10rem, 4rem, 0) rotate(-3deg) scale(1.08);
    }

    100% {
        transform: translate3d(0, 0, 0) rotate(-10deg) scale(1);
    }
}

@keyframes getFoundLineTwoMove {
    0% {
        transform: translate3d(0, 0, 0) rotate(12deg) scale(1);
    }

    50% {
        transform: translate3d(-12rem, -4rem, 0) rotate(18deg) scale(1.1);
    }

    100% {
        transform: translate3d(0, 0, 0) rotate(12deg) scale(1);
    }
}

@keyframes getFoundLightSweep {
    0% {
        transform: translateX(-20%) rotate(6deg);
        opacity: 0;
    }

    20% {
        opacity: 0.85;
    }

    50% {
        opacity: 1;
    }

    80% {
        opacity: 0.85;
    }

    100% {
        transform: translateX(240%) rotate(6deg);
        opacity: 0;
    }
}

.contactSection {
    position: relative;
    min-height: 92rem;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(
            circle at 48% 38%,
            rgba(143, 69, 47, 0.42) 0%,
            rgba(63, 69, 76, 0.18) 25%,
            transparent 55%
        ),
        linear-gradient(
            115deg,
            #2f3439 0%,
            #3f454c 30%,
            #554a45 59%,
            #353a40 100%
        );
}

.contactBackground {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.contactBackground::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(
            circle at 12% 35%,
            rgba(143, 69, 47, 0.22) 0%,
            rgba(143, 69, 47, 0.12) 23%,
            transparent 48%
        ),
        radial-gradient(
            circle at 52% 70%,
            rgba(169, 87, 56, 0.25) 0%,
            rgba(143, 69, 47, 0.12) 25%,
            transparent 54%
        ),
        radial-gradient(
            circle at 92% 24%,
            rgba(143, 69, 47, 0.22) 0%,
            transparent 45%
        );
    opacity: 1;
    animation: contactAmbientPulse 7s ease-in-out infinite alternate;
}

.contactBackground::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(63, 69, 76, 0.18) 0%,
            transparent 24%,
            transparent 68%,
            rgba(63, 69, 76, 0.18) 100%
        ),
        linear-gradient(
            to bottom,
            rgba(63, 69, 76, 0.12),
            transparent 25%,
            transparent 72%,
            rgba(63, 69, 76, 0.24)
        );
    z-index: 20;
}

.contactBackgroundGlow {
    position: absolute;
    border-radius: 50%;
    filter: blur(6rem);
    mix-blend-mode: screen;
    will-change: transform, opacity;
}

.contactBackgroundGlowOne {
    width: 75rem;
    height: 75rem;
    left: -22rem;
    top: 12rem;
    background:
        radial-gradient(
            circle,
            rgba(143, 69, 47, 0.58) 0%,
            rgba(143, 69, 47, 0.36) 25%,
            rgba(63, 69, 76, 0.16) 48%,
            transparent 72%
        );
    opacity: 0.9;
    animation: contactGlowOne 9s ease-in-out infinite alternate;
}

.contactBackgroundGlowTwo {
    width: 90rem;
    height: 90rem;
    left: 34%;
    bottom: -47rem;
    background:
        radial-gradient(
            circle,
            rgba(169, 87, 56, 0.78) 0%,
            rgba(143, 69, 47, 0.54) 18%,
            rgba(143, 69, 47, 0.25) 42%,
            transparent 70%
        );
    opacity: 1;
    filter: blur(5rem);
    animation: contactGlowTwo 11s ease-in-out infinite alternate;
}

.contactBackgroundGlowThree {
    width: 70rem;
    height: 70rem;
    right: -22rem;
    top: 3rem;
    background:
        radial-gradient(
            circle,
            rgba(143, 69, 47, 0.52) 0%,
            rgba(143, 69, 47, 0.31) 30%,
            rgba(63, 69, 76, 0.08) 54%,
            transparent 72%
        );
    opacity: 0.9;
    animation: contactGlowThree 8s ease-in-out infinite alternate;
}

.contactBackgroundHalo {
    position: absolute;
    border-radius: 50%;
    will-change: transform, opacity;
}

.contactBackgroundHaloOne {
    width: 112rem;
    height: 51rem;
    left: 31%;
    bottom: -23rem;
    border: 0.34rem solid rgba(169, 87, 56, 0.72);
    transform: rotate(-13deg);
    box-shadow:
        0 0 1.2rem rgba(169, 87, 56, 0.78),
        0 0 3rem rgba(143, 69, 47, 0.52),
        0 0 7rem rgba(143, 69, 47, 0.36),
        inset 0 0 1.4rem rgba(169, 87, 56, 0.28);
    opacity: 0.92;
    animation: contactHaloOne 10s ease-in-out infinite alternate;
}

.contactBackgroundHaloOne::before {
    content: "";
    position: absolute;
    inset: 2.4rem;
    border-radius: inherit;
    border: 0.16rem solid rgba(210, 208, 204, 0.74);
    box-shadow:
        0 0 1.4rem rgba(210, 208, 204, 0.65),
        0 0 3.5rem rgba(169, 87, 56, 0.45);
}

.contactBackgroundHaloOne::after {
    content: "";
    position: absolute;
    inset: -4rem;
    border-radius: inherit;
    border: 1.5rem solid rgba(143, 69, 47, 0.1);
    filter: blur(2rem);
}

.contactBackgroundHaloTwo {
    width: 83rem;
    height: 36rem;
    right: -27rem;
    top: 27rem;
    border: 0.24rem solid rgba(169, 87, 56, 0.58);
    transform: rotate(-42deg);
    box-shadow:
        0 0 1.2rem rgba(169, 87, 56, 0.65),
        0 0 3rem rgba(143, 69, 47, 0.46),
        0 0 6rem rgba(143, 69, 47, 0.3);
    opacity: 0.82;
    animation: contactHaloTwo 12s ease-in-out infinite alternate;
}

.contactBackgroundHaloTwo::before {
    content: "";
    position: absolute;
    inset: 2.2rem;
    border-radius: inherit;
    border: 0.12rem solid rgba(210, 208, 204, 0.48);
}

.contactBackgroundBeam {
    position: absolute;
    height: 0.16rem;
    transform-origin: left center;
    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(169, 87, 56, 0.12) 12%,
            rgba(210, 208, 204, 0.92) 48%,
            rgba(169, 87, 56, 0.82) 70%,
            transparent 100%
        );
    box-shadow:
        0 0 0.7rem rgba(169, 87, 56, 0.9),
        0 0 1.8rem rgba(169, 87, 56, 0.8),
        0 0 4rem rgba(143, 69, 47, 0.5);
    opacity: 0.8;
}

.contactBackgroundBeamOne {
    width: 88rem;
    left: 38%;
    bottom: 8rem;
    transform: rotate(-27deg);
    animation: contactBeamOne 7s ease-in-out infinite alternate;
}

.contactBackgroundBeamTwo {
    width: 67rem;
    left: 49%;
    bottom: -1rem;
    transform: rotate(-32deg);
    opacity: 0.52;
    animation: contactBeamTwo 9s ease-in-out infinite alternate;
}

.contactBackgroundBeamThree {
    width: 52rem;
    right: -20rem;
    top: 46%;
    transform: rotate(-51deg);
    opacity: 0.42;
    animation: contactBeamThree 8s ease-in-out infinite alternate;
}

.contactBackgroundDots {
    position: absolute;
    width: 34rem;
    height: 34rem;
    right: -4rem;
    top: 0;
    opacity: 0.36;
    background-image:
        radial-gradient(
            circle,
            rgba(169, 87, 56, 0.68) 0.1rem,
            transparent 0.13rem
        );
    background-size: 1.8rem 1.8rem;
    mask-image:
        radial-gradient(
            circle at center,
            #000 0%,
            rgba(63, 69, 76, 0.65) 42%,
            transparent 78%
        );
    -webkit-mask-image:
        radial-gradient(
            circle at center,
            #000 0%,
            rgba(63, 69, 76, 0.65) 42%,
            transparent 78%
        );
    animation: contactDotsDrift 14s linear infinite alternate;
}

.contactBackgroundNoise {
    position: absolute;
    inset: 0;
    opacity: 0.09;
    background-image:
        repeating-linear-gradient(
            115deg,
            rgba(210, 208, 204, 0.05) 0,
            rgba(210, 208, 204, 0.05) 0.05rem,
            transparent 0.05rem,
            transparent 0.35rem
        );
    mix-blend-mode: soft-light;
}

@keyframes contactGlowOne {
    0% {
        transform: translate3d(-4rem, -2rem, 0) scale(0.94);
        opacity: 0.72;
    }
    100% {
        transform: translate3d(10rem, 6rem, 0) scale(1.12);
        opacity: 1;
    }
}

@keyframes contactGlowTwo {
    0% {
        transform: translate3d(-9rem, 6rem, 0) scale(0.92);
        opacity: 0.72;
    }
    100% {
        transform: translate3d(8rem, -8rem, 0) scale(1.15);
        opacity: 1;
    }
}

@keyframes contactGlowThree {
    0% {
        transform: translate3d(4rem, -4rem, 0) scale(0.9);
        opacity: 0.68;
    }
    100% {
        transform: translate3d(-12rem, 8rem, 0) scale(1.12);
        opacity: 1;
    }
}

@keyframes contactHaloOne {
    0% {
        transform: translate3d(-4rem, 4rem, 0) rotate(-13deg) scale(0.96);
        opacity: 0.65;
    }
    50% {
        opacity: 1;
    }
    100% {
        transform: translate3d(8rem, -6rem, 0) rotate(-9deg) scale(1.06);
        opacity: 0.86;
    }
}

@keyframes contactHaloTwo {
    0% {
        transform: translate3d(4rem, -3rem, 0) rotate(-42deg) scale(0.94);
        opacity: 0.52;
    }
    100% {
        transform: translate3d(-8rem, 7rem, 0) rotate(-36deg) scale(1.08);
        opacity: 0.92;
    }
}

@keyframes contactBeamOne {
    0% {
        transform: translate3d(-5rem, 3rem, 0) rotate(-27deg);
        opacity: 0.48;
    }
    100% {
        transform: translate3d(8rem, -5rem, 0) rotate(-24deg);
        opacity: 1;
    }
}

@keyframes contactBeamTwo {
    0% {
        transform: translate3d(3rem, 5rem, 0) rotate(-32deg);
        opacity: 0.25;
    }
    100% {
        transform: translate3d(-8rem, -3rem, 0) rotate(-28deg);
        opacity: 0.72;
    }
}

@keyframes contactBeamThree {
    0% {
        transform: translate3d(5rem, -6rem, 0) rotate(-51deg);
        opacity: 0.22;
    }
    100% {
        transform: translate3d(-7rem, 7rem, 0) rotate(-47deg);
        opacity: 0.62;
    }
}

@keyframes contactAmbientPulse {
    0% {
        opacity: 0.72;
        transform: scale(1);
    }
    100% {
        opacity: 1;
        transform: scale(1.04);
    }
}

@keyframes contactDotsDrift {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(-3rem, 4rem, 0);
    }
}

.contactContent {
    position: relative;
    z-index: 5;
    width: min(180rem, calc(100% - 8rem));
    min-height: 92rem;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 47% 53%;
    align-items: center;
}

.contactLeft {
    position: relative;
    width: 100%;
    max-width: 72rem;
    padding-left: 2rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.contactEyebrow {
    display: inline-flex;
    align-items: center;
    gap: 1.4rem;
    min-height: 5.2rem;
    padding: 0.7rem 2.1rem 0.7rem 0.8rem;
    border: 0.1rem solid rgba(169, 87, 56, 0.42);
    border-radius: 999rem;
    background:
        linear-gradient(
            135deg,
            rgba(63, 69, 76, 0.5),
            rgba(63, 69, 76, 0.28)
        );
    box-shadow:
        inset 0 0 0 0.1rem rgba(210, 208, 204, 0.025),
        0 1rem 3rem rgba(63, 69, 76, 0.13);
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 1.35rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.contactEyebrowIcon {
    width: 3.7rem;
    height: 3.7rem;
    flex: 0 0 3.7rem;
    display: grid;
    place-items: center;
    border: 0.1rem solid rgba(169, 87, 56, 0.54);
    border-radius: 50%;
    background:
        radial-gradient(
            circle at 38% 30%,
            rgba(169, 87, 56, 0.3),
            rgba(63, 69, 76, 0.22) 68%
        );
    color: #b76647;
    font-size: 1.55rem;
    line-height: 1;
    box-shadow:
        0 0 1.8rem rgba(143, 69, 47, 0.12);
}

.contactHeading {
    margin: 4.8rem 0 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 0.88;
}

.contactHeadingMain {
    display: block;
    color: #ffffff;
    font-family: "Anton", sans-serif;
    font-size: 10rem;
    font-weight: 400;
    letter-spacing: -0.035em;
    line-height: 0.9;
    text-shadow:
        0 0.4rem 1rem rgba(63, 69, 76, 0.14);
}

.contactHeadingAccent {
    display: block;
    margin-top: 1.2rem;
    margin-left: -0.2rem;
    color: #b76647;
    font-family: "Cormorant Garamond", serif;
    font-size: 9.2rem;
    font-weight: 600;
    font-style: italic;
    letter-spacing: -0.04em;
    line-height: 0.86;
    text-shadow:
        0 0 2.5rem rgba(143, 69, 47, 0.11);
}

.contactIntroRow {
    margin-top: 5.2rem;
    display: flex;
    align-items: stretch;
    gap: 2.7rem;
}

.contactIntroLine {
    width: 0.22rem;
    min-height: 7rem;
    flex: 0 0 0.22rem;
    border-radius: 999rem;
    background:
        linear-gradient(
            to bottom,
            #b76647 0%,
            #a95738 60%,
            rgba(169, 87, 56, 0.45) 100%
        );
    box-shadow:
        0 0 1.6rem rgba(169, 87, 56, 0.42);
}

.contactIntroText {
    max-width: 48rem;
    margin: -0.7rem 0 0;
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 2.15rem;
    font-weight: 400;
    line-height: 1.65;
}

.contactBenefits {
    width: 100%;
    max-width: 67rem;
    margin-top: 5.8rem;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.contactBenefit {
    position: relative;
    min-width: 0;
    padding: 0 2.7rem;
}

.contactBenefit:first-child {
    padding-left: 0;
}

.contactBenefit:last-child {
    padding-right: 0;
}

.contactBenefit:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 4rem;
    right: 0;
    width: 0.1rem;
    height: 13rem;
    background:
        linear-gradient(
            to bottom,
            transparent 0%,
            rgba(169, 87, 56, 0.42) 20%,
            rgba(169, 87, 56, 0.26) 78%,
            transparent 100%
        );
}

.contactBenefitIcon {
    position: relative;
    width: 7.8rem;
    height: 7.8rem;
    display: grid;
    place-items: center;
    border: 0.1rem solid rgba(169, 87, 56, 0.34);
    border-radius: 50%;
    background:
        radial-gradient(
            circle at 50% 38%,
            rgba(169, 87, 56, 0.18),
            rgba(63, 69, 76, 0.08) 70%
        );
    color: #b76647;
    font-size: 3.7rem;
    line-height: 1;
    box-shadow:
        inset 0 0 2.3rem rgba(143, 69, 47, 0.04),
        0 0 3.2rem rgba(143, 69, 47, 0.08);
    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}

.contactBenefitIcon::before {
    content: "";
    position: absolute;
    inset: 0.7rem;
    border: 0.1rem solid rgba(169, 87, 56, 0.1);
    border-radius: inherit;
}

.contactBenefit:hover .contactBenefitIcon {
    transform: translateY(-0.6rem);
    border-color: rgba(169, 87, 56, 0.62);
    box-shadow:
        inset 0 0 2.3rem rgba(143, 69, 47, 0.08),
        0 0 3rem rgba(143, 69, 47, 0.22);
}

.contactBenefit h3 {
    margin: 2.3rem 0 0;
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 1.55rem;
    font-weight: 700;
    line-height: 1.25;
}

.contactBenefit p {
    margin: 1rem 0 0;
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 1.35rem;
    font-weight: 400;
    line-height: 1.7;
}

.contactTrust {
    width: 100%;
    max-width: 67rem;
    min-height: 12.5rem;
    margin-top: 5.6rem;
    padding: 2.2rem 3rem;
    display: flex;
    align-items: center;
    border: 0.1rem solid rgba(169, 87, 56, 0.38);
    border-radius: 2rem;
    background:
        linear-gradient(
            130deg,
            rgba(63, 69, 76, 0.62),
            rgba(63, 69, 76, 0.36)
        );
    box-shadow:
        inset 0 0 0 0.1rem rgba(210, 208, 204, 0.018),
        0 2rem 4rem rgba(63, 69, 76, 0.1),
        0 0 4rem rgba(143, 69, 47, 0.04);
    backdrop-filter: blur(1.2rem);
}

.contactTrustPeople {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.contactTrustAvatar {
    position: relative;
    width: 5.6rem;
    height: 5.6rem;
    flex: 0 0 5.6rem;
    overflow: hidden;
    border: 0.25rem solid #554a45;
    border-radius: 50%;
    background: #3f454c;
    box-shadow:
        0 0.5rem 1rem rgba(63, 69, 76, 0.2);
}

.contactTrustAvatar + .contactTrustAvatar {
    margin-left: -1.35rem;
}

.contactTrustAvatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contactTrustCount {
    position: relative;
    z-index: 3;
    width: 6.2rem;
    height: 6.2rem;
    flex: 0 0 6.2rem;
    margin-left: -1rem;
    display: grid;
    place-items: center;
    border: 0.16rem solid rgba(169, 87, 56, 0.88);
    border-radius: 50%;
    background:
        radial-gradient(
            circle at 35% 25%,
            #b76647,
            #8f452f 70%
        );
    box-shadow:
        0 0.8rem 2rem rgba(63, 69, 76, 0.32),
        inset 0 0 1.5rem rgba(169, 87, 56, 0.12);
}

.contactTrustCount span {
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 1.7rem;
    font-weight: 700;
}

.contactTrustDivider {
    width: 0.1rem;
    height: 6.5rem;
    margin: 0 2.6rem;
    flex: 0 0 0.1rem;
    background:
        linear-gradient(
            to bottom,
            transparent,
            rgba(169, 87, 56, 0.46),
            transparent
        );
}

.contactTrustCopy {
    min-width: 0;
}

.contactTrustStars {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: #a95738;
    font-size: 2rem;
    line-height: 1;
    text-shadow:
        0 0 1.2rem rgba(169, 87, 56, 0.18);
}

.contactTrustCopy p {
    max-width: 26rem;
    margin: 1.1rem 0 0;
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.6;
}

.contactFormSide {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 92rem;
    display: flex;
    align-items: center;
    justify-content: center;
    perspective: 180rem;
}

.contactClipboard {
    position: relative;
    width: 59rem;
    height: 77rem;
    transform:
        translate3d(1rem, 0, 0)
        rotateX(2deg)
        rotateY(-14deg)
        rotateZ(4deg);
    transform-style: preserve-3d;
}

.contactClipboardShadow {
    position: absolute;
    left: 5%;
    right: -10%;
    bottom: -5.5rem;
    height: 20rem;
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse at center,
            rgba(63, 69, 76, 0.72) 0%,
            rgba(63, 69, 76, 0.48) 28%,
            rgba(63, 69, 76, 0.2) 58%,
            transparent 78%
        );
    filter: blur(3rem);
    transform:
        rotate(-4deg)
        translateZ(-4rem);
    opacity: 0.95;
    pointer-events: none;
}

.contactClipboardBoard {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 3rem;
    background:
        linear-gradient(
            130deg,
            rgba(169, 87, 56, 0.64) 0%,
            rgba(143, 69, 47, 0.24) 18%,
            transparent 37%
        ),
        linear-gradient(
            145deg,
            #b76647 0%,
            #a95738 34%,
            #8f452f 72%,
            #3f454c 100%
        );
    box-shadow:
        -2rem 3rem 4rem rgba(63, 69, 76, 0.42),
        -0.6rem 1.2rem 1.8rem rgba(63, 69, 76, 0.28),
        inset 0 0 0 0.2rem rgba(169, 87, 56, 0.22),
        inset 1.1rem 1.2rem 2.6rem rgba(169, 87, 56, 0.12),
        inset -1.6rem -1.8rem 3rem rgba(63, 69, 76, 0.34);
    transform-style: preserve-3d;
}

.contactClipboardBoard::before {
    content: "";
    position: absolute;
    inset: 0.8rem;
    border-radius: 2.4rem;
    border: 0.12rem solid rgba(169, 87, 56, 0.2);
    pointer-events: none;
}

.contactClipboardBoard::after {
    content: "";
    position: absolute;
    left: 2rem;
    right: 2rem;
    bottom: -1.8rem;
    height: 3.4rem;
    border-radius: 0 0 2.5rem 2.5rem;
    background:
        linear-gradient(
            to bottom,
            #5b4a43 0%,
            #3f454c 70%,
            #2f3439 100%
        );
    box-shadow:
        0 1.5rem 2rem rgba(63, 69, 76, 0.28);
    transform: translateZ(-1rem);
    z-index: -1;
}

.contactClipboardBoardGlow {
    position: absolute;
    top: 3rem;
    left: 3rem;
    width: 65%;
    height: 50%;
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse at top left,
            rgba(169, 87, 56, 0.28) 0%,
            rgba(169, 87, 56, 0.12) 35%,
            transparent 72%
        );
    filter: blur(2.4rem);
    pointer-events: none;
}

.contactPaper {
    position: absolute;
    top: 5.2rem;
    left: 4rem;
    right: 4rem;
    bottom: 4rem;
    border-radius: 2rem;
    overflow: hidden;
    background:
        #fff;
    box-shadow:
        0 2.2rem 3.2rem rgba(63, 69, 76, 0.32),
        0 0.6rem 1rem rgba(63, 69, 76, 0.18),
        inset 0 0 0 0.1rem rgba(63, 69, 76, 0.07),
        inset -1.2rem -1.2rem 2.4rem rgba(63, 69, 76, 0.04);
    transform: translateZ(1.25rem);
    z-index: 3;
}

.contactPaper::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        repeating-linear-gradient(
            0deg,
            rgba(63, 69, 76, 0.017) 0,
            rgba(63, 69, 76, 0.017) 0.07rem,
            transparent 0.07rem,
            transparent 0.46rem
        );
    opacity: 0.38;
}

.contactPaper::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 12rem;
    background:
        linear-gradient(
            to bottom,
            rgba(143, 69, 47, 0.045),
            transparent
        );
    pointer-events: none;
}

.contactPaperInner {
    position: relative;
    z-index: 2;
    height: 100%;
    padding: 4.7rem 4.8rem 4.2rem;
}

.contactFormHeading {
    position: relative;
    margin-bottom: 1.6rem;
}

.contactFormHeading h3 {
    margin: 0;
    color: #a95738;
    font-family: "Cormorant Garamond", serif;
    font-size: 4.2rem;
    font-style: italic;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.025em;
}

.contactFormHeadingLine {
    display: block;
    width: 8rem;
    height: 0.25rem;
    margin-top: 1.2rem;
    border-radius: 999rem;
    background:
        linear-gradient(
            90deg,
            #a95738,
            #b76647
        );
}

.contactForm {
    width: 100%;
}

.contactFormRow {
    display: grid;
    grid-template-columns: 3.8rem minmax(0, 1fr);
    gap: 1.4rem;
    align-items: end;
}

.contactFormRow + .contactFormRow {
    margin-top: 2.2rem;
}

.contactFormRowMessage {
    align-items: start;
}

.contactFormIcon {
    height: 5.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #a95738;
    font-family: "Inter", sans-serif;
    font-size: 2.4rem;
    line-height: 1;
}

.contactFormRowMessage .contactFormIcon {
    padding-top: 2.6rem;
}

.contactFormField {
    min-width: 0;
}

.contactFormField label {
    display: block;
    margin-bottom: 0.75rem;
    color: #3f454c;
    font-family: "Inter", sans-serif;
    font-size: 1.28rem;
    font-weight: 700;
    line-height: 1.3;
}

.contactFormField input,
.contactFormField select,
.contactFormField textarea {
    width: 100%;
    border: 0.11rem solid rgba(143, 69, 47, 0.18);
    border-radius: 0.9rem;
    outline: none;
    background: #fff;
    color: #3f454c;
    font-family: "Inter", sans-serif;
    font-size: 1.32rem;
    font-weight: 400;
    box-shadow:
        inset 0 0.15rem 0.45rem rgba(63, 69, 76, 0.025),
        0 0.3rem 0.8rem rgba(63, 69, 76, 0.018);
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease;
}

.contactFormField input,
.contactFormField select {
    height: 5.2rem;
    padding: 0 1.5rem;
}

.contactFormField textarea {
    min-height: 13.8rem;
    padding: 1.4rem 1.5rem;
    resize: vertical;
    line-height: 1.55;
}

.contactFormField input::placeholder,
.contactFormField textarea::placeholder {
    color: rgba(63, 69, 76, 0.48);
}

.contactFormField input:hover,
.contactFormField select:hover,
.contactFormField textarea:hover {
    border-color: rgba(143, 69, 47, 0.25);
}

.contactFormField input:focus,
.contactFormField select:focus,
.contactFormField textarea:focus {
    border-color: rgba(143, 69, 47, 0.56);
    background: rgba(210, 208, 204, 0.9);
    box-shadow:
        0 0 0 0.3rem rgba(143, 69, 47, 0.07),
        inset 0 0.15rem 0.45rem rgba(63, 69, 76, 0.02);
}

.contactFormField select {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    padding-right: 4rem;
    background-image:
        linear-gradient(
            45deg,
            transparent 50%,
            #3f454c 50%
        ),
        linear-gradient(
            135deg,
            #3f454c 50%,
            transparent 50%
        ),
        linear-gradient(
            180deg,
            rgba(210, 208, 204, 0.7),
            rgba(210, 208, 204, 0.56)
        );
    background-position:
        calc(100% - 1.9rem) 2.2rem,
        calc(100% - 1.45rem) 2.2rem,
        0 0;
    background-size:
        0.48rem 0.48rem,
        0.48rem 0.48rem,
        100% 100%;
    background-repeat: no-repeat;
}

.contactFormButton {
    width: calc(100% - 5.2rem);
    min-height: 5.8rem;
    margin-top: 2.8rem;
    margin-left: 5.2rem;
    padding: 1.3rem 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.1rem;
    border: none;
    border-radius: 0.9rem;
    background:
        linear-gradient(
            135deg,
            #a95738 0%,
            #8f452f 58%,
            #3f454c 100%
        );
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    cursor: pointer;
    box-shadow:
        0 1.1rem 2rem rgba(63, 69, 76, 0.2),
        inset 0 0.1rem 0 rgba(210, 208, 204, 0.14),
        inset 0 -0.2rem 0.3rem rgba(63, 69, 76, 0.2);
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        filter 0.25s ease;
}

.contactFormButton:hover {
    transform: translateY(-0.25rem);
    filter: brightness(1.08);
    box-shadow:
        0 1.5rem 2.5rem rgba(63, 69, 76, 0.28),
        inset 0 0.1rem 0 rgba(210, 208, 204, 0.18),
        inset 0 -0.2rem 0.3rem rgba(63, 69, 76, 0.2);
}

.contactFormButton:active {
    transform: translateY(0);
}

.contactFormButtonIcon {
    font-size: 1.7rem;

}

.contactClipShadow {
    position: absolute;
    top: 7.6rem;
    left: 50%;
    width: 31rem;
    height: 4rem;
    transform:
        translateX(-50%)
        translateZ(1.5rem);
    border-radius: 50%;
    background:
        radial-gradient(
            ellipse at center,
            rgba(63, 69, 76, 0.5) 0%,
            rgba(63, 69, 76, 0.24) 44%,
            transparent 76%
        );
    filter: blur(1.15rem);
    z-index: 5;
    pointer-events: none;
}

.contactClipboardClip {
    position: absolute;
    top: -5.8rem;
    left: 50%;
    width: 31rem !important;
    max-width: none !important;
    height: auto !important;
    transform:
        translateX(-50%)
        translateZ(3rem);
    transform-origin: center bottom;
    z-index: 10;
    pointer-events: none;
    filter:
        drop-shadow(0 1.2rem 0.7rem rgba(63, 69, 76, 0.36))
        drop-shadow(0 0.2rem 0.15rem rgba(210, 208, 204, 0.18));
}

.contactCustomSelect {
    position: relative;
    width: 100%;
}

.contactCustomSelectTrigger {
    width: 100%;
    height: 5.2rem;
    padding: 0 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border: 0.11rem solid rgba(143, 69, 47, 0.18);
    border-radius: 0.9rem;
    outline: none;
    background: #fff;
    color: rgba(63, 69, 76, 0.48);
    font-family: "Inter", sans-serif;
    font-size: 1.32rem;
    font-weight: 400;
    text-align: left;
    cursor: pointer;
    box-shadow:
        inset 0 0.15rem 0.45rem rgba(63, 69, 76, 0.025),
        0 0.3rem 0.8rem rgba(63, 69, 76, 0.018);
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease;
}

.contactCustomSelectTrigger:hover {
    border-color: rgba(143, 69, 47, 0.25);
}

.contactCustomSelect:not(.contactCustomSelectHoverDisabled):hover .contactCustomSelectMenu {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateY(0);
}

.contactCustomSelect.contactCustomSelectHoverDisabled .contactCustomSelectMenu {
opacity: 0;
visibility: hidden;
pointer-events: none;
transform: translateY(-0.7rem) scale(0.98);
}
.contactCustomSelect.contactCustomSelectOpen .contactCustomSelectTrigger {
    border-color: rgba(143, 69, 47, 0.56);
    background: #8b432f;
    color: #fff;
    box-shadow:
        0 0 0 0.3rem rgba(143, 69, 47, 0.07),
        inset 0 0.15rem 0.45rem rgba(63, 69, 76, 0.02);
}

.contactCustomSelectValue {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.contactCustomSelect.contactCustomSelectSelected .contactCustomSelectValue {
    color: #3f454c;
}

.contactCustomSelect.contactCustomSelectSelected.contactCustomSelectOpen .contactCustomSelectValue {
color: #ffffff;
}

.contactCustomSelectArrow {
    flex: 0 0 auto;
    color: #3f454c;
    font-size: 1.8rem;
    line-height: 1;
    transform: translateY(-0.15rem);
    transition: transform 0.25s ease;
}

.contactCustomSelect.contactCustomSelectOpen .contactCustomSelectArrow {
    transform: translateY(0.15rem) rotate(180deg);
    color: #fff;
}

.contactCustomSelectMenu {
    position: absolute;
    top: calc(100% + 0.1rem);
    left: 0;
    width: 100%;
    padding: 0.7rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    border: 0.1rem solid rgba(143, 69, 47, 0.16);
    border-radius: 1rem;
    background: #fff;
    box-shadow:
        0 1.8rem 3rem rgba(63, 69, 76, 0.2),
        0 0.4rem 0.8rem rgba(63, 69, 76, 0.08),
        inset 0 0 0 0.1rem rgba(210, 208, 204, 0.6);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-0.7rem) scale(0.98);
    transform-origin: top center;
    transition:
        opacity 0.2s ease,
        visibility 0.2s ease,
        transform 0.2s ease;
    z-index: 50;
}

.contactCustomSelect.contactCustomSelectOpen .contactCustomSelectMenu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.contactCustomSelectMenu button {
    width: 100%;
    min-height: 1.2rem;
    padding: 0.9rem 1.2rem;
    display: flex;
    align-items: center;
    border: 0;
    border-radius: 0.7rem;
    background: transparent;
    color: #3f454c;
    font-family: "Inter", sans-serif;
    font-size: 1.25rem;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
    transition:
        background 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease;
}

.contactCustomSelectMenu button:hover {
    background: rgba(143, 69, 47, 0.08);
    color: #a95738;
    transform: translateX(0.25rem);
}

.contactCustomSelectMenu button.contactCustomSelectOptionActive {
    background:
        linear-gradient(
            135deg,
            #a95738,
            #8f452f
        );
    color: #ffffff;
}

.sectionPaused .heroCarousel,
.sectionPaused .carouselGlowRing::before,

.sectionPaused .videoCarouselStepGlow,
.sectionPaused .videoCarouselStepNode,
.sectionPaused .videoCarouselHorizontalGlow,
.sectionPaused .videoCarouselRingBackgroundImg,

.sectionPaused .socialWebsiteCard,
.sectionPaused .socialVideoCard,

.sectionPaused .opportunityPinPulse,

.sectionPaused .webDevOrbitOne,

.sectionPaused .folderHaloRingOne,
.sectionPaused .folderHaloRingTwo,
.sectionPaused .folderHaloRingThree,

.sectionPaused .emailResponseGlow,
.sectionPaused .emailResponseOrbitOuter,
.sectionPaused .emailResponseOrbitInner,

.sectionPaused .getFoundBackground::before,
.sectionPaused .getFoundBackgroundOrbOne,
.sectionPaused .getFoundBackgroundOrbTwo,
.sectionPaused .getFoundBackgroundOrbThree,
.sectionPaused .getFoundBackgroundGrid,
.sectionPaused .getFoundBackgroundLineOne,
.sectionPaused .getFoundBackgroundLineTwo,
.sectionPaused .getFoundBackground::after,

.sectionPaused .contactBackground::before,
.sectionPaused .contactBackgroundGlowOne,
.sectionPaused .contactBackgroundGlowTwo,
.sectionPaused .contactBackgroundGlowThree,
.sectionPaused .contactBackgroundHaloOne,
.sectionPaused .contactBackgroundHaloTwo,
.sectionPaused .contactBackgroundBeamOne,
.sectionPaused .contactBackgroundBeamTwo,
.sectionPaused .contactBackgroundBeamThree,
.sectionPaused .contactBackgroundDots {
    animation-play-state: paused;
}

.navbar,
.navbarInner,
.navDropdown,
.navDropdownMenu {
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
filter: none !important;
}