/* =========================================================
   MTAA HOMEPAGE V13 — MARKETPLACE LANDING DESIGN
   Visual refinement based on the approved homepage reference.
   No application/data logic changed.
   ========================================================= */

:root{
  --mtaa-v13-green:#087f4f;
  --mtaa-v13-deep:#075c3b;
  --mtaa-v13-ink:#10261e;
  --mtaa-v13-muted:#71807a;
  --mtaa-v13-soft:#f5faf7;
  --mtaa-v13-line:#e5eee9;
  --mtaa-v13-yellow:#f4c542;
  --mtaa-v13-shadow:0 12px 34px rgba(16,38,30,.075);
}

body{background:#fff;color:var(--mtaa-v13-ink)}

/* Header */
.mtaa-public-nav{height:66px;border-bottom:1px solid #edf2ef!important;box-shadow:0 3px 16px rgba(15,23,42,.045)!important}
.mtaa-public-nav .container{height:100%}
.mtaa-public-nav .navbar-brand{gap:8px!important;min-width:185px}
.mtaa-public-nav .navbar-brand img{height:34px!important;max-width:110px!important;object-fit:contain}
.mtaa-public-nav .mtaa-brand-name{font-family:Poppins,sans-serif;font-size:1.15rem;font-weight:800;color:#17352a;letter-spacing:-.03em}
.mtaa-public-nav .mtaa-brand-tag{display:none}
.mtaa-public-nav .nav-link{font-size:.76rem;font-weight:700;color:#4f6159!important;padding:.55rem .65rem!important}
.mtaa-public-nav .nav-link i{display:none}
.mtaa-public-nav .nav-link.active{color:var(--mtaa-v13-green)!important}
.mtaa-public-nav .nav-link.active:after{content:"";display:block;height:2px;background:var(--mtaa-v13-green);border-radius:9px;margin:7px auto -9px;width:22px}
.mtaa-public-nav .btn-primary{font-size:.72rem!important;border-radius:10px!important;padding:.56rem .85rem!important}

/* Location prompt */
.location-prompt{padding:0!important;background:transparent!important;position:relative;z-index:5;margin-top:-1px}
.location-prompt .container-xl{max-width:900px}
.location-prompt-inner{min-height:48px!important;padding:7px 10px!important;border:1px solid #e4eee9!important;border-top:0!important;border-radius:0 0 13px 13px!important;background:#fff!important;box-shadow:0 8px 22px rgba(15,23,42,.07)!important}
.location-prompt-icon{width:30px!important;height:30px!important;border-radius:9px!important;background:#eefaf4!important;color:var(--mtaa-v13-green)!important}
.location-prompt-copy strong{font-size:.68rem!important}
.location-prompt-copy span{font-size:.58rem!important}
.location-actions{gap:6px!important}
.location-allow-button{font-size:.6rem!important;min-height:30px!important;padding:5px 9px!important;border-radius:8px!important}
.location-dismiss-button{font-size:.6rem!important}

/* Hero */
.hero{min-height:365px!important;padding:42px 0 34px!important;background:
  radial-gradient(circle at 88% 22%,rgba(103,190,69,.23),transparent 28%),
  radial-gradient(circle at 8% 85%,rgba(7,133,81,.3),transparent 35%),
  linear-gradient(125deg,#075a3b 0%,#087b4e 58%,#208d4d 100%)!important;border-radius:0 0 5px 5px;overflow:hidden}
.hero:before{opacity:.12!important;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px)!important;background-size:44px 44px!important}
.hero-overlay{background:linear-gradient(180deg,rgba(0,50,30,.12),rgba(0,50,30,.18))!important}
.hero-content{max-width:950px;margin:auto}
.hero-tagline{display:inline-flex!important;padding:6px 11px!important;border:1px solid rgba(255,255,255,.16)!important;background:rgba(255,255,255,.09)!important;border-radius:999px!important;font-size:.61rem!important;letter-spacing:.02em}
.hero-location-chip{display:inline-flex!important;margin-top:10px!important;padding:5px 9px!important;border-radius:999px!important;background:rgba(255,255,255,.1)!important;border:1px solid rgba(255,255,255,.16)!important}
.hero-location-chip small{font-size:.49rem!important;opacity:.78}
.hero-location-chip strong{font-size:.64rem!important}
.hero-location-icon{width:22px!important;height:22px!important;font-size:.6rem!important}
.hero h1{font-size:clamp(2rem,4vw,3.1rem)!important;line-height:1.03!important;margin:12px 0 9px!important;letter-spacing:-.05em}
.hero h1 .text-warning{color:#ffd45c!important}
.hero-subtitle{font-size:.78rem!important;line-height:1.45!important;max-width:510px!important;margin:0 auto 18px!important;color:rgba(255,255,255,.87)!important}
.hero-search{width:min(760px,100%)!important;grid-template-columns:minmax(0,1fr) 180px auto!important;padding:5px!important;gap:3px!important;box-shadow:0 15px 35px rgba(0,30,18,.2)!important}
.hero-search-input,.hero-search-category{height:43px!important}
.hero-search-icon{margin-left:14px!important;margin-right:8px!important;font-size:11px}
.hero-search-input input{font-size:11px!important}
.hero-voice-button{width:27px!important;height:27px!important;right:7px!important;font-size:10px!important}
.hero-search-category{padding-left:12px!important}
.hero-search-category select{font-size:10px!important;padding:0 6px!important}
.hero-search-button{height:43px!important;padding:0 17px!important;font-size:.7rem!important;background:#fff!important;color:var(--mtaa-v13-green)!important}
.popular-searches{gap:6px!important;margin-top:10px!important;font-size:.56rem!important}
.popular-searches a{padding:3px 7px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.06)}
.hero-stats{margin-top:18px!important;gap:28px!important}
.hero-stat strong{font-size:1.1rem!important}
.hero-stat span{font-size:.48rem!important;letter-spacing:.03em!important}

/* Generic section rhythm */
.category-section,.trending-section,.browse-counties,.homepage-cta{padding-top:48px!important;padding-bottom:48px!important}
.category-section{background:#fff}
.category-section .container{max-width:1120px}
.section-badge{font-size:.55rem!important;letter-spacing:.06em!important;text-transform:uppercase;font-weight:800!important;color:#16804e!important;background:#eefaf4!important;border:1px solid #d8eee2!important;border-radius:999px!important;padding:4px 8px!important}
.category-section h2{font-size:1.35rem!important;margin-top:10px!important;margin-bottom:3px!important;letter-spacing:-.04em!important;color:#10261e!important}
.category-section .lead{font-size:.66rem!important;margin-bottom:22px!important}
.category-section .row{--bs-gutter-x:10px;--bs-gutter-y:10px}
.category-section .col-xl-3{flex:0 0 12.5%;max-width:12.5%}
.category-card{min-height:98px!important;padding:14px 8px!important;border:1px solid #edf2ef!important;border-radius:12px!important;box-shadow:0 5px 18px rgba(15,23,42,.045)!important;text-align:center!important;background:#fff!important}
.category-card:hover{transform:translateY(-3px)!important;border-color:#cfe8da!important;box-shadow:0 12px 25px rgba(15,23,42,.07)!important}
.category-icon{width:29px!important;height:29px!important;border-radius:8px!important;background:#eefaf4!important;color:#0d8b57!important;font-size:12px!important;margin:0 auto 7px!important}
.category-card h4{font-size:.65rem!important;line-height:1.2!important;margin-bottom:4px!important;color:#1c332a!important}
.category-card p{font-size:.5rem!important;margin-bottom:5px!important;color:#8a9791!important}
.category-link{font-size:.49rem!important;color:#128251!important}
.category-section .btn{font-size:.58rem!important;padding:6px 10px!important;border-radius:999px!important}

/* Discovery */
.discovery-strip{padding:38px 0!important;background:#fff!important}
.discovery-grid{grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:8px!important}
.discovery-tile{min-height:54px!important;padding:7px 8px!important;border-radius:11px!important;gap:7px!important;box-shadow:none!important}
.discovery-icon{width:27px!important;height:27px!important;flex-basis:27px!important;border-radius:8px!important;font-size:10px!important}
.discovery-tile strong{font-size:.57rem!important}
.discovery-tile small{font-size:.47rem!important;margin-top:0!important}
.discovery-tile i.arrow{font-size:8px!important}
.discovery-tile:hover{transform:translateY(-2px)!important}

/* Split featured + trust row */
.home-feature-row{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:20px;max-width:1120px;margin:0 auto;padding:42px 12px}
.home-feature-row > .business-week-section,.home-feature-row > .why-mtaa{padding:0!important;margin:0!important;background:transparent!important}
.home-feature-row .container{max-width:none!important;padding:0!important}
.business-week-card{border-radius:15px!important;box-shadow:var(--mtaa-v13-shadow)!important}
.week-cover{height:205px!important}
.week-featured-badge{font-size:.56rem!important;padding:5px 8px!important;border-radius:999px!important;top:10px!important;left:10px!important}
.week-open-badge{font-size:.55rem!important;padding:5px 8px!important;right:10px!important;bottom:10px!important}
.week-logo{width:54px!important;height:54px!important;margin-top:-27px!important;margin-left:14px!important;border-radius:12px!important;padding:4px!important}
.week-content{padding:8px 14px 14px!important}
.week-left h2{font-size:1rem!important;margin-bottom:3px!important}
.week-meta{font-size:.57rem!important;gap:7px!important}
.week-description{font-size:.6rem!important;line-height:1.5!important;margin:7px 0!important}
.week-buttons{gap:5px!important}
.week-btn{font-size:.54rem!important;padding:6px 8px!important;border-radius:7px!important}
.view-featured{font-size:.58rem!important;padding:7px 10px!important;border-radius:8px!important}
.why-mtaa{display:flex;align-items:stretch}
.why-mtaa .home-section-heading{display:none}
.why-grid{grid-template-columns:1fr!important;gap:7px!important;width:100%}
.why-card{padding:10px 11px!important;border-radius:11px!important;display:grid;grid-template-columns:30px 1fr;column-gap:9px;align-items:center;box-shadow:none!important}
.why-icon{width:30px!important;height:30px!important;border-radius:8px!important;font-size:11px!important;grid-row:1 / span 2;margin:0!important}
.why-card h3{font-size:.62rem!important;margin:0 0 2px!important}
.why-card p{font-size:.52rem!important;line-height:1.35!important}

/* Nearby + top rated two-column marketplace */
.home-marketplace-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:1120px;margin:0 auto;padding:8px 12px 42px}
.home-marketplace-row > section{padding:0!important;margin:0!important;background:transparent!important}
.home-marketplace-row > section > .container{max-width:none!important;padding:0!important}
.home-marketplace-row .home-section-heading{margin-bottom:15px!important}
.home-marketplace-row .home-section-heading .heading-copy h2{font-size:1.05rem!important}
.home-marketplace-row .home-section-heading .heading-copy p{font-size:.58rem!important}
.home-marketplace-row .section-view-all{font-size:.54rem!important;border:0!important;background:transparent!important;padding:4px!important}
.home-marketplace-row .row{--bs-gutter-x:8px;--bs-gutter-y:8px}
.home-marketplace-row .col-lg-3,.home-marketplace-row .col-xl-3{width:50%;flex:0 0 50%;max-width:50%}
.home-marketplace-row .business-card{border-radius:11px!important;box-shadow:0 5px 18px rgba(15,23,42,.065)!important}
.home-marketplace-row .card-image{height:125px!important}
.home-marketplace-row .card-logo{top:auto!important;left:10px!important;bottom:10px!important;width:34px!important;height:34px!important;margin:0!important;padding:3px!important;border-radius:9px!important;border:2px solid #fff!important;box-shadow:0 5px 12px rgba(15,23,42,.12)!important;background:#fff!important}
.home-marketplace-row .card-logo img{border-radius:6px!important;background:#fff!important}
.home-marketplace-row .card-body{padding:9px 10px 10px!important}
.home-marketplace-row .title-row h4{font-size:.67rem!important;line-height:1.25!important}
.home-marketplace-row .text-muted.mb-2{font-size:.51rem!important;margin-bottom:4px!important}
.home-marketplace-row .business-rating{font-size:.53rem!important;margin-bottom:3px!important}
.home-marketplace-row .business-rating small{font-size:.45rem!important}
.home-marketplace-row .business-location{font-size:.49rem!important;margin-bottom:3px!important}
.home-marketplace-row .text-muted.small{font-size:.48rem!important;line-height:1.35!important;min-height:2.5em!important;margin-bottom:6px!important}
.home-marketplace-row .quick-actions{gap:4px!important;margin-bottom:5px!important}
.home-marketplace-row .quick-actions a{width:25px!important;height:25px!important;flex:0 0 25px!important;font-size:9px!important}
.home-marketplace-row .view-btn{padding:5px 6px!important;font-size:.5rem!important;border-radius:6px!important}
.home-marketplace-row .featured-ribbon,.home-marketplace-row .verified-badge,.home-marketplace-row .home-card-status{font-size:.45rem!important;padding:4px 6px!important}
.home-marketplace-row .featured-ribbon{top:7px!important;left:7px!important}
.home-marketplace-row .verified-badge{top:7px!important;right:7px!important}
.home-marketplace-row .home-card-status{left:7px!important;bottom:7px!important}
.top-rated-section{padding:0!important;background:transparent!important}

/* Trending becomes a compact lower showcase */
.trending-section{background:#f7faf8!important}
.trending-section .home-section-heading{margin-bottom:18px!important}
.trending-section .row{--bs-gutter-x:10px;--bs-gutter-y:10px}
.trending-section .col-xl-3{width:25%;flex:0 0 25%;max-width:25%}
.trending-section .card-image{height:135px!important}
.trending-section .card-logo{width:36px!important;height:36px!important;top:auto!important;bottom:8px!important;left:9px!important;margin:0!important;padding:3px!important;border-radius:9px!important}
.trending-section .card-body{padding:9px 10px 10px!important}
.trending-section .title-row h4{font-size:.68rem!important}
.trending-section .text-muted.mb-2,.trending-section .business-rating,.trending-section .business-location{font-size:.5rem!important}
.trending-section .text-muted.small{font-size:.48rem!important;min-height:2.4em!important}
.trending-section .quick-actions{gap:4px!important;margin-bottom:5px!important}
.trending-section .quick-actions a{width:25px!important;height:25px!important;flex-basis:25px!important}
.trending-section .view-btn{font-size:.5rem!important;padding:5px!important}

/* Recently added — compact horizontal cards */
.recent-section{padding:42px 0!important;background:#fff!important}
.recent-section .row{--bs-gutter-x:9px;--bs-gutter-y:9px}
.recent-section .col-xl-3{width:25%;flex:0 0 25%;max-width:25%}
.recent-section .business-card{display:grid!important;grid-template-columns:78px 1fr;border:1px solid var(--mtaa-v13-line)!important;border-radius:12px!important;box-shadow:none!important;overflow:hidden!important}
.recent-section .card-image{height:100%!important;min-height:78px!important}
.recent-section .card-logo,.recent-section .quick-actions,.recent-section .view-btn,.recent-section .image-overlay,.recent-section .featured-ribbon,.recent-section .verified-badge,.recent-section .home-card-status{display:none!important}
.recent-section .card-body{padding:10px!important}
.recent-section .title-row h4{font-size:.6rem!important;line-height:1.25!important}
.recent-section .text-muted.mb-2{font-size:.47rem!important;margin:2px 0!important}
.recent-section .business-rating,.recent-section .business-location,.recent-section .text-muted.small{font-size:.46rem!important;line-height:1.3!important}

/* Browse Kenya */
.browse-counties{background:#fff!important}
.browse-counties .row{justify-content:center;--bs-gutter-x:12px}
.browse-counties .col-lg-3{width:35%;flex:0 0 35%;max-width:35%}
.county-card{padding:16px!important;border-radius:12px!important;box-shadow:0 6px 20px rgba(15,23,42,.045)!important;border:1px solid #e8efeb!important;text-align:left!important;display:grid!important;grid-template-columns:34px 1fr auto;align-items:center;gap:9px}
.county-icon{font-size:18px!important;margin:0!important}
.county-card h4{font-size:.72rem!important;margin:0 0 2px!important}
.county-card p{font-size:.5rem!important;margin:0!important}
.county-card span{font-size:.55rem!important}

/* Stats */
.homepage-stats{padding:38px 0!important;background:linear-gradient(120deg,#087e4f,#075c3b)!important}
.homepage-stats .container> .text-center{margin-bottom:22px!important}
.homepage-stats h2{font-size:1.05rem!important;margin-bottom:2px!important}
.homepage-stats .text-muted{color:rgba(255,255,255,.65)!important;font-size:.55rem!important}
.homepage-stats .row{--bs-gutter-x:10px}
.homepage-stats .col-lg-3{width:25%;flex:0 0 25%;max-width:25%}
.stat-card{padding:18px 8px!important;border-radius:9px!important;background:rgba(255,255,255,.09)!important;box-shadow:none!important}
.stat-card h2{font-size:1.3rem!important;margin-bottom:2px!important}
.stat-card p{font-size:.5rem!important}

/* CTA */
.homepage-cta{padding:38px 0!important;background:#fff}
.cta-box{padding:25px 30px!important;border-radius:14px!important;text-align:left!important;background:linear-gradient(125deg,#138e55,#0d7447)!important;box-shadow:0 15px 35px rgba(15,23,42,.12)!important}
.cta-box h2{font-size:1.35rem!important;margin-bottom:5px!important}
.cta-box p{font-size:.58rem!important;margin:0!important;max-width:520px!important}
.cta-features{justify-content:flex-start!important;gap:6px!important;margin-top:12px!important;font-size:.5rem!important}
.cta-features span{padding:4px 7px;border-radius:999px;background:rgba(255,255,255,.1)}
.cta-box .btn{font-size:.58rem!important;padding:7px 12px!important;border-radius:999px!important;margin-top:12px!important}

/* Footer */
.mtaa-footer{margin-top:0!important}
.mtaa-footer .container{max-width:1120px}
.mtaa-footer .row{--bs-gutter-x:22px}

@media(max-width:991.98px){
  .category-section .col-xl-3{width:25%;flex:0 0 25%;max-width:25%}
  .discovery-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .home-feature-row,.home-marketplace-row{grid-template-columns:1fr;gap:18px}
  .home-marketplace-row .col-lg-3,.home-marketplace-row .col-xl-3{width:50%;flex-basis:50%;max-width:50%}
  .trending-section .col-xl-3,.recent-section .col-xl-3{width:50%;flex-basis:50%;max-width:50%}
  .browse-counties .col-lg-3{width:46%;flex-basis:46%;max-width:46%}
  .homepage-stats .col-lg-3{width:25%;flex-basis:25%;max-width:25%}
}
@media(max-width:767.98px){
  .mtaa-public-nav{height:60px}
  .mtaa-public-nav .navbar-brand{min-width:0}
  .mtaa-public-nav .navbar-brand img{height:31px!important;max-width:95px!important}
  .hero{padding:34px 0 28px!important;min-height:430px!important}
  .hero h1{font-size:2rem!important}
  .hero-search{grid-template-columns:1fr!important;border-radius:16px!important;padding:6px!important}
  .hero-search-category{border-left:0!important;border-top:1px solid #e9ecef!important;padding-left:10px!important}
  .hero-search-button{width:100%;margin-top:2px}
  .hero-stats{gap:16px!important}
  .category-section .col-xl-3{width:25%;flex-basis:25%;max-width:25%}
  .category-card{min-height:90px!important}
  .discovery-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .home-feature-row,.home-marketplace-row{padding-left:16px;padding-right:16px}
  .home-marketplace-row .col-lg-3,.home-marketplace-row .col-xl-3{width:50%;flex-basis:50%;max-width:50%}
  .trending-section .col-xl-3,.recent-section .col-xl-3{width:50%;flex-basis:50%;max-width:50%}
  .browse-counties .col-lg-3{width:100%;flex-basis:100%;max-width:100%}
  .homepage-stats .col-lg-3{width:50%;flex-basis:50%;max-width:50%}
  .cta-box{text-align:center!important;padding:24px 18px!important}
  .cta-features{justify-content:center!important}
}
@media(max-width:420px){
  .category-section .col-xl-3{width:50%;flex-basis:50%;max-width:50%}
  .home-marketplace-row .col-lg-3,.home-marketplace-row .col-xl-3,.trending-section .col-xl-3,.recent-section .col-xl-3{width:100%;flex-basis:100%;max-width:100%}
  .hero-stats{display:grid!important;grid-template-columns:repeat(2,1fr);gap:12px!important}
}

/* ==========================================================
   RECENTLY ADDED — FINAL RESPONSIVE CARD LAYOUT
   Keep cards fluid at every viewport size.
   ========================================================== */
.recent-section .row{
    display:flex!important;
    flex-wrap:wrap!important;
    width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
}

.recent-section .row > [class*="col-"]{
    min-width:0!important;
    width:25%!important;
    flex:0 0 25%!important;
    max-width:25%!important;
}

.recent-section .business-card{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:100%!important;
    overflow:hidden!important;
}

.recent-section .card-image{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:16 / 9!important;
    flex:0 0 auto!important;
}

.recent-section .card-body{
    min-width:0!important;
    overflow:hidden!important;
}

.recent-section .title-row,
.recent-section .title-row h4,
.recent-section .text-muted,
.recent-section .business-rating,
.recent-section .business-location{
    min-width:0!important;
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
}

@media (max-width: 991.98px){
    .recent-section .row > [class*="col-"]{
        width:50%!important;
        flex:0 0 50%!important;
        max-width:50%!important;
    }
}

@media (max-width: 767.98px){
    .recent-section{
        padding-left:0!important;
        padding-right:0!important;
    }

    .recent-section > .container{
        width:100%!important;
        max-width:100%!important;
        padding-left:12px!important;
        padding-right:12px!important;
    }

    .recent-section .row{
        --bs-gutter-x:10px!important;
        --bs-gutter-y:10px!important;
    }

    .recent-section .row > [class*="col-"]{
        width:100%!important;
        flex:0 0 100%!important;
        max-width:100%!important;
    }

    .recent-section .business-card{
        border-radius:14px!important;
    }

    .recent-section .card-image{
        aspect-ratio:16 / 9!important;
    }

    .recent-section .card-body{
        padding:12px!important;
    }

    .recent-section .title-row h4{
        font-size:.82rem!important;
        line-height:1.3!important;
    }

    .recent-section .text-muted.mb-2,
    .recent-section .business-rating,
    .recent-section .business-location{
        font-size:.62rem!important;
    }
}
