/* Magaza katmani - Riva duzeni (Figtree) */
:root {
    --font-heading: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-body: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

html, body, #app, .site-wrap,
h1, h2, h3, h4,
.detail-title {
    font-family: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

body {
    margin: 0;
    background: #fff;
    color: #222321;
}

html, body, #app, .site-wrap {
    width: 100%;
    max-width: none;
}

.container,
.footer-trust,
.footer-bottom,
.footer-newsletter {
    max-width: none !important;
    width: 100%;
}

.page-urun-detay .container,
.detail-layout,
.detail-below {
    max-width: 1230px !important;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.detail-layout {
    grid-template-columns: minmax(0, 1fr) 360px !important;
    gap: 2.5rem !important;
}

.gallery-main {
    max-height: 580px !important;
}

.gallery-thumbs-rail {
    max-height: 580px !important;
}

.detail-buy-panel {
    max-width: 360px;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

.btn-add-cart {
    flex: 0 1 auto !important;
    width: auto !important;
    min-width: 160px !important;
    max-width: 220px !important;
}

.container {
    padding-left: 32px;
    padding-right: 32px;
}

.shop-empty { text-align: center; padding: 72px 24px; color: #8a8178; }
.shop-empty p { margin: 0 0 1.25rem; font-size: 1rem; }

.shop-grid,
.catalog-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 30px 16px;
    width: 100%;
}

.home-product-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 30px 16px;
    width: 100%;
}

.catalog-product-frame,
.catalog-product-media { background: #fff; }
.catalog-product-media { aspect-ratio: 1 / 1; }
.catalog-product-media img,
.catalog-product-img {
    object-fit: contain;
    padding: 1.1rem;
    box-sizing: border-box;
}

@media (max-width: 1280px) {
    .shop-grid,
    .catalog-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .home-product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
    .home-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
    .shop-grid,
    .home-product-grid,
    .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .container { padding-left: 16px; padding-right: 16px; }
}
@media (max-width: 480px) {
    .shop-grid,
    .home-product-grid,
    .catalog-grid { gap: 1.25rem 0.75rem; }
}