/* ===========================
   Woowind — Pixel-Perfect Port
   CSS ported from woowind.store
   =========================== */

/* ===== CSS VARIABLES (from their theme) ===== */
:root,
.color-default-color-scheme {
  /* Typography */
  --base-font-size: 17px;
  --base-font-weight: 300;
  --heading-font-weight: 600;
  --font-h1: 40px;
  --font-h2: 36px;
  --font-h3: 30px;
  --font-h4: 24px;

  --gradient-background: #ffffff;
  --base-color: 24,39,70;
  --base-body-bg-color: #ffffff;
  --border-color-base: #e5e5e5;
  --heading-color: #182746;
  --primary-color: #182746;
  --color-link: #182746;
  --color-link-hover: #d5f997;
  --btn-primary-bg: #d5f997;
  --btn-primary-color: #182746;
  --btn-primary-color-hover: #182746;
  --btn-primary-bg-hover: #ffffff;
  --btn-primary-border-hover: #111111;
  --btn-secondary-color: #182746;
  --btn-secondary-border-color: #111111;
  --btn-secondary-bg: rgba(0,0,0,0);
  --btn-secondary-color-hover: #ffffff;
  --btn-secondary-bg-hover: #111111;
  --btn-link-color: #182746;
  --btn-link-color-hover: #111111;
  --footer-background-color: #182746;
  --footer-heading-color: #ffffff;
  --footer-text-color: #ffffff;
  --footer-link-color: #ffffff;
  --footer-link-hover-color: #d5f997;
  --header-bg: #ffffff;
  --header-color: #182746;
  --header_border_color: #e5e5e5;
  --menu-color: #182746;
  --submenu-color: #182746;
  --submenu-hover-color: #d5f997;
  --grey-color: #666666;
}

/* Scheme b808185a — dark navy hero/video */
.color-scheme-b808185a-cae7-47ba-9fe9-7d81ddf7e485 {
  --gradient-background: #fdfdfd;
  --base-color: 255,255,255;
  --base-body-bg-color: #fdfdfd;
  --border-color-base: #ebebeb;
  --heading-color: #ffffff;
  --primary-color: #d5f997;
  --color-link: #111111;
  --color-link-hover: #111111;
  --btn-primary-bg: #d5f997;
  --btn-primary-color: #182746;
  --btn-primary-color-hover: #ffffff;
  --btn-primary-bg-hover: #111111;
  --btn-primary-border-hover: #111111;
  --footer-background-color: #fdfdfd;
  --footer-heading-color: #ffffff;
}

/* Scheme dc0c5238 — trust/Amazon section */
.color-scheme-dc0c5238-b545-4588-9239-32daeee99d47 {
  --gradient-background: #d5f997;
  --base-color: 17,17,17;
  --base-body-bg-color: #d5f997;
  --border-color-base: #ebebeb;
  --heading-color: #111111;
  --primary-color: #111111;
}

/* Scheme 013ccfbf — blog section */
.color-scheme-013ccfbf-beb5-42e6-bc8f-8a36ab634ca7 {
  --gradient-background: #f5f5f5;
  --base-body-bg-color: #f5f5f5;
  --heading-color: #111111;
}

/* Scheme a7934d7b — footer */
.color-scheme-a7934d7b-8af4-45c2-aba0-0f889cae386b {
  --gradient-background: #182746;
  --base-color: 255,255,255;
  --base-body-bg-color: #182746;
  --heading-color: #ffffff;
  --footer-background-color: #182746;
  --footer-heading-color: #ffffff;
  --footer-text-color: #ffffff;
  --footer-link-color: #ffffff;
  --footer-link-hover-color: #d5f997;
}

/* Announcement bar color */
.color-scheme-d127e173-a562-42f4-a41e-3483b672d918 {
  --gradient-background: #182746;
  --base-body-bg-color: #182746;
  --heading-color: #d5f997;
}

/* ===== RESET ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Kanit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: rgb(var(--base-color, 24,39,70));
  background: var(--base-body-bg-color, #ffffff);
  line-height: 1.6;
  font-size: 17px;
  font-weight: 300;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
ul, ol { list-style: none; }

/* ===== TYPOGRAPHY ===== */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Kanit', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 600;
  color: var(--heading-color);
  line-height: 1.2;
}
h1 { font-size: var(--font-h1, 40px); }
h2 { font-size: var(--font-h2, 36px); }
h3 { font-size: var(--font-h3, 30px); }
h4 { font-size: var(--font-h4, 24px); }
.h3 { font-size: 1.25rem; }

/* Paragraphs & body text */
p, li, span, div, td, th {
  font-family: 'Kanit', -apple-system, BlinkMacSystemFont, sans-serif;
}
p {
  font-size: var(--base-font-size, 17px);
  font-weight: var(--base-font-weight, 300);
}

/* ===== LAYOUT UTILITIES ===== */
.container { max-width: 1300px; margin: 0 auto; padding: 0 20px; }
.container-fluid { width: 100%; padding: 0 20px; }
.section-full { width: 100%; }
.full-width { width: 100%; }
.d-flex { display: flex; }
.d-inline-flex { display: inline-flex; }
.align-items-center { align-items: center; }
.justify-content-center { justify-content: center; }
.justify-content-between { justify-content: space-between; }
.justify-content-start { justify-content: flex-start; }
.flex-column { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.flex-1 { flex: 1; }
.gap-25 { gap: 25px; }
.relative { position: relative; }
.absolute { position: absolute; }
.inset-0 { top: 0; left: 0; right: 0; bottom: 0; }
.overflow-hidden { overflow: hidden; }
.z-1 { z-index: 1; }
.w-full { width: 100%; }
.h-full { height: 100%; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.uppercase { text-transform: uppercase; }
.whitespace-nowrap { white-space: nowrap; }
.inline-block { display: inline-block; }
.block { display: block; }
.p-30 { padding: 30px; }
.pt-30 { padding-top: 30px; }
.py-10 { padding-top: 10px; padding-bottom: 10px; }
.py-30 { padding-top: 30px; padding-bottom: 30px; }
.px-15 { padding-left: 15px; padding-right: 15px; }
.px-25 { padding-left: 25px; padding-right: 25px; }
.mb-0 { margin-bottom: 0; }
.mb-4 { margin-bottom: 4px; }
.mb-5 { margin-bottom: 5px; }
.mb-7 { margin-bottom: 7px; }
.mb-10 { margin-bottom: 10px; }
.mb-15 { margin-bottom: 15px; }
.mb-20 { margin-bottom: 20px; }
.mb-25 { margin-bottom: 25px; }
.mt-5 { margin-top: 5px; }
.mt-30 { margin-top: 30px; }
.mr-30 { margin-right: 30px; }
.mx-5 { margin-left: 5px; margin-right: 5px; }
.pt-15 { padding-top: 15px; }
.pb-15 { padding-bottom: 15px; }
.fs-13 { font-size: 13px; }
.fs-15 { font-size: 15px; }
.fs-18 { font-size: 18px; }
.fs-20 { font-size: 20px; }
.fs-22 { font-size: 22px; }
.fw-500 { font-weight: 500; }
.fw-600 { font-weight: 600; }
.lh-1 { line-height: 1; }
.regular { font-weight: 400; }
.capitalize { text-transform: capitalize; }
.opacity-0 { opacity: 0; }
.gradient { background: var(--gradient-background); }

/* ===== GRID (Bootstrap-like) ===== */
.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}
.row.gap-mobile { margin-right: -10px; margin-left: -10px; }
[class*="col-"] { padding-right: 15px; padding-left: 15px; box-sizing: border-box; }
.col-sm-4 { width: 33.333%; }
.col-md-4 { width: 100%; }
.col-md-6 { width: 100%; }
.col-xl-4 { width: 100%; }
.col-xl-2-5 { width: 100%; }
@media (min-width: 768px) {
  .col-md-4 { width: 33.333%; }
  .col-md-6 { width: 50%; }
  .col-md-3 { width: 25%; }
  .d-none-desktop { display: none !important; }
}
@media (min-width: 1025px) {
  .col-lg-4 { width: 33.333%; }
  .col-lg-6 { width: 50%; }
  .col-xl-4 { width: 33.333%; }
  .col-xl-2-5 { width: 20.833%; }
  .d-none { display: none !important; }
}

/* ===== ANNOUNCEMENT BAR ===== */
.announcement_bar {
  background: var(--gradient-background, #182746);
}
.announcement-bar {
  background: #182746;
  color: #d5f997;
}
.announcement-bar-content {
  color: #d5f997;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
}
.announcement-bar-content p {
  color: #d5f997;
  margin: 0;
}
.announcement-close {
  color: #d5f997;
  cursor: pointer;
  font-size: 14px;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}
.position-center-y { top: 50%; transform: translateY(-50%); }

/* ===== HEADER ===== */
#page-header {
  background: var(--header-bg, #ffffff);
  border-bottom: 1px solid var(--header_border_color, #e5e5e5);
  position: sticky;
  top: 0;
  z-index: 100;
}
.header-container { width: 100%; }
.header-middle { background: var(--header-bg, #ffffff); }
header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 50px;
  max-width: 1600px;
  width: 100%;
  margin: 0 auto;
  gap: 20px;
}
.col-header-left { flex: 0 0 auto; }
.col-header-center { flex: 1; display: flex; justify-content: center; padding-left: 0; }
.header__logo a { display: flex; align-items: center; }
.header__logo img { height: auto; width: 200px; max-height: 40px; object-fit: contain; }
.col-header-right { flex: 0 0 auto; display: flex; align-items: center; gap: 15px; }

/* Desktop nav */
.bls_main_menu .navigation {
  display: flex;
  align-items: center;
  gap: 0;
  list-style: none;
}
.bls_main_menu .navigation .level0 > a {
  padding: 6px 0;
  font-size: 17px;
  color: var(--menu-color, #182746);
  font-weight: 400;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: color 0.2s;
}
.bls_main_menu .navigation .level0 > a:hover {
  color: var(--color-link-hover, #d5f997);
}
.nav-toggle { display: none; background: none; border: none; cursor: pointer; font-size: 22px; color: var(--header-color, #182746); }
@media (max-width: 1024px) {
  .bls_main_menu { display: none; }
  .nav-toggle { display: block; }
}

/* Header actions (cart, search) */
.header-action-icons { display: flex; align-items: center; gap: 15px; }
.header-action-icons a, .header-action-icons button {
  color: var(--header-color, #182746);
  font-size: 20px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}

/* ===== BUTTONS ===== */
.btn-primary {
  background-color: #d5f997;
  color: #182746;
  border: 1px solid #d5f997;
  border-radius: 30px;
  padding: 12px 28px;
  font-family: 'Kanit', sans-serif;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0px;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
}
.btn-primary:hover {
  background: var(--btn-primary-bg-hover, #ffffff);
  color: var(--btn-primary-color-hover, #182746);
  border-color: var(--btn-primary-border-hover, #111111);
}
.btn-secondary {
  background: var(--btn-secondary-bg, transparent);
  color: var(--btn-secondary-color, #182746);
  border: 1px solid var(--btn-secondary-border-color, #111111);
  padding: 10px 20px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  text-decoration: none;
}
.btn-secondary:hover {
  background: var(--btn-secondary-bg-hover, #111111);
  color: var(--btn-secondary-color-hover, #ffffff);
}
.btn-link {
  color: var(--btn-link-color, #182746);
  font-size: 14px;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  transition: color 0.2s;
}
.btn-link:hover { color: var(--btn-link-color-hover, #111111); }
.button--full-width { width: 100%; }

/* ===== SECTION BASE ===== */
.bls__section {
  padding-top: var(--section-padding-top, 60px);
  padding-bottom: var(--section-padding-bottom, 60px);
}
.remove_spacing { /* controlled by inline vars */ }
.bls__section-header { margin-bottom: 30px; }
.bls__section-heading {
  font-size: var(--heading-font-size, 32px);
  font-weight: var(--heading-font-weight, 600);
  color: var(--heading-color, #182746);
  text-transform: var(--heading-transform, none);
  margin-top: var(--heading-mt, 0);
  margin-bottom: var(--heading-mb, 10px);
}
.bls__section-des {
  font-size: var(--desc-font-size, 16px);
  color: rgb(var(--base-color, 24,39,70));
  max-width: var(--content_width, 100%);
  margin: 0 auto;
}
.bls__section-subtext {
  font-size: var(--sub-font-size, 16px);
  font-weight: var(--sub-font-weight, 400);
  color: var(--heading-color, #182746);
  margin-bottom: var(--sub-spacing, 5px);
  display: block;
}
.bls__section-link { margin-top: 20px; }
.bls__section-button { display: inline-block; }

/* ===== HERO SLIDESHOW ===== */
.bls__slideshow .swiper-slide { position: relative; }
.slide-items {
  position: relative;
  min-height: var(--section-dk, 700px);
}
.sf-slider__link {
  display: block;
  position: absolute;
  inset: 0;
}
.slide-bg-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.slide-bg-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.bls__slide-content {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding: 60px;
  z-index: 2;
}
.bls__slide-content.left_position { justify-content: flex-start; }
.bls__slide-content.bottom_position { align-items: flex-end; }
.sf__slide-content { max-width: var(--content-width, 40%); }
.slide__block-subtitle {
  color: var(--heading-color, #d5f997);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.slide__block-title {
  color: var(--heading-color, #ffffff);
  line-height: 1.1;
}
.slide__block-description {
  color: rgba(255,255,255,0.85);
  font-size: 16px;
  margin-bottom: 24px;
}
.slide__block-description p { margin: 0; }
.slide__block-link { margin-top: 10px; }

/* Hero specific styles */
.bls__slideshow .slide-items {
  min-height: 700px;
  background: #182746;
}
.bls__slideshow picture { 
  position: absolute;
  inset: 0;
}
.bls__slideshow picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ventus-pro custom heading inside hero */
.ventus-pro { font-size: 56px; line-height: 1; }
.ventus-pro .bold { font-weight: 500; color: #ffffff; }
.ventus-pro .ultra-thin { font-weight: 100; color: #D5F997; }
@media (max-width: 768px) {
  .ventus-pro { font-size: 43px; }
}

/* ===== PRODUCT GRID / COLLECTION TAB ===== */
.bls__product {
  background: var(--gradient-background, #ffffff);
}
.bls__tab-heading { }
.bls__collection-tab { }
.tab-design-with-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 20px;
  gap: 12px;
}
.bls__collection-tab-item {
  display: inline-flex;
  align-items: center;
  padding: 8px 20px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  color: var(--heading-color, #182746);
  border-bottom: 2px solid transparent;
  transition: all 0.2s;
  white-space: nowrap;
}
.bls__collection-tab-item:hover {
  border-bottom: 2px solid #182746;
}
.bls__collection-tab-item.active {
  border-bottom: 3px solid #182746;
  padding-bottom: 8px;
  font-weight: 500;
}
.bls__cls-tab { display: none; }
.bls__cls-tab.active { display: block; }
.tab-header { display: flex; border-bottom: 1px solid var(--border-color-base, #e5e5e5); }

/* Product grid layout */
.bls__product-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}
@media (max-width: 1024px) { .bls__product-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px) { .bls__product-grid { grid-template-columns: repeat(2, 1fr); } }

/* Product swiper (we'll use CSS scroll) */
.bls__swiper-products {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
  overflow-x: auto;
  scrollbar-width: none;
}
.bls__swiper-products::-webkit-scrollbar { display: none; }
@media (max-width: 1024px) { .bls__swiper-products { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px) { .bls__swiper-products { grid-template-columns: repeat(2, 1fr); } }

/* Product item */
.bls__product-item { position: relative; }
.bls__product-img { position: relative; overflow: hidden; border-radius: 4px; }
.bls__product-img img { width: 100%; aspect-ratio: 1/1; object-fit: cover; transition: transform 0.3s; display: block; }
.bls__product-item:hover .bls__product-img img { transform: scale(1.04); }
.bls__product-details { padding-top: 12px; }
.bls__product-name {
  font-size: 14px;
  font-weight: 400;
  color: var(--heading-color, #182746);
  margin-bottom: 4px;
  line-height: 1.4;
  text-transform: capitalize;
}
.bls__product-name a { color: inherit; }
.bls__price { }
.bls__product-price { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px; }
.price__regular { font-size: 15px; font-weight: 600; color: var(--heading-color, #182746); }
.price__compare { font-size: 13px; color: var(--grey-color, #666); text-decoration: line-through; }
.bls__product-addtocart { margin-top: 10px; }

/* ===== RESPONSIVE IMAGES ===== */
.bls__responsive-image {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.bls__responsive-image[style*="aspect-ratio"] {
  /* The aspect ratio is encoded in CSS var --aspect-ratio */
}
.bls__responsive-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Specific aspect ratios via inline styles come through */

/* ===== CATEGORY BANNER STRIPS ===== */
.bls__banner-image .container { }
.bls__banner-item { padding: 10px; }
.bls__banner-inner { position: relative; }
.bls__banner-media { position: relative; overflow: hidden; }
.bls__banner-media img { width: 100%; object-fit: cover; display: block; transition: transform 0.3s; }
.hover-zoom:hover img { transform: scale(1.04); }
.hover-effect { transition: all 0.3s; }
.hover-fade-in:hover { opacity: 0.95; }
.radius { border-radius: 6px; overflow: hidden; }
.block-min-two { min-height: 100px; }
.bls__banner-content { }
.content-overlay-image {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}
.bls__banner-heading {
  font-size: var(--heading-font-size, 24px);
  font-weight: var(--custom-heading-font-weight, 500);
  color: var(--heading-color, #182746);
  margin-bottom: var(--heading-spacing, 10px);
}
.size-big .bls__banner-heading, .bls__banner-heading.size-big {
  font-size: var(--heading-font-size, 36px);
}
.bls__banner-text {
  font-size: var(--desc-font-size, 16px);
  margin-bottom: var(--desc-spacing, 20px);
}
.bls__banner-text p { margin: 0; }
.bls__banner-button { }
.bls__banner-btn { }
.content-below-image { padding: 20px 0; }

/* 3-column category strip (thin aspect) */
.bls__banner-image .col-lg-4 .bls__banner-media .bls__responsive-image {
  /* aspect ratio comes from inline style */
}

/* ===== VIDEO SECTION ===== */
.bls__video { background: var(--gradient-background); }
.bls__video-content { position: relative; }
.bls__video-thumb { }
.local-video {
  position: relative;
  height: var(--video-desktop-height, 650px);
  overflow: hidden;
}
.local-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 767px) {
  .local-video { height: var(--video-mobile-height, 450px); }
}
.bls__video-info {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2;
  background: rgba(0,0,0,0.3);
}
.bls__video-info-inner { padding: 30px 20px; }
.bls__video-info .bls__section-subtext { color: #d5f997; }
.bls__video-info .bls__section-heading { color: #ffffff; }
.bls__video-info .bls__section-link .btn-primary {
  --btn-primary-bg: #d5f997;
  --btn-primary-color: #182746;
}
.position-cb { position: absolute; bottom: 0; left: 0; right: 0; }
.full-width-content { width: 100%; }

/* ===== CUSTOM TEXT (Empowering) ===== */
.bls__section-custom-text .bls__section-header { }
.spt-mobile { }
.spt-tablet { }
.spb-mobile { }
.spb-tablet { }

/* ===== BANNER WITH TEXT (Amazon / Support) ===== */
.bls__banner-with-text { position: relative; }
.bls__banner-with-text-overlay { }
.banner-with-text-overplay { position: relative; }
.banner-position { overflow: hidden; }
.bls__banner-text--media { position: relative; overflow: hidden; }
.custom-height {
  height: var(--desktop-height, 450px);
}
@media (max-width: 767px) {
  .custom-height { height: var(--mobile-height, 380px); }
}
@media (max-width: 1024px) {
  .custom-height { height: var(--tablet-height, 350px); }
}
.bls__banner-text--content {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 30px;
}
.content-position-top { justify-content: flex-start !important; }
.content-position-bottom { justify-content: flex-end !important; }
.content-horizontal-position-left { align-items: flex-start; }
.bls__banner-text--content-inner {
  width: var(--content-width, 100%);
  max-width: 100%;
}
.bls__banner-text--heading {
  color: var(--heading-color, #182746);
  font-size: var(--text-heading-font-size, 28px);
  font-weight: var(--text-heading-font-weight, 500);
  text-transform: var(--text-heading-transform, none);
  margin-top: var(--text-heading-mt, 0);
  margin-bottom: var(--text-heading-mb, 10px);
  line-height: 1.1;
}
.bls__banner-text--des {
  font-size: var(--text-font-size, 16px);
  font-weight: var(--text-font-weight, 400);
  margin-top: var(--text-mt, 0);
  margin-bottom: var(--text-mb, 15px);
}
.bls__banner-text--des p { margin: 0; }
.bls__banner-text--button { display: inline-block; }
.ratio-mobile { }
.type-banner { position: relative; }

/* Amazon trust section */
.color-scheme-dc0c5238-b545-4588-9239-32daeee99d47 .bls__banner-text--heading,
.color-scheme-dc0c5238-b545-4588-9239-32daeee99d47 .bls__banner-text--des {
  color: #111111;
}

/* ===== GALLERY (Shop by Activity) ===== */
.bls__gallery .bls__gallery-content { }
.bls__gallery-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
}
@media (max-width: 1024px) { .bls__gallery-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 767px) { .bls__gallery-grid { grid-template-columns: repeat(2, 1fr); } }
.bls__gallery-item { overflow: hidden; border-radius: 6px; }
.bls__gallery-item a { display: block; }
.bls__gallery-item img { width: 100%; aspect-ratio: 1/1; object-fit: cover; transition: transform 0.3s; }
.bls__gallery-item:hover img { transform: scale(1.05); }

/* Press gallery */
.bls__gallery-press .bls__gallery-grid { 
  grid-template-columns: repeat(5, 1fr);
  align-items: center;
  gap: 50px;
}
@media (max-width: 1024px) { .bls__gallery-press .bls__gallery-grid { grid-template-columns: repeat(3, 1fr); gap: 30px; } }
@media (max-width: 767px) { .bls__gallery-press .bls__gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; } }
.bls__gallery-press img { width: 100%; object-fit: contain; }

/* ===== BLOG POSTS ===== */
.bls__blog { background: var(--gradient-background, #f5f5f5); }
.bls__blog-posts-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
@media (max-width: 1024px) { .bls__blog-posts-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .bls__blog-posts-grid { grid-template-columns: 1fr; } }
.bls__blog-posts-item { }
.bls__blog-posts-image { overflow: hidden; border-radius: 6px; position: relative; }
.bls__blog-posts-image img { width: 100%; aspect-ratio: 16/9; object-fit: cover; transition: transform 0.3s; display: block; }
.bls__blog-posts-image:hover img { transform: scale(1.04); }
.bls__blog-posts-category {
  position: absolute;
  top: 12px;
  left: 12px;
  background: #ffffff;
  color: #182746;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: 3px;
  z-index: 2;
}
.bls__blog-posts-category a { color: inherit; }
.blos__blog-posts-info { padding-top: 14px; }
.bls__blog-posts-bottom { display: flex; flex-wrap: wrap; align-items: center; }
.bls__blog-posts-author, .bls__blog-posts-date { font-size: 12px; text-transform: uppercase; color: var(--grey-color, #666); }
.bls__blog-posts-title { font-size: 18px; font-weight: 600; color: var(--heading-color, #182746); line-height: 1.3; }
.bls__blog-posts-title a { color: inherit; }
.bls__blog-posts-title a:hover { text-decoration: underline; }
.bls__blog-posts-content { font-size: 14px; color: var(--grey-color, #666); line-height: 1.5; }
.bls__blog-posts-content p { margin: 0; }
.blog-posts-readmore { color: var(--heading-color, #182746); font-size: 13px; font-weight: 500; text-decoration: underline; }
.heading-color { color: var(--heading-color, #182746); }

/* ===== ICON BOX (Trust badges) ===== */
.bls__shipping { background: var(--gradient-background, #ffffff); }
.bls__shipping-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
@media (max-width: 767px) { .bls__shipping-grid { grid-template-columns: 1fr; } }
.bls__section_shipping-inner { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.bls__section_shipping-image img { width: var(--icon-width, 40px); height: auto; margin: 0 auto; }
.bls__section_shipping-content h3 {
  font-size: var(--ib-heading-font-size, 20px);
  font-weight: var(--ib-heading-font-weight, 500);
  color: var(--heading-color, #182746);
  margin-bottom: var(--ib-spacing, 8px);
}
.ib-description { font-size: var(--ib-desc-font-size, 15px); color: var(--grey-color, #666); }
.ib-description p { margin: 0; }
.ib-description a { color: var(--heading-color, #182746); text-decoration: underline; }

/* ===== FOOTER ===== */
footer.footer {
  background: var(--footer-background-color, #182746);
  color: var(--footer-text-color, #ffffff);
}
.footer.has-bg { background: var(--footer-background-color, #182746); }
.bls__footer-middle { padding: 50px 0 30px; }
.bls__footer-logo img { width: 240px; height: auto; }
.bls__footer-infor { font-size: 14px; color: var(--footer-text-color, #ffffff); line-height: 1.6; }
.bls__footer-infor p { margin: 0; }
.bls__social-link { display: flex; gap: 20px; }
.bls__social-link a { 
  color: var(--footer-text-color, #ffffff); 
  font-size: 18px; 
  transition: color 0.2s;
  display: inline-flex;
  align-items: center;
}
.bls__social-link a:hover { color: var(--footer-link-hover-color, #d5f997); }
.bls__footer_block-title {
  font-size: var(--footer-heading-size, 18px);
  font-weight: 600;
  color: var(--footer-heading-color, #ffffff);
  margin-bottom: 15px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.bls__footer_block ul { display: flex; flex-direction: column; gap: 8px; }
.bls__footer_block ul a {
  color: var(--footer-link-color, #ffffff);
  font-size: 14px;
  transition: color 0.2s;
}
.bls__footer_block ul a:hover { color: var(--footer-link-hover-color, #d5f997); }
.bls__footer_block ul li { font-size: 14px; color: var(--footer-text-color, #ffffff); }
.bls__footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.15);
  padding: 20px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  color: var(--footer-text-color, #ffffff);
}
.bls__footer-bottom a { color: var(--footer-link-color, #ffffff); }
.bls__footer-bottom a:hover { color: var(--footer-link-hover-color, #d5f997); }
.footer-bottom-payment { display: flex; gap: 8px; flex-wrap: wrap; }
.payment-icon { 
  background: rgba(255,255,255,0.1); 
  color: #ffffff;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 600;
  border-radius: 4px;
  border: 1px solid rgba(255,255,255,0.2);
}
.footer-row {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
  gap: 30px;
  padding-bottom: 30px;
}
@media (max-width: 1024px) {
  .footer-row { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 767px) {
  .footer-row { grid-template-columns: 1fr; }
}

/* ===== SOCIAL ICONS (picon) ===== */
.picon-instagram::before { content: "📸"; font-size: 18px; }
.picon-youtube-1::before { content: "▶️"; font-size: 18px; }
.picon-facebook::before { content: "f"; font-size: 18px; font-style: normal; font-weight: 700; }
.picon-bag::before { content: "🛍"; }
.picon-menu::before { content: "☰"; }
.lnr-cross::before { content: "✕"; }
.lnr-chevron-right::before { content: "›"; }
.lnr-chevron-left::before { content: "‹"; }

/* Icon Font - use actual icons via unicode or font */
@font-face {
  font-family: 'linearicons-free';
  src: url('https://woowind.store/cdn/shop/t/14/assets/linearicons-free.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}
.lnr {
  font-family: 'linearicons-free', sans-serif;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
}

/* ===== SCROLLING TEXT ===== */
.bls__scrolling-text { overflow: hidden; }
.bls__scrolling-text-inner {
  display: flex;
  animation: scrollText var(--s-text-time, 20s) linear infinite;
  gap: var(--s-text-spacing, 50px);
}
@keyframes scrollText {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ===== SWIPER OVERRIDES ===== */
/* We render products in a flex row with overflow scroll */
.products-scroll-wrapper {
  width: 100%;
}
.products-scroll-inner {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
  width: 100%;
}
.products-scroll-inner .bls__product-item {
  width: 100%;
  min-width: 0;
}
@media (max-width: 1024px) {
  .products-scroll-inner {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 640px) {
  .products-scroll-inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}

/* Product card styling to match original */
.bls__product-item {
  background: transparent;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.bls__product-img {
  background: transparent;
  border-radius: 4px 4px 0 0;
}
.bls__product-details {
  padding: 12px 14px 14px;
}
.bls__product-addtocart {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
  transition: opacity 0.2s ease;
  padding: 10px;
  background: rgba(255,255,255,0.95);
}
.bls__product-item:hover .bls__product-addtocart {
  opacity: 1;
}
.bls__product-addtocart a {
  display: block;
  background: #182746;
  color: #fff;
  text-align: center;
  padding: 10px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  letter-spacing: 0.05em;
}

/* ===== MOBILE NAV ===== */
.mobile-nav-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 200;
}
.mobile-nav-overlay.open { display: block; }
.mobile-nav {
  position: fixed;
  top: 0;
  left: -100%;
  width: 280px;
  height: 100vh;
  background: #ffffff;
  z-index: 201;
  transition: left 0.3s;
  overflow-y: auto;
  padding: 20px;
}
.mobile-nav.open { left: 0; }
.mobile-nav-close { 
  display: flex; 
  justify-content: flex-end; 
  margin-bottom: 20px; 
  cursor: pointer;
  font-size: 22px;
  color: #182746;
}
.mobile-nav ul { list-style: none; }
.mobile-nav ul li { border-bottom: 1px solid #e5e5e5; }
.mobile-nav ul li a { 
  display: block; 
  padding: 14px 0; 
  font-size: 16px; 
  font-weight: 500; 
  color: #182746;
}

/* ===== UTILITY ===== */
.d-none { display: none !important; }
.d-md-flex { }
@media (min-width: 768px) { .d-none { display: block !important; } .d-md-flex { display: flex !important; } }
@media (max-width: 767px) { .d-none-mb { display: none !important; } }
.d-block { display: block !important; }
.d-inline-block { display: inline-block !important; }
.d-inline-flex { display: inline-flex !important; }
.d-block.d-md-none { display: block !important; }
@media (min-width: 768px) { .d-block.d-md-none, .d-md-none { display: none !important; } }
@media (min-width: 768px) { .header__mobile-logo { display: none !important; } }
@media (max-width: 767px) { .header__normal-logo { display: none !important; } }
.gap-mobile { gap: 10px; }
.section-padding { padding: var(--section-padding-top, 40px) 0 var(--section-padding-bottom, 40px); }

/* ===== LIMITED LINE CLAMP ===== */
.limited-line { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }

/* ===== SWIPER OVERRIDES ===== */
.swiper-pagination { }
.show-on-mobile { display: none; }
@media (max-width: 767px) { .show-on-mobile { display: block; } }
.swiper-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; width: 40px; height: 40px; background: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
.swiper-next { right: 10px; }
.swiper-prev { left: 10px; }
.swiper-button-next, .swiper-button-prev { width: 40px; height: 40px; background: #fff; border-radius: 50%; box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
.swiper-button-next::after, .swiper-button-prev::after { font-size: 14px; color: #182746; font-weight: 700; }

/* ===== UTILITY: top/left absolute positioning ===== */
.top-20 { top: 20px; }
.left-20 { left: 20px; }

/* ===== BLOG SWIPER STRUCTURE ===== */
.bls__blog-header { }
.bls__blog-posts-main { }
.bls__blog-posts-main .swiper { padding-bottom: 10px; }

/* ===== GALLERY SWIPER ===== */
.bls__gallery-content .swiper { overflow: hidden; }
.bls__gallery-content .bls__responsive-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bls__gallery-content .bls__responsive-image[style*="aspect-ratio: 1/1"] { aspect-ratio: 1/1; }
.bls__gallery-content .bls__responsive-image[style*="aspect-ratio: 2.666"] { aspect-ratio: 8/3; }
.bls__gallery-item .bls__responsive-image { border-radius: 6px; overflow: hidden; }

/* ===== RESPONSIVE TWEAKS ===== */
@media (max-width: 767px) {
  .bls__slide-content { padding: 30px 20px; }
  .sf__slide-content { max-width: 100%; }
  .bls__slideshow .slide-items { min-height: 650px; }
  .bls__banner-item { width: 100% !important; }
  .bls__banner-image .row { flex-direction: column; }
  .footer-row { grid-template-columns: 1fr; }
  .bls__blog-posts-grid { grid-template-columns: 1fr; }
  .bls__gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .bls__shipping-grid { grid-template-columns: 1fr; }
}

/* Fine-tuning to match original */
.header_search svg, .header__icon--account svg, .bls-minicart-action svg {
  width: 20px !important;
  height: 20px !important;
}
.cart-count {
  width: 16px;
  height: 16px;
  font-size: 10px;
}
.col-header-left {
  padding-left: 30px;
}
.header__normal-logo {
  width: 200px !important;
}
.header__mobile-logo {
  width: 185px !important;
}
.slide__block-link.btn-primary {
  padding: 14px 36px;
  font-size: 13px;
  letter-spacing: 0.12em;
  border-radius: 30px;
}
.header-middle {
  padding: 14px 0;
}
.slide__block-title .ventus-pro {
  font-size: 56px !important;
}
@media screen and (max-width: 768px) {
  .slide__block-title .ventus-pro {
    font-size: 43px !important;
  }
}

/* Final fine-tuning — header compact */
.header-middle {
  padding: 6px 0 !important;
}
.col-header-right {
  gap: 16px !important;
  padding-right: 0;
}

/* Product text sizing */
.bls__product-name a {
  font-size: 17px !important;
  font-weight: 300 !important;
}
.price__regular {
  font-size: 20px !important;
  font-weight: 500 !important;
}
/* Hero image positioning */
.slide-bg-image img {
  object-position: center 35% !important;
}

/* FORCE product grid images to correct size */
.bls__cls-tab .bls__product-main-img {
  width: 100%;
  aspect-ratio: 1/1;
  overflow: hidden;
  background: transparent;
  border-radius: 4px 4px 0 0;
}
.bls__cls-tab .bls__product-main-img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  aspect-ratio: 1/1 !important;
}
.bls__cls-tab .bls__product-item {
  background: transparent;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.bls__cls-tab .bls__product-img {
  position: relative;
  width: 100%;
}

/* ===== PRODUCT HOVER IMAGE SWAP ===== */
/* Matches original site's bls__hover-image mechanism */
.bls__product-img .bls__product-hover-img {
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}
.bls__product-img .bls__product-main-img {
  transition: opacity 0.3s ease;
}
.bls__hover-image:hover .bls__product-hover-img {
  opacity: 1;
}
.bls__hover-image:hover .bls__product-main-img {
  opacity: 0;
}

/* "Add to Cart" shows on hover (show__action-mobile pattern) */
.bls__product-addtocart {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(255,255,255,0.95);
  padding: 10px;
  transform: translateY(100%);
  transition: transform 0.25s ease;
  z-index: 5;
}
.bls__product-item:hover .bls__product-addtocart,
.show__action-mobile .bls__product-addtocart {
  transform: translateY(0);
}

/* Product img container must have overflow hidden for button slide */
.bls__product-img.overflow-hidden {
  overflow: hidden !important;
}

/* Hover image must fill parent exactly */
.bls__product-hover-img {
  width: 100%;
  height: 100%;
}
.bls__product-hover-img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Fix Add to Cart button style for hover panel */
.bls__product-addtocart .btn-secondary,
.bls__product-addtocart .button {
  width: 100%;
  display: block;
  text-align: center;
  font-size: 13px;
  padding: 10px;
  background: var(--btn-secondary-bg, transparent);
  color: var(--btn-secondary-color, #182746);
  border: 1px solid var(--btn-secondary-border-color, #111111);
  cursor: pointer;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  transition: background 0.2s, color 0.2s;
}
.bls__product-addtocart .btn-secondary:hover,
.bls__product-addtocart .button:hover {
  background: var(--btn-secondary-bg-hover, #111111);
  color: var(--btn-secondary-color-hover, #ffffff);
}

/* Product hover image swap */
.bls__product-hover-img {
  opacity: 0;
  position: absolute;
  inset: 0;
  transition: opacity 0.35s ease;
  z-index: 1;
}
.bls__product-hover-img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
.bls__product-item:hover .bls__product-hover-img {
  opacity: 1;
}
.bls__product-item:hover .bls__product-main-img img {
  transform: scale(1.04);
}

/* Add to cart button - appears on hover */
.btn-addtocart {
  display: block;
  background: #182746;
  color: #fff;
  text-align: center;
  padding: 12px;
  border-radius: 30px;
  font-size: 15px;
  font-weight: 400;
  text-decoration: none;
  letter-spacing: 0;
  text-transform: uppercase;
  transition: background 0.2s;
}
.btn-addtocart:hover {
  background: #0d1a33;
}

/* Desktop hide classes */
@media (min-width: 768px) { .d-none-desktop { display: none !important; } }

/* === FINAL PIXEL FIXES v10 === */

/* 1. Hide hamburger on desktop */
@media (min-width: 768px) {
  .nav-toggle { display: none !important; }
}

/* 2. Logo size — match original 200px desktop, 185px mobile */
.header__normal-logo {
  width: 200px !important;
}
.header__mobile-logo {
  width: 185px !important;
}

/* 3. Header right icons — closer to edge */
.col-header-right {
  margin-right: 0 !important;
  padding-right: 15px;
  gap: 10px !important;
}

/* 4. WOOWIND subtitle — wider letter-spacing */
.slide__block-subtitle {
  font-size: 14px !important;
  letter-spacing: 0.2em !important;
}

/* 5. Hero height — controlled by inline min-height: 700px */

/* 6. Category banner text — force white with strong shadow for contrast */
/* The content-overlay-image sits on top of the banner image */
.content-overlay-image .bls__banner-heading {
  color: #ffffff !important;
  text-shadow: 0 1px 6px rgba(0,0,0,0.75), 0 2px 12px rgba(0,0,0,0.5) !important;
}
/* Add dark gradient from bottom to help text legibility */
.bls__banner-media.radius ~ .bls__banner-content.content-overlay-image::before,
.content-overlay-image.bls__banner-content::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.15) 60%, transparent 100%);
  z-index: -1;
  pointer-events: none;
}

/* 7. Footer background — ensure dark navy */
footer.footer,
footer.footer.has-bg {
  background-color: #182746 !important;
  color: #ffffff !important;
}
.bls__footer-bottom {
  background-color: #182746 !important;
  color: rgba(255,255,255,0.8) !important;
}
.bls__footer_block-title {
  color: #ffffff !important;
}
.bls__footer_block ul a,
.bls__footer_block ul li {
  color: rgba(255,255,255,0.8) !important;
}
.bls__footer_block ul a:hover {
  color: #d5f997 !important;
}
.bls__footer-infor {
  color: rgba(255,255,255,0.8) !important;
}
.bls__social-link a {
  color: #ffffff !important;
}
.bls__social-link a:hover {
  color: #d5f997 !important;
}
.bls__footer-bottom .copyright p {
  color: rgba(255,255,255,0.7) !important;
}

/* 8. Header bottom border */
#page-header {
  border-bottom: 1px solid #e5e5e5 !important;
}

/* 9. Nav gap — match original 3.3rem col-gap */
/* Nav gap — removed !important override, inline style controls this */

/* Mega Menu */
.mega-menu-parent {
  position: relative;
}
.mega-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  box-shadow: 0 8px 30px rgba(0,0,0,0.12);
  padding: 30px;
  z-index: 100;
  min-width: 700px;
}
.mega-menu-parent:hover .mega-menu {
  display: block;
}
.mega-menu-inner {
  display: flex;
  gap: 30px;
  align-items: flex-start;
}
.mega-menu-image {
  flex: 0 0 200px;
}
.mega-menu-image img {
  width: 200px;
  height: 250px;
  object-fit: cover;
  border-radius: 8px;
}
.mega-menu-columns {
  display: flex;
  gap: 40px;
  flex: 1;
}
.mega-menu-column h3 {
  font-family: 'Kanit', sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: #182746;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: none;
}
.mega-menu-column ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.mega-menu-column li {
  margin-bottom: 8px;
}
.mega-menu-column a {
  font-family: 'Kanit', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #555;
  text-decoration: none;
  transition: color 0.2s;
}
.mega-menu-column a:hover {
  color: #182746;
}

/* Category banner text - Kanit, white, visible */
.bls__banner-heading {
  font-family: 'Kanit', sans-serif !important;
  color: #ffffff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,0.6) !important;
}

/* Sticky header */
#page-header {
  position: sticky;
  top: 0;
  z-index: 999;
  background: #ffffff;
}

/* Category strip cards — white with border + lime icon */
.category-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffffff;
  border: 1px solid #333;
  border-radius: 8px;
  padding: 18px 24px;
  text-decoration: none;
  transition: all 0.2s ease;
}
.category-card:hover {
  border-color: #d5f997;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.category-card-text {
  font-family: 'Kanit', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #182746;
}
.category-card-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: #182746;
  border-radius: 50%;
  flex-shrink: 0;
}
.category-card-icon svg {
  width: 20px;
  height: 20px;
}

/* Category banner links — image with text overlay */
.category-banner-link {
  transition: transform 0.2s ease;
}
.category-banner-link:hover {
  transform: scale(1.02);
}
.category-banner-text {
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-family: 'Kanit', sans-serif;
  font-size: 20px;
  font-weight: 500;
  color: #ffffff;
  text-shadow: 0 2px 6px rgba(0,0,0,0.5);
}

/* Category pills — white pill, lime green icon badge */
.category-pill {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 50px;
  padding: 12px 12px 12px 24px;
  text-decoration: none;
  transition: all 0.2s ease;
}
.category-pill:hover {
  border-color: #ccc;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.category-pill-text {
  font-family: 'Kanit', sans-serif;
  font-size: 15px;
  font-weight: 400;
  color: #182746;
}
.category-pill-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: #d5f997;
  border-radius: 50%;
  flex-shrink: 0;
  margin-left: 16px;
}
.category-pill-icon svg {
  width: 22px;
  height: 22px;
}