/*
|--------------------------------------------------------------------------
| BUYSELL GH / ADSMARKET — GLOBAL UI V2
|--------------------------------------------------------------------------
|
| Approved frontend architecture:
|
| Master desktop content width: 1360px
| Minimum desktop gutter:       22px
| Floating global header:       1360px
| Header height:                74px
|
| Font: Inter
|
| This file intentionally loads AFTER all page CSS so the global
| marketplace scale remains consistent between pages.
|
*/


:root{
    --am-container:1360px;

    --am-global-gutter:22px;

    --am-font:
        "Inter",
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    --am-blue:#116cf0;
    --am-blue-hover:#075edb;

    --am-navy:#091a38;
    --am-heading:#0b1b3c;
    --am-body:#293c59;
    --am-muted:#667993;

    --am-border:#e1e7ef;
    --am-surface:#ffffff;
    --am-page:#f8fafc;

    --am-global-radius:14px;
    --am-global-radius-lg:18px;

    --am-global-shadow:
        0 12px 35px
        rgba(16,35,65,.10);

    --am-global-card-shadow:
        0 8px 26px
        rgba(18,39,70,.065);
}


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


html{
    font-size:16px;
}


body{
    font-family:var(--am-font);

    color:var(--am-body);

    background:#fff;

    font-size:14px;

    line-height:1.55;

    letter-spacing:-.005em;
}


button,
input,
select,
textarea{
    font-family:var(--am-font);
}


.am-container{
    width:
        min(
            var(--am-container),
            calc(
                100% -
                calc(
                    var(--am-global-gutter)
                    * 2
                )
            )
        );

    margin-inline:auto;
}


h1,
h2,
h3,
h4,
h5,
h6{
    color:var(--am-heading);

    letter-spacing:-.025em;
}


p{
    color:var(--am-body);
}


/* ========================================================= */
/* GLOBAL FLOATING HEADER */
/* ========================================================= */


.am-header{
    width:
        min(
            1360px,
            calc(100% - 28px)
        ) !important;

    height:74px !important;

    margin:
        10px auto 0 !important;

    position:sticky !important;

    top:10px !important;

    z-index:1100 !important;

    border:
        1px solid
        rgba(
            221,
            228,
            238,
            .95
        ) !important;

    border-radius:15px !important;

    background:
        rgba(
            255,
            255,
            255,
            .965
        ) !important;

    box-shadow:
        var(
            --am-global-shadow
        ) !important;

    backdrop-filter:
        blur(20px)
        saturate(160%);

    -webkit-backdrop-filter:
        blur(20px)
        saturate(160%);

    overflow:visible;
}


.am-header .am-container{
    width:100% !important;

    max-width:none !important;

    padding:
        0 22px !important;
}


.am-header-inner{
    height:74px !important;

    gap:25px !important;
}


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


.am-logo{
    gap:11px !important;
}


.am-logo-mark{
    width:42px !important;

    height:42px !important;

    flex:
        0 0 42px;
}


.am-logo-mark span{
    width:16px !important;

    height:35px !important;
}


.am-logo-text strong,
.am-logo-text b{
    font-size:20px !important;

    font-weight:800 !important;

    letter-spacing:-.55px;
}


.am-logo-text small{
    margin-top:5px !important;

    font-size:8.5px !important;

    line-height:1 !important;

    letter-spacing:0 !important;
}


/* ========================================================= */
/* GLOBAL HEADER NAV */
/* ========================================================= */


.am-main-nav{
    gap:27px !important;
}


.am-main-nav a{
    padding:
        28px 0 26px !important;

    color:#243854 !important;

    font-size:13.5px !important;

    line-height:1 !important;

    font-weight:550 !important;

    letter-spacing:-.01em;
}


.am-main-nav a.is-active{
    color:var(--am-blue) !important;

    font-weight:700 !important;
}


.am-main-nav a.is-active:after{
    bottom:16px !important;

    height:2px !important;
}


.am-header-actions{
    gap:14px !important;

    margin-left:22px !important;
}


.am-header-icon{
    width:35px !important;

    height:35px !important;

    font-size:22px !important;
}


.am-sign-link{
    font-size:13.5px !important;

    font-weight:600 !important;
}


.am-post-button{
    height:46px !important;

    padding:
        0 21px !important;

    border-radius:10px !important;

    font-size:13.5px !important;

    font-weight:700 !important;

    box-shadow:
        0 9px 22px
        rgba(13,103,232,.23) !important;
}


.am-post-button:hover{
    background:
        var(--am-blue-hover);
}


/* ========================================================= */
/* GLOBAL PAGE HEADINGS */
/* ========================================================= */


.am-page-title,
.ams-search-title-row h1{
    font-size:44px !important;

    line-height:1.04 !important;

    font-weight:800 !important;

    letter-spacing:-1.9px !important;
}


.am-section-title h2,
.am-how-copy > h2{
    font-size:31px !important;

    line-height:1.08 !important;

    font-weight:800 !important;
}


.am-section-title p,
.am-how-copy > p{
    font-size:13px !important;

    line-height:1.5 !important;
}


/* ========================================================= */
/* GLOBAL BUTTON SCALE */
/* ========================================================= */


.am-btn,
.btn,
.am-post-button,
.am-search-submit,
.ams-search-button,
.ams-filter-apply{
    min-height:44px;

    font-size:13px;

    font-weight:700;
}


/* ========================================================= */
/* HOMEPAGE HERO SCALE */
/* ========================================================= */


.am-hero{
    margin-top:13px;

    min-height:520px !important;
}


.am-hero-inner{
    min-height:520px !important;

    padding-top:76px !important;

    padding-bottom:48px !important;
}


.am-hero h1{
    max-width:680px !important;

    font-size:68px !important;

    line-height:.98 !important;

    letter-spacing:-3px !important;

    font-weight:800 !important;
}


.am-hero-copy > p{
    max-width:640px !important;

    margin:
        21px 0 26px !important;

    font-size:16.5px !important;

    line-height:1.7 !important;
}


.am-hero-search{
    width:min(
        850px,
        100%
    ) !important;

    min-height:66px !important;
}


.am-search-field input{
    font-size:13.5px !important;
}


.am-search-submit{
    font-size:13.5px !important;
}


/* ========================================================= */
/* HOMEPAGE CATEGORY SCALE */
/* ========================================================= */


.am-category-strip{
    padding:
        30px 0 26px !important;
}


.am-category-grid{
    gap:18px !important;
}


.am-category-icon{
    width:62px !important;

    height:62px !important;

    border-radius:15px !important;

    font-size:29px !important;
}


.am-category-item strong{
    font-size:13.5px !important;

    font-weight:700 !important;
}


.am-category-item small{
    font-size:11px !important;
}


/* ========================================================= */
/* HOMEPAGE PROMOS */
/* ========================================================= */


.am-promos-grid{
    gap:22px !important;
}


.am-promo{
    height:160px !important;

    border-radius:17px !important;
}


.am-promo-copy h2{
    font-size:25px !important;
}


.am-promo-copy p{
    font-size:13px !important;
}


.am-promo-button{
    height:42px !important;

    font-size:12px !important;
}


/* ========================================================= */
/* FEATURED LISTING CARDS GLOBAL */
/* ========================================================= */


.am-featured-grid{
    gap:17px !important;
}


.am-listing-card,
.ams-card{
    border-color:
        var(--am-border) !important;

    box-shadow:
        var(
            --am-global-card-shadow
        ) !important;
}


.am-listing-photo{
    height:175px !important;
}


.am-listing-body{
    padding:
        14px 14px 13px !important;
}


.am-listing-title{
    min-height:38px !important;

    font-size:14.5px !important;

    line-height:1.35 !important;

    font-weight:700 !important;
}


.am-listing-price{
    font-size:19px !important;

    font-weight:800 !important;
}


.am-listing-meta{
    font-size:11px !important;

    line-height:1.4 !important;
}


/* ========================================================= */
/* SEARCH PAGE HERO */
/* ========================================================= */


.ams-search-hero{
    margin-top:14px;

    min-height:250px !important;
}


.ams-search-hero-inner{
    padding-top:52px !important;

    padding-bottom:28px !important;
}


.ams-search-title-row h1{
    max-width:780px;

    font-size:44px !important;
}


.ams-search-title-row p{
    margin-top:8px !important;

    font-size:15px !important;
}


.ams-main-search{
    grid-template-columns:
        1.2fr
        1fr
        1fr
        170px !important;

    gap:11px !important;

    margin-top:30px !important;
}


.ams-search-control{
    height:60px !important;

    border-radius:12px !important;

    padding:
        0 17px !important;
}


.ams-search-control input,
.ams-search-control select{
    font-size:13px !important;
}


.ams-search-button{
    min-height:60px !important;

    font-size:13.5px !important;
}


/* ========================================================= */
/* SEARCH CATEGORY CHIPS */
/* ========================================================= */


.ams-chip-strip{
    padding:
        14px 0 12px !important;
}


.ams-category-chip{
    min-height:44px !important;

    padding:
        0 16px !important;

    border-radius:11px !important;

    font-size:11.5px !important;
}


/* ========================================================= */
/* SEARCH MAIN WIDTH ARCHITECTURE */
/* ========================================================= */


.ams-results-section{
    padding-top:17px !important;
}


.ams-results-layout{
    grid-template-columns:
        286px
        minmax(0,1fr) !important;

    gap:24px !important;
}


/* ========================================================= */
/* SEARCH SIDEBAR */
/* ========================================================= */


.ams-sidebar{
    border-radius:14px !important;

    box-shadow:
        var(
            --am-global-card-shadow
        ) !important;
}


.ams-filter-heading{
    min-height:62px !important;

    padding:
        0 17px !important;
}


.ams-filter-heading h2{
    font-size:18px !important;

    font-weight:800 !important;
}


.ams-filter-heading a{
    font-size:11px !important;
}


.ams-filter-group{
    padding:
        17px 18px !important;
}


.ams-filter-title{
    margin-bottom:13px !important;

    font-size:13.5px !important;

    line-height:1.3 !important;

    font-weight:750 !important;
}


.ams-filter-options{
    gap:9px !important;
}


.ams-check-row{
    min-height:22px !important;

    grid-template-columns:
        19px
        minmax(0,1fr)
        auto !important;

    font-size:11.5px !important;

    line-height:1.35 !important;
}


.ams-check-row input{
    width:17px !important;

    height:17px !important;
}


.ams-check-row b{
    font-size:10.5px !important;
}


.ams-price-inputs input{
    height:41px !important;

    font-size:11.5px !important;
}


.ams-price-presets button{
    min-height:27px !important;

    font-size:9px !important;
}


.ams-filter-apply{
    height:38px !important;

    min-height:38px !important;

    font-size:10.5px !important;
}


.ams-location-search{
    height:43px !important;
}


.ams-location-search select{
    font-size:11.5px !important;
}


.ams-distance-options label{
    font-size:11px !important;
}


/* ========================================================= */
/* SEARCH RESULTS HEADER */
/* ========================================================= */


.ams-results-toolbar{
    min-height:68px !important;
}


.ams-results-toolbar h2{
    font-size:26px !important;

    line-height:1.15 !important;

    font-weight:800 !important;
}


.ams-results-toolbar p{
    font-size:12.5px !important;
}


.ams-sort-area > span{
    font-size:11px !important;
}


.ams-sort-area select{
    height:45px !important;

    min-width:165px !important;

    font-size:11.5px !important;
}


.ams-view-button{
    width:45px !important;

    height:45px !important;
}


/* ========================================================= */
/* SEARCH SPONSORED BANNER */
/* ========================================================= */


.ams-sponsored-banner{
    min-height:235px !important;

    margin-bottom:17px !important;

    border-radius:14px !important;
}


.ams-sponsored-copy{
    padding:
        20px 24px 16px !important;
}


.ams-sponsored-copy h3{
    margin-top:11px !important;

    font-size:26px !important;

    line-height:1.08 !important;

    letter-spacing:-.7px;
}


.ams-sponsored-copy p{
    max-width:520px !important;

    font-size:11.5px !important;

    line-height:1.6 !important;
}


.ams-sponsored-copy > strong{
    height:44px !important;

    font-size:11.5px !important;
}


.ams-sponsored-benefits{
    left:24px !important;

    bottom:15px !important;

    gap:18px !important;

    font-size:9px !important;
}


.ams-sponsored-image{
    min-height:235px !important;
}


/* ========================================================= */
/* SEARCH LISTING CARDS */
/* ========================================================= */


.ams-listing-grid{
    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        ) !important;

    gap:16px !important;
}


.ams-card{
    border-radius:12px !important;
}


.ams-card-image{
    height:205px !important;

    background:
        #eef2f6 !important;
}


.ams-card-image img{
    object-fit:cover !important;

    background:
        #eef2f6 !important;
}


.ams-card-body{
    padding:
        13px 14px 14px !important;
}


.ams-card-title{
    min-height:21px !important;

    font-size:14px !important;

    line-height:1.35 !important;

    font-weight:700 !important;
}


.ams-card-subtitle{
    min-height:18px !important;

    margin-top:4px !important;

    font-size:11px !important;

    line-height:1.4 !important;
}


.ams-card-price{
    margin-top:10px !important;

    font-size:19px !important;

    font-weight:800 !important;
}


.ams-card-meta{
    margin-top:9px !important;

    font-size:10.5px !important;

    line-height:1.4 !important;
}


.ams-card-badge{
    min-height:29px !important;

    font-size:10.5px !important;
}


/* ========================================================= */
/* PAGINATION */
/* ========================================================= */


.ams-pagination-row{
    min-height:78px !important;
}


.ams-pagination a,
.ams-pagination span{
    width:40px !important;

    height:40px !important;

    font-size:11.5px !important;
}


.ams-results-count{
    font-size:11px !important;
}


/* ========================================================= */
/* HOW IT WORKS */
/* ========================================================= */


.am-how-grid{
    gap:34px !important;
}


.am-step-icon{
    width:74px !important;

    height:74px !important;
}


.am-how-step strong{
    font-size:13.5px !important;
}


.am-how-step p{
    font-size:12.5px !important;
}


/* ========================================================= */
/* TRENDING */
/* ========================================================= */


.am-trending-heading h3{
    font-size:19px !important;
}


.am-trending-heading p{
    font-size:11px !important;
}


.am-trending-card img{
    height:68px !important;
}


.am-trending-card span{
    font-size:10.5px !important;
}


/* ========================================================= */
/* APP / TRUST STRIP */
/* ========================================================= */


.am-app-strip{
    padding:
        30px 0 48px !important;
}


.am-app-intro h3{
    font-size:18px !important;
}


.am-app-intro p{
    font-size:11px !important;
}


.am-stat strong{
    font-size:20px !important;
}


.am-stat small{
    font-size:10px !important;
}


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


.am-footer{
    margin-top:0;

    padding:
        28px 0 !important;
}


.am-footer-copy,
.am-footer-links{
    font-size:11.5px !important;
}


/* ========================================================= */
/* IMAGE QUALITY GUARD */
/* ========================================================= */


.am-listing-photo,
.ams-card-image,
.am-trending-card img{
    overflow:hidden;

    background:
        linear-gradient(
            135deg,
            #edf2f7,
            #e5ebf3
        ) !important;
}


.am-listing-photo img,
.ams-card-image img,
.am-trending-card img{
    width:100%;

    object-fit:cover;

    object-position:center;
}


/*
|--------------------------------------------------------------------------
| Hide broken image icon visually.
|--------------------------------------------------------------------------
*/

img{
    color:transparent;
}


/* ========================================================= */
/* LAPTOP */
/* ========================================================= */


@media(max-width:1200px){

    :root{
        --am-global-gutter:20px;
    }


    .am-header{
        width:
            calc(
                100% - 24px
            ) !important;
    }


    .am-main-nav{
        gap:18px !important;
    }


    .am-main-nav a{
        font-size:12.5px !important;
    }


    .am-header-actions{
        margin-left:8px !important;
    }


    .ams-results-layout{
        grid-template-columns:
            260px
            minmax(0,1fr)
            !important;
    }


    .ams-card-image{
        height:185px !important;
    }

}


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


@media(max-width:900px){

    :root{
        --am-global-gutter:16px;
    }


    .am-header{
        width:
            calc(
                100% - 20px
            ) !important;

        top:8px !important;

        margin-top:8px !important;
    }


    .am-header .am-container{
        padding:
            0 15px !important;
    }


    .am-main-nav{
        gap:0 !important;
    }


    .ams-results-layout{
        grid-template-columns:
            1fr !important;
    }


    .ams-card-image{
        height:195px !important;
    }


    .ams-main-search{
        grid-template-columns:
            1fr 1fr !important;
    }


    .ams-search-title-row h1{
        font-size:38px !important;
    }


    .am-page-title{
        font-size:38px !important;
    }

}


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


@media(max-width:600px){

    :root{
        --am-global-gutter:10px;
    }


    body{
        font-size:13px;
    }


    .am-header{
        width:
            calc(
                100% - 16px
            ) !important;

        height:62px !important;

        top:7px !important;

        margin-top:7px !important;

        border-radius:14px !important;
    }


    .am-header-inner{
        height:62px !important;
    }


    .am-logo-mark{
        width:35px !important;

        height:35px !important;

        flex-basis:35px;
    }


    .am-logo-text strong,
    .am-logo-text b{
        font-size:16.5px !important;
    }


    .am-logo-text small{
        font-size:7px !important;
    }


    .am-mobile-toggle{
        display:block;

        font-size:22px !important;
    }


    .am-hero{
        margin-top:10px;
    }


    .am-hero h1{
        font-size:43px !important;

        letter-spacing:-1.8px !important;
    }


    .am-hero-copy > p{
        font-size:14px !important;
    }


    .ams-search-title-row h1{
        font-size:31px !important;

        line-height:1.07 !important;
    }


    .ams-search-title-row p{
        font-size:12.5px !important;
    }


    .ams-main-search{
        grid-template-columns:
            1fr !important;
    }


    .ams-search-control{
        height:51px !important;
    }


    .ams-search-button{
        min-height:51px !important;
    }


    .ams-results-toolbar h2{
        font-size:23px !important;
    }


    .ams-listing-grid{
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            )
            !important;

        gap:10px !important;
    }


    .ams-card-image{
        height:145px !important;
    }


    .ams-card-body{
        padding:
            10px !important;
    }


    .ams-card-title{
        font-size:12px !important;
    }


    .ams-card-subtitle{
        font-size:9.5px !important;
    }


    .ams-card-price{
        font-size:16px !important;
    }


    .ams-card-meta{
        font-size:9px !important;
    }

}