/* ===========================================================================
 * Jazeel — styles for products.php
 * نُقلت من كتلة <style> المضمّنة داخل products.php إلى ملف خارجي ليستفيد من كاش
 * المتصفح (.htaccess يمنح CSS شهرًا). الرابط يحمل ?v=filemtime فيتغيّر تلقائيًا
 * مع أي تعديل هنا، فلا تُعرض نسخة قديمة أبدًا.
 * المسارات داخل url() جذرية (/...) لأن الملف الخارجي يحلّها من مجلده لا من الصفحة.
 * =========================================================================== */

:root {
      color-scheme: light;

      --jz-brand-enhanced: linear-gradient(135deg, #7b4a2a 0%, #9d6b4a 50%, #7b4a2a 100%);
      --jz-gold-gradient: linear-gradient(135deg, #b8860b 0%, #d4af37 50%, #f4d03f 100%);
      --jz-accent-glow: rgba(212, 175, 55, 0.2);
      --jz-shadow-luxury: 0 20px 60px rgba(123, 74, 42, 0.15);
    }

    body.products-page {
      margin: 0;
      font-family: "Tajawal", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
      background: linear-gradient(135deg, #fefdfb 0%, #f8f6f2 50%, #fefdfb 100%);
      color: #1f2937;
      position: relative;
      overflow-x: hidden;
    }

    body.products-page::before {
      content: "";
      position: fixed;
      top: 0;
      right: 0;
      width: 600px;
      height: 600px;
      background: radial-gradient(circle, rgba(202, 160, 106, 0.08), transparent);
      border-radius: 50%;
      filter: blur(80px);
      animation: floatOrb 20s ease-in-out infinite;
      pointer-events: none;
      z-index: 0;
    }

    body.products-page::after {
      content: "";
      position: fixed;
      bottom: 0;
      left: 0;
      width: 500px;
      height: 500px;
      background: radial-gradient(circle, rgba(123, 74, 42, 0.06), transparent);
      border-radius: 50%;
      filter: blur(80px);
      animation: floatOrb 25s ease-in-out infinite reverse;
      pointer-events: none;
      z-index: 0;
    }

    @keyframes floatOrb {
      0%, 100% { transform: translate(0, 0) scale(1); }
      33% { transform: translate(-30px, 50px) scale(1.1); }
      66% { transform: translate(20px, -30px) scale(0.9); }
    }

    .jz-products-page {
      --jz-brand: #7b4a2a;
      --jz-brand-light: #caa06a;
      --jz-ink: #1f2937;
      --jz-muted: #6b7280;
      --jz-bg: #ffffff;
      --jz-card: #ffffff;
      --jz-border: rgba(17,24,39,.10);
      --jz-border-soft: rgba(17,24,39,.08);
      --jz-shadow: 0 10px 24px rgba(0,0,0,.06);
      --jz-shadow-hover: 0 16px 44px rgba(0,0,0,.10);
      --jz-radius: 22px;
      --jz-radius-sm: 16px;

      background: transparent;
      min-height: 100vh;
      padding-bottom: 36px;
      isolation: isolate;
      position: relative;
      z-index: 1;
    }

    .jz-products-page,
    .jz-products-page * {
      box-sizing: border-box;
      font-family: inherit;
    }

    @media (prefers-reduced-motion: reduce) {
      .jz-products-page * {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
      }
    }

    .jz-products-page .container {
      width: min(1180px, calc(100% - 32px));
      margin-inline: auto;
    }

    .jz-products-page .hero {
      padding: 40px 0 20px;
      opacity: 0;
      animation: fadeInUp 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
      animation-delay: 0.2s;
    }

    @keyframes fadeInUp {
      from {
        opacity: 0;
        transform: translateY(30px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .jz-products-page .hero .container {
      display: grid;
      grid-template-columns: 1.15fr .85fr;
      gap: 30px;
      align-items: center;
    }

    .jz-products-page .hero-copy h1 {
      margin: 0 0 16px;
      font-weight: 900;
      letter-spacing: .5px;
      font-size: clamp(1.6rem, 3.2vw, 2.5rem);
      background: var(--jz-brand-enhanced);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      line-height: 1.2;
    }

    .jz-products-page .hero-copy p {
      margin: 0;
      line-height: 1.95;
      color: var(--jz-muted);
      font-weight: 600;
      font-size: clamp(.95rem, 1.45vw, 1.05rem);
    }

    .jz-products-page .hero-media {
      border-radius: var(--jz-radius);
      overflow: hidden;
      background: #f3f4f6;
      box-shadow: var(--jz-shadow-luxury);
      border: 1px solid var(--jz-border-soft);
      position: relative;
      transform: translateY(0);
      transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .jz-products-page .hero-media:hover {
      transform: translateY(-8px);
      box-shadow: 0 24px 70px rgba(123, 74, 42, 0.2);
    }

    .jz-products-page .hero-media-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, rgba(123, 74, 42, 0.1) 0%, transparent 50%, rgba(202, 160, 106, 0.1) 100%);
      pointer-events: none;
      z-index: 1;
    }

    .jz-products-page .hero-media img {
      width: 100%;
      height: min(360px, 42vh);
      object-fit: cover;
      display: block;
      transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .jz-products-page .hero-media:hover img {
      transform: scale(1.05);
    }

    @media (max-width: 992px) {
      .jz-products-page .hero .container {
        grid-template-columns: 1fr;
        gap: 24px;
      }

      .jz-products-page .hero-media img {
        height: min(320px, 38vh);
      }

      .jz-products-page .hero-copy h1 {
        font-size: clamp(1.5rem, 5vw, 2rem);
        margin-bottom: 12px;
      }

      .jz-products-page .container {
        width: calc(100% - 40px);
      }

      .jz-products-page .products-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 14px;
      }
    }

    @media (max-width: 768px) {
      .jz-products-page .hero {
        padding: 30px 0 16px;
      }

      .jz-products-page .hero-copy p {
        font-size: 0.95rem;
        line-height: 1.75;
      }

      .jz-products-page .filters-row {
        padding: 16px;
        gap: 10px;
      }

      .jz-products-page #productSearch,
      .jz-products-page #clearSearch {
        padding: 0.85rem 1rem;
        font-size: 0.9rem;
      }

      .jz-products-page .tab-btn {
        padding: 0.8rem 1.1rem;
        font-size: 0.88rem;
      }

      .jz-products-page .section-title {
        font-size: 1.05rem;
      }

      .jz-products-page .section-meta {
        font-size: 0.85rem;
      }

      .jz-products-page .products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
      }

      .jz-products-page .modal-content {
        max-height: 80vh;
      }
    }

    @media (max-width: 640px) {
      .jz-products-page .container {
        width: calc(100% - 24px);
      }

      .jz-products-page .hero {
        padding: 24px 0 12px;
      }

      .jz-products-page .hero .container {
        gap: 20px;
      }

      .jz-products-page .hero-copy h1 {
        font-size: 1.45rem;
        margin-bottom: 10px;
      }

      .jz-products-page .hero-copy p {
        font-size: 0.9rem;
        line-height: 1.7;
      }

      .jz-products-page .hero-media img {
        height: min(280px, 35vh);
      }

      .jz-products-page .filters-row {
        padding: 14px;
        border-radius: 16px;
      }

      .jz-products-page .search-wrap {
        min-width: 100%;
        order: 1;
      }

      .jz-products-page #clearSearch {
        width: 100%;
        order: 2;
      }

      .jz-products-page #productSearch {
        padding: 0.8rem 0.95rem;
        padding-inline-end: 2.6rem;
        font-size: 0.88rem;
        border-radius: 14px;
      }

      .jz-products-page #clearSearch {
        padding: 0.8rem 1.1rem;
        font-size: 0.88rem;
        border-radius: 14px;
      }

      .jz-products-page .tabs-wrap {
        margin-top: 14px;
      }

      .jz-products-page .tab-btn {
        flex: 1 1 calc(50% - 5px);
        text-align: center;
        padding: 0.75rem 1rem;
        font-size: 0.85rem;
        border-radius: 14px;
      }

      .jz-products-page .products-grid {
        gap: 10px;
      }

      .jz-products-page .product-card {
        border-radius: 16px;
      }

      .jz-products-page .product-card-title {
        font-size: 0.85rem;
      }

      .jz-products-page .product-info {
        padding: 8px 8px 10px;
      }

      .jz-products-page .section {
        margin-top: 24px;
      }

      .jz-products-page .section-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
      }

      .jz-products-page .section-title {
        font-size: 1rem;
      }

      .jz-products-page .section-more {
        padding: 0.8rem 1.8rem;
        font-size: 0.88rem;
        border-radius: 14px;
      }

      .jz-products-page .modal-overlay {
        padding: 12px;
      }

      .jz-products-page .modal-content {
        padding: 16px;
        border-radius: 20px;
        max-height: 85vh;
      }

      .jz-products-page .modal-close {
        width: 40px;
        height: 40px;
        font-size: 20px;
      }
    }

    @media (max-width: 420px) {
      .jz-products-page .hero-copy h1 {
        font-size: 1.35rem;
      }

      .jz-products-page .hero-copy p {
        font-size: 0.88rem;
      }

      .jz-products-page .hero-media img {
        height: min(260px, 32vh);
      }

      .jz-products-page .filters-row {
        padding: 12px;
      }

      .jz-products-page #productSearch,
      .jz-products-page #clearSearch {
        padding: 0.75rem 0.9rem;
        font-size: 0.85rem;
      }

      .jz-products-page .tab-btn {
        flex: 1 1 100%;
        padding: 0.7rem 0.9rem;
        font-size: 0.82rem;
      }

      .jz-products-page .products-grid {
        grid-template-columns: 1fr;
        gap: 12px;
      }

      .jz-products-page .product-card-title {
        font-size: 0.82rem;
      }

      .jz-products-page .section-title {
        font-size: 0.95rem;
      }

      .jz-products-page .section-meta {
        font-size: 0.8rem;
      }

      .jz-products-page .modal-content {
        padding: 14px;
        border-radius: 18px;
      }
    }

    @media (max-width: 360px) {
      .jz-products-page .container {
        width: calc(100% - 20px);
      }

      .jz-products-page .hero {
        padding: 20px 0 10px;
      }

      .jz-products-page .hero-copy h1 {
        font-size: 1.25rem;
        letter-spacing: 0.3px;
      }

      .jz-products-page .hero-copy p {
        font-size: 0.85rem;
        line-height: 1.65;
      }

      .jz-products-page .hero-media img {
        height: min(240px, 30vh);
      }

      .jz-products-page .filters-row {
        padding: 10px;
        border-radius: 14px;
      }

      .jz-products-page #productSearch {
        padding: 0.7rem 0.85rem;
        padding-inline-end: 2.4rem;
        font-size: 0.82rem;
        border-radius: 12px;
      }

      .jz-products-page #clearSearch {
        padding: 0.7rem 0.85rem;
        font-size: 0.82rem;
        border-radius: 12px;
      }

      .jz-products-page .search-icon {
        width: 16px;
        height: 16px;
        inset-inline-end: 12px;
      }

      .jz-products-page .tab-btn {
        padding: 0.65rem 0.85rem;
        font-size: 0.8rem;
        border-radius: 12px;
      }

      .jz-products-page .product-card {
        border-radius: 14px;
      }

      .jz-products-page .product-info {
        padding: 7px 7px 9px;
      }

      .jz-products-page .product-card-title {
        font-size: 0.8rem;
        -webkit-line-clamp: 3;
        min-height: calc(1.5em * 3);
      }

      .jz-products-page .section {
        margin-top: 20px;
      }

      .jz-products-page .section-title {
        font-size: 0.9rem;
      }

      .jz-products-page .section-meta {
        font-size: 0.75rem;
      }

      .jz-products-page .section-more {
        padding: 0.7rem 1.5rem;
        font-size: 0.82rem;
      }

      .jz-products-page .modal-overlay {
        padding: 10px;
      }

      .jz-products-page .modal-content {
        padding: 12px;
        border-radius: 16px;
      }

      .jz-products-page .modal-close {
        width: 38px;
        height: 38px;
        font-size: 18px;
      }
    }

    @media (min-width: 1400px) {
      .jz-products-page .container {
        width: min(1320px, calc(100% - 40px));
      }

      .jz-products-page .hero-copy h1 {
        font-size: 2.6rem;
      }

      .jz-products-page .hero-copy p {
        font-size: 1.08rem;
      }

      .jz-products-page .hero-media img {
        height: min(400px, 45vh);
      }

      .jz-products-page .products-grid {
        grid-template-columns: repeat(6, 1fr);
        gap: 22px;
      }

      .jz-products-page .section-title {
        font-size: 1.25rem;
      }
    }

    @media (hover: none) and (pointer: coarse) {
      .jz-products-page #productSearch,
      .jz-products-page #clearSearch,
      .jz-products-page .tab-btn,
      .jz-products-page .product-card,
      .jz-products-page .section-more,
      .jz-products-page .modal-close {
        min-height: 44px;
      }

      .jz-products-page .tab-btn {
        padding: 0.85rem 1.2rem;
      }

      .jz-products-page .product-card:hover {
        transform: translateY(0) scale(1);
      }

      .jz-products-page .product-card:active {
        transform: translateY(-4px) scale(1.01);
      }

      .jz-products-page .tab-btn:hover {
        transform: translateY(0);
      }

      .jz-products-page .tab-btn:active {
        transform: translateY(-2px);
      }
    }

    @media (max-height: 500px) and (orientation: landscape) {
      .jz-products-page .hero {
        padding: 20px 0 12px;
      }

      .jz-products-page .hero-media img {
        height: 200px;
      }

      .jz-products-page .modal-content {
        max-height: 90vh;
      }
    }

    @media print {
      .jz-products-page .filters-row,
      .jz-products-page .tabs-wrap,
      .jz-products-page .section-footer,
      .jz-products-page .modal-overlay {
        display: none !important;
      }

      .jz-products-page .product-card {
        break-inside: avoid;
        page-break-inside: avoid;
      }

      body.products-page::before,
      body.products-page::after {
        display: none !important;
      }
    }

    .jz-products-page .filters-row {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
      align-items: center;
      margin-top: 24px;
      margin-bottom: 12px;
      background: rgba(255, 255, 255, 0.8);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      padding: 20px;
      border-radius: 20px;
      border: 1px solid rgba(123, 74, 42, 0.1);
      box-shadow: 0 8px 32px rgba(123, 74, 42, 0.08);
      opacity: 0;
      animation: fadeInUp 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
      animation-delay: 0.4s;
    }

    .jz-products-page .search-wrap {
      position: relative;
      flex: 1;
      min-width: 260px;
    }

    .jz-products-page .search-icon {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      inset-inline-end: 14px;
      width: 18px;
      height: 18px;
      opacity: .55;
      pointer-events: none;
    }

    .jz-products-page #productSearch {
      width: 100%;
      padding: 1rem 1.1rem;
      padding-inline-end: 2.8rem;
      border-radius: 16px;
      border: 2px solid transparent;
      background: #fff;
      color: var(--jz-ink);
      outline: none;
      font-weight: 700;
      box-shadow: 0 4px 16px rgba(123, 74, 42, 0.06);
      appearance: none;
      -webkit-appearance: none;
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .jz-products-page #productSearch::placeholder {
      color: rgba(107,114,128,.7);
      font-weight: 600;
    }

    .jz-products-page #productSearch:focus {
      border-color: var(--jz-brand);
      box-shadow: 0 4px 20px rgba(123, 74, 42, 0.15), 0 0 0 4px var(--jz-accent-glow);
      transform: translateY(-2px);
    }

    .jz-products-page #clearSearch {
      border-radius: 16px;
      border: 2px solid var(--jz-border);
      background: #fff;
      padding: .95rem 1.3rem;
      font-weight: 800;
      cursor: pointer;
      color: var(--jz-brand);
      box-shadow: 0 4px 16px rgba(123, 74, 42, 0.06);
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
      white-space: nowrap;
    }

    .jz-products-page #clearSearch:hover {
      transform: translateY(-3px);
      box-shadow: 0 8px 24px rgba(123, 74, 42, 0.12);
      border-color: var(--jz-brand);
      background: var(--jz-brand);
      color: #fff;
    }

    .jz-products-page #clearSearch:focus {
      outline: none;
      box-shadow: 0 0 0 4px var(--jz-accent-glow);
    }

    @media (max-width: 640px) {
      .jz-products-page .search-wrap {
        min-width: 100%;
      }

      .jz-products-page #clearSearch {
        width: 100%;
      }
    }

    .jz-products-page .tabs-wrap {
      margin-top: 18px;
      margin-bottom: 14px;
      opacity: 0;
      animation: fadeInUp 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
      animation-delay: 0.6s;
    }

    .jz-products-page .tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
    }

    .jz-products-page .sub-tabs {
      margin-top: 12px;
    }

    .jz-products-page .sub-tabs.is-hidden {
      display: none;
    }

    .jz-products-page .tab-btn {
      border: 2px solid var(--jz-border);
      background: #fff;
      color: var(--jz-ink);
      padding: .9rem 1.25rem;
      border-radius: 16px;
      font-weight: 800;
      cursor: pointer;
      box-shadow: 0 4px 12px rgba(123, 74, 42, 0.06);
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
      white-space: nowrap;
      position: relative;
      overflow: hidden;
    }

    .jz-products-page .tab-btn::before {
      content: "";
      position: absolute;
      inset: 0;
      background: var(--jz-gold-gradient);
      opacity: 0;
      transition: opacity 0.3s ease;
    }

    .jz-products-page .tab-btn > * {
      position: relative;
      z-index: 1;
    }

    .jz-products-page .tab-btn:hover {
      transform: translateY(-3px);
      box-shadow: 0 8px 24px rgba(123, 74, 42, 0.12);
      border-color: var(--jz-brand);
    }

    .jz-products-page .tab-btn:hover::before {
      opacity: 0.05;
    }

    .jz-products-page .tab-btn.active {
      background: var(--jz-brand);
      color: #fff;
      border-color: var(--jz-brand);
      box-shadow: 0 8px 28px rgba(123, 74, 42, 0.25);
      transform: translateY(-2px);
    }

    .jz-products-page .sub-tabs .tab-btn {
      background: #faf8f5;
      color: #6b4a32;
      border-color: rgba(123,74,42,.15);
    }

    .jz-products-page .sub-tabs .tab-btn.active {
      background: var(--jz-brand-light);
      color: #fff;
      border-color: var(--jz-brand-light);
    }

    @media (max-width:640px) {
      .jz-products-page .tab-btn {
        flex: 1 1 calc(50% - 10px);
        text-align: center;
      }
    }

    @media (max-width:420px) {
      .jz-products-page .tab-btn {
        flex: 1 1 100%;
      }
    }

    .jz-products-page .products-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 16px;
      margin-top: 14px;
      align-items: stretch;
    }

    @media (min-width: 640px) {
      .jz-products-page .products-grid {
        grid-template-columns: repeat(3, 1fr);
      }
    }

    @media (min-width: 992px) {
      .jz-products-page .products-grid {
        grid-template-columns: repeat(4, 1fr);
      }
    }

    @media (min-width: 1200px) {
      .jz-products-page .products-grid {
        grid-template-columns: repeat(5, 1fr);
        gap: 20px;
      }
    }

    .jz-products-page .product-card {
      background: var(--jz-card);
      border: 2px solid var(--jz-border-soft);
      border-radius: 18px;
      overflow: hidden;
      cursor: pointer;
      transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
      display: flex;
      flex-direction: column;
      height: 100%;
      box-shadow: 0 4px 12px rgba(123, 74, 42, 0.06);
      transform: translateZ(0);
      outline: none;
      position: relative;
      opacity: 0;
      animation: fadeInUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }

    .jz-products-page .product-card:nth-child(1) { animation-delay: 0.1s; }
    .jz-products-page .product-card:nth-child(2) { animation-delay: 0.15s; }
    .jz-products-page .product-card:nth-child(3) { animation-delay: 0.2s; }
    .jz-products-page .product-card:nth-child(4) { animation-delay: 0.25s; }
    .jz-products-page .product-card:nth-child(5) { animation-delay: 0.3s; }
    .jz-products-page .product-card:nth-child(n+6) { animation-delay: 0.35s; }

    .jz-products-page .product-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background: var(--jz-gold-gradient);
      opacity: 0;
      transition: opacity 0.4s ease;
      z-index: 0;
    }

    .jz-products-page .product-card:hover {
      transform: translateY(-8px) scale(1.02);
      box-shadow: 0 16px 48px rgba(123, 74, 42, 0.15);
      border-color: var(--jz-brand-light);
    }

    .jz-products-page .product-card:hover::before {
      opacity: 0.03;
    }

    .jz-products-page .product-card:focus {
      box-shadow: 0 0 0 4px var(--jz-accent-glow), 0 16px 48px rgba(123, 74, 42, 0.15);
    }

    .jz-products-page .product-card-image img {
      width: 100%;
      aspect-ratio: 1 / 1;
      object-fit: cover;
      display: block;
      background: #f3f4f6;
      transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
      position: relative;
      z-index: 1;
    }

    .jz-products-page .product-card:hover .product-card-image img {
      transform: scale(1.08);
    }

    .jz-products-page .product-info {
      padding: 10px 10px 12px;
      text-align: center;
      position: relative;
      z-index: 1;
    }

    .jz-products-page .product-card-title {
      margin: 0;
      font-weight: 800;
      font-size: .88rem;
      color: var(--jz-ink);
      line-height: 1.5;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      min-height: calc(1.5em * 2);
    }

    .jz-products-page .section {
      margin-top: 28px;
      padding: 0;
      border: 0;
      background: transparent;
      box-shadow: none;
      opacity: 0;
      animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }

    .jz-products-page .section-header {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 12px;
    }

    .jz-products-page .section-title {
      margin: 0;
      font-weight: 900;
      color: var(--jz-ink);
      font-size: 1.15rem;
      background: var(--jz-brand-enhanced);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .jz-products-page .section-meta {
      color: var(--jz-muted);
      font-weight: 700;
      font-size: .9rem;
      white-space: nowrap;
    }

    .jz-products-page .section-footer {
      text-align: center;
      margin: 18px 0 8px;
    }

    .jz-products-page .section-more {
      padding: .95rem 2.2rem;
      border-radius: 16px;
      border: 2px solid var(--jz-border);
      background: #fff;
      font-weight: 800;
      cursor: pointer;
      color: var(--jz-brand);
      box-shadow: 0 4px 16px rgba(123, 74, 42, 0.08);
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: .5rem;
    }

    .jz-products-page .section-more:hover {
      transform: translateY(-3px);
      box-shadow: 0 8px 28px rgba(123, 74, 42, 0.15);
      background: var(--jz-brand);
      color: #fff;
      border-color: var(--jz-brand);
    }

    .jz-products-page .section-more[disabled] {
      opacity: .5;
      cursor: not-allowed;
      transform: none;
      box-shadow: none;
    }

    .jz-products-page .modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,.65);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      display: none;
      align-items: center;
      justify-content: center;
      z-index: 9999;
      padding: 18px;
      opacity: 0;
      transition: opacity 0.3s ease;
    }

    .jz-products-page .modal-overlay.active {
      display: flex;
      opacity: 1;
    }

    .jz-products-page .modal-content {
      background: #fff;
      border-radius: 24px;
      width: min(920px, 100%);
      max-height: min(82vh, 760px);
      overflow: auto;
      position: relative;
      padding: 20px 20px 24px;
      border: 2px solid rgba(123, 74, 42, 0.1);
      box-shadow: 0 24px 80px rgba(123, 74, 42, 0.3);
      transform: scale(0.95);
      opacity: 0;
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .jz-products-page .modal-overlay.active .modal-content {
      transform: scale(1);
      opacity: 1;
    }

    .jz-products-page .modal-close {
      position: sticky;
      top: 0;
      inset-inline-start: 0;
      margin-inline-start: auto;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 44px;
      height: 44px;
      border-radius: 999px;
      border: 2px solid var(--jz-brand-light);
      background: #fff;
      color: var(--jz-brand);
      font-size: 22px;
      cursor: pointer;
      box-shadow: 0 4px 16px rgba(123, 74, 42, 0.15);
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .jz-products-page .modal-close:hover {
      background: var(--jz-brand);
      color: #fff;
      transform: rotate(90deg);
    }

    .jz-products-page .modal-close:focus {
      outline: none;
      box-shadow: 0 0 0 4px var(--jz-accent-glow);
    }

    @media (max-width: 480px) {
      .jz-products-page .modal-content {
        padding: 16px 16px 20px;
        border-radius: 20px;
      }
    }

    .jz-products-page ::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }

    .jz-products-page ::-webkit-scrollbar-track {
      background: #f1f1f1;
      border-radius: 10px;
    }

    .jz-products-page ::-webkit-scrollbar-thumb {
      background: var(--jz-brand-light);
      border-radius: 10px;
      transition: background 0.3s ease;
    }

    .jz-products-page ::-webkit-scrollbar-thumb:hover {
      background: var(--jz-brand);
    }