
/* ============================================================
   AutoMart Global Typography V22.0
   Goal: YallaMotor-like readability/density while preserving
   AutoMart's Inter family, green identity, layouts and spacing.
   ============================================================ */

:root{
  --am-font-ui:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  --am-type-xs:12px;
  --am-type-sm:13px;
  --am-type-base:14px;
  --am-type-md:15px;
  --am-type-lg:18px;
  --am-type-xl:20px;
  --am-type-2xl:24px;
  --am-type-3xl:30px;
  --am-type-4xl:36px;

  --am-leading-tight:1.18;
  --am-leading-title:1.25;
  --am-leading-body:1.55;
}

/* ---------- GLOBAL FAMILY + READABILITY ---------- */
html{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

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

body{
  font-size:var(--am-type-base)!important;
  line-height:var(--am-leading-body)!important;
  color:#344054;
}

button,
input,
select,
textarea{
  font-size:var(--am-type-base)!important;
}

small{
  font-size:var(--am-type-xs)!important;
  line-height:1.45!important;
}

/* Do not flatten intentional display typography in the homepage hero.
   It keeps its own explicit font declaration when present. */
main h1:not(.hero-title):not(.classic-hero-title){
  font-size:clamp(30px,2.1vw,38px)!important;
  line-height:1.12!important;
  letter-spacing:-.035em!important;
}

main h2{
  font-size:clamp(24px,1.7vw,32px)!important;
  line-height:1.16!important;
  letter-spacing:-.03em!important;
}

main h3{
  font-size:var(--am-type-lg)!important;
  line-height:var(--am-leading-title)!important;
  letter-spacing:-.018em!important;
}

main h4{
  font-size:16px!important;
  line-height:1.3!important;
}

main p{
  font-size:var(--am-type-base);
  line-height:var(--am-leading-body);
}

main label{
  font-size:var(--am-type-sm)!important;
  line-height:1.35!important;
  font-weight:600;
}

main input,
main select,
main textarea{
  font-size:var(--am-type-base)!important;
  line-height:1.35!important;
}

main button,
main .btn{
  font-size:var(--am-type-base)!important;
  font-weight:700!important;
  line-height:1.2!important;
}

/* ---------- MAIN HEADER ---------- */
.premium-topbar,
.premium-topbar *{
  font-family:var(--am-font-ui)!important;
}

.premium-topbar nav a,
.premium-topbar nav button,
.premium-topbar .nav-link,
.premium-topbar .login-link{
  font-size:14px!important;
  font-weight:650!important;
  line-height:1.2!important;
}

.premium-topbar .signup-btn,
.premium-topbar .btn{
  font-size:14px!important;
  font-weight:700!important;
}

/* ---------- GLOBAL STICKY SEARCH ---------- */
.am-global-search-v18,
.am-global-search-v18 *{
  font-family:var(--am-font-ui)!important;
}

.am-global-search-v18 input,
.am-global-search-v18 select,
.am-global-search-v18 button{
  font-size:14px!important;
}

.am-global-search-v18 label,
.am-global-search-v18 .field-label{
  font-size:13px!important;
  font-weight:650!important;
}

.am-global-search-v18 .search-button,
.am-global-search-v18 .more-filters{
  font-size:14px!important;
  font-weight:700!important;
}

/* ---------- LIST / SEARCH PAGES ---------- */
body:has(a[href^="/vehicle/"]) main .results-count,
body:has(a[href^="/vehicle/"]) main .result-count,
body:has(a[href^="/vehicle/"]) main .listing-count{
  font-size:14px!important;
}

main [class*="filter"] h2,
main [class*="filter"] h3{
  line-height:1.2!important;
}

main [class*="filter"] label,
main [class*="filter"] .label{
  font-size:13px!important;
}

main [class*="filter"] input,
main [class*="filter"] select,
main [class*="filter"] button{
  font-size:14px!important;
}

/* Vehicle/listing card titles */
main article h3,
main [class*="vehicle-card"] h3,
main [class*="car-card"] h3{
  font-size:18px!important;
  line-height:1.26!important;
  font-weight:750!important;
}

/* Common card prices */
main article [class*="price"],
main [class*="vehicle-card"] [class*="price"],
main [class*="car-card"] [class*="price"]{
  font-size:20px!important;
  line-height:1.15!important;
  font-weight:800!important;
}

/* ---------- VEHICLE DETAIL V21 ---------- */
.vehicle-detail-page{
  font-family:var(--am-font-ui)!important;
  font-size:14px!important;
}

.vehicle-detail-page .crumbs{
  font-size:12px!important;
  line-height:1.4!important;
}

.vehicle-detail-page .v21-year-badge{
  font-size:12px!important;
  font-weight:800!important;
}

.vehicle-detail-page .v21-listing-ref{
  font-size:12px!important;
  font-weight:650!important;
}

.vehicle-detail-page .title-actions h1{
  font-size:32px!important;
  line-height:1.1!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
}

.vehicle-detail-page .v21-subline{
  font-size:14px!important;
  line-height:1.45!important;
}

.vehicle-detail-page .price-line strong{
  font-size:32px!important;
  line-height:1.05!important;
  font-weight:800!important;
}

.vehicle-detail-page .price-line span{
  font-size:12px!important;
  font-weight:700!important;
}

.vehicle-detail-page .summary-facts span,
.vehicle-detail-page .summary-location{
  font-size:13px!important;
  line-height:1.4!important;
  font-weight:600!important;
}

.vehicle-detail-page .summary-meta{
  font-size:12px!important;
  line-height:1.45!important;
}

.vehicle-detail-page .v21-verified-banner strong{
  font-size:14px!important;
  line-height:1.3!important;
}

.vehicle-detail-page .v21-verified-banner small{
  font-size:12px!important;
  line-height:1.4!important;
}

.vehicle-detail-page .contact-row .btn{
  font-size:14px!important;
  font-weight:700!important;
}

.vehicle-detail-page .seller-profile-card b{
  font-size:14px!important;
  line-height:1.3!important;
}

.vehicle-detail-page .seller-profile-card small,
.vehicle-detail-page .seller-profile-card em{
  font-size:12px!important;
  line-height:1.4!important;
}

.vehicle-detail-page .detail-tabs>*{
  font-size:13px!important;
  font-weight:650!important;
}

.vehicle-detail-page .detail-copy h2{
  font-size:22px!important;
  line-height:1.2!important;
  font-weight:750!important;
}

.vehicle-detail-page .detail-copy>p{
  font-size:14px!important;
  line-height:1.65!important;
}

.vehicle-detail-page .detail-copy h3{
  font-size:18px!important;
  line-height:1.25!important;
  font-weight:700!important;
}

.vehicle-detail-page .key-info>div>span{
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:500!important;
}

.vehicle-detail-page .key-info>div>b{
  font-size:14px!important;
  line-height:1.3!important;
  font-weight:650!important;
}

.vehicle-detail-page .feature-list>span{
  font-size:14px!important;
  line-height:1.35!important;
  font-weight:600!important;
}

.vehicle-detail-page .finance-box>small:first-child{
  font-size:12px!important;
}

.vehicle-detail-page .finance-box>strong{
  font-size:22px!important;
  line-height:1.2!important;
  font-weight:800!important;
}

.vehicle-detail-page .finance-box>div{
  font-size:13px!important;
  line-height:1.4!important;
}

.vehicle-detail-page .finance-box .btn.full{
  font-size:14px!important;
  font-weight:700!important;
}

/* ---------- FOOTER ---------- */
footer,
footer *{
  font-family:var(--am-font-ui)!important;
}

footer h3,
footer h4{
  font-size:14px!important;
  line-height:1.3!important;
  font-weight:700!important;
}

footer a,
footer p,
footer li,
footer span{
  font-size:13px!important;
  line-height:1.55!important;
}

/* ---------- MOBILE ---------- */
@media(max-width:767px){
  body{
    font-size:14px!important;
  }

  main h1:not(.hero-title):not(.classic-hero-title){
    font-size:28px!important;
    line-height:1.12!important;
  }

  main h2{
    font-size:24px!important;
  }

  main h3{
    font-size:17px!important;
  }

  .premium-topbar nav a,
  .premium-topbar nav button,
  .premium-topbar .nav-link{
    font-size:14px!important;
  }

  .vehicle-detail-page .title-actions h1{
    font-size:25px!important;
  }

  .vehicle-detail-page .price-line strong{
    font-size:28px!important;
  }

  .vehicle-detail-page .detail-copy h2{
    font-size:20px!important;
  }

  .vehicle-detail-page .detail-copy>p,
  .vehicle-detail-page .feature-list>span,
  .vehicle-detail-page .contact-row .btn{
    font-size:14px!important;
  }

  footer a,
  footer p,
  footer li,
  footer span{
    font-size:13px!important;
  }
}
