/* Maris Kashi Marketplace V2
   Original marketplace UI inspired by specialist tile ecommerce patterns. */

:root {
  --primary: #10279C;
  --primary-dark: #0A145D;
  --primary-light: #142290;
  --primary-bg: #EEF2FF;
  --accent: #85CE45;
  --accent-soft: #F1FBE9;
  --dark: #041612;
  --dark-2: #0A145D;
  --off-white: #F7FAFF;
  --bg-gray: #EEF3FA;
  --border: #DDE6F4;
  --text: #041612;
  --text-light: #536170;
  --text-muted: #7A8796;
  --mk-red: #10279C;
  --mk-red-dark: #0A145D;
  --mk-ink: #041612;
  --mk-ink-2: #0A145D;
  --mk-muted: #5C6A78;
  --mk-line: #DDE6F4;
  --mk-soft: #F7FAFF;
  --mk-soft-red: #EEF2FF;
  --mk-green: #85CE45;
  --mk-blue: #142290;
  --mk-yellow: #85CE45;
  --mk-card: #ffffff;
  --mk-radius: 8px;
  --mk-shadow: 0 10px 28px rgba(31, 41, 51, .08);
  --mk-shadow-lg: 0 22px 64px rgba(31, 41, 51, .14);
}

html {
  background: #fff;
}

body {
  background: #fff !important;
  color: var(--mk-ink);
  letter-spacing: 0;
}

body::before {
  display: none !important;
}

.container {
  max-width: 1340px !important;
  padding-inline: 20px;
}

h1, h2, h3, h4 {
  color: var(--mk-ink);
  letter-spacing: 0 !important;
}

a {
  transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.btn,
.mk-btn,
.chip,
.product-card,
.mk-product-card,
.mk-category-card,
.mk-trust-card,
.mk-brand-card,
.brand-page-card,
.catalog-card,
.article-card,
.card,
.contact-card,
.info-item,
.filter-sidebar,
.search-bar,
.mk-hero-search,
.mk-market-card,
.mk-mini-banner,
.mk-banner-shell,
.mk-project-banner-box,
.mk-cta-box,
.mk-app-box,
.main-img,
.specs-table,
.contact-cta {
  border-radius: var(--mk-radius) !important;
}

/* Header */
.header {
  position: sticky !important;
  top: 0 !important;
  width: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: 0 1px 0 var(--mk-line), 0 8px 24px rgba(31, 41, 51, .06) !important;
}

.header-top {
  background: var(--mk-red-dark) !important;
  color: rgba(255,255,255,.78);
  padding: 6px 0 !important;
}

.header-main {
  background: #fff !important;
  border-bottom: 1px solid var(--mk-line) !important;
  padding: 12px 0 !important;
}

.header-main .container {
  gap: 18px;
}

.logo-img {
  max-height: 50px !important;
  filter: none !important;
}

.search-bar {
  max-width: 560px !important;
  min-height: 48px;
  border: 1px solid var(--mk-line) !important;
  background: var(--mk-soft) !important;
  box-shadow: none !important;
}

.search-bar:focus-within {
  border-color: var(--mk-red) !important;
  box-shadow: 0 0 0 4px rgba(229, 59, 75, .08) !important;
  background: #fff !important;
}

.search-bar input {
  padding-inline: 16px !important;
  font-size: .88rem;
}

.search-bar button {
  width: 44px;
  min-width: 44px;
  margin: 3px !important;
  border-radius: 6px !important;
  background: var(--mk-red) !important;
}

.header-nav {
  flex: 1;
  justify-content: center;
  gap: 2px;
}

/* Multi-level product categories */
.cat-nav { overflow:visible!important; position:relative; z-index:70; }
.cat-nav>.container { overflow:visible!important; }
.mega-categories { width:100%; display:flex; align-items:stretch; gap:0; direction:rtl; }
.mega-all-link,.mega-root-link { min-height:48px; display:flex; align-items:center; gap:8px; padding:0 15px; color:#243b48; font-size:.78rem; font-weight:800; white-space:nowrap; border-bottom:2px solid transparent; }
.mega-all-link { color:#fff; background:linear-gradient(135deg,#124b66,#1d6f93); border-radius:9px 9px 0 0; }
.mega-root-link i { margin-right:3px; font-size:.58rem; opacity:.55; transition:transform .2s ease; }
.mega-category:hover>.mega-root-link { color:#176486; border-bottom-color:#1d6f93; }
.mega-category:hover>.mega-root-link i { transform:rotate(180deg); }
.mega-category { position:static; }
.mega-panel { visibility:hidden; opacity:0; pointer-events:none; position:absolute; top:100%; right:50%; transform:translate(50%,8px); width:min(1180px,calc(100vw - 32px)); max-height:min(72vh,720px); overflow:auto; padding:22px; background:#fff; border:1px solid #dce6ea; border-radius:0 0 20px 20px; box-shadow:0 28px 70px rgba(16,50,67,.18); transition:opacity .18s ease,transform .18s ease; }
.mega-category:hover>.mega-panel,.mega-category:focus-within>.mega-panel { visibility:visible; opacity:1; pointer-events:auto; transform:translate(50%,0); }
.mega-panel-head { position:sticky; top:-22px; z-index:2; display:flex; align-items:center; justify-content:space-between; margin:-22px -22px 18px; padding:17px 22px; background:#f4fafb; border-bottom:1px solid #e0eaee; }
.mega-panel-head strong { color:#143c50; font-size:1rem; }.mega-panel-head a { color:#1d6f93; font-size:.76rem; font-weight:900; }
.mega-columns { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:26px 20px; align-items:start; }
.mega-group { min-width:0; }.mega-group h3 { margin:0 0 10px; padding-bottom:9px; border-bottom:1px solid #dfe8ec; font-size:.86rem; }.mega-group h3 a { color:#153e53; font-weight:900; }
.mega-group ul { list-style:none; padding:0; margin:0; }.mega-group li { margin:0; }.mega-group li>a { display:block; padding:5px 0; color:#627784; font-size:.75rem; line-height:1.5; }.mega-group li>a:hover { color:#167295; transform:translateX(-2px); }
.mega-group li ul { margin-right:10px; padding-right:10px; border-right:1px solid #e7eef1; }.mega-group .mega-depth-1>a { font-size:.7rem; color:#7a8c96; }.mega-group .mega-depth-2>a { font-size:.67rem; }
@media(max-width:1100px){.mega-root-link{padding:0 9px;font-size:.7rem}.mega-columns{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:780px){.cat-nav{overflow-x:auto!important}.cat-nav>.container{overflow:visible!important}.mega-categories{width:max-content}.mega-panel{display:none}.mega-all-link,.mega-root-link{min-height:44px}}

.header-nav a {
  padding: 9px 10px !important;
  color: var(--mk-ink-2) !important;
  font-size: .78rem !important;
  font-weight: 850 !important;
}

.header-nav a:hover,
.header-nav a.active {
  background: var(--mk-soft-red) !important;
  color: var(--mk-red) !important;
}

.cat-nav {
  background: #fff !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--mk-line) !important;
}

.cat-nav .container {
  gap: 8px;
}

.cat-nav-link {
  min-height: 42px;
  margin: 6px 0 !important;
  padding: 9px 13px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--mk-muted) !important;
  font-weight: 850 !important;
}

.cat-nav-link i {
  color: var(--mk-red) !important;
}

.cat-nav-link:hover,
.cat-nav-link.active {
  border-color: var(--mk-line) !important;
  background: var(--mk-soft) !important;
  color: var(--mk-ink) !important;
}

.cat-nav-link.all-cats {
  background: var(--mk-red) !important;
  color: #fff !important;
  border-color: var(--mk-red) !important;
}

.cat-nav-link.all-cats i {
  color: #fff !important;
}

.store-benefits {
  background: #fff;
  border-bottom: 1px solid var(--mk-line);
}

.store-benefits .container {
  min-height: 44px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: center;
  gap: 12px;
}

.store-benefits span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--mk-muted);
  font-size: .78rem;
  font-weight: 800;
}

.store-benefits i {
  color: var(--mk-green);
}

/* Homepage */
.mk-hero {
  min-height: 560px !important;
  padding: 42px 0 34px !important;
  background:
    linear-gradient(90deg, rgba(4,22,18,.9), rgba(10,20,93,.68) 45%, rgba(20,34,144,.2)),
    url('../images/about-placeholder.jpg') center/cover no-repeat !important;
}

body.lang-en .mk-hero {
  background:
    linear-gradient(270deg, rgba(4,22,18,.9), rgba(10,20,93,.68) 45%, rgba(20,34,144,.2)),
    url('../images/about-placeholder.jpg') center/cover no-repeat !important;
}

.mk-hero-grid {
  grid-template-columns: minmax(0, 1fr) minmax(390px, .82fr) !important;
  gap: 36px !important;
}

.mk-eyebrow {
  padding: 7px 11px !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  font-size: .78rem !important;
}

.mk-hero h1 {
  max-width: 760px;
  font-size: clamp(2.15rem, 4.2vw, 4.25rem) !important;
  line-height: 1.18 !important;
  color: #fff !important;
}

.mk-hero p {
  max-width: 680px;
  color: rgba(255,255,255,.82) !important;
  font-size: 1rem !important;
}

.mk-hero-search {
  max-width: 720px !important;
  min-height: 60px !important;
  grid-template-columns: 48px 1fr auto !important;
  margin: 4px 0 14px !important;
  padding: 7px !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: 0 16px 44px rgba(0,0,0,.22) !important;
}

.mk-hero-search i {
  color: var(--mk-red) !important;
}

.mk-hero-search input {
  min-height: 46px;
  border: 0 !important;
  background: transparent !important;
}

.mk-hero-search button,
.mk-btn-primary,
.btn-primary {
  background: var(--mk-red) !important;
  border-color: var(--mk-red) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.mk-hero-search button:hover,
.mk-btn-primary:hover,
.btn-primary:hover {
  background: var(--mk-red-dark) !important;
  border-color: var(--mk-red-dark) !important;
}

.mk-btn-secondary,
.btn-outline {
  background: #fff !important;
  border-color: var(--mk-line) !important;
  color: var(--mk-ink) !important;
}

.mk-hero .mk-btn-secondary {
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.34) !important;
}

.mk-hot-links a {
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.2) !important;
}

.mk-hero-panel {
  min-height: 450px !important;
  background: #fff !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  box-shadow: var(--mk-shadow-lg) !important;
}

.mk-hero-panel img,
.mk-hero-swiper,
.mk-hero-swiper .swiper-wrapper,
.mk-hero-swiper .swiper-slide {
  min-height: 450px !important;
}

.mk-project-card {
  background: #fff !important;
  border: 1px solid var(--mk-line) !important;
  box-shadow: var(--mk-shadow) !important;
}

.mk-app-shortcuts {
  margin-top: -24px !important;
  padding-bottom: 22px !important;
}

.mk-shortcut-strip {
  grid-template-columns: repeat(9, 1fr) !important;
  padding: 12px !important;
  border: 1px solid var(--mk-line) !important;
  background: #fff !important;
  box-shadow: var(--mk-shadow) !important;
}

.mk-shortcut-item {
  min-height: 86px !important;
  font-size: .76rem !important;
}

.mk-shortcut-item i,
.mk-category-icon {
  background: var(--mk-soft-red) !important;
  color: var(--mk-red) !important;
  border-radius: var(--mk-radius) !important;
}

.mk-trust-card i,
.mk-market-card > i {
  background: var(--accent-soft) !important;
  color: var(--mk-green) !important;
  border-radius: var(--mk-radius) !important;
}

.mk-section {
  padding: 54px 0 !important;
}

.mk-section-head {
  border-bottom: 1px solid var(--mk-line) !important;
  margin-bottom: 22px !important;
}

.mk-section-head span,
.mk-split-copy > span,
.mk-banner-content span,
.mk-mini-banner span,
.mk-project-banner-box span,
.mk-cta-box span {
  color: var(--mk-red) !important;
}

.mk-section-head a {
  color: var(--mk-red) !important;
}

.mk-trust-grid {
  margin-top: 0 !important;
  gap: 12px !important;
}

.mk-trust-card,
.mk-category-card,
.mk-product-card,
.mk-brand-card,
.mk-market-card,
.brand-page-card,
.catalog-card,
.article-card,
.product-card,
.pcard,
.card,
.info-item,
.filter-sidebar {
  background: #fff !important;
  border: 1px solid var(--mk-line) !important;
  box-shadow: none !important;
}

.mk-trust-card:hover,
.mk-category-card:hover,
.mk-product-card:hover,
.mk-brand-card:hover,
.product-card:hover,
.brand-page-card:hover,
.catalog-card:hover,
.article-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: var(--mk-shadow) !important;
  border-color: #d5dce2 !important;
}

.mk-market-grid {
  grid-template-columns: 1.35fr .82fr .82fr !important;
}

.mk-market-main {
  background: linear-gradient(135deg, var(--mk-red), var(--mk-red-dark)) !important;
}

.mk-banner-shell,
.mk-project-banner-box,
.mk-mini-banner,
.mk-app-box,
.mk-cta-box {
  border: 1px solid var(--mk-line) !important;
  box-shadow: none !important;
}

.mk-banner-shell,
.mk-project-banner-box {
  background: #fff !important;
}

.mk-mini-blue {
  background: #f4f8ff !important;
}

.mk-mini-pearl {
  background: #fff6ed !important;
}

.mk-split-section {
  background: var(--mk-soft) !important;
  border-color: var(--mk-line) !important;
}

.mk-split-media,
.mk-split-media img {
  min-height: 390px !important;
}

.mk-product-grid,
.products-grid {
  gap: 14px !important;
}

.mk-product-card,
.product-card {
  overflow: hidden;
}

.mk-product-img,
.product-card .img-wrap {
  background: var(--mk-soft) !important;
}

.mk-product-img em,
.product-card .badge-featured {
  background: var(--mk-green) !important;
  color: #fff !important;
  border-radius: 6px !important;
}

.mk-product-body,
.product-card .card-body {
  padding: 14px !important;
}

.mk-product-body span,
.product-card .cat-label {
  color: var(--mk-red) !important;
  font-size: .72rem !important;
}

.mk-product-body strong,
.product-card .card-footer span[style*="color"] {
  color: var(--mk-red) !important;
}

.mk-product-body h3,
.product-card h3 {
  font-size: .88rem !important;
  line-height: 1.7 !important;
}

.product-card .card-footer {
  border-top: 1px solid var(--mk-line) !important;
  padding: 11px 14px !important;
}

.product-card .brand {
  background: var(--mk-soft) !important;
  color: var(--mk-muted) !important;
  border-radius: 6px !important;
}

.mk-brand-card img,
.brand-slide img,
.brand-logo-wrap img {
  filter: none !important;
}

.mk-app-box,
.mk-cta-box {
  background: var(--mk-red-dark) !important;
}

.mk-app-actions a,
.mk-cta-box .mk-btn-light {
  border-radius: var(--mk-radius) !important;
}

/* Page headers and listings */
.page-header {
  padding: 42px 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(135deg, var(--mk-ink), var(--mk-red-dark) 52%, var(--mk-blue)) !important;
}

.page-header .container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.page-header h1 {
  color: #fff !important;
  font-size: clamp(1.55rem, 2.8vw, 2.45rem) !important;
}

.breadcrumb,
.breadcrumb a {
  color: rgba(255,255,255,.78) !important;
}

.section {
  padding: 38px 0 !important;
}

.products-layout {
  grid-template-columns: 280px minmax(0, 1fr) !important;
  gap: 18px !important;
}

body.lang-en .products-layout {
  grid-template-columns: minmax(0, 1fr) 280px !important;
}

.filter-sidebar {
  top: 156px !important;
  overflow: hidden !important;
}

.sidebar-header {
  background: #fff !important;
}

.filter-section-header {
  min-height: 45px !important;
}

.filter-section-body {
  max-height: 240px;
  overflow: auto;
  background: #fff !important;
}

.filter-option-chip span,
.active-filter-chip,
.chip {
  border-radius: var(--mk-radius) !important;
}

.filter-option-chip input:checked + span,
.chip.active {
  background: var(--mk-red) !important;
  border-color: var(--mk-red) !important;
  color: #fff !important;
}

.filter-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px !important;
  background: #fff;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
}

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

.badge-kl {
  background: var(--mk-blue) !important;
}

.admin-pagination a,
.pagination a,
.pagination span {
  border-radius: var(--mk-radius) !important;
}

/* Product detail */
.product-detail {
  padding: 34px 0 60px !important;
  background: var(--mk-soft);
}

.product-detail-grid {
  grid-template-columns: minmax(0, .92fr) minmax(420px, .72fr) !important;
  gap: 18px !important;
  align-items: start !important;
}

.product-gallery,
.product-info {
  background: #fff;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  padding: 16px;
}

.product-info {
  position: sticky;
  top: 154px;
}

.main-img {
  overflow: hidden;
  border: 1px solid var(--mk-line);
  background: #fff !important;
}

.main-img img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.gallery-thumbs {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px !important;
  margin-top: 10px;
}

.gallery-thumbs img {
  width: 100% !important;
  aspect-ratio: 1 / 1;
  border: 1px solid var(--mk-line) !important;
  border-radius: var(--mk-radius) !important;
  object-fit: cover;
}

.gallery-thumbs img.active {
  border-color: var(--mk-red) !important;
}

.product-info h1 {
  font-size: clamp(1.3rem, 2.2vw, 2rem) !important;
  line-height: 1.55 !important;
  margin-bottom: 12px !important;
}

.product-info .meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

.category-link,
.product-info .brand {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border-radius: var(--mk-radius);
  background: var(--mk-soft);
  color: var(--mk-muted) !important;
  font-size: .78rem;
  font-weight: 800;
}

.description {
  color: var(--mk-ink-2) !important;
  line-height: 2 !important;
  padding: 14px 0;
  border-top: 1px solid var(--mk-line);
  border-bottom: 1px solid var(--mk-line);
  margin-bottom: 18px;
}

.product-buy-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 15px;
  margin: 0 0 14px;
  border: 1px solid rgba(16,39,156,.18);
  background: var(--mk-soft-red);
  border-radius: var(--mk-radius);
}

.product-buy-box span {
  display: block;
  color: var(--mk-muted);
  font-size: .76rem;
  font-weight: 850;
  margin-bottom: 4px;
}

.product-buy-box strong {
  display: block;
  color: var(--mk-red);
  font-size: 1.2rem;
}

.product-assurance {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 16px;
}

.product-assurance span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 42px;
  padding: 8px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  color: var(--mk-muted);
  font-size: .75rem;
  font-weight: 850;
  text-align: center;
}

.product-assurance i {
  color: var(--mk-green);
}

.specs-table {
  width: 100%;
  border: 1px solid var(--mk-line);
  box-shadow: none !important;
}

.specs-table td {
  padding: 11px 13px !important;
  border-bottom: 1px solid var(--mk-line) !important;
}

.specs-table td:first-child {
  color: var(--mk-muted);
  background: var(--mk-soft);
  width: 38%;
}

.contact-cta {
  margin-top: 18px !important;
  background: var(--mk-soft-red) !important;
  border: 1px solid rgba(16,39,156,.18) !important;
  box-shadow: none !important;
}

.contact-cta .icon {
  background: var(--mk-red) !important;
  color: #fff !important;
}

/* Contact, brands, catalogs */
.contact-grid,
.about-grid {
  gap: 18px !important;
}

.contact-info-box,
.contact-grid .card {
  background: #fff;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  padding: 22px;
}

.info-item {
  padding: 14px !important;
  margin-bottom: 10px !important;
}

.info-item .icon {
  background: var(--mk-soft-red) !important;
  color: var(--mk-red) !important;
}

.brands-page-grid,
.catalog-grid,
.magazine-grid {
  gap: 14px !important;
}

.brand-logo-wrap {
  background: var(--mk-soft) !important;
}

.catalog-cover {
  background: var(--mk-soft) !important;
}

.catalog-brand-badge {
  background: var(--mk-red) !important;
  border-radius: 6px !important;
}

/* Footer and quick actions */
.footer {
  margin-top: 0 !important;
  border-radius: 0 !important;
  background: var(--mk-ink) !important;
}

.footer-main {
  padding-top: 44px !important;
}

.quick-contact {
  right: 18px !important;
}

body.lang-en .quick-contact {
  left: 18px !important;
  right: auto !important;
}

.quick-contact-btn {
  border-radius: var(--mk-radius) !important;
}

.quick-contact-primary {
  background: var(--mk-red) !important;
}

.app-bottom-nav a.active,
.app-bottom-nav a:hover {
  color: var(--mk-red) !important;
}

.app-bottom-nav {
  display: none;
}

/* Responsive */
@media (min-width: 1180px) {
  .mk-product-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 1180px) {
  .header-nav {
    display: none !important;
  }

  .hamburger {
    display: flex !important;
  }

  .products-layout,
  body.lang-en .products-layout {
    grid-template-columns: 1fr !important;
  }

  .filter-sidebar {
    position: relative !important;
    top: auto !important;
    overflow: visible !important;
  }

  .product-detail-grid {
    grid-template-columns: 1fr !important;
  }

  .product-info {
    position: static;
  }
}

@media (max-width: 900px) {
  .header-top {
    display: none !important;
  }

  .header-main .container {
    min-height: 58px !important;
  }

  .logo-img {
    max-height: 42px !important;
  }

  .cat-nav .container {
    padding-inline: 12px;
  }

  .store-benefits .container {
    display: flex;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .store-benefits .container::-webkit-scrollbar {
    display: none;
  }

  .store-benefits span {
    min-width: max-content;
    justify-content: flex-start;
  }

  .mk-hero {
    min-height: auto !important;
    padding: 32px 0 28px !important;
  }

  .mk-hero-grid,
  .mk-market-grid,
  .mk-banner-shell,
  .mk-split-grid {
    grid-template-columns: 1fr !important;
  }

  .mk-hero h1 {
    font-size: clamp(1.85rem, 9vw, 3rem) !important;
  }

  .mk-hero-panel,
  .mk-hero-panel img,
  .mk-hero-swiper,
  .mk-hero-swiper .swiper-wrapper,
  .mk-hero-swiper .swiper-slide {
    min-height: 300px !important;
  }

  .mk-hero-search {
    grid-template-columns: 40px 1fr !important;
  }

  .mk-hero-search button {
    grid-column: 1 / -1;
    width: 100%;
  }

  .mk-app-shortcuts {
    margin-top: 0 !important;
    padding: 12px 0 !important;
  }

  .mk-shortcut-strip {
    display: flex !important;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .mk-shortcut-strip::-webkit-scrollbar {
    display: none;
  }

  .mk-shortcut-item {
    min-width: 92px !important;
  }

  .mk-trust-grid,
  .mk-category-grid,
  .mk-product-grid,
  .mk-brand-grid,
  .products-grid,
  .products-grid-3,
  .brands-page-grid,
  .catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .filter-bar {
    display: grid !important;
  }

  .filter-bar form {
    width: 100%;
  }

  .contact-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 620px) {
  body {
    padding-bottom: calc(88px + env(safe-area-inset-bottom)) !important;
  }

  .app-bottom-nav {
    position: fixed;
    right: 16px;
    bottom: max(12px, env(safe-area-inset-bottom));
    left: 16px;
    z-index: 2600;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    min-height: 72px;
    padding: 8px;
    overflow: visible;
    background: #102d3b;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 26px;
    box-shadow: 0 18px 45px rgba(7, 25, 34, .32);
  }

  .app-bottom-nav a {
    position: relative;
    min-width: 0;
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    padding: 6px 2px;
    color: #9eb2bc;
    border-radius: 19px;
    font-size: .62rem;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    transition: color .2s ease, transform .2s ease;
  }

  .app-bottom-nav i {
    width: 34px;
    height: 30px;
    display: grid;
    place-items: center;
    font-size: 1.02rem;
    line-height: 1;
    transition: transform .2s ease, background .2s ease, color .2s ease;
  }

  .app-bottom-nav a.active {
    color: #fff !important;
    transform: translateY(-7px);
    background: transparent;
  }

  .app-bottom-nav a.active i {
    width: 46px;
    height: 46px;
    margin-top: -16px;
    color: #102d3b;
    background: #dff28f;
    border: 5px solid #102d3b;
    border-radius: 50%;
    box-shadow: 0 8px 20px rgba(223, 242, 143, .24);
  }

  .app-bottom-nav a:hover,
  .app-bottom-nav a:focus-visible {
    color: #fff !important;
    background: transparent;
    outline: none;
  }

  .app-bottom-nav a:not(.active):hover i,
  .app-bottom-nav a:not(.active):focus-visible i {
    color: #dff28f;
    transform: translateY(-2px);
  }

  #back-to-top,
  .quick-contact {
    display: none !important;
  }

  .container {
    padding-inline: 12px;
  }

  .search-bar {
    display: none !important;
  }

  .cat-nav-link {
    min-height: 38px;
    padding: 8px 11px !important;
    font-size: .72rem !important;
  }

  .page-header {
    padding: 28px 0 !important;
  }

  .mk-section,
  .section {
    padding: 34px 0 !important;
  }

  .mk-trust-grid,
  .mk-category-grid,
  .mk-product-grid,
  .mk-brand-grid,
  .products-grid,
  .products-grid-3,
  .brands-page-grid,
  .catalog-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  .mk-product-body,
  .product-card .card-body {
    padding: 11px !important;
  }

  .mk-product-body h3,
  .product-card h3 {
    font-size: .8rem !important;
  }

  .product-card .card-footer {
    padding: 9px 11px !important;
  }

  .product-gallery,
  .product-info {
    padding: 10px;
  }

  .gallery-thumbs {
    grid-template-columns: repeat(4, 1fr);
  }

  .contact-info-box,
  .contact-grid .card {
    padding: 14px;
  }

  .product-buy-box {
    align-items: stretch;
    flex-direction: column;
  }

  .product-buy-box .btn {
    width: 100%;
    justify-content: center;
  }

  .product-assurance {
    grid-template-columns: 1fr;
  }

  .footer {
    padding-bottom: 64px;
  }
}

@media (max-width: 420px) {
  .mk-trust-grid,
  .mk-category-grid,
  .mk-product-grid,
  .mk-brand-grid,
  .products-grid,
  .products-grid-3,
  .brands-page-grid,
  .catalog-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Stable homepage search override */
.mk-hero .mk-hero-search {
  width: min(100%, 720px) !important;
  min-height: 58px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  grid-template-columns: none !important;
  margin: 8px 0 14px !important;
  padding: 6px !important;
  background: #fff !important;
  border: 1px solid rgba(255,255,255,.7) !important;
  border-radius: 10px !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.22) !important;
  overflow: hidden !important;
}

.mk-hero .mk-hero-search i {
  width: 42px !important;
  height: 46px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 42px !important;
  color: var(--mk-red) !important;
  font-size: 1rem !important;
}

.mk-hero .mk-hero-search input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 4px !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: var(--mk-ink) !important;
  font-size: .94rem !important;
  line-height: 46px !important;
  box-shadow: none !important;
}

.mk-hero .mk-hero-search input::placeholder {
  color: #8b98a3 !important;
  opacity: 1;
}

.mk-hero .mk-hero-search button {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 104px !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  grid-column: auto !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--mk-red) !important;
  color: #fff !important;
  font-size: .86rem !important;
  font-weight: 900 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

.mk-hero .mk-hero-search button:hover {
  background: var(--mk-red-dark) !important;
}

@media (max-width: 620px) {
  .mk-hero .mk-hero-search {
    min-height: 54px !important;
    gap: 4px !important;
    padding: 5px !important;
    border-radius: 9px !important;
  }

  .mk-hero .mk-hero-search i {
    width: 34px !important;
    flex-basis: 34px !important;
    height: 42px !important;
  }

  .mk-hero .mk-hero-search input {
    height: 42px !important;
    min-height: 42px !important;
    line-height: 42px !important;
    font-size: .82rem !important;
  }

  .mk-hero .mk-hero-search button {
    min-width: 78px !important;
    height: 42px !important;
    padding: 0 12px !important;
    font-size: .78rem !important;
  }
}

/* Full redesign for the hamburger mobile menu */
.mobile-nav {
  position: fixed !important;
  inset: 0 !important;
  z-index: 3000 !important;
  display: block !important;
  padding: 18px !important;
  overflow-y: auto !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(133,206,69,.22), transparent 34%),
    radial-gradient(circle at 82% 12%, rgba(20,34,144,.32), transparent 30%),
    linear-gradient(180deg, var(--mk-red-dark) 0%, var(--mk-ink) 100%) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(18px) scale(.98) !important;
  transition: opacity .24s ease, transform .24s ease !important;
}

.mobile-nav.open {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateY(0) scale(1) !important;
}

.mobile-nav::before {
  content: "ماریس کاشی";
  display: flex;
  align-items: center;
  min-height: 54px;
  margin: 4px 64px 18px 0;
  color: #fff;
  font-size: 1.25rem;
  font-weight: 950;
}

body.lang-en .mobile-nav::before {
  content: "Maris Kashi";
  margin: 4px 0 18px 64px;
}

.mobile-nav::after {
  content: "";
  display: block;
  margin: -18px 64px 18px 0;
  color: rgba(255,255,255,.58);
  font-size: .78rem;
  font-weight: 700;
}

body.lang-en .mobile-nav::after {
  content: "Tiles, ceramics and porcelain store";
  margin: -18px 0 18px 64px;
}

.mobile-nav .close-nav {
  position: fixed !important;
  top: 20px !important;
  left: 18px !important;
  z-index: 2 !important;
  width: 46px !important;
  height: 46px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
  font-size: 1.05rem !important;
  backdrop-filter: blur(14px) !important;
}

body.lang-en .mobile-nav .close-nav {
  right: 18px !important;
  left: auto !important;
}

.mobile-nav a {
  width: 100% !important;
  min-height: 58px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 10px !important;
  padding: 14px 16px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.065) !important;
  color: rgba(255,255,255,.9) !important;
  font-size: .96rem !important;
  font-weight: 900 !important;
  text-align: right !important;
  box-shadow: none !important;
  backdrop-filter: blur(12px) !important;
}

.mobile-nav a::after {
  content: "\f053";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 28px;
  border-radius: 10px;
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.72);
  font-size: .7rem;
}

body.lang-en .mobile-nav a::after {
  content: "\f054";
}

.mobile-nav a:nth-of-type(1),
.mobile-nav a:nth-of-type(2),
.mobile-nav a:nth-last-of-type(1) {
  background: #fff !important;
  color: var(--mk-ink) !important;
  border-color: #fff !important;
}

.mobile-nav a:nth-of-type(1)::after,
.mobile-nav a:nth-of-type(2)::after,
.mobile-nav a:nth-last-of-type(1)::after {
  background: var(--mk-soft-red);
  color: var(--mk-red);
}

.mobile-nav a:hover {
  transform: translateY(-1px) !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
}

.mobile-nav a:nth-of-type(1):hover,
.mobile-nav a:nth-of-type(2):hover,
.mobile-nav a:nth-last-of-type(1):hover {
  background: #fff !important;
  color: var(--mk-red) !important;
}

@media (min-width: 769px) {
  .mobile-nav {
    display: none !important;
  }
}

@media (max-width: 420px) {
  .mobile-nav {
    padding: 14px !important;
  }

  .mobile-nav::before {
    margin-right: 58px;
    font-size: 1.12rem;
  }

  .mobile-nav::after {
    margin-right: 58px;
    font-size: .72rem;
  }

  .mobile-nav a {
    min-height: 54px !important;
    padding: 12px 14px !important;
    border-radius: 16px !important;
    font-size: .9rem !important;
  }
}

/* Final interaction overrides: keep these after legacy marketplace rules. */
.mega-category.is-open>.mega-panel,
.mega-category:hover>.mega-panel,
.mega-category:focus-within>.mega-panel {
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  transform:translate(50%,0)!important;
}
.mega-panel { overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#78b8ca #eef6f8; }
.mega-panel::-webkit-scrollbar,.filter-sidebar::-webkit-scrollbar,.filter-section-body::-webkit-scrollbar { width:8px; }
.mega-panel::-webkit-scrollbar-thumb,.filter-sidebar::-webkit-scrollbar-thumb,.filter-section-body::-webkit-scrollbar-thumb { background:#78b8ca; border-radius:99px; border:2px solid #eef6f8; }
.filter-sidebar { max-height:calc(100vh - 176px)!important; overflow-x:hidden!important; overflow-y:auto!important; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#78b8ca #eef6f8; }
.filter-section-body { max-height:260px!important; overflow-y:auto!important; overscroll-behavior:contain; }
@media(max-width:780px){
  .mega-panel { display:block!important; position:fixed!important; inset:130px 10px 74px!important; width:auto!important; max-height:none!important; transform:translateY(8px)!important; border-radius:18px!important; padding:16px!important; }
  .mega-category.is-open>.mega-panel { transform:translateY(0)!important; }
  .mega-category:hover:not(.is-open)>.mega-panel { visibility:hidden!important; opacity:0!important; pointer-events:none!important; }
  .mega-columns { grid-template-columns:1fr!important; gap:18px!important; }
  .mega-panel-head { top:-16px; margin:-16px -16px 14px; padding:14px 16px; }
  .filter-sidebar { max-height:none!important; overflow:visible!important; }
}

/* Cascading catalogue navigation: one trigger, six roots, contextual filters. */
.catalog-menu { position:relative; direction:rtl; }
.catalog-trigger { min-width:220px; min-height:48px; display:flex; align-items:center; gap:10px; padding:0 17px; border:0; color:#fff; background:linear-gradient(135deg,#124b66,#1d6f93); font:inherit; font-size:.82rem; font-weight:900; cursor:pointer; }
.catalog-trigger-arrow { margin-right:auto; font-size:.62rem; transition:transform .2s ease; }
.catalog-menu:is(:focus-within,.is-open) .catalog-trigger-arrow { transform:rotate(180deg); }
.catalog-panel { visibility:hidden; opacity:0; pointer-events:none; position:absolute; top:100%; right:0; width:min(1180px,calc(100vw - 32px)); height:min(70vh,650px); display:grid; grid-template-columns:245px minmax(0,1fr); background:#fff; border:1px solid #dbe5e9; border-radius:0 0 18px 18px; box-shadow:0 28px 70px rgba(16,50,67,.2); overflow:hidden; transform:translateY(7px); transition:opacity .16s ease,transform .16s ease; }
.catalog-menu:is(:focus-within,.is-open)>.catalog-panel { visibility:visible; opacity:1; pointer-events:auto; transform:translateY(0); }
.catalog-roots { padding:10px 0; background:#f5f8f9; border-left:1px solid #dfe8eb; overflow-y:auto; }
.catalog-root { width:100%; min-height:58px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 18px; border:0; border-right:3px solid transparent; background:transparent; color:#354d5a; font:inherit; font-size:.8rem; font-weight:850; text-align:right; cursor:pointer; }
.catalog-root i { color:#8ba0aa; font-size:.65rem; }.catalog-root:hover,.catalog-root.is-active { color:#155f80; background:#fff; border-right-color:#1d6f93; }
.catalog-content { min-width:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#78b8ca #eef6f8; }
.catalog-subpanel { display:none; padding:22px; }.catalog-subpanel.is-active { display:block; }
.catalog-subpanel>header { position:sticky; top:-22px; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:20px; margin:-22px -22px 20px; padding:17px 22px; background:#fff; border-bottom:1px solid #e1e9ec; }
.catalog-subpanel>header strong { color:#153e53; font-size:1rem; }.catalog-subpanel>header a { color:#1d6f93; font-size:.75rem; font-weight:900; }
@media(max-width:780px){
  .catalog-trigger { min-width:210px; min-height:44px; }
  .catalog-menu:not(.is-open)>.catalog-panel { visibility:hidden!important; opacity:0!important; pointer-events:none!important; }
  .catalog-menu.is-open>.catalog-panel { visibility:visible!important; opacity:1!important; pointer-events:auto!important; }
  .catalog-panel { position:fixed; inset:126px 8px 70px; width:auto; height:auto; grid-template-columns:132px minmax(0,1fr); border-radius:16px; transform:translateY(6px); }
  .catalog-menu.is-open>.catalog-panel { transform:translateY(0); }
  .catalog-root { min-height:52px; padding:8px 10px; font-size:.68rem; }
  .catalog-subpanel { padding:14px; }.catalog-subpanel>header { top:-14px; margin:-14px -14px 14px; padding:13px 14px; }
  .catalog-subpanel .mega-columns { grid-template-columns:1fr!important; }
}