/* =========================================================
   AJM GLOBAL TRADING LLC
   CORPORATE HEADER CSS
========================================================= */


/* =========================================================
   01. BRAND VARIABLES
========================================================= */

:root {
    --ajm-navy: #173d65;
    --ajm-deep: #07101d;
    --ajm-navy-light: #17283d;
    --ajm-blue: #243b53;
    --ajm-steel: #536a7e;
    --ajm-silver: #aeb8c2;
    --ajm-silver-light: #dfe4e8;
    --ajm-text: #1c2835;
    --ajm-text-light: #52606d;
    --ajm-muted: #7b8793;
    --ajm-border: #e3e7eb;
    --ajm-border-light: #edf0f2;
    --ajm-white: #ffffff;
    --ajm-offwhite: #f7f8f9;
    --ajm-transition: all 0.25s ease;
}


/* =========================================================
   02. GLOBAL RESET
========================================================= */

* {
    box-sizing: border-box;
}

html {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    font-family: "Inter", sans-serif;
    color: var(--ajm-text);
    background: #ffffff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    height: auto;
}

button {
    font-family: inherit;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}


/* =========================================================
   03. HEADER
========================================================= */

.ajm-header {
    position: relative;
    width: 100%;
    background: var(--ajm-white);
    z-index: 1000;
}


/* =========================================================
   04. TOP BAR
========================================================= */

.ajm-topbar {
    width: 100%;
    height: 38px;
    background: var(--ajm-deep);
    color: rgba(255, 255, 255, 0.56);
    font-size: 10px;
    letter-spacing: 0.05px;
}

.ajm-topbar .container {
    height: 100%;
}

.ajm-topbar-inner {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
}


/* =========================================================
   TOP LEFT
========================================================= */

.ajm-top-left {
    display: flex;
    align-items: center;
    gap: 15px;
    white-space: nowrap;
}

.ajm-company-name {
    color: #ffffff;
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
}

.ajm-top-message {
    color: rgba(255, 255, 255, 0.42);
    font-size: 9px;
    font-weight: 400;
}


/* =========================================================
   TOP RIGHT
========================================================= */

.ajm-top-right {
    display: flex;
    align-items: center;
    gap: 13px;
    white-space: nowrap;
}

.ajm-top-right a {
    color: rgba(255, 255, 255, 0.63);
    font-size: 9px;
    font-weight: 500;
    transition: color 0.2s ease;
}

.ajm-top-right a:hover {
    color: #ffffff;
}

.ajm-top-right i {
    margin-right: 5px;
    color: #aab5bf;
    font-size: 9px;
}

.ajm-top-divider {
    width: 1px;
    height: 11px;
    background: rgba(255, 255, 255, 0.12);
}


/* =========================================================
   05. MAIN HEADER
========================================================= */

.ajm-main-header {
    position: relative;
    width: 100%;
    height: 100px;
    background: #ffffff;
    border-bottom: 1px solid rgba(10, 20, 37, 0.07);
}

.ajm-main-nav {
    position: relative;
    height: 100px;
    display: flex;
    align-items: center;
    width: 100%;
}


/* =========================================================
   06. LOGO
========================================================= */

.ajm-logo {
    width: 215px;
    flex: 0 0 215px;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
}

.ajm-logo img {
    width: 145px;
    height: auto;
    display: block;
}


/* =========================================================
   07. DESKTOP NAVIGATION
========================================================= */

.ajm-navigation {
    height: 100%;
    display: flex;
    align-items: center;
    margin-left: 38px;
}

.ajm-menu {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 2px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ajm-menu>li {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
}

.ajm-menu>li>a {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 14px;
    color: #3a4755;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.1px;
    white-space: nowrap;
    transition:
        color 0.25s ease,
        background 0.25s ease;
}


/* =========================================================
   NAV HOVER LINE
========================================================= */

.ajm-menu>li>a::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 0;
    height: 3px;
    background: var(--ajm-navy);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.25s ease;
}

.ajm-menu>li>a:hover,
.ajm-menu>li>a.active {
    color: var(--ajm-navy);
}

.ajm-menu>li>a:hover::after,
.ajm-menu>li>a.active::after {
    transform: scaleX(1);
}


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

.ajm-menu-link i {
    color: #7d8994;
    font-size: 8px;
    transition: transform 0.25s ease;
}

.ajm-dropdown-item:hover .ajm-menu-link i {
    transform: rotate(180deg);
}


/* =========================================================
   08. MEGA MENU
========================================================= */

.ajm-mega-menu {
    position: absolute;
    top: 100px;
    left: 0;
    width: 880px;
    background: #ffffff;
    border: 1px solid rgba(10, 20, 37, 0.09);
    border-top: 3px solid var(--ajm-navy);
    box-shadow:
        0 25px 70px rgba(8, 17, 31, 0.15);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(12px);
    transition:
        opacity 0.22s ease,
        transform 0.22s ease,
        visibility 0.22s ease;
}

.ajm-dropdown-item:hover .ajm-mega-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}


/* =========================================================
   09. MEGA HEADER
========================================================= */

.ajm-mega-top {
    min-height: 103px;
    padding: 24px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    border-bottom: 1px solid var(--ajm-border);
}

.ajm-mega-top>div {
    min-width: 0;
}

.ajm-mega-top span {
    display: block;
    margin-bottom: 7px;
    color: var(--ajm-steel);
    font-family: "Montserrat", sans-serif;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 2px;
}

.ajm-mega-top h3 {
    margin: 0 0 6px;
    color: var(--ajm-navy);
    font-family: "Montserrat", sans-serif;
    font-size: 23px;
    font-weight: 700;
    letter-spacing: -0.5px;
    line-height: 1.15;
}

.ajm-mega-top p {
    max-width: 600px;
    margin: 0;
    color: var(--ajm-muted);
    font-size: 10px;
    line-height: 1.6;
}


/* =========================================================
   VIEW ALL BUTTON
========================================================= */

.ajm-view-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    color: var(--ajm-navy);
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
    transition: color 0.2s ease;
}

.ajm-view-all:hover {
    color: var(--ajm-steel);
}

.ajm-view-all i {
    font-size: 11px;
    transition: transform 0.2s ease;
}

.ajm-view-all:hover i {
    transform: translate(2px, -2px);
}


/* =========================================================
   LOCATION MEGA MENU
   Uses the existing AJM mega-menu design
========================================================= */

.ajm-location-mega-grid {

    display: grid;

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

    padding: 14px 16px 18px;

    gap: 4px;

}


/* LOCATION ITEM */

.ajm-location-mega-item {

    display: flex;

    align-items: center;

    gap: 14px;

    min-height: 64px;

    padding: 10px 14px;

    text-decoration: none;

    background: #ffffff;

    border: 1px solid transparent;

    transition:
        background 0.25s ease,
        border-color 0.25s ease,
        transform 0.25s ease;

}


/* NUMBER */

.ajm-location-number {

    width: 32px;

    height: 32px;

    flex: 0 0 32px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #b98a35;

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

    font-size: 9px;

    font-weight: 700;

    background: #faf8f2;

    border: 1px solid rgba(214,168,79,0.35);

}


/* CONTENT */

.ajm-location-mega-item > div {

    min-width: 0;

}


.ajm-location-mega-item strong {

    display: block;

    margin-bottom: 4px;

    color: #17384f;

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

    font-size: 11px;

    font-weight: 700;

    line-height: 1.3;

}


.ajm-location-mega-item small {

    display: block;

    color: #8a969f;

    font-size: 9px;

    line-height: 1.4;

}


/* ARROW */

.ajm-location-mega-item > i {

    margin-left: auto;

    color: #aab3ba;

    font-size: 12px;

    opacity: 0;

    transform: translateX(-4px);

    transition:
        opacity 0.2s ease,
        transform 0.2s ease,
        color 0.2s ease;

}


/* HOVER */

.ajm-location-mega-item:hover {

    background: #f7f9fa;

    border-color: rgba(214,168,79,0.22);

    transform: translateX(3px);

}


.ajm-location-mega-item:hover strong {

    color: #c08e2d;

}


.ajm-location-mega-item:hover > i {

    opacity: 1;

    transform: translateX(0);

    color: #d6a84f;

}

/* =========================================================
   MOBILE LOCATION MEGA MENU
========================================================= */

@media (max-width: 991.98px) {

    /* Dropdown parent */
    .ajm-dropdown-item {
        display: block;
        width: 100%;
    }


    /* Location menu hidden by default */
    .ajm-dropdown-item .ajm-mega-menu {
        position: static;

        width: 100%;
        max-width: none;

        margin: 0;

        border-top: 1px solid rgba(10, 20, 37, 0.08);
        border-left: 0;
        border-right: 0;

        box-shadow: none;

        opacity: 1;
        visibility: visible;
        pointer-events: auto;

        transform: none;

        display: none;
    }


    /* OPEN STATE */
    .ajm-dropdown-item.mobile-open > .ajm-mega-menu {
        display: block;
    }


    /* Top part */
    .ajm-mega-top {

        display: block;

        padding: 20px;

    }


    .ajm-mega-top h3 {

        font-size: 19px;

    }


    .ajm-mega-top p {

        max-width: none;

        font-size: 11px;

    }


    /* View all */
    .ajm-mega-top .ajm-view-all {

        margin-top: 15px;

    }


    /* Locations */
    .ajm-location-mega-grid {

        grid-template-columns: 1fr;

        padding: 10px;

    }


    .ajm-location-mega-item {

        min-height: 58px;

        padding: 10px 12px;

    }


    /* Always show arrow on mobile */
    .ajm-location-mega-item > i {

        opacity: 1;

        transform: none;

    }


    /* Disable hover movement on touch */
    .ajm-location-mega-item:hover {

        transform: none;

    }


    /* Location link */
    .ajm-dropdown-item > .ajm-menu-link {

        cursor: pointer;

    }


    /* Rotate dropdown arrow */
    .ajm-dropdown-item.mobile-open
    > .ajm-menu-link
    > i {

        transform: rotate(180deg);

    }

}

/* =========================================================
   MOBILE LOCATION DROPDOWN
   MEGA-MENU STYLE
========================================================= */

.ajm-mobile-location-dropdown {
    position: relative;
    width: 100%;
}


/* =========================================================
   LOCATION TOGGLE
========================================================= */

.ajm-mobile-location-dropdown
.ajm-mobile-dropdown-toggle {

    width: 100%;

    min-height: 58px;

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

    padding: 0 22px;

    background: #ffffff;

    border: 0;

    color: var(--ajm-navy);

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

    font-size: 14px;

    font-weight: 600;

    text-align: left;

    cursor: pointer;
}


.ajm-mobile-location-dropdown
.ajm-mobile-dropdown-toggle i {

    color: var(--ajm-steel);

    font-size: 17px;

    transition:
        transform 0.3s ease,
        color 0.3s ease;
}


/* OPEN TOGGLE */

.ajm-mobile-location-dropdown.active
.ajm-mobile-dropdown-toggle {

    color: var(--ajm-navy);

}


.ajm-mobile-location-dropdown.active
.ajm-mobile-dropdown-toggle i {

    color: #c7973d;

    transform: rotate(180deg);

}


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

.ajm-mobile-location-menu {

    display: none;

    position: relative;

    margin: 0 16px 16px;

    background: #ffffff;

    border: 1px solid
        rgba(10, 20, 37, 0.10);

    border-top: 3px solid
        var(--ajm-navy);

    box-shadow:
        0 18px 45px
        rgba(8, 17, 31, 0.13);

    overflow: hidden;

}


/* OPEN */

.ajm-mobile-location-dropdown.active
.ajm-mobile-location-menu {

    display: block;

    animation:
        ajmMobileLocationOpen
        0.28s ease both;

}


@keyframes ajmMobileLocationOpen {

    from {

        opacity: 0;

        transform:
            translateY(-8px);

    }

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


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

.ajm-mobile-location-head {

    min-height: 78px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 17px 18px;

    background:
        linear-gradient(
            135deg,
            #f7f9fb 0%,
            #ffffff 100%
        );

    border-bottom: 1px solid
        rgba(10, 20, 37, 0.08);

}


.ajm-mobile-location-head span:first-child {

    display: block;

    margin-bottom: 5px;

    color: #c7973d;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.8px;

}


.ajm-mobile-location-head strong {

    display: block;

    color: var(--ajm-navy);

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

    font-size: 14px;

    line-height: 1.2;

}


.ajm-mobile-location-count {

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    color: #c7973d;

    border: 1px solid
        rgba(199, 151, 61, 0.35);

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

    font-size: 11px;

    font-weight: 700;

}


/* =========================================================
   LOCATION ITEMS
========================================================= */

.ajm-mobile-location-menu > a {

    position: relative;

    min-height: 66px;

    display: grid;

    grid-template-columns: 34px 1fr 20px;

    align-items: center;

    gap: 12px;

    padding: 10px 17px;

    color: var(--ajm-navy);

    text-decoration: none;

    background: #ffffff;

    border-bottom: 1px solid
        rgba(10, 20, 37, 0.07);

    transition:
        background 0.25s ease,
        padding-left 0.25s ease;
}


.ajm-mobile-location-menu > a:last-child {

    border-bottom: 0;

}


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

.ajm-mobile-location-menu
.location-number {

    width: 32px;

    height: 32px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #c7973d;

    background: #f8f9fa;

    border: 1px solid
        rgba(199, 151, 61, 0.28);

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

    font-size: 8px;

    font-weight: 700;

}


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

.ajm-mobile-location-menu
a div {

    min-width: 0;

}


.ajm-mobile-location-menu
a strong {

    display: block;

    color: #173b59;

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

    font-size: 11px;

    font-weight: 700;

    line-height: 1.3;

}


.ajm-mobile-location-menu
a small {

    display: block;

    margin-top: 4px;

    color: #8995a0;

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

    font-size: 8px;

    font-weight: 500;

    line-height: 1.3;

}


/* =========================================================
   ARROW
========================================================= */

.ajm-mobile-location-menu
a > i {

    color: #9aa5ae;

    font-size: 11px;

    transition:
        color 0.2s ease,
        transform 0.2s ease;

}


.ajm-mobile-location-menu
a:hover {

    background: #f7f9fb;

    padding-left: 21px;

}


.ajm-mobile-location-menu
a:hover > i {

    color: #c7973d;

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

}


/* =========================================================
   GOLD HOVER LINE
========================================================= */

.ajm-mobile-location-menu > a::before {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 3px;

    height: 100%;

    background: #c7973d;

    transform: scaleY(0);

    transform-origin: center;

    transition:
        transform 0.25s ease;

}


.ajm-mobile-location-menu > a:hover::before {

    transform: scaleY(1);

}


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

@media (min-width: 992px) {

    .ajm-mobile-location-dropdown {

        display: none !important;

    }

}


@media (max-width: 575px) {

    .ajm-mobile-location-menu {

        margin-left: 12px;

        margin-right: 12px;

    }

    .ajm-mobile-location-head {

        padding-left: 15px;

        padding-right: 15px;

    }

    .ajm-mobile-location-menu > a {

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

        gap: 10px;

        padding-left: 14px;

        padding-right: 14px;

    }

    .ajm-mobile-location-menu
    a strong {

        font-size: 10px;

    }

}


/* =========================================================
   10. MATERIAL GRID
========================================================= */

.ajm-material-columns {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: #ffffff;
    padding: 8px 0;
}


/* =========================================================
   MATERIAL GROUP
========================================================= */

.ajm-material-group {
    min-height: 160px;
    padding: 16px 23px;
    border-right: 1px solid var(--ajm-border);
    border-bottom: 1px solid var(--ajm-border);
}

.ajm-material-group:nth-child(4n) {
    border-right: 0;
}

.ajm-material-group:nth-child(n+5) {
    border-bottom: 0;
}


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

.ajm-group-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.ajm-group-line {
    width: 17px;
    height: 2px;
    flex-shrink: 0;
    background: var(--ajm-steel);
}

.ajm-group-title span:last-child {
    color: #7c8995;
    font-family: "Montserrat", sans-serif;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1.3px;
}


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

.ajm-material-group>a {
    position: relative;
    min-height: 29px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 14px;
    color: #394754;
    font-size: 11px;
    font-weight: 500;
    transition:
        color 0.2s ease,
        padding-left 0.2s ease;
}

.ajm-material-group>a::after {
    content: "→";
    position: absolute;
    right: 0;
    color: var(--ajm-steel);
    opacity: 0;
    transform: translateX(-4px);
    transition:
        opacity 0.2s ease,
        transform 0.2s ease;
}

.ajm-material-group>a:hover {
    padding-left: 4px;
    color: var(--ajm-navy);
}

.ajm-material-group>a:hover::after {
    opacity: 1;
    transform: translateX(0);
}


/* =========================================================
   11. MEGA MENU BOTTOM
========================================================= */

.ajm-mega-bottom {
    min-height: 53px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 0 30px;
    background: #f6f7f8;
    border-top: 1px solid var(--ajm-border);
}

.ajm-mega-note {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #788592;
    font-size: 9px;
    font-weight: 500;
}

.ajm-mega-note i {
    color: var(--ajm-steel);
    font-size: 13px;
}

.ajm-all-materials-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--ajm-navy);
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 700;
    white-space: nowrap;
}

.ajm-all-materials-link:hover {
    color: var(--ajm-steel);
}

.ajm-all-materials-link i {
    font-size: 10px;
    transition: transform 0.2s ease;
}

.ajm-all-materials-link:hover i {
    transform: translateX(3px);
}


/* =========================================================
   12. RIGHT HEADER ACTIONS
========================================================= */

.ajm-header-actions {
    display: flex;
    align-items: center;
    gap: 22px;
    margin-left: auto;
}


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

.ajm-call {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--ajm-navy);
    white-space: nowrap;
}

.ajm-call-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dce1e5;
    border-radius: 50%;
    color: var(--ajm-blue);
    font-size: 13px;
    transition: var(--ajm-transition);
}

.ajm-call:hover .ajm-call-icon {
    color: #ffffff;
    background: var(--ajm-navy);
    border-color: var(--ajm-navy);
}

.ajm-call-content {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.ajm-call-content small {
    display: block;
    margin-bottom: 4px;
    color: #8a969f;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 1.3px;
}

.ajm-call-content strong {
    display: block;
    color: var(--ajm-navy);
    font-family: "Montserrat", sans-serif;
    font-size: 11px;
    font-weight: 700;
}


/* =========================================================
   13. QUOTE BUTTON
========================================================= */

.ajm-quote {
    height: 48px;
    display: inline-flex;
    align-items: center;
    gap: 16px;
    padding: 0 8px 0 19px;
    color: #ffffff;
    background: var(--ajm-navy);
    border: 1px solid var(--ajm-navy);
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
    transition:
        background 0.25s ease,
        transform 0.25s ease;
}

.ajm-quote:hover {
    background: var(--ajm-blue);
    border-color: var(--ajm-blue);
    color: #ffffff;
    transform: translateY(-1px);
}

.ajm-quote i {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.10);
    font-size: 11px;
}


/* =========================================================
   14. MOBILE TOGGLE
========================================================= */
/* =========================================================
   AJM MOBILE MENU BUTTON
========================================================= */

/* =========================================================
   AJM PROFESSIONAL MOBILE MENU ICON
========================================================= */

.ajm-mobile-toggle {
    position: relative;
    width: 42px;
    height: 42px;
    margin-left: auto;
    padding: 0;
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    background: transparent;
    border: 0;
    outline: none;
    cursor: pointer;
}


/* Three lines */

.ajm-mobile-toggle span {
    display: block;
    height: 2px;
    background: var(--ajm-navy);
    border-radius: 2px;
    transition:
        width 0.25s ease,
        transform 0.25s ease,
        opacity 0.2s ease;
}


/* Slightly different lengths = more refined */

.ajm-mobile-toggle span:nth-child(1) {
    width: 22px;
    margin-left: 4px;
}

.ajm-mobile-toggle span:nth-child(2) {
    width: 17px;
    margin-left: 9px;
}

.ajm-mobile-toggle span:nth-child(3) {
    width: 22px;
    margin-left: 4px;
}


/* Hover */

.ajm-mobile-toggle:hover span {
    background: var(--ajm-blue);
}

.ajm-mobile-toggle:hover span:nth-child(2) {
    width: 22px;
    margin-left: 4px;
}


/* =========================================================
   ACTIVE / CLOSE STATE
========================================================= */

.ajm-mobile-toggle.active {
    gap: 0;
}

.ajm-mobile-toggle.active span:nth-child(1) {
    width: 22px;
    margin-left: 0;
    transform: translateY(2px) rotate(45deg);
}

.ajm-mobile-toggle.active span:nth-child(2) {
    width: 22px;
    margin-left: 0;
    opacity: 0;
    transform: scaleX(0);
}

.ajm-mobile-toggle.active span:nth-child(3) {
    width: 22px;
    margin-left: 0;
    transform: translateY(-2px) rotate(-45deg);
}


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

@media (max-width: 991.98px) {
    .ajm-mobile-toggle {
        display: flex;
    }

}


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

@media (max-width: 575.98px) {
    .ajm-mobile-toggle {
        width: 38px;
        height: 38px;
    }

    .ajm-mobile-toggle span:nth-child(1),
    .ajm-mobile-toggle span:nth-child(3) {
        width: 20px;
    }

    .ajm-mobile-toggle span:nth-child(2) {
        width: 15px;
    }

    .ajm-mobile-toggle.active span:nth-child(1),
    .ajm-mobile-toggle.active span:nth-child(3) {
        width: 20px;
    }

}

/* =========================================================
   15. MOBILE MENU
========================================================= */

.ajm-mobile-menu {
    display: none;
}


/* =========================================================
   16. MOBILE
========================================================= */

@media (max-width: 1399.98px) {
    .ajm-logo {
        width: 185px;
        flex-basis: 185px;
    }

    .ajm-logo img {
        width: 180px;
    }

    .ajm-navigation {
        margin-left: 20px;
    }

    .ajm-menu>li>a {
        padding-left: 11px;
        padding-right: 11px;
        font-size: 13px;
    }

    .ajm-menu>li>a::after {
        left: 11px;
        right: 11px;
    }

    .ajm-header-actions {
        gap: 14px;
    }

    .ajm-call {
        display: none;
    }

}


@media (max-width: 1199.98px) {
    .ajm-logo {
        width: 165px;
        flex-basis: 165px;
    }

    .ajm-logo img {
        width: 160px;
    }

    .ajm-navigation {
        margin-left: 8px;
    }

    .ajm-menu>li>a {
        padding-left: 7px;
        padding-right: 7px;
        font-size: 11px;
    }

    .ajm-menu>li>a::after {
        left: 7px;
        right: 7px;
    }

    .ajm-header-actions {
        gap: 7px;
    }

    .ajm-quote {
        gap: 8px;
        padding-left: 12px;
    }

    .ajm-mega-menu {
        width: 760px;
    }

    .ajm-material-columns {
        grid-template-columns: repeat(3, 1fr);
    }

    .ajm-material-group:nth-child(4n) {
        border-right: 1px solid var(--ajm-border);
    }

    .ajm-material-group:nth-child(3n) {
        border-right: 0;
    }

    .ajm-material-group:nth-child(n+5) {
        border-bottom: 1px solid var(--ajm-border);
    }

    .ajm-material-group:nth-child(n+7) {
        border-bottom: 0;
    }

}


/* =========================================================
   17. TABLET / MOBILE
========================================================= */

@media (max-width: 991.98px) {
    .ajm-topbar {
        display: none;
    }

    .ajm-main-header {
        height: 78px;
    }

    .ajm-main-nav {
        height: 78px;
    }

    .ajm-logo {
        width: auto;
        flex-basis: auto;
        margin: 0;
    }

    .ajm-logo img {
        width: 125px;
    }

    .ajm-navigation,
    .ajm-header-actions {
        display: none;
    }

    .ajm-mobile-toggle {
        display: flex;
    }

    /* =====================================================
       MOBILE MENU
    ====================================================== */
    .ajm-mobile-menu {
        display: block;
        position: absolute;
        top: 78px;
        left: 0;
        right: 0;
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        visibility: hidden;
        background: #ffffff;
        border-bottom: 1px solid var(--ajm-border);
        box-shadow:
            0 20px 40px rgba(8, 17, 31, 0.10);
        transition:
            max-height 0.4s ease,
            opacity 0.25s ease,
            visibility 0.25s ease;
    }

    .ajm-mobile-menu.open {
        max-height: calc(100vh - 78px);
        overflow-y: auto;
        opacity: 1;
        visibility: visible;
    }

    .ajm-mobile-menu-inner {
        padding: 8px 0 22px;
        background: #ffffff;
    }

    /* =====================================================
       MOBILE MAIN LINK
    ====================================================== */
    .ajm-mobile-link,
    .ajm-mobile-dropdown-toggle {
        width: 100%;
        min-height: 55px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 20px;
        border: 0;
        border-bottom: 1px solid #edf0f2;
        background: #ffffff;
        color: var(--ajm-navy);
        font-family: "Montserrat", sans-serif;
        font-size: 14px;
        font-weight: 600;
        text-align: left;
        transition:
            background 0.2s ease,
            color 0.2s ease;
    }

    .ajm-mobile-link:hover,
    .ajm-mobile-dropdown-toggle:hover {
        color: var(--ajm-navy);
        background: #f6f8f9;
    }

    .ajm-mobile-link.active {
        color: var(--ajm-blue);
        background: #f5f7f8;
    }

    /* =====================================================
       MOBILE SCRAP DROPDOWN
    ====================================================== */
    .ajm-mobile-dropdown-toggle {
        cursor: pointer;
    }

    .ajm-mobile-dropdown-toggle i {
        color: var(--ajm-steel);
        font-size: 17px;
        transition: transform 0.25s ease;
    }

    .ajm-mobile-dropdown.active .ajm-mobile-dropdown-toggle i {
        transform: rotate(45deg);
    }

    /* =====================================================
       MOBILE SUBMENU
    ====================================================== */
    .ajm-mobile-submenu {
        max-height: 0;
        overflow: hidden;
        background: #f5f7f9;
        transition: max-height 0.4s ease;
    }

    .ajm-mobile-dropdown.active .ajm-mobile-submenu {
        max-height: 1600px;
    }

    /* =====================================================
       MOBILE GROUP TITLE
    ====================================================== */
    .ajm-mobile-group-title {
        padding: 17px 20px 8px 34px;
        color: #84909b;
        font-family: "Montserrat", sans-serif;
        font-size: 8px;
        font-weight: 700;
        letter-spacing: 1.5px;
        text-transform: uppercase;
    }

    /* =====================================================
       MOBILE SUB LINKS
    ====================================================== */
    .ajm-mobile-submenu>a {
        min-height: 44px;
        display: flex;
        align-items: center;
        padding: 0 20px 0 38px;
        border-bottom: 1px solid #e5e9ec;
        color: #465463;
        font-size: 12px;
        font-weight: 500;
        background: #f5f7f9;
        transition:
            color 0.2s ease,
            padding-left 0.2s ease,
            background 0.2s ease;
    }

    .ajm-mobile-submenu>a::before {
        content: "";
        width: 5px;
        height: 5px;
        flex-shrink: 0;
        margin-right: 10px;
        border-radius: 50%;
        background: #a7b1ba;
    }

    .ajm-mobile-submenu>a:hover {
        padding-left: 42px;
        color: var(--ajm-navy);
        background: #ffffff;
    }

    /* =====================================================
       VIEW ALL MATERIALS
    ====================================================== */
    .ajm-mobile-submenu>.ajm-mobile-all-materials {
        min-height: 53px;
        padding-left: 20px;
        justify-content: space-between;
        background: #ffffff;
        color: var(--ajm-navy);
        font-family: "Montserrat", sans-serif;
        font-size: 10px;
        font-weight: 700;
    }

    .ajm-mobile-submenu>.ajm-mobile-all-materials::before {
        display: none;
    }

    .ajm-mobile-all-materials i {
        margin-left: auto;
        font-size: 12px;
    }

    /* =====================================================
       MOBILE ACTIONS
    ====================================================== */
    .ajm-mobile-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        padding: 18px 20px 2px;
    }

    /* CALL */
    .ajm-mobile-call {
        min-height: 54px;
        display: flex;
        align-items: center;
        gap: 9px;
        padding: 0 12px;
        color: var(--ajm-navy);
        background: #ffffff;
        border: 1px solid #dfe4e8;
    }

    .ajm-mobile-action-icon {
        width: 35px;
        height: 35px;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: #f0f3f5;
        color: var(--ajm-navy);
        font-size: 12px;
    }

    .ajm-mobile-call small,
    .ajm-mobile-call strong {
        display: block;
    }

    .ajm-mobile-call small {
        margin-bottom: 3px;
        color: #87929d;
        font-family: "Montserrat", sans-serif;
        font-size: 7px;
        font-weight: 700;
        letter-spacing: 1px;
    }

    .ajm-mobile-call strong {
        color: var(--ajm-navy);
        font-family: "Montserrat", sans-serif;
        font-size: 10px;
        font-weight: 700;
    }

    /* QUOTE */
    .ajm-mobile-quote {
        min-height: 54px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        background: var(--ajm-navy);
        color: #ffffff;
        font-family: "Montserrat", sans-serif;
        font-size: 10px;
        font-weight: 700;
    }

    .ajm-mobile-quote:hover {
        background: var(--ajm-blue);
        color: #ffffff;
    }

    .ajm-mobile-quote i {
        font-size: 11px;
    }

}


/* =========================================================
   18. SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {
    .ajm-main-header {
        height: 70px;
    }

    .ajm-main-nav {
        height: 70px;
    }

    .ajm-logo img {
        width: 105px;
    }

    .ajm-mobile-toggle {
        width: 41px;
        height: 41px;
    }

    .ajm-mobile-menu {
        top: 70px;
    }

    .ajm-mobile-menu.open {
        max-height: calc(100vh - 70px);
    }

    .ajm-mobile-actions {
        grid-template-columns: 1fr;
        gap: 8px;
    }

}

/* =========================================================
   AJM GLOBAL
   STATIC CORPORATE HERO
========================================================= */

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

.ajm-hero {
    position: relative;
    min-height: 650px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #173d65;
    color: #ffffff;
}


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

.ajm-hero-bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 65%;
    z-index: 0;
}

.ajm-hero-bg img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}


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

.ajm-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(90deg,
            #173d65 0%,
            #173d65 28%,
            rgba(7, 21, 37, 0.98) 40%,
            rgba(7, 21, 37, 0.75) 51%,
            rgba(7, 21, 37, 0.15) 72%,
            rgba(7, 21, 37, 0) 100%);
}


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

.ajm-hero-content {
    position: relative;
    z-index: 5;
    padding: 90px 30px 90px 0;
}


/* =========================================================
   EYEBROW
========================================================= */

.ajm-hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    color: #86a9ca;
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.8px;
}

.ajm-hero-eyebrow span {
    width: 35px;
    height: 2px;
    background: #7192b0;
}


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

.ajm-hero-content h1 {
    max-width: 680px;
    margin: 0;
    color: #ffffff;
    font-family: "Montserrat", sans-serif;
    font-size: clamp(48px, 5.2vw, 72px);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -3px;
    text-transform: uppercase;
}

.ajm-hero-content h1 span {
    display: block;
    color: #7298bb;
    font-weight: 700;
}


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

.ajm-hero-content>p {
    max-width: 570px;
    margin: 28px 0 32px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 15px;
    line-height: 1.8;
}


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

.ajm-hero-buttons {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ajm-btn-primary,
.ajm-btn-outline {
    min-height: 53px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 0 20px;
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    transition: all 0.25s ease;
}


/* Primary */

.ajm-btn-primary {
    min-width: 190px;
    background: #7198bb;
    color: #ffffff;
    border: 1px solid #7198bb;
}

.ajm-btn-primary:hover {
    background: #86a9ca;
    border-color: #86a9ca;
    color: #ffffff;
    transform: translateY(-2px);
}

.ajm-btn-primary i,
.ajm-btn-outline i {
    font-size: 13px;
}


/* Outline */

.ajm-btn-outline {
    min-width: 175px;
    background: rgba(255, 255, 255, 0.02);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.55);
}

.ajm-btn-outline:hover {
    background: #ffffff;
    color: #173d65;
    border-color: #ffffff;
}


/* =========================================================
   HIGHLIGHTS
========================================================= */

.ajm-hero-highlight {
    display: flex;
    align-items: center;
    gap: 11px;
}

.highlight-icon {
    width: 43px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 50%;
    color: #ffffff;
    font-size: 15px;
}

.ajm-hero-highlight strong {
    display: block;
    margin-bottom: 4px;
    color: #ffffff;
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.ajm-hero-highlight small {
    display: block;
    color: rgba(255, 255, 255, 0.52);
    font-size: 9px;
}


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



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

@media (max-width: 991.98px) {
    .ajm-hero {
        min-height: 700px;
    }

    .ajm-hero-bg {
        width: 100%;
    }

    .ajm-hero-overlay {
        background:
            linear-gradient(90deg,
                rgba(7, 21, 37, 0.98) 0%,
                rgba(7, 21, 37, 0.92) 45%,
                rgba(7, 21, 37, 0.68) 100%);
    }

    .ajm-hero-content {
        padding: 85px 0;
    }

}


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

@media (max-width: 575.98px) {
    .ajm-hero {
        min-height: 720px;
    }

    .ajm-hero-bg {
        width: 100%;
    }

    .ajm-hero-bg img {
        object-position: 65% center;
    }

    .ajm-hero-overlay {
        background:
            linear-gradient(180deg,
                rgba(7, 21, 37, 0.94) 0%,
                rgba(7, 21, 37, 0.88) 48%,
                rgba(7, 21, 37, 0.72) 100%);
    }

    .ajm-hero-content {
        padding: 65px 0 55px;
    }

    .ajm-hero-eyebrow {
        font-size: 8px;
        letter-spacing: 1.3px;
    }

    .ajm-hero-content h1 {
        font-size: 40px;
        letter-spacing: -1.8px;
    }

    .ajm-hero-content>p {
        font-size: 13px;
        line-height: 1.7;
    }

    .ajm-hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .ajm-btn-primary,
    .ajm-btn-outline {
        width: 100%;
    }

}

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


/* =========================================================
   AJM GLOBAL
   PROFESSIONAL SCRAP MATERIALS SECTION
========================================================= */

.ajm-materials-section {
    position: relative;
    padding: 115px 0 120px;
    background: #fbfbfb;
    overflow: hidden;
}


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

.ajm-materials-section::before {
    content: "";
    position: absolute;
    width: 500px;
    height: 500px;
    right: -260px;
    top: -220px;
    border: 1px solid rgba(10, 20, 37, 0.035);
    border-radius: 50%;
}

.ajm-materials-section::after {
    content: "";
    position: absolute;
    width: 350px;
    height: 350px;
    right: -180px;
    top: -140px;
    border: 1px solid rgba(10, 20, 37, 0.035);
    border-radius: 50%;
}


/* =========================================================
   MATERIALS HEADER — CUSTOM CORPORATE STYLE
========================================================= */

.ajm-materials-header {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 80px;
    margin-bottom: 52px;
}


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

.ajm-materials-label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 19px;
    color: #738494;
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1.8px;
}

.ajm-label-number {
    color: #a3adb5;
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 0;
}

.ajm-label-line {
    width: 34px;
    height: 1px;
    background: #7e8e9d;
}


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

.ajm-materials-heading h2 {
    margin: 0;
    color: #173d65;
    font-family: "Montserrat", sans-serif;
    font-size: clamp(48px, 5vw, 67px);
    font-weight: 500;
    line-height: 0.96;
    letter-spacing: -3.5px;
}

.ajm-materials-heading h2 strong {
    display: block;
    color: #173d65;
    font-weight: 800;
    letter-spacing: -3.8px;
}


/* =========================================================
   RIGHT SIDE
========================================================= */

.ajm-materials-intro {
    max-width: 490px;
    display: flex;
    align-items: flex-start;
    gap: 27px;
    padding-bottom: 3px;
}


/* =========================================================
   COUNT
========================================================= */

.ajm-materials-count {
    min-width: 82px;
    padding-left: 16px;
    border-left: 2px solid #73879a;
}

.ajm-materials-count strong {
    display: block;
    color: #173d65;
    font-family: "Montserrat", sans-serif;
    font-size: 31px;
    font-weight: 800;
    line-height: 0.9;
    letter-spacing: -1px;
}

.ajm-materials-count span {
    display: block;
    margin-top: 8px;
    color: #8b969e;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 1px;
}


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

.ajm-materials-intro-text {
    max-width: 350px;
}

.ajm-materials-intro-text p {
    margin: 0 0 14px;
    color: #687681;
    font-size: 12px;
    line-height: 1.75;
}


/* =========================================================
   EXPLORE LINK
========================================================= */

.ajm-materials-intro-text a {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #173d65;
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.ajm-materials-intro-text a:hover {
    color: #526b82;
}

.ajm-materials-intro-text a i {
    font-size: 11px;
    transition: transform 0.2s ease;
}

.ajm-materials-intro-text a:hover i {
    transform: translate(3px, -2px);
}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.ajm-materials-layout {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 0.85fr 1.15fr;
    min-height: 575px;
}


/* =========================================================
   FEATURED PANEL
========================================================= */

.ajm-featured-material {
    position: relative;
    min-height: 575px;
    overflow: hidden;
    background:
        linear-gradient(145deg,
            #173d65 0%,
            #11243a 58%,
            #263b4e 100%);
    color: #ffffff;
}


/* Decorative lines */

.ajm-featured-bg::before,
.ajm-featured-bg::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 50%;
}

.ajm-featured-bg::before {
    width: 430px;
    height: 430px;
    right: -210px;
    top: -120px;
}

.ajm-featured-bg::after {
    width: 300px;
    height: 300px;
    right: -140px;
    top: -55px;
}


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

.ajm-featured-content {
    position: relative;
    z-index: 3;
    height: 100%;
    min-height: 575px;
    padding: 35px;
    display: flex;
    flex-direction: column;
}


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

.ajm-featured-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ajm-featured-number {
    color: rgba(255, 255, 255, 0.35);
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
}

.ajm-featured-tag {
    padding: 7px 10px;
    color: #b7c5d0;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.10);
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 1.4px;
}


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

.ajm-featured-icon {
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    margin-bottom: 25px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #c2ced8;
    font-size: 23px;
}


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

.ajm-featured-content h3 {
    margin: 0;
    color: #ffffff;
    font-family: "Montserrat", sans-serif;
    font-size: 39px;
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -1.8px;
}

.ajm-featured-content h3 span {
    color: #8fa6ba;
    font-weight: 500;
}


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

.ajm-featured-content>p {
    max-width: 390px;
    margin: 19px 0 23px;
    color: rgba(255, 255, 255, 0.54);
    font-size: 11px;
    line-height: 1.75;
}


/* =========================================================
   MATERIAL TAGS
========================================================= */

.ajm-featured-types {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.ajm-featured-types span {
    padding: 7px 10px;
    color: rgba(255, 255, 255, 0.60);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 8px;
}


/* =========================================================
   FEATURED LINK
========================================================= */

.ajm-featured-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
    margin-top: 25px;
    padding-bottom: 6px;
    color: #ffffff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 700;
}

.ajm-featured-link:hover {
    color: #b6c8d7;
    border-color: #b6c8d7;
}

.ajm-featured-link i {
    transition: transform 0.2s ease;
}

.ajm-featured-link:hover i {
    transform: translate(2px, -2px);
}


/* =========================================================
   MATERIAL LIST
========================================================= */

.ajm-material-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    background: #ffffff;
    border-top: 1px solid #dfe4e8;
    border-right: 1px solid #dfe4e8;
    border-bottom: 1px solid #dfe4e8;
}


/* =========================================================
   MATERIAL ROW
========================================================= */

.ajm-material-row {
    position: relative;
    min-height: 143px;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 23px;
    color: #173d65;
    border-left: 1px solid #dfe4e8;
    border-bottom: 1px solid #dfe4e8;
    overflow: hidden;
    transition:
        background 0.25s ease,
        color 0.25s ease;
}


/* Remove bottom border */

.ajm-material-row:nth-last-child(-n+2) {
    border-bottom: 0;
}


/* =========================================================
   INDEX
========================================================= */

.ajm-material-index {
    position: absolute;
    top: 17px;
    right: 18px;
    color: #c3cbd1;
    font-family: "Montserrat", sans-serif;
    font-size: 8px;
    font-weight: 700;
    transition: color 0.25s ease;
}


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

.ajm-material-icon {
    width: 47px;
    height: 47px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: #f0f3f5;
    color: #324b63;
    font-size: 18px;
    transition:
        background 0.25s ease,
        color 0.25s ease;
}


/* =========================================================
   INFO
========================================================= */

.ajm-material-info {
    padding-right: 20px;
}

.ajm-material-info strong {
    display: block;
    margin-bottom: 5px;
    color: #152333;
    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;
    transition: color 0.25s ease;
}

.ajm-material-info small {
    display: block;
    color: #84909a;
    font-size: 9px;
    line-height: 1.5;
    transition: color 0.25s ease;
}


/* =========================================================
   ARROW
========================================================= */

.ajm-material-arrow {
    position: absolute;
    right: 18px;
    bottom: 18px;
    color: #86939e;
    font-size: 10px;
    opacity: 0;
    transform: translate(-5px, 5px);
    transition:
        opacity 0.25s ease,
        transform 0.25s ease;
}


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

.ajm-material-row:hover {
    color: #ffffff;
    background: #173d65;
}

.ajm-material-row:hover .ajm-material-index {
    color: rgba(255, 255, 255, 0.35);
}

.ajm-material-row:hover .ajm-material-icon {
    background: rgba(255, 255, 255, 0.09);
    color: #d4dde4;
}

.ajm-material-row:hover .ajm-material-info strong {
    color: #ffffff;
}

.ajm-material-row:hover .ajm-material-info small {
    color: rgba(255, 255, 255, 0.52);
}

.ajm-material-row:hover .ajm-material-arrow {
    opacity: 1;
    color: #ffffff;
    transform: translate(0, 0);
}


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

.ajm-materials-bottom {
    position: relative;
    z-index: 2;
    min-height: 90px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 0 25px;
    background: #ffffff;
    border-right: 1px solid #dfe4e8;
    border-bottom: 1px solid #dfe4e8;
    border-left: 1px solid #dfe4e8;
}

.ajm-materials-bottom>div {
    display: flex;
    align-items: center;
    gap: 20px;
}

.ajm-materials-bottom span {
    color: #83909a;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 1.4px;
    white-space: nowrap;
}

.ajm-materials-bottom p {
    margin: 0;
    color: #6c7984;
    font-size: 10px;
}


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

.ajm-materials-button {
    min-height: 45px;
    display: inline-flex;
    align-items: center;
    gap: 15px;
    padding: 0 7px 0 17px;
    flex-shrink: 0;
    color: #ffffff;
    background: #173d65;
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.ajm-materials-button i {
    width: 31px;
    height: 31px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.10);
    font-size: 10px;
}

.ajm-materials-button:hover {
    color: #ffffff;
    background: #243b53;
}


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

@media (max-width: 991.98px) {
    .ajm-materials-section {
        padding: 85px 0 90px;
    }

    .ajm-materials-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 30px;
    }

    .ajm-materials-layout {
        grid-template-columns: 1fr;
    }

    .ajm-featured-material {
        min-height: 430px;
    }

    .ajm-featured-content {
        min-height: 430px;
    }

    .ajm-material-list {
        border-left: 1px solid #dfe4e8;
    }

}


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

@media (max-width: 575.98px) {
    .ajm-materials-section {
        padding: 65px 0 70px;
    }

    .ajm-materials-header {
        margin-bottom: 35px;
    }

    .ajm-materials-heading h2 {
        font-size: 37px;
        letter-spacing: -1.6px;
    }

    .ajm-materials-intro {
        gap: 17px;
    }

    .ajm-materials-count {
        min-width: 72px;
        padding-left: 12px;
    }

    .ajm-materials-count strong {
        font-size: 27px;
    }

    .ajm-materials-intro p {
        font-size: 11px;
    }

    .ajm-featured-material {
        min-height: 430px;
    }

    .ajm-featured-content {
        min-height: 430px;
        padding: 25px;
    }

    .ajm-featured-content h3 {
        font-size: 32px;
    }

    .ajm-material-list {
        grid-template-columns: 1fr;
    }

    .ajm-material-row {
        min-height: 115px;
        padding: 20px;
    }

    .ajm-material-row:nth-last-child(-n+2) {
        border-bottom: 1px solid #dfe4e8;
    }

    .ajm-material-row:last-child {
        border-bottom: 0;
    }

    .ajm-materials-bottom {
        align-items: flex-start;
        flex-direction: column;
        padding: 20px;
        gap: 18px;
    }

    .ajm-materials-bottom>div {
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
    }

    .ajm-materials-button {
        width: 100%;
        justify-content: space-between;
    }

}

@media (max-width: 991.98px) {
    .ajm-materials-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 30px;
    }

    .ajm-materials-intro {
        max-width: 650px;
    }

}


@media (max-width: 575.98px) {
    .ajm-materials-header {
        margin-bottom: 35px;
        gap: 25px;
    }

    .ajm-materials-heading h2 {
        font-size: 42px;
        letter-spacing: -2.2px;
    }

    .ajm-materials-heading h2 strong {
        letter-spacing: -2.4px;
    }

    .ajm-materials-intro {
        gap: 18px;
    }

}




/* =========================================================
   AJM UAE SCRAP BUYING
========================================================= */

.ajm-uae-buying {
    position: relative;
    padding: 120px 0 0;
    background: #efefef;
    overflow: hidden;
    color: #173d65;
}


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

.ajm-uae-buying-bg {
    position: absolute;
    width: 700px;
    height: 700px;
    right: -400px;
    top: 100px;
    border-radius: 50%;
    border: 1px solid rgba(10, 20, 37, 0.055);
    pointer-events: none;
}


.ajm-uae-buying-bg::before {
    content: "";
    position: absolute;
    width: 480px;
    height: 480px;
    right: 105px;
    top: 105px;
    border-radius: 50%;
    border: 1px solid rgba(10, 20, 37, 0.045);
}


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

.ajm-uae-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 28px;
    border-bottom: 1px solid #d7dde1;
}


.ajm-uae-label {
    display: flex;
    align-items: center;
    gap: 13px;
    color: #536879;
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1.8px;
}


.ajm-uae-label span {
    color: #8c9aa4;
}


.ajm-uae-label i {
    width: 38px;
    height: 1px;
    background: #718594;
}


.ajm-uae-location {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #74838e;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 1.5px;
}


.ajm-uae-location i {
    color: #5e8198;
    font-size: 12px;
}


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

.ajm-uae-main {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1fr 0.92fr;
    gap: 90px;
    align-items: center;
    padding: 85px 0 100px;
}


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

.ajm-uae-content h2 {
    max-width: 650px;
    margin: 0;
    color: #173d65;
    font-family: "Montserrat", sans-serif;
    font-size: clamp(48px, 5.3vw, 72px);
    font-weight: 300;
    line-height: 0.95;
    letter-spacing: -4px;
}


.ajm-uae-content h2 span {
    display: block;
    color: #b89472;
    font-weight: 600;
}


.ajm-uae-content h2 strong {
    display: block;
    color: #173d65;
    font-weight: 800;
}


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

.ajm-uae-intro {
    max-width: 570px;
    margin: 35px 0 12px;
    color: #435563;
    font-size: 12px;
    line-height: 1.85;
}


.ajm-uae-intro strong {
    color: #1d526f;
    font-weight: 700;
}


.ajm-uae-description {
    max-width: 530px;
    margin: 0 0 35px;
    color: #788691;
    font-size: 10px;
    line-height: 1.85;
}


/* =========================================================
   MATERIALS
========================================================= */

.ajm-uae-materials {
    display: grid;
    grid-template-columns:
        repeat(3, 1fr);
    max-width: 600px;
    border-top: 1px solid #d7dde1;
    border-bottom: 1px solid #d7dde1;
}


.ajm-uae-material {
    position: relative;
    min-height: 145px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 25px 18px;
    border-right: 1px solid #d7dde1;
    transition:
        background 0.3s ease,
        transform 0.3s ease;
}


.ajm-uae-material:last-child {
    border-right: 0;
}


.ajm-uae-material:hover {
    background: #ffffff;
    transform: translateY(-4px);
}


.ajm-uae-material>span {
    position: absolute;
    top: 14px;
    right: 14px;
    color: #a1adb5;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
}


.ajm-uae-material i {
    margin-bottom: 15px;
    color: #66869b;
    font-size: 18px;
}


.ajm-uae-material strong {
    margin-bottom: 5px;
    color: #172737;
    font-family: "Montserrat", sans-serif;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1px;
}


.ajm-uae-material small {
    color: #89959d;
    font-size: 8px;
    line-height: 1.5;
}


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

.ajm-uae-cta {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    margin-top: 30px;
    padding: 6px 6px 6px 21px;
    color: #ffffff;
    background: #173d65;
    font-family: "Montserrat", sans-serif;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    transition:
        background 0.3s ease,
        transform 0.3s ease;
}


.ajm-uae-cta i {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #638ba4;
    font-size: 11px;
    transition: transform 0.3s ease;
}


.ajm-uae-cta:hover {
    color: #ffffff;
    background: #1a3348;
    transform: translateY(-3px);
}


.ajm-uae-cta:hover i {
    transform: translate(3px, -3px);
}


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

.ajm-uae-image {
    position: relative;
    padding: 15px;
}


.ajm-uae-image-frame {
    position: relative;
    min-height: 540px;
    overflow: hidden;
    background: #172838;
    box-shadow:
        0 25px 60px rgba(10, 20, 37, 0.16);
}


.ajm-uae-image-frame img {
    width: 100%;
    height: 540px;
    display: block;
    object-fit: cover;
    transition:
        transform 0.8s cubic-bezier(.2, .7, .2, 1);
}


.ajm-uae-image:hover img {
    transform: scale(1.045);
}


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

.ajm-uae-image-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg,
            rgba(4, 14, 24, 0.05) 30%,
            rgba(4, 14, 24, 0.82) 100%);
}


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

.ajm-uae-image-label {
    position: absolute;
    left: 35px;
    bottom: 32px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}


.ajm-uae-image-label span {
    color: #9db5c4;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 600;
    letter-spacing: 2px;
}


.ajm-uae-image-label strong {
    color: #ffffff;
    font-family: "Montserrat", sans-serif;
    font-size: 30px;
    font-weight: 800;
    line-height: 0.9;
    letter-spacing: -1px;
}


/* =========================================================
   CORNER MARKS
========================================================= */

.ajm-uae-corner span {
    position: absolute;
    width: 28px;
    height: 28px;
    border-color: rgba(255, 255, 255, 0.6);
    border-style: solid;
}


.ajm-uae-corner span:nth-child(1) {
    left: 18px;
    top: 18px;
    border-width: 1px 0 0 1px;
}


.ajm-uae-corner span:nth-child(2) {
    right: 18px;
    top: 18px;
    border-width: 1px 1px 0 0;
}


.ajm-uae-corner span:nth-child(3) {
    left: 18px;
    bottom: 18px;
    border-width: 0 0 1px 1px;
}


.ajm-uae-corner span:nth-child(4) {
    right: 18px;
    bottom: 18px;
    border-width: 0 1px 1px 0;
}


/* =========================================================
   FLOATING STAT
========================================================= */

.ajm-uae-stat {
    position: absolute;
    right: -20px;
    top: 55px;
    width: 115px;
    height: 125px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 20px;
    background: #82c8ed;
    box-shadow:
        0 15px 35px rgba(10, 20, 37, 0.16);
    animation:
        ajmUaeFloat 4s ease-in-out infinite;
}


.ajm-uae-stat span {
    color: #35586c;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1.5px;
}


.ajm-uae-stat strong {
    color: #173d65;
    font-family: "Montserrat", sans-serif;
    font-size: 42px;
    font-weight: 800;
    line-height: 1;
}


.ajm-uae-stat small {
    margin-top: 4px;
    color: #456779;
    font-family: "Montserrat", sans-serif;
    font-size: 6px;
    font-weight: 700;
    letter-spacing: 1px;
}


@keyframes ajmUaeFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }

}


/* =========================================================
   BOTTOM SEO STRIP
========================================================= */

.ajm-uae-bottom {
    position: relative;
    z-index: 3;
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    border-top: 1px solid #d7dde1;
    color: #657580;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 1px;
}


.ajm-uae-bottom i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #668ba2;
}


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

@media (max-width: 991px) {
    .ajm-uae-main {
        grid-template-columns: 1fr;
        gap: 65px;
    }

    .ajm-uae-content h2 {
        font-size: 62px;
    }

    .ajm-uae-image {
        max-width: 650px;
        width: 100%;
        margin: auto;
    }

}


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

@media (max-width: 767px) {
    .ajm-uae-buying {
        padding-top: 75px;
    }

    .ajm-uae-location {
        display: none;
    }

    .ajm-uae-main {
        padding: 55px 0 70px;
        gap: 50px;
    }

    .ajm-uae-content h2 {
        font-size: 47px;
        letter-spacing: -2.8px;
    }

    .ajm-uae-intro {
        font-size: 11px;
        margin-top: 28px;
    }

    .ajm-uae-materials {
        grid-template-columns: 1fr;
        max-width: none;
    }

    .ajm-uae-material {
        min-height: 105px;
        border-right: 0;
        border-bottom: 1px solid #d7dde1;
    }

    .ajm-uae-material:last-child {
        border-bottom: 0;
    }

    .ajm-uae-image {
        padding: 0;
    }

    .ajm-uae-image-frame {
        min-height: 400px;
    }

    .ajm-uae-image-frame img {
        height: 400px;
    }

    .ajm-uae-stat {
        right: -8px;
        top: 25px;
        width: 95px;
        height: 105px;
    }

    .ajm-uae-stat strong {
        font-size: 34px;
    }

    .ajm-uae-image-label {
        left: 25px;
        bottom: 25px;
    }

    .ajm-uae-bottom {
        justify-content: flex-start;
        flex-wrap: wrap;
        padding: 20px 5px;
        line-height: 1.6;
    }

}

/* =========================================================
   AJM LOCATION SECTION
   UAE SCRAP BUYING
========================================================= */

.ajm-location-section {
    position: relative;
    padding: 120px 0 0;
    color: #ffffff;
    background:
        linear-gradient(135deg,
            #243F55 0%,
            #315D73 50%,
            #23485D 100%);
    overflow: hidden;
}

.ajm-location-section {
    position: relative;
    padding: 120px 0 0;
    color: #ffffff;
    overflow: hidden;
    background:
        radial-gradient(circle at 85% 20%,
            rgba(214, 168, 79, 0.16) 0%,
            rgba(214, 168, 79, 0.05) 18%,
            transparent 38%),
        radial-gradient(circle at 10% 80%,
            rgba(63, 126, 166, 0.20) 0%,
            transparent 35%),
        linear-gradient(135deg,
            #071A2B 0%,
            #0B2A43 45%,
            #123D5A 72%,
            #0A263C 100%);
}

.ajm-location-section::before {
    content: "";
    position: absolute;
    width: 700px;
    height: 700px;
    top: -350px;
    right: -200px;
    background: radial-gradient(circle,
            rgba(214, 168, 79, 0.10) 0%,
            rgba(214, 168, 79, 0.035) 25%,
            transparent 65%);
    animation: ajmLocationGlow 10s ease-in-out infinite alternate;
    pointer-events: none;
}

@keyframes ajmLocationGlow {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: .65;
    }

    100% {
        transform: translate3d(-100px, 70px, 0) scale(1.15);
        opacity: 1;
    }

}

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

.ajm-location-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}


/* =========================================================
   TECHNICAL GRID
========================================================= */

.ajm-location-grid {
    position: absolute;
    width: 150%;
    height: 150%;
    left: -25%;
    top: -25%;
    opacity: 0.07;
    background-image:
        linear-gradient(rgba(150, 200, 225, 0.5) 1px,
            transparent 1px),
        linear-gradient(90deg,
            rgba(150, 200, 225, 0.5) 1px,
            transparent 1px);
    background-size: 65px 65px;
    transform:
        perspective(900px) rotateX(60deg) scale(1.3);
    transform-origin: center bottom;
    animation:
        ajmLocationGridMove 20s linear infinite;
}


@keyframes ajmLocationGridMove {
    0% {
        background-position:
            0 0,
            0 0;
    }

    100% {
        background-position:
            0 130px,
            130px 0;
    }

}


/* =========================================================
   GLOW
========================================================= */

.ajm-location-glow {
    position: absolute;
    width: 650px;
    height: 650px;
    right: -300px;
    top: -250px;
    border-radius: 50%;
    background:
        radial-gradient(circle,
            rgba(69, 160, 211, 0.28) 0%,
            rgba(69, 160, 211, 0.08) 35%,
            transparent 70%);
    filter: blur(10px);
    animation:
        ajmLocationGlow 8s ease-in-out infinite;
}


@keyframes ajmLocationGlow {

    0%,
    100% {
        transform: scale(0.9);
        opacity: 0.55;
    }

    50% {
        transform: scale(1.12);
        opacity: 1;
    }

}


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

.ajm-location-ring {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(130, 195, 225, 0.13);
}


.ring-one {
    width: 720px;
    height: 720px;
    right: -370px;
    top: -340px;
    animation:
        ajmLocationRotate 28s linear infinite;
}


.ring-two {
    width: 480px;
    height: 480px;
    right: -245px;
    top: -215px;
    border-style: dashed;
    animation:
        ajmLocationRotate 19s linear infinite reverse;
}


@keyframes ajmLocationRotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   HUGE UAE
========================================================= */

.ajm-location-word {
    position: absolute;
    right: -50px;
    bottom: -100px;
    color: rgba(255, 255, 255, 0.025);
    font-family: "Montserrat", sans-serif;
    font-size: 280px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -20px;
    user-select: none;
}


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

.ajm-location-header {
    position: relative;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 28px;
    border-bottom:
        1px solid rgba(255, 255, 255, 0.13);
}


.ajm-location-label {
    display: flex;
    align-items: center;
    gap: 13px;
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1.8px;
}


.ajm-location-label span {
    color: #82c8ed;
}


.ajm-location-label i {
    width: 40px;
    height: 1px;
    background: #668da4;
}


.ajm-location-label strong {
    color: #c9d9e2;
    font-weight: 600;
}


.ajm-location-header-right {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #7190a2;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 600;
    letter-spacing: 1.4px;
}


.ajm-location-header-right i {
    color: #82c8ed;
    font-size: 12px;
}


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

.ajm-location-main {
    position: relative;
    z-index: 5;
    display: grid;
    grid-template-columns: 0.92fr 1.08fr;
    gap: 85px;
    align-items: center;
    padding: 80px 0 95px;
}


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

.ajm-location-visual {
    position: relative;
    padding: 15px 20px 15px 0;
}


.ajm-location-image {
    position: relative;
    height: 610px;
    overflow: hidden;
    background: #102535;
    box-shadow:
        0 30px 70px rgba(0, 0, 0, 0.35);
}


.ajm-location-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition:
        transform 1s cubic-bezier(.2, .7, .2, 1);
}


.ajm-location-image:hover img {
    transform: scale(1.06);
}


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

.ajm-location-image-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg,
            rgba(3, 13, 23, 0.08) 15%,
            rgba(3, 13, 23, 0.15) 45%,
            rgba(3, 13, 23, 0.92) 100%);
}


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

.ajm-location-image-content {
    position: absolute;
    left: 35px;
    bottom: 35px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}


.ajm-location-image-content span {
    color: #8caabd;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 600;
    letter-spacing: 2px;
}


.ajm-location-image-content strong {
    color: #ffffff;
    font-family: "Montserrat", sans-serif;
    font-size: 38px;
    font-weight: 800;
    line-height: 0.88;
    letter-spacing: -1.5px;
}


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

.ajm-location-corners span {
    position: absolute;
    width: 30px;
    height: 30px;
    border-color:
        rgba(255, 255, 255, 0.55);
    border-style: solid;
}


.ajm-location-corners span:nth-child(1) {
    left: 18px;
    top: 18px;
    border-width: 1px 0 0 1px;
}


.ajm-location-corners span:nth-child(2) {
    right: 18px;
    top: 18px;
    border-width: 1px 1px 0 0;
}


.ajm-location-corners span:nth-child(3) {
    left: 18px;
    bottom: 18px;
    border-width: 0 0 1px 1px;
}


.ajm-location-corners span:nth-child(4) {
    right: 18px;
    bottom: 18px;
    border-width: 0 1px 1px 0;
}


/* =========================================================
   SCAN ANIMATION
========================================================= */

.ajm-location-scan {
    position: absolute;
    left: 0;
    top: -20%;
    width: 100%;
    height: 1px;
    background:
        linear-gradient(90deg,
            transparent,
            rgba(130, 200, 235, 0.65),
            transparent);
    box-shadow:
        0 0 15px rgba(130, 200, 235, 0.35);
    animation:
        ajmLocationScan 6s ease-in-out infinite;
}


@keyframes ajmLocationScan {
    0% {
        top: -10%;
        opacity: 0;
    }

    15% {
        opacity: 1;
    }

    85% {
        opacity: 1;
    }

    100% {
        top: 110%;
        opacity: 0;
    }

}


/* =========================================================
   FLOATING STAT
========================================================= */

.ajm-location-float {
    position: absolute;
    right: -5px;
    top: 55px;
    width: 120px;
    height: 130px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 22px;
    background: #82c8ed;
    box-shadow:
        0 20px 40px rgba(0, 0, 0, 0.3);
    animation:
        ajmLocationFloat 4s ease-in-out infinite;
}


.ajm-location-float span {
    color: #365a6e;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1.5px;
}


.ajm-location-float strong {
    color: #071522;
    font-family: "Montserrat", sans-serif;
    font-size: 46px;
    font-weight: 800;
    line-height: 1;
}


.ajm-location-float small {
    color: #45697c;
    font-family: "Montserrat", sans-serif;
    font-size: 6px;
    font-weight: 700;
    letter-spacing: 1px;
}


@keyframes ajmLocationFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }

}


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

.ajm-location-content {
    position: relative;
}


.ajm-location-heading>span {
    color: #82c8ed;
    font-family: "Montserrat", sans-serif;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 2px;
}


.ajm-location-heading h2 {
    margin: 13px 0 25px;
    color: #ffffff;
    font-family: "Montserrat", sans-serif;
    font-size: clamp(52px, 5vw, 72px);
    font-weight: 300;
    line-height: 0.9;
    letter-spacing: -4px;
}


.ajm-location-heading h2 strong {
   color: #b89472;
    font-weight: 600;
}


.ajm-location-description {
    max-width: 520px;
    margin: 0 0 35px;
    color: #8ea5b4;
    font-size: 10px;
    line-height: 1.9;
}


/* =========================================================
   LOCATION LIST
========================================================= */

.ajm-location-list {
    border-top:
        1px solid rgba(255, 255, 255, 0.12);
}


/* =========================================================
   LOCATION ITEM
========================================================= */

.ajm-location-item {
    position: relative;
    min-height: 67px;
    display: grid;
    grid-template-columns: 45px 1fr 40px;
    align-items: center;
    gap: 15px;
    padding: 0 12px;
    color: #ffffff;
    border-bottom:
        1px solid rgba(255, 255, 255, 0.10);
    overflow: hidden;
    transition:
        background 0.3s ease,
        padding 0.3s ease;
}


.ajm-location-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #82c8ed;
    transform: scaleY(0);
    transform-origin: bottom;
    transition:
        transform 0.3s ease;
}


.ajm-location-item:hover,
.ajm-location-item.active {
    color: #ffffff;
    background:
        rgba(130, 200, 235, 0.065);
    padding-left: 20px;
}


.ajm-location-item:hover::before,
.ajm-location-item.active::before {
    transform: scaleY(1);
}


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

.ajm-location-number {
    color: #587284;
    font-family: "Montserrat", sans-serif;
    font-size: 8px;
    font-weight: 700;
}


.ajm-location-item.active .ajm-location-number {
    color: #82c8ed;
}


/* =========================================================
   LOCATION NAME
========================================================= */

.ajm-location-item div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}


.ajm-location-item strong {
    color: #ffffff;
    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.2px;
}


.ajm-location-item small {
    color: #718a9a;
    font-size: 8px;
}


/* =========================================================
   ARROW
========================================================= */

.ajm-location-item>i {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #70899a;
    border:
        1px solid rgba(255, 255, 255, 0.10);
    font-size: 10px;
    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}


.ajm-location-item:hover>i,
.ajm-location-item.active>i {
    color: #071522;
    background: #82c8ed;
    transform:
        translate(2px, -2px);
}


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

.ajm-location-bottom {
    position: relative;
    z-index: 5;
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    border-top:
        1px solid rgba(255, 255, 255, 0.12);
    color: #617b8b;
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 600;
    letter-spacing: 1px;
}


.ajm-location-bottom i {
    width: 4px;
    height: 4px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #82c8ed;
    opacity: 0.7;
}


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

@media (max-width: 991px) {
    .ajm-location-main {
        grid-template-columns: 1fr;
        gap: 70px;
    }

    .ajm-location-visual {
        max-width: 650px;
        width: 100%;
        margin: auto;
    }

    .ajm-location-content {
        max-width: 700px;
        margin: auto;
    }

}


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

@media (max-width: 767px) {
    .ajm-location-section {
        padding-top: 75px;
    }

    .ajm-location-header-right {
        display: none;
    }

    .ajm-location-main {
        padding: 55px 0 70px;
        gap: 55px;
    }

    .ajm-location-image {
        height: 430px;
    }

    .ajm-location-image-content {
        left: 25px;
        bottom: 25px;
    }

    .ajm-location-image-content strong {
        font-size: 30px;
    }

    .ajm-location-float {
        right: -5px;
        top: 35px;
        width: 100px;
        height: 110px;
    }

    .ajm-location-float strong {
        font-size: 36px;
    }

    .ajm-location-heading h2 {
        font-size: 47px;
        letter-spacing: -3px;
    }

    .ajm-location-description {
        font-size: 10px;
        margin-bottom: 28px;
    }

    .ajm-location-item {
        min-height: 64px;
        grid-template-columns:
            38px 1fr 35px;
        gap: 10px;
    }

    .ajm-location-item strong {
        font-size: 12px;
    }

    .ajm-location-item small {
        font-size: 7px;
    }

    .ajm-location-bottom {
        justify-content: flex-start;
        flex-wrap: wrap;
        padding: 20px 5px;
        line-height: 1.5;
    }

    .ajm-location-word {
        font-size: 170px;
        right: -20px;
        bottom: 50px;
    }

}

/* =========================================================
   AJM — HOW WE WORK
========================================================= */

.ajm-process-section {
    position: relative;
    overflow: hidden;
    padding: 120px 0 110px;
    background:
        linear-gradient(135deg,
            #f7f9fa 0%,
            #eef2f4 48%,
            #f8fafb 100%);
    color: #173d65;

}


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

.ajm-process-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;

}


/* =========================================================
   TECH GRID
========================================================= */

.ajm-process-grid {
    position: absolute;
    inset: -100px;
    background-image:
        linear-gradient(rgba(9, 35, 55, .035) 1px,
            transparent 1px),
        linear-gradient(90deg,
            rgba(9, 35, 55, .035) 1px,
            transparent 1px);
    background-size: 65px 65px;
    transform: perspective(700px) rotateX(60deg);
    transform-origin: center bottom;
    animation:
        processGridMove 18s linear infinite;

}


@keyframes processGridMove {
    0% {
        background-position:
            0 0;
    }

    100% {
        background-position:
            0 65px;
    }

}


/* =========================================================
   FLOATING ORBS
========================================================= */

.ajm-orb {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(1px);
    opacity: .55;

}


/* GOLD ORB */

.orb-1 {
    width: 180px;
    height: 180px;
    right: 7%;
    top: 10%;
    background:
        radial-gradient(circle,
            rgba(184, 148, 114, .20) 0%,
            rgba(184, 148, 114, .08) 35%,
            transparent 70%);
    animation:
        floatingOrb1 9s ease-in-out infinite;

}


/* BLUE ORB */

.orb-2 {
    width: 260px;
    height: 260px;
    left: -80px;
    bottom: 5%;
    background:
        radial-gradient(circle,
            rgba(19, 91, 139, .13) 0%,
            rgba(19, 91, 139, .04) 40%,
            transparent 72%);
    animation:
        floatingOrb2 12s ease-in-out infinite;

}


/* SMALL ORB */

.orb-3 {
    width: 100px;
    height: 100px;
    right: 42%;
    bottom: 12%;
    background:
        radial-gradient(circle,
            rgba(184, 148, 114, .15),
            transparent 70%);
    animation:
        floatingOrb3 7s ease-in-out infinite;

}


@keyframes floatingOrb1 {

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

    50% {
        transform:
            translate3d(-45px, 35px, 0) scale(1.15);
    }

}


@keyframes floatingOrb2 {

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

    50% {
        transform:
            translate3d(80px, -35px, 0) scale(1.12);
    }

}


@keyframes floatingOrb3 {

    0%,
    100% {
        transform:
            translateY(0);
    }

    50% {
        transform:
            translateY(-35px);
    }

}


/* =========================================================
   LARGE ROTATING RINGS
========================================================= */

.ajm-ring {
    position: absolute;
    border: 1px solid rgba(19, 91, 139, .09);
    border-radius: 50%;

}


.ring-1 {
    width: 620px;
    height: 620px;
    right: -310px;
    top: -260px;
    animation:
        ringRotate 30s linear infinite;

}


.ring-2 {
    width: 380px;
    height: 380px;
    left: -190px;
    top: 35%;
    border-color:
        rgba(184, 148, 114, .12);
    animation:
        ringRotate 22s linear infinite reverse;

}


@keyframes ringRotate {
    from {
        transform:
            rotate(0deg);
    }

    to {
        transform:
            rotate(360deg);
    }

}


/* =========================================================
   FLOATING PARTICLES
========================================================= */

.ajm-particle {
    position: absolute;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #b89472;
    opacity: .45;
    box-shadow:
        0 0 12px rgba(184, 148, 114, .4);

}


.particle-1 {
    left: 12%;
    top: 25%;
    animation:
        particleMove1 8s ease-in-out infinite;

}


.particle-2 {
    left: 32%;
    top: 70%;
    animation:
        particleMove2 10s ease-in-out infinite;

}


.particle-3 {
    right: 15%;
    top: 35%;
    animation:
        particleMove3 7s ease-in-out infinite;

}


.particle-4 {
    right: 32%;
    bottom: 18%;
    animation:
        particleMove1 11s ease-in-out infinite reverse;

}


.particle-5 {
    left: 55%;
    top: 17%;
    animation:
        particleMove2 9s ease-in-out infinite reverse;

}


@keyframes particleMove1 {

    0%,
    100% {
        transform:
            translate(0, 0);
        opacity: .2;
    }

    50% {
        transform:
            translate(35px, -45px);
        opacity: .8;
    }

}


@keyframes particleMove2 {

    0%,
    100% {
        transform:
            translate(0, 0);
        opacity: .25;
    }

    50% {
        transform:
            translate(-40px, 30px);
        opacity: .7;
    }

}


@keyframes particleMove3 {

    0%,
    100% {
        transform:
            translate(0, 0);
        opacity: .2;
    }

    50% {
        transform:
            translate(-30px, -35px);
        opacity: .75;
    }

}


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

.process-heading {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns:
        220px 1fr;
    gap: 70px;
    padding-bottom: 65px;
    border-bottom:
        1px solid rgba(7, 21, 37, .10);

}


.process-label {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 13px;
    color: #667987;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.7px;

}


.process-label span {
    color: #b89472;

}


.process-label i {
    display: block;
    width: 38px;
    height: 1px;
    background: #b89472;

}


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

.process-heading-content {
    max-width: 820px;

}


.process-heading-content h2 {
    margin: 0;
    font-family:
        "Montserrat",
        "Arial",
        sans-serif;
    font-size:
        clamp(44px, 5vw, 70px);
    line-height: .98;
    letter-spacing: -3.5px;
    font-weight: 300;
    color: #173d65;

}


.process-heading-content h2 strong {
    display: block;
    color: #b89472;
    font-weight: 600;

}


.process-heading-content p {
    max-width: 590px;
    margin: 28px 0 0;
    color: #657784;
    font-size: 11px;
    line-height: 1.9;

}


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

.process-wrapper {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns:
        repeat(4, 1fr);
    padding: 75px 0 70px;

}


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

.process-line {
    position: absolute;
    top: 106px;
    left: 8%;
    right: 8%;
    height: 2px;
    background: #d9e0e4;
    overflow: hidden;

}


.process-line span {
    position: absolute;
    left: -20%;
    top: 0;
    width: 20%;
    height: 2px;
    background:
        linear-gradient(90deg,
            transparent,
            #b89472,
            #0d4f82,
            transparent);
    box-shadow:
        0 0 12px rgba(184, 148, 114, .45);
    animation:
        processLineAnimation 4s linear infinite;

}


@keyframes processLineAnimation {
    0% {
        left: -20%;
    }

    100% {
        left: 100%;
    }

}


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

.process-item {
    position: relative;
    padding: 0 25px;

}


/* =========================================================
   MARKER
========================================================= */

.process-marker {
    position: relative;
    width: 78px;
    height: 78px;
    margin-bottom: 28px;

}


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

.process-number {
    position: absolute;
    left: 0;
    top: 0;
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #ffffff;
    border:
        1px solid #d7dfe4;
    color: #b89472;
    font-family:
        "Montserrat",
        sans-serif;
    font-size: 13px;
    font-weight: 800;
    z-index: 2;
    box-shadow:
        0 10px 28px rgba(7, 21, 37, .08);
    transition:
        .4s ease;

}


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

.process-icon {
    position: absolute;
    z-index: 4;
    right: 0;
    bottom: 2px;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #0d4f82;
    border:
        3px solid #f4f6f7;
    color: #ffffff;
    font-size: 12px;
    box-shadow:
        0 6px 16px rgba(13, 79, 130, .25);
    transition:
        .4s ease;

}


/* =========================================================
   HOVER MARKER
========================================================= */

.process-item:hover .process-number {
    background: #0d4f82;
    border-color: #0d4f82;
    color: #ffffff;
    transform:
        translateY(-5px);
    box-shadow:
        0 15px 30px rgba(13, 79, 130, .22);

}


.process-item:hover .process-icon {
    background: #b89472;
    color: #173d65;
    transform:
        rotate(12deg) scale(1.08);

}


/* =========================================================
   GOLD PULSE
========================================================= */

.process-item:hover .process-marker::after {
    content: "";
    position: absolute;
    left: -5px;
    top: -5px;
    width: 72px;
    height: 72px;
    border:
        1px solid rgba(184, 148, 114, .5);
    border-radius: 50%;
    animation:
        markerPulse 1.4s ease-out infinite;

}


@keyframes markerPulse {
    0% {
        transform: scale(.85);
        opacity: .8;
    }

    100% {
        transform: scale(1.35);
        opacity: 0;
    }

}


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

.process-content {
    padding-top: 2px;

}


.process-mini {
    display: block;
    margin-bottom: 10px;
    color: #a27f60;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1.5px;

}


.process-content h3 {
    margin: 0 0 13px;
    color: #173d65;
    font-family:
        "Montserrat",
        sans-serif;
    font-size: 18px;
    font-weight: 750;
    letter-spacing: -.4px;

}


.process-content p {
    max-width: 230px;
    margin: 0;
    color: #6a7c87;
    font-size: 9px;
    line-height: 1.85;

}


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

.process-bottom {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 27px 30px;
    background: #173d65;
    border-left:
        4px solid #b89472;
    box-shadow:
        0 20px 45px rgba(7, 21, 37, .10);

}


.process-bottom-text span {
    display: block;
    margin-bottom: 7px;
    color: #b89472;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1.5px;

}


.process-bottom-text h3 {
    margin: 0;
    color: #ffffff;
    font-size: 15px;
    font-weight: 500;

}


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

.process-button {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 8px 8px 8px 20px;
    background: #b89472;
    color: #173d65;
    text-decoration: none;
    font-size: 9px;
    font-weight: 800;
    transition:
        .35s ease;

}


.process-button i {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #173d65;
    color: #ffffff;
    font-size: 11px;

}


.process-button:hover {
    background: #0d4f82;
    color: #ffffff;
    transform:
        translateY(-2px);

}


.process-button:hover i {
    background: #b89472;
    color: #173d65;

}


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

@media (max-width: 991px) {
    .process-heading {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .process-wrapper {
        grid-template-columns:
            repeat(2, 1fr);
        gap: 65px 0;
    }

    .process-line {
        display: none;
    }

}


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

@media (max-width: 767px) {
    .ajm-process-section {
        padding:
            80px 0;
    }

    .process-heading {
        padding-bottom: 45px;
    }

    .process-heading-content h2 {
        font-size: 43px;
        letter-spacing: -2.5px;
    }

    .process-wrapper {
        display: block;
        padding:
            55px 0 40px;
    }

    .process-item {
        padding:
            0 0 50px;
    }

    .process-marker {
        margin-bottom: 25px;
    }

    .process-content p {
        max-width: 100%;
    }

    .process-bottom {
        flex-direction: column;
        align-items: flex-start;
    }

    .process-button {
        width: 100%;
        justify-content: space-between;
    }

    .ring-1 {
        width: 400px;
        height: 400px;
        right: -200px;
    }

    .ring-2 {
        width: 280px;
        height: 280px;
        left: -140px;
    }

}

/* =========================================================
   AJM — INDUSTRIES SECTION
========================================================= */

.ajm-industries {
    position: relative;
    overflow: hidden;
    padding: 125px 0 120px;
    background: #f5f6f7;
    color: #173d65;

}


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

.industries-watermark {
    position: absolute;
    top: 35px;
    right: -30px;
    font-family:
        "Montserrat",
        sans-serif;
    font-size:
        clamp(100px, 16vw, 250px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -12px;
    color: rgba(7, 21, 37, .025);
    pointer-events: none;
    user-select: none;

}


/* =========================================================
   TECHNICAL BACKGROUND LINES
========================================================= */

.industry-tech-lines {
    position: absolute;
    inset: 0;
    pointer-events: none;

}


.industry-tech-lines span {
    position: absolute;
    height: 1px;
    background:
        linear-gradient(90deg,
            transparent,
            rgba(7, 21, 37, .07),
            transparent);

}


.industry-tech-lines span:nth-child(1) {
    width: 55%;
    top: 23%;
    left: 0;

}


.industry-tech-lines span:nth-child(2) {
    width: 40%;
    top: 67%;
    right: 0;

}


.industry-tech-lines span:nth-child(3) {
    width: 25%;
    bottom: 13%;
    left: 10%;

}


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

.industries-intro {
    position: relative;
    z-index: 2;
    margin-bottom: 65px;

}


.industries-kicker {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 35px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 2px;
    color: #60717d;

}


.industries-kicker span {
    color: #a9835d;

}


.industries-kicker i {
    width: 45px;
    height: 1px;
    background: #a9835d;

}


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

.industries-intro-grid {
    display: grid;
    grid-template-columns:
        1.25fr .75fr;
    align-items: end;
    gap: 100px;

}


.industries-intro-grid h2 {
    margin: 0;
    max-width: 700px;
    font-family:
        "Montserrat",
        sans-serif;
    font-size:
        clamp(58px, 7vw, 75px);
    line-height: .86;
    letter-spacing: -6px;
    font-weight: 300;

}


.industries-intro-grid h2 strong {
    display: block;
   font-weight: 600;
    color: #b89472;

}


.industries-intro-copy {
    padding-bottom: 7px;

}


.intro-line {
    width: 50px;
    height: 3px;
    margin-bottom: 22px;
    background: #a9835d;

}


.industries-intro-copy p {
    max-width: 440px;
    margin: 0 0 22px;
    color: #687985;
    font-size: 13px;
    line-height: 1.8;

}


.intro-note {
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #a9835d;

}


/* =========================================================
   INDUSTRY GRID
========================================================= */

.industry-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns:
        1.15fr .85fr;
    gap: 16px;

}


/* =========================================================
   INDUSTRY CARD
========================================================= */

.industry-card {
    position: relative;
    display: block;
    height: 330px;
    overflow: hidden;
    text-decoration: none;
    background: #173d65;

}


.industry-card-large {
    height: 390px;

}


.industry-card-wide {
    height: 360px;

}


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

.industry-card-image {
    position: absolute;
    inset: 0;
    overflow: hidden;

}


.industry-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition:
        transform .9s cubic-bezier(.2, .7, .2, 1);

}


.industry-card:hover .industry-card-image img {
    transform:
        scale(1.08);

}


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

.industry-card-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg,
            rgba(7, 21, 37, .05) 10%,
            rgba(7, 21, 37, .25) 40%,
            rgba(7, 21, 37, .94) 100%);
    transition:
        background .4s ease;

}


.industry-card:hover .industry-card-overlay {
    background:
        linear-gradient(180deg,
            rgba(7, 21, 37, .15),
            rgba(7, 21, 37, .88));

}


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

.industry-card-content {
    position: absolute;
    inset:
        28px 30px 28px 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

}


.industry-index {
    align-self: flex-start;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border:
        1px solid rgba(255, 255, 255, .25);
    color: #ffffff;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1px;
    backdrop-filter:
        blur(5px);

}


.industry-category {
    display: block;
    margin-bottom: 9px;
    color: #c09a72;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1.8px;

}


.industry-card h3 {
    max-width: 430px;
    margin: 0;
    color: #ffffff;
    font-size: 26px;
    line-height: 1.05;
    letter-spacing: -.8px;
    font-weight: 650;

}


/* =========================================================
   ARROW
========================================================= */

.industry-arrow {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border:
        1px solid rgba(255, 255, 255, .25);
    color: #ffffff;
    font-size: 17px;
    transition:
        .35s ease;

}


.industry-card:hover .industry-arrow {
    background: #b89472;
    border-color: #b89472;
    color: #173d65;
    transform:
        rotate(45deg);

}

/* =========================================================
   INDUSTRY GRID — CLEAN PROFESSIONAL RHYTHM
========================================================= */

.industry-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    grid-template-rows: auto auto auto;
    column-gap: 16px;
    row-gap: 16px;

}


/* =========================================================
   CARD POSITIONS
========================================================= */

.industry-card:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
}

.industry-card:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
}

.industry-card:nth-child(3) {
    grid-column: 1;
    grid-row: 2;
}

.industry-card:nth-child(4) {
    grid-column: 2;
    grid-row: 2;
}

.industry-card:nth-child(5) {
    grid-column: 1;
    grid-row: 3;
}

.industry-card:nth-child(6) {
    grid-column: 2;
    grid-row: 3;
}


/* =========================================================
   CARD HEIGHTS
========================================================= */

.industry-card {
    position: relative;
    display: block;
    height: 350px;
    overflow: hidden;
    text-decoration: none;
    background: #173d65;

}


/* First row */

.industry-card:nth-child(1),
.industry-card:nth-child(2) {
    height: 350px;

}


/* Second row */

.industry-card:nth-child(3),
.industry-card:nth-child(4) {
    height: 400px;

}


/* Third row */

.industry-card:nth-child(5),
.industry-card:nth-child(6) {
    height: 350px;

}


/* =========================================================
   GOLD ACTIVE EDGE
========================================================= */

.industry-card::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 3px;
    background: #b89472;
    transition:
        width .5s ease;

}


.industry-card:hover::after {
    width: 100%;

}


/* =========================================================
   FOOTER STRIP
========================================================= */

.industries-footer {
    position: relative;
    z-index: 2;
    margin-top: 75px;

}


.industries-footer-line {
    width: 100%;
    height: 1px;
    background: #d8dde0;

}


.industries-footer-content {
    display: grid;
    grid-template-columns:
        180px 1fr auto;
    align-items: center;
    gap: 40px;
    padding-top: 28px;

}


.industries-footer-content>span {
    color: #a9835d;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.7px;

}


.industries-footer-content p {
    margin: 0;
    color: #6d7d87;
    font-size: 10px;
    line-height: 1.6;

}


.industries-footer-content a {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    color: #173d65;
    text-decoration: none;
    font-size: 10px;
    font-weight: 750;

}


.industries-footer-content a span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border:
        1px solid #c8ced2;
    transition:
        .3s ease;

}


.industries-footer-content a:hover span {
    background: #b89472;
    border-color: #b89472;
    transform:
        rotate(45deg);

}


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

@media (max-width: 991px) {
    .industries-intro-grid {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .industries-intro-grid h2 {
        font-size: 70px;
    }

    .industry-grid {
        grid-template-columns: 1fr 1fr;
    }

    .industry-card:nth-child(1),
    .industry-card:nth-child(2),
    .industry-card:nth-child(3),
    .industry-card:nth-child(4),
    .industry-card:nth-child(5),
    .industry-card:nth-child(6) {
        grid-column: auto;
        margin-top: 0;
    }

    .industry-card,
    .industry-card-large,
    .industry-card-wide {
        height: 320px;
    }

    .industries-footer-content {
        grid-template-columns: 1fr;
        gap: 18px;
    }

}


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

@media (max-width: 767px) {
    .ajm-industries {
        padding:
            85px 0;
    }

    .industries-watermark {
        font-size: 90px;
        top: 80px;
    }

    .industries-intro {
        margin-bottom: 45px;
    }

    .industries-intro-grid {
        gap: 35px;
    }

    .industries-intro-grid h2 {
        font-size: 54px;
        letter-spacing: -3.5px;
    }

    .industries-intro-copy p {
        font-size: 12px;
    }

    .industry-grid {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .industry-card,
    .industry-card-large,
    .industry-card-wide {
        width: 100%;
        height: 310px;
        margin: 0 !important;
    }

    .industry-card h3 {
        font-size: 23px;
    }

    .industries-footer {
        margin-top: 50px;
    }

}

/* =========================================================
   MOBILE INDUSTRY GRID
========================================================= */

@media (max-width: 767px) {
    .ajm-industries {
        padding: 85px 0;
    }

    .industries-watermark {
        font-size: 90px;
        top: 80px;
    }

    .industries-intro {
        margin-bottom: 45px;
    }

    .industries-intro-grid {
        gap: 35px;
    }

    .industries-intro-grid h2 {
        font-size: 54px;
        letter-spacing: -3.5px;
    }

    .industries-intro-copy p {
        font-size: 12px;
    }

    /* Clean mobile stack */
    .industry-grid {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .industry-card,
    .industry-card:nth-child(1),
    .industry-card:nth-child(2),
    .industry-card:nth-child(3),
    .industry-card:nth-child(4),
    .industry-card:nth-child(5),
    .industry-card:nth-child(6) {
        width: 100%;
        height: 310px;
        margin: 0;
    }

    .industry-card h3 {
        font-size: 23px;
    }

}

/* =========================================================
   AJM — WHY AJM GLOBAL
========================================================= */

.ajm-why {
    position: relative;
    overflow: hidden;
    padding: 75px 0 70px;
    background: #173d65;
    color: #ffffff;

}


/* =========================================================
   TECHNICAL GRID
========================================================= */

.why-bg-grid {
    position: absolute;
    inset: 0;
    opacity: .35;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255, 255, 255, .025) 1px,
            transparent 1px),
        linear-gradient(90deg,
            rgba(255, 255, 255, .025) 1px,
            transparent 1px);
    background-size:
        70px 70px;
    mask-image:
        linear-gradient(to bottom,
            transparent,
            #000 20%,
            #000 80%,
            transparent);

}


/* =========================================================
   ORBIT ANIMATION
========================================================= */

.why-orbit {
    position: absolute;
    border: 1px solid rgba(184, 148, 114, .13);
    border-radius: 50%;
    pointer-events: none;

}


.why-orbit-1 {
    width: 650px;
    height: 650px;
    right: -300px;
    top: -170px;
    animation:
        whyOrbitOne 18s linear infinite;

}


.why-orbit-2 {
    width: 430px;
    height: 430px;
    right: -190px;
    top: -60px;
    border-style: dashed;
    animation:
        whyOrbitTwo 14s linear infinite reverse;

}


.why-orbit-3 {
    width: 220px;
    height: 220px;
    right: -85px;
    top: 45px;
    animation:
        whyOrbitThree 9s linear infinite;

}


@keyframes whyOrbitOne {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


@keyframes whyOrbitTwo {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


@keyframes whyOrbitThree {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


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

.why-watermark {
    position: absolute;
    right: -40px;
    bottom: -120px;
    font-family:
        "Montserrat",
        sans-serif;
    font-size:
        clamp(250px, 34vw, 520px);
    font-weight: 900;
    line-height: .7;
    letter-spacing: -35px;
    color:
        rgba(255, 255, 255, .025);
    pointer-events: none;

}


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

.why-header {
    position: relative;
    z-index: 2;
    margin-bottom: 75px;

}


.why-kicker {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 10px;
    color: #8798a5;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 2px;

}


.why-kicker span {
    color: #c09a72;

}


.why-kicker i {
    width: 45px;
    height: 1px;
    background: #c09a72;

}


.why-heading-wrap {
    display: grid;
    grid-template-columns:
        1.15fr .85fr;
    align-items: end;
    gap: 100px;

}


.why-heading-wrap h2 {
    margin: 0;
    max-width: 750px;
    font-family:
        "Montserrat",
        sans-serif;
    font-size:
        clamp(55px, 7vw, 50px);
    line-height: .97;
    letter-spacing: -6px;
    font-weight: 200;

}


.why-heading-wrap h2 strong {
    display: block;
   font-weight: 600;
    color: #b89472;

}


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

.why-intro {
    padding-bottom: 5px;

}


.why-gold-line {
    display: block;
    width: 48px;
    height: 3px;
    margin-bottom: 22px;
    background: #b89472;

}


.why-intro p {
    max-width: 420px;
    margin: 0;
    color: #8fa0ad;
    font-size: 13px;
    line-height: 1.85;

}


/* =========================================================
   BENEFITS
========================================================= */

.why-benefits {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns:
        repeat(2, 1fr);
    border-top:
        1px solid rgba(255, 255, 255, .12);
    border-left:
        1px solid rgba(255, 255, 255, .12);

}


.why-benefit {
    position: relative;
    min-height: 205px;
    padding: 32px 35px;
    display: grid;
    grid-template-columns:
        50px 1fr;
    gap: 25px;
    border-right:
        1px solid rgba(255, 255, 255, .12);
    border-bottom:
        1px solid rgba(255, 255, 255, .12);
    transition:
        background .4s ease;

}


.why-benefit:hover {
    background:
        rgba(184, 148, 114, .07);

}


.why-benefit-number {
    color: #b89472;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;

}


.why-benefit-content h3 {
    max-width: 280px;
    margin: 0 0 17px;
    font-size: 25px;
    line-height: 1.05;
    letter-spacing: -.7px;
    font-weight: 650;

}


.why-benefit-content p {
    max-width: 360px;
    margin: 0;
    color: #7f919e;
    font-size: 11px;
    line-height: 1.75;

}


.why-benefit-arrow {
    position: absolute;
    right: 28px;
    top: 28px;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border:
        1px solid rgba(255, 255, 255, .15);
    color: #ffffff;
    font-size: 15px;
    transition:
        .35s ease;

}


.why-benefit:hover .why-benefit-arrow {
    background: #b89472;
    border-color: #b89472;
    color: #173d65;
    transform:
        rotate(45deg);

}


/* =========================================================
   STATISTICS
========================================================= */

.why-stats {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns:
        .8fr .8fr .8fr 1.4fr;
    margin-top: 70px;
    border-top:
        1px solid rgba(255, 255, 255, .15);

}


.why-stat {
    min-height: 125px;
    padding:
        30px 25px;
    border-right:
        1px solid rgba(255, 255, 255, .12);

}


.why-stat:first-child {
    padding-left: 0;

}


.why-stat strong {
    display: block;
    margin-bottom: 8px;
    color: #ffffff;
    font-family:
        "Montserrat",
        sans-serif;
    font-size: 42px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -2px;

}


.why-stat span {
    color: #718491;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.5px;

}


/* =========================================================
   CTA STAT
========================================================= */

.why-stat-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    border-right: 0;

}


.why-stat-cta>span {
    color: #b89472;

}


.why-stat-cta a {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    color: #ffffff;
    text-decoration: none;
    font-size: 11px;
    font-weight: 700;

}


.why-stat-cta a b {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border:
        1px solid rgba(255, 255, 255, .25);
    font-size: 15px;
    font-weight: 400;
    transition:
        .3s ease;

}


.why-stat-cta a:hover b {
    background: #b89472;
    border-color: #b89472;
    color: #173d65;
    transform:
        rotate(45deg);

}


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

@media (max-width: 991px) {
    .why-heading-wrap {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .why-heading-wrap h2 {
        font-size: 75px;
    }

    .why-stats {
        grid-template-columns:
            repeat(2, 1fr);
    }

    .why-stat {
        border-bottom:
            1px solid rgba(255, 255, 255, .12);
    }

    .why-stat-cta {
        border-right: 0;
    }

}


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

@media (max-width: 767px) {
    .ajm-why {
        padding: 90px 0 80px;
    }

    .why-watermark {
        font-size: 200px;
        bottom: -40px;
        right: -20px;
    }

    .why-heading-wrap {
        gap: 35px;
    }

    .why-heading-wrap h2 {
        font-size: 53px;
        letter-spacing: -3.5px;
    }

    .why-intro p {
        font-size: 12px;
    }

    .why-benefits {
        grid-template-columns: 1fr;
    }

    .why-benefit {
        min-height: 220px;
        padding: 28px 25px;
        grid-template-columns:
            40px 1fr;
    }

    .why-benefit-content h3 {
        font-size: 22px;
    }

    .why-stats {
        grid-template-columns:
            1fr 1fr;
        margin-top: 50px;
    }

    .why-stat {
        min-height: 105px;
        padding: 25px 15px;
    }

    .why-stat:first-child {
        padding-left: 0;
    }

    .why-stat strong {
        font-size: 34px;
    }

    .why-stat-cta {
        grid-column: 1 / -1;
        padding-left: 0;
    }

}

/* =========================================================
   AJM — SELL YOUR SCRAP CTA
========================================================= */

.ajm-cta {
    position: relative;
    overflow: hidden;
    padding: 125px 0 0;
    background: #f3f1ed;
    color: #173d65;

}


/* =========================================================
   TECHNICAL GRID
========================================================= */

.cta-grid {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .45;
    background-image:
        linear-gradient(rgba(7, 21, 37, .035) 1px,
            transparent 1px),
        linear-gradient(90deg,
            rgba(7, 21, 37, .035) 1px,
            transparent 1px);
    background-size: 65px 65px;

}


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

.cta-circle {
    position: absolute;
    border: 1px solid rgba(184, 148, 114, .20);
    border-radius: 50%;
    pointer-events: none;

}


.cta-circle-1 {
    width: 600px;
    height: 600px;
    right: -300px;
    top: -170px;
    animation:
        ctaCircleRotate 22s linear infinite;

}


.cta-circle-2 {
    width: 360px;
    height: 360px;
    right: -180px;
    top: -50px;
    border-style: dashed;
    animation:
        ctaCircleRotate 15s linear infinite reverse;

}


@keyframes ctaCircleRotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


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

.cta-watermark {
    position: absolute;
    right: -30px;
    bottom: 35px;
    font-family:
        "Montserrat",
        sans-serif;
    font-size:
        clamp(180px, 25vw, 390px);
    line-height: .65;
    font-weight: 900;
    letter-spacing: -20px;
    color:
        rgba(7, 21, 37, .025);
    pointer-events: none;

}


/* =========================================================
   MAIN CTA
========================================================= */

.cta-main {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns:
        1fr .85fr;
    align-items: center;
    gap: 90px;
    padding-bottom: 100px;

}


/* =========================================================
   KICKER
========================================================= */

.cta-kicker {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 34px;
    color: #71808a;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 2px;

}


.cta-kicker span {
    color: #a9835d;

}


.cta-kicker i {
    width: 48px;
    height: 1px;
    background: #a9835d;

}


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

.cta-content h2 {
    max-width: 720px;
    margin: 0;
    font-family:
        "Montserrat",
        sans-serif;
    font-size:
        clamp(58px, 7vw, 75px);
    line-height: .87;
    letter-spacing: -6px;
    font-weight: 300;

}


.cta-content h2 strong {
    display: block;
    font-weight: 600;
    color: #b89472;


}


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

.cta-description {
    max-width: 530px;
    margin:
        35px 0 35px;
    color: #687781;
    font-size: 13px;
    line-height: 1.85;

}


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

.cta-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 25px;

}


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

.cta-primary {
    display: inline-flex;
    align-items: center;
    gap: 25px;
    padding:
        18px 20px 18px 25px;
    background: #173d65;
    color: #ffffff;
    text-decoration: none;
    font-size: 11px;
    font-weight: 750;
    transition:
        .35s ease;

}


.cta-primary span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: #b89472;
    color: #173d65;
    font-size: 16px;
    transition:
        .35s ease;

}


.cta-primary:hover {
    background: #10263a;
    color: #ffffff;

}


.cta-primary:hover span {
    transform:
        rotate(45deg);

}


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

.cta-phone {
    display: flex;
    align-items: center;
    gap: 13px;
    color: #173d65;
    text-decoration: none;

}


.phone-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    border:
        1px solid #c9c4bc;
    font-size: 15px;

}


.cta-phone small {
    display: block;
    margin-bottom: 4px;
    color: #89949a;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1.5px;

}


.cta-phone strong {
    font-size: 11px;
    font-weight: 750;

}


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

.cta-visual {
    position: relative;

}


.cta-visual-frame {
    position: relative;
    height: 530px;
    overflow: hidden;
    background: #173d65;

}


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

.cta-image {
    position: absolute;
    inset: 0;

}


.cta-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition:
        transform 1s cubic-bezier(.2, .7, .2, 1);

}


.cta-visual-frame:hover .cta-image img {
    transform:
        scale(1.06);

}


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

.cta-image-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg,
            rgba(7, 21, 37, .08),
            rgba(7, 21, 37, .82));

}


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

.cta-visual-label {
    position: absolute;
    left: 30px;
    bottom: 30px;
    color: #ffffff;

}


.cta-visual-label span {
    display: block;
    margin-bottom: 10px;
    color: #c09a72;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 2px;

}


.cta-visual-label strong {
    font-family:
        "Montserrat",
        sans-serif;
    font-size: 32px;
    line-height: .9;
    letter-spacing: -1px;

}


/* =========================================================
   CORNER MARKS
========================================================= */

.cta-corner {
    position: absolute;
    width: 45px;
    height: 45px;

}


.cta-corner-tl {
    top: 25px;
    left: 25px;
    border-top:
        1px solid rgba(255, 255, 255, .55);
    border-left:
        1px solid rgba(255, 255, 255, .55);

}


.cta-corner-br {
    right: 25px;
    bottom: 25px;
    border-right:
        1px solid rgba(255, 255, 255, .55);
    border-bottom:
        1px solid rgba(255, 255, 255, .55);

}


/* =========================================================
   FLOATING BADGE
========================================================= */

.cta-badge {
    position: absolute;
    right: -35px;
    top: 70px;
    width: 130px;
    height: 130px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #b89472;
    color: #173d65;
    text-align: center;
    border-radius: 50%;
    box-shadow:
        0 20px 50px rgba(7, 21, 37, .18);
    animation:
        ctaBadgeFloat 4s ease-in-out infinite;

}


@keyframes ctaBadgeFloat {

    0%,
    100% {
        transform:
            translateY(0);
    }

    50% {
        transform:
            translateY(-10px);
    }

}


.cta-badge span {
    margin-bottom: 5px;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: 2px;

}


.cta-badge strong {
    font-size: 14px;
    line-height: 1;
    letter-spacing: -.3px;

}


/* =========================================================
   SERVICE STRIP
========================================================= */

.cta-services {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns:
        repeat(5, 1fr);
    border-top:
        1px solid #d6d2cc;

}


.cta-service {
    min-height: 100px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
    padding:
        20px 25px;
    border-right:
        1px solid #d6d2cc;
    transition:
        background .3s ease;

}


.cta-service:last-child {
    border-right: 0;

}


.cta-service:hover {
    background:
        rgba(184, 148, 114, .08);

}


.cta-service span {
    color: #a9835d;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1px;

}


.cta-service strong {
    color: #173d65;
    font-size: 10px;
    font-weight: 700;

}


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

@media (max-width: 991px) {
    .cta-main {
        grid-template-columns: 1fr;
        gap: 65px;
    }

    .cta-content h2 {
        font-size: 75px;
    }

    .cta-visual {
        max-width: 650px;
    }

    .cta-services {
        grid-template-columns:
            repeat(3, 1fr);
    }

    .cta-service:nth-child(3) {
        border-right: 0;
    }

}


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

@media (max-width: 767px) {
    .ajm-cta {
        padding-top: 85px;
    }

    .cta-main {
        padding-bottom: 75px;
        gap: 50px;
    }

    .cta-content h2 {
        font-size: 53px;
        letter-spacing: -3.5px;
    }

    .cta-description {
        font-size: 12px;
        margin:
            28px 0;
    }

    .cta-actions {
        align-items: flex-start;
        flex-direction: column;
        gap: 20px;
    }

    .cta-visual-frame {
        height: 390px;
    }

    .cta-badge {
        right: -15px;
        top: 30px;
        width: 100px;
        height: 100px;
    }

    .cta-badge strong {
        font-size: 11px;
    }

    .cta-visual-label strong {
        font-size: 27px;
    }

    .cta-services {
        grid-template-columns:
            1fr 1fr;
    }

    .cta-service {
        min-height: 90px;
    }

    .cta-service:nth-child(3) {
        border-right:
            1px solid #d6d2cc;
    }

    .cta-service:nth-child(even) {
        border-right: 0;
    }

    .cta-service:last-child {
        grid-column:
            1 / -1;
        border-right: 0;
    }

}

/* =========================================================
   AJM GLOBAL
   PREMIUM FOOTER
========================================================= */

.ajm-footer {
    position: relative;
    overflow: hidden;
    font-family:
        "Montserrat",
        "Inter",
        Arial,
        sans-serif;

}


/* =========================================================
   CTA SECTION
========================================================= */

.footer-main-cta {
    position: relative;
    overflow: hidden;
    padding: 95px 0;
    background:
        linear-gradient(135deg,
            #ffffff 0%,
            #f4f6f8 60%,
            #eef1f4 100%);

}


/* subtle technical lines */

.footer-main-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .55;
    background-image:
        linear-gradient(90deg,
            transparent 49.8%,
            rgba(8, 30, 50, .035) 50%,
            transparent 50.2%),
        linear-gradient(transparent 49.8%,
            rgba(8, 30, 50, .035) 50%,
            transparent 50.2%);
    background-size: 100px 100px;

}


/* =========================================================
   CTA DECORATIVE GOLD CIRCLE
========================================================= */

.footer-main-cta::after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    right: -170px;
    top: -180px;
    border:
        1px solid rgba(184, 148, 114, .25);
    border-radius: 50%;
    box-shadow:
        0 0 0 40px rgba(184, 148, 114, .035),
        0 0 0 80px rgba(184, 148, 114, .025);
    animation:
        footerCircle 12s ease-in-out infinite;

}


@keyframes footerCircle {

    0%,
    100% {
        transform: scale(1) rotate(0deg);
    }

    50% {
        transform: scale(1.08) rotate(12deg);
    }

}


/* =========================================================
   CTA LAYOUT
========================================================= */

.footer-cta-layout {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns:
        1.5fr .7fr;
    align-items: center;
    gap: 80px;

}


/* =========================================================
   CTA COPY
========================================================= */

.footer-kicker {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 25px;
    color: #b89472;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2.5px;

}


.footer-kicker::before {
    content: "";
    width: 35px;
    height: 2px;
    background: #b89472;

}


.footer-cta-copy h2 {
    max-width: 760px;
    margin: 0;
    color: #081c31;
    font-size:
        clamp(48px, 6vw, 82px);
    line-height: .92;
    font-weight: 300;
    letter-spacing: -4px;

}


.footer-cta-copy h2 span {
    display: block;
    color: #b89472;
    font-weight: 600;

}


.footer-cta-copy p {
    max-width: 620px;
    margin: 28px 0 0;
    color: #61707d;
    font-size: 13px;
    line-height: 1.9;

}


/* =========================================================
   CTA ACTION
========================================================= */

.footer-cta-action {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

}


.ajm-footer-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    min-width: 235px;
    padding: 7px 7px 7px 25px;
    background: #173d65;
    color: #ffffff;
    text-decoration: none;
    transition:
        transform .35s ease,
        box-shadow .35s ease;

}


.ajm-footer-button:hover {
    color: #ffffff;
    transform:
        translateY(-5px);
    box-shadow:
        0 18px 40px rgba(8, 23, 39, .18);

}


.button-text {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .4px;
    text-transform: uppercase;

}


.button-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: #b89472;
    color: #173d65;
    font-size: 20px;
    transition:
        transform .35s ease;

}


.ajm-footer-button:hover .button-arrow {
    transform:
        rotate(45deg);

}


.footer-cta-note {
    margin-top: 14px;
    color: #8a969f;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;

}


/* =========================================================
   DARK FOOTER
========================================================= */

.footer-dark {
    position: relative;
    overflow: hidden;
    background: #173d65;
    color: #ffffff;

}


/* =========================================================
   LARGE BACKGROUND TEXT
========================================================= */

.footer-dark::before {
    content: "AJM";
    position: absolute;
    right: -30px;
    bottom: -130px;
    color: rgba(255, 255, 255, .018);
    font-size: 420px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -35px;
    pointer-events: none;

}


/* =========================================================
   ORBIT ANIMATION
========================================================= */

.ajm-footer-orbit {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;

}


.orbit-one {
    width: 600px;
    height: 600px;
    right: -300px;
    top: 40px;
    border:
        1px solid rgba(184, 148, 114, .11);
    animation:
        orbitRotate 20s linear infinite;

}


.orbit-two {
    width: 460px;
    height: 460px;
    right: -230px;
    top: 110px;
    border:
        1px dashed rgba(255, 255, 255, .08);
    animation:
        orbitRotate 30s linear infinite reverse;

}


.orbit-three {
    width: 320px;
    height: 320px;
    right: -160px;
    top: 180px;
    border:
        1px solid rgba(184, 148, 114, .12);
    animation:
        orbitRotate 15s linear infinite;

}


@keyframes orbitRotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   PARTICLES
========================================================= */

.footer-particle {
    position: absolute;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #b89472;
    opacity: .6;
    animation:
        particleFloat 7s ease-in-out infinite;

}


.particle-1 {
    top: 18%;
    left: 12%;
    animation-delay: 0s;
}

.particle-2 {
    top: 55%;
    left: 30%;
    animation-delay: 2s;
}

.particle-3 {
    top: 25%;
    right: 25%;
    animation-delay: 1s;
}

.particle-4 {
    bottom: 22%;
    left: 50%;
    animation-delay: 3s;
}

.particle-5 {
    bottom: 12%;
    right: 15%;
    animation-delay: 4s;
}


@keyframes particleFloat {

    0%,
    100% {
        transform:
            translate(0, 0) scale(1);
        opacity: .25;
    }

    50% {
        transform:
            translate(20px, -25px) scale(1.7);
        opacity: .9;
    }

}


/* =========================================================
   FOOTER TOP
========================================================= */

.footer-top {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    padding:
        75px 0 55px;
    border-bottom:
        1px solid rgba(255, 255, 255, .08);

}


.footer-logo-link {
    display: inline-block;
    margin-bottom: 20px;

}


.footer-logo-link img {
    width: 190px;
    height: auto;
    display: block;

}


.footer-brand-block p {
    max-width: 470px;
    margin: 0;
    color: #71818e;
    font-size: 11px;
    line-height: 1.9;

}


.footer-tagline {
    text-align: right;

}


.footer-tagline span {
    display: block;
    margin-bottom: 6px;
    color: #71818e;
    font-size: 8px;
    letter-spacing: 2px;

}


.footer-tagline strong {
    color: #b89472;
    font-size: 10px;
    letter-spacing: 2px;

}


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

.footer-columns {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns:
        .8fr 1.5fr .8fr 1fr;
    gap: 55px;
    padding:
        65px 0;
    border-bottom:
        1px solid rgba(255, 255, 255, .08);

}


.footer-col {
    position: relative;

}


.footer-col-number {
    margin-bottom: 14px;
    color: #b89472;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1px;

}


.footer-col h3 {
    margin: 0 0 25px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;

}


.footer-col ul {
    margin: 0;
    padding: 0;
    list-style: none;

}


.footer-col ul li {
    margin-bottom: 12px;

}


.footer-col ul li a {
    color: #def0ff;
    text-decoration: none;
    font-size: 12px;
    transition: color .25s ease, padding-left .25s ease;
}


.footer-col ul li a:hover {
    padding-left: 8px;
    color: #ffffff;
    color: #b89472;
    transform:
        translateX(5px);

}


/* =========================================================
   SCRAP GRID
========================================================= */

.footer-scrap-grid {
    display: grid;
    grid-template-columns:
        1fr 1fr;
    gap:
        11px 25px;

}


.footer-scrap-grid a {
    color: #def0ff;
    text-decoration: none;
    font-size: 12px;
    transition: color .25s ease, padding-left .25s ease;

}


.footer-scrap-grid a:hover {
    color: #b89472;
    transform:
        translateX(5px);

}


.footer-more-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-top: 25px;
    color: #b89472;
    text-decoration: none;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;

}


.footer-more-link span {
    font-size: 16px;
    transition:
        transform .25s ease;

}


.footer-more-link:hover {
    color: #d2ad88;

}


.footer-more-link:hover span {
    transform:
        translateX(6px);

}


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

.footer-contact-row {
    margin-bottom: 22px;

}


.footer-contact-row>span {
    display: block;
    margin-bottom: 7px;
    color: #b89472;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1.8px;

}


.footer-contact-row a {
    color: #ffffff;
    text-decoration: none;
    font-size: 11px;
    font-weight: 600;

}


.footer-contact-row p {
    margin: 0;
    color: #7e8c97;
    font-size: 10px;
    line-height: 1.8;

}


/* =========================================================
   UAE NETWORK
========================================================= */

.footer-network {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding:
        28px 0;
    border-bottom:
        1px solid rgba(255, 255, 255, .08);

}


.network-title {
    display: flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
    color: #ffffff;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.5px;

}


.network-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #b89472;
    box-shadow:
        0 0 0 5px rgba(184, 148, 114, .08);
    animation:
        networkPulse 2s ease-in-out infinite;

}


@keyframes networkPulse {

    0%,
    100% {
        box-shadow:
            0 0 0 4px rgba(184, 148, 114, .06);
    }

    50% {
        box-shadow:
            0 0 0 9px rgba(184, 148, 114, .02);
    }

}


.network-locations {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 12px;

}


.network-locations span {
    color: #687883;
    font-size: 8px;
    font-weight: 700;

}


.network-locations i {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #b89472;

}


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

.footer-bottom {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns:
        1fr auto 1fr;
    align-items: center;
    gap: 25px;
    min-height: 75px;
    color: #b89472;
    font-size: 12px;

}


.footer-bottom-links {
    display: flex;
    align-items: center;
    gap: 10px;

}


.footer-bottom-links a {
    color: #ffffff;
    text-decoration: none;
    transition:
        color .25s ease;

}


.footer-bottom-links a:hover {
    color: #b89472;

}


.footer-bottom-links span {
    color: #b89472;

}


.footer-bottom-brand {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    color: #596b77;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1.5px;

}


.footer-bottom-brand b {
    width: 25px;
    height: 1px;
    background: #b89472;

}


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

@media (max-width: 991px) {
    .footer-cta-layout {
        grid-template-columns:
            1fr;
        gap: 40px;
    }

    .footer-columns {
        grid-template-columns:
            1fr 1.5fr;
        gap: 50px;
    }

    .footer-network {
        align-items: flex-start;
        flex-direction: column;
    }

    .network-locations {
        justify-content: flex-start;
    }

    .footer-bottom {
        grid-template-columns:
            1fr 1fr;
    }

    .footer-bottom-brand {
        display: none;
    }

}


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

@media (max-width: 767px) {
    .footer-main-cta {
        padding:
            70px 0;
    }

    .footer-cta-copy h2 {
        font-size: 48px;
        letter-spacing: -3px;
    }

    .footer-cta-copy p {
        font-size: 11px;
    }

    .footer-cta-action {
        align-items: flex-start;
    }

    .footer-top {
        align-items: flex-start;
        flex-direction: column;
        gap: 30px;
        padding:
            55px 0 45px;
    }

    .footer-tagline {
        text-align: left;
    }

    .footer-logo-link img {
        width: 165px;
    }

    .footer-columns {
        grid-template-columns:
            1fr;
        gap: 45px;
        padding:
            50px 0;
    }

    .footer-scrap-grid {
        grid-template-columns:
            1fr 1fr;
    }

    .footer-network {
        padding:
            25px 0;
    }

    .network-locations {
        gap: 10px;
    }

    .footer-bottom {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
        padding:
            25px 0;
    }

    .footer-bottom-links {
        flex-wrap: wrap;
    }

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

    .orbit-two {
        width: 280px;
        height: 280px;
        right: -190px;
    }

    .orbit-three {
        width: 210px;
        height: 210px;
        right: -155px;
    }

}




/* =========================================================
   COMMON SCRAP HERO
   Used across all scrap material pages
========================================================= */

.scrap-hero {

    position: relative;

    min-height: 350px;

    padding: 48px 0 0;

    color: #ffffff;

    background:

        radial-gradient(
            circle at 78% 20%,
            rgba(214, 168, 79, 0.10),
            transparent 30%
        ),

        linear-gradient(
            135deg,
            #071A2B 0%,
            #0B2A43 52%,
            #102F48 100%
        );

    overflow: hidden;
}


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

.scrap-hero-grid {

    position: absolute;

    inset: 0;

    background-image:

        linear-gradient(
            rgba(255, 255, 255, 0.025) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.025) 1px,
            transparent 1px
        );

    background-size: 70px 70px;

    mask-image:

        linear-gradient(
            to bottom,
            rgba(0, 0, 0, 0.65),
            transparent 90%
        );

    pointer-events: none;
}


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

.scrap-hero-glow {

    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    filter: blur(15px);
}


/* GOLD */

.scrap-hero-glow-one {

    width: 420px;

    height: 420px;

    top: -250px;

    right: -80px;

    background:

        radial-gradient(
            circle,
            rgba(214, 168, 79, 0.12),
            transparent 68%
        );

    animation:

        scrapGlowOne
        12s
        ease-in-out
        infinite
        alternate;
}


/* BLUE */

.scrap-hero-glow-two {

    width: 320px;

    height: 320px;

    bottom: -220px;

    left: -100px;

    background:

        radial-gradient(
            circle,
            rgba(68, 139, 181, 0.13),
            transparent 68%
        );

    animation:

        scrapGlowTwo
        15s
        ease-in-out
        infinite
        alternate;
}


/* =========================================================
   GLOW ANIMATIONS
========================================================= */

@keyframes scrapGlowOne {

    from {

        transform:
            translate3d(0, 0, 0)
            scale(1);

    }

    to {

        transform:
            translate3d(-50px, 60px, 0)
            scale(1.12);

    }

}


@keyframes scrapGlowTwo {

    from {

        transform:
            translate3d(0, 0, 0)
            scale(1);

    }

    to {

        transform:
            translate3d(70px, -40px, 0)
            scale(1.10);

    }

}


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

.scrap-hero-watermark {

    position: absolute;

    right: -30px;

    bottom: 10px;

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

    font-size: 150px;

    font-weight: 800;

    line-height: 1;

    letter-spacing: -7px;

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

    user-select: none;

    pointer-events: none;
}


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

.scrap-hero-main {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        1.08fr
        0.82fr;

    align-items: center;

    gap: 45px;
}


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

.scrap-hero-content {

    max-width: 700px;
}


/* =========================================================
   KICKER
========================================================= */

.scrap-hero-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 16px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.8px;

    color: #D6A84F;
}


.scrap-hero-kicker span {

    font-size: 12px;

    font-weight: 700;
}


.scrap-hero-kicker i {

    display: block;

    width: 35px;

    height: 1px;

    background: #D6A84F;

    opacity: 0.8;
}


/* =========================================================
   H1
========================================================= */

.scrap-hero h1 {

    margin: 0;

    max-width: 700px;

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

    font-size:
        clamp(
            34px,
            3.6vw,
            52px
        );

    font-weight: 700;

    line-height: 1.04;

    letter-spacing: -1.5px;

    color: #ffffff;
}


.scrap-hero h1 span {

    display: block;

    margin-top: 3px;

    font-weight: 500;

    color:
        rgba(255, 255, 255, 0.80);
}


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

.scrap-hero-intro {

    max-width: 650px;

    margin:
        17px 0 6px;

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

    font-size: 14px;

    font-weight: 400;

    line-height: 1.55;

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


.scrap-hero-intro strong {

    font-weight: 700;

    color: #ffffff;
}


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

.scrap-hero-description {

    max-width: 620px;

    margin: 0;

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

    font-size: 12px;

    font-weight: 400;

    line-height: 1.55;

    color:
        rgba(255, 255, 255, 0.52);
}


/* =========================================================
   QUICK POINTS
========================================================= */

.scrap-hero-points {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 20px;

    margin-top: 17px;
}


.scrap-hero-points div {

    display: flex;

    align-items: center;

    gap: 7px;

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

    font-size: 9px;

    font-weight: 600;

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


.scrap-hero-points i {

    font-size: 12px;

    color: #D6A84F;
}


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

.scrap-hero-visual {

    position: relative;

    height: 300px;

    display: flex;

    align-items: center;

    justify-content: center;
}


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

.scrap-hero-image-frame {

    position: relative;

    width: 100%;

    max-width: 470px;

    height: 300px;

    overflow: hidden;

    border-radius: 2px;

    background: #0A2236;

    box-shadow:

        0 20px 45px
        rgba(0, 0, 0, 0.30);
}


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

.scrap-hero-image-frame img {

    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover;

    transform: scale(1.02);

    transition:
        transform 0.9s ease;
}


.scrap-hero-image-frame:hover img {

    transform: scale(1.06);
}


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

.scrap-hero-image-overlay {

    position: absolute;

    inset: 0;

    background:

        linear-gradient(
            180deg,
            rgba(7, 26, 43, 0.02) 20%,
            rgba(7, 26, 43, 0.78) 100%
        );

    pointer-events: none;
}


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

.scrap-hero-image-label {

    position: absolute;

    left: 22px;

    bottom: 20px;

    z-index: 2;
}


.scrap-hero-image-label span {

    display: block;

    margin-bottom: 5px;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.8px;

    color: #D6A84F;
}


.scrap-hero-image-label strong {

    display: block;

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

    font-size: 25px;

    font-weight: 700;

    line-height: 0.95;

    letter-spacing: -0.8px;

    color: #ffffff;
}


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

.scrap-corner {

    position: absolute;

    z-index: 3;

    width: 38px;

    height: 38px;

    pointer-events: none;
}


.scrap-corner-tl {

    top: 13px;

    left: 13px;

    border-top:
        2px solid #D6A84F;

    border-left:
        2px solid #D6A84F;
}


.scrap-corner-br {

    right: 13px;

    bottom: 13px;

    border-right:
        2px solid #D6A84F;

    border-bottom:
        2px solid #D6A84F;
}


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

.scrap-hero-image-frame::after {

    content: "";

    position: absolute;

    top: 0;

    left: -120%;

    width: 55%;

    height: 100%;

    background:

        linear-gradient(
            90deg,
            transparent,
            rgba(255, 255, 255, 0.07),
            transparent
        );

    transform: skewX(-18deg);

    pointer-events: none;

    animation:
        scrapImageShine
        9s
        ease-in-out
        infinite;
}


@keyframes scrapImageShine {

    0% {

        left: -120%;

    }

    45% {

        left: 150%;

    }

    100% {

        left: 150%;

    }

}


/* =========================================================
   BOTTOM INFORMATION STRIP
========================================================= */

.scrap-hero-bottom {

    position: relative;

    z-index: 3;

    display: flex;

    align-items: center;

    width: 100%;

    margin-top: 28px;

    padding: 14px 0;

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


.scrap-hero-bottom > div {

    display: flex;

    align-items: center;

    gap: 8px;

    flex: 1;
}


.scrap-hero-bottom span {

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

    font-size: 9px;

    font-weight: 700;

    color: #D6A84F;
}


.scrap-hero-bottom strong {

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

    font-size: 8px;

    font-weight: 600;

    letter-spacing: 0.7px;

    color:
        rgba(255, 255, 255, 0.48);
}


.scrap-hero-bottom > i {

    display: block;

    width: 1px;

    height: 15px;

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


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

@media (max-width: 991px) {

    .scrap-hero {

        padding-top: 45px;
    }


    .scrap-hero-main {

        grid-template-columns: 1fr;

        gap: 30px;
    }


    .scrap-hero-content {

        max-width: 800px;
    }


    .scrap-hero h1 {

        max-width: 800px;
    }


    .scrap-hero-visual {

        height: 280px;
    }


    .scrap-hero-image-frame {

        max-width: 700px;

        height: 280px;
    }


    .scrap-hero-bottom {

        margin-top: 28px;
    }

}


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

@media (max-width: 767px) {

    .scrap-hero {

        padding-top: 40px;
    }


    /* Kicker */

    .scrap-hero-kicker {

        gap: 9px;

        margin-bottom: 15px;

        font-size: 8px;

        letter-spacing: 1.4px;
    }


    .scrap-hero-kicker span {

        font-size: 10px;
    }


    .scrap-hero-kicker i {

        width: 27px;
    }


    /* Heading */

    .scrap-hero h1 {

        font-size: 34px;

        line-height: 1.06;

        letter-spacing: -1px;
    }


    /* Text */

    .scrap-hero-intro {

        margin-top: 17px;

        font-size: 13px;

        line-height: 1.6;
    }


    .scrap-hero-description {

        font-size: 11px;

        line-height: 1.6;
    }


    /* Points */

    .scrap-hero-points {

        gap: 8px 16px;

        margin-top: 15px;
    }


    .scrap-hero-points div {

        font-size: 8px;
    }


    /* Image */

    .scrap-hero-visual {

        height: 240px;
    }


    .scrap-hero-image-frame {

        width: 100%;

        height: 240px;
    }


    .scrap-hero-image-label {

        left: 17px;

        bottom: 16px;
    }


    .scrap-hero-image-label span {

        font-size: 7px;
    }


    .scrap-hero-image-label strong {

        font-size: 22px;
    }


    /* Corners */

    .scrap-corner {

        width: 30px;

        height: 30px;
    }


    .scrap-corner-tl {

        top: 10px;

        left: 10px;
    }


    .scrap-corner-br {

        right: 10px;

        bottom: 10px;
    }


    /* Bottom */

    .scrap-hero-bottom {

        display: grid;

        grid-template-columns:
            1fr 1fr;

        gap: 10px 15px;

        margin-top: 22px;

        padding: 14px 0;
    }


    .scrap-hero-bottom > div {

        flex: none;
    }


    .scrap-hero-bottom > i {

        display: none;
    }


    .scrap-hero-bottom span {

        font-size: 8px;
    }


    .scrap-hero-bottom strong {

        font-size: 7px;

        letter-spacing: 0.4px;
    }


    /* Watermark */

    .scrap-hero-watermark {

        right: -20px;

        bottom: 80px;

        font-size: 90px;

        letter-spacing: -4px;
    }

}


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

@media (max-width: 480px) {

    .scrap-hero {

        padding-top: 35px;
    }


    .scrap-hero h1 {

        font-size: 31px;
    }


    .scrap-hero-intro {

        font-size: 12.5px;
    }


    .scrap-hero-description {

        font-size: 10.5px;
    }


    .scrap-hero-visual {

        height: 210px;
    }


    .scrap-hero-image-frame {

        height: 210px;
    }


    .scrap-hero-bottom {

        grid-template-columns: 1fr;
    }


    .scrap-hero-watermark {

        font-size: 70px;

        bottom: 100px;
    }

}


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

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

    .scrap-hero-glow-one,
    .scrap-hero-glow-two,
    .scrap-hero-image-frame::after {

        animation: none;
    }


    .scrap-hero-image-frame img {

        transition: none;
    }

}



/* =========================================================
   STEEL SCRAP TYPES
========================================================= */

.scrap-types-section {

    position: relative;

    padding: 100px 0;

    background: #F4F6F7;

    color: #102D42;

    overflow: hidden;
}


/* Background */

.scrap-types-bg {

    position: absolute;

    width: 500px;

    height: 500px;

    right: -220px;

    top: -200px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(214, 168, 79, 0.13),
            transparent 68%
        );

    pointer-events: none;
}


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

.scrap-types-header {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns: 0.45fr 1fr;

    gap: 70px;

    align-items: start;

    margin-bottom: 55px;
}


.scrap-types-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    padding-top: 8px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.7px;

    color: #315D73;
}


.scrap-types-kicker span {

    color: #C79A43;

    font-size: 12px;
}


.scrap-types-kicker i {

    width: 35px;

    height: 1px;

    background: #C79A43;
}


/* Heading */

.scrap-types-heading {

    max-width: 750px;
}


.scrap-types-heading h2 {

    margin: 0;

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

    font-size:
        clamp(32px, 4vw, 50px);

    line-height: 1.05;

    letter-spacing: -1.5px;

    font-weight: 600;

    color: #102D42;
}


.scrap-types-heading h2 strong {

    display: block;

    font-weight: 700;

    color: #315D73;
}


.scrap-types-heading p {

    max-width: 650px;

    margin: 18px 0 0;

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

    font-size: 14px;

    line-height: 1.7;

    color: #60717C;
}


/* =========================================================
   GRID
========================================================= */

.scrap-types-grid {

    position: relative;

    z-index: 2;

    display: grid;

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

    gap: 16px;
}


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

.scrap-type-card {

    position: relative;

    min-height: 255px;

    padding: 28px;

    background: #ffffff;

    border:
        1px solid
        rgba(16, 45, 66, 0.08);

    overflow: hidden;

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


.scrap-type-card::before {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 3px;

    height: 0;

    background: #D6A84F;

    transition:
        height 0.35s ease;
}


.scrap-type-card:hover {

    transform:
        translateY(-6px);

    border-color:
        rgba(214, 168, 79, 0.45);

    box-shadow:
        0 18px 40px
        rgba(16, 45, 66, 0.10);
}


.scrap-type-card:hover::before {

    height: 100%;
}


/* Number */

.scrap-type-number {

    position: absolute;

    top: 20px;

    right: 22px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1px;

    color:
        rgba(16, 45, 66, 0.25);
}


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

.scrap-type-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 48px;

    height: 48px;

    margin-bottom: 25px;

    border-radius: 50%;

    background:
        rgba(49, 93, 115, 0.08);

    color: #315D73;

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


.scrap-type-icon i {

    font-size: 20px;
}


.scrap-type-card:hover
.scrap-type-icon {

    background: #315D73;

    color: #D6A84F;

    transform:
        rotate(-5deg)
        scale(1.05);
}


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

.scrap-type-content {

    max-width: 330px;
}


.scrap-type-content h3 {

    margin: 0 0 10px;

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

    font-size: 18px;

    line-height: 1.25;

    font-weight: 700;

    color: #102D42;
}


.scrap-type-content p {

    margin: 0;

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

    font-size: 12px;

    line-height: 1.65;

    color: #6A7982;
}


/* Arrow */

.scrap-type-arrow {

    position: absolute;

    right: 25px;

    bottom: 22px;

    font-size: 18px;

    color:
        rgba(16, 45, 66, 0.25);

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}


.scrap-type-card:hover
.scrap-type-arrow {

    color: #D6A84F;

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


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

.scrap-types-bottom {

    position: relative;

    z-index: 2;

    display: grid;

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

    align-items: center;

    gap: 30px;

    margin-top: 35px;

    padding-top: 25px;

    border-top:
        1px solid
        rgba(16, 45, 66, 0.10);
}


.scrap-types-bottom-line {

    display: none;
}


.scrap-types-bottom p {

    margin: 0;

    font-size: 12px;

    line-height: 1.6;

    color: #60717C;
}


.scrap-types-bottom span {

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.2px;

    color: #315D73;

    white-space: nowrap;
}


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

@media (max-width: 991px) {

    .scrap-types-section {

        padding: 80px 0;
    }


    .scrap-types-header {

        grid-template-columns: 1fr;

        gap: 20px;

        margin-bottom: 40px;
    }


    .scrap-types-grid {

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


    .scrap-types-bottom {

        grid-template-columns: 1fr;

        gap: 12px;
    }

}


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

@media (max-width: 767px) {

    .scrap-types-section {

        padding: 65px 0;
    }


    .scrap-types-heading h2 {

        font-size: 34px;

        letter-spacing: -1px;
    }


    .scrap-types-heading p {

        font-size: 12px;

        line-height: 1.65;
    }


    .scrap-types-grid {

        grid-template-columns: 1fr;

        gap: 12px;
    }


    .scrap-type-card {

        min-height: 220px;

        padding: 24px;
    }


    .scrap-type-icon {

        margin-bottom: 20px;
    }


    .scrap-type-content h3 {

        font-size: 17px;
    }


    .scrap-type-content p {

        font-size: 11px;
    }


    .scrap-types-bottom span {

        white-space: normal;

        line-height: 1.6;
    }

}

/* =========================================================
   COMMON SCRAP PROCESS SECTION
========================================================= */

.scrap-process-section {

    position: relative;

    padding: 100px 0;

    background: #102D42;

    color: #ffffff;

    overflow: hidden;
}


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

.scrap-process-bg {

    position: absolute;

    inset: 0;

    background:

        radial-gradient(
            circle at 85% 20%,
            rgba(214, 168, 79, 0.10),
            transparent 28%
        ),

        linear-gradient(
            135deg,
            #102D42,
            #173D56
        );

    pointer-events: none;
}


.scrap-process-bg::after {

    content: "";

    position: absolute;

    width: 500px;

    height: 500px;

    right: -250px;

    bottom: -300px;

    border: 1px solid
        rgba(214, 168, 79, 0.10);

    border-radius: 50%;

    animation:
        scrapProcessOrbit
        18s
        linear
        infinite;
}


@keyframes scrapProcessOrbit {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


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

.scrap-process-header {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns: 0.55fr 1fr;

    gap: 70px;

    margin-bottom: 55px;
}


.scrap-process-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    padding-top: 8px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.7px;

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


.scrap-process-kicker span {

    color: #D6A84F;

    font-size: 12px;
}


.scrap-process-kicker i {

    width: 35px;

    height: 1px;

    background: #D6A84F;
}


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

.scrap-process-heading {

    max-width: 720px;
}


.scrap-process-heading h2 {

    margin: 0;

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

    font-size:
        clamp(32px, 4vw, 48px);

    font-weight: 500;

    line-height: 1.08;

    letter-spacing: -1.3px;
}


.scrap-process-heading h2 strong {

    display: block;

    color: #D6A84F;

    font-weight: 700;
}


.scrap-process-heading p {

    max-width: 650px;

    margin: 18px 0 0;

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

    font-size: 13px;

    line-height: 1.7;

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


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

.scrap-process-grid {

    position: relative;

    z-index: 2;

    display: grid;

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

    gap: 12px;
}


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

.scrap-process-card {

    position: relative;

    min-height: 280px;

    padding: 28px 25px;

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

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

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


.scrap-process-card:hover {

    transform:
        translateY(-7px);

    border-color:
        rgba(214,168,79,0.50);

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


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

.scrap-process-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 25px;
}


.scrap-process-number {

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

    font-size: 11px;

    font-weight: 700;

    color:
        rgba(255,255,255,0.25);
}


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

.scrap-process-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 46px;

    height: 46px;

    border:
        1px solid
        rgba(214,168,79,0.35);

    border-radius: 50%;

    color: #D6A84F;

    background:
        rgba(214,168,79,0.06);

    transition:
        transform 0.35s ease,
        background 0.35s ease;
}


.scrap-process-card:hover
.scrap-process-icon {

    transform:
        rotate(-8deg)
        scale(1.05);

    background:
        rgba(214,168,79,0.13);
}


.scrap-process-icon i {

    font-size: 18px;
}


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

.scrap-process-mini {

    display: block;

    margin-bottom: 9px;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.5px;

    color: #D6A84F;
}


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

.scrap-process-card h3 {

    margin: 0 0 12px;

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

    font-size: 17px;

    font-weight: 700;

    line-height: 1.25;

    color: #ffffff;
}


/* =========================================================
   CARD TEXT
========================================================= */

.scrap-process-card p {

    margin: 0;

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

    font-size: 11px;

    line-height: 1.7;

    color:
        rgba(255,255,255,0.50);
}


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

.scrap-process-footer {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns: 100px 1fr;

    gap: 25px;

    align-items: start;

    margin-top: 35px;

    padding-top: 25px;

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


.scrap-process-footer-line {

    width: 70px;

    height: 2px;

    margin-top: 6px;

    background: #D6A84F;
}


.scrap-process-footer strong {

    display: block;

    margin-bottom: 7px;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.3px;

    color: #D6A84F;
}


.scrap-process-footer p {

    max-width: 700px;

    margin: 0;

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

    font-size: 11px;

    line-height: 1.6;

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


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

@media (max-width: 991px) {

    .scrap-process-section {

        padding: 80px 0;
    }


    .scrap-process-header {

        grid-template-columns: 1fr;

        gap: 20px;
    }


    .scrap-process-grid {

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

}


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

@media (max-width: 767px) {

    .scrap-process-section {

        padding: 65px 0;
    }


    .scrap-process-heading h2 {

        font-size: 33px;
    }


    .scrap-process-heading p {

        font-size: 12px;
    }


    .scrap-process-grid {

        grid-template-columns: 1fr;

        gap: 10px;
    }


    .scrap-process-card {

        min-height: auto;

        padding: 23px;

    }


    .scrap-process-footer {

        grid-template-columns: 1fr;

        gap: 12px;
    }


    .scrap-process-footer-line {

        width: 45px;
    }

}

/* =========================================================
   SCRAP LOCATION SECTION
========================================================= */

.scrap-location-section {

    position: relative;

    padding: 105px 0;

    background:
        linear-gradient(
            135deg,
            #F6F8F8 0%,
            #EEF3F4 55%,
            #F7F7F4 100%
        );

    color: #102D42;

    overflow: hidden;
}


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

.scrap-location-bg {

    position: absolute;

    width: 600px;

    height: 600px;

    top: -300px;

    right: -200px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,0.13),
            transparent 68%
        );

    pointer-events: none;
}


.scrap-location-section::after {

    content: "";

    position: absolute;

    width: 300px;

    height: 300px;

    bottom: -170px;

    left: -120px;

    border-radius: 50%;

    background:
        rgba(49,93,115,0.06);

    filter: blur(30px);

    pointer-events: none;
}


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

.scrap-location-header {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns: 0.55fr 1fr;

    gap: 70px;

    margin-bottom: 55px;
}


.scrap-location-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    padding-top: 8px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.6px;

    color: #315D73;
}


.scrap-location-kicker span {

    color: #C79A43;

    font-size: 12px;
}


.scrap-location-kicker i {

    width: 35px;

    height: 1px;

    background: #C79A43;
}


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

.scrap-location-heading {

    max-width: 750px;
}


.scrap-location-heading h2 {

    margin: 0;

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

    font-size:
        clamp(32px, 4vw, 50px);

    line-height: 1.05;

    font-weight: 600;

    letter-spacing: -1.5px;

    color: #102D42;
}


.scrap-location-heading h2 strong {

    display: block;

    color: #315D73;

    font-weight: 700;
}


.scrap-location-heading p {

    max-width: 680px;

    margin: 18px 0 0;

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

    font-size: 13px;

    line-height: 1.75;

    color: #60717C;
}


/* =========================================================
   LOCATION GRID
========================================================= */

.scrap-location-grid {

    position: relative;

    z-index: 2;

    display: grid;

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

    gap: 14px;
}


/* =========================================================
   LOCATION CARD
========================================================= */

.scrap-location-card {

    position: relative;

    display: grid;

    grid-template-columns:
        48px 1fr;

    column-gap: 20px;

    min-height: 185px;

    padding: 27px;

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

    border:
        1px solid
        rgba(16,45,66,0.08);

    backdrop-filter: blur(5px);

    overflow: hidden;

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


.scrap-location-card:hover {

    transform:
        translateY(-5px);

    border-color:
        rgba(199,154,67,0.45);

    box-shadow:
        0 18px 40px
        rgba(16,45,66,0.09);
}


/* Number */

.scrap-location-number {

    position: absolute;

    top: 18px;

    right: 20px;

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

    font-size: 10px;

    font-weight: 700;

    color:
        rgba(16,45,66,0.22);
}


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

.scrap-location-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 46px;

    height: 46px;

    border-radius: 50%;

    background:
        rgba(49,93,115,0.08);

    color: #315D73;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}


.scrap-location-icon i {

    font-size: 18px;
}


.scrap-location-card:hover
.scrap-location-icon {

    background: #315D73;

    color: #D6A84F;

    transform:
        rotate(-5deg);
}


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

.scrap-location-content {

    padding-right: 30px;
}


.scrap-location-label {

    display: block;

    margin-bottom: 7px;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.4px;

    color: #C79A43;
}


.scrap-location-content h3 {

    margin: 0 0 9px;

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

    font-size: 17px;

    line-height: 1.3;

    font-weight: 700;

    color: #102D42;
}


.scrap-location-content p {

    margin: 0;

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

    font-size: 11px;

    line-height: 1.65;

    color: #687983;
}


/* =========================================================
   ARROW
========================================================= */

.scrap-location-arrow {

    position: absolute;

    right: 21px;

    bottom: 18px;

    font-size: 17px;

    color:
        rgba(16,45,66,0.25);

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}


.scrap-location-card:hover
.scrap-location-arrow {

    color: #C79A43;

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


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

.scrap-location-bottom {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns: 100px 1fr;

    gap: 25px;

    align-items: start;

    margin-top: 35px;

    padding-top: 25px;

    border-top:
        1px solid
        rgba(16,45,66,0.10);
}


.scrap-location-bottom-line {

    width: 65px;

    height: 2px;

    margin-top: 7px;

    background: #D6A84F;
}


.scrap-location-bottom strong {

    display: block;

    margin-bottom: 7px;

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

    font-size: 8px;

    letter-spacing: 1.4px;

    color: #315D73;
}


.scrap-location-bottom p {

    max-width: 760px;

    margin: 0;

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

    font-size: 11px;

    line-height: 1.65;

    color: #687983;
}


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

@media (max-width: 991px) {

    .scrap-location-section {

        padding: 80px 0;
    }

    .scrap-location-header {

        grid-template-columns: 1fr;

        gap: 20px;
    }

}


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

@media (max-width: 767px) {

    .scrap-location-section {

        padding: 65px 0;
    }

    .scrap-location-heading h2 {

        font-size: 34px;

        letter-spacing: -1px;
    }

    .scrap-location-grid {

        grid-template-columns: 1fr;

        gap: 10px;
    }

    .scrap-location-card {

        min-height: 165px;

        padding: 23px;

        grid-template-columns:
            43px 1fr;

        column-gap: 15px;
    }

    .scrap-location-icon {

        width: 42px;

        height: 42px;
    }

    .scrap-location-content h3 {

        font-size: 16px;
    }

    .scrap-location-content p {

        font-size: 11px;
    }

    .scrap-location-bottom {

        grid-template-columns: 1fr;

        gap: 12px;
    }

}

/* =========================================================
   SCRAP LOCATION SECTION
   Minimal / Modern / Professional
========================================================= */

.scrap-location-links {
    position: relative;
    padding: 105px 0 110px;
    color: #18384D;

    background:
        linear-gradient(
            135deg,
            #F1F6F8 0%,
            #E8F0F3 52%,
            #F4F5F1 100%
        );

    overflow: hidden;
}


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

.scrap-loc-head {
    max-width: 900px;
    margin-bottom: 52px;
}

.scrap-loc-kicker {
    display: flex;
    align-items: center;
    gap: 12px;

    margin-bottom: 18px;

    color: #B88932;

    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.scrap-loc-kicker span {
    font-size: 11px;
}

.scrap-loc-kicker i {
    width: 32px;
    height: 1px;

    background: #D2A247;

    display: block;
}


.scrap-loc-heading {
    display: flex;
    align-items: flex-end;
    gap: 55px;
}


.scrap-loc-heading h2 {
    margin: 0;

    max-width: 470px;

    color: #18384D;

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

    font-size: clamp(30px, 4vw, 46px);
    line-height: 1.08;
    font-weight: 600;

    letter-spacing: -1.2px;
}


.scrap-loc-heading h2 strong {
    display: block;

    color: #B88932;

    font-weight: 600;
}


.scrap-loc-heading p {
    max-width: 370px;

    margin: 0;

    color: #687B87;

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

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


/* =========================================================
   LOCATION GRID
========================================================= */

.scrap-loc-grid {
    display: grid;

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

    border-top: 1px solid rgba(24, 56, 77, .13);
}


/* =========================================================
   LOCATION ITEM
========================================================= */

.scrap-loc-item {
    position: relative;

    display: grid;

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

    gap: 20px;

    min-height: 102px;

    padding: 25px 20px;

    color: #18384D;

    text-decoration: none;

    border-bottom: 1px solid rgba(24, 56, 77, .13);

    transition:
        background .3s ease,
        padding .3s ease;
}


/* vertical divider */

.scrap-loc-item:nth-child(odd) {
    border-right: 1px solid rgba(24, 56, 77, .13);
}


/* number */

.scrap-loc-no {
    align-self: flex-start;

    padding-top: 3px;

    color: #B88932;

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

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

    letter-spacing: 1px;
}


/* content */

.scrap-loc-info small {
    display: block;

    margin-bottom: 6px;

    color: #9A6F27;

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

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

    letter-spacing: 1.8px;
}


.scrap-loc-info h3 {
    margin: 0;

    color: #18384D;

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

    font-size: 18px;
    line-height: 1.3;

    font-weight: 600;
}


.scrap-loc-info p {
    max-width: 390px;

    margin: 7px 0 0;

    color: #71818A;

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

    font-size: 11px;
    line-height: 1.55;
}


/* arrow */

.scrap-loc-arrow {
    display: flex;

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

    width: 28px;
    height: 28px;

    color: #B88932;

    font-size: 18px;

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


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

.scrap-loc-item:hover {
    color: #18384D;

    background: rgba(255,255,255,.55);

    padding-left: 27px;
}


.scrap-loc-item:hover .scrap-loc-arrow {
    color: #18384D;

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


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

.scrap-loc-footer {
    display: flex;

    align-items: center;

    gap: 16px;

    padding-top: 30px;
}


.scrap-loc-footer span {
    color: #B88932;

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

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

    letter-spacing: 1.7px;
}


.scrap-loc-footer i {
    width: 35px;
    height: 1px;

    background: rgba(184,137,50,.55);
}


.scrap-loc-footer p {
    margin: 0;

    color: #71818A;

    font-size: 10px;

    letter-spacing: .4px;
}


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

@media (max-width: 991px) {

    .scrap-location-links {
        padding: 85px 0 90px;
    }

    .scrap-loc-heading {
        gap: 30px;
    }

    .scrap-loc-item {
        min-height: 135px;
    }

}


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

@media (max-width: 767px) {

    .scrap-location-links {
        padding: 75px 0 80px;
    }

    .scrap-loc-head {
        margin-bottom: 38px;
    }

    .scrap-loc-heading {
        display: block;
    }

    .scrap-loc-heading h2 {
        font-size: 32px;
    }

    .scrap-loc-heading p {
        max-width: 100%;

        margin-top: 18px;

        font-size: 12px;
    }

    .scrap-loc-grid {
        grid-template-columns: 1fr;
    }

    .scrap-loc-item:nth-child(odd) {
        border-right: 0;
    }

    .scrap-loc-item {
        min-height: 120px;

        padding: 22px 5px;

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

        gap: 14px;
    }

    .scrap-loc-item:hover {
        padding-left: 10px;
    }

    .scrap-loc-info h3 {
        font-size: 16px;
    }

    .scrap-loc-info p {
        font-size: 10.5px;
    }

    .scrap-loc-footer {
        flex-wrap: wrap;

        gap: 10px;
    }

    .scrap-loc-footer p {
        width: 100%;
    }

}
/* =========================================================
   SCRAP FAQ SECTION
========================================================= */

.scrap-faq-section {

    position: relative;

    padding: 105px 0;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #102A3D 0%,
            #153B52 52%,
            #0D2638 100%
        );

    overflow: hidden;
}

.scrap-faq-section::before {

    content: "";

    position: absolute;

    width: 500px;

    height: 500px;

    top: -300px;

    left: -180px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,.10),
            transparent 68%
        );

    filter: blur(10px);

    pointer-events: none;
}


.scrap-faq-section::after {

    content: "";

    position: absolute;

    width: 350px;

    height: 350px;

    right: -150px;

    bottom: -200px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(83,155,195,.09),
            transparent 70%
        );

    pointer-events: none;
}


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

.scrap-faq-bg {

    position: absolute;

    width: 600px;

    height: 600px;

    top: -300px;

    right: -220px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,0.14),
            transparent 68%
        );

    pointer-events: none;
}


.scrap-faq-section::after {

    content: "";

    position: absolute;

    width: 350px;

    height: 350px;

    bottom: -200px;

    left: -150px;

    border-radius: 50%;

    border:
        1px solid
        rgba(214,168,79,0.12);

    animation:
        scrapFaqOrbit
        22s
        linear
        infinite;

    pointer-events: none;
}


@keyframes scrapFaqOrbit {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


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

.scrap-faq-header {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        0.55fr 1fr;

    gap: 70px;

    margin-bottom: 50px;
}


.scrap-faq-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    padding-top: 8px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.6px;

    color:
        rgba(255,255,255,0.55);
}


.scrap-faq-kicker span {

    color: #D6A84F;

    font-size: 12px;
}


.scrap-faq-kicker i {

    width: 35px;

    height: 1px;

    background: #D6A84F;
}


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

.scrap-faq-heading {

    max-width: 780px;
}


.scrap-faq-heading h2 {

    margin: 0;

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

    font-size:
        clamp(32px, 4vw, 48px);

    line-height: 1.05;

    font-weight: 500;

    letter-spacing: -1.4px;
}


.scrap-faq-heading h2 strong {

    display: block;

    color: #D6A84F;

    font-weight: 700;
}


.scrap-faq-heading p {

    max-width: 680px;

    margin: 18px 0 0;

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

    font-size: 13px;

    line-height: 1.75;

    color:
        rgba(255,255,255,0.55);
}


/* =========================================================
   ACCORDION
========================================================= */

.scrap-faq-accordion {

    position: relative;

    z-index: 2;

    max-width: 1000px;

    margin: 0 auto;
}


.scrap-faq-accordion .accordion-item {

    margin-bottom: 9px;

    background:
       rgb(233 233 233 / 45%);

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

    border-radius: 0;

    overflow: hidden;

    transition:
        border-color 0.3s ease,
        background 0.3s ease;
}


.scrap-faq-accordion .accordion-item:hover {

    border-color:
        rgba(214,168,79,0.35);
}


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

.scrap-faq-accordion
.accordion-button {

    position: relative;

    padding:
        21px 60px 21px 24px;

    background: transparent;

    box-shadow: none;

    color: #102d42;

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

    font-size: 14px;

    font-weight: 600;

    line-height: 1.45;
}


.scrap-faq-accordion
.accordion-button:not(.collapsed) {

    color: #D6A84F;

    background:
        rgba(214,168,79,0.045);

    box-shadow: none;
}


.scrap-faq-accordion
.accordion-button::after {

    width: 11px;

    height: 11px;

    margin-left: auto;

    background-image: none;

    content: "+";

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

    font-size: 19px;

    font-weight: 300;

    line-height: 11px;

    color: #D6A84F;

    transform: none;
}


.scrap-faq-accordion
.accordion-button:not(.collapsed)::after {

    content: "−";

    transform: none;
}


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

.scrap-faq-accordion
.accordion-body {

    padding:
       8px 60px 15px 24px;

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

    font-size: 12px;

    line-height: 1.75;

    color:
        rgb(16 45 66);
}


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

.scrap-faq-bottom {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    gap: 18px;

    max-width: 1000px;

    margin: 30px auto 0;

    padding-top: 22px;

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


.scrap-faq-bottom span {

    white-space: nowrap;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.4px;

    color: #D6A84F;
}


.scrap-faq-bottom i {

    width: 35px;

    height: 1px;

    background:
        rgba(214,168,79,0.45);
}


.scrap-faq-bottom p {

    margin: 0;

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

    font-size: 10px;

    color:
        rgba(255,255,255,0.35);
}


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

@media (max-width: 991px) {

    .scrap-faq-header {

        grid-template-columns: 1fr;

        gap: 20px;
    }

}


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

@media (max-width: 767px) {

    .scrap-faq-section {

        padding: 70px 0;
    }

    .scrap-faq-heading h2 {

        font-size: 33px;

        letter-spacing: -1px;
    }

    .scrap-faq-heading p {

        font-size: 12px;
    }

    .scrap-faq-accordion
    .accordion-button {

        padding:
            18px 48px 18px 18px;

        font-size: 12px;
    }

    .scrap-faq-accordion
    .accordion-body {

        padding:
            0 40px 20px 18px;

        font-size: 11px;
    }

    .scrap-faq-bottom {

        align-items: flex-start;

        flex-direction: column;

        gap: 10px;
    }

}

/* =========================================================
   SECTION 09 — LIGHT FINAL CTA
========================================================= */

.scrap-final-cta {

    position: relative;

    padding: 100px 0 0;

    color: #18384D;

    background:
        linear-gradient(
            135deg,
            #F7F5EF 0%,
            #F1EEE6 52%,
            #EAE8E0 100%
        );

    overflow: hidden;
}


/* =========================================================
   SOFT BACKGROUND GRID
========================================================= */

.scrap-cta-grid {

    position: absolute;

    inset: 0;

    opacity: .45;

    background-image:
        linear-gradient(
            rgba(24,56,77,.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(24,56,77,.035) 1px,
            transparent 1px
        );

    background-size: 60px 60px;

    mask-image:
        linear-gradient(
            to right,
            transparent,
            black 25%,
            black 75%,
            transparent
        );

    pointer-events: none;
}


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

.scrap-cta-orb {

    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    filter: blur(8px);
}


.scrap-cta-orb-1 {

    width: 480px;

    height: 480px;

    top: -300px;

    right: -120px;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,.18),
            transparent 68%
        );

    animation:
        scrapCtaFloat
        10s
        ease-in-out
        infinite;
}


.scrap-cta-orb-2 {

    width: 330px;

    height: 330px;

    bottom: -230px;

    left: -130px;

    background:
        radial-gradient(
            circle,
            rgba(49,93,115,.10),
            transparent 70%
        );

    animation:
        scrapCtaFloat
        13s
        ease-in-out
        infinite reverse;
}


@keyframes scrapCtaFloat {

    0%,
    100% {
        transform: translate3d(0,0,0);
    }

    50% {
        transform: translate3d(0,18px,0);
    }

}


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

.scrap-cta-watermark {

    position: absolute;

    right: -20px;

    bottom: -70px;

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

    font-size:
        clamp(100px, 17vw, 220px);

    line-height: 1;

    font-weight: 800;

    letter-spacing: -10px;

    color:
        rgba(24,56,77,.035);

    user-select: none;

    pointer-events: none;
}


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

.scrap-final-cta-inner {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        1.2fr .8fr;

    gap: 80px;

    align-items: center;

    padding-bottom: 75px;
}


/* =========================================================
   KICKER
========================================================= */

.scrap-final-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 22px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.7px;

    color:
        #71808A;
}


.scrap-final-kicker span {

    color: #B88932;

    font-size: 12px;
}


.scrap-final-kicker i {

    width: 38px;

    height: 1px;

    background: #D6A84F;
}


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

.scrap-final-content h2 {

    margin: 0;

    max-width: 700px;

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

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

    line-height: .98;

    font-weight: 500;

    letter-spacing: -2.5px;

    color: #18384D;
}


.scrap-final-content h2 strong {

    display: block;

    color: #B88932;

    font-weight: 700;
}


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

.scrap-final-content > p {

    max-width: 650px;

    margin: 24px 0 30px;

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

    font-size: 13px;

    line-height: 1.8;

    color:
        #667680;
}


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

.scrap-final-button {

    display: inline-flex;

    align-items: center;

    gap: 22px;

    padding: 15px 20px 15px 24px;

    color: #ffffff;

    background: #18384D;

    text-decoration: none;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: .4px;

    box-shadow:
        0 10px 30px
        rgba(24,56,77,.15);

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


.scrap-final-button i {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 32px;

    height: 32px;

    color: #18384D;

    background: #D6A84F;

    transition:
        transform .3s ease;
}


.scrap-final-button:hover {

    color: #ffffff;

    background: #214B65;

    transform: translateY(-3px);

    box-shadow:
        0 14px 35px
        rgba(24,56,77,.20);
}


.scrap-final-button:hover i {

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


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

.scrap-final-visual {

    position: relative;

    min-height: 310px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    padding-left: 55px;
}


.scrap-final-visual-line {

    position: absolute;

    left: 0;

    top: 0;

    width: 1px;

    height: 100%;

    background:
        linear-gradient(
            to bottom,
            transparent,
            rgba(214,168,79,.8),
            transparent
        );
}


/* =========================================================
   VISUAL TEXT
========================================================= */

.scrap-final-info {

    display: flex;

    flex-direction: column;

    gap: 3px;
}


.scrap-final-info span {

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 2px;

    color:
        #84919A;
}


.scrap-final-info strong {

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

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

    line-height: .9;

    letter-spacing: -2px;

    color: #18384D;
}


.scrap-final-info small {

    margin-top: 8px;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 4px;

    color: #B88932;
}


/* =========================================================
   EMIRATES
========================================================= */

.scrap-final-emirates {

    display: flex;

    flex-wrap: wrap;

    gap: 7px 9px;

    max-width: 430px;

    margin-top: 30px;
}


.scrap-final-emirates span {

    padding: 7px 10px;

    border:
        1px solid
        rgba(24,56,77,.11);

    background:
        rgba(255,255,255,.55);

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

    font-size: 9px;

    color:
        #657680;

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


.scrap-final-emirates span:hover {

    color: #18384D;

    border-color:
        rgba(214,168,79,.65);

    background: #ffffff;

    transform: translateY(-2px);
}


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

.scrap-final-bottom {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    gap: 15px;

    padding: 18px 0;

    border-top:
        1px solid
        rgba(24,56,77,.10);
}


.scrap-final-bottom span {

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.3px;

    color:
        #7C8991;
}


.scrap-final-bottom span:first-child {

    color: #B88932;
}


.scrap-final-bottom i {

    width: 25px;

    height: 1px;

    background:
        rgba(184,137,50,.45);
}


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

@media (max-width: 991px) {

    .scrap-final-cta-inner {

        grid-template-columns: 1fr;

        gap: 55px;
    }

    .scrap-final-visual {

        min-height: auto;

        padding-left: 35px;
    }

}


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

@media (max-width: 767px) {

    .scrap-final-cta {

        padding-top: 70px;
    }

    .scrap-final-cta-inner {

        padding-bottom: 55px;
    }

    .scrap-final-content h2 {

        font-size: 40px;

        letter-spacing: -1.5px;
    }

    .scrap-final-content > p {

        font-size: 12px;
    }

    .scrap-final-visual {

        padding-left: 25px;
    }

    .scrap-final-info strong {

        font-size: 43px;
    }

    .scrap-final-bottom {

        flex-wrap: wrap;

        gap: 9px;
    }

    .scrap-final-bottom i {

        display: none;
    }

}

/* =========================================================
   SCRAP LOCATION BUYING
   LIGHT PREMIUM VERSION
   COMMON — ALL 7 UAE LOCATION PAGES
========================================================= */

.scrap-location-buying {

    position: relative;

    padding: 105px 0 0;

    overflow: hidden;

    color: #173B56;

    background:
        linear-gradient(
            135deg,
            #F7F9FA 0%,
            #EEF3F5 52%,
            #F8FAFA 100%
        );

}


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

.scrap-location-buying-bg {

    position: absolute;

    inset: 0;

    overflow: hidden;

    pointer-events: none;

}


.scrap-buying-grid {

    position: absolute;

    inset: 0;

    opacity: 0.42;

    background-image:
        linear-gradient(
            rgba(23,59,86,0.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(23,59,86,0.055) 1px,
            transparent 1px
        );

    background-size: 65px 65px;

    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            #000 20%,
            #000 80%,
            transparent
        );

}


/* =========================================================
   GOLD / BLUE AMBIENT ORBS
========================================================= */

.scrap-buying-orb {

    position: absolute;

    border-radius: 50%;

    filter: blur(5px);

    pointer-events: none;

}


.scrap-buying-orb.orb-1 {

    width: 360px;

    height: 360px;

    top: -190px;

    right: 3%;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,0.16) 0%,
            rgba(214,168,79,0.055) 48%,
            transparent 72%
        );

    animation:
        scrapBuyingOrbOne 11s ease-in-out infinite alternate;

}


.scrap-buying-orb.orb-2 {

    width: 320px;

    height: 320px;

    bottom: -180px;

    left: -100px;

    background:
        radial-gradient(
            circle,
            rgba(49,93,115,0.13) 0%,
            rgba(49,93,115,0.035) 58%,
            transparent 75%
        );

    animation:
        scrapBuyingOrbTwo 14s ease-in-out infinite alternate;

}


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

.scrap-buying-ring {

    position: absolute;

    border-radius: 50%;

    border: 1px solid rgba(23,59,86,0.075);

}


.scrap-buying-ring.ring-1 {

    width: 520px;

    height: 520px;

    right: -270px;

    top: 12%;

    animation:
        scrapBuyingRotate 32s linear infinite;

}


.scrap-buying-ring.ring-2 {

    width: 350px;

    height: 350px;

    left: -220px;

    top: 45%;

    border-color: rgba(214,168,79,0.13);

    animation:
        scrapBuyingRotateReverse 26s linear infinite;

}


/* =========================================================
   PARTICLES
========================================================= */

.scrap-buying-particle {

    position: absolute;

    width: 5px;

    height: 5px;

    border-radius: 50%;

    background: #D6A84F;

    opacity: 0.45;

    box-shadow:
        0 0 14px rgba(214,168,79,0.35);

}


.scrap-buying-particle.particle-1 {

    top: 24%;

    left: 12%;

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

}


.scrap-buying-particle.particle-2 {

    top: 68%;

    left: 44%;

    animation:
        scrapBuyingParticle 9s ease-in-out infinite 1s;

}


.scrap-buying-particle.particle-3 {

    top: 32%;

    right: 24%;

    animation:
        scrapBuyingParticle 8s ease-in-out infinite 2s;

}


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

.scrap-location-buying-top {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 50px;

}


.scrap-section-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    color: #71808B;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 2px;

}


.scrap-section-kicker span {

    color: #B78932;

    font-size: 12px;

}


.scrap-section-kicker i {

    width: 38px;

    height: 1px;

    background: #D6A84F;

}


.scrap-location-buying-tag {

    display: flex;

    align-items: center;

    gap: 9px;

    padding: 9px 15px;

    border: 1px solid #D7E0E5;

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

    color: #526573;

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.5px;

    box-shadow:
        0 8px 25px rgba(23,59,86,0.05);

}


.scrap-location-buying-tag i {

    color: #C3973E;

}


/* =========================================================
   MAIN GRID
========================================================= */

.scrap-location-buying-main {

    position: relative;

    display: grid;

    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(320px, 0.65fr);

    gap: 80px;

    align-items: center;

}


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

.scrap-location-buying-content h2 {

    margin: 0 0 25px;

    max-width: 720px;

    color: #173B56;

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

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

    font-weight: 600;

    line-height: 1.03;

    letter-spacing: -2.5px;

}


.scrap-location-buying-content h2 span {

    display: block;

    color: #B78932;
    font-weight: 300;

}


.scrap-location-buying-content p {

    max-width: 730px;

    margin: 0 0 17px;

    color: #61717C;

    font-size: 14px;

    line-height: 1.85;

}


.scrap-location-buying-content p strong {

    color: #234A63;

    font-weight: 700;

}


.scrap-location-buying-intro {

    font-size: 15px !important;

}


/* =========================================================
   BUYING TYPES
========================================================= */

.scrap-location-buying-types {

    display: grid;

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

    gap: 13px;

    margin-top: 34px;

}


.scrap-location-buying-type {

    position: relative;

    display: grid;

    grid-template-columns: 43px 1fr;

    gap: 13px;

    padding: 18px;

    border: 1px solid #DCE4E8;

    background: #FFFFFF;

    box-shadow:
        0 10px 30px rgba(23,59,86,0.055);

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

}


.scrap-location-buying-type:hover {

    transform: translateY(-5px);

    border-color: rgba(214,168,79,0.55);

    box-shadow:
        0 18px 40px rgba(23,59,86,0.10);

}


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

.scrap-buying-type-icon {

    width: 43px;

    height: 43px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 1px solid rgba(214,168,79,0.45);

    color: #B78932;

    background:
        linear-gradient(
            135deg,
            rgba(214,168,79,0.12),
            rgba(214,168,79,0.035)
        );

}


.scrap-buying-type-icon i {

    font-size: 18px;

}


/* =========================================================
   CARD TYPOGRAPHY
========================================================= */

.scrap-location-buying-type span {

    display: block;

    margin-bottom: 3px;

    color: #B78932;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1px;

}


.scrap-location-buying-type h3 {

    margin: 0 0 5px;

    color: #173B56;

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

    font-size: 13px;

    font-weight: 700;

}


.scrap-location-buying-type p {

    margin: 0;

    color: #75838C;

    font-size: 10px;

    line-height: 1.55;

}


/* =========================================================
   RIGHT PANEL
========================================================= */

.scrap-location-buying-side {

    position: relative;

}


.scrap-location-buying-panel {

    position: relative;

    min-height: 410px;

    padding: 42px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    overflow: hidden;

    border: 1px solid #D6E0E5;

    background:

        linear-gradient(
            145deg,
            #FFFFFF 0%,
            #F1F5F7 100%
        );

    box-shadow:
        0 25px 65px rgba(23,59,86,0.10);

}


/* GOLD ACCENT */

.scrap-location-buying-panel::before {

    content: "";

    position: absolute;

    width: 190px;

    height: 190px;

    top: -100px;

    right: -90px;

    border-radius: 50%;

    border: 1px solid rgba(214,168,79,0.32);

}


.scrap-location-buying-panel::after {

    content: "";

    position: absolute;

    width: 250px;

    height: 250px;

    bottom: -160px;

    left: -110px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,0.13),
            transparent 70%
        );

}


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

.scrap-buying-panel-number {

    position: absolute;

    top: 20px;

    right: 27px;

    color: rgba(23,59,86,0.075);

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

    font-size: 75px;

    font-weight: 800;

    line-height: 1;

}


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

.scrap-buying-panel-label {

    position: relative;

    z-index: 1;

    margin-bottom: 14px;

    color: #B78932;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 2px;

}


.scrap-location-buying-panel strong {

    position: relative;

    z-index: 1;

    color: #173B56;

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

    font-size: 38px;

    font-weight: 700;

    line-height: 1;

    letter-spacing: -1px;

}


.scrap-location-buying-panel p {

    position: relative;

    z-index: 1;

    max-width: 270px;

    margin: 22px 0;

    color: #687983;

    font-size: 12px;

    line-height: 1.7;

}


.scrap-buying-panel-location {

    position: relative;

    z-index: 1;

    display: flex;

    align-items: center;

    gap: 9px;

    margin-top: auto;

    padding-top: 18px;

    border-top: 1px solid #DCE4E8;

    color: #687983;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1px;

}


.scrap-buying-panel-location i {

    color: #C3973E;

    font-size: 13px;

}


/* =========================================================
   FLOATING STAT
========================================================= */

.scrap-location-buying-stat {

    position: absolute;

    right: -35px;

    bottom: 35px;

    width: 105px;

    height: 105px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    border: 1px solid rgba(214,168,79,0.65);

    background: #173B56;

    box-shadow:
        0 20px 45px rgba(23,59,86,0.20);

}


.scrap-location-buying-stat span {

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

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 2px;

}


.scrap-location-buying-stat strong {

    color: #D6A84F;

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

    font-size: 30px;

    line-height: 1;

}


.scrap-location-buying-stat small {

    margin-top: 3px;

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

    font-size: 7px;

    letter-spacing: 1px;

}


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

.scrap-location-buying-bottom {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 22px;

    min-height: 72px;

    margin-top: 75px;

    border-top: 1px solid #D9E2E6;

}


.scrap-location-buying-bottom span {

    color: #657681;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.3px;

}


.scrap-location-buying-bottom i {

    width: 4px;

    height: 4px;

    flex-shrink: 0;

    border-radius: 50%;

    background: #D6A84F;

    box-shadow:
        0 0 10px rgba(214,168,79,0.45);

}


/* =========================================================
   ANIMATIONS
========================================================= */

@keyframes scrapBuyingOrbOne {

    from {
        transform: translate(0, 0);
    }

    to {
        transform: translate(-45px, 35px);
    }

}


@keyframes scrapBuyingOrbTwo {

    from {
        transform: translate(0, 0);
    }

    to {
        transform: translate(50px, -30px);
    }

}


@keyframes scrapBuyingRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


@keyframes scrapBuyingRotateReverse {

    from {
        transform: rotate(360deg);
    }

    to {
        transform: rotate(0deg);
    }

}


@keyframes scrapBuyingParticle {

    0%,
    100% {
        transform: translateY(0);
        opacity: 0.20;
    }

    50% {
        transform: translateY(-25px);
        opacity: 0.65;
    }

}


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

@media (max-width: 991px) {

    .scrap-location-buying {

        padding-top: 85px;

    }


    .scrap-location-buying-main {

        grid-template-columns: 1fr;

        gap: 55px;

    }


    .scrap-location-buying-side {

        max-width: 560px;

    }


    .scrap-location-buying-stat {

        right: -15px;

    }

}


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

@media (max-width: 767px) {

    .scrap-location-buying {

        padding-top: 70px;

    }


    .scrap-location-buying-top {

        margin-bottom: 35px;

    }


    .scrap-location-buying-tag {

        display: none;

    }


    .scrap-location-buying-content h2 {

        font-size: 38px;

        letter-spacing: -1.5px;

    }


    .scrap-location-buying-content p {

        font-size: 13px;

    }


    .scrap-location-buying-types {

        grid-template-columns: 1fr;

    }


    .scrap-location-buying-panel {

        min-height: 350px;

        padding: 30px;

    }


    .scrap-location-buying-panel strong {

        font-size: 32px;

    }


    .scrap-location-buying-stat {

        right: 10px;

        bottom: -30px;

        width: 90px;

        height: 90px;

    }


    .scrap-location-buying-bottom {

        justify-content: flex-start;

        overflow: hidden;

        white-space: nowrap;

        gap: 15px;

        margin-top: 60px;

    }


    .scrap-location-buying-bottom span {

        flex-shrink: 0;

    }

}


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

@media (max-width: 480px) {

    .scrap-location-buying-content h2 {

        font-size: 32px;

    }


    .scrap-location-buying-panel {

        padding: 26px;

    }


    .scrap-location-buying-stat {

        width: 82px;

        height: 82px;

    }


    .scrap-location-buying-stat strong {

        font-size: 25px;

    }

}

/* =========================================================
   SECTION 03 — SCRAP BUYING IN DUBAI
========================================================= */

.dubai-scrap-services {

    position: relative;

    padding: 110px 0 100px;

    background:
        linear-gradient(
            135deg,
            #102D42 0%,
            #173F58 52%,
            #102F45 100%
        );

    color: #ffffff;

    overflow: hidden;
}


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

.dubai-services-bg {

    position: absolute;

    width: 650px;
    height: 650px;

    top: -330px;
    right: -220px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,0.13) 0%,
            rgba(214,168,79,0.04) 42%,
            transparent 70%
        );

    pointer-events: none;

    animation:
        dubaiServicesGlow
        10s
        ease-in-out
        infinite;
}


.dubai-scrap-services::before {

    content: "";

    position: absolute;

    inset: 0;

    background-image:
        linear-gradient(
            rgba(255,255,255,0.025) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,0.025) 1px,
            transparent 1px
        );

    background-size: 65px 65px;

    opacity: .45;

    pointer-events: none;
}


.dubai-scrap-services::after {

    content: "";

    position: absolute;

    width: 360px;
    height: 360px;

    left: -180px;
    bottom: -200px;

    border-radius: 50%;

    border: 1px solid
        rgba(214,168,79,0.10);

    box-shadow:
        0 0 0 45px rgba(214,168,79,0.025),
        0 0 0 90px rgba(214,168,79,0.015);

    animation:
        dubaiServicesOrbit
        18s
        linear
        infinite;

    pointer-events: none;
}


@keyframes dubaiServicesGlow {

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

    50% {
        transform: translate(-25px, 25px) scale(1.05);
    }

}


@keyframes dubaiServicesOrbit {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


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

.dubai-services-header {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        0.48fr 1fr;

    gap: 70px;

    align-items: start;

    margin-bottom: 60px;
}


/* =========================================================
   KICKER
========================================================= */

.dubai-services-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    padding-top: 8px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.6px;

    color:
        rgba(255,255,255,.48);
}


.dubai-services-kicker span {

    color: #D6A84F;

    font-size: 12px;

    font-weight: 700;
}


.dubai-services-kicker i {

    width: 38px;

    height: 1px;

    background: #D6A84F;
}


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

.dubai-services-heading {

    max-width: 780px;
}


.dubai-services-heading h2 {

    margin: 0;

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

    font-size:
        clamp(34px, 4.4vw, 56px);

    line-height: 1.02;

    font-weight: 500;

    letter-spacing: -1.8px;
}


.dubai-services-heading h2 strong {

    display: block;

    color: #D6A84F;

    font-weight: 700;
}


.dubai-services-heading p {

    max-width: 680px;

    margin: 22px 0 0;

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

    font-size: 13px;

    line-height: 1.8;

    color:
        rgba(255,255,255,.55);
}


/* =========================================================
   SERVICE GRID
========================================================= */

.dubai-services-grid {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        1.25fr
        0.9fr
        0.9fr
        0.9fr;

    gap: 12px;
}


/* =========================================================
   FEATURE CARD
========================================================= */

.dubai-service-feature {

    position: relative;

    min-height: 330px;

    padding: 32px;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    background:
        linear-gradient(
            145deg,
            rgba(214,168,79,.12),
            rgba(255,255,255,.035)
        );

    border:
        1px solid
        rgba(214,168,79,.25);

    overflow: hidden;

    transition:
        transform .4s ease,
        border-color .4s ease;
}


.dubai-service-feature::before {

    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    top: -90px;
    right: -90px;

    border-radius: 50%;

    border:
        1px solid
        rgba(214,168,79,.25);

    box-shadow:
        0 0 0 25px rgba(214,168,79,.025),
        0 0 0 50px rgba(214,168,79,.018);
}


.dubai-service-feature:hover {

    transform: translateY(-6px);

    border-color:
        rgba(214,168,79,.55);
}


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

.dubai-service-number {

    position: absolute;

    top: 25px;
    right: 28px;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1px;

    color:
        rgba(255,255,255,.3);
}


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

.dubai-service-icon {

    width: 52px;
    height: 52px;

    display: flex;

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

    margin-bottom: auto;

    border:
        1px solid
        rgba(214,168,79,.35);

    background:
        rgba(214,168,79,.08);

    color: #D6A84F;

    font-size: 21px;

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


.dubai-service-feature:hover
.dubai-service-icon {

    transform: rotate(-5deg) scale(1.06);

    background:
        rgba(214,168,79,.15);
}


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

.dubai-service-feature h3 {

    margin: 0 0 12px;

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

    font-size: 23px;

    line-height: 1.05;

    font-weight: 600;

    letter-spacing: -.5px;
}


.dubai-service-feature h3 strong {

    color: #D6A84F;

    font-weight: 700;
}


.dubai-service-feature p {

    max-width: 420px;

    margin: 0;

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

    font-size: 11px;

    line-height: 1.7;

    color:
        rgba(255,255,255,.48);
}


/* =========================================================
   SMALL SERVICE CARDS
========================================================= */

.dubai-service-card {

    position: relative;

    min-height: 330px;

    padding: 28px 24px;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    background:
        rgba(255,255,255,.035);

    border:
        1px solid
        rgba(255,255,255,.09);

    overflow: hidden;

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


.dubai-service-card::after {

    content: "";

    position: absolute;

    width: 100px;
    height: 100px;

    top: -50px;
    right: -50px;

    border-radius: 50%;

    border:
        1px solid
        rgba(214,168,79,.18);
}


.dubai-service-card:hover {

    transform: translateY(-6px);

    background:
        rgba(214,168,79,.055);

    border-color:
        rgba(214,168,79,.35);
}


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

.dubai-service-card > span {

    position: absolute;

    top: 22px;
    right: 22px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1px;

    color:
        rgba(255,255,255,.28);
}


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

.dubai-service-card > i {

    margin-bottom: auto;

    color: #D6A84F;

    font-size: 24px;

    transition:
        transform .4s ease;
}


.dubai-service-card:hover > i {

    transform:
        translateY(-4px)
        scale(1.08);
}


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

.dubai-service-card h3 {

    margin: 0 0 11px;

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

    font-size: 17px;

    line-height: 1.15;

    font-weight: 600;

    color: #ffffff;
}


/* =========================================================
   CARD TEXT
========================================================= */

.dubai-service-card p {

    margin: 0;

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

    font-size: 10.5px;

    line-height: 1.7;

    color:
        rgba(255,255,255,.44);
}


/* =========================================================
   DUBAI SERVICE AREAS
========================================================= */

.dubai-service-footer {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        0.8fr 1.8fr;

    gap: 50px;

    align-items: center;

    margin-top: 45px;

    padding-top: 25px;

    border-top:
        1px solid
        rgba(255,255,255,.08);
}


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

.dubai-service-footer-title {

    display: flex;

    flex-direction: column;

    gap: 5px;
}


.dubai-service-footer-title span {

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.5px;

    color: #D6A84F;
}


.dubai-service-footer-title strong {

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

    font-size: 13px;

    font-weight: 600;

    color:
        rgba(255,255,255,.7);
}


/* =========================================================
   AREAS
========================================================= */

.dubai-service-areas {

    display: flex;

    flex-wrap: wrap;

    justify-content: flex-end;

    gap: 8px;
}


.dubai-service-areas span {

    padding: 8px 12px;

    border:
        1px solid
        rgba(255,255,255,.08);

    background:
        rgba(255,255,255,.025);

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

    font-size: 9px;

    color:
        rgba(255,255,255,.43);

    transition:
        color .3s ease,
        border-color .3s ease,
        background .3s ease;
}


.dubai-service-areas span:hover {

    color: #D6A84F;

    border-color:
        rgba(214,168,79,.35);

    background:
        rgba(214,168,79,.05);
}


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

@media (max-width: 1100px) {

    .dubai-services-grid {

        grid-template-columns:
            1fr 1fr;
    }

    .dubai-service-feature {

        grid-column:
            span 2;

        min-height: 280px;
    }

}


@media (max-width: 991px) {

    .dubai-services-header {

        grid-template-columns: 1fr;

        gap: 20px;
    }

    .dubai-service-footer {

        grid-template-columns: 1fr;

        gap: 20px;
    }

    .dubai-service-areas {

        justify-content: flex-start;
    }

}


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

@media (max-width: 767px) {

    .dubai-scrap-services {

        padding: 75px 0 70px;
    }


    .dubai-services-heading h2 {

        font-size: 34px;

        letter-spacing: -1px;
    }


    .dubai-services-heading p {

        font-size: 12px;

        line-height: 1.7;
    }


    .dubai-services-grid {

        grid-template-columns: 1fr;

        gap: 10px;
    }


    .dubai-service-feature {

        grid-column: auto;

        min-height: 280px;

        padding: 26px;
    }


    .dubai-service-card {

        min-height: 240px;

        padding: 25px 22px;
    }


    .dubai-service-feature h3 {

        font-size: 21px;
    }


    .dubai-service-footer {

        margin-top: 35px;

        padding-top: 20px;
    }


    .dubai-service-areas {

        gap: 6px;
    }


    .dubai-service-areas span {

        font-size: 8px;

        padding: 7px 9px;
    }

}

/* =========================================================
   SECTION 04 — SCRAP TYPES
   LIGHT COMMON SECTION
========================================================= */

.scrap-types-light {

    position: relative;

    padding: 110px 0 90px;

    background:
        #F4F6F7;

    color: #102D42;

    overflow: hidden;
}


/* subtle background detail */

.scrap-types-light::before {

    content: "";

    position: absolute;

    width: 500px;
    height: 500px;

    top: -250px;
    right: -180px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,.12),
            transparent 68%
        );

    pointer-events: none;
}


.scrap-types-light::after {

    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    bottom: -180px;
    left: -120px;

    border-radius: 50%;

    border:
        1px solid
        rgba(16,45,66,.06);

    box-shadow:
        0 0 0 35px rgba(16,45,66,.025),
        0 0 0 70px rgba(16,45,66,.018);

    pointer-events: none;
}


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

.scrap-types-header {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        .45fr 1fr;

    gap: 70px;

    margin-bottom: 55px;
}


.scrap-types-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    padding-top: 8px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.6px;

    color:
        #71808A;
}


.scrap-types-kicker span {

    color: #B88932;

    font-size: 12px;
}


.scrap-types-kicker i {

    width: 38px;

    height: 1px;

    background: #B88932;
}


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

.scrap-types-heading {

    max-width: 760px;
}


.scrap-types-heading h2 {

    margin: 0;

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

    font-size:
        clamp(35px, 4.5vw, 50px);

    line-height: 1;

    font-weight: 500;

    letter-spacing: -2px;

    color: #102D42;
}


.scrap-types-heading h2 strong {

    display: block;

    color: #B88932;

    font-weight: 700;
}


.scrap-types-heading p {

    max-width: 700px;

    margin: 22px 0 0;

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

    font-size: 13px;

    line-height: 1.8;

    color:
        #667681;
}


/* =========================================================
   GRID
========================================================= */

.scrap-types-grid {

    position: relative;

    z-index: 2;

    display: grid;

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

    gap: 14px;
}


/* =========================================================
   CATEGORY GROUP
========================================================= */

.scrap-type-group {

    position: relative;

    padding: 27px 28px 25px;

    background: #ffffff;

    border:
        1px solid
        #E4E8EA;

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

    overflow: hidden;
}


.scrap-type-group::after {

    content: "";

    position: absolute;

    width: 90px;
    height: 90px;

    right: -45px;
    bottom: -45px;

    border-radius: 50%;

    border:
        1px solid
        rgba(184,137,50,.12);

    transition:
        transform .5s ease;
}


.scrap-type-group:hover {

    transform: translateY(-4px);

    border-color:
        rgba(184,137,50,.38);

    box-shadow:
        0 15px 35px
        rgba(16,45,66,.07);
}


.scrap-type-group:hover::after {

    transform: scale(1.5);
}


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

.scrap-type-group-head {

    display: flex;

    align-items: center;

    gap: 17px;

    padding-bottom: 18px;

    margin-bottom: 3px;

    border-bottom:
        1px solid
        #EDF0F1;
}


.scrap-type-group-head > span {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 38px;
    height: 38px;

    flex: 0 0 38px;

    background:
        #102D42;

    color:
        #D6A84F;

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: .5px;
}


.scrap-type-group-head small {

    display: block;

    margin-bottom: 3px;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.4px;

    color: #B88932;
}


.scrap-type-group-head h3 {

    margin: 0;

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

    font-size: 18px;

    line-height: 1.1;

    font-weight: 650;

    color: #102D42;
}


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

.scrap-type-links {

    display: grid;

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

    column-gap: 25px;
}


.scrap-type-links a {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 12px;

    min-height: 42px;

    padding: 8px 0;

    border-bottom:
        1px solid
        #EEF1F2;

    color: #405563;

    text-decoration: none;

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

    font-size: 11px;

    font-weight: 500;

    transition:
        color .25s ease,
        padding-left .25s ease;
}


.scrap-type-links a:nth-last-child(-n+2) {

    border-bottom: none;
}


.scrap-type-links a i {

    flex: 0 0 auto;

    font-size: 11px;

    color:
        #B88932;

    opacity: .5;

    transform:
        translate(0,0);

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


.scrap-type-links a:hover {

    color: #102D42;

    padding-left: 5px;
}


.scrap-type-links a:hover i {

    opacity: 1;

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


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

.scrap-types-bottom {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    gap: 15px;

    margin-top: 45px;

    padding-top: 20px;

    border-top:
        1px solid
        #DCE2E5;
}


.scrap-types-bottom span {

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.3px;

    color: #7A8992;
}


.scrap-types-bottom span:first-child {

    color: #B88932;
}


.scrap-types-bottom i {

    width: 25px;

    height: 1px;

    background:
        #C8A45C;
}


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

@media (max-width: 991px) {

    .scrap-types-header {

        grid-template-columns: 1fr;

        gap: 20px;
    }

}


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

@media (max-width: 767px) {

    .scrap-types-light {

        padding: 75px 0 65px;
    }


    .scrap-types-heading h2 {

        font-size: 35px;

        letter-spacing: -1.2px;
    }


    .scrap-types-heading p {

        font-size: 12px;

        line-height: 1.7;
    }


    .scrap-types-grid {

        grid-template-columns: 1fr;

        gap: 10px;
    }


    .scrap-type-group {

        padding: 23px 21px;
    }


    .scrap-type-links {

        grid-template-columns: 1fr;
    }


    .scrap-type-links a:nth-last-child(-n+2) {

        border-bottom:
            1px solid
            #EEF1F2;
    }


    .scrap-type-links a:last-child {

        border-bottom: none;
    }


    .scrap-types-bottom {

        flex-wrap: wrap;

        gap: 9px;
    }


    .scrap-types-bottom i {

        display: none;
    }

}
/* =========================================================
   SECTION 05 — SCRAP FAQ
========================================================= */

.scrap-faq-section {

    position: relative;

    padding: 110px 0 95px;

    background: #F8F9F9;

    color: #102D42;

    overflow: hidden;
}


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

.scrap-faq-section::before {

    content: "";

    position: absolute;

    width: 520px;
    height: 520px;

    top: -280px;
    right: -180px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,.11) 0%,
            rgba(214,168,79,.045) 38%,
            transparent 70%
        );

    pointer-events: none;

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


.scrap-faq-section::after {

    content: "";

    position: absolute;

    width: 380px;
    height: 380px;

    bottom: -220px;
    left: -160px;

    border-radius: 50%;

    border:
        1px solid
        rgba(16,45,66,.055);

    box-shadow:
        0 0 0 35px rgba(16,45,66,.018),
        0 0 0 70px rgba(16,45,66,.012);

    pointer-events: none;

    animation:
        faqOrbit 16s linear infinite;
}


@keyframes faqGlow {

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

    100% {
        transform: translate3d(-25px,25px,0) scale(1.08);
    }
}


@keyframes faqOrbit {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}


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

.scrap-faq-header {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        .45fr 1fr;

    gap: 70px;

    margin-bottom: 55px;
}


/* =========================================================
   KICKER
========================================================= */

.scrap-faq-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    padding-top: 9px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.6px;

    color: #71808A;
}


.scrap-faq-kicker span {

    color: #B88932;

    font-size: 12px;
}


.scrap-faq-kicker i {

    display: block;

    width: 38px;

    height: 1px;

    background: #B88932;
}


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

.scrap-faq-heading {

    max-width: 760px;
}


.scrap-faq-heading h2 {

    margin: 0;

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

    font-size:
        clamp(35px, 4.5vw, 58px);

    line-height: 1.02;

    font-weight: 500;

    letter-spacing: -2px;

    color: #102D42;
}


.scrap-faq-heading h2 strong {

    display: block;

    font-weight: 700;

    color: #B88932;
}


.scrap-faq-heading p {

    max-width: 680px;

    margin: 22px 0 0;

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

    font-size: 13px;

    line-height: 1.8;

    color: #687983;
}


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

.scrap-faq-list {

    position: relative;

    z-index: 2;

    max-width: 1000px;

    margin: 0 auto;
}


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

.scrap-faq-item {

    position: relative;

    margin-bottom: 10px;

    background: #FFFFFF;

    border:
        1px solid
        #E3E8EA;

    transition:
        border-color .3s ease,
        box-shadow .3s ease,
        transform .3s ease;
}


.scrap-faq-item:hover {

    border-color:
        rgba(184,137,50,.30);

    box-shadow:
        0 10px 30px
        rgba(16,45,66,.055);
}


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

.scrap-faq-question {

    width: 100%;

    display: grid;

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

    align-items: center;

    gap: 18px;

    padding: 22px 25px;

    border: 0;

    background: transparent;

    text-align: left;

    cursor: pointer;

    color: #102D42;
}


/* remove bootstrap focus background */

.scrap-faq-question:focus {

    outline: none;
}


.scrap-faq-question:focus-visible {

    outline:
        2px solid
        rgba(184,137,50,.55);

    outline-offset: -2px;
}


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

.scrap-faq-number {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 38px;
    height: 38px;

    background: #102D42;

    color: #D6A84F;

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: .5px;

    transition:
        background .3s ease,
        color .3s ease;
}


.scrap-faq-item:hover .scrap-faq-number {

    background: #B88932;

    color: #FFFFFF;
}


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

.scrap-faq-question-text {

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

    font-size: 14px;

    line-height: 1.4;

    font-weight: 650;

    color: #18384D;

    transition:
        color .25s ease;
}


.scrap-faq-question:hover
.scrap-faq-question-text {

    color: #B88932;
}


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

.scrap-faq-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 32px;
    height: 32px;

    border:
        1px solid
        #DCE2E4;

    border-radius: 50%;

    color: #B88932;

    transition:
        transform .35s ease,
        background .3s ease,
        border-color .3s ease;
}


.scrap-faq-icon i {

    font-size: 14px;

    line-height: 1;
}


/* Bootstrap collapsed state */

.scrap-faq-question:not(.collapsed)
.scrap-faq-icon {

    transform: rotate(45deg);

    background: #102D42;

    border-color: #102D42;

    color: #D6A84F;
}


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

.scrap-faq-answer {

    padding:
        0 78px 25px 91px;

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

    font-size: 12px;

    line-height: 1.85;

    color: #687983;
}


.scrap-faq-answer strong {

    color: #18384D;

    font-weight: 700;
}


/* =========================================================
   ACTIVE ITEM
========================================================= */

.scrap-faq-item:has(
    .scrap-faq-question:not(.collapsed)
) {

    border-color:
        rgba(184,137,50,.35);

    box-shadow:
        0 12px 35px
        rgba(16,45,66,.065);
}


/* =========================================================
   FAQ FOOTER
========================================================= */

.scrap-faq-footer {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

    max-width: 1000px;

    margin: 50px auto 0;

    padding-top: 25px;

    border-top:
        1px solid
        #DDE3E5;
}


.scrap-faq-footer > div span {

    display: block;

    margin-bottom: 6px;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.5px;

    color: #B88932;
}


.scrap-faq-footer p {

    margin: 0;

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

    font-size: 11px;

    color: #71808A;
}


/* =========================================================
   FAQ CONTACT BUTTON
========================================================= */

.scrap-faq-footer > a {

    display: inline-flex;

    align-items: center;

    gap: 12px;

    padding: 13px 19px;

    background: #102D42;

    color: #FFFFFF;

    text-decoration: none;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: .4px;

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


.scrap-faq-footer > a i {

    color: #D6A84F;

    transition:
        transform .3s ease;
}


.scrap-faq-footer > a:hover {

    background: #183D55;

    transform: translateY(-2px);

    box-shadow:
        0 8px 20px
        rgba(16,45,66,.14);
}


.scrap-faq-footer > a:hover i {

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


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

@media (max-width: 991px) {

    .scrap-faq-header {

        grid-template-columns: 1fr;

        gap: 20px;

        margin-bottom: 45px;
    }


    .scrap-faq-list,
    .scrap-faq-footer {

        max-width: 100%;
    }

}


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

@media (max-width: 767px) {

    .scrap-faq-section {

        padding: 75px 0 65px;
    }


    .scrap-faq-heading h2 {

        font-size: 35px;

        letter-spacing: -1.2px;
    }


    .scrap-faq-heading p {

        font-size: 12px;

        line-height: 1.7;
    }


    .scrap-faq-question {

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

        gap: 12px;

        padding: 18px 16px;
    }


    .scrap-faq-number {

        width: 34px;
        height: 34px;
    }


    .scrap-faq-question-text {

        font-size: 12px;

        line-height: 1.45;
    }


    .scrap-faq-icon {

        width: 28px;
        height: 28px;
    }


    .scrap-faq-answer {

        padding:
            0 20px 21px 66px;

        font-size: 11px;

        line-height: 1.75;
    }


    .scrap-faq-footer {

        flex-direction: column;

        align-items: flex-start;

        gap: 20px;

        margin-top: 35px;
    }


    .scrap-faq-footer > a {

        width: 100%;

        justify-content: center;
    }

}
/* =========================================================
   02 — ABOUT AJM GLOBAL
   ABOUT INTRO SECTION
========================================================= */

.ajm-about-intro {

    position: relative;

    padding: 110px 0 0;

    background:
        linear-gradient(
            135deg,
            #f7f8f7 0%,
            #ffffff 48%,
            #eef3f5 100%
        );

    color: #102d42;

    overflow: hidden;
}


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

.about-intro-grid {

    position: absolute;

    inset: 0;

    background-image:
        linear-gradient(
            rgba(16, 45, 66, 0.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(16, 45, 66, 0.035) 1px,
            transparent 1px
        );

    background-size: 55px 55px;

    mask-image:
        linear-gradient(
            to bottom,
            rgba(0,0,0,0.9),
            transparent 90%
        );

    pointer-events: none;
}


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

.about-intro-glow {

    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    filter: blur(5px);

    opacity: 0.7;
}


/* GOLD */

.about-intro-glow-one {

    width: 360px;
    height: 360px;

    top: -180px;
    right: -80px;

    background:
        radial-gradient(
            circle,
            rgba(214, 168, 79, 0.13) 0%,
            rgba(214, 168, 79, 0.04) 45%,
            transparent 72%
        );

    animation:
        aboutGlowFloat 10s ease-in-out infinite;
}


/* BLUE */

.about-intro-glow-two {

    width: 300px;
    height: 300px;

    bottom: -160px;
    left: -100px;

    background:
        radial-gradient(
            circle,
            rgba(49, 108, 145, 0.10) 0%,
            rgba(49, 108, 145, 0.035) 48%,
            transparent 72%
        );

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


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

.about-intro-header {

    position: relative;

    display: grid;

    grid-template-columns: 220px 1fr;

    gap: 60px;

    align-items: start;

    margin-bottom: 65px;
}


/* =========================================================
   KICKER
========================================================= */

.about-intro-kicker {

    display: flex;

    align-items: center;

    gap: 14px;

    padding-top: 10px;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 2px;

    color: #315d73;
}


.about-intro-kicker span {

    display: inline-flex;

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

    width: 34px;
    height: 34px;

    border: 1px solid rgba(214, 168, 79, 0.65);

    color: #102d42;

    font-size: 11px;

    letter-spacing: 0;
}


.about-intro-kicker i {

    display: block;

    width: 32px;
    height: 1px;

    background: #d6a84f;
}


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

.about-intro-heading h2 {

    max-width: 850px;

    margin: 0;

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

    font-size: clamp(
        34px,
        4vw,
        58px
    );

    line-height: 1.08;

    font-weight: 500;

    letter-spacing: -1.8px;

    color: #102d42;
}


.about-intro-heading h2 strong {

    display: block;

    color: #315d73;

    font-weight: 800;
}


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

.about-intro-main {

    position: relative;

    display: grid;

    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);

    gap: 90px;

    align-items: start;
}


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

.about-intro-content {

    max-width: 760px;
}


.about-intro-content p {

    margin: 0 0 22px;

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

    font-size: 16px;

    line-height: 1.85;

    color: #536673;
}


.about-intro-content .about-intro-lead {

    margin-bottom: 28px;

    font-size: 20px;

    line-height: 1.7;

    color: #243f55;
}


.about-intro-content strong {

    color: #102d42;

    font-weight: 700;
}


/* =========================================================
   HIGHLIGHT
========================================================= */

.about-intro-highlight {

    position: relative;

    display: flex;

    align-items: center;

    gap: 18px;

    margin-top: 38px;

    padding: 20px 24px;

    max-width: 470px;

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

    border-left: 3px solid #d6a84f;

    box-shadow:
        0 15px 45px rgba(16,45,66,0.07);

    backdrop-filter: blur(8px);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}


.about-intro-highlight:hover {

    transform: translateX(6px);

    box-shadow:
        0 20px 55px rgba(16,45,66,0.11);
}


.about-intro-highlight > i {

    display: flex;

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

    width: 40px;
    height: 40px;

    flex-shrink: 0;

    border-radius: 50%;

    background: #102d42;

    color: #d6a84f;

    font-size: 17px;
}


.about-intro-highlight span {

    display: block;

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

    font-size: 12px;

    line-height: 1.5;

    letter-spacing: 1.3px;

    text-transform: uppercase;

    color: #657783;
}


.about-intro-highlight span strong {

    display: block;

    margin-top: 3px;

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

    font-size: 14px;

    letter-spacing: 0.5px;

    color: #102d42;
}


/* =========================================================
   RIGHT FEATURES
========================================================= */

.about-intro-side {

    display: flex;

    flex-direction: column;

    border-top: 1px solid rgba(16,45,66,0.12);
}


/* =========================================================
   FEATURE
========================================================= */

.about-intro-feature {

    position: relative;

    display: grid;

    grid-template-columns: 54px 1fr;

    gap: 18px;

    padding: 25px 0;

    border-bottom: 1px solid rgba(16,45,66,0.12);

    transition:
        padding-left 0.35s ease,
        background 0.35s ease;
}


.about-intro-feature:hover {

    padding-left: 10px;
}


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

.about-feature-icon {

    display: flex;

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

    width: 54px;
    height: 54px;

    border: 1px solid rgba(214,168,79,0.55);

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

    color: #d6a84f;

    font-size: 21px;

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


.about-intro-feature:hover .about-feature-icon {

    background: #102d42;

    color: #d6a84f;

    transform: rotate(-4deg);
}


/* =========================================================
   FEATURE TEXT
========================================================= */

.about-intro-feature span {

    display: block;

    margin-bottom: 6px;

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.8px;

    color: #d6a84f;
}


.about-intro-feature h3 {

    margin: 0;

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

    font-size: 17px;

    line-height: 1.4;

    font-weight: 700;

    color: #102d42;
}


/* =========================================================
   BOTTOM SERVICE STRIP
========================================================= */

.about-intro-bottom {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-wrap: wrap;

    gap: 18px;

    margin-top: 85px;

    padding: 25px 0;

    border-top: 1px solid rgba(16,45,66,0.13);
}


.about-intro-bottom span {

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.5px;

    color: #315d73;

    transition: color 0.3s ease;
}


.about-intro-bottom span:hover {

    color: #d6a84f;
}


.about-intro-bottom i {

    width: 4px;
    height: 4px;

    border-radius: 50%;

    background: #d6a84f;

    opacity: 0.75;
}


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

@keyframes aboutGlowFloat {

    0%,
    100% {

        transform:
            translate3d(0, 0, 0)
            scale(1);

    }

    50% {

        transform:
            translate3d(-35px, 25px, 0)
            scale(1.08);

    }

}


@keyframes aboutGlowFloatReverse {

    0%,
    100% {

        transform:
            translate3d(0, 0, 0)
            scale(1);

    }

    50% {

        transform:
            translate3d(30px, -25px, 0)
            scale(1.1);

    }

}


/* =========================================================
   RESPONSIVE — TABLET
========================================================= */

@media (max-width: 991px) {

    .ajm-about-intro {

        padding-top: 90px;

    }


    .about-intro-header {

        grid-template-columns: 1fr;

        gap: 25px;

        margin-bottom: 50px;

    }


    .about-intro-kicker {

        padding-top: 0;

    }


    .about-intro-main {

        grid-template-columns: 1fr;

        gap: 55px;

    }


    .about-intro-content {

        max-width: 850px;

    }


    .about-intro-side {

        max-width: 700px;

    }


    .about-intro-bottom {

        margin-top: 65px;

    }

}


/* =========================================================
   RESPONSIVE — MOBILE
========================================================= */

@media (max-width: 575px) {

    .ajm-about-intro {

        padding-top: 70px;

    }


    .about-intro-header {

        margin-bottom: 38px;

    }


    .about-intro-heading h2 {

        font-size: 32px;

        letter-spacing: -1px;

    }


    .about-intro-content .about-intro-lead {

        font-size: 17px;

        line-height: 1.65;

    }


    .about-intro-content p {

        font-size: 14px;

        line-height: 1.75;

    }


    .about-intro-main {

        gap: 40px;

    }


    .about-intro-feature {

        grid-template-columns: 45px 1fr;

        gap: 14px;

        padding: 20px 0;

    }


    .about-feature-icon {

        width: 45px;
        height: 45px;

        font-size: 18px;

    }


    .about-intro-feature h3 {

        font-size: 15px;

    }


    .about-intro-bottom {

        justify-content: flex-start;

        gap: 12px;

        margin-top: 45px;

        padding: 20px 0;

    }


    .about-intro-bottom span {

        font-size: 8px;

    }


    .about-intro-bottom i {

        display: none;

    }

}
/* =========================================================
   03 — WHAT WE DO
   ABOUT SERVICES SECTION
========================================================= */

.ajm-about-services {

    position: relative;

    padding: 110px 0 0;

    color: #102d42;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f5f8f9 52%,
            #edf3f5 100%
        );

    overflow: hidden;
}


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

.about-services-grid {

    position: absolute;

    inset: 0;

    background-image:
        linear-gradient(
            rgba(16,45,66,0.025) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(16,45,66,0.025) 1px,
            transparent 1px
        );

    background-size: 60px 60px;

    mask-image:
        linear-gradient(
            to bottom,
            rgba(0,0,0,0.8),
            transparent 90%
        );

    pointer-events: none;
}


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

.about-services-header {

    position: relative;

    display: grid;

    grid-template-columns: 220px minmax(0,1fr);

    gap: 60px;

    align-items: start;

    margin-bottom: 60px;
}


/* =========================================================
   KICKER
========================================================= */

.about-services-kicker {

    display: flex;

    align-items: center;

    gap: 14px;

    padding-top: 10px;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 2px;

    color: #315d73;
}


.about-services-kicker span {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: 34px;
    height: 34px;

    border: 1px solid rgba(214,168,79,0.65);

    color: #102d42;

    font-size: 11px;

    letter-spacing: 0;
}


.about-services-kicker i {

    display: block;

    width: 32px;
    height: 1px;

    background: #d6a84f;
}


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

.about-services-heading {

    max-width: 900px;
}


.about-services-heading h2 {

    margin: 0 0 20px;

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

    font-size: clamp(
        34px,
        4vw,
        56px
    );

    line-height: 1.08;

    font-weight: 500;

    letter-spacing: -1.7px;

    color: #102d42;
}


.about-services-heading h2 strong {

    display: block;

    font-weight: 800;

    color: #315d73;
}


.about-services-heading p {

    max-width: 760px;

    margin: 0;

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

    font-size: 16px;

    line-height: 1.8;

    color: #5a6d78;
}


/* =========================================================
   SERVICE GRID
========================================================= */

.about-services-grid-list {

    position: relative;

    display: grid;

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

    gap: 18px;
}


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

.about-service-card {

    position: relative;

    display: grid;

    grid-template-columns:
        34px 54px minmax(0,1fr) 28px;

    gap: 18px;

    align-items: center;

    min-height: 190px;

    padding: 28px 28px;

    text-decoration: none;

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

    border: 1px solid rgba(16,45,66,0.09);

    box-shadow:
        0 12px 35px rgba(16,45,66,0.045);

    overflow: hidden;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease,
        background 0.35s ease;
}


.about-service-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 3px;
    height: 0;

    background: #d6a84f;

    transition:
        height 0.4s ease;
}


.about-service-card:hover {

    transform: translateY(-5px);

    background: #ffffff;

    border-color:
        rgba(214,168,79,0.38);

    box-shadow:
        0 22px 55px rgba(16,45,66,0.10);
}


.about-service-card:hover::before {

    height: 100%;
}


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

.about-service-number {

    align-self: start;

    padding-top: 3px;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1px;

    color: #9aa8ae;
}


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

.about-service-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 54px;
    height: 54px;

    border: 1px solid
        rgba(214,168,79,0.55);

    background:
        rgba(248,250,250,0.9);

    color: #315d73;

    font-size: 21px;

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


.about-service-card:hover .about-service-icon {

    background: #102d42;

    color: #d6a84f;

    transform:
        rotate(-4deg)
        scale(1.04);
}


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

.about-service-content span {

    display: block;

    margin-bottom: 7px;

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.7px;

    color: #d6a84f;
}


.about-service-content h3 {

    margin: 0 0 9px;

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

    font-size: 18px;

    line-height: 1.35;

    font-weight: 700;

    color: #102d42;
}


.about-service-content p {

    margin: 0;

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

    font-size: 13px;

    line-height: 1.65;

    color: #657681;
}


/* =========================================================
   ARROW
========================================================= */

.about-service-arrow {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 28px;
    height: 28px;

    border: 1px solid
        rgba(16,45,66,0.12);

    font-family: Arial, sans-serif;

    font-size: 15px;

    color: #315d73;

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


.about-service-card:hover .about-service-arrow {

    background: #d6a84f;

    border-color: #d6a84f;

    color: #102d42;

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


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

.about-services-bottom {

    position: relative;

    display: grid;

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

    gap: 35px;

    margin-top: 65px;

    padding: 30px 0 0;

    border-top: 1px solid
        rgba(16,45,66,0.12);
}


.about-services-bottom-line {

    position: relative;

    width: 65px;

    height: 2px;

    margin-top: 9px;

    background: #d6a84f;
}


.about-services-bottom-content {

    display: grid;

    grid-template-columns:
        180px minmax(0,1fr) auto;

    gap: 35px;

    align-items: center;
}


.about-services-bottom-content > span {

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.8px;

    color: #315d73;
}


.about-services-bottom-content p {

    max-width: 600px;

    margin: 0;

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

    font-size: 13px;

    line-height: 1.7;

    color: #667883;
}


.about-services-bottom-content a {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    white-space: nowrap;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 0.5px;

    color: #102d42;

    text-decoration: none;

    transition:
        color 0.3s ease;
}


.about-services-bottom-content a span {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: 30px;
    height: 30px;

    border: 1px solid
        rgba(214,168,79,0.65);

    color: #d6a84f;

    transition:
        background 0.3s ease,
        color 0.3s ease;
}


.about-services-bottom-content a:hover {

    color: #315d73;
}


.about-services-bottom-content a:hover span {

    background: #102d42;

    color: #d6a84f;
}


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

.about-services-glow {

    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    filter: blur(8px);
}


.about-services-glow-one {

    width: 340px;
    height: 340px;

    top: -160px;
    right: -100px;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,0.10),
            rgba(214,168,79,0.025) 48%,
            transparent 72%
        );

    animation:
        aboutServicesFloat 11s ease-in-out infinite;
}


.about-services-glow-two {

    width: 280px;
    height: 280px;

    bottom: -150px;
    left: -90px;

    background:
        radial-gradient(
            circle,
            rgba(49,108,145,0.09),
            rgba(49,108,145,0.025) 50%,
            transparent 72%
        );

    animation:
        aboutServicesFloatReverse 13s ease-in-out infinite;
}


@keyframes aboutServicesFloat {

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

    50% {
        transform:
            translate3d(-25px,25px,0)
            scale(1.08);
    }
}


@keyframes aboutServicesFloatReverse {

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

    50% {
        transform:
            translate3d(25px,-20px,0)
            scale(1.08);
    }
}


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

@media (max-width: 991px) {

    .ajm-about-services {

        padding-top: 90px;

    }


    .about-services-header {

        grid-template-columns: 1fr;

        gap: 25px;

        margin-bottom: 50px;

    }


    .about-services-kicker {

        padding-top: 0;

    }


    .about-services-grid-list {

        grid-template-columns: 1fr;

    }


    .about-services-bottom {

        grid-template-columns: 80px minmax(0,1fr);

    }


    .about-services-bottom-content {

        grid-template-columns: 1fr;

        gap: 15px;

    }

}


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

@media (max-width: 575px) {

    .ajm-about-services {

        padding-top: 70px;

    }


    .about-services-heading h2 {

        font-size: 32px;

        letter-spacing: -1px;

    }


    .about-services-heading p {

        font-size: 14px;

        line-height: 1.75;

    }


    .about-service-card {

        grid-template-columns:
            30px 45px minmax(0,1fr);

        gap: 13px;

        min-height: auto;

        padding: 22px 18px;

    }


    .about-service-icon {

        width: 45px;
        height: 45px;

        font-size: 18px;

    }


    .about-service-content h3 {

        font-size: 15px;

    }


    .about-service-content p {

        font-size: 12px;

        line-height: 1.6;

    }


    .about-service-arrow {

        position: absolute;

        top: 18px;
        right: 18px;

        width: 25px;
        height: 25px;

        font-size: 13px;

    }


    .about-services-bottom {

        grid-template-columns: 45px minmax(0,1fr);

        gap: 20px;

        margin-top: 45px;

    }


    .about-services-bottom-line {

        width: 35px;

    }


    .about-services-bottom-content {

        gap: 14px;

    }


    .about-services-bottom-content p {

        font-size: 12px;

    }


    .about-services-bottom-content a {

        font-size: 10px;

    }

}
/* =========================================================
   04 — WHY AJM GLOBAL
   FINAL ABOUT SECTION
========================================================= */

.ajm-about-final {

    position: relative;

    padding: 110px 0 0;

    background:
        linear-gradient(
            135deg,
            #f8faf9 0%,
            #ffffff 48%,
            #edf3f5 100%
        );

    color: #102d42;

    overflow: hidden;
}


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

.about-final-grid {

    position: absolute;

    inset: 0;

    background-image:
        linear-gradient(
            rgba(16,45,66,0.025) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(16,45,66,0.025) 1px,
            transparent 1px
        );

    background-size: 60px 60px;

    mask-image:
        linear-gradient(
            to bottom,
            rgba(0,0,0,0.65),
            transparent 92%
        );

    pointer-events: none;
}


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

.about-final-glow {

    position: absolute;

    width: 500px;
    height: 500px;

    right: -220px;
    top: -180px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(214,168,79,0.11) 0%,
            rgba(214,168,79,0.035) 42%,
            transparent 72%
        );

    filter: blur(8px);

    pointer-events: none;

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


@keyframes aboutFinalGlow {

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

    50% {
        transform:
            translate3d(-35px,30px,0)
            scale(1.08);
    }

}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.about-final-main {

    position: relative;

    display: grid;

    grid-template-columns:
        minmax(0,1.25fr)
        minmax(320px,0.75fr);

    gap: 90px;

    align-items: start;
}


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

.about-final-content {

    max-width: 780px;
}


/* =========================================================
   KICKER
========================================================= */

.about-final-kicker {

    display: flex;

    align-items: center;

    gap: 14px;

    margin-bottom: 28px;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 2px;

    color: #315d73;
}


.about-final-kicker span {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: 34px;
    height: 34px;

    border: 1px solid
        rgba(214,168,79,0.65);

    color: #102d42;

    font-size: 11px;

    letter-spacing: 0;
}


.about-final-kicker i {

    width: 32px;
    height: 1px;

    background: #d6a84f;
}


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

.about-final-content h2 {

    margin: 0 0 24px;

    max-width: 760px;

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

    font-size: clamp(
        35px,
        4vw,
        56px
    );

    line-height: 1.08;

    font-weight: 500;

    letter-spacing: -1.7px;

    color: #102d42;
}


.about-final-content h2 strong {

    display: block;

    font-weight: 800;

    color: #315d73;
}


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

.about-final-content > p {

    max-width: 720px;

    margin: 0 0 38px;

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

    font-size: 16px;

    line-height: 1.85;

    color: #5a6d78;
}


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

.about-final-points {

    display: flex;

    flex-direction: column;

    border-top: 1px solid
        rgba(16,45,66,0.12);
}


.about-final-points > div {

    display: grid;

    grid-template-columns: 42px minmax(0,1fr);

    gap: 18px;

    padding: 20px 0;

    border-bottom: 1px solid
        rgba(16,45,66,0.12);

    transition:
        padding-left 0.3s ease,
        background 0.3s ease;
}


.about-final-points > div:hover {

    padding-left: 8px;
}


/* NUMBER */

.about-final-points > div > span {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 34px;
    height: 34px;

    border: 1px solid
        rgba(214,168,79,0.55);

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

    font-size: 10px;

    font-weight: 700;

    color: #315d73;
}


/* POINT TITLE */

.about-final-points strong {

    display: block;

    margin-bottom: 5px;

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

    font-size: 14px;

    font-weight: 700;

    color: #102d42;
}


/* POINT DESCRIPTION */

.about-final-points p {

    margin: 0;

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

    font-size: 12px;

    line-height: 1.65;

    color: #6a7c85;
}


/* =========================================================
   RIGHT LOCATION PANEL
========================================================= */

.about-final-location {

    position: relative;

    padding: 32px;

    background:
        linear-gradient(
            145deg,
            #102d42 0%,
            #173d55 100%
        );

    color: #ffffff;

    box-shadow:
        0 25px 65px
        rgba(16,45,66,0.16);

    overflow: hidden;
}


/* subtle inner line */

.about-final-location::before {

    content: "";

    position: absolute;

    inset: 10px;

    border: 1px solid
        rgba(214,168,79,0.18);

    pointer-events: none;
}


/* gold corner */

.about-final-location::after {

    content: "";

    position: absolute;

    width: 70px;
    height: 70px;

    right: -35px;
    bottom: -35px;

    border-radius: 50%;

    border: 1px solid
        rgba(214,168,79,0.35);

    pointer-events: none;
}


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

.about-final-location-label {

    position: relative;

    display: block;

    margin-bottom: 18px;

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2px;

    color: #d6a84f;
}


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

.about-final-location-heading {

    position: relative;

    display: flex;

    align-items: baseline;

    gap: 12px;

    margin-bottom: 25px;

    padding-bottom: 20px;

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


.about-final-location-heading strong {

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

    font-size: 64px;

    line-height: 0.9;

    font-weight: 800;

    letter-spacing: -3px;

    color: #ffffff;
}


.about-final-location-heading span {

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.8px;

    color: #9fb0ba;
}


/* =========================================================
   EMIRATES
========================================================= */

.about-final-emirates {

    position: relative;

    display: flex;

    flex-direction: column;
}


.about-final-emirates a {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 13px 0;

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

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

    font-size: 13px;

    font-weight: 500;

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

    text-decoration: none;

    transition:
        color 0.3s ease,
        padding-left 0.3s ease;
}


.about-final-emirates a:last-child {

    border-bottom: 0;

}


.about-final-emirates a span {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 25px;
    height: 25px;

    border: 1px solid
        rgba(214,168,79,0.35);

    color: #d6a84f;

    font-size: 12px;

    transition:
        background 0.3s ease,
        color 0.3s ease;
}


.about-final-emirates a:hover {

    padding-left: 7px;

    color: #ffffff;
}


.about-final-emirates a:hover span {

    background: #d6a84f;

    color: #102d42;
}


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

.about-final-bottom {

    position: relative;

    display: flex;

    align-items: center;

    gap: 20px;

    margin-top: 75px;

    padding: 27px 0;

    border-top: 1px solid
        rgba(16,45,66,0.13);
}


.about-final-bottom span {

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.7px;

    color: #315d73;
}


.about-final-bottom i {

    width: 35px;
    height: 1px;

    background: #d6a84f;
}


.about-final-bottom strong {

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.3px;

    color: #102d42;
}


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

@media (max-width: 991px) {

    .ajm-about-final {

        padding-top: 90px;

    }


    .about-final-main {

        grid-template-columns: 1fr;

        gap: 55px;

    }


    .about-final-content {

        max-width: 850px;

    }


    .about-final-location {

        max-width: 650px;

    }


    .about-final-bottom {

        margin-top: 60px;

    }

}


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

@media (max-width: 575px) {

    .ajm-about-final {

        padding-top: 70px;

    }


    .about-final-content h2 {

        font-size: 32px;

        letter-spacing: -1px;

    }


    .about-final-content > p {

        font-size: 14px;

        line-height: 1.75;

    }


    .about-final-points > div {

        grid-template-columns: 36px minmax(0,1fr);

        gap: 14px;

        padding: 17px 0;

    }


    .about-final-points > div > span {

        width: 30px;
        height: 30px;

        font-size: 9px;

    }


    .about-final-points strong {

        font-size: 13px;

    }


    .about-final-points p {

        font-size: 11px;

    }


    .about-final-location {

        padding: 25px 20px;

    }


    .about-final-location-heading strong {

        font-size: 54px;

    }


    .about-final-emirates a {

        font-size: 12px;

        padding: 12px 0;

    }


    .about-final-bottom {

        flex-wrap: wrap;

        gap: 10px;

        margin-top: 45px;

        padding: 22px 0;

    }


    .about-final-bottom i {

        width: 20px;

    }


    .about-final-bottom strong {

        width: 100%;

        font-size: 8px;

        line-height: 1.5;

    }

}
/* =========================================================
   02 — CONTACT & SCRAP ENQUIRY
========================================================= */

.ajm-contact-section {

    position: relative;

    padding: 110px 0 120px;

    background:
        linear-gradient(
            135deg,
            #f8faf9 0%,
            #ffffff 50%,
            #eef4f6 100%
        );

    color: #102d42;

    overflow: hidden;
}


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

.contact-bg-grid {

    position: absolute;

    inset: 0;

    background-image:
        linear-gradient(
            rgba(16,45,66,0.025) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(16,45,66,0.025) 1px,
            transparent 1px
        );

    background-size: 60px 60px;

    mask-image:
        linear-gradient(
            to bottom,
            rgba(0,0,0,0.7),
            transparent 90%
        );

    pointer-events: none;
}


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

.contact-heading {

    position: relative;

    margin-bottom: 65px;
}


.contact-kicker {

    display: flex;

    align-items: center;

    gap: 14px;

    margin-bottom: 27px;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 2px;

    color: #315d73;
}


.contact-kicker span {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: 34px;
    height: 34px;

    border: 1px solid
        rgba(214,168,79,0.65);

    color: #102d42;

    font-size: 11px;

    letter-spacing: 0;
}


.contact-kicker i {

    width: 32px;
    height: 1px;

    background: #d6a84f;
}


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

.contact-heading-grid {

    display: grid;

    grid-template-columns:
        minmax(0,1.15fr)
        minmax(280px,0.85fr);

    gap: 80px;

    align-items: end;
}


.contact-heading-grid h2 {

    margin: 0;

    max-width: 700px;

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

    font-size: clamp(
        36px,
        4vw,
        54px
    );

    line-height: 1.08;

    font-weight: 500;

    letter-spacing: -1.7px;

    color: #102d42;
}


.contact-heading-grid h2 strong {

    display: block;

    font-weight: 600;

    color: #315d73;
}


.contact-heading-grid > p {

    max-width: 460px;

    margin: 0;

    padding-left: 24px;

    border-left: 2px solid
        rgba(214,168,79,0.75);

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

    font-size: 14px;

    line-height: 1.8;

    color: #647681;
}


/* =========================================================
   MAIN CONTACT GRID
========================================================= */

.contact-main {

    position: relative;

    display: grid;

    grid-template-columns:
        minmax(0,0.85fr)
        minmax(0,1.15fr);

    gap: 70px;

    align-items: stretch;
}


/* =========================================================
   LEFT — CONTACT INFORMATION
========================================================= */

.contact-information {

    position: relative;

    padding: 38px 0;

    border-top: 1px solid
        rgba(16,45,66,0.13);

    border-bottom: 1px solid
        rgba(16,45,66,0.13);
}


.contact-info-label {

    display: block;

    margin-bottom: 18px;

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2px;

    color: #d09f43;
}


.contact-information h3 {

    max-width: 450px;

    margin: 0 0 18px;

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

    font-size: 30px;

    line-height: 1.2;

    font-weight: 500;

    letter-spacing: -0.8px;

    color: #102d42;
}


.contact-information h3 strong {

    font-weight: 800;

    color: #315d73;
}


.contact-info-text {

    max-width: 500px;

    margin: 0 0 35px;

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

    font-size: 13px;

    line-height: 1.8;

    color: #687a84;
}


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

.contact-detail {

    display: flex;

    align-items: flex-start;

    gap: 17px;

    padding: 17px 0;

    border-top: 1px solid
        rgba(16,45,66,0.08);
}


.contact-detail-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    flex: 0 0 38px;

    width: 38px;
    height: 38px;

    border: 1px solid
        rgba(214,168,79,0.45);

    color: #315d73;

    font-size: 15px;
}


.contact-detail > div:last-child {

    display: flex;

    flex-direction: column;

    gap: 5px;
}


.contact-detail span {

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.7px;

    color: #8a9aa2;
}


.contact-detail strong,
.contact-detail a {

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

    font-size: 13px;

    line-height: 1.65;

    font-weight: 600;

    color: #233f50;

    text-decoration: none;
}


.contact-detail a {

    transition: color 0.25s ease;
}


.contact-detail a:hover {

    color: #c7963e;
}


/* =========================================================
   UAE COVERAGE
========================================================= */

.contact-coverage {

    margin-top: 24px;

    padding: 18px 20px;

    background:
        rgba(16,45,66,0.035);

    border-left: 3px solid #d6a84f;
}


.contact-coverage span {

    display: block;

    margin-bottom: 9px;

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.6px;

    color: #315d73;
}


.contact-coverage strong {

    display: block;

    margin-top: 3px;

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

    font-size: 11px;

    line-height: 1.7;

    font-weight: 500;

    color: #637680;
}


/* =========================================================
   RIGHT — FORM WRAPPER
========================================================= */

.contact-form-wrap {

    position: relative;

    padding: 38px;

    background: #ffffff;

    border: 1px solid
        rgba(16,45,66,0.09);

    box-shadow:
        0 25px 65px
        rgba(16,45,66,0.08);

    overflow: hidden;
}


/* top gold line */

.contact-form-wrap::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 3px;

    background:
        linear-gradient(
            90deg,
            #d6a84f,
            #ead39a,
            transparent
        );
}


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

.contact-form-header {

    display: flex;

    align-items: baseline;

    justify-content: space-between;

    gap: 20px;

    margin-bottom: 28px;

    padding-bottom: 18px;

    border-bottom: 1px solid
        rgba(16,45,66,0.09);
}


.contact-form-header span {

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.8px;

    color: #315d73;
}


.contact-form-header p {

    margin: 0;

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

    font-size: 11px;

    color: #87959c;
}


/* =========================================================
   FORM
========================================================= */

.contact-form {

    display: flex;

    flex-direction: column;

    gap: 18px;
}


.contact-form-row {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 18px;
}


/* =========================================================
   FORM FIELD
========================================================= */

.contact-form-field {

    display: flex;

    flex-direction: column;

    gap: 7px;
}


.contact-form-field label {

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 0.8px;

    color: #315d73;
}


.contact-form-field input,
.contact-form-field select,
.contact-form-field textarea {

    width: 100%;

    padding: 12px 14px;

    border: 1px solid
        rgba(16,45,66,0.13);

    border-radius: 0;

    background: #fbfcfc;

    outline: none;

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

    font-size: 12px;

    color: #203d4d;

    transition:
        border-color 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease;
}


.contact-form-field input,
.contact-form-field select {

    height: 45px;
}


.contact-form-field textarea {

    min-height: 105px;

    resize: vertical;

    line-height: 1.6;
}


.contact-form-field input::placeholder,
.contact-form-field textarea::placeholder {

    color: #a3adb2;
}


.contact-form-field select {

    appearance: auto;

    cursor: pointer;
}


.contact-form-field input:focus,
.contact-form-field select:focus,
.contact-form-field textarea:focus {

    border-color:
        rgba(214,168,79,0.8);

    background: #ffffff;

    box-shadow:
        0 0 0 3px
        rgba(214,168,79,0.07);
}


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

.contact-submit {

    display: inline-flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    width: 100%;

    min-height: 52px;

    margin-top: 3px;

    padding: 0 18px 0 22px;

    border: 0;

    border-radius: 0;

    background:
        linear-gradient(
            135deg,
            #102d42,
            #23485d
        );

    color: #ffffff;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 0.8px;

    cursor: pointer;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}


.contact-submit i {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 31px;
    height: 31px;

    border: 1px solid
        rgba(214,168,79,0.5);

    color: #d6a84f;

    font-size: 13px;

    transition:
        background 0.3s ease,
        color 0.3s ease;
}


.contact-submit:hover {

    transform: translateY(-2px);

    background:
        linear-gradient(
            135deg,
            #173d55,
            #315d73
        );

    box-shadow:
        0 12px 28px
        rgba(16,45,66,0.16);
}


.contact-submit:hover i {

    background: #d6a84f;

    color: #102d42;
}


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

@media (max-width: 991px) {

    .ajm-contact-section {

        padding: 90px 0 100px;

    }


    .contact-heading-grid {

        grid-template-columns: 1fr;

        gap: 25px;

    }


    .contact-heading-grid > p {

        max-width: 600px;

    }


    .contact-main {

        grid-template-columns: 1fr;

        gap: 55px;

    }


    .contact-information {

        max-width: 700px;

    }

}


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

@media (max-width: 575px) {

    .ajm-contact-section {

        padding: 70px 0 80px;

    }


    .contact-heading {

        margin-bottom: 45px;

    }


    .contact-heading-grid h2 {

        font-size: 32px;

        letter-spacing: -1px;

    }


    .contact-heading-grid > p {

        padding-left: 17px;

        font-size: 13px;

    }


    .contact-information {

        padding: 30px 0;

    }


    .contact-information h3 {

        font-size: 25px;

    }


    .contact-info-text {

        font-size: 12px;

    }


    .contact-form-wrap {

        padding: 25px 18px;

    }


    .contact-form-header {

        display: block;

    }


    .contact-form-header p {

        margin-top: 8px;

    }


    .contact-form-row {

        grid-template-columns: 1fr;

        gap: 18px;

    }


    .contact-form {

        gap: 16px;

    }


    .contact-coverage {

        padding: 16px;

    }

}
/* =========================================================
   03 — OUR LOCATION
========================================================= */

.ajm-contact-location {

    position: relative;

    padding: 105px 0 0;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f7faf9 55%,
            #edf3f5 100%
        );

    color: #102d42;

    overflow: hidden;
}


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

.contact-location-bg {

    position: absolute;

    inset: 0;

    background-image:
        linear-gradient(
            rgba(16,45,66,0.022) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(16,45,66,0.022) 1px,
            transparent 1px
        );

    background-size: 65px 65px;

    mask-image:
        linear-gradient(
            to bottom,
            rgba(0,0,0,0.65),
            transparent 88%
        );

    pointer-events: none;
}


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

.contact-location-heading {

    position: relative;

    margin-bottom: 55px;
}


.contact-location-kicker {

    display: flex;

    align-items: center;

    gap: 14px;

    margin-bottom: 27px;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 2px;

    color: #315d73;
}


.contact-location-kicker span {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: 34px;
    height: 34px;

    border: 1px solid
        rgba(214,168,79,0.65);

    color: #102d42;

    font-size: 11px;

    letter-spacing: 0;
}


.contact-location-kicker i {

    width: 32px;
    height: 1px;

    background: #d6a84f;
}


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

.contact-location-title {

    display: grid;

    grid-template-columns:
        minmax(0,1.05fr)
        minmax(280px,0.95fr);

    gap: 80px;

    align-items: end;
}


.contact-location-title h2 {

    margin: 0;

    max-width: 650px;

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

    font-size: clamp(
        36px,
        4vw,
        54px
    );

    line-height: 1.08;

    font-weight: 500;

    letter-spacing: -1.6px;

    color: #102d42;
}


.contact-location-title h2 strong {

    display: block;

    font-weight: 800;

    color: #315d73;
}


.contact-location-title p {

    max-width: 480px;

    margin: 0;

    padding-left: 24px;

    border-left: 2px solid
        rgba(214,168,79,0.75);

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

    font-size: 13px;

    line-height: 1.85;

    color: #687a84;
}


/* =========================================================
   MAIN LOCATION GRID
========================================================= */

.contact-location-main {

    position: relative;

    display: grid;

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

    min-height: 430px;

    background: #ffffff;

    border: 1px solid
        rgba(16,45,66,0.08);

    box-shadow:
        0 25px 65px
        rgba(16,45,66,0.07);

    overflow: hidden;
}


/* =========================================================
   LEFT LOCATION INFO
========================================================= */

.contact-location-info {

    position: relative;

    display: flex;

    flex-direction: column;

    padding: 40px;

    background:
        linear-gradient(
            145deg,
            #f8faf9 0%,
            #ffffff 100%
        );

    z-index: 2;
}


.location-info-label {

    display: block;

    margin-bottom: 28px;

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2px;

    color: #d09f43;
}


/* =========================================================
   ADDRESS
========================================================= */

.location-address {

    display: flex;

    align-items: flex-start;

    gap: 18px;

    padding-bottom: 30px;

    border-bottom: 1px solid
        rgba(16,45,66,0.10);
}


.location-address > i {

    display: flex;

    align-items: center;

    justify-content: center;

    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    border: 1px solid
        rgba(214,168,79,0.55);

    color: #315d73;

    font-size: 17px;
}


.location-address > div {

    display: flex;

    flex-direction: column;

    gap: 7px;
}


.location-address span {

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.6px;

    color: #87959c;
}


.location-address strong {

    max-width: 280px;

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

    font-size: 14px;

    line-height: 1.75;

    font-weight: 600;

    color: #203d4d;
}


/* =========================================================
   LOCATION META
========================================================= */

.location-meta {

    display: flex;

    flex-direction: column;

    margin-top: 24px;
}


.location-meta > div {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    padding: 10px 0;

}


.location-meta span {

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

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.3px;

    color: #9aa6ac;
}


.location-meta strong {

    text-align: right;

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

    font-size: 10px;

    font-weight: 600;

    color: #526873;
}


/* =========================================================
   GET DIRECTIONS
========================================================= */

.location-map-button {

    display: inline-flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    width: 100%;

    min-height: 48px;

    margin-top: auto;

    padding: 0 14px 0 18px;

    background: #102d42;

    color: #ffffff;

    text-decoration: none;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 0.8px;

    transition:
        background 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.location-map-button i {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 28px;
    height: 28px;

    border: 1px solid
        rgba(214,168,79,0.55);

    color: #d6a84f;

    font-size: 12px;

    transition:
        background 0.3s ease,
        color 0.3s ease;
}


.location-map-button:hover {

    background: #23485d;

    transform: translateY(-2px);

    box-shadow:
        0 10px 25px
        rgba(16,45,66,0.14);

    color: #ffffff;
}


.location-map-button:hover i {

    background: #d6a84f;

    color: #102d42;
}


/* =========================================================
   MAP
========================================================= */

.contact-location-map {

    position: relative;

    min-height: 430px;

    background:
        #dfe7e9;

    overflow: hidden;
}


/* =========================================================
   MAP PLACEHOLDER
========================================================= */

.location-map-placeholder {

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            135deg,
            #dce5e8 0%,
            #edf2f3 48%,
            #d6e0e3 100%
        );

    overflow: hidden;
}


/* =========================================================
   MAP GRID
========================================================= */

.map-grid {

    position: absolute;

    inset: -20%;

    background-image:
        linear-gradient(
            32deg,
            transparent 47%,
            rgba(255,255,255,0.8) 48%,
            rgba(255,255,255,0.8) 51%,
            transparent 52%
        ),
        linear-gradient(
            125deg,
            transparent 45%,
            rgba(255,255,255,0.65) 46%,
            rgba(255,255,255,0.65) 49%,
            transparent 50%
        ),
        linear-gradient(
            90deg,
            rgba(16,45,66,0.045) 1px,
            transparent 1px
        ),
        linear-gradient(
            rgba(16,45,66,0.045) 1px,
            transparent 1px
        );

    background-size:
        260px 180px,
        320px 230px,
        70px 70px,
        70px 70px;

    transform:
        rotate(-4deg)
        scale(1.15);

    opacity: 0.8;
}


/* =========================================================
   MAP PIN
========================================================= */

.map-pin {

    position: absolute;

    top: 50%;
    left: 50%;

    display: flex;

    flex-direction: column;

    align-items: center;

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

    text-align: center;

    animation:
        mapPinFloat 4s ease-in-out infinite;
}


.map-pin > span {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 62px;
    height: 62px;

    margin-bottom: 14px;

    border-radius: 50%;

    background: #102d42;

    color: #d6a84f;

    font-size: 25px;

    box-shadow:
        0 12px 30px
        rgba(16,45,66,0.25);

    position: relative;
}


.map-pin > span::after {

    content: "";

    position: absolute;

    width: 84px;
    height: 84px;

    border: 1px solid
        rgba(214,168,79,0.35);

    border-radius: 50%;

    animation:
        mapPinPulse 2.8s ease-out infinite;
}


.map-pin strong {

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

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

    color: #102d42;
}


.map-pin small {

    margin-top: 4px;

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

    font-size: 9px;

    font-weight: 600;

    letter-spacing: 1.2px;

    color: #5d707a;
}


@keyframes mapPinFloat {

    0%,
    100% {
        transform:
            translate(-50%,-50%);
    }

    50% {
        transform:
            translate(-50%,calc(-50% - 8px));
    }

}


@keyframes mapPinPulse {

    0% {
        transform: scale(0.7);
        opacity: 0.7;
    }

    70% {
        transform: scale(1.15);
        opacity: 0;
    }

    100% {
        transform: scale(1.15);
        opacity: 0;
    }

}


/* =========================================================
   BOTTOM LOCATION STRIP
========================================================= */

.contact-location-bottom {

    position: relative;

    display: flex;

    align-items: center;

    gap: 20px;

    padding: 26px 0;

}


.contact-location-bottom span {

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.7px;

    color: #315d73;
}


.contact-location-bottom i {

    width: 35px;
    height: 1px;

    background: #d6a84f;
}


.contact-location-bottom strong {

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.2px;

    color: #102d42;
}


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

@media (max-width: 991px) {

    .ajm-contact-location {

        padding-top: 90px;

    }


    .contact-location-title {

        grid-template-columns: 1fr;

        gap: 25px;

    }


    .contact-location-main {

        grid-template-columns: 1fr;

    }


    .contact-location-info {

        min-height: auto;

    }


    .contact-location-map {

        min-height: 380px;

    }

}


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

@media (max-width: 575px) {

    .ajm-contact-location {

        padding-top: 70px;

    }


    .contact-location-heading {

        margin-bottom: 40px;

    }


    .contact-location-title h2 {

        font-size: 32px;

        letter-spacing: -1px;

    }


    .contact-location-title p {

        padding-left: 17px;

        font-size: 12px;

    }


    .contact-location-info {

        padding: 28px 20px;

    }


    .location-address {

        gap: 13px;

    }


    .location-address > i {

        flex-basis: 36px;

        width: 36px;
        height: 36px;

        font-size: 14px;

    }


    .location-address strong {

        font-size: 12px;

    }


    .location-meta > div {

        align-items: flex-start;

        flex-direction: column;

        gap: 3px;

    }


    .location-meta strong {

        text-align: left;

    }


    .contact-location-map {

        min-height: 320px;

    }


    .contact-location-bottom {

        flex-wrap: wrap;

        gap: 10px;

        padding: 22px 0;

    }


    .contact-location-bottom i {

        width: 20px;

    }


    .contact-location-bottom strong {

        width: 100%;

        font-size: 8px;

        line-height: 1.5;

    }

}
/* =========================================================
   AJM GLOBAL — QUOTE MODAL
========================================================= */

.ajm-quote-modal {
    --ajm-modal-navy: #0b1d2d;
    --ajm-modal-blue: #315d73;
    --ajm-modal-gold: #c89b55;
    --ajm-modal-text: #172431;
    --ajm-modal-muted: #6c7882;
}


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

.ajm-quote-modal .modal-dialog {
    max-width: 760px;
    padding: 15px;
}


.ajm-quote-modal .modal-content {
    border: 0;
    border-radius: 4px;
    overflow: hidden;
    background: #ffffff;

    box-shadow:
        0 30px 90px rgba(5, 20, 32, 0.30);
}


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

.ajm-quote-modal-header {
    position: relative;

    padding: 32px 38px 28px;

    background:
        linear-gradient(
            135deg,
            #0b1d2d 0%,
            #173448 55%,
            #244b61 100%
        );

    color: #ffffff;

    overflow: hidden;
}


.ajm-quote-modal-header::before {
    content: "";

    position: absolute;

    width: 240px;
    height: 240px;

    right: -90px;
    top: -130px;

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

    border-radius: 50%;
}


.ajm-quote-modal-header::after {
    content: "";

    position: absolute;

    width: 150px;
    height: 150px;

    right: -40px;
    top: -85px;

    border: 1px solid rgba(200,155,85,0.20);

    border-radius: 50%;
}


.ajm-quote-modal-kicker {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 10px;

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

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

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

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


.ajm-quote-modal-kicker span {
    color: #d8b477;
}


.ajm-quote-modal-kicker i {
    width: 28px;
    height: 1px;

    background: #c89b55;

    display: inline-block;
}


.ajm-quote-modal-header h2 {
    position: relative;
    z-index: 2;

    margin: 0 50px 8px 0;

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

    font-size: clamp(25px, 3vw, 34px);

    font-weight: 600;

    line-height: 1.15;

    letter-spacing: -0.03em;
}


.ajm-quote-modal-header h2 strong {
    font-weight: 700;
    color: #d6b16e;
}


.ajm-quote-modal-header p {
    position: relative;
    z-index: 2;

    max-width: 570px;

    margin: 0;

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

    font-size: 13px;
    line-height: 1.7;

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


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

.ajm-quote-modal-close {
    position: absolute;

    z-index: 5;

    top: 22px;
    right: 22px;

    width: 38px;
    height: 38px;

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

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

    border-radius: 50%;

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

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

    cursor: pointer;

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


.ajm-quote-modal-close:hover {
    background: rgba(255,255,255,0.14);

    color: #ffffff;

    border-color: rgba(255,255,255,0.30);

    transform: rotate(90deg);
}


/* =========================================================
   BODY
========================================================= */

.ajm-quote-modal-body {
    padding: 28px 38px 30px;

    background: #ffffff;
}


/* =========================================================
   FORM OVERRIDES
========================================================= */

.ajm-quote-form {
    margin: 0;
}


.ajm-quote-form .contact-form-field {
    margin-bottom: 18px;
}


.ajm-quote-form .contact-form-field label {
    display: block;

    margin-bottom: 7px;

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

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

    letter-spacing: 0.10em;

    text-transform: uppercase;

    color: #53616c;
}


.ajm-quote-form .contact-form-field input,
.ajm-quote-form .contact-form-field select,
.ajm-quote-form .contact-form-field textarea {

    width: 100%;

    border: 1px solid #dce2e6;

    border-radius: 2px;

    background: #fafbfc;

    color: #172431;

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

    font-size: 13px;

    padding: 12px 14px;

    outline: none;

    transition:
        border-color 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease;
}


.ajm-quote-form .contact-form-field input,
.ajm-quote-form .contact-form-field select {
    min-height: 45px;
}


.ajm-quote-form .contact-form-field textarea {
    resize: vertical;
    min-height: 82px;
}


.ajm-quote-form .contact-form-field input::placeholder,
.ajm-quote-form .contact-form-field textarea::placeholder {
    color: #9ba5ad;
}


.ajm-quote-form .contact-form-field input:focus,
.ajm-quote-form .contact-form-field select:focus,
.ajm-quote-form .contact-form-field textarea:focus {

    border-color: #315d73;

    background: #ffffff;

    box-shadow:
        0 0 0 3px rgba(49,93,115,0.08);
}


/* =========================================================
   FORM ROW
========================================================= */

.ajm-quote-form .contact-form-row {
    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 18px;
}


/* =========================================================
   SELECT
========================================================= */

.ajm-quote-form select {
    cursor: pointer;
}


/* =========================================================
   SUBMIT
========================================================= */

.ajm-quote-form .contact-submit {
    width: 100%;

    min-height: 50px;

    margin-top: 4px;

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

    padding: 0 17px 0 20px;

    border: 0;

    border-radius: 2px;

    background:
        linear-gradient(
            135deg,
            #0b1d2d,
            #244b61
        );

    color: #ffffff;

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

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

    letter-spacing: 0.08em;

    text-transform: uppercase;

    cursor: pointer;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}


.ajm-quote-form .contact-submit i {
    width: 32px;
    height: 32px;

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

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

    border-radius: 50%;

    font-size: 14px;

    transition:
        transform 0.3s ease,
        background 0.3s ease;
}


.ajm-quote-form .contact-submit:hover {

    transform: translateY(-2px);

    box-shadow:
        0 10px 25px rgba(11,29,45,0.18);

    background:
        linear-gradient(
            135deg,
            #122b3f,
            #315d73
        );
}


.ajm-quote-form .contact-submit:hover i {
    transform: rotate(45deg);

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


/* =========================================================
   MODAL FOOTER
========================================================= */

.ajm-quote-modal-footer {

    min-height: 52px;

    padding: 12px 38px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border-top: 1px solid #edf0f2;

    background: #f8f9fa;
}


.ajm-quote-modal-footer > div {

    display: flex;

    align-items: center;

    gap: 8px;

    color: #7a858d;

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

    font-size: 10px;
}


.ajm-quote-modal-footer > div i {
    color: #315d73;

    font-size: 14px;
}


.ajm-quote-modal-footer-tag {

    flex-shrink: 0;

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

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 0.12em;

    color: #9a7a45;
}


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

@media (max-width: 767px) {

    .ajm-quote-modal .modal-dialog {
        margin: 10px auto;

        padding: 8px;

        max-width: calc(100% - 10px);
    }


    .ajm-quote-modal-header {
        padding: 25px 22px 23px;
    }


    .ajm-quote-modal-header h2 {
        margin-right: 35px;

        font-size: 26px;
    }


    .ajm-quote-modal-header p {
        font-size: 12px;
        line-height: 1.6;
    }


    .ajm-quote-modal-close {
        top: 17px;
        right: 17px;

        width: 34px;
        height: 34px;
    }


    .ajm-quote-modal-body {
        padding: 22px 22px 24px;
    }


    .ajm-quote-form .contact-form-row {
        grid-template-columns: 1fr;

        gap: 0;
    }


    .ajm-quote-form .contact-form-field {
        margin-bottom: 15px;
    }


    .ajm-quote-modal-footer {
        padding: 11px 22px;
    }


    .ajm-quote-modal-footer-tag {
        display: none;
    }

}