/* =====================================================================
   Tema: Marketplace — putih + biru navy, kartu rapat, kategori bulat
   ===================================================================== */
:root{
  --bg:#f5f7fb;--surf:#fff;--ink:#1a2233;--ink2:#4b5567;--muted:#8792a5;--line:#e3e8f0;--line2:#cfd7e3;
  --navy:#1d3a6b;--soft:#eef3fb;--dark:#1d3a6b;--inv-bg:#1d3a6b;--inv-ink:#fff;--place:#eef1f6;--sh:0 6px 20px rgba(29,58,107,.08);
  --card-r:12px;
}
h1,h2,h3,h4,.h3,.h4{letter-spacing:-.02em;font-weight:800}
.eyebrow{letter-spacing:.08em;font-size:11.5px}

/* Header biru navy */
.topbar{background:#152c52}
.site-header{background:var(--navy);border-bottom:0;color:#fff}
.site-header .brand-text,.site-header .icon-btn,.site-header .header-cart{color:#fff}
.site-header .brand-mark{background:#fff;color:var(--navy)}
.site-header .brand-text em{color:#9cc3ff}
.search-form{background:#fff;border-color:#fff;border-radius:999px;padding-left:16px}
.search-form input{color:var(--ink)}
.search-form button{background:var(--acc);color:#fff;border-radius:999px;padding:8px 16px}
.header-wa{background:#fff;color:var(--ok);border-color:#fff}
.header-wa:hover{background:#eefbf3;color:var(--ok)}
.cart-badge{background:#ff6b3d;color:#fff}
.main-nav{background:var(--surf);border-top:0;box-shadow:0 2px 12px rgba(29,58,107,.06)}
.nav-in a{height:44px;font-size:14px;color:var(--ink2)}
.nav-in a:hover,.nav-in a.active{color:var(--acc);border-color:var(--acc)}
.nav-promo{color:#e2452d}

/* Hero ala marketplace (lihat views/themes/marketplace/partials/home/hero.php) */
.mk-hero{padding-block:20px 8px}
.mk-hero-grid{display:grid;grid-template-columns:1fr;gap:14px}
.mk-banner{position:relative;background:linear-gradient(120deg,var(--navy) 0%,#2c59a5 60%,var(--acc) 100%);color:#fff;border-radius:18px;padding:28px 24px;display:flex;flex-direction:column;gap:12px;min-height:280px;overflow:hidden}
.mk-banner .eyebrow{color:#ffd28a}
.mk-banner h1{font-size:clamp(28px,5vw,44px);line-height:1.08;max-width:560px}
.mk-banner p{color:#dbe6f8;max-width:520px;font-size:15.5px}
.mk-banner .btn{align-self:flex-start;background:#fff;color:var(--navy);border-radius:999px;font-weight:700}
.mk-banner .btn:hover{background:#eef3fb;color:var(--navy)}
.mk-banner>*:not(.mk-banner-img){position:relative;z-index:1}
.mk-banner-img{position:absolute;right:-20px;bottom:-30px;width:40%;max-width:340px;opacity:.95;border-radius:16px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.25);display:none}
.mk-banner-img img{width:100%;height:100%;object-fit:cover}
.mk-side{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mk-tile{background:var(--surf);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:6px;color:inherit}
.mk-tile:hover{border-color:var(--acc);color:inherit}
.mk-tile svg{color:var(--acc)}
.mk-tile strong{font-size:15px}
.mk-tile small{color:var(--ink2);font-size:13px;line-height:1.4}
.mk-trust{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:13px;color:var(--ink2);padding:14px 0 6px}
.mk-trust li{display:flex;align-items:center;gap:6px}
.mk-trust svg{color:var(--ok)}

/* Section: judul lebih kecil, kartu putih */
.section{padding-block:28px}
.section-head h2{font-size:clamp(20px,2.6vw,26px)}
.section-head{margin-bottom:14px;align-items:center}
.section-alt{background:transparent;border:0}
.cat-grid{gap:8px}
.cat-card{border:0;background:transparent;padding:8px 4px;box-shadow:none}
.cat-card:hover{box-shadow:none;transform:none;background:transparent}
.cat-card img{border-radius:50%;aspect-ratio:1/1;max-width:96px;background:var(--soft);padding:10px;object-fit:contain;border:2px solid transparent;transition:.15s}
.cat-card:hover img{border-color:var(--acc)}
.cat-name{font-size:13px;color:var(--navy)}
.cat-count{display:none}
.product-grid{gap:10px}
.pcard{border-radius:var(--card-r);box-shadow:none}
.pcard:hover{box-shadow:var(--sh);transform:none;border-color:var(--acc)}
.pcard-body{padding:10px 12px 12px;gap:4px}
.pcard-title{font-size:14px;font-weight:500;min-height:2.5em}
.pcard-price .price{font-size:18px;color:var(--navy)}
.pcard-rating{font-size:11.5px}
.pcard-actions .btn-primary{min-height:36px;font-size:13px}
.pcard-actions .btn-icon{width:36px;min-height:36px}
.badge{border-radius:4px;height:22px;font-size:11px}
.usp{background:transparent;border:0}
.usp-grid{padding-block:6px 14px;background:var(--surf);border:1px solid var(--line);border-radius:14px;padding:18px 20px}
.usp-icon{background:var(--soft);color:var(--acc);border-radius:50%}
.promo-block{background:var(--navy);border-radius:18px}
.promo-blob{background:var(--acc);opacity:.35}
.promo-text .btn{background:#fff;color:var(--navy)}
.promo-card{background:rgba(255,255,255,.08)}
.promo-card-price{color:#ffd28a}
.testi-card{border-radius:14px}
.cta-block{background:var(--soft);border-radius:18px}
.site-footer{background:var(--navy)}
.footer-contact svg{color:#9cc3ff}
.footer-bottom{border-color:rgba(255,255,255,.12)}
.wa-float{border-radius:14px}
.bottom-bar a.active{color:var(--acc)}

/* Halaman lain */
.catalog-head h1{font-size:clamp(24px,3.5vw,34px)}
.filter-group legend{color:var(--navy)}
.product-info h1{font-size:clamp(24px,3.5vw,34px)}
.price-box{background:var(--soft);border:0}
.tab.active{border-color:var(--acc)}
.page-title{font-size:clamp(24px,3.5vw,34px)}

@media (min-width:900px){
  .section{padding-block:36px}
  .mk-hero-grid{grid-template-columns:2.2fr 1fr}
  .mk-banner{padding:44px 48px;min-height:340px}
  .mk-banner-img{display:block}
  .mk-banner h1,.mk-banner p{max-width:56%}
  .mk-side{grid-template-columns:1fr;grid-auto-rows:1fr}
  .cat-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .product-grid{gap:14px}
}