*, *::before, *::after {
    box-sizing: border-box;
}

/* ── CSS Variables ──────────────────────────────────────── */
:root {
    --color-brand:       #ec4899;
    --color-brand-dark:  #db2777;
    --color-brand-light: #fbcfe8;
}

/* ── Base overrides ─────────────────────────────────────── */
body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    color: #1f2937;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
}

a { text-decoration: none; color: inherit; }

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration { display: none; }

@media (pointer: fine) {
    ::-webkit-scrollbar { width: 6px; height: 6px; }
    ::-webkit-scrollbar-track { background: transparent; }
    ::-webkit-scrollbar-thumb { background-color: var(--color-brand); border-radius: 3px; }
    ::-webkit-scrollbar-thumb:hover { background-color: var(--color-brand-dark); }
}

/* ── Font Awesome — глобальное выравнивание ─────────────── */
.fa-solid,
.fa-regular,
.fa-brands {
    line-height: 1;
    vertical-align: middle;
    flex-shrink: 0;
}

a > i, button > i, span > i, p > i,
h1 > i, h2 > i, h3 > i, label > i, div > i {
    display: inline-flex;
    align-self: center;
    vertical-align: middle;
}

/* ── Utils ───────────────────────────────────────────────── */
.container { max-width: 1500px; margin: 0 auto; padding: 0 16px;}
.fade-in { animation: fadeIn 0.6s ease both; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
.empty-state { text-align: center; padding: 48px 0; color: #4b5563; }

/* ── Snackbar ────────────────────────────────────────────── */
#g-snack-host {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    pointer-events: none;
    width: calc(100% - 32px);
    max-width: 420px;
}

.g-snack {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px 12px 18px;
    border-radius: 14px;
    background: #1f2937;
    color: #fff;
    font-size: 0.9375rem;
    font-weight: 500;
    box-shadow: 0 8px 32px rgba(0,0,0,0.22), 0 2px 8px rgba(0,0,0,0.1);
    pointer-events: all;
    width: 100%;
    opacity: 0;
    transform: translateY(16px) scale(0.97);
    transition: opacity 0.25s ease, transform 0.25s cubic-bezier(0.34,1.56,0.64,1);
}
.g-snack--show { opacity: 1; transform: translateY(0) scale(1); }
.g-snack--hide { opacity: 0; transform: translateY(8px) scale(0.96); transition: opacity 0.25s ease, transform 0.2s ease; }

.g-snack--success { border-left: 4px solid #10b981; }
.g-snack--success i.fa-solid { color: #10b981; }
.g-snack--error   { border-left: 4px solid #ef4444; }
.g-snack--error   i.fa-solid { color: #ef4444; }
.g-snack--info    { border-left: 4px solid #6b7280; }
.g-snack--info    i.fa-solid { color: #9ca3af; }
.g-snack--warning { border-left: 4px solid #f59e0b; }
.g-snack--warning i.fa-solid { color: #f59e0b; }

.g-snack__msg { flex: 1; line-height: 1.4; }

.g-snack__close {
    background: none;
    border: none;
    color: #9ca3af;
    padding: 2px;
    cursor: pointer;
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    flex-shrink: 0;
    transition: color 0.15s, background 0.15s;
}
.g-snack__close:hover { color: #fff; background: rgba(255,255,255,0.12); }

@media (max-width: 480px) {
    #g-snack-host { bottom: 80px; }
}

/* Скрываем старый .toast чтобы не конфликтовал */
.toast-container { display: none !important; }


/* ── FOOTER ─────────────────────────────────────────────── */
.site-footer { background: #f9fafb; border-top: 1px solid #e5e7eb; margin-top: auto; }

.footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    padding: 40px 16px;
    max-width: 1500px;
    margin: 0 auto;
}
@media (min-width: 768px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .footer-grid { grid-template-columns: repeat(4, 1fr); gap: 40px; padding: 56px 16px; } }

.footer-logo img { height: 32px; width: auto; object-fit: contain; }

.footer-desc { color: #4b5563; font-size: 0.875rem; line-height: 1.6; max-width: 280px; margin: 16px 0; }

.footer-social { display: flex; gap: 12px; }

.social-btn {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f3f4f6;
    color: #6b7280;
    font-size: 1rem;
    transition: all 0.2s;
    text-decoration: none;
}
.social-btn:hover { background: var(--color-brand); color: white; }

.footer-heading {
    font-weight: 600;
    color: #1f2937;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 16px;
}

.footer-links { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.footer-links a { color: #4b5563; font-size: 0.875rem; transition: color 0.2s; }
.footer-links a:hover { color: var(--color-brand); }

.footer-contact-item { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 12px; font-size: 0.875rem; color: #4b5563; }
.footer-contact-item i { color: var(--color-brand); flex-shrink: 0; width: 16px; margin-top: 2px; text-align: center; }
.footer-contact-item a { color: #4b5563; transition: color 0.2s; }
.footer-contact-item a:hover { color: var(--color-brand); }

.footer-bottom { border-top: 1px solid #e5e7eb; padding: 24px 16px; text-align: center; max-width: 1500px; margin: 0 auto; }
.footer-bottom p { color: #9ca3af; font-size: 0.875rem; margin: 0; }
.footer-bottom a:hover { color: var(--color-brand); }

/* ── HERO BANNER SLIDER ──────────────────────────────────── */
.hero-section { position: relative; width: 100%; }


/* ── SECTIONS ────────────────────────────────────────────── */
.section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 32px; }
.section-title { font-size: 1.5rem; font-weight: 700; color: #1f2937; margin: 0; }
@media (min-width: 768px) { .section-title { font-size: 1.875rem; } }
.section-link { display: flex; align-items: center; gap: 6px; color: var(--color-brand); font-weight: 500; white-space: nowrap; transition: color 0.2s; }
.section-link:hover { color: var(--color-brand-dark); }
@media (min-width: 768px) { .py-section { padding: 64px 0; } }

/* ── BADGES ──────────────────────────────────────────────── */
.product-badges { position: absolute; top: 10px; left: 10px; display: flex; flex-direction: column; gap: 5px; z-index: 2; }

.badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.02em;
    white-space: nowrap;
    width: fit-content;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
@media (min-width: 640px) { .badge { font-size: 0.75rem; padding: 4px 9px; } }

.badge-new      { background: var(--color-brand); color: #fff; }
.badge-popular  { background: #7c3aed; color: #fff; }
.badge-discount { background: #ef4444; color: #fff; }
.badge-sale     { background: #f59e0b; color: #fff; }
.badge-limited  { background: #0ea5e9; color: #fff; }
.badge-promo    { background: #10b981; color: #fff; }

.badge-pill { padding: 4px 12px; border-radius: 999px; font-size: 0.8125rem; font-weight: 500; display: inline-flex; align-items: center; gap: 4px; }
.badge-new-pill     { background: var(--color-brand); color: white; }
.badge-popular-pill { background: #a855f7; color: white; }

/* ── PRODUCT CARD ────────────────────────────────────────── */
.product-card { height: 100%; transition: opacity 0.3s ease, transform 0.3s ease; }

.product-card-inner {
    background: white; border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    overflow: hidden; display: flex; flex-direction: column;
    border: 1px solid rgba(243,244,246,0.8);
    height: 100%; transition: box-shadow 0.3s;
}
.product-card-inner:hover { box-shadow: 0 8px 25px rgba(0,0,0,0.12); }

.product-card-img-wrap { position: relative; overflow: hidden; aspect-ratio: 4/5; background: #f9fafb; flex-shrink: 0; }
.product-card-img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.product-card-inner:hover .product-card-img { transform: scale(1.05); }

.fav-btn {
    position: absolute; top: 8px; right: 8px;
    width: 36px; height: 36px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    background: rgba(255,255,255,0.9); color: #6b7280;
    border: none; cursor: pointer; font-size: 0.875rem; transition: all 0.2s;
}
.fav-btn:hover { background: white; color: var(--color-brand); }
.fav-btn.active { background: var(--color-brand); color: white; transform: scale(1.1); }

.out-of-stock-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(2px); display: flex; align-items: center; justify-content: center; }
.out-of-stock-badge { background: white; color: #1f2937; padding: 6px 12px; border-radius: 999px; font-size: 0.75rem; font-weight: 500; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }

.product-card-body { display: flex; flex-direction: column; justify-content: space-between; padding: 12px; flex-grow: 1; }
@media (min-width: 640px) { .product-card-body { padding: 16px; } }

.product-card-name {
    font-size: 0.875rem; font-weight: 500; color: #111827; line-height: 1.4; margin: 0 0 6px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.5em;
}
@media (min-width: 640px) { .product-card-name { font-size: 0.9375rem; } }
.product-card-name a { transition: color 0.2s; }
.product-card-name a:hover { color: var(--color-brand-dark); }

.product-card-category { font-size: 11px; color: #9ca3af; font-weight: 500; margin-bottom: 8px; }
@media (min-width: 640px) { .product-card-category { font-size: 0.75rem; } }
.product-card-category a { color: #9ca3af; transition: color 0.2s; }
.product-card-category a:hover { color: var(--color-brand); }

.product-card-price { margin-bottom: 12px; }
.price-current { font-size: 1.125rem; font-weight: 700; color: #111827; }
@media (min-width: 640px) { .price-current { font-size: 1.25rem; } }
.price-original { font-size: 11px; color: #9ca3af; text-decoration: line-through; margin-left: 8px; }
@media (min-width: 640px) { .price-original { font-size: 0.875rem; } }

.product-card-btn {
    padding: 10px; border-radius: 12px;
    font-weight: 600; font-size: 0.75rem; color: white;
    background: var(--color-brand); border: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center; gap: 6px;
    transition: all 0.2s; text-decoration: none;
}
.product-card-btn:hover { background: var(--color-brand-dark); color: white; }
.product-card-btn:active { transform: scale(0.98); }
@media (min-width: 640px) { .product-card-btn { font-size: 0.875rem; } }

/* ── CATEGORY CARD ───────────────────────────────────────── */
.category-card { display: block; }
.category-card-inner { background: white; border-radius: 16px; box-shadow: 0 1px 3px rgba(0,0,0,0.08); overflow: hidden; border: 1px solid rgba(243,244,246,0.6); transition: all 0.3s; }
.category-card-inner:hover { box-shadow: 0 8px 25px rgba(0,0,0,0.12); }
.category-card-img-wrap { position: relative; aspect-ratio: 1/1; overflow: hidden; }
.category-card-img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.category-card-inner:hover .category-card-img { transform: scale(1.05); }
.category-card-gradient { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0.1), transparent); }
.category-card-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 12px; }
@media (min-width: 640px) { .category-card-content { padding: 16px; } }
.category-card-name { font-size: 1rem; font-weight: 600; color: white; margin: 0 0 2px; line-height: 1.3; transition: color 0.2s; }
.category-card-inner:hover .category-card-name { color: #fbcfe8; }
@media (min-width: 640px) { .category-card-name { font-size: 1.125rem; } }
.category-card-count { font-size: 0.75rem; color: rgba(255,255,255,0.8); margin: 0; }

/* ── GRIDS ───────────────────────────────────────────────── */
.products-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 768px) { .products-grid { grid-template-columns: repeat(3, 1fr); gap: 24px; } }
@media (min-width: 1024px) { .products-grid { grid-template-columns: repeat(4, 1fr); } }

.products-grid.list-mode { grid-template-columns: 1fr !important; gap: 12px; }
.products-grid.list-mode .product-card { height: auto; }
.products-grid.list-mode .product-card-inner { flex-direction: row; align-items: stretch; }
.products-grid.list-mode .product-card-img-wrap {
    flex: 0 0 160px; width: 160px; aspect-ratio: unset;
    height: auto; min-height: 160px; border-radius: 0;
}
@media (min-width: 640px) {
    .products-grid.list-mode .product-card-img-wrap { flex: 0 0 200px; width: 200px; min-height: 200px; }
}
@media (min-width: 1024px) {
    .products-grid.list-mode .product-card-img-wrap { flex: 0 0 240px; width: 240px; min-height: 240px; }
}
.products-grid.list-mode .product-card-body { flex: 1 1 auto; padding: 16px 20px; justify-content: space-between; }
.products-grid.list-mode .product-card-name { font-size: 1rem; -webkit-line-clamp: 3; margin-bottom: 8px; min-height: unset; }
@media (min-width: 768px) { .products-grid.list-mode .product-card-name { font-size: 1.0625rem; } }
.products-grid.list-mode .price-current { font-size: 1.25rem; }
.products-grid.list-mode .product-card-btn { width: auto; align-self: flex-start; padding: 10px 20px; font-size: 0.875rem; }
.products-grid.list-mode .product-badges { top: 8px; left: 8px; }
.products-grid.list-mode .fav-btn { top: 8px; right: 8px; }

.categories-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 768px) { .categories-grid { gap: 24px; } }
@media (min-width: 1024px) { .categories-grid { grid-template-columns: repeat(3, 1fr); } }

.home-categories-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 768px) { .home-categories-grid { grid-template-columns: repeat(3, 1fr); gap: 24px; } }
@media (min-width: 1024px) { .home-categories-grid { grid-template-columns: repeat(6, 1fr); } }

/* ── PAGINATION ──────────────────────────────────────────── */
nav.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
}

.pagination-btn {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 40px; height: 40px; padding: 0 8px;
    border-radius: 12px; border: 1px solid #e5e7eb;
    font-size: 0.875rem; font-weight: 500; font-family: inherit;
    color: #374151; background: white; cursor: pointer;
    transition: all 0.2s; text-decoration: none;
    line-height: 1; box-sizing: border-box;
}
.pagination-btn svg { display: block; flex-shrink: 0; }
.pagination-btn:hover:not(:disabled) { border-color: #f9a8d4; color: var(--color-brand); background: #fdf2f8; }
.pagination-btn:disabled { color: #d1d5db; cursor: not-allowed; }
.pagination-btn.active { border-color: var(--color-brand); background: var(--color-brand); color: white; box-shadow: 0 4px 12px rgba(236,72,153,0.3); }
.pagination-btn:active:not(:disabled) { transform: scale(0.95); }
.pagination-dots { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: #9ca3af; font-size: 0.875rem; }

/* ── BREADCRUMBS ─────────────────────────────────────────── */
.breadcrumbs { margin-bottom: 20px; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0; font-size: 0.875rem; color: #6b7280; list-style: none; padding: 0; margin: 0; line-height: 1.2; }
.breadcrumbs li { display: inline-flex; align-items: center; gap: 6px; padding: 0 2px; }
.breadcrumbs li:first-child { padding-left: 0; }
.breadcrumbs a { display: inline-flex; align-items: center; gap: 5px; color: #6b7280; transition: color 0.2s; white-space: nowrap; }
.breadcrumbs a:hover { color: var(--color-brand); }
.breadcrumbs .current { color: #1f2937; font-weight: 500; }
.breadcrumbs .sep { color: #d1d5db; font-size: 0.625rem; margin: 0 2px; flex-shrink: 0; }
.breadcrumbs .fa-house { font-size: 0.8125rem; }

/* ── VIEW TOGGLE ─────────────────────────────────────────── */
.view-toggle { display: flex; align-items: center; gap: 4px; }
.view-btn { padding: 8px 10px; border-radius: 8px; color: #4b5563; border: none; background: none; cursor: pointer; font-size: 1rem; display: flex; align-items: center; justify-content: center; transition: all 0.2s; }
.view-btn:hover { color: var(--color-brand); }
.view-btn.active { background: var(--color-brand); color: white; }

/* ── PAGE HEADER ─────────────────────────────────────────── */
.page-header { margin-bottom: 32px; }
.page-title { font-size: 1.875rem; font-weight: 700; color: #1f2937; margin: 0; }
@media (min-width: 768px) { .page-title { font-size: 2.25rem; } }
.page-subtitle { color: #4b5563; margin: 8px 0 0; }
.page-seo-text { margin-top: 32px; color: #6b7280; font-size: 0.875rem; line-height: 1.7; border-top: 1px solid #f3f4f6; padding-top: 24px; }

/* ── CTA SOCIAL SECTION ──────────────────────────────────── */
.cta-section { background: linear-gradient(to right, #eff6ff, #f5f3ff, #fdf2f8); padding: 48px 0; }
@media (min-width: 768px) { .cta-section { padding: 64px 0; } }
.cta-title { font-size: 1.5rem; font-weight: 700; color: #1f2937; margin: 0 0 16px; }
@media (min-width: 768px) { .cta-title { font-size: 1.875rem; } }
.cta-subtitle { color: #4b5563; max-width: 672px; margin: 0 auto 32px; line-height: 1.6; }
.cta-note { font-size: 0.875rem; color: #6b7280; margin-top: 24px; margin-bottom: 0; }
.cta-social-icons { display: flex; align-items: center; justify-content: center; gap: 24px; margin-bottom: 24px; }
.cta-social-icon { width: 72px; height: 72px; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 25px rgba(0,0,0,0.15); font-size: 1.75rem; color: white; }
.cta-social-icon.telegram  { background: linear-gradient(135deg, #3b82f6, #2563eb); }
.cta-social-icon.instagram { background: linear-gradient(135deg, #ec4899, #ef4444, #eab308); }
.cta-features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-bottom: 32px; max-width: 896px; margin-left: auto; margin-right: auto; }
@media (min-width: 768px) { .cta-features { grid-template-columns: repeat(4, 1fr); gap: 24px; } }
.cta-feature { display: flex; flex-direction: column; align-items: center; }
.cta-feature-icon { width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; font-size: 1.125rem; }
.cta-feature-icon.pink   { background: #fce7f3; color: #ec4899; }
.cta-feature-icon.purple { background: #f3e8ff; color: #a855f7; }
.cta-feature-icon.blue   { background: #dbeafe; color: #3b82f6; }
.cta-feature-icon.green  { background: #d1fae5; color: #10b981; }
.cta-feature h3 { font-weight: 600; color: #1f2937; font-size: 0.875rem; margin: 0 0 4px; text-align: center; }
.cta-feature p  { font-size: 0.75rem; color: #4b5563; text-align: center; margin: 0; }
.cta-buttons { display: flex; flex-direction: column; align-items: center; gap: 16px; }
@media (min-width: 640px) { .cta-buttons { flex-direction: row; justify-content: center; } }
.cta-btn { display: inline-flex; align-items: center; gap: 10px; padding: 12px 24px; border-radius: 16px; font-weight: 600; font-size: 0.9375rem; color: white; text-decoration: none; transition: all 0.3s; box-shadow: 0 4px 12px rgba(0,0,0,0.15); }
.cta-btn:hover { box-shadow: 0 8px 25px rgba(0,0,0,0.2); transform: translateY(-2px); color: white; }
.cta-btn.telegram  { background: linear-gradient(135deg, #3b82f6, #2563eb); }
.cta-btn.instagram { background: linear-gradient(135deg, #ec4899, #ef4444); }

/* ── HOME INTRO ──────────────────────────────────────────── */
.home-intro-title { font-size: 1.75rem; font-weight: 700; color: #111827; margin: 0 0 12px; }
@media (min-width: 768px) { .home-intro-title { font-size: 2rem; } }
.home-intro-desc { color: #374151; line-height: 1.7; margin: 0; }

/* ── CONTACTS ────────────────────────────────────────────── */
.contacts-grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
@media (min-width: 1024px) { .contacts-grid { grid-template-columns: 1fr 1fr; } }
.contacts-info-card, .contacts-form-card { background: white; border-radius: 16px; box-shadow: 0 4px 12px rgba(0,0,0,0.08); padding: 24px; }
.contacts-info-card h2, .contacts-form-card h2 { font-size: 1.25rem; font-weight: 700; color: #1f2937; margin: 0 0 24px; }
.contact-item { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 16px; }
.contact-icon { width: 48px; height: 48px; background: #fce7f3; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 1.125rem; color: var(--color-brand); }
.contact-item h3 { font-weight: 500; color: #1f2937; margin: 0 0 4px; font-size: 0.9375rem; }
.contact-item a, .contact-item p, .contact-item address { color: #4b5563; margin: 0; font-size: 0.9375rem; transition: color 0.2s; font-style: normal; }
.contact-item a:hover { color: var(--color-brand); }
.contacts-social-divider { border-top: 1px solid #e5e7eb; padding-top: 24px; margin-top: 24px; }
.contacts-social-divider h3 { font-weight: 500; color: #1f2937; margin: 0 0 16px; }
.contacts-socials { display: flex; gap: 16px; }
.contact-social-btn { width: 40px; height: 40px; background: #fce7f3; color: var(--color-brand); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.125rem; transition: all 0.2s; text-decoration: none; }
.contact-social-btn:hover { background: var(--color-brand); color: white; }

/* ── FORMS ───────────────────────────────────────────────── */
.contact-form { display: flex; flex-direction: column; gap: 16px; }
.form-group { display: flex; flex-direction: column; gap: 6px; }
.form-label { font-size: 0.875rem; font-weight: 500; color: #374151; }
.form-error { font-size: 0.8125rem; color: #ef4444; min-height: 1.2em; }

.form-input, .form-textarea {
    width: 100%; padding: 12px 16px;
    box-sizing: border-box;
    border: 1px solid #d1d5db; border-radius: 16px;
    font-size: 0.9375rem; font-family: inherit; outline: none; transition: all 0.2s;
}
.form-input:focus, .form-textarea:focus { border-color: transparent; box-shadow: 0 0 0 2px #f9a8d4; }
.form-textarea { resize: none; }

.form-input.input-error,
.form-textarea.input-error { border-color: #ef4444 !important; box-shadow: 0 0 0 3px rgba(239,68,68,0.1) !important; }

.form-submit-btn {
    width: 100%; padding: 12px; background: var(--color-brand);
    color: white; border-radius: 16px; font-weight: 500;
    font-size: 0.9375rem; border: none; cursor: pointer; transition: all 0.2s;
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
}
.form-submit-btn:hover:not(:disabled) { background: var(--color-brand-dark); }
.form-submit-btn:disabled { opacity: 0.6; cursor: not-allowed; }

.form-success-msg {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 12px;
    color: #15803d;
    font-size: 0.9375rem;
    font-weight: 500;
    margin-bottom: 20px;
}
.form-success-msg i { color: #22c55e; font-size: 1.25rem; flex-shrink: 0; }

.map-card { background: white; border-radius: 16px; box-shadow: 0 4px 12px rgba(0,0,0,0.08); padding: 24px; margin-top: 32px; }
.map-card h2 { font-size: 1.25rem; font-weight: 700; color: #1f2937; margin: 0 0 24px; }
.map-wrap { aspect-ratio: 16/9; background: #e5e7eb; border-radius: 16px; overflow: hidden; }
.map-wrap iframe { width: 100%; height: 100%; border: 0; }

/* ── Modal ───────────────────────────────────────────────── */
.g-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 5000;
    background: rgba(0,0,0,0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
}
.g-modal-overlay.open { opacity: 1; pointer-events: auto; }

.g-modal {
    background: #fff;
    border-radius: 20px;
    padding: 32px;
    width: 100%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
    position: relative;
    transform: translateY(20px) scale(0.97);
    transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
    box-shadow: 0 24px 64px rgba(0,0,0,0.18);
}
.g-modal-overlay.open .g-modal { transform: translateY(0) scale(1); }

.g-modal-close {
    position: absolute; top: 16px; right: 16px;
    width: 36px; height: 36px; border-radius: 50%;
    border: none; background: #f3f4f6; color: #6b7280;
    font-size: 1rem; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.15s, color 0.15s;
}
.g-modal-close:hover { background: #fee2e9; color: var(--color-brand); }

.g-modal-title { font-size: 1.375rem; font-weight: 700; color: #1f2937; margin: 0 0 8px; display: flex; align-items: center; gap: 10px; padding-right: 36px; }
.g-modal-subtitle { color: #6b7280; font-size: 0.9rem; margin: 0 0 24px; line-height: 1.5; }

/* ── PRODUCT PAGE ────────────────────────────────────────── */
.product-layout { display: flex; flex-direction: column; gap: 40px; }
@media (min-width: 1024px) { .product-layout { flex-direction: row; align-items: flex-start; } }
@media (max-width: 1023px) { .product-layout { gap: 20px; } }
.product-images-col { width: 100%; }
.product-info-col { width: 100%; }
@media (min-width: 1024px) {
    .product-images-col, .product-info-col { width: 50%; }
    .product-info-col { position: sticky; top: 84px; align-self: flex-start; }
}

.product-main-img-wrap { position: relative; overflow: hidden; background: #f3f4f6; }

#main-image { display: block; width: 100%; transition: none; }
#main-image.slide-left-out  { animation: slideLeftOut  0.25s ease forwards; }
#main-image.slide-right-out { animation: slideRightOut 0.25s ease forwards; }
#main-image.slide-left-in   { animation: slideLeftIn   0.25s ease forwards; }
#main-image.slide-right-in  { animation: slideRightIn  0.25s ease forwards; }

@keyframes slideLeftOut  { from { transform: translateX(0);     opacity: 1; } to { transform: translateX(-60px); opacity: 0; } }
@keyframes slideRightOut { from { transform: translateX(0);     opacity: 1; } to { transform: translateX(60px);  opacity: 0; } }
@keyframes slideLeftIn   { from { transform: translateX(60px);  opacity: 0; } to { transform: translateX(0);     opacity: 1; } }
@keyframes slideRightIn  { from { transform: translateX(-60px); opacity: 0; } to { transform: translateX(0);     opacity: 1; } }

.product-main-img-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    position: relative;
    overflow: hidden;
    cursor: zoom-in;
    text-decoration: none;
    aspect-ratio: 1 / 1;
}
.product-main-img-link img {
    width: 100%; height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
    transition: transform 0.4s ease;
}
.product-main-img-link:hover img { transform: scale(1.03); }

@media (max-width: 767px) {
    .product-main-img-link { height: 70vw; max-height: 520px; min-height: 260px; aspect-ratio: unset; }
    .container[style*="padding-top:32px"] { padding-top: 16px !important; padding-bottom: 32px !important; }
}
@media (min-width: 768px) and (max-width: 1023px) { .product-main-img-link { max-height: 55vw; } }
@media (min-width: 1024px) { .product-main-img-link { height: 720px; max-height: 75vh; aspect-ratio: unset; background: #fff; } }

.product-img-zoom-hint {
    position: absolute; bottom: 12px; right: 12px;
    width: 38px; height: 38px;
    background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
    border-radius: 50%; display: flex; align-items: center; justify-content: center;
    color: white; font-size: 0.875rem;
    opacity: 0; transform: scale(0.8);
    transition: opacity 0.2s, transform 0.2s; pointer-events: none;
}
.product-main-img-link:hover .product-img-zoom-hint { opacity: 1; transform: scale(1); }
@media (hover: none) { .product-img-zoom-hint { opacity: 0.75; transform: scale(1); } }

.product-img-count {
    position: absolute; bottom: 12px; left: 12px;
    background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
    color: white; font-size: 0.75rem; font-weight: 500;
    padding: 5px 10px; border-radius: 999px;
    display: flex; align-items: center; gap: 5px;
    pointer-events: none; user-select: none;
}

.product-thumbs-wrap {
    position: relative;
    margin-top: 14px;
    -webkit-mask-image: linear-gradient(to right, transparent 0px, black 12px, black calc(100% - 12px), transparent 100%);
    mask-image: linear-gradient(to right, transparent 0px, black 12px, black calc(100% - 12px), transparent 100%);
}
.product-thumbs-wrap::before,
.product-thumbs-wrap::after {
    content: ''; position: absolute; top: 0; bottom: 0;
    width: 40px; z-index: 3; pointer-events: none; opacity: 0.95;
}
.product-thumbs-wrap::before { left: 0; background: linear-gradient(to right, #fff, transparent); }
.product-thumbs-wrap::after  { right: 0; background: linear-gradient(to left, #fff, transparent); }

.product-thumbs-inner {
    display: flex; gap: 10px;
    overflow-x: auto; overflow-y: hidden;
    padding: 4px 24px 10px;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.product-thumbs-inner::-webkit-scrollbar { display: none; }

.product-thumb {
    flex: 0 0 auto; width: 72px; height: 72px;
    border-radius: 16px; overflow: hidden;
    border: 2px solid transparent; background: #fff;
    transition: border-color 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
}
.product-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.product-thumb:hover { transform: translateY(-2px); }
.product-thumb.active { border-color: var(--color-brand); }

@media (max-width: 767px) {
    .product-thumbs-inner { gap: 8px; padding-inline: 18px; }
    .product-thumb { width: 60px; height: 60px; }
    .product-thumbs-wrap::before, .product-thumbs-wrap::after { width: 24px; }
}

.product-info { max-width: 100%; }
@media (min-width: 1024px) { .product-info { max-width: 90%; } }

.product-info-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 16px; gap: 12px; }
.product-info-header > div:first-child { min-width: 0; flex: 1 1 0; }
@media (max-width: 640px) {
    .product-info-header { flex-direction: column; align-items: flex-start; }
    .product-fav-btn { align-self: flex-end; }
}

.product-title {
    font-size: clamp(1.25rem, 4vw, 1.75rem);
    font-weight: 700; color: #1f2937;
    line-height: 1.3; margin: 0 0 6px;
    word-break: break-word; overflow-wrap: anywhere; hyphens: auto; white-space: normal;
}

.product-category-link { color: var(--color-brand); font-size: 0.875rem; }
.product-category-link:hover { text-decoration: underline; }

.product-fav-btn {
    width: 48px; height: 48px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: #f3f4f6; color: #4b5563; border: none; cursor: pointer;
    font-size: 1.125rem; flex-shrink: 0; transition: all 0.2s;
}
.product-fav-btn:hover { background: #fce7f3; color: var(--color-brand); }
.product-fav-btn.active { background: var(--color-brand); color: white; }

.product-price-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.product-price { font-size: 1.5rem; font-weight: 700; color: #111827; }
@media (max-width: 767px) { .product-price { font-size: 1.625rem; } }
.product-original-price { color: #6b7280; text-decoration: line-through; font-size: 1rem; }
.product-price-row .product-fav-btn { margin-left: auto; flex-shrink: 0; }

.product-badges-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }

.stock-status { display: inline-flex; align-items: center; gap: 5px; font-size: 0.875rem; font-weight: 500; }
.stock-status.in-stock  { color: #10b981; }
.stock-status.out-stock { color: #ef4444; }

.product-description { color: #4b5563; white-space: pre-line; margin-bottom: 24px; line-height: 1.7; }

.sizes-section { margin-bottom: 24px; }
.sizes-label { font-weight: 500; color: #1f2937; margin-bottom: 8px; }
.sizes-list { display: flex; flex-wrap: wrap; gap: 8px; }
.size-btn { padding: 8px 16px; border: 1px solid #d1d5db; border-radius: 8px; background: white; color: #374151; cursor: pointer; font-size: 0.875rem; font-family: inherit; transition: all 0.2s; }
.size-btn:hover { background: #f9fafb; }
.size-btn.active { background: var(--color-brand); color: white; border-color: var(--color-brand); }
.size-error { display: none; color: #ef4444; font-size: 0.8125rem; margin-top: 6px; }

.add-to-cart-section { margin-top: 8px; }
.add-to-cart-btn {
    width: 100%; padding: 14px; border-radius: 12px;
    font-weight: 600; font-size: 1rem; border: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center; gap: 8px;
    transition: all 0.2s; font-family: inherit;
}
.add-to-cart-btn.primary { background: var(--color-brand); color: white; }
.add-to-cart-btn.primary:hover { background: var(--color-brand-dark); }
.add-to-cart-btn.added { background: #10b981; color: white; cursor: default; }
.add-to-cart-btn.disabled { background: #f3f4f6; color: #6b7280; cursor: not-allowed; }

@media (max-width: 767px) {
    .add-to-cart-btn { padding: 13px; font-size: 0.9375rem; }
}

.share-section { margin-bottom: 24px; }
.share-label { font-size: 0.875rem; color: #6b7280; margin-bottom: 8px; }
.share-buttons { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.share-btn { width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; font-size: 1rem; text-decoration: none; flex-shrink: 0; transition: opacity 0.2s, transform 0.15s; }
.share-btn:hover { opacity: 0.85; transform: scale(1.08); color: white; }
.share-btn-fb { background: #1877f2; }
.share-btn-tg { background: #29a7e1; }
.share-btn-wa { background: #25d366; }
.share-copy-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; border: 1px solid #d1d5db; background: white; color: #374151; font-size: 0.875rem; font-family: inherit; cursor: pointer; transition: background 0.2s; }
.share-copy-btn:hover { background: #f9fafb; }

/* ── GLightbox ───────────────────────────────────────────── */
.glightbox-clean .gslide-description,
.glightbox-clean .gdesc-inner,
.gslide-description.description-bottom { display: none !important; height: 0 !important; padding: 0 !important; margin: 0 !important; }
.glightbox-clean .gslide-media { border-radius: 0 !important; box-shadow: none !important; }
.glightbox-clean .gslide-image img { max-height: 100vh !important; object-fit: contain; }
.glightbox-clean .gclose,
.glightbox-clean .gnext,
.glightbox-clean .gprev { background-color: rgba(0,0,0,0.5); border-radius: 50%; transition: background-color 0.2s; }
.glightbox-clean .gclose:hover,
.glightbox-clean .gnext:hover,
.glightbox-clean .gprev:hover { background-color: var(--color-brand); }

#gl-counter {
    position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%);
    z-index: 9999;
    background: rgba(0,0,0,0.6); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    color: white; font-size: 0.875rem; font-weight: 500;
    font-family: 'Inter', system-ui, sans-serif;
    padding: 8px 18px; border-radius: 999px;
    display: flex; align-items: center; gap: 8px;
    border: 1px solid rgba(255,255,255,0.15);
    pointer-events: none; user-select: none; white-space: nowrap;
}

/* ── SIMILAR SECTION ─────────────────────────────────────── */
.similar-section { padding: 32px 0 48px; background: #fafafa; border-top: 1px solid #f3f4f6; }

/* ── ERROR PAGE ──────────────────────────────────────────── */
.error-page { min-height: 60vh; display: flex; align-items: center; justify-content: center; padding: 48px 16px; text-align: center; }
.error-inner { max-width: 480px; width: 100%; }
.error-code { font-size: 8rem; font-weight: 700; line-height: 1; background: linear-gradient(135deg, #ec4899, #db2777); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin: 0 0 8px; letter-spacing: -4px; }
.error-icon { width: 80px; height: 80px; margin: 0 auto 24px; background: #fce7f3; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 2rem; color: var(--color-brand); }
.error-title { font-size: 1.5rem; font-weight: 700; color: #1f2937; margin: 0 0 12px; }
.error-desc { color: #6b7280; font-size: 1rem; line-height: 1.6; margin: 0 0 32px; }
.error-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.error-links { margin-top: 40px; padding-top: 32px; border-top: 1px solid #f3f4f6; }
.error-links p { font-size: 0.875rem; color: #9ca3af; margin: 0 0 16px; }
.error-links-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.error-link { font-size: 0.875rem; color: var(--color-brand); display: flex; align-items: center; gap: 4px; }
.error-link:hover { color: var(--color-brand-dark); }

/* ── Buttons ─────────────────────────────────────────────── */
.btn-primary {
    background-color: var(--color-brand) !important;
    border-color: var(--color-brand) !important;
    display: inline-flex; align-items: center; gap: 8px;
}
.btn-primary:hover { background-color: var(--color-brand-dark) !important; border-color: var(--color-brand-dark) !important; }

.btn-secondary {
    display: inline-flex; align-items: center; gap: 8px;
    background: #f3f4f6 !important; color: #374151 !important; border-color: #f3f4f6 !important;
}
.btn-secondary:hover { background: #e5e7eb !important; color: #111827 !important; border-color: #e5e7eb !important; }

/* ── Animations ──────────────────────────────────────────── */
@keyframes shake {
    0%,100% { transform: translateX(0); }
    20%      { transform: translateX(-6px); }
    40%      { transform: translateX(6px); }
    60%      { transform: translateX(-4px); }
    80%      { transform: translateX(4px); }
}

/* ── CART ────────────────────────────────────────────────── */
.cart-layout { display: grid; grid-template-columns: 1fr; gap: 24px; align-items: start; }
@media (min-width: 1024px) { .cart-layout { grid-template-columns: 1fr 360px; gap: 32px; } }

.cart-item {
    display: grid;
    grid-template-columns: 88px 1fr auto auto auto;
    align-items: center; gap: 16px; padding: 20px;
    background: white; border-radius: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.07);
    border: 1px solid #f3f4f6; margin-bottom: 12px; transition: box-shadow 0.2s;
}
.cart-item:last-child { margin-bottom: 0; }
.cart-item:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.1); }

@media (max-width: 640px) {
    .cart-item { grid-template-columns: 72px 1fr auto; grid-template-rows: auto auto; gap: 12px; }
    .cart-item-qty   { grid-column: 2; }
    .cart-item-price { grid-column: 3; grid-row: 1; }
    .cart-item-remove { grid-column: 3; grid-row: 2; justify-self: end; }
}

.cart-item-img-wrap { display: block; width: 88px; height: 88px; border-radius: 12px; overflow: hidden; background: #f9fafb; flex-shrink: 0; }
.cart-item-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; }
.cart-item-img-wrap:hover img { transform: scale(1.05); }
@media (max-width: 640px) { .cart-item-img-wrap { width: 72px; height: 72px; } }

.cart-item-info { min-width: 0; }
.cart-item-name { display: block; font-weight: 600; font-size: 0.9375rem; color: #111827; margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: none; transition: color 0.2s; }
.cart-item-name:hover { color: var(--color-brand); }
.cart-item-meta { font-size: 0.8125rem; color: #9ca3af; margin-bottom: 2px; }
.cart-item-unit-price { font-size: 0.8125rem; color: #6b7280; margin-top: 4px; }

.cart-item-qty { display: flex; align-items: center; gap: 0; border: 1.5px solid #e5e7eb; border-radius: 10px; overflow: hidden; flex-shrink: 0; width: fit-content; align-self: center; }

.cart-qty-btn {
    width: 34px; height: 34px; align-items: center; justify-content: center;
    background: #f9fafb; border: none; cursor: pointer;
    color: #374151; font-size: 0.75rem;
    transition: background 0.15s, color 0.15s;
    flex-shrink: 0; flex-grow: 0; margin: 0; padding: 0;
}
.cart-qty-btn:hover { background: #fce7f3; color: var(--color-brand); }
.cart-qty-btn:active { background: #fbcfe8; }

.cart-qty-input {
    width: 40px; height: 34px; border: none;
    border-left: 1.5px solid #e5e7eb; border-right: 1.5px solid #e5e7eb;
    text-align: center; font-size: 0.9375rem; font-weight: 600; font-family: inherit;
    color: #111827; background: white; outline: none;
    -moz-appearance: textfield; appearance: textfield;
    flex-shrink: 0; flex-grow: 0; padding: 0; margin: 0;
}
.cart-qty-input::-webkit-outer-spin-button,
.cart-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cart-qty-input:focus { outline: none; }

.cart-item-price { text-align: right; flex-shrink: 0; }
.cart-item-total { font-size: 1rem; font-weight: 700; color: #111827; white-space: nowrap; }

.cart-item-remove {
    all: unset; width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; color: #d1d5db; cursor: pointer;
    justify-self: end; align-self: center;
    transition: color 0.15s, background 0.15s;
    flex-shrink: 0; flex-grow: 0;
}
.cart-item-remove:hover { color: #ef4444; background: #fff1f2; }

.cart-sidebar { position: sticky; top: 96px; }

.cart-summary-card {
    background: white; border-radius: 20px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid #f3f4f6; padding: 28px; position: sticky; top: 100px;
}
.cart-summary-title { font-size: 1.25rem; font-weight: 700; color: #111827; margin: 0 0 20px; display: flex; align-items: center; gap: 8px; }
.cart-summary-row { display: flex; justify-content: space-between; align-items: center; font-size: 0.9375rem; color: #4b5563; margin-bottom: 12px; }
.cart-summary-divider { border: none; border-top: 1px solid #f3f4f6; margin: 16px 0; }
.cart-summary-total-row { display: flex; justify-content: space-between; align-items: center; font-weight: 700; font-size: 1.125rem; color: #1f2937; margin: 16px 0 20px; padding-top: 16px; border-top: 2px solid #f3f4f6; }
.cart-summary-total-price { color: var(--color-brand); font-size: 1.375rem; font-weight: 700; }

.cart-checkout-btn {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    width: 100%; padding: 14px; background: var(--color-brand); color: white;
    border-radius: 14px; font-weight: 600; font-size: 1rem; text-decoration: none;
    transition: background 0.2s, transform 0.15s, box-shadow 0.2s;
    box-shadow: 0 4px 14px rgba(236,72,153,0.35); margin-bottom: 12px;
}
.cart-checkout-btn:hover { background: var(--color-brand-dark); color: white; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(236,72,153,0.45); }

.cart-continue-link { display: flex; align-items: center; justify-content: center; gap: 6px; color: #6b7280; font-size: 0.875rem; text-decoration: none; transition: color 0.2s; }
.cart-continue-link:hover { color: var(--color-brand); }

.cart-loading { display: flex; align-items: center; justify-content: center; padding: 64px; color: var(--color-brand); }

.cart-empty { text-align: center; padding: 64px 16px; max-width: 480px; margin: 0 auto; }
.cart-empty-icon { width: 96px; height: 96px; background: #fce7f3; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 24px; font-size: 2.5rem; color: var(--color-brand); }
.cart-empty h2 { font-size: 1.5rem; font-weight: 700; color: #1f2937; margin: 0 0 12px; }
.cart-empty p { color: #6b7280; font-size: 0.9375rem; line-height: 1.6; margin: 0 0 24px; }

/* ── CHECKOUT ────────────────────────────────────────────── */
.checkout-layout { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 900px) { .checkout-layout { grid-template-columns: 1fr 380px; align-items: start; } }

.checkout-form-col,
.checkout-summary-col { min-width: 0; width: 100%; }

.checkout-form-card { background: #fff; border-radius: 20px; border: 1px solid #f3f4f6; padding: 28px; box-shadow: 0 2px 12px rgba(0,0,0,0.04); overflow: hidden; }
@media (max-width: 899px) { .checkout-form-card { padding: 20px 16px; } }
.checkout-section-title { font-size: 1.125rem; font-weight: 700; color: #1f2937; margin: 0 0 24px; display: flex; align-items: center; gap: 8px; }
.checkout-summary-col { padding-bottom: 30px; }
.checkout-items-list { margin-bottom: 16px; }

.checkout-item { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid #f9fafb; }
.checkout-item:last-child { border-bottom: none; }
.checkout-item-img { width: 56px; height: 70px; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.checkout-item-info { flex: 1; min-width: 0; }
.checkout-item-name { font-size: 0.875rem; font-weight: 600; color: #1f2937; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; margin-bottom: 2px; }
.checkout-item-size, .checkout-item-qty { font-size: 0.8125rem; color: #9ca3af; }
.checkout-item-price { font-weight: 700; color: var(--color-brand); font-size: 0.9rem; white-space: nowrap; flex-shrink: 0; }

.checkout-note { font-size: 0.8125rem; color: #9ca3af; line-height: 1.6; margin: 16px 0 0; display: flex; align-items: flex-start; gap: 6px; }
.checkout-note .fa-truck { color: #e9ae41; margin-top: 2px; flex-shrink: 0; }
.checkout-note .fa-circle-info { color: #60a5fa; margin-top: 2px; flex-shrink: 0; }

/* ── FAVOURITES ──────────────────────────────────────────── */
.fav-empty { text-align: center; padding: 64px 16px; max-width: 480px; margin: 0 auto; }
.fav-empty-icon { width: 96px; height: 96px; background: #fce7f3; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 24px; font-size: 2.5rem; color: var(--color-brand); }
.fav-empty h2 { font-size: 1.5rem; font-weight: 700; color: #1f2937; margin: 0 0 12px; }
.fav-empty p { color: #6b7280; font-size: 0.9375rem; line-height: 1.6; margin: 0 0 24px; }

.fav-continue-btn {
    display: inline-flex; align-items: center; gap: 10px;
    background-color: var(--color-brand); color: white;
    padding: 12px 28px; border-radius: 16px;
    font-size: 0.9375rem; font-weight: 500; text-decoration: none;
    transition: background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
    box-shadow: 0 4px 14px rgba(236,72,153,0.35); margin-top: 8px;
}
.fav-continue-btn:hover { background-color: var(--color-brand-dark); color: white; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(236,72,153,0.45); }
.fav-continue-btn:active { transform: translateY(0); box-shadow: 0 2px 8px rgba(236,72,153,0.3); }

.fav-clear-btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: transparent; color: #6b7280;
    border: 1.5px solid #e5e7eb; padding: 10px 24px; border-radius: 14px;
    font-size: 0.875rem; font-weight: 500; font-family: inherit;
    cursor: pointer; transition: all 0.2s ease;
}
.fav-clear-btn:hover { background: #fff1f2; border-color: #fda4af; color: #e11d48; }
.fav-clear-btn:active { transform: scale(0.97); }
.fav-clear-btn:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }

/* ── SEARCH PAGE ─────────────────────────────────────────── */
.search-page-form { margin-bottom: 40px; }
.search-page-input-wrap { position: relative; max-width: 640px; margin: 0 auto; display: flex; align-items: center; }
.search-page-icon { position: absolute; left: 18px; top: 50%; transform: translateY(-50%); color: #9ca3af; font-size: 1rem; pointer-events: none; z-index: 1; }
.search-page-input { width: 100%; height: 52px; padding: 0 140px 0 50px; border: 1.5px solid #e5e7eb; border-radius: 999px; font-size: 1rem; font-family: inherit; color: #1f2937; background: white; outline: none; transition: border-color 0.2s, box-shadow 0.2s; }
.search-page-input::placeholder { color: #9ca3af; }
.search-page-input:focus { border-color: var(--color-brand-light); box-shadow: 0 0 0 3px rgba(236,72,153,0.1); }

.search-page-clear { position: absolute; right: 110px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; color: #9ca3af; border-radius: 50%; font-size: 0.875rem; text-decoration: none; transition: color 0.2s, background 0.2s; }
.search-page-clear:hover { color: #ef4444; background: #fff1f2; }

.search-submit { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); height: 40px; padding: 0 20px; background: var(--color-brand); color: white; border: none; border-radius: 999px; font-size: 0.875rem; font-weight: 600; font-family: inherit; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; transition: background 0.2s; white-space: nowrap; }
.search-submit:hover { background: var(--color-brand-dark); }

@media (max-width: 480px) {
    .search-submit span { display: none; }
    .search-submit { padding: 0 14px; }
    .search-page-input { padding-right: 60px; }
    .search-page-clear { right: 54px; }
}

.search-empty { text-align: center; padding: 48px 16px; max-width: 480px; margin: 0 auto; }
.search-empty-icon { font-size: 3.5rem; color: #e5e7eb; margin-bottom: 20px; display: block; }
.search-empty h2 { font-size: 1.375rem; font-weight: 700; color: #1f2937; margin: 0 0 12px; }
.search-empty p { color: #6b7280; font-size: 0.9375rem; line-height: 1.6; margin: 0 0 8px; }

.search-suggestions { margin-top: 32px; }
.search-suggestions-label { font-size: 0.8125rem; color: #9ca3af; font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 12px; }
.search-suggestions-list { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.search-suggestion-tag { display: inline-flex; align-items: center; padding: 7px 16px; background: #f3f4f6; color: #374151; border-radius: 999px; font-size: 0.875rem; font-weight: 500; text-decoration: none; border: 1.5px solid transparent; transition: all 0.2s; }
.search-suggestion-tag:hover { background: #fce7f3; border-color: var(--color-brand-light); color: var(--color-brand); }

.search-tips { display: inline-block; text-align: left; background: #f9fafb; border: 1px solid #f3f4f6; border-radius: 12px; padding: 16px 20px; margin-top: 24px; }
.search-tips-title { font-size: 0.875rem; font-weight: 600; color: #374151; margin: 0 0 10px; display: flex; align-items: center; gap: 6px; }
.search-tips-title .fa-lightbulb { color: #f59e0b; }
.search-tips ul { margin: 0; padding-left: 20px; color: #6b7280; font-size: 0.875rem; line-height: 1.8; }

.search-results-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 28px; flex-wrap: wrap; }
.search-results-title { font-size: 1.375rem; font-weight: 700; color: #1f2937; margin: 0 0 6px; }
.search-results-query { color: var(--color-brand); }
.search-results-count { color: #6b7280; font-size: 0.9375rem; margin: 0; }


/* ── ICON BUTTONS & BADGE ────────────────────────────────── */
.icon-btn {
    position: relative;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #374151;
    border-radius: 50%;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.125rem;
    text-decoration: none;
    transition: color 0.2s, background 0.2s;
    flex-shrink: 0;
}
.icon-btn:hover { color: var(--color-brand); background: #fdf2f8; }
.icon-btn.active { color: var(--color-brand); }
@media (max-width: 767px) { .icon-btn { width: 36px; height: 36px; font-size: 1rem; } }

.count-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    background: var(--color-brand);
    color: white;
    font-size: 10px;
    font-weight: 600;
    border-radius: 999px;
    height: 18px;
    min-width: 18px;
    padding: 0 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    pointer-events: none;
}

/* ── NAVBAR (Bootstrap override) ────────────────────────── */
.guza-navbar {
    background: #fff; border-bottom: 1px solid #f3f4f6; padding: 0;
    position: sticky; top: 0; z-index: 1030; transition: box-shadow .25s ease;
}
.guza-navbar.scrolled { box-shadow: 0 2px 16px rgba(0,0,0,.08); }
.guza-navbar-inner { padding: 0; display: flex; flex-direction: column; align-items: stretch; }

.guza-topbar { display: flex; align-items: center; gap: 12px; padding: 0 1rem; min-height: 64px; width: 100%; box-sizing: border-box; }
.guza-logo { flex: 0 0 auto; margin: 0; text-decoration: none; }
.guza-logo img { display: block; height: 36px; width: auto; }
.guza-center-wrap { flex: 1 1 auto; min-width: 0; display: none; }
.guza-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 4px; margin-left: auto; }

.guza-navbar .nav-link {
    color: #374151; font-weight: 500; font-size: .95rem; padding: .55rem .75rem;
    border-radius: 10px; transition: background .15s ease, color .15s ease, transform .15s ease;
    display: flex; align-items: center; gap: 6px; white-space: nowrap; text-decoration: none;
}
.guza-navbar .nav-link:hover,
.guza-navbar .nav-link.active { background: #fdf2f8; color: #ec4899; }

.guza-search-group {
    width: 100%; border: 1.5px solid #e5e7eb; border-radius: 12px;
    overflow: hidden; background: #f9fafb; display: flex; flex-wrap: nowrap;
    transition: border-color .2s, background .2s, box-shadow .2s;
}
.guza-search-group:focus-within { border-color: #ec4899; background: #fff; box-shadow: 0 0 0 4px rgba(236,72,153,.08); }

.guza-search-input {
    border: none !important; box-shadow: none !important; background: transparent;
    font-size: .875rem; padding: 10px 14px; flex: 1 1 auto; min-width: 0;
    outline: none; font-family: inherit;
}
.guza-search-btn { background: #ec4899; color: #fff; border: none; padding: 0 16px; flex-shrink: 0; cursor: pointer; transition: background .2s ease; }
.guza-search-btn:hover, .guza-search-btn:focus { background: #db2777; color: #fff; }

.guza-toggler { border: none; background: transparent; padding: 6px 8px; border-radius: 10px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.guza-toggler:hover, .guza-toggler:focus { background: #f3f4f6; box-shadow: none; outline: none; }
.guza-toggler .navbar-toggler-icon {
    display: inline-block; width: 24px; height: 24px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ec4899' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    background-repeat: no-repeat; background-position: center; background-size: contain;
}

.guza-mobile-only { display: inline-flex !important; }

@media (min-width: 992px) {
    .guza-topbar { gap: 20px; min-height: 72px; }
    .guza-center-wrap { display: flex !important; align-items: center; justify-content: space-between; gap: 20px; margin-left: 0; }
    .guza-actions { margin-left: 0; gap: 10px; }
    .guza-mobile-only { display: none !important; }
    .guza-desktop-nav {
        display: flex !important; align-items: center; gap: 6px;
        flex: 1 1 auto; min-width: 0; overflow-x: auto; overflow-y: hidden;
        white-space: nowrap; scrollbar-width: none; -ms-overflow-style: none;
        margin: 0; padding: 4px 0; list-style: none;
    }
    .guza-desktop-nav .nav-link { font-size: .92rem; padding: .55rem .7rem; flex-shrink: 0; }
    .guza-search-form-desktop { flex: 0 0 320px; max-width: 320px; min-width: 240px; }
}

@media (max-width: 991.98px) {
    .guza-topbar { min-height: 60px; gap: 8px; }
    .guza-center-wrap { display: none !important; }
    .guza-actions { margin-left: auto; gap: 4px; }
}

.guza-panel { max-height: 0; overflow: hidden; opacity: 0; background: #fff; border-top: 0 solid #f3f4f6; width: 100%; transition: max-height .32s cubic-bezier(0.4, 0, 0.2, 1), opacity .28s ease, border-top-width .01s; }
.guza-panel.open { opacity: 1; border-top-width: 1px; }
#navbarCollapse.guza-panel.open { max-height: 360px; }
#mobile-search-panel.guza-panel.open { max-height: 80px; padding: 10px 1rem; }

.guza-navbar .navbar-nav, .guza-navbar .mobile-nav { list-style: none; padding: 0; margin: 0; }
.guza-navbar .navbar-nav.mobile-nav { padding: 12px 1rem 16px; display: flex !important; flex-direction: column !important; gap: 6px; }
.guza-navbar .navbar-nav.mobile-nav .nav-link { padding: 12px 14px !important; border-radius: 12px; font-size: .96rem; gap: 10px; }

.mobile-nav .nav-item { opacity: 0; transform: translateY(-8px); transition: opacity .22s ease, transform .22s ease; }
#navbarCollapse.open .mobile-nav .nav-item { opacity: 1; transform: translateY(0); }

#mobile-search-panel .guza-search-group { display: flex; flex-wrap: nowrap; align-items: stretch; border-radius: 12px; overflow: hidden; width: 100%; }

.input-group { display: flex; align-items: stretch; width: 100%; }

/* ── SCROLL REVEAL ───────────────────────────────────────── */
.reveal { opacity: 0; transform: translateY(32px); transition: opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1), transform 0.55s cubic-bezier(0.22, 1, 0.36, 1); will-change: opacity, transform; }
.reveal--left  { transform: translateX(-32px); }
.reveal--right { transform: translateX(32px); }
.reveal--scale { transform: scale(0.92); }
.reveal--visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; transition: none; }
}

@media (max-width: 767px) {
    .reveal--left,
    .reveal--right {
        transform: translateY(28px) !important;
    }
}

.buy-now-btn {
    background: transparent;
    border: 2px solid var(--color-brand);
    color: var(--color-brand);

    width: 100%; padding: 15px; border-radius: 12px;
    font-weight: 600; font-size: 1rem;  cursor: pointer;
    display: flex; align-items: center; justify-content: center; gap: 8px;
    transition: all 0.2s; font-family: inherit;
}

.buy-now-btn:hover {
    background: var(--color-brand);
    color: #fff;
}


.product-gallery-wrap {
    display: flex;
    flex-direction: column;
    gap: 10px;
    user-select: none;
}

/* Main swiper */
.swiper-main {
    width: 100%;
    border-radius: 14px;
    overflow: hidden;
    background: #f5f5f5;
    cursor: zoom-in;
}
.swiper-main .swiper-slide {
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.swiper-main .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

/* Counter badge */
.swiper-main .swiper-counter {
    position: absolute;
    bottom: 12px;
    right: 12px;
    background: rgba(0,0,0,.48);
    color: #fff;
    font-size: 12px;
    line-height: 1;
    padding: 5px 9px;
    border-radius: 20px;
    pointer-events: none;
    z-index: 10;
    backdrop-filter: blur(4px);
}

/* Prev/Next arrows */
.swiper-main .swiper-button-prev,
.swiper-main .swiper-button-next {
    width: 36px;
    height: 36px;
    background: rgba(255,255,255,.85);
    border-radius: 50%;
    backdrop-filter: blur(4px);
    box-shadow: 0 2px 8px rgba(0,0,0,.14);
    transition: background .18s, opacity .18s;
}
.swiper-main .swiper-button-prev:hover,
.swiper-main .swiper-button-next:hover {
    background: #fff;
}
.swiper-main .swiper-button-prev::after,
.swiper-main .swiper-button-next::after {
    font-size: 13px;
    font-weight: 700;
    color: #222;
}
.swiper-main .swiper-button-prev.swiper-button-disabled,
.swiper-main .swiper-button-next.swiper-button-disabled {
    opacity: 0;
}

/* Thumbs swiper */
.swiper-thumbs {
    width: 100%;
    /* thumb height + padding */
    height: 78px;
    padding: 2px 0;
}
.swiper-thumbs .swiper-wrapper {
    /* left-align when fewer slides than viewport */
    justify-content: flex-start;
}
.swiper-thumbs .swiper-slide {
    width: 72px !important;
    height: 72px;
    border-radius: 8px;
    overflow: hidden;
    border: 2px solid transparent;
    cursor: pointer;
    opacity: .55;
    transition: opacity .18s, border-color .18s, transform .18s;
    flex-shrink: 0;
}
.swiper-thumbs .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    pointer-events: none;
}
.swiper-thumbs .swiper-slide:hover {
    opacity: .8;
}
.swiper-thumbs .swiper-slide-thumb-active {
    border-color: var(--color-brand, #e84a4a);
    opacity: 1;
    transform: scale(1.04);
}

/* Hide single-image thumbs */
.swiper-thumbs.hidden { display: none; }

/* ── HERO SWIPER ─────────────────────────────────────────── */
.hero-section,
.hero-swiper {
    width: 100%;
    height: 520px;
    position: relative;
    overflow: hidden;
    background-color: #111;
}

.hero-swiper .swiper-wrapper { height: 100%; }

.hero-swiper .swiper-slide {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.hero-slide-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    z-index: 1;
}

.hero-slide-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to right,
        rgba(10,4,8,0.68) 0%,
        rgba(10,4,8,0.28) 55%,
        rgba(10,4,8,0.04) 100%
    );
    z-index: 2;
}

.hero-slide-content {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    padding: 0 8%;
    box-sizing: border-box;
    z-index: 3;
}

.hero-slide-inner {
    text-align: left;
    max-width: 600px;
    width: 100%;
}

.hero-slide-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
    position: relative;
    z-index: 4;
}


.hero-slide-title {
    font-size: clamp(1.5rem, 4vw, 2.75rem);
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    margin: 0 0 12px;
    letter-spacing: -0.02em;
    text-shadow: 0 2px 12px rgba(0,0,0,0.4);
}
.hero-slide-text {
    font-size: clamp(0.9375rem, 2vw, 1.125rem);
    color: rgba(255,255,255,0.90);
    margin: 0 0 24px;
    line-height: 1.6;
    text-shadow: 0 1px 4px rgba(0,0,0,0.3);
}
.hero-slide-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    background: var(--color-brand);
    color: #fff;
    border-radius: 999px;
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
    box-shadow: 0 4px 20px rgba(236,72,153,0.45);
    text-decoration: none;
    position: relative;
    z-index: 4;
}
.hero-slide-cta:hover {
    background: var(--color-brand-dark);
    transform: translateY(-2px);
    box-shadow: 0 6px 28px rgba(236,72,153,0.55);
    color: #fff;
}

/* Стрелки */
.hero-btn-prev,
.hero-btn-next {
    background-color: rgba(255,255,255,0.18);
    backdrop-filter: blur(6px);
    width: 46px;
    height: 46px;
    border-radius: 50%;
    color: #fff;
    transition: background 0.2s, transform 0.2s;
    z-index: 10;
}
.hero-btn-prev::after,
.hero-btn-next::after { font-size: 18px; font-weight: 700; }
.hero-btn-prev:hover,
.hero-btn-next:hover { background-color: var(--color-brand); transform: scale(1.08); }
.hero-btn-prev { left: 20px; }
.hero-btn-next { right: 20px; }

/* Пагинация */
.hero-pagination {
    bottom: 20px;
    z-index: 10;
    line-height: 0;
}
.hero-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    background: #fff;
    opacity: 0.5;
    border: none;
    box-shadow: none;
    outline: none;
    margin: 0 5px;
    padding: 0;
    transition: all 0.3s;
}
.hero-pagination .swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--color-brand);
    width: 22px;
    border-radius: 4px;
}

/* Мобильные */
@media (max-width: 767px) {
    .hero-section,
    .hero-swiper { height: 280px; }

    .hero-slide-content {
        justify-content: center;
        padding: 0 20px;
    }
    .hero-slide-inner { text-align: center; }

    .hero-btn-prev,
    .hero-btn-next { display: none; }

    .hero-pagination { bottom: 10px; }
}

/* Планшет */
@media (min-width: 768px) and (max-width: 1199px) {
    .hero-section,
    .hero-swiper { height: 420px; }
}

/* ── LOADING BAR ─────────────────────────────────────────── */
.loading-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: transparent;
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.2s;
    z-index: 100;
}
.loading-bar.active {
    opacity: 1;
}
.loading-bar-fill {
    height: 100%;
    width: 0%;
    background: var(--color-brand);
    transition: width 0.3s ease;
    border-radius: 0 2px 2px 0;
}

/* Теги товара на странице товара */
.product-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.product-tag-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    transition: filter .15s ease;
}

.product-tag-link:hover {
    filter: brightness(1.15);
    text-decoration: none;
}

.product-tag-link i {
    font-size: 10px;
}

/* subcategories */
.subcategories-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.subcategories-chips a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    border: 1px solid #e5e7eb;
    border-radius: 99px;
    font-size: 14px;
    color: inherit;
    text-decoration: none;
    background: #fff;
    transition: background .15s, border-color .15s;
}

.subcategories-chips a:hover {
    background: #f3f4f6;
    border-color: #d1d5db;
}

.subcategories-chips a span {
    font-size: 12px;
    color: #9ca3af;
}

.geo-share-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    background: var(--color-brand, #fc3f1d);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    font-family: inherit;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.15s;
    white-space: nowrap;
    flex-shrink: 0;
}
.geo-share-btn:hover    { opacity: 0.87; }
.geo-share-btn:active   { transform: scale(0.97); }
.geo-share-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
.geo-share-btn.success  { background: #16a34a; }

.geo-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}

.geo-geocoding-status {
    display: none;
    margin-top: 6px;
    font-size: 12px;
    color: var(--color-text-secondary, rgba(255,255,255,0.45));
    align-items: center;
    gap: 6px;
}
.geo-geocoding-status.active { display: flex; }

/* ── Карта ── */
#co-ymap-wrap {
    position: relative;
    width: 100%;
    height: 260px;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 10px;
    box-shadow: 0 2px 12px rgba(0,0,0,.18);
    background: #1a1a2e;
}
#co-ymap {
    width: 100%;
    height: 100%;
}

/* Подсказка поверх карты */
#co-map-hint {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 10;
    transition: opacity .4s;
}
#co-map-hint span {
    background: rgba(0,0,0,.62);
    color: #fff;
    font-size: 13px;
    padding: 7px 16px;
    border-radius: 20px;
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    gap: 7px;
}
#co-map-hint.hidden { opacity: 0; }

/* Спиннер геокодинга внутри карты */
#co-map-geocoding {
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0,0,0,.65);
    color: #fff;
    font-size: 12px;
    padding: 5px 14px;
    border-radius: 20px;
    display: none;
    align-items: center;
    gap: 6px;
    z-index: 20;
    white-space: nowrap;
}
#co-map-geocoding.active { display: flex; }

.sort-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 24px;
    padding: 12px 16px;
    background: var(--color-bg-secondary, #f9f9f9);
    border-radius: 12px;
    border: 1px solid var(--color-border, #e5e7eb);
}

.sort-bar__label {
    font-size: 13px;
    color: var(--color-text-muted, #6b7280);
    display: flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.sort-bar__pills {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.sort-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 13px;
    border: 1px solid var(--color-border, #e5e7eb);
    background: #fff;
    color: var(--color-text-secondary, #374151);
    text-decoration: none;
    transition: border-color .15s, background .15s;
}

.sort-pill:hover {
    border-color: var(--color-brand);
    color: var(--color-text-muted);
}

.sort-pill--active {
    background: var(--color-brand);
    border-color: var(--color-brand);
    color: #fff;
    font-weight: 500;
}

.sort-bar__count {
    margin-left: auto;
    font-size: 12px;
    color: var(--color-text-muted, #9ca3af);
    white-space: nowrap;
}

/* Заменить все правила для swiper внутри карточки на это */

.product-card-img-wrap .swiper {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
}

.product-card-img-wrap .swiper-slide {
    height: 100%;
}

.product-card-img-wrap .swiper-slide a {
    display: block;
    width: 100%;
    height: 100%;
}

.product-card-img-wrap .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Отключить zoom на hover внутри swiper */
.product-card-inner:hover .product-card-img-wrap .swiper .product-card-img {
    transform: none;
}

.product-card-img-wrap .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background: rgba(0, 0, 0, 0.25);
    opacity: 1;
    transition: background 0.2s, width 0.2s;
    border-radius: 4px;
}

.product-card-img-wrap .swiper-pagination-bullet-active {
    background: var(--color-brand);
    width: 16px;
    border-radius: 4px;
}

.product-card-img-wrap {
    position: relative;
    overflow: hidden;
    border-radius: inherit;
    transform: translateZ(0);
    -webkit-mask-image: -webkit-radial-gradient(white, black);
}