:root {
  --font-display: 'Sora', 'Plus Jakarta Sans', sans-serif;
  --font-body: 'Plus Jakarta Sans', -apple-system, sans-serif;
  --ink-900: #332f52;
  --ink-800: #3a3558;
  --ink-700: #4a4570;
  --ink-600: #5a5485;
  --ink-500: #6a63a0;
  --ink-400: #7a73b5;
  --ink-300: #8a83c9;
  --ink-200: #b1addf;
  --ink-100: #e3e1f5;
  --purple-700: #1e3380;
  --purple-600: #273b87;
  --purple-500: #1e3380;
  --purple-400: #162d80;
  --purple-300: #000000;
  --purple-200: #ddd6fe;
  --purple-100: #ede9fe;
  --purple-50:  #f5f3ff;
  --clr-primary:        var(--purple-500);
  --clr-primary-dark:   var(--purple-600);
  --clr-primary-xdark:  var(--purple-700);
  --clr-primary-light:  var(--purple-100);
  --clr-primary-mid:    var(--purple-300);
  --clr-muted:          var(--ink-400);
  --clr-dark:           var(--ink-900);
  --accent-700: #0e7490;
  --accent-600: #0891b2;
  --accent-500: #06b6d4;
  --accent-400: #22d3ee;
  --accent-300: #67e8f9;
  --accent-200: #a5f3fc;
  --accent-100: #cffafe;
  --accent-50:  #ecfeff;
  --clr-accent:         var(--accent-500);
  --clr-accent-dark:    var(--accent-600);
  --clr-accent-xdark:   var(--accent-700);
  --clr-accent-light:   var(--accent-100);
  --clr-accent-mid:     var(--accent-300);
  --surface-page:    #ffffff;
  --surface-card:    #faf7ff;
  --surface-subtle:  #f5f3ff;
  --surface-raised:  #ede9fe;
  --border-default:  #ddd6fe;
  --border-strong:   #c4b5fd;
  --border-focus:    var(--purple-500);
  --clr-red:    #ef4444;
  --clr-green:  #22c55e;
  --clr-pink:   #ec4899;
  --clr-star:   #f59e0b;
  --shadow-sm:     0 1px 4px rgba(0,0,0,0.1);
  --shadow-md:     0 4px 12px rgba(0,0,0,0.12);
  --shadow-lg:     0 8px 28px rgba(0,0,0,0.15);
  --shadow-glow:   0 0 0 3px rgba(124,58,237,0.18);
  --shadow-accent: 0 4px 20px rgba(6,182,212,0.35);
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring:   cubic-bezier(0.34, 1.56, 0.64, 1);
  --duration-fast: 150ms;
  --duration-base: 220ms;
  --duration-slow: 350ms;
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   14px;
  --radius-xl:   20px;
  --radius-pill: 9999px;
  --content-max: 1300px;
  --content-pad: clamp(1rem, 4vw, 2.5rem);
  --bs-primary:          var(--purple-500);
  --bs-link-color:       var(--purple-500);
  --bs-link-hover-color: var(--purple-600);
  --bs-border-color:     var(--border-default);
  --bs-border-radius:    var(--radius-md);
  --bs-border-radius-sm: var(--radius-sm);
  --bs-border-radius-lg: var(--radius-lg);
  --bs-body-color:       var(--ink-600);
  --bs-body-bg:          var(--surface-page);
  --bs-heading-color:    var(--ink-900);
  --bs-font-sans-serif:  var(--font-body);
  --bs-primary-rgb:         124, 58, 237;
}
.es-product-row {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    gap: 0.5rem;
}
.es-product-row::-webkit-scrollbar { display: none; }
.es-product-row > .col {
    flex: 0 0 auto;
    width: 45vw;
    max-width: 280px;
    min-width: 160px;
    scroll-snap-align: start;
}
.es-scroll-row {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    gap: 0.75rem;
    padding-bottom: 2px;
}
.es-scroll-row::-webkit-scrollbar { display: none; }
.es-scroll-row > .col {
    flex: 0 0 auto;
    width: auto;
    min-width: 140px;
    max-width: 260px;
    scroll-snap-align: start;
}
.es-testi-row {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    gap: 1rem;
}
.es-testi-row::-webkit-scrollbar { display: none; }
.es-testi-row > * {
    flex: 0 0 auto;
    width: 80vw;
    max-width: 360px;
    scroll-snap-align: start;
}
@media (min-width: 768px) {
    .es-product-row > .col { width: 220px; }
    .es-testi-row > * { width: 300px; }
}
@media (min-width: 992px) {
    .es-product-row {
        flex-wrap: wrap;
        overflow-x: visible;
        scroll-snap-type: none;
        gap: 0.5rem;
    }
    .es-product-row > .col {
        flex: 0 0 auto;
        width: calc(16.6667% - 0.42rem);
        max-width: none;
        min-width: 0;
        scroll-snap-align: none;
    }
    .es-product-row > .col:nth-child(n+7) { display: none; }
    .es-scroll-row {
        flex-wrap: wrap;
        overflow-x: visible;
        scroll-snap-type: none;
    }
    .es-scroll-row > .col {
        flex: 0 0 auto;
        width: calc(16.6667% - 0.63rem);
        max-width: none;
        min-width: 0;
        scroll-snap-align: none;
    }
    .es-scroll-row > .col:nth-child(n+7) { display: none; }
    .es-usp-strip .es-scroll-row {
        flex-wrap: nowrap;
        overflow-x: hidden;
        scroll-snap-type: none;
    }
    .es-usp-strip .es-scroll-row > .col {
        flex: 0 0 auto;
        width: calc(25% - 0.56rem);
        max-width: none;
        min-width: 0;
        scroll-snap-align: none;
    }
    .es-testi-row {
        flex-wrap: nowrap;
        overflow-x: hidden;
        scroll-snap-type: none;
    }
    .es-testi-row > * {
        flex: 0 0 auto;
        width: calc(33.333% - 0.67rem);
        max-width: none;
        min-width: 0;
        scroll-snap-align: none;
    }
}
