/* =========================================================
   GLOBAL RESET
========================================================= */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "DM Sans", sans-serif;

    background: #ffffff;

    color: #252b35;

    overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Playfair Display", serif;
}

a {
    text-decoration: none;
}

img {
    max-width: 100%;
    display: block;
}


/* =========================================================
   THEME COLORS

   Navy  : #071A2D
   Gold  : #C9A45C
   White : #FFFFFF
========================================================= */


/* =========================================================
   HEADER
========================================================= */

.law-header {

    position: fixed;

    top: 0;
    left: 0;

    width: 100%;

    z-index: 9999;

    padding: 2px 0;

    background: rgb(7 26 45 / 0%);

    transition:
        background 0.4s ease,
        padding 0.4s ease,
        box-shadow 0.4s ease,
        backdrop-filter 0.4s ease;
}


/* =========================================================
   SCROLLED HEADER
========================================================= */

.law-header.scrolled {

    /* padding: 9px 0; */

    background: rgba(7, 26, 45, 0.97);

    backdrop-filter: blur(14px);

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


/* =========================================================
   NAVBAR
========================================================= */

.law-navbar {

    padding: 0;

    min-height: 72px;
}


/* =========================================================
   LOGO
========================================================= */

.law-logo {

    display: flex;

    align-items: center;

    width: 110px;

    transition: 0.35s ease;
}

.law-logo-image {

    width: 145px;

    height: auto;

    object-fit: contain;

    transition: 0.35s ease;

    filter:
        drop-shadow(0 5px 12px rgba(0, 0, 0, 0.18));
}


/* Logo hover */

.law-logo:hover .law-logo-image {

    transform: scale(1.03);
}


/* =========================================================
   NAVIGATION LINKS
========================================================= */

.law-header .nav-link {

    position: relative;

    color: rgba(255, 255, 255, 0.94);

    font-size: 14px;

    font-weight: 500;

    letter-spacing: 0.2px;

    padding: 13px 14px !important;

    transition: 0.3s ease;
}


.law-header .nav-link:hover {

    color: #d9b56b;
}


.law-header .nav-link.active {

    color: #d9b56b;
}


/* =========================================================
   LINK UNDERLINE
========================================================= */

.law-header .nav-link::after {

    content: "";

    position: absolute;

    left: 14px;
    right: 14px;

    bottom: 5px;

    height: 1px;

    background: #c9a45c;

    transform: scaleX(0);

    transform-origin: center;

    transition: 0.35s ease;
}


.law-header .nav-link:hover::after,
.law-header .nav-link.active::after {

    transform: scaleX(1);
}


/* =========================================================
   DROPDOWN
========================================================= */

.law-dropdown {

    min-width: 245px;

    margin-top: 15px;

    padding: 9px;

    border: 1px solid rgba(201, 164, 92, 0.25);

    border-radius: 0;

    background: #071a2d;

    box-shadow:
        0 18px 45px rgba(0, 0, 0, 0.28);
}


.law-dropdown .dropdown-item {

    color: #ffffff;

    font-size: 13px;

    padding: 11px 13px;

    transition: 0.3s ease;
}


.law-dropdown .dropdown-item:hover {

    color: #d9b56b;

    background:
        rgba(201, 164, 92, 0.10);

    padding-left: 18px;
}


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

.law-nav-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    min-height: 46px;

    padding: 0 18px;

    background: #c9a45c;

    border: 1px solid #c9a45c;

    color: #071a2d;

    font-size: 13px;

    font-weight: 700;

    transition: 0.35s ease;

    overflow: hidden;

    position: relative;
}


.law-nav-btn span,
.law-nav-btn i {

    position: relative;

    z-index: 2;
}


.law-nav-btn::before {

    content: "";

    position: absolute;

    inset: 0;

    background: #ffffff;

    transform:
        translateY(100%);

    transition: 0.35s ease;
}


.law-nav-btn:hover::before {

    transform:
        translateY(0);
}


.law-nav-btn:hover {

    color: #071a2d;
}


.law-nav-btn i {

    transition: 0.35s ease;
}


.law-nav-btn:hover i {

    transform:
        translate(3px, -3px);
}


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

.law-toggler {

    width: 45px;

    height: 43px;

    padding: 7px;

    border: 1px solid rgba(201, 164, 92, 0.65);

    border-radius: 0;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    gap: 5px;
}


.law-toggler:focus {

    box-shadow: none;
}


.law-toggler span {

    display: block;

    width: 22px;

    height: 1px;

    background: #c9a45c;

    transition: 0.3s ease;
}


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

@media (max-width: 991px) {


    .law-header {

        padding: 10px 0;

    }


    .law-header.scrolled {

        padding: 7px 0;

    }


    .law-navbar {

        min-height: 62px;

    }


    .law-logo {

        width: 115px;

    }


    .law-logo-image {

        width: 115px;

    }


    .navbar-collapse {

        margin-top: 12px;

        padding: 15px;

        background:
            rgba(7, 26, 45, 0.99);

        border-top:
            1px solid rgba(201, 164, 92, 0.25);

        box-shadow:
            0 20px 35px rgba(0, 0, 0, 0.18);
    }


    .law-header .nav-link {

        padding: 12px 5px !important;

    }


    .law-header .nav-link::after {

        display: none;

    }


    .law-dropdown {

        margin-top: 0;

        padding: 5px;

        border: none;

        box-shadow: none;

    }


    .law-dropdown .dropdown-item {

        padding: 10px;

    }


    .law-nav-btn {

        width: 100%;

    }

}


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

@media (min-width: 576px) and (max-width: 991px) {

    .law-logo {

        width: 125px;

    }

    .law-logo-image {

        width: 125px;

    }

}


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

@media (max-width: 575px) {

    .law-header {

        padding: 8px 0;

    }


    .law-logo {

        width: 105px;

    }


    .law-logo-image {

        width: 75px;

    }


    .law-toggler {

        width: 42px;

        height: 40px;

    }

}

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

.adv-hero {

    position: relative;

    height: 690px;

    overflow: hidden;

    background: #071a2d;
}


/* =========================================================
   EACH SLIDE
========================================================= */

.adv-hero-slide {

    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    display: flex;

    align-items: center;

    opacity: 0;

    visibility: hidden;

    transition:
        opacity 1s ease,
        visibility 1s ease;
}


.adv-hero-slide.active {

    opacity: 1;

    visibility: visible;

    z-index: 2;
}


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

.adv-hero-bg {

    position: absolute;

    inset: -20px;

    background-position: center;

    background-size: cover;

    background-repeat: no-repeat;

    transform: scale(1.06);

    transition:
        transform 7s ease;
}


.adv-hero-slide.active .adv-hero-bg {

    transform: scale(1.12);

}


/* =========================================================
   OVERLAY
========================================================= */

.adv-hero-overlay {

    position: absolute;

    inset: 0;

    background:
        linear-gradient(90deg, rgb(4 17 30 / 0%) 0%, rgb(4 17 30 / 0%) 32%, rgb(4 17 30 / 1%) 62%, rgb(4 17 30 / 0%) 100%);

    z-index: 1;
}


/* =========================================================
   CONTAINER
========================================================= */

.adv-hero-slide .container {

    position: relative;

    z-index: 5;
}


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

.adv-hero-content {

    max-width: 730px;

    opacity: 0;

    transform:
        translateY(35px);

}


/* Animate ONLY active slide */

.adv-hero-slide.active .adv-hero-content {

    animation:
        heroContentReveal 1s 0.25s ease forwards;
}


@keyframes heroContentReveal {

    from {

        opacity: 0;

        transform:
            translateY(35px);

    }

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


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

.adv-hero-label {

    display: flex;

    align-items: center;

    gap: 13px;

    margin-bottom: 20px;
}


.adv-hero-label span {

    width: 42px;

    height: 1px;

    background: #c9a45c;

    transform:
        scaleX(0);

    transform-origin: left;

}


.adv-hero-slide.active .adv-hero-label span {

    animation:
        labelLine 0.8s 0.4s ease forwards;
}


@keyframes labelLine {

    to {

        transform:
            scaleX(1);

    }

}


.adv-hero-label p {

    margin: 0;

    color: #d9b56b;

    font-size: 11px;

    font-weight: 600;

    letter-spacing: 3px;
}


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

.adv-hero h1 {

    margin: 0;

    color: #ffffff;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        clamp(50px, 6vw, 78px);

    font-weight: 500;

    line-height: 1;

    letter-spacing: -1.5px;
}


.adv-hero h1 strong {

    display: block;

    color: #d9b56b;

    font-weight: 500;

    font-style: italic;

    margin-top: 7px;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.adv-hero-description {

    max-width: 590px;

    margin:
        25px 0 30px;

    color:
        rgba(255, 255, 255, 0.75);

    font-size: 15px;

    line-height: 1.75;
}


/* =========================================================
   BUTTONS
========================================================= */

.adv-hero-buttons {

    display: flex;

    align-items: center;

    gap: 13px;

    flex-wrap: wrap;
}


.adv-btn-primary {

    min-height: 52px;

    padding:
        0 22px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    background: #c9a45c;

    color: #071a2d;

    border: 1px solid #c9a45c;

    font-size: 12px;

    font-weight: 700;

    transition: 0.35s ease;
}


.adv-btn-primary:hover {

    background: #ffffff;

    color: #071a2d;

    border-color: #ffffff;
}


.adv-btn-primary i {

    transition: 0.3s ease;
}


.adv-btn-primary:hover i {

    transform:
        translate(3px, -3px);
}


.adv-btn-outline {

    min-height: 52px;

    padding:
        0 22px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    color: #ffffff;

    border:
        1px solid rgba(201, 164, 92, 0.7);

    font-size: 12px;

    font-weight: 600;

    transition: 0.35s ease;
}


.adv-btn-outline:hover {

    color: #071a2d;

    background: #c9a45c;

    border-color: #c9a45c;
}


.adv-btn-outline i {

    transition: 0.3s ease;
}


.adv-btn-outline:hover i {

    transform:
        translateX(4px);
}


/* =========================================================
   DECORATIVE CIRCLE
========================================================= */

.adv-hero-circle {

    position: absolute;

    right: -150px;

    top: -180px;

    width: 500px;

    height: 500px;

    border:
        1px solid rgba(201, 164, 92, 0.14);

    border-radius: 50%;

    z-index: 3;

    animation:
        circleRotate 20s linear infinite;
}


.adv-hero-circle::before {

    content: "";

    position: absolute;

    inset: 35px;

    border:
        1px solid rgba(201, 164, 92, 0.08);

    border-radius: 50%;
}


@keyframes circleRotate {

    from {

        transform:
            rotate(0deg);

    }

    to {

        transform:
            rotate(360deg);

    }

}


/* =========================================================
   SLIDER ARROWS
========================================================= */

.adv-slider-arrow {

    position: absolute;

    top: 50%;

    transform:
        translateY(-50%);

    z-index: 10;

    width: 48px;

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border:
        1px solid rgba(255, 255, 255, 0.35);

    border-radius: 50%;

    background:
        rgba(7, 26, 45, 0.25);

    color: #ffffff;

    backdrop-filter: blur(5px);

    transition: 0.35s ease;
}


.adv-slider-arrow:hover {

    background: #c9a45c;

    border-color: #c9a45c;

    color: #071a2d;

}


.adv-slider-prev {

    left: 35px;

}


.adv-slider-next {

    right: 35px;

}


/* =========================================================
   SLIDER DOTS
========================================================= */

.adv-slider-controls {

    position: absolute;

    left: 50px;

    bottom: 42px;

    z-index: 20;

    display: flex;

    align-items: center;

    gap: 9px;
}


.adv-slider-controls span {

    width: 28px;

    height: 2px;

    cursor: pointer;

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

    transition: 0.4s ease;
}


.adv-slider-controls span.active {

    width: 55px;

    background: #c9a45c;
}


/* =========================================================
   SCROLL
========================================================= */

.adv-scroll {

    position: absolute;

    left: 50%;

    bottom: 27px;

    transform:
        translateX(-50%);

    z-index: 20;

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 6px;

    color:
        rgba(255, 255, 255, 0.65);

    font-size: 8px;

    letter-spacing: 3px;

    transition: 0.3s ease;
}


.adv-scroll:hover {

    color: #d9b56b;
}


.adv-scroll-icon {

    width: 33px;

    height: 33px;

    display: flex;

    align-items: center;

    justify-content: center;

    border:
        1px solid rgba(201, 164, 92, 0.6);

    border-radius: 50%;

    animation:
        scrollBounce 1.8s ease-in-out infinite;
}


.adv-scroll-icon i {

    color: #d9b56b;

}


@keyframes scrollBounce {

    0%,
    100% {

        transform:
            translateY(0);

    }

    50% {

        transform:
            translateY(6px);

    }

}


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

@media (max-width: 991px) {

    .adv-hero {

        height: 650px;

    }


    .adv-hero h1 {

        font-size:
            clamp(46px, 8vw, 65px);

    }


    .adv-slider-arrow {

        width: 42px;

        height: 42px;

    }


    .adv-slider-prev {

        left: 18px;

    }


    .adv-slider-next {

        right: 18px;

    }

}


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

@media (max-width: 767px) {

    .adv-hero {

        height: 650px;

    }


    .adv-hero-overlay {

        background:

          linear-gradient(90deg, rgb(4 17 30 / 0%), rgb(4 17 30 / 0%));

    }


    .adv-hero h1 {

        font-size: 45px;

    }


    .adv-hero-description {

        font-size: 13px;

        max-width: 350px;

    }


    .adv-hero-buttons {

        flex-direction: column;

        align-items: flex-start;

    }


    .adv-btn-primary,
    .adv-btn-outline {

        min-height: 49px;

    }


    .adv-slider-arrow {

        width: 38px;

        height: 38px;

        font-size: 12px;

    }


    .adv-slider-prev {

        left: 12px;

    }


    .adv-slider-next {

        right: 12px;

    }


    .adv-slider-controls {

        left: 20px;

        bottom: 28px;

    }


    .adv-scroll {

        display: none;

    }


    .adv-hero-circle {

        width: 280px;

        height: 280px;

        right: -150px;

        top: -100px;

    }

}


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

@media (max-width: 575px) {

    .adv-hero {

        height: 375px;

    }


    .adv-hero h1 {

        font-size: 40px;

    }


    .adv-hero-label p {

        font-size: 9px;

        letter-spacing: 2.2px;

    }


    .adv-hero-description {

        font-size: 12.5px;

        line-height: 1.7;

    }

}

/* =========================================================
   ABOUT SECTION
========================================================= */

.adv-about {

    position: relative;

    padding: 50px 0;

    background: #f8f6f1;

    overflow: hidden;
}


/* =========================================================
   IMAGE
========================================================= */

.adv-about-image {

    position: relative;

    max-width: 480px;

    margin: 0 auto;

    padding-right: 30px;

}


.adv-about-image::before {

    content: "";

    position: absolute;

    top: -18px;

    left: -18px;

    width: 120px;

    height: 120px;

    border-top:
        1px solid #c9a45c;

    border-left:
        1px solid #c9a45c;

    z-index: 0;

}


.adv-about-image::after {

    content: "";

    position: absolute;

    right: 5px;

    bottom: -18px;

    width: 120px;

    height: 120px;

    border-right:
        1px solid #c9a45c;

    border-bottom:
        1px solid #c9a45c;

    z-index: 0;

}


.adv-about-image img {

    position: relative;

    z-index: 2;

    width: 100%;

    height: 530px;

    object-fit: cover;

    object-position: center;

    filter:
        grayscale(8%);

}


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

.adv-about-experience {

    position: absolute;

    right: 0;

    bottom: 35px;

    z-index: 5;

    width: 185px;

    min-height: 105px;

    padding: 18px 20px;

    display: flex;

    align-items: center;

    gap: 13px;

    background: #071a2d;

    border-left:
        3px solid #c9a45c;

    box-shadow:
        0 15px 35px rgba(7, 26, 45, 0.18);

}


.adv-about-experience strong {

    font-family:
        "Playfair Display",
        serif;

    font-size: 55px;

    line-height: 1;

    color: #c9a45c;

    font-weight: 500;

}


.adv-about-experience span {

    color:
        rgba(255, 255, 255, 0.78);

    font-size: 11px;

    line-height: 1.5;

}


/* =========================================================
   SECTION LABEL
========================================================= */

.adv-section-label {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 18px;

}


.adv-section-label span {

    width: 35px;

    height: 1px;

    background: #c9a45c;

}


.adv-section-label p {

    margin: 0;

    color: #a37d35;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 3px;

}


/* =========================================================
   ABOUT HEADING
========================================================= */

.adv-about-content {

    padding-left: 25px;

}


.adv-about-content h2 {

    max-width: 650px;

    margin-bottom: 22px;

    color: #071a2d;

    font-size:
        clamp(40px, 4.5vw, 62px);

    font-weight: 500;

    line-height: 1.08;

    letter-spacing: -1px;

}


.adv-about-content h2 strong {

    display: block;

    color: #a37d35;

    font-weight: 500;

    font-style: normal;

}


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

.adv-about-intro {

    max-width: 650px;

    margin-bottom: 12px;

    color: #252b35;

    font-size: 17px;

    font-weight: 600;

    line-height: 1.7;

}


.adv-about-text {

    max-width: 650px;

    margin-bottom: 30px;

    color: #6c7279;

    font-size: 15px;

    line-height: 1.85;

}


/* =========================================================
   TRUST POINTS
========================================================= */

.adv-about-points {

    display: grid;

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

    gap: 20px;

    margin-bottom: 30px;

}


.adv-about-point {

    padding-top: 20px;

    border-top:
        1px solid rgba(7, 26, 45, 0.14);

}


.adv-point-icon {

    width: 39px;

    height: 39px;

    margin-bottom: 13px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #071a2d;

    color: #c9a45c;

    font-size: 25px;

    transition: 0.35s ease;

}


.adv-about-point:hover .adv-point-icon {

    background: #c9a45c;

    color: #071a2d;

    transform:
        translateY(-4px);

}


.adv-about-point h4 {

    margin-bottom: 7px;

    color: #071a2d;

    font-family:
        "DM Sans",
        sans-serif;

    font-size: 15px;

    font-weight: 700;

}


.adv-about-point p {

    margin: 0;

    color: #777d83;

    font-size: 13px;

    line-height: 1.6;

}


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

.adv-about-btn {

    display: inline-flex;

    align-items: center;

    gap: 11px;

    min-height: 50px;

    padding:
        0 21px;

    background: #071a2d;

    color: #ffffff;

    font-size: 15px;

    font-weight: 600;

    transition: 0.35s ease;

}


.adv-about-btn i {

    color: #c9a45c;

    transition: 0.35s ease;

}


.adv-about-btn:hover {

    background: #c9a45c;

    color: #071a2d;

}


.adv-about-btn:hover i {

    color: #071a2d;

    transform:
        translate(3px, -3px);

}


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

@media (max-width: 991px) {

    .adv-about {

        padding: 85px 0;

    }


    .adv-about-content {

        padding-left: 0;

        margin-top: 20px;

    }


    .adv-about-content h2 {

        font-size: 48px;

    }


    .adv-about-points {

        gap: 15px;

    }

}


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

@media (max-width: 767px) {

    .adv-about {

        padding: 70px 0;

    }


    .adv-about-image {

        max-width: 430px;

        padding-right: 18px;

    }


    .adv-about-image img {

        height: 420px;

    }


    .adv-about-experience {

        right: -2px;

        bottom: 22px;

        width: 165px;

        min-height: 90px;

    }


    .adv-about-experience strong {

        font-size: 35px;

    }


    .adv-about-content {

        margin-top: 45px;

    }


    .adv-about-content h2 {

        font-size: 41px;

    }


    .adv-about-intro {

        font-size: 15px;

    }


    .adv-about-text {

        font-size: 13px;

    }


    .adv-about-points {

        grid-template-columns: 1fr;

        gap: 0;

    }


    .adv-about-point {

        display: flex;

        gap: 14px;

        padding: 18px 0;

    }


    .adv-point-icon {

        flex-shrink: 0;

        margin-bottom: 0;

    }

    .adv-section-label p {
    margin: 0;
    color: #a37d35;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 3px;
}

}


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

@media (max-width: 575px) {

    .adv-about {

        padding: 60px 0;

    }


    .adv-about-image img {

        height: 380px;

    }


    .adv-about-content h2 {

        font-size: 36px;

    }


    .adv-about-experience {

        width: 150px;

        min-height: 82px;

        padding: 14px;

    }


    .adv-about-experience strong {

        font-size: 31px;

    }


    .adv-about-experience span {

        font-size: 10px;

    }

}

/* =========================================================
   LEGAL SERVICES SECTION
   FIXED-LOOK BACKGROUND + CARD SLIDER
========================================================= */

.adv-services-slider {

    position: relative;

    width: 100%;

    min-height: 780px;

    padding: 70px 0 30px;

    overflow: hidden;

    background: #071a2d;

}


/* =========================================================
   SERVICES BACKGROUND
   IMPORTANT:
   DO NOT USE position: fixed
========================================================= */

.adv-services-bg {

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    background-image:
        url("../images/legal-services-bg.jpg");

    background-size: cover;

    background-position: center center;

    background-repeat: no-repeat;

    z-index: 0;

}


/* =========================================================
   BACKGROUND OVERLAY
========================================================= */

.adv-services-overlay {

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    background:
        linear-gradient(90deg, rgb(4 16 29 / 52%) 0%, rgb(4 16 29 / 53%) 42%, rgb(4 16 29 / 49%) 72%, rgb(4 16 29 / 54%) 100%);

    z-index: 1;

}


/* =========================================================
   SUBTLE GOLD LIGHT
========================================================= */

.adv-services-slider::after {

    content: "";

    position: absolute;

    width: 420px;
    height: 420px;

    right: -180px;
    top: 120px;

    border-radius: 50%;

    background:
        rgba(201, 164, 92, 0.07);

    filter: blur(40px);

    z-index: 2;

    pointer-events: none;

}


/* =========================================================
   CONTAINER
========================================================= */

.adv-services-slider>.container {

    position: relative;

    z-index: 5;

}


/* =========================================================
   SECTION TOP
========================================================= */

.adv-services-top {

    position: relative;

    margin-bottom: 55px;

}


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

.adv-services-label {

    display: flex;

    align-items: center;

    gap: 13px;

    margin-bottom: 20px;

}


.adv-services-label span {

    display: block;

    width: 55px;

    height: 1px;

    background: #c9a45c;

}


.adv-services-label p {

    margin: 0;

    color: #d9b56b;

    font-family:
        "DM Sans",
        sans-serif;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 3px;

}


/* =========================================================
   HEADING AREA
========================================================= */

.adv-services-heading {

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 50px;

}


.adv-services-heading h2 {

    max-width: 720px;

    margin: 0;

    color: #ffffff;

    font-family:
        "Playfair Display",
        serif;

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

    font-weight: 500;

    font-style: normal;

    line-height: 1.04;

    letter-spacing: -1.2px;

}


/* GOLD HEADING */

.adv-services-heading h2 strong {

    display: block;

    margin-top: 3px;

    color: #d9b56b;

    font-family:
        "Playfair Display",
        serif;

    font-size: inherit;

    font-weight: 500;

    font-style: normal;

    line-height: inherit;

}


/* SMALL GOLD LINE */

.adv-services-heading h2 strong::after {

    content: "";

    display: block;

    width: 58px;

    height: 1px;

    margin-top: 15px;

    background: #c9a45c;

}


/* DESCRIPTION */

.adv-services-heading>p {

    max-width: 370px;

    margin: 0 0 4px;

    color:
        rgba(255, 255, 255, 0.68);

    font-family:
        "DM Sans",
        sans-serif;

    font-size: 14px;

    font-weight: 400;

    line-height: 1.9;

}


/* =========================================================
   SLIDER WRAPPER
========================================================= */

.adv-services-slider-wrap {

    position: relative;

    width: 100%;

}


/* =========================================================
   CARD TRACK
========================================================= */

.adv-services-track {

    display: flex;

    align-items: stretch;

    gap: 15px;

    width: 100%;

    overflow-x: auto;

    overflow-y: hidden;

    padding: 5px 2px 25px;

    scroll-behavior: smooth;

    scroll-snap-type: x mandatory;

    scrollbar-width: none;

    -webkit-overflow-scrolling: touch;

}


.adv-services-track::-webkit-scrollbar {

    display: none;

}


/* =========================================================
   SERVICE CARD
========================================================= */

.adv-service-card {

    position: relative;

    flex: 0 0 285px;

    height: 405px;

    overflow: hidden;

    scroll-snap-align: start;

    border:
        1px solid rgba(255, 255, 255, 0.25);

    background: #071a2d;

    cursor: pointer;

    transition:
        transform 0.45s ease,
        border-color 0.45s ease,
        box-shadow 0.45s ease;

}


/* FIRST CARD */

.adv-service-card:first-child {

    flex-basis: 330px;

}


/* HOVER */

.adv-service-card:hover {

    transform:
        translateY(-8px);

    border-color:
        rgba(201, 164, 92, 0.85);

    box-shadow:
        0 25px 55px rgba(0, 0, 0, 0.38);

}


/* =========================================================
   CARD IMAGE
========================================================= */

.adv-service-card-image {

    position: absolute;

    inset: 0;

    overflow: hidden;

}


.adv-service-card-image img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 0.9s cubic-bezier(.2, .7, .2, 1);

}


.adv-service-card:hover .adv-service-card-image img {

    transform:
        scale(1.09);

}


/* =========================================================
   CARD IMAGE OVERLAY
========================================================= */

.adv-service-card-overlay {

    position: absolute;

    inset: 0;

    background:
        linear-gradient(180deg,
            rgba(4, 16, 29, 0.10) 0%,
            rgba(4, 16, 29, 0.25) 35%,
            rgba(4, 16, 29, 0.96) 100%);

    z-index: 1;

    transition:
        background 0.5s ease;

}


.adv-service-card:hover .adv-service-card-overlay {

    background:
        linear-gradient(180deg,
            rgba(4, 16, 29, 0.12) 0%,
            rgba(4, 16, 29, 0.38) 35%,
            rgba(4, 16, 29, 0.98) 100%);

}


/* =========================================================
   CARD NUMBER
========================================================= */

.adv-service-number {

    position: absolute;

    top: 22px;
    left: 22px;

    z-index: 4;

    display: flex;

    align-items: center;

    color: #d9b56b;

    font-family:
        "Playfair Display",
        serif;

    font-size: 25px;

    font-weight: 500;

    font-style: normal;

}


.adv-service-number::after {

    content: "";

    display: block;

    width: 32px;

    height: 1px;

    margin-left: 9px;

    background: #c9a45c;

    transition:
        width 0.4s ease;

}


.adv-service-card:hover .adv-service-number::after {

    width: 50px;

}


/* =========================================================
   CARD CONTENT
========================================================= */

.adv-service-card-content {

    position: absolute;

    left: 25px;
    right: 25px;

    bottom: 25px;

    z-index: 5;

}


/* CATEGORY */

.adv-service-card-content>span {

    display: block;

    margin-bottom: 9px;

    color: #d9b56b;

    font-family:
        "DM Sans",
        sans-serif;

    font-size: 12px;

    font-weight: 700;

    font-style: normal;

    letter-spacing: 2.2px;

    text-transform: uppercase;

}


/* TITLE */

.adv-service-card-content h3 {

    margin: 0 0 11px;

    color: #ffffff;

    font-family:
        "Playfair Display",
        serif;

    font-size: 27px;

    font-weight: 500;

    font-style: normal;

    line-height: 1.15;

    letter-spacing: -0.3px;

}


/* GOLD TITLE */

.adv-service-card-content h3 strong {

    display: block;

    color: #d9b56b;

    font-family:
        "Playfair Display",
        serif;

    font-weight: 500;

    font-style: normal;

}


/* DESCRIPTION */

.adv-service-card-content p {

    margin: 0 0 17px;

    color:
        rgba(255, 255, 255, 0.70);

    font-family:
        "DM Sans",
        sans-serif;

    font-size: 12px;

    font-weight: 400;

    line-height: 1.75;

}


/* =========================================================
   LEARN MORE
========================================================= */

.adv-service-card-content a {

    display: inline-flex;

    align-items: center;

    gap: 9px;

    color: #ffffff;

    font-family:
        "DM Sans",
        sans-serif;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.5px;

    text-transform: uppercase;

    transition:
        color 0.3s ease;

}


.adv-service-card-content a i {

    color: #c9a45c;

    font-size: 12px;

    transition:
        transform 0.3s ease;

}


.adv-service-card-content a:hover {

    color: #d9b56b;

}


.adv-service-card-content a:hover i {

    transform:
        translateX(5px);

}


/* =========================================================
   SLIDER ARROWS
========================================================= */

.adv-service-prev,
.adv-service-next {

    position: absolute;

    top: 50%;

    z-index: 20;

    width: 46px;
    height: 46px;

    display: flex;

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

    padding: 0;

    border:
        1px solid rgba(255, 255, 255, 0.50);

    border-radius: 50%;

    background:
        rgba(7, 26, 45, 0.72);

    backdrop-filter:
        blur(10px);

    color: #ffffff;

    font-size: 15px;

    cursor: pointer;

    transform:
        translateY(-50%);

    transition:
        all 0.35s ease;

}


.adv-service-prev {

    left: -23px;

}


.adv-service-next {

    right: -23px;

}


.adv-service-prev:hover,
.adv-service-next:hover {

    background: #c9a45c;

    border-color: #c9a45c;

    color: #071a2d;

    transform:
        translateY(-50%) scale(1.08);

}


/* =========================================================
   BOTTOM AREA
========================================================= */

.adv-services-bottom {

    position: relative;

    z-index: 5;

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-top: 25px;

}


/* =========================================================
   DOTS
========================================================= */

.adv-service-dots {

    display: flex;

    align-items: center;

    gap: 7px;

}


.adv-service-dots button {

    width: 7px;
    height: 7px;

    padding: 0;

    border: none;

    border-radius: 50%;

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

    cursor: pointer;

    transition:
        all 0.35s ease;

}


.adv-service-dots button:hover {

    background:
        rgba(201, 164, 92, 0.7);

}


.adv-service-dots button.active {

    width: 30px;

    border-radius: 10px;

    background: #c9a45c;

}


/* =========================================================
   SCROLL INDICATOR
========================================================= */

.adv-service-scroll {

    display: flex;

    align-items: center;

    gap: 12px;

}


.adv-scroll-line {

    width: 45px;

    height: 1px;

    background:
        rgba(201, 164, 92, 0.75);

}


.adv-service-scroll span {

    color: #d9b56b;

    font-family:
        "DM Sans",
        sans-serif;

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 2.5px;

}


.adv-service-scroll i {

    color: #d9b56b;

    font-size: 13px;

    animation:
        advServicesScroll 1.8s ease-in-out infinite;

}


@keyframes advServicesScroll {

    0%,
    100% {

        transform:
            translateY(-3px);

        opacity: 0.55;

    }

    50% {

        transform:
            translateY(4px);

        opacity: 1;

    }

}


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

@media (max-width: 1199px) {

    .adv-services-slider {

        padding:
            105px 0 75px;

    }


    .adv-services-heading {

        align-items: flex-start;

        flex-direction: column;

        gap: 22px;

    }


    .adv-services-heading>p {

        max-width: 500px;

    }


    .adv-service-prev {

        left: 10px;

    }


    .adv-service-next {

        right: 10px;

    }

}


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

@media (max-width: 991px) {

    .adv-services-slider {

        min-height: auto;

    }


    .adv-services-heading h2 {

        font-size: 52px;

    }


    .adv-service-card {

        flex-basis: 300px;

        height: 390px;

    }


    .adv-service-card:first-child {

        flex-basis: 300px;

    }

}


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

@media (max-width: 767px) {

    .adv-services-slider {

        padding:
            80px 0 60px;

    }


    /*
       Mobile background stays inside
       Services section only.
    */

    .adv-services-bg {

        background-position:
            center center;

    }


    .adv-services-overlay {

        background:
           linear-gradient(180deg, rgb(4 16 29 / 0%) 0%, rgb(4 16 29 / 47%) 45%, rgb(4 16 29 / 43%) 100%);

    }


    .adv-services-top {

        margin-bottom: 38px;

    }


    .adv-services-label {

        margin-bottom: 16px;

    }


    .adv-services-label span {

        width: 40px;

    }


    .adv-services-label p {

        font-size: 12px;

        letter-spacing: 2px;

    }


    .adv-services-heading {

        gap: 18px;

    }


    .adv-services-heading h2 {

        font-size: 40px;

        line-height: 1.06;

    }


    .adv-services-heading h2 strong::after {

        width: 45px;

        margin-top: 11px;

    }


    .adv-services-heading>p {

        max-width: 100%;

        font-size: 13px;

        line-height: 1.8;

    }


    /* CARD SLIDER */

    .adv-services-track {

        gap: 12px;

        margin-right: -12px;

        padding:
            4px 12px 20px 2px;

        scroll-snap-type:
            x mandatory;

    }


    .adv-service-card,
    .adv-service-card:first-child {

        flex:
            0 0 calc(100vw - 58px);

        height: 395px;

    }


    .adv-service-card-content {

        left: 22px;
        right: 22px;

        bottom: 22px;

    }


    .adv-service-card-content h3 {

        font-size: 26px;

    }


    .adv-service-card-content p {

        font-size: 12px;

    }


    /* Hide arrows on mobile */

    .adv-service-prev,
    .adv-service-next {

        display: none;

    }


    /* Bottom */

    .adv-services-bottom {

        margin-top: 13px;

    }


    .adv-service-scroll {

        display: none;

    }

}


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

@media (max-width: 575px) {

    .adv-services-slider {

        padding:
            70px 0 55px;

    }


    .adv-services-heading h2 {

        font-size: 35px;

    }


    .adv-service-card,
    .adv-service-card:first-child {

        flex:
            0 0 calc(100vw - 48px);

        height: 380px;

    }


    .adv-service-card-content h3 {

        font-size: 24px;

    }


    .adv-service-number {

        top: 18px;
        left: 18px;

        font-size: 22px;

    }

}


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

@media (max-width: 380px) {

    .adv-services-heading h2 {

        font-size: 31px;

    }


    .adv-service-card,
    .adv-service-card:first-child {

        flex:
            0 0 calc(100vw - 38px);

    }


    .adv-service-card-content h3 {

        font-size: 22px;

    }

}

/* =========================================================
   OUR APPROACH
========================================================= */

.adv-approach-section {

    position: relative;

    padding: 70px 0;

    background: #ffffff;

    overflow: hidden;

}


/* =========================================================
   LEFT CONTENT
========================================================= */

.adv-approach-content {

    padding-right: 55px;

}


/* LABEL */

.adv-approach-label {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 20px;

}


.adv-approach-label span {

    width: 48px;

    height: 1px;

    background: #c9a45c;

}


.adv-approach-label p {

    margin: 0;

    color: #9b7737;

    font-size: 15px;

    font-weight: 700;

    letter-spacing: 3px;

}


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

.adv-approach-content h2 {

    margin: 0;

    color: #071a2d;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        clamp(43px, 5vw, 65px);

    font-weight: 500;

    font-style: normal;

    line-height: 1.05;

    letter-spacing: -1.3px;

}


.adv-approach-content h2 strong {

    display: block;

    color: #a7803e;

    font-weight: 500;

    font-style: normal;

}


/* DESCRIPTION */

.adv-approach-description {

    max-width: 480px;

    margin: 23px 0 38px;

    color: #68717b;

    font-size: 15px;

    line-height: 1.9;

}


/* =========================================================
   STEPS
========================================================= */

.adv-approach-steps {

    width: 100%;

    border-top:
        1px solid rgba(7, 26, 45, 0.13);

}


/* STEP */

.adv-approach-step {

    position: relative;

    width: 100%;

    min-height: 62px;

    display: flex;

    align-items: center;

    gap: 20px;

    padding: 0;

    border: none;

    border-bottom:
        1px solid rgba(7, 26, 45, 0.13);

    background: transparent;

    color: #071a2d;

    text-align: left;

    cursor: pointer;

    transition:
        0.35s ease;

}


/* NUMBER */

.adv-step-number {

    width: 35px;

    color: #aeb3b7;

    font-family:
        "Playfair Display",
        serif;

    font-size: 20px;

    transition:
        0.35s ease;

}


/* TITLE */

.adv-step-title {

    color: #26313b;

    font-family:
        "Playfair Display",
        serif;

    font-size: 20px;

    font-weight: 500;

    transition:
        0.35s ease;

}


/* ARROW */

.adv-approach-step i {

    margin-left: auto;

    margin-right: 5px;

    color: #a7803e;

    font-size: 15px;

    opacity: 0;

    transform:
        translateX(-8px);

    transition:
        0.35s ease;

}


/* ACTIVE */

.adv-approach-step.active {

    padding-left: 15px;

}


.adv-approach-step.active::before {

    content: "";

    position: absolute;

    left: 0;

    top: 17px;

    width: 2px;

    height: 28px;

    background: #c9a45c;

}


.adv-approach-step.active .adv-step-number {

    color: #c9a45c;

}


.adv-approach-step.active .adv-step-title {

    color: #071a2d;

}


.adv-approach-step.active i {

    opacity: 1;

    transform:
        translateX(0);

}


/* HOVER */

.adv-approach-step:hover {

    padding-left: 15px;

}


.adv-approach-step:hover .adv-step-number {

    color: #c9a45c;

}


.adv-approach-step:hover i {

    opacity: 1;

    transform:
        translateX(0);

}


/* =========================================================
   RIGHT VISUAL
========================================================= */

.adv-approach-visual {

    position: relative;

    padding-left: 45px;

}


/* IMAGE WRAPPER */

.adv-approach-image-wrap {

    position: relative;

    height: 590px;

    overflow: hidden;

    background: #071a2d;

}


/* IMAGE */

.adv-approach-image-wrap img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        opacity 0.45s ease,
        transform 0.8s ease;

}


.adv-approach-image-wrap:hover img {

    transform:
        scale(1.04);

}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.adv-approach-image-overlay {

    position: absolute;

    inset: 0;

    background:
        linear-gradient(180deg,
            rgba(7, 26, 45, 0.05) 20%,
            rgba(7, 26, 45, 0.18) 45%,
            rgba(7, 26, 45, 0.92) 100%);

}


/* =========================================================
   IMAGE CONTENT
========================================================= */

.adv-approach-image-content {

    position: absolute;

    left: 38px;
    right: 38px;

    bottom: 35px;

    z-index: 3;

}


.adv-approach-image-content span {

    color: #d9b56b;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2px;

}


.adv-approach-image-content h3 {

    max-width: 450px;

    margin: 9px 0 0;

    color: #ffffff;

    font-family:
        "Playfair Display",
        serif;

    font-size: 38px;

    font-weight: 500;

    font-style: normal;

    line-height: 1.08;

}


.adv-approach-image-content h3 strong {

    color: #d9b56b;

    font-weight: 500;

    font-style: normal;

}


/* =========================================================
   DECORATIVE FRAME
========================================================= */

.adv-approach-frame {

    position: absolute;

    top: 20px;
    right: 20px;

    width: 100%;
    height: 100%;

    border:
        1px solid rgba(201, 164, 92, 0.55);

    pointer-events: none;

    transform:
        translate(13px, 13px);

}


/* =========================================================
   GOLD BADGE
========================================================= */

.adv-approach-badge {

    position: absolute;

    left: 5px;

    bottom: 150px;

    width: 105px;
    height: 105px;

    display: flex;

    flex-direction: column;

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

    gap: 7px;

    background: #c9a45c;

    color: #071a2d;

    z-index: 5;

    box-shadow:
        0 15px 35px rgba(7, 26, 45, 0.18);

}


.adv-approach-badge i {

    font-size: 22px;

}


.adv-approach-badge span {

    font-size: 15px;

    font-weight: 800;

    line-height: 1.4;

    letter-spacing: 1.5px;

    text-align: center;

}


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

@media (max-width: 991px) {

    .adv-approach-section {

        padding: 90px 0;

    }


    .adv-approach-content {

        padding-right: 0;

        margin-bottom: 50px;

    }


    .adv-approach-visual {

        padding-left: 25px;

    }


    .adv-approach-image-wrap {

        height: 520px;

    }

}


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

@media (max-width: 767px) {

    .adv-approach-section {

        padding: 45px 0;

    }


    .adv-approach-content h2 {

        font-size: 40px;

    }


    .adv-approach-description {

        font-size: 11px;

        margin-bottom: 30px;

    }


    .adv-approach-step {

        min-height: 58px;

        gap: 13px;

    }


    .adv-step-title {

        font-size: 16px;

    }


    .adv-approach-visual {

        padding-left: 10px;

        margin-top: 20px;

    }


    .adv-approach-image-wrap {

        height: 450px;

    }


    .adv-approach-image-content {

        left: 25px;
        right: 25px;

        bottom: 25px;

    }


    .adv-approach-image-content h3 {

        font-size: 30px;

    }


    .adv-approach-frame {

        top: 12px;
        right: 12px;

        transform:
            translate(8px, 8px);

    }


    .adv-approach-badge {

     left: 190px;
        bottom: -34px;

        width: 82px;
        height: 82px;
        display: none;

    }


    .adv-approach-badge i {

        font-size: 17px;

    }

}

/* =========================================================
   THE WAY WE WORK
========================================================= */

.adv-work-section {

    position: relative;

    padding: 70px 0 35px;

    background: #f8f7f3;

    overflow: hidden;

}


/* =========================================================
   SUBTLE BACKGROUND
========================================================= */

.adv-work-section::before {

    content: "";

    position: absolute;

    width: 500px;
    height: 500px;

    left: -300px;
    top: -250px;

    border-radius: 50%;

    border:
        1px solid rgba(201, 164, 92, 0.16);

    pointer-events: none;

}


.adv-work-section::after {

    content: "";

    position: absolute;

    width: 350px;
    height: 350px;

    right: -220px;
    bottom: -180px;

    border-radius: 50%;

    background:
        rgba(201, 164, 92, 0.05);

    pointer-events: none;

}


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

.adv-work-heading {

    position: relative;

    z-index: 2;

    max-width: 760px;

    margin: 0 auto 70px;

    text-align: center;

}


/* LABEL */

.adv-work-label {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    margin-bottom: 18px;

}


.adv-work-label span {

    width: 45px;

    height: 1px;

    background: #c9a45c;

}


.adv-work-label p {

    margin: 0;

    color: #9b7737;

    font-size: 15px;

    font-weight: 700;

    letter-spacing: 3px;

}


/* HEADING */

.adv-work-heading h2 {

    margin: 0;

    color: #071a2d;

    font-family:
        "Playfair Display",
        serif;

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

    font-weight: 500;

    font-style: normal;

    line-height: 1.05;

    letter-spacing: -1px;

}


.adv-work-heading h2 strong {

    color: #a7803e;

    font-weight: 500;

    font-style: normal;

}


.adv-work-heading>p {

    max-width: 520px;

    margin: 20px auto 0;

    color: #737a81;

    font-size: 15px;

    line-height: 1.8;

}


/* =========================================================
   ROADMAP
========================================================= */

.adv-work-roadmap {

    position: relative;

    z-index: 2;

    display: grid;

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

    gap: 25px;

}


/* =========================================================
   CONNECTING LINE
========================================================= */

.adv-work-line {

    position: absolute;

    top: 31px;

    left: 10%;

    right: 10%;

    height: 1px;

    background:
        rgba(7, 26, 45, 0.18);

    z-index: 0;

}


.adv-work-line span {

    position: absolute;

    left: 0;

    top: 0;

    width: 0;

    height: 1px;

    background: #c9a45c;

    animation:
        advRoadmapLine 2s ease forwards;

}


@keyframes advRoadmapLine {

    from {

        width: 0;

    }

    to {

        width: 100%;

    }

}


/* =========================================================
   STEP
========================================================= */

.adv-work-step {

    position: relative;

    z-index: 2;

    text-align: center;

}


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

.adv-work-step-top {

    position: relative;

    width: 64px;
    height: 64px;

    margin: 0 auto 18px;

}


.adv-work-icon {

    width: 64px;
    height: 64px;

    display: flex;

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

    border:
        1px solid #c9a45c;

    border-radius: 50%;

    background: #f8f7f3;

    color: #a7803e;

    font-size: 25px;

    transition:
        0.4s ease;

}


.adv-work-step:hover .adv-work-icon {

    background: #071a2d;

    color: #d9b56b;

    border-color: #071a2d;

    transform:
        translateY(-5px);

    box-shadow:
        0 12px 25px rgba(7, 26, 45, 0.15);

}


/* =========================================================
   NUMBER
========================================================= */

.adv-work-number {

    margin-bottom: 9px;

    color: #c9a45c;

    font-family:
        "Playfair Display",
        serif;

    font-size: 12px;

    font-weight: 500;

}


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

.adv-work-step h3 {

    min-height: 50px;

    margin: 0 0 12px;

    color: #071a2d;

    font-family:
        "Playfair Display",
        serif;

    font-size: 20px;

    font-weight: 500;

    font-style: normal;

    line-height: 1.15;

}


.adv-work-step h3 strong {

    display: block;

    color: #a7803e;

    font-weight: 500;

    font-style: normal;

}


/* =========================================================
   DESCRIPTION
========================================================= */

.adv-work-step p {

    max-width: 170px;

    margin: 0 auto;

    color: #747b82;

    font-size: 15px;

    line-height: 1.75;

}


/* =========================================================
   BOTTOM
========================================================= */

.adv-work-bottom {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 15px;

    margin-top: 65px;

}


.adv-work-bottom span {

    color: #a7803e;

    font-size: 15px;

    font-weight: 700;

    letter-spacing: 2px;

}


.adv-work-bottom div {

    width: 55px;

    height: 1px;

    background: #c9a45c;

}


.adv-work-bottom p {

    margin: 0;

    color: #6d747b;

    font-size: 15px;

}


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

@media (max-width: 991px) {

    .adv-work-section {

        padding: 90px 0;

    }


    .adv-work-heading {

        margin-bottom: 55px;

    }


    .adv-work-roadmap {

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

        row-gap: 55px;

    }


    .adv-work-line {

        display: none;

    }

}


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

@media (max-width: 767px) {

    .adv-work-section {

        padding: 75px 0;

    }


    .adv-work-heading {

        margin-bottom: 45px;

    }


    .adv-work-heading h2 {

        font-size: 38px;

    }


    .adv-work-heading>p {

        font-size: 11px;

    }


    .adv-work-roadmap {

        display: block;

        padding-left: 25px;

    }


    /* VERTICAL ROAD */

    .adv-work-roadmap::before {

        content: "";

        position: absolute;

        top: 30px;

        bottom: 30px;

        left: 56px;

        width: 1px;

        background:
            rgba(7, 26, 45, 0.18);

    }


    .adv-work-line {

        display: none;

    }


    /* MOBILE STEP */

    .adv-work-step {

        display: grid;

        grid-template-columns:
            64px 1fr;

        column-gap: 20px;

        margin-bottom: 42px;

        text-align: left;

    }


    .adv-work-step:last-child {

        margin-bottom: 0;

    }


    .adv-work-step-top {

        grid-row:
            1 / 5;

        margin: 0;

    }


    .adv-work-number {

        margin: 0 0 6px;

        font-size: 11px;

    }


    .adv-work-step h3 {

        min-height: auto;

        margin-bottom: 8px;

        font-size: 20px;

    }


    .adv-work-step p {

        max-width: 100%;

        margin: 0;

        font-size: 10px;

    }


    .adv-work-bottom {

        margin-top: 45px;

        flex-wrap: wrap;

    }

}


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

@media (max-width: 575px) {

    .adv-work-heading h2 {

        font-size: 34px;

    }


    .adv-work-heading>p {

        padding: 0 10px;

    }


    .adv-work-roadmap {

        padding-left: 5px;

    }


    .adv-work-step {

        grid-template-columns:
            58px 1fr;

        column-gap: 17px;

    }


    .adv-work-icon,
    .adv-work-step-top {

        width: 58px;
        height: 58px;

    }


    .adv-work-roadmap::before {

        left: 34px;

    }

}

/* =========================================================
   TESTIMONIAL SECTION
========================================================= */

.adv-testimonial-section {

    position: relative;

    height: 680px;

    padding: 50px 0 50px;

    overflow: hidden;

    background: #f7f2e9;

}


/* =========================================================
   BACKGROUND IMAGE
========================================================= */

.adv-testimonial-bg {

    position: absolute;

    inset: 0;

    background-image:
        url("../images/testimonial-bg.png");

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    transform: scale(1.02);

}


/* =========================================================
   OVERLAY
========================================================= */

.adv-testimonial-overlay {

    position: absolute;

    inset: 0;

    background:

        linear-gradient(90deg, rgb(250 247 240 / 0%) 0%, rgb(250 247 240 / 0%) 28%, rgb(250 247 240 / 0%) 50%, rgb(250 247 240 / 0%) 72%, rgb(250 247 240 / 0%) 100%);

}


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

.adv-testimonial-heading {

    position: relative;

    z-index: 3;

    text-align: center;

    max-width: 750px;

    margin: 0 auto 55px;

}


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

.adv-testimonial-label {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 13px;

    margin-bottom: 17px;

}


.adv-testimonial-label span {

    width: 45px;

    height: 1px;

    background: #b58a43;

}


.adv-testimonial-label p {

    margin: 0;

    color: #9d7537;

    font-size: 15px;

    font-weight: 700;

    letter-spacing: 3px;

}


/* =========================================================
   HEADING TEXT
========================================================= */

.adv-testimonial-heading h2 {

    margin: 0;

    color: #071a2d;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        clamp(42px, 5vw, 64px);

    font-weight: 500;

    line-height: 1.05;

}


.adv-testimonial-heading h2 strong {

    display: block;

    color: #b0833c;

    font-weight: 500;

}


/* =========================================================
   SLIDER
========================================================= */

.adv-testimonial-slider {

    position: relative;

    z-index: 3;

    max-width: 1050px;

    min-height: 310px;

    margin: 0 auto;

}


/* =========================================================
   TESTIMONIAL ITEM
========================================================= */

.adv-testimonial-item {

    position: absolute;

    inset: 0;

    display: flex;

    align-items: center;

    padding: 55px 65px;

    border:
        1px solid rgba(166, 126, 58, 0.45);

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

    backdrop-filter:
        blur(5px);

    -webkit-backdrop-filter:
        blur(5px);

    opacity: 0;

    visibility: hidden;

    transform:
        translateX(35px);

    transition:
        opacity 0.6s ease,
        transform 0.6s ease,
        visibility 0.6s ease;

}


.adv-testimonial-item.active {

    position: relative;

    opacity: 1;

    visibility: visible;

    transform:
        translateX(0);

}


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

.adv-testimonial-quote {

    width: 80px;

    height: 80px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-right: 48px;

    border:
        1px solid rgba(181, 138, 67, 0.55);

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

}


.adv-testimonial-quote i {

    color: #b0833c;

    font-size: 42px;

}


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

.adv-testimonial-content {

    flex: 1;

}


.adv-testimonial-content>p {

    max-width: 720px;

    margin: 0 0 28px;

    color: #152b3e;

    font-family:
        "Playfair Display",
        serif;

    font-size: 22px;

    font-weight: 400;

    line-height: 1.65;

}


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

.adv-testimonial-author {

    display: flex;

    align-items: center;

    gap: 13px;

}


.adv-author-line {

    width: 38px;

    height: 1px;

    background: #b0833c;

}


.adv-testimonial-author h4 {

    margin: 0 0 3px;

    color: #071a2d;

    font-family:
        "Playfair Display",
        serif;

    font-size: 15px;

    font-weight: 600;

}


.adv-testimonial-author span {

    color: #7d858b;

    font-size: 8px;

    letter-spacing: 1.6px;

    text-transform: uppercase;

}


/* =========================================================
   NUMBER
========================================================= */

.adv-testimonial-number {

    position: absolute;

    top: 28px;

    right: 30px;

    color: #a97d37;

    font-family:
        "Playfair Display",
        serif;

    font-size: 32px;

    font-weight: 500;

}


.adv-testimonial-number span {

    color: #9b9b96;

    font-size: 11px;

}


/* =========================================================
   CONTROLS
========================================================= */

.adv-testimonial-controls {

    position: relative;

    z-index: 4;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 28px;

    margin-top: 30px;

}


/* =========================================================
   ARROWS
========================================================= */

.adv-testimonial-controls button {

    width: 46px;

    height: 46px;

    display: flex;

    align-items: center;

    justify-content: center;

    border:
        1px solid rgba(166, 126, 58, 0.60);

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

    color: #8f682e;

    cursor: pointer;

    transition:
        0.35s ease;

}


.adv-testimonial-controls button:hover {

    background: #071a2d;

    color: #d4aa62;

    border-color: #071a2d;

    transform:
        translateY(-3px);

}


/* =========================================================
   DOTS
========================================================= */

.adv-testimonial-dots {

    display: flex;

    align-items: center;

    gap: 7px;

}


.adv-testimonial-dots span {

    width: 7px;

    height: 7px;

    border-radius: 50%;

    background:
        rgba(7, 26, 45, 0.25);

    transition:
        0.35s ease;

}


.adv-testimonial-dots span.active {

    width: 25px;

    border-radius: 10px;

    background: #b0833c;

}


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

@media (max-width: 991px) {

    .adv-testimonial-section {

        padding: 90px 0;

    }


    .adv-testimonial-item {

        padding: 45px;

    }


    .adv-testimonial-quote {

        width: 65px;

        height: 65px;

        margin-right: 30px;

    }


    .adv-testimonial-content>p {

        font-size: 19px;

    }

}


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

@media (max-width: 767px) {

    .adv-testimonial-section {

        min-height: 650px;

        padding: 75px 0 70px;

    }


    .adv-testimonial-bg {

        background-position:
            0% center;

    }


    .adv-testimonial-overlay {

        background:

            linear-gradient(90deg, rgb(250 247 240 / 0%), rgb(250 247 240 / 0%));

    }


    .adv-testimonial-heading {

        margin-bottom: 40px;

    }


    .adv-testimonial-heading h2 {

        font-size: 38px;

    }


    .adv-testimonial-slider {

        min-height: 420px;

    }


    .adv-testimonial-item {

        display: block;

        padding: 35px 25px;

    }


    .adv-testimonial-quote {

        width: 58px;

        height: 58px;

        margin:
            0 0 25px;

    }


    .adv-testimonial-quote i {

        font-size: 30px;

    }


    .adv-testimonial-content>p {

        font-size: 18px;

        line-height: 1.6;

    }


    .adv-testimonial-number {

        top: 20px;

        right: 20px;

        font-size: 25px;

    }

}


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

@media (max-width: 575px) {

    .adv-testimonial-section {

        padding: 65px 0;

    }


    .adv-testimonial-heading h2 {

        font-size: 33px;

    }


    .adv-testimonial-label p {

        font-size: 12px;

        letter-spacing: 2px;

    }


    .adv-testimonial-slider {

        min-height: 440px;

    }


    .adv-testimonial-item {

        padding: 30px 20px;

    }


    .adv-testimonial-content>p {

        font-size: 17px;

    }

}

/* =========================================================
   FAQ SECTION
========================================================= */

.adv-faq-section {

    position: relative;

    padding: 70px 0;

    background: #f7f5f0;

    overflow: hidden;

}


/* =========================================================
   BACKGROUND PATTERN
========================================================= */

.adv-faq-pattern {

    position: absolute;

    right: -180px;

    top: -180px;

    width: 450px;

    height: 450px;

    border: 1px solid
        rgba(183, 139, 68, 0.15);

    border-radius: 50%;

}


.adv-faq-pattern::before {

    content: "";

    position: absolute;

    inset: 45px;

    border: 1px solid
        rgba(183, 139, 68, 0.10);

    border-radius: 50%;

}


.adv-faq-pattern::after {

    content: "";

    position: absolute;

    inset: 90px;

    border: 1px solid
        rgba(183, 139, 68, 0.08);

    border-radius: 50%;

}


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

.adv-faq-intro {

    position: relative;

    z-index: 2;

    padding-right: 45px;

}


.adv-faq-label {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 20px;

}


.adv-faq-label span {

    width: 42px;

    height: 1px;

    background: #b0833c;

}


.adv-faq-label p {

    margin: 0;

    color: #9b7334;

    font-size: 15px;

    font-weight: 700;

    letter-spacing: 2.5px;

}


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

.adv-faq-intro h2 {

    margin: 0 0 25px;

    color: #071a2d;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        clamp(42px, 5vw, 62px);

    font-weight: 500;

    line-height: 1.08;

}


.adv-faq-intro h2 strong {

    display: block;

    color: #ae813d;

    font-weight: 500;

}


/* =========================================================
   DESCRIPTION
========================================================= */

.adv-faq-description {

    max-width: 430px;

    margin: 0;

    color: #68727a;

    font-size: 15px;

    line-height: 1.9;

}


/* =========================================================
   CONTACT BOX
========================================================= */

.adv-faq-contact {

    display: flex;

    align-items: center;

    gap: 15px;

    margin-top: 38px;

    padding-top: 25px;

    border-top: 1px solid
        rgba(7, 26, 45, 0.12);

}


.adv-faq-contact-icon {

    width: 48px;

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 1px solid
        rgba(176, 129, 61, 0.55);

    color: #a97b35;

}


.adv-faq-contact-icon i {

    font-size: 20px;

}


.adv-faq-contact span {

    display: block;

    margin-bottom: 4px;

    color: #8a8f92;

    font-size: 7px;

    font-weight: 700;

    letter-spacing: 1.8px;

}


.adv-faq-contact a {

    color: #071a2d;

    font-family:
        "Playfair Display",
        serif;

    font-size: 15px;

    font-weight: 600;

    transition: 0.3s ease;

}


.adv-faq-contact a:hover {

    color: #ad803c;

}


/* =========================================================
   FAQ LIST
========================================================= */

.adv-faq-list {

    position: relative;

    z-index: 2;

}


/* =========================================================
   FAQ ITEM
========================================================= */

.adv-faq-item {

    border-top: 1px solid
        rgba(7, 26, 45, 0.14);

}


.adv-faq-item:last-child {

    border-bottom: 1px solid
        rgba(7, 26, 45, 0.14);

}


/* =========================================================
   QUESTION
========================================================= */

.adv-faq-question {

    width: 100%;

    min-height: 82px;

    display: grid;

    grid-template-columns: 45px 1fr 35px;

    align-items: center;

    gap: 15px;

    padding: 0;

    border: none;

    background: transparent;

    text-align: left;

    cursor: pointer;

}


/* NUMBER */

.adv-faq-number {

    color: #b0833c;

    font-size: 20px;

    font-weight: 700;

    letter-spacing: 1px;

}


/* TITLE */

.adv-faq-title {

    color: #071a2d;

    font-family:
        "Playfair Display",
        serif;

    font-size: 20px;

    font-weight: 500;

    transition: 0.3s ease;

}


.adv-faq-question:hover .adv-faq-title {

    color: #a87932;

}


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

.adv-faq-icon {

    width: 32px;

    height: 32px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 1px solid
        rgba(176, 129, 61, 0.45);

    color: #a97b35;

    transition: 0.35s ease;

}


.adv-faq-icon i {

    font-size: 25px;

    transition: 0.35s ease;

}


/* ACTIVE ICON */

.adv-faq-item.active
.adv-faq-icon {

    background: #071a2d;

    border-color: #071a2d;

    color: #d0a65c;

}


.adv-faq-item.active
.adv-faq-icon i {

    transform: rotate(45deg);

}


/* =========================================================
   ANSWER
========================================================= */

.adv-faq-answer {

    max-height: 0;

    overflow: hidden;

    opacity: 0;

    transition:
        max-height 0.45s ease,
        opacity 0.35s ease;

}


.adv-faq-item.active
.adv-faq-answer {

    max-height: 250px;

    opacity: 1;

}


.adv-faq-answer p {

    max-width: 650px;

    margin: -2px 50px 25px 60px;

    color: #69737a;

    font-size: 15px;

    line-height: 1.9;

}


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

@media (max-width: 991px) {

    .adv-faq-section {

        padding: 90px 0;

    }


    .adv-faq-intro {

        padding-right: 0;

    }


    .adv-faq-intro h2 {

        font-size: 48px;

    }

}


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

@media (max-width: 767px) {

    .adv-faq-section {

        padding: 75px 0;

    }


    .adv-faq-intro {

        margin-bottom: 45px;

    }


    .adv-faq-intro h2 {

        font-size: 38px;

    }


    .adv-faq-description {

        font-size: 13px;

    }


    .adv-faq-question {

        min-height: 72px;

        grid-template-columns:
            32px 1fr 32px;

        gap: 10px;

    }


    .adv-faq-title {

        font-size: 15px;

        line-height: 1.45;

    }


    .adv-faq-answer p {

        margin:
            0 40px 22px 42px;

        font-size: 14px;

    }


    .adv-faq-pattern {

        width: 300px;

        height: 300px;

        right: -160px;

        top: -100px;

    }

    .adv-faq-contact span {
    display: block;
    margin-bottom: 4px;
    color: #8a8f92;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.adv-faq-contact a {
    color: #071a2d;
    font-family: "Playfair Display", serif;
    font-size: 17px;
    font-weight: 600;
    transition: 0.3s ease;
}

}


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

@media (max-width: 575px) {

    .adv-faq-section {

        padding: 65px 0;

    }


    .adv-faq-intro h2 {

        font-size: 34px;

    }


    .adv-faq-label p {

        font-size: 10px;

        letter-spacing: 2px;

    }


    .adv-faq-question {

        grid-template-columns:
            28px 1fr 30px;

    }


    .adv-faq-title {

        font-size:16px;

    }


    .adv-faq-icon {

        width: 29px;

        height: 29px;

    }

}

/* =========================================================
   CTA V2
========================================================= */

.adv-cta-section-v2 {

    position: relative;

    padding: 25px 0 20px;

    background: #f5f1e9;

    overflow: hidden;

}


/* =========================================================
   WATERMARK
========================================================= */

.adv-cta-watermark {

    position: absolute;

    right: -70px;

    top: 50%;

    transform:
        translateY(-50%)
        rotate(-8deg);

    width: 470px;

    height: 470px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 1px solid
        rgba(201,164,92,0.13);

    border-radius: 50%;

    pointer-events: none;

}


.adv-cta-watermark::before {

    content: "";

    position: absolute;

    width: 390px;

    height: 390px;

    border: 1px solid
        rgba(201,164,92,0.10);

    border-radius: 50%;

}


.adv-cta-watermark i {

    color:
        rgba(7,26,45,0.035);

    font-size: 230px;

}


/* =========================================================
   TOP GOLD LINE
========================================================= */

.adv-cta-section-v2::before {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 3px;

    background:
        linear-gradient(
            90deg,
            transparent 5%,
            #c9a45c 50%,
            transparent 95%
        );

}


/* =========================================================
   MAIN WRAPPER
========================================================= */

.adv-cta-wrapper {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        1.15fr
        1px
        0.85fr;

    align-items: center;

    gap: 65px;

    min-height: 245px;

}


/* =========================================================
   TAG
========================================================= */

.adv-cta-tag {

    display: flex;

    align-items: center;

    gap: 13px;

    margin-bottom: 22px;

}


.adv-cta-tag span {

    width: 45px;

    height: 1px;

    background: #c9a45c;

}


.adv-cta-tag p {

    margin: 0;

    color: #a37b35;

    font-size: 14px;

    font-weight: 700;

    letter-spacing: 3px;

}


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

.adv-cta-left h2 {

    margin: 0;

    color: #071a2d;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        clamp(45px, 5.5vw, 72px);

    font-weight: 500;

    line-height: 1.02;

    letter-spacing: -1px;

}


.adv-cta-left h2 strong {

    color: #b18743;

    font-weight: 500;

}


/* =========================================================
   DIVIDER
========================================================= */

.adv-cta-divider {

    width: 1px;

    height: 150px;

    background:
        linear-gradient(
            to bottom,
            transparent,
            rgba(201,164,92,0.75),
            transparent
        );

    position: relative;

}


.adv-cta-divider::before {

    content: "";

    position: absolute;

    left: -3px;

    top: 50%;

    width: 7px;

    height: 7px;

    border-radius: 50%;

    background: #c9a45c;

    transform:
        translateY(-50%);

}


/* =========================================================
   RIGHT CONTENT
========================================================= */

.adv-cta-right {

    position: relative;

    max-width: 440px;

}


.adv-cta-right > p {

    margin: 0 0 28px;

    color: #5f6266;

    font-size: 15px;

    line-height: 1.9;

}


/* =========================================================
   ACTIONS
========================================================= */

.adv-cta-actions {

    display: flex;

    align-items: stretch;

    gap: 10px;

}


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

.adv-cta-call {

    min-height: 64px;

    display: flex;

    align-items: center;

    gap: 13px;

    padding: 0 15px;

    background: #071a2d;

    color: #ffffff;

    transition: 0.35s ease;

}


.adv-cta-icon {

    width: 38px;

    height: 38px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 1px solid
        rgba(201,164,92,0.55);

    color: #c9a45c;

}


.adv-cta-action-text {

    display: flex;

    flex-direction: column;

    gap: 3px;

}


.adv-cta-action-text small {

    color:
        rgba(255,255,255,0.45);

    font-size: 10px;

    letter-spacing: 1.8px;

}


.adv-cta-action-text strong {

    color: #ffffff;

    font-size: 15px;

    font-weight: 600;

}


.adv-cta-call > i {

    margin-left: 8px;

    color: #c9a45c;

    transition: 0.35s ease;

}


.adv-cta-call:hover {

    background: #c9a45c;

    color: #071a2d;

}


.adv-cta-call:hover
.adv-cta-icon {

    border-color: #071a2d;

    color: #071a2d;

}


.adv-cta-call:hover
.adv-cta-action-text small {

    color:
        rgba(7,26,45,0.55);

}


.adv-cta-call:hover
.adv-cta-action-text strong {

    color: #071a2d;

}


.adv-cta-call:hover > i {

    color: #071a2d;

    transform:
        translate(3px,-3px);

}


/* =========================================================
   WHATSAPP
========================================================= */

.adv-cta-whatsapp {

    min-height: 64px;

    padding: 0 19px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    border: 1px solid
        rgba(7,26,45,0.18);

    color: #071a2d;

    font-size: 15px;

    font-weight: 700;

    transition: 0.35s ease;

}


.adv-cta-whatsapp i {

    color: #b18743;

    font-size: 25px;

}


.adv-cta-whatsapp:hover {

    background: #071a2d;

    color: #ffffff;

    border-color: #071a2d;

}


.adv-cta-whatsapp:hover i {

    color: #c9a45c;

}


/* =========================================================
   BOTTOM STATEMENT
========================================================= */

.adv-cta-bottom {

    position: relative;

    z-index: 3;

    margin-top: 65px;

    padding-top: 18px;

    border-top: 1px solid
        rgba(7,26,45,0.10);

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

}


.adv-cta-bottom span {

    color:
        rgba(7,26,45,0.45);

    font-size: 15px;

    font-weight: 700;

    letter-spacing: 3px;

}


.adv-cta-bottom i {

    color: #c9a45c;

    font-size: 13px;

}


/* =========================================================
   HOVER WATERMARK ANIMATION
========================================================= */

.adv-cta-section-v2:hover
.adv-cta-watermark {

    animation:
        advCtaWatermark 10s linear infinite;

}


@keyframes advCtaWatermark {

    from {

        transform:
            translateY(-50%)
            rotate(-8deg);

    }

    to {

        transform:
            translateY(-50%)
            rotate(352deg);

    }

}


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

@media (max-width: 991px) {

    .adv-cta-section-v2 {

        padding: 80px 0 40px;

    }


    .adv-cta-wrapper {

        grid-template-columns:
            1fr;

        gap: 35px;

    }


    .adv-cta-divider {

        width: 80px;

        height: 1px;

        background:
            linear-gradient(
                90deg,
                transparent,
                rgba(201,164,92,0.75),
                transparent
            );

    }


    .adv-cta-divider::before {

        top: -3px;

        left: 50%;

        transform:
            translateX(-50%);

    }


    .adv-cta-right {

        max-width: 600px;

    }


    .adv-cta-watermark {

        opacity: 0.6;

    }

}


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

@media (max-width: 575px) {

    .adv-cta-section-v2 {

        padding: 65px 0 30px;

    }


    .adv-cta-left h2 {

        font-size: 42px;

        letter-spacing: -0.5px;

    }


    .adv-cta-tag {

        margin-bottom: 18px;

    }


    .adv-cta-right > p {

        font-size: 15px;

    }


    .adv-cta-actions {

        flex-direction: column;

    }


    .adv-cta-call,
    .adv-cta-whatsapp {

        width: 100%;

    }


    .adv-cta-watermark {

        width: 300px;

        height: 300px;

        right: -170px;

    }


    .adv-cta-watermark::before {

        width: 250px;

        height: 250px;

    }


    .adv-cta-watermark i {

        font-size: 150px;

    }


    .adv-cta-bottom {

        margin-top: 45px;

    }

}
/* =========================================================
   FOOTER
========================================================= */

.adv-footer {

    position: relative;

    background: #061522;

    color: #ffffff;

    overflow: hidden;

}


/* =========================================================
   TOP GOLD LINE
========================================================= */

.adv-footer-top-line {

    width: 100%;

    height: 1px;

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

}


/* =========================================================
   FOOTER MAIN
========================================================= */

.adv-footer-main {

    display: grid;

    grid-template-columns:
        1.5fr
        0.8fr
        1.2fr
        1.2fr;

    gap: 60px;

    padding: 40px 0 20px;

}


/* =========================================================
   BRAND
========================================================= */

.adv-footer-brand {

    max-width: 330px;

}


.adv-footer-logo {

    display: inline-block;

    width: 135px;

    margin-bottom: 22px;

}


.adv-footer-logo img {

    width: 100%;

    height: auto;

    object-fit: contain;

}


.adv-footer-brand > p {

    margin: 0;

    color:
        rgba(255,255,255,0.58);

    font-size: 15px;

    line-height: 1.9;

}


/* =========================================================
   SOCIAL
========================================================= */

.adv-footer-social {

    display: flex;

    gap: 9px;

    margin-top: 25px;

}


.adv-footer-social a {

    width: 36px;

    height: 36px;

    display: flex;

    align-items: center;

    justify-content: center;

    border:
        1px solid
        rgba(201,164,92,0.35);

    color: #c9a45c;

    transition: 0.35s ease;

}


.adv-footer-social a:hover {

    background: #c9a45c;

    color: #061522;

    transform:
        translateY(-4px);

}


/* =========================================================
   FOOTER COLUMNS
========================================================= */

.adv-footer-column h4 {

    position: relative;

    margin: 5px 0 25px;

    padding-bottom: 12px;

    color: #ffffff;

    font-family:
        "Playfair Display",
        serif;

    font-size: 25px;

    font-weight: 500;

}


.adv-footer-column h4::after {

    content: "";

    position: absolute;

    left: 0;

    bottom: 0;

    width: 32px;

    height: 1px;

    background: #c9a45c;

}


/* =========================================================
   LINKS
========================================================= */

.adv-footer-column ul {

    list-style: none;

    padding: 0;

    margin: 0;

}


.adv-footer-column ul li {

    margin-bottom: 12px;

}


.adv-footer-column ul li a {

    position: relative;

    color:
        rgba(255,255,255,0.57);

    font-size: 15px;

    transition: 0.3s ease;

}


.adv-footer-column ul li a::before {

    content: "";

    display: inline-block;

    width: 0;

    height: 1px;

    margin-right: 0;

    vertical-align: middle;

    background: #c9a45c;

    transition: 0.3s ease;

}


.adv-footer-column ul li a:hover {

    color: #c9a45c;

}


.adv-footer-column ul li a:hover::before {

    width: 14px;

    margin-right: 7px;

}


/* =========================================================
   CONTACT
========================================================= */

.adv-footer-contact-item {

    display: flex;

    align-items: flex-start;

    gap: 13px;

    margin-bottom: 19px;

}


.adv-footer-contact-item i {

    color: #c9a45c;

    font-size: 20px;

    margin-top: 2px;

}


.adv-footer-contact-item p,
.adv-footer-contact-item a {

    margin: 0;

    color:
        rgba(255,255,255,0.58);

    font-size: 15px;

    line-height: 1.7;

    transition: 0.3s ease;

}


.adv-footer-contact-item a:hover {

    color: #c9a45c;

}



/* =========================================================
   FOOTER BOTTOM
========================================================= */

.adv-footer-bottom {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    padding: 20px 0;

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

}


.adv-footer-bottom p {

    margin: 0;

    color:
        rgba(255,255,255,0.40);

    font-size: 9px;

}


.adv-footer-bottom strong {

    color: #c9a45c;

    font-weight: 500;

}


.adv-footer-bottom a {

    color: #c9a45c;

}


/* =========================================================
   FLOATING ACTIONS
========================================================= */

.adv-floating-actions {

    position: fixed;

    left: 0;

    right: 0;

    bottom: 25px;

    z-index: 9998;

    pointer-events: none;

}


.adv-floating-left,
.adv-floating-right {

    position: absolute;

    bottom: 0;

    display: flex;

    flex-direction: column;

    gap: 10px;

    pointer-events: auto;

}


.adv-floating-left {

    left: 20px;

}


.adv-floating-right {

    right: 20px;

}


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

.adv-float-btn {

    position: relative;

    width: 48px;

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 1px solid
        rgba(201,164,92,0.55);

    background: #071a2d;

    color: #c9a45c;

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

    transition:
        width 0.35s ease,
        background 0.35s ease,
        color 0.35s ease,
        transform 0.35s ease;

    overflow: hidden;

}


.adv-float-btn i {

    position: relative;

    z-index: 2;

    flex-shrink: 0;

    font-size: 17px;

}


.adv-float-btn span {

    max-width: 0;

    margin-left: 0;

    white-space: nowrap;

    overflow: hidden;

    opacity: 0;

    color: inherit;

    font-size: 10px;

    font-weight: 600;

    transition:
        max-width 0.35s ease,
        margin 0.35s ease,
        opacity 0.25s ease;

}


/* =========================================================
   HOVER EXPAND
========================================================= */

.adv-float-btn:hover {

    width: 145px;

    justify-content: flex-start;

    padding: 0 15px;

    gap: 10px;

    transform:
        translateY(-3px);

}


.adv-float-btn:hover span {

    max-width: 100px;

    margin-left: 3px;

    opacity: 1;

}


/* =========================================================
   WHATSAPP
========================================================= */

.adv-float-whatsapp:hover {

    background: #c9a45c;

    color: #071a2d;

}


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

.adv-float-phone:hover {

    background: #ffffff;

    color: #071a2d;

}


/* =========================================================
   GOOGLE REVIEW
========================================================= */

.adv-float-review:hover {

    background: #c9a45c;

    color: #071a2d;

}


/* =========================================================
   BACK TO TOP
========================================================= */

.adv-float-top {

    padding: 0;

    cursor: pointer;

}


.adv-float-top:hover {

    background: #ffffff;

    color: #071a2d;

}


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

@media (max-width: 991px) {

    .adv-footer-main {

        grid-template-columns:
            1fr 1fr;

        gap: 45px;

    }

}


@media (max-width: 767px) {

    .adv-footer-main {

        grid-template-columns:
            1fr;

        gap: 38px;

        padding: 22px 0 10px;

    }


    .adv-footer-brand {

        max-width: 100%;

    }


    .adv-footer-bottom {

        display: block;

        text-align: center;

    }


    .adv-footer-bottom p {

        margin-bottom: 7px;

    }


    .adv-floating-actions {

        bottom: 15px;

    }


    .adv-floating-left {

        left: 12px;

    }


    .adv-floating-right {

        right: 12px;

    }


    .adv-float-btn {

        width: 44px;

        height: 44px;

    }


    .adv-float-btn:hover {

        width: 44px;

        padding: 0;

        justify-content: center;

    }


    .adv-float-btn:hover span {

        max-width: 0;

        margin-left: 0;

        opacity: 0;

    }

}


@media (max-width: 575px) {

    .adv-footer-main {

        gap: 32px;

    }


    .adv-footer-logo {

        width: 115px;

    }


    .adv-footer-brand > p {

        font-size: 14px;

    }


    .adv-floating-left {

        left: 10px;

    }


    .adv-floating-right {

        right: 10px;

    }


    .adv-float-btn {

        width: 42px;

        height: 42px;

    }

}
/* =========================================================
   FOOTER BOTTOM
========================================================= */

.footer-bottom {

    position: relative;

    width: 100%;

    padding: 18px 0;

    background: #061522;

    border-top: 1px solid
        rgba(201, 164, 92, 0.14);

}


/* =========================================================
   COPYRIGHT WRAPPER
========================================================= */

.footer-bottom .copyright {

    width: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

    text-align: center;

}


/* =========================================================
   COPYRIGHT TEXT
========================================================= */

.footer-bottom .copyright-text {

    margin: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-wrap: wrap;

    gap: 5px;

    color:
        rgba(255, 255, 255, 0.45);

    font-family: "DM Sans", sans-serif;

    font-size: 10px;

    font-weight: 400;

    line-height: 1.7;

}


/* =========================================================
   COMPANY NAME
========================================================= */

.footer-bottom .company-name {

    color: #c9a45c;

    font-weight: 600;

    transition: 0.3s ease;

}


.footer-bottom .company-name:hover {

    color: #ffffff;

}


/* =========================================================
   DEVELOPER TEXT
========================================================= */

.footer-bottom .developer-text {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    margin-left: 8px;

    color:
        rgba(255, 255, 255, 0.38);

}


/* =========================================================
   TECHNEST LINK
========================================================= */

.footer-bottom .developer-text a {

    display: inline-flex;

    align-items: center;

    justify-content: center;

}


/* =========================================================
   TECHNEST LOGO
========================================================= */

.footer-bottom .technest-logo {

    width: 15px;

    height: auto;

    display: block;

    object-fit: contain;

    opacity: 0.85;

    transition: 0.35s ease;

}


.footer-bottom .technest-logo:hover {

    opacity: 1;

    transform:
        translateY(-2px);

}


/* =========================================================
   GOLD SEPARATOR
========================================================= */

.footer-bottom .developer-text::before {

    content: "";

    width: 1px;

    height: 13px;

    background:
        rgba(201, 164, 92, 0.35);

    margin-right: 3px;

}


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

@media (max-width: 767px) {

    .footer-bottom {

        padding: 16px 15px;

    }


    .footer-bottom .copyright-text {

        font-size: 9px;

        gap: 4px;

    }


    .footer-bottom .developer-text {

        margin-left: 5px;

    }


    .footer-bottom .technest-logo {

        width: 68px;

    }

}


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

@media (max-width: 575px) {

    .footer-bottom {

        padding: 17px 12px;

    }


    .footer-bottom .copyright {

        display: block;

    }


    .footer-bottom .copyright-text {

        display: block;

        font-size: 9px;

        line-height: 2;

    }


    .footer-bottom .developer-text {

        display: flex;

        justify-content: center;

        width: 100%;

        margin: 4px 0 0;

    }


    .footer-bottom .developer-text::before {

        display: none;

    }


    .footer-bottom .technest-logo {

        width: 20px;

    }

}

@media (min-width: 992px) and (max-width: 1366px) {
    .adv-hero{
        height: 465px;
    }
    
    .adv-testimonial-section{
        height:590px;
    }
    .adv-cta-action-text strong {

    color: #ffffff;

    font-size: 14px;

    font-weight: 600;

}
}