.elementor-906475 .elementor-element.elementor-element-e2de685{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-wc-categories .woocommerce .woocommerce-loop-category__title{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-wc-categories .woocommerce-loop-category__title .count{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-906475 .elementor-element.elementor-element-02a5d36 > .elementor-widget-container{padding:0px 50px 0px 50px;}.elementor-906475 .elementor-element.elementor-element-02a5d36.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-product__title{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price ins{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price ins .amount{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products{--products-title-color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.products-heading-show .related-products > h2, .elementor-widget-woocommerce-products.products-heading-show .upsells > h2, .elementor-widget-woocommerce-products.products-heading-show .cross-sells > h2{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del .amount{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del {font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products .added_to_cart{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-906475 .elementor-element.elementor-element-65b5984 > .elementor-widget-container{padding:0px 50px 0px 50px;}.elementor-906475 .elementor-element.elementor-element-65b5984.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-906475 .elementor-element.elementor-element-65b5984.elementor-wc-products ul.products li.product span.onsale{display:block;}@media(max-width:1024px){.elementor-906475 .elementor-element.elementor-element-65b5984.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(max-width:767px){.elementor-906475 .elementor-element.elementor-element-65b5984.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}/* Start custom CSS *//* =========================================================
   KOI HELLAS — HOMEPAGE
   FINAL RESPONSIVE CSS
========================================================= */

:root {
  --kh-ink: #08283b;
  --kh-navy: #002b3c;
  --kh-deep: #001a25;
  --kh-blue: #0a3e55;

  --kh-orange: #f05a3f;
  --kh-gold: #efa936;

  --kh-line: #d9e1e6;
  --kh-muted: #6f8290;

  --kh-bg: #f7f9fb;
  --kh-white: #ffffff;

  --kh-radius: 8px;

  --kh-shadow:
    0 14px 36px
    rgba(4, 34, 48, 0.12);

  --kh-font:
    "Inter",
    Arial,
    sans-serif;
}


/* =========================================================
   GLOBAL / OVERFLOW PROTECTION
========================================================= */

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

html {
  width: 100%;
  max-width: 100%;

  scroll-behavior: smooth;

  overflow-x: hidden;
  overflow-x: clip;
}

body {
  width: 100%;
  max-width: 100%;

  margin: 0;

  overflow-x: hidden;
  overflow-x: clip;

  background: var(--kh-bg);
  color: var(--kh-ink);

  font-family: var(--kh-font);

  font-size: 16px;
  line-height: 1.45;
}

a {
  color: inherit;

  text-decoration: none;
}

img,
picture,
video,
iframe {
  display: block;

  max-width: 100%;

  height: auto;
}

svg {
  max-width: 100%;
}

button,
input,
textarea,
select {
  max-width: 100%;

  font: inherit;
}


/*
 * Very important for Grid/Flex responsive layouts.
 * Allows children to shrink instead of increasing viewport width.
 */

.koi-homepage *,
.koi-homepage *::before,
.koi-homepage *::after {
  min-width: 0;
}


/* =========================================================
   HOMEPAGE ROOT
========================================================= */

.koi-homepage {
  position: relative;

  width: 100%;
  max-width: 100%;

  min-width: 0;

  overflow-x: hidden;
  overflow-x: clip;

  background:
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f7f9fb 55%,
      #ffffff 100%
    );
}


/* =========================================================
   CONTAINER
========================================================= */

.kh-shell {
  width:
    min(
      1128px,
      calc(100% - 72px)
    );

  max-width: 1128px;

  min-width: 0;

  margin:
    0
    auto;
}

/*
 * Some homepage sections use both .kh-section and .kh-shell
 * on the same element. This higher-specificity rule prevents
 * .kh-section { width: 100%; max-width: 100%; } from pushing
 * their content against the viewport edges.
 */
.kh-section.kh-shell {
  width:
    min(
      1128px,
      calc(100% - 72px)
    );

  max-width: 1128px;

  margin-left: auto;
  margin-right: auto;
}


/* =========================================================
   GENERAL TYPOGRAPHY
========================================================= */

.kh-eyebrow,
.kh-kicker {
  margin: 0;

  color:
    var(--kh-gold);

  font-size: 12px;
  font-weight: 900;

  letter-spacing: 1.6px;
}


/* =========================================================
   SECTIONS
========================================================= */

.kh-section {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  padding:
    18px
    0
    8px;
}

.kh-section__head {
  width: 100%;
  max-width: 100%;

  display: flex;

  align-items: flex-end;
  justify-content: space-between;

  gap: 32px;

  margin-bottom: 16px;
}

.kh-section__head > * {
  min-width: 0;
}

.kh-section__head h2 {
  margin:
    4px
    0
    0;

  color:
    var(--kh-ink);

  font-size: 28px;
  line-height: 1.05;

  font-weight: 900;

  overflow-wrap: break-word;
}


/* =========================================================
   LINKS
========================================================= */

.kh-link {
  max-width: 100%;

  display: inline-flex;

  align-items: center;

  gap: 12px;

  color:
    var(--kh-ink);

  font-size: 12px;
  font-weight: 900;

  letter-spacing: 0.8px;

  white-space: nowrap;

  transition:
    color 180ms ease,
    transform 180ms ease;
}

.kh-link:hover {
  color:
    var(--kh-orange);

  transform:
    translateX(3px);
}


/* =========================================================
   BUTTONS
========================================================= */

.kh-btn {
  max-width: 100%;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  min-height: 50px;

  padding:
    0
    22px;

  border-radius: 6px;

  font-size: 12px;
  font-weight: 900;

  letter-spacing: 0.3px;

  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease,
    border-color 180ms ease;
}

.kh-btn span {
  margin-left: 10px;

  font-size: 18px;
  line-height: 1;
}

.kh-btn--primary {
  color:
    var(--kh-white);

  background:
    linear-gradient(
      135deg,
      #ff694c,
      #e74230
    );

  box-shadow:
    0 12px 26px
    rgba(240, 90, 63, 0.24);
}

.kh-btn--primary:hover {
  transform:
    translateY(-2px);

  box-shadow:
    0 16px 30px
    rgba(240, 90, 63, 0.32);
}

.kh-btn--ghost {
  color:
    var(--kh-white);

  border:
    1px solid
    rgba(239, 169, 54, 0.8);

  background:
    rgba(2, 35, 50, 0.34);
}

.kh-btn--ghost:hover {
  border-color:
    var(--kh-white);

  background:
    rgba(255, 255, 255, 0.1);

  transform:
    translateY(-2px);
}


/* =========================================================
   CIRCLE BUTTON
========================================================= */

.kh-circle-btn {
  width: 30px;
  height: 30px;

  min-width: 30px;

  flex:
    0
    0
    30px;

  border:
    1px solid
    var(--kh-line);

  border-radius: 50%;

  color:
    var(--kh-ink);

  background:
    var(--kh-white);

  cursor: pointer;

  line-height: 1;

  transition:
    border-color 180ms ease,
    color 180ms ease,
    transform 180ms ease;
}

.kh-circle-btn:hover {
  border-color:
    var(--kh-orange);

  color:
    var(--kh-orange);

  transform:
    translateY(-1px);
}


/* =========================================================
   GENERIC GRID
========================================================= */

.kh-grid {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  display: grid;

  grid-template-columns:
    repeat(
      auto-fill,
      minmax(
        min(240px, 100%),
        1fr
      )
    );

  gap: 24px;
}


/* =========================================================
   ICON SYSTEM
========================================================= */

.kh-icon {
  display: inline-grid;

  place-items: center;

  color:
    currentColor;
}

.kh-icon::before {
  width: 1em;
  height: 1em;

  background:
    currentColor;

  content: "";

  -webkit-mask:
    var(--kh-icon)
    center /
    contain
    no-repeat;

  mask:
    var(--kh-icon)
    center /
    contain
    no-repeat;
}

.kh-icon--shield {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M12 3 20 6v5c0 5-3.2 8.5-8 10-4.8-1.5-8-5-8-10V6l8-3Z'/%3E%3Cpath d='M12 8v5l3 2'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--users {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8Z'/%3E%3Cpath d='M2.5 21v-2a6.5 6.5 0 0 1 13 0v2'/%3E%3Cpath d='M17 10.5a3.2 3.2 0 1 0-1.3-6.1'/%3E%3Cpath d='M17.5 14.2a5 5 0 0 1 4 4.8v2'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--box {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3 8 4-8 4-8-4 8-4Z'/%3E%3Cpath d='M4 7v9l8 5 8-5V7'/%3E%3Cpath d='M12 11v10'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--map {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.5 2.8c-2.2 1-3.8 2.7-4.5 4.9-.5 1.6.8 2.9 2.1 3.6-1.6.4-3.3 1.2-4.4 2.5-1 1.1-1.3 2.8.2 3.7 1.3.8 3 .7 4.3 1.4 1.6.9 1.6 2.2 1.2 3.4M9.7 5.5 5.5 9.7m13.4 2.1-3.1 3.7' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.kh-icon--star {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m12 2.8 2.8 6 6.5.8-4.8 4.5 1.3 6.4L12 17.2l-5.8 3.3 1.3-6.4-4.8-4.5 6.5-.8L12 2.8Z' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.kh-icon--badge {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='9' r='5.5'/%3E%3Cpath d='m8.5 14-1.2 6 4.7-2.7 4.7 2.7-1.2-6'/%3E%3Ccircle cx='12' cy='9' r='2.4'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--person {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7' r='3.2'/%3E%3Cpath d='M5.5 21v-1.5a6.5 6.5 0 0 1 13 0V21H5.5Z'/%3E%3Cpath d='M12 2v1.3M8.4 13.6 12 17l3.6-3.4'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--truck {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v10H3V6Zm11 3h3.8l3.2 3.5V16h-7V9Z'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3Ccircle cx='18' cy='18' r='2'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--headset {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13a8 8 0 0 1 16 0'/%3E%3Cpath d='M4 13v4a2 2 0 0 0 2 2h2v-6H4Zm16 0v4a2 2 0 0 1-2 2h-2v-6h4Z'/%3E%3Cpath d='M16 19c0 1.4-1.8 2.2-4 2.2'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--fish {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12c3.2-4.5 8.8-4.5 13.5 0-4.7 4.5-10.3 4.5-13.5 0Z'/%3E%3Cpath d='m17.5 12 3.5-3v6l-3.5-3Z'/%3E%3Ccircle cx='8.2' cy='11.1' r='.7'/%3E%3Cpath d='M11 8.8c1.2 1.8 1.2 4.6 0 6.4'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--filter {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='16' rx='2'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3Cpath d='M4 9h-2m20 0h-2M4 15h-2m20 0h-2'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--pump {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='13' cy='12' r='5'/%3E%3Cpath d='M3 12h5m10 0h3M13 7V4h4M13 17v3H9'/%3E%3Cpath d='M10.5 12h5'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--light {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='10' r='4.2'/%3E%3Cpath d='M9 16h6m-5 3h4M4 10H2m20 0h-2M5.6 3.6 4.2 2.2m15.6 0-1.4 1.4'/%3E%3C/g%3E%3C/svg%3E");
}

.kh-icon--food {
  --kh-icon:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 4h10l1.2 16H5.8L7 4Z'/%3E%3Cpath d='M8 8h8M9 12c2 1.4 4 1.4 6 0'/%3E%3Ccircle cx='10' cy='16' r='.8'/%3E%3Ccircle cx='14' cy='16' r='.8'/%3E%3C/g%3E%3C/svg%3E");
}


/* =========================================================
   HERO
========================================================= */

.kh-hero {
  position: relative;

  width: 100%;
  max-width: 100%;

  min-width: 0;
  min-height: 445px;

  overflow: hidden;

  color:
    var(--kh-white);

  isolation: isolate;
}

.kh-hero__media {
  position: absolute;

  inset: 0;

  z-index: -2;

  background:
    linear-gradient(
      90deg,
      rgba(3, 26, 39, 0.82) 0%,
      rgba(3, 26, 39, 0.68) 30%,
      rgba(3, 26, 39, 0.42) 52%,
      rgba(3, 26, 39, 0.12) 75%,
      rgba(3, 26, 39, 0) 100%
    ),
    url("https://www.koihellas.com/wp-content/uploads/2026/06/hero-koi.webp");

  background-position:
    center
    62%;

  background-repeat:
    no-repeat;

  background-size:
    cover;

  /*
   * Removed transform: scale(1.002)
   * because transformed full-width backgrounds can produce
   * fractional horizontal overflow.
   */
  transform: none;
}

.kh-hero__inner.kh-shell {
  width:
    min(
      1440px,
      calc(100% - 96px)
    );

  max-width: 1440px;

  margin-left: auto;
  margin-right: auto;

  min-width: 0;
  min-height: 445px;

  display: grid;

  grid-template-rows:
    minmax(0, 1fr)
    auto;

  padding:
    52px
    0
    35px;
}

.kh-hero__content {
  width: 100%;
  max-width: 485px;

  min-width: 0;
}

.kh-hero h1 {
  max-width: 100%;

  margin:
    9px
    0
    18px;

  color:
    var(--kh-white);

  font-size:
    clamp(
      42px,
      5.2vw,
      58px
    );

  line-height: 0.98;

  font-weight: 900;

  overflow-wrap: break-word;
}

.kh-hero__copy {
  width: 100%;
  max-width: 444px;

  margin:
    0
    0
    24px;

  color:
    rgba(255, 255, 255, 0.94);

  font-size: 15px;
  font-weight: 700;
}

.kh-hero__actions {
  width: 100%;
  max-width: 100%;

  display: flex;

  flex-wrap: wrap;

  gap: 14px;
}


/* =========================================================
   HERO STATS
========================================================= */

.kh-hero__stats {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  display: grid;

  /*
   * Previously:
   * repeat(4, max-content)
   *
   * max-content can force the grid outside its container.
   */
  grid-template-columns:
    repeat(
      4,
      minmax(0, 1fr)
    );

  align-items: center;

  gap: 0;
}

.kh-stat {
  width: 100%;

  min-width: 0;

  display: grid;

  grid-template-columns:
    34px
    minmax(0, 1fr);

  grid-template-rows:
    auto
    auto;

  column-gap: 12px;

  margin: 0;

  padding:
    0
    24px;

  border-right:
    1px solid
    rgba(255, 255, 255, 0.22);
}

.kh-stat:first-child {
  padding-left: 0;
}

.kh-stat:last-child {
  padding-right: 0;

  border-right: 0;
}

.kh-stat__icon {
  grid-row:
    1 / 3;

  color:
    var(--kh-gold);

  font-size: 31px;
  line-height: 1;
}

.kh-stat strong {
  min-width: 0;

  color:
    var(--kh-white);

  font-size: 24px;
  line-height: 1.03;

  font-weight: 900;
}

.kh-stat small {
  min-width: 0;

  color:
    var(--kh-white);

  font-size: 10px;
  line-height: 1.25;

  font-weight: 900;

  overflow-wrap: break-word;
}


/* =========================================================
   BRANDS
========================================================= */

.kh-brands {
  width: 100%;
  max-width: 100%;

  min-width: 0;
  min-height: 104px;

  display: flex;

  align-items: center;

  gap: 20px;

  padding:
    0
    22px;

  overflow: hidden;

  border-bottom:
    1px solid
    var(--kh-line);

  background:
    var(--kh-white);
}

.kh-brands__label {
  min-width: 190px;

  flex:
    0
    0
    190px;

  padding-right: 28px;

  border-right:
    1px solid
    var(--kh-line);

  color:
    var(--kh-ink);

  font-size: 12px;
  line-height: 1.4;

  font-weight: 900;
}


/*
 * Critical marquee overflow fix.
 */

.kh-brands__viewport {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  flex:
    1
    1
    0;

  overflow: hidden;
}

.kh-brands__track {
  width: max-content;

  max-width: none;

  display: flex;

  align-items: center;

  gap: 46px;

  will-change: transform;

  animation:
    kh-marquee
    26s
    linear
    infinite;
}

.kh-brand-logo {
  width: 138px;
  height: 48px;

  min-width: 138px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  flex:
    0
    0
    138px;

  text-align: center;
}

.kh-brand-logo img {
  display: block;

  width: auto;
  height: auto;

  max-width: 100%;
  max-height: 100%;

  object-fit: contain;
}

.kh-brand-logo__fallback {
  max-width: 100%;

  color:
    #111923;

  font-size: 21px;
  line-height: 0.96;

  font-weight: 900;

  white-space: nowrap;
}

.kh-brand-logo--superfish {
  width: 122px;
  min-width: 122px;

  flex-basis: 122px;
}

.kh-brand-logo--superfish img {
  max-height: 34px;
}

.kh-brand-logo--koipro {
  width: 118px;
  min-width: 118px;

  flex-basis: 118px;
}

.kh-brand-logo--koipro img {
  max-height: 32px;
}

.kh-brand-logo--takazumi {
  width: 112px;
  min-width: 112px;

  flex-basis: 112px;
}

.kh-brand-logo--takazumi img {
  max-height: 28px;
}

.kh-brand-logo--aquadistri {
  width: 126px;
  min-width: 126px;

  flex-basis: 126px;
}

.kh-brand-logo--aquadistri img {
  max-height: 34px;
}

.kh-brand-logo--mountaintree {
  width: 160px;
  min-width: 160px;

  flex-basis: 160px;
}

.kh-brand-logo--mountaintree img {
  max-height: 38px;
}

.kh-brand-logo--mantzaris {
  width: 198px;
  min-width: 198px;

  flex-basis: 198px;
}

.kh-brand-logo--mantzaris img {
  max-height: 36px;
}

.kh-brand-logo--filtreau {
  width: 122px;
  min-width: 122px;

  flex-basis: 122px;
}

.kh-brand-logo--filtreau img {
  max-height: 28px;
}

.kh-brand-logo--evolution {
  width: 134px;
  min-width: 134px;

  flex-basis: 134px;
}

.kh-brand-logo--evolution img {
  max-height: 32px;
}

.kh-brand-logo--aquaking {
  width: 150px;
  min-width: 150px;

  flex-basis: 150px;
}

.kh-brand-logo--aquaking img {
  max-height: 34px;
}

.kh-brand-logo--jks {
  width: 156px;
  min-width: 156px;

  flex-basis: 156px;
}

.kh-brand-logo--jks img {
  max-height: 40px;
}

.kh-brand-logo--koicompany {
  width: 150px;
  min-width: 150px;

  flex-basis: 150px;
}

.kh-brand-logo--koicompany img {
  max-height: 34px;
}


/* =========================================================
   BENEFITS
========================================================= */

.kh-benefits {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  overflow: hidden;

  background:
    var(--kh-bg);

  border-bottom:
    1px solid
    var(--kh-line);

  opacity: 1 !important;
  visibility: visible !important;

  transform: none !important;
}

.kh-benefits__inner {
  width:
    min(
      1128px,
      calc(100% - 72px)
    );

  max-width: 100%;

  min-width: 0;
  min-height: 130px;

  margin:
    0
    auto;

  display: grid;

  grid-template-columns:
    repeat(
      6,
      minmax(0, 1fr)
    );

  align-items: stretch;

  padding:
    28px
    0
    24px;
}

.kh-benefit {
  min-width: 0;
  min-height: 92px;

  display: flex !important;

  flex-direction: column;

  align-items: center;
  justify-content: flex-start;

  padding:
    0
    22px;

  text-align: center;

  border-right:
    1px solid
    var(--kh-line);

  opacity: 1 !important;
  visibility: visible !important;

  transform: none !important;
}

.kh-benefit:last-child {
  border-right: 0;
}

.kh-benefit__icon {
  width: 34px;
  height: 34px;

  min-width: 34px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  margin:
    0
    0
    11px;

  color:
    var(--kh-blue);
}

.kh-benefit__icon svg {
  width: 34px;
  height: 34px;

  display: block;

  fill: none;

  stroke:
    currentColor;

  stroke-width: 1.8;

  stroke-linecap: round;
  stroke-linejoin: round;
}

.kh-benefit span {
  color:
    var(--kh-blue);

  font-size: 34px;
  line-height: 1;
}

.kh-benefit h3 {
  max-width: 100%;

  margin:
    0
    0
    8px;

  color:
    var(--kh-ink);

  font-size: 12px;
  line-height: 1.2;

  font-weight: 900;

  overflow-wrap: break-word;
}

.kh-benefit p {
  max-width: 100%;

  margin: 0;

  color:
    #243c4d;

  font-size: 11px;
  line-height: 1.45;

  font-weight: 700;

  overflow-wrap: break-word;
}


/* =========================================================
   CATEGORY / PRODUCT RESPONSIVE GRID
========================================================= */

.kh-category-grid,
.kh-product-grid {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  display: grid;

  grid-template-columns:
    repeat(
      auto-fill,
      minmax(
        min(160px, 100%),
        1fr
      )
    );

  gap: 18px;
}

.kh-category-grid > *,
.kh-product-grid > * {
  min-width: 0;

  max-width: 100%;
}


/* =========================================================
   CATEGORY CARDS
========================================================= */

.kh-category-card {
  position: relative;

  width: 100%;
  max-width: 100%;

  min-width: 0;
  height: 100%;

  display: flex;

  flex-direction: column;

  overflow: hidden;

  border:
    1px solid
    var(--kh-line);

  border-radius:
    var(--kh-radius);

  background:
    var(--kh-white);

  box-shadow:
    0 8px 24px
    rgba(4, 34, 48, 0.06);

  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease;
}

.kh-category-card img {
  width: 100%;
  height: 120px;

  object-fit: cover;

  border-radius:
    7px
    7px
    0
    0;
}

.kh-category-card span {
  position: absolute;

  left: 10px;
  bottom: 12px;

  width: 45px;
  height: 45px;

  display: grid;

  place-items: center;

  border:
    1px solid
    var(--kh-line);

  border-radius: 50%;

  color:
    var(--kh-blue);

  background:
    var(--kh-white);

  font-size: 22px;

  box-shadow:
    0 6px 14px
    rgba(4, 34, 48, 0.09);

  z-index: 2;
}

.kh-category-card strong {
  min-width: 0;

  display: flex;

  align-items: center;

  flex-grow: 1;

  padding:
    12px
    8px
    12px
    65px;

  color:
    var(--kh-ink);

  font-size: 12px;
  line-height: 1.3;

  font-weight: 900;

  overflow-wrap: anywhere;
}

.kh-category-card:hover {
  border-color:
    rgba(240, 90, 63, 0.42);

  box-shadow:
    var(--kh-shadow);

  transform:
    translateY(-4px);
}


/* =========================================================
   PRODUCT CARDS
========================================================= */

.kh-product-card {
  position: relative;

  width: 100%;
  max-width: 100%;

  min-width: 0;
  height: 100%;

  display: flex;

  flex-direction: column;

  padding: 12px;

  overflow: hidden;

  border:
    1px solid
    var(--kh-line);

  border-radius:
    var(--kh-radius);

  background:
    var(--kh-white);

  box-shadow:
    0 8px 24px
    rgba(4, 34, 48, 0.05);

  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease;
}

.kh-product-card img {
  width: 100%;
  height: 100px;

  margin-bottom: 12px;

  object-fit: contain;
}

.kh-product-card h3 {
  min-width: 0;

  flex-grow: 1;

  margin:
    0
    0
    10px;

  color:
    var(--kh-ink);

  font-size: 12px;
  line-height: 1.3;

  font-weight: 900;

  display:
    -webkit-box;

  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;

  overflow: hidden;

  overflow-wrap: anywhere;
}

.kh-product-card strong {
  max-width: 100%;

  display: block;

  margin-bottom: 4px;

  color:
    var(--kh-ink);

  font-size: 17px;
  line-height: 1;

  font-weight: 900;
}

.kh-product-card button {
  position: absolute;

  right: 12px;
  bottom: 12px;

  width: 30px;
  height: 30px;

  min-width: 30px;

  display: grid;

  place-items: center;

  border: 0;
  border-radius: 4px;

  color:
    var(--kh-white);

  background:
    var(--kh-navy);

  cursor: pointer;

  transition:
    background 180ms ease,
    transform 180ms ease;
}

.kh-product-card:hover {
  border-color:
    rgba(240, 90, 63, 0.36);

  box-shadow:
    var(--kh-shadow);

  transform:
    translateY(-4px);
}

.kh-product-card:hover button {
  background:
    var(--kh-orange);

  transform:
    scale(1.05);
}

.kh-product-card.is-added button {
  background:
    var(--kh-orange);

  transform:
    scale(1.12);
}


/* =========================================================
   DOTS
========================================================= */

.kh-dots {
  width: 100%;

  display: flex;

  justify-content: center;

  gap: 15px;

  padding:
    18px
    0
    12px;
}

.kh-dots span {
  width: 8px;
  height: 8px;

  min-width: 8px;

  border-radius: 50%;

  background:
    #cdd5dc;
}

.kh-dots .is-active {
  background:
    var(--kh-orange);
}


/* =========================================================
   TRUST
========================================================= */

.kh-trust {
  width: 100%;
  max-width: 100%;

  padding:
    6px
    0
    15px;
}

.kh-trust__inner {
  width: 100%;
  max-width: 100%;

  min-width: 0;
  min-height: 132px;

  display: grid;

  grid-template-columns:
    minmax(0, 1.08fr)
    minmax(0, 1.12fr)
    minmax(0, 1.12fr)
    minmax(0, 1.12fr)
    minmax(0, 1.38fr)
    minmax(0, 1.12fr);

  align-items: center;

  gap: 0;

  padding:
    24px
    26px;

  overflow: hidden;

  border-radius: 8px;

  color:
    var(--kh-white);

  background:
    radial-gradient(
      circle at 10% 20%,
      rgba(3, 78, 101, 0.92),
      transparent 42%
    ),
    linear-gradient(
      135deg,
      #002234,
      #01384d 52%,
      #002234
    );

  box-shadow:
    0 12px 28px
    rgba(2, 35, 50, 0.22);
}

.kh-trust__inner > p {
  min-width: 0;

  align-self: center;

  margin: 0;

  padding:
    0
    22px
    0
    0;

  color:
    var(--kh-gold);

  font-size: 12px;
  font-weight: 900;

  letter-spacing: 1.5px;

  text-align: right;

  overflow-wrap: anywhere;
}

.kh-trust article {
  min-width: 0;
  min-height: 58px;

  display: grid;

  grid-template-columns:
    38px
    minmax(0, 1fr);

  grid-template-rows:
    auto
    auto;

  column-gap: 13px;

  padding-left: 22px;

  border-left:
    1px solid
    rgba(255, 255, 255, 0.18);
}

.kh-trust article > .kh-icon {
  grid-row:
    1 / 3;

  color:
    var(--kh-gold);

  font-size: 31px;
  line-height: 1;
}

.kh-trust strong {
  min-width: 0;

  font-size: 21px;
  line-height: 1.08;

  font-weight: 900;

  overflow-wrap: break-word;
}

.kh-trust article:nth-of-type(2) strong,
.kh-trust article:nth-of-type(3) strong {
  color:
    var(--kh-gold);
}

.kh-trust small {
  min-width: 0;

  color:
    rgba(255, 255, 255, 0.9);

  font-size: 11px;
  line-height: 1.22;

  font-weight: 700;

  overflow-wrap: break-word;
}


/* =========================================================
   REVIEWS
========================================================= */

.kh-reviews {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  padding-top: 10px;
}

.kh-google-rating {
  width: 100%;
  max-width: 100%;

  min-width: 0;
  min-height: 25px;

  display: flex;

  flex-wrap: wrap;

  align-items: center;
  justify-content: flex-end;

  gap: 10px;

  margin:
    -7px
    0
    15px;

  transform: none;
}

.kh-google-rating span {
  font-size: 25px;
  font-weight: 800;
}

.kh-google-rating span::first-letter {
  color:
    #4285f4;
}

.kh-google-rating b {
  color:
    var(--kh-gold);

  font-size: 18px;

  letter-spacing: 2px;
}

.kh-google-rating strong {
  font-size: 17px;
  font-weight: 900;
}

.kh-review-wrap {
  position: relative;

  width: 100%;
  max-width: 100%;

  min-width: 0;

  display: flex;

  align-items: center;

  gap: 12px;
}

.kh-review-track {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  display: grid;

  grid-template-columns:
    repeat(
      4,
      minmax(0, 1fr)
    );

  gap: 16px;
}

.kh-review-card {
  width: 100%;
  max-width: 100%;

  min-width: 0;
  min-height: 162px;

  padding:
    18px
    18px
    15px;

  overflow: hidden;

  border:
    1px solid
    var(--kh-line);

  border-radius:
    var(--kh-radius);

  background:
    var(--kh-white);

  box-shadow:
    0 8px 24px
    rgba(4, 34, 48, 0.05);
}

.kh-review-card h3 {
  min-width: 0;

  display: flex;

  align-items: center;

  gap: 11px;

  margin:
    0
    0
    12px;

  color:
    var(--kh-gold);

  font-size: 14px;

  letter-spacing: 2px;
}

.kh-review-card h3 span {
  flex:
    0
    0
    auto;

  color:
    #4285f4;

  font-size: 22px;

  letter-spacing: 0;
}

.kh-review-card p {
  margin:
    0
    0
    17px;

  color:
    #243c4d;

  font-size: 12px;
  line-height: 1.42;

  font-weight: 600;

  overflow-wrap: anywhere;
}

.kh-review-card footer {
  min-width: 0;

  display: grid;

  grid-template-columns:
    28px
    minmax(0, 1fr);

  column-gap: 10px;
}

.kh-review-card i {
  grid-row:
    1 / 3;

  width: 28px;
  height: 28px;

  min-width: 28px;

  border-radius: 50%;

  background:
    linear-gradient(
      135deg,
      #183c4f,
      #e09f42
    );
}

.kh-review-card strong,
.kh-review-card small {
  min-width: 0;

  display: block;

  font-size: 10px;
  line-height: 1.25;

  overflow-wrap: anywhere;
}

.kh-review-card strong {
  color:
    var(--kh-ink);

  font-weight: 900;
}

.kh-review-card small {
  color:
    var(--kh-muted);

  font-weight: 700;
}


/* Slider arrows */

.kh-slider-prev {
  position: absolute;

  left: -42px;
}

.kh-slider-next {
  position: absolute;

  right: -42px;
}


/* =========================================================
   EXPERT CTA
========================================================= */

.kh-expert {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  padding:
    18px
    0
    30px;
}

.kh-expert__inner {
  width: 100%;
  max-width: 100%;

  min-width: 0;
  min-height: 147px;

  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(0, 390px);

  gap: 40px;

  align-items: center;

  padding:
    25px
    31px;

  overflow: hidden;

  border-radius: 8px;

  color:
    var(--kh-white);

  background:
    linear-gradient(
      90deg,
      rgba(0, 28, 42, 0.98) 0%,
      rgba(0, 38, 55, 0.84) 42%,
      rgba(0, 38, 55, 0.48) 100%
    ),
    url("https://www.koihellas.com/wp-content/uploads/2026/06/expert-koi-cta.webp")
    center 54% /
    cover
    no-repeat;

  box-shadow:
    0 14px 34px
    rgba(2, 35, 50, 0.18);
}

.kh-expert__inner > * {
  min-width: 0;
}

.kh-expert h2 {
  max-width: 100%;

  margin:
    0
    0
    8px;

  color:
    var(--kh-white);

  font-size: 28px;
  line-height: 1.05;

  font-weight: 900;

  overflow-wrap: break-word;
}

.kh-expert p {
  width: 100%;
  max-width: 560px;

  margin:
    0
    0
    17px;

  color:
    rgba(255, 255, 255, 0.92);

  font-size: 13px;

  font-weight: 700;

  overflow-wrap: break-word;
}

.kh-expert .kh-btn {
  min-height: 41px;

  padding:
    0
    19px;

  color:
    var(--kh-white);
}

.kh-expert__features {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  display: grid;

  grid-template-columns:
    repeat(
      3,
      minmax(0, 1fr)
    );

  overflow: hidden;

  background:
    rgba(1, 39, 56, 0.72);

  border-radius: 7px;
}

.kh-expert__features article {
  min-width: 0;
  min-height: 101px;

  display: flex;

  flex-direction: column;

  align-items: center;
  justify-content: center;

  gap: 11px;

  padding: 12px;

  border-left:
    1px solid
    rgba(255, 255, 255, 0.16);

  text-align: center;
}

.kh-expert__features article:first-child {
  border-left: 0;
}

.kh-expert__features span {
  width: 43px;
  height: 43px;

  min-width: 43px;

  display: grid;

  place-items: center;

  border:
    1px solid
    var(--kh-gold);

  border-radius: 50%;

  color:
    var(--kh-gold);

  font-size: 21px;
}

.kh-expert__features strong {
  width: 100%;
  max-width: 96px;

  font-size: 11px;
  line-height: 1.25;

  font-weight: 800;

  overflow-wrap: break-word;
}


/* =========================================================
   ANIMATIONS
========================================================= */

.fade-in {
  opacity: 1;

  transform: none;

  transition:
    opacity 650ms ease,
    transform 650ms ease;
}

.fade-in.is-visible {
  opacity: 1;

  transform:
    translateY(0);
}

@keyframes kh-marquee {

  from {
    transform:
      translate3d(
        0,
        0,
        0
      );
  }

  to {
    transform:
      translate3d(
        -50%,
        0,
        0
      );
  }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    scroll-behavior:
      auto !important;

    animation-duration:
      1ms !important;

    animation-iteration-count:
      1 !important;

    transition-duration:
      1ms !important;
  }

  .fade-in {
    opacity: 1;

    transform: none;
  }

  .kh-brands__track {
    animation: none;
  }
}


/* =========================================================
   DESKTOP >= 1200
========================================================= */

@media (min-width: 1200px) {

  .kh-category-grid,
  .kh-product-grid {
    grid-template-columns:
      repeat(
        6,
        minmax(0, 1fr)
      );
  }
}


/* =========================================================
   <= 1280px
========================================================= */

@media (max-width: 1280px) {

  .kh-hero__inner.kh-shell {
    width:
      calc(100% - 48px);

    max-width: none;
  }

  .kh-shell,
  .kh-section.kh-shell {
    width:
      min(
        1128px,
        calc(100% - 48px)
      );
  }

  .kh-hero__stats {
    grid-template-columns:
      repeat(
        4,
        minmax(0, 1fr)
      );
  }

  .kh-stat {
    margin: 0;

    padding:
      0
      18px;
  }

  .kh-stat:first-child {
    padding-left: 0;
  }

  .kh-stat:last-child {
    padding-right: 0;
  }

  .kh-brands__track {
    gap: 42px;
  }


  /*
   * Keep slider arrows inside the viewport.
   */

  .kh-slider-prev {
    left: -16px;
  }

  .kh-slider-next {
    right: -16px;
  }
}


/* =========================================================
   <= 1024px
========================================================= */

@media (max-width: 1024px) {

  .kh-hero {
    min-height: 520px;
  }

  .kh-hero__media {
    background-position:
      center
      64%;
  }

  .kh-hero__inner {
    min-height: 520px;

    padding-top: 46px;
  }

  .kh-hero__stats {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );

    row-gap: 18px;
  }

  .kh-stat {
    padding:
      0
      20px;
  }

  .kh-stat:first-child,
  .kh-stat:nth-child(3) {
    padding-left: 0;
  }

  .kh-stat:nth-child(2),
  .kh-stat:last-child {
    padding-right: 0;

    border-right: 0;
  }


  /* Brands */

  .kh-brands {
    min-height: 96px;

    gap: 14px;
  }

  .kh-brands__label {
    min-width: 160px;

    flex-basis: 160px;

    padding-right: 18px;
  }


  /* Benefits */

  .kh-benefits__inner {
    width:
      min(
        1128px,
        calc(100% - 48px)
      );

    grid-template-columns:
      repeat(
        3,
        minmax(0, 1fr)
      );

    row-gap: 22px;
  }

  .kh-benefit:nth-child(3),
  .kh-benefit:nth-child(6) {
    border-right: 0;
  }


  /* Categories / products */

  .kh-category-grid,
  .kh-product-grid {
    grid-template-columns:
      repeat(
        3,
        minmax(0, 1fr)
      );
  }


  /* Trust */

  .kh-trust__inner {
    grid-template-columns:
      repeat(
        3,
        minmax(0, 1fr)
      );

    gap:
      18px
      0;
  }

  .kh-trust__inner > p {
    grid-column:
      1 / -1;

    padding-right: 0;

    text-align: left;
  }

  .kh-trust article:nth-of-type(1),
  .kh-trust article:nth-of-type(4) {
    padding-left: 0;

    border-left: 0;
  }


  /* Reviews */

  .kh-review-track {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  /* Expert */

  .kh-expert__inner {
    grid-template-columns:
      minmax(0, 1fr);

    gap: 24px;
  }
}


/* =========================================================
   <= 768px
========================================================= */

@media (max-width: 768px) {

  .kh-hero__inner.kh-shell {
    width:
      calc(100% - 32px);

    max-width: none;
  }

  .kh-shell,
  .kh-section.kh-shell {
    width:
      min(
        calc(100% - 32px),
        680px
      );
  }


  /* Sections */

  .kh-section {
    padding-top: 26px;
  }

  .kh-section__head {
    flex-direction: column;

    align-items: flex-start;

    gap: 12px;
  }

  .kh-section__head h2 {
    font-size: 25px;
  }

  .kh-link {
    white-space: normal;
  }


  /* =====================================================
     HERO MOBILE
  ===================================================== */

  .kh-hero {
    min-height: 680px;
  }

  .kh-hero__media {
    background-position:
      62%
      66%;
  }

  .kh-hero__inner {
    min-height: 680px;

    padding:
      40px
      0
      28px;
  }

  .kh-hero h1 {
    font-size: 43px;
  }

  .kh-hero__copy {
    font-size: 14px;
  }

  .kh-hero__actions {
    max-width: 340px;

    flex-direction: column;

    align-items: stretch;
  }

  .kh-hero__stats {
    grid-template-columns:
      minmax(0, 1fr);

    gap: 14px;
  }

  .kh-stat,
  .kh-stat:nth-child(2),
  .kh-stat:nth-child(3),
  .kh-stat:last-child {
    padding:
      0
      0
      14px;

    border-right: 0;

    border-bottom:
      1px solid
      rgba(255, 255, 255, 0.18);
  }

  .kh-stat:last-child {
    padding-bottom: 0;

    border-bottom: 0;
  }


  /* =====================================================
     BRANDS MOBILE
  ===================================================== */

  .kh-brands {
    padding:
      18px
      16px;
  }

  .kh-brands__label {
    display: none;
  }

  .kh-brands__viewport {
    width: 100%;

    min-width: 0;
  }

  .kh-brands__track {
    gap: 34px;
  }


  /* =====================================================
     BENEFITS MOBILE
  ===================================================== */

  .kh-benefits__inner {
    width:
      min(
        calc(100% - 32px),
        680px
      );

    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );

    padding-top: 28px;
  }

  .kh-benefit,
  .kh-benefit:nth-child(3) {
    border-right: 0;
  }

  .kh-benefit:nth-child(odd) {
    border-right:
      1px solid
      var(--kh-line);
  }


  /* =====================================================
     PRODUCT / CATEGORY GRID MOBILE
  ===================================================== */

  .kh-category-grid,
  .kh-product-grid {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  /* =====================================================
     TRUST MOBILE
  ===================================================== */

  .kh-trust__inner {
    grid-template-columns:
      minmax(0, 1fr);

    padding:
      24px
      22px;
  }

  .kh-trust article,
  .kh-trust article:nth-of-type(1),
  .kh-trust article:nth-of-type(4) {
    padding-left: 0;

    border-left: 0;
  }


  /* =====================================================
     RATING MOBILE
  ===================================================== */

  .kh-google-rating {
    justify-content: flex-start;

    height: auto;

    margin:
      -4px
      0
      14px;
  }


  /* =====================================================
     REVIEWS MOBILE
  ===================================================== */

  .kh-review-wrap {
    width: 100%;

    display: block;

    overflow: hidden;
  }

  .kh-review-track {
    width: 100%;
    max-width: 100%;

    display: flex;

    gap: 14px;

    overflow-x: auto;
    overflow-y: hidden;

    padding-bottom: 4px;

    scroll-snap-type:
      x mandatory;

    overscroll-behavior-inline:
      contain;

    scrollbar-width:
      none;

    -webkit-overflow-scrolling:
      touch;
  }

  .kh-review-track::-webkit-scrollbar {
    display: none;
  }

  .kh-review-card {
    width: auto;

    min-width: 0;

    flex:
      0
      0
      82%;

    scroll-snap-align:
      start;
  }

  .kh-slider-prev,
  .kh-slider-next {
    display: none;
  }


  /* =====================================================
     EXPERT MOBILE
  ===================================================== */

  .kh-expert__inner {
    padding:
      24px
      20px;
  }

  .kh-expert__features {
    grid-template-columns:
      minmax(0, 1fr);
  }

  .kh-expert__features article {
    min-height: 82px;

    border-left: 0;

    border-top:
      1px solid
      rgba(255, 255, 255, 0.16);
  }

  .kh-expert__features article:first-child {
    border-top: 0;
  }
}


/* =========================================================
   <= 480px
========================================================= */

@media (max-width: 480px) {

  .kh-hero__inner.kh-shell {
    width:
      calc(100% - 24px);
  }

  .kh-shell,
  .kh-section.kh-shell {
    width:
      min(
        calc(100% - 24px),
        430px
      );
  }


  /* Buttons */

  .kh-btn {
    width: 100%;

    min-height: 48px;

    padding:
      0
      16px;

    font-size: 11px;
  }


  /* Hero */

  .kh-hero {
    min-height: 720px;
  }

  .kh-hero__media {
    background-position:
      62%
      70%;
  }

  .kh-hero__inner {
    min-height: 720px;

    padding-top: 34px;
  }

  .kh-hero h1 {
    font-size:
      clamp(
        34px,
        10vw,
        38px
      );
  }


  /* Brands */

  .kh-brands {
    min-height: 82px;
  }


  /* Circle buttons */

  .kh-circle-btn {
    width: 28px;
    height: 28px;

    min-width: 28px;

    flex-basis: 28px;
  }


  /* Custom grids */

  .kh-benefits__inner,
  .kh-category-grid,
  .kh-product-grid {
    grid-template-columns:
      minmax(0, 1fr);
  }


  /* Benefits */

  .kh-benefit:nth-child(odd) {
    border-right: 0;
  }

  .kh-benefit {
    min-height: auto;

    padding:
      0
      6px
      22px;

    border-bottom:
      1px solid
      var(--kh-line);
  }

  .kh-benefit:last-child {
    border-bottom: 0;
  }


  /* Categories */

  .kh-category-card {
    min-height: 156px;
  }

  .kh-category-card img {
    height: 116px;
  }


  /* Products */

  .kh-product-card {
    min-height: 202px;
  }

  .kh-product-card img {
    height: 104px;
  }


  /* Reviews */

  .kh-review-card {
    flex-basis: 92%;
  }


  /* Rating */

  .kh-google-rating {
    gap: 7px;
  }


  /* Expert */

  .kh-expert h2 {
    color:
      var(--kh-white);

    font-size: 25px;
  }
}


/* =========================================================
   BRAND LOGOS <= 1024
========================================================= */

@media (max-width: 1024px) {

  .kh-brand-logo {
    width: 122px;
    min-width: 122px;

    height: 44px;

    flex-basis: 122px;
  }

  .kh-brand-logo--superfish {
    width: 108px;
    min-width: 108px;

    flex-basis: 108px;
  }

  .kh-brand-logo--koipro {
    width: 106px;
    min-width: 106px;

    flex-basis: 106px;
  }

  .kh-brand-logo--takazumi {
    width: 98px;
    min-width: 98px;

    flex-basis: 98px;
  }

  .kh-brand-logo--aquadistri {
    width: 114px;
    min-width: 114px;

    flex-basis: 114px;
  }

  .kh-brand-logo--mountaintree {
    width: 140px;
    min-width: 140px;

    flex-basis: 140px;
  }

  .kh-brand-logo--mantzaris {
    width: 174px;
    min-width: 174px;

    flex-basis: 174px;
  }

  .kh-brand-logo--filtreau {
    width: 112px;
    min-width: 112px;

    flex-basis: 112px;
  }

  .kh-brand-logo--evolution {
    width: 122px;
    min-width: 122px;

    flex-basis: 122px;
  }

  .kh-brand-logo--aquaking {
    width: 134px;
    min-width: 134px;

    flex-basis: 134px;
  }

  .kh-brand-logo--jks {
    width: 144px;
    min-width: 144px;

    flex-basis: 144px;
  }

  .kh-brand-logo--koicompany {
    width: 136px;
    min-width: 136px;

    flex-basis: 136px;
  }
}


/* =========================================================
   BRAND LOGOS <= 480
========================================================= */

@media (max-width: 480px) {

  .kh-brands__track {
    gap: 26px;
  }

  .kh-brand-logo {
    width: 108px;
    min-width: 108px;

    height: 38px;

    flex-basis: 108px;
  }

  .kh-brand-logo--superfish {
    width: 96px;
    min-width: 96px;

    flex-basis: 96px;
  }

  .kh-brand-logo--koipro {
    width: 94px;
    min-width: 94px;

    flex-basis: 94px;
  }

  .kh-brand-logo--takazumi {
    width: 86px;
    min-width: 86px;

    flex-basis: 86px;
  }

  .kh-brand-logo--aquadistri {
    width: 100px;
    min-width: 100px;

    flex-basis: 100px;
  }

  .kh-brand-logo--mountaintree {
    width: 124px;
    min-width: 124px;

    flex-basis: 124px;
  }

  .kh-brand-logo--mantzaris {
    width: 148px;
    min-width: 148px;

    flex-basis: 148px;
  }

  .kh-brand-logo--filtreau {
    width: 98px;
    min-width: 98px;

    flex-basis: 98px;
  }

  .kh-brand-logo--evolution {
    width: 108px;
    min-width: 108px;

    flex-basis: 108px;
  }

  .kh-brand-logo--aquaking {
    width: 118px;
    min-width: 118px;

    flex-basis: 118px;
  }

  .kh-brand-logo--jks {
    width: 126px;
    min-width: 126px;

    flex-basis: 126px;
  }

  .kh-brand-logo--koicompany {
    width: 118px;
    min-width: 118px;

    flex-basis: 118px;
  }
}


/* =========================================================
   WOOCOMMERCE GRID
========================================================= */

.woocommerce,
.woocommerce-page,
.elementor-widget-wc-categories,
.elementor-widget-woocommerce-products,
.elementor-widget-woocommerce-product-categories,
.elementor-widget-wc-products {
  width: 100%;
  max-width: 100%;

  min-width: 0;
}

.woocommerce ul.products,
.woocommerce-page ul.products,
.elementor-widget-wc-categories ul.products,
.elementor-widget-woocommerce-products ul.products,
.elementor-widget-woocommerce-product-categories ul.products,
.elementor-widget-wc-products ul.products {
  width: 100% !important;
  max-width: 100% !important;

  min-width: 0 !important;

  display: grid !important;

  grid-template-columns:
    repeat(
      auto-fill,
      minmax(
        min(160px, 100%),
        1fr
      )
    ) !important;

  gap: 14px !important;

  margin: 0 !important;
  padding: 0 !important;

  list-style: none !important;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after {
  display: none !important;

  content: none !important;
}


/* =========================================================
   WOOCOMMERCE DESKTOP GRID
========================================================= */

@media (min-width: 1200px) {

  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .elementor-widget-wc-categories ul.products,
  .elementor-widget-woocommerce-products ul.products,
  .elementor-widget-woocommerce-product-categories ul.products,
  .elementor-widget-wc-products ul.products {
    grid-template-columns:
      repeat(
        6,
        minmax(0, 1fr)
      ) !important;
  }
}


/* =========================================================
   WOOCOMMERCE GRID ITEM RESET
   IMPORTANT OVERFLOW FIX
========================================================= */

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.elementor-widget-wc-categories ul.products li.product,
.elementor-widget-woocommerce-products ul.products li.product,
.elementor-widget-woocommerce-product-categories ul.products li.product,
.elementor-widget-wc-products ul.products li.product {
  width: 100% !important;
  max-width: 100% !important;

  min-width: 0 !important;

  float: none !important;

  clear: none !important;

  margin: 0 !important;
}


/* =========================================================
   WOOCOMMERCE CATEGORY CARDS
========================================================= */

.woocommerce ul.products li.product-category,
.woocommerce-page ul.products li.product-category,
.elementor-widget-wc-categories .product-category {
  position: relative !important;

  width: 100% !important;
  max-width: 100% !important;

  min-width: 0 !important;
  height: 100% !important;

  display: flex !important;

  flex-direction: column !important;

  overflow: hidden !important;

  border-radius: 8px !important;

  background:
    #fff !important;

  border:
    1px solid
    #E6EAED !important;

  box-shadow:
    0 8px 22px
    rgba(4, 34, 48, .07) !important;

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease !important;
}

.woocommerce ul.products li.product-category:hover,
.woocommerce-page ul.products li.product-category:hover,
.elementor-widget-wc-categories .product-category:hover {
  transform:
    translateY(-3px) !important;

  border-color:
    rgba(10, 77, 94, .18) !important;

  box-shadow:
    0 14px 34px
    rgba(4, 34, 48, .12) !important;
}

.woocommerce ul.products li.product-category a,
.woocommerce-page ul.products li.product-category a,
.elementor-widget-wc-categories .product-category a {
  width: 100%;
  max-width: 100%;

  min-width: 0;

  display: flex !important;

  flex-direction: column !important;

  height: 100% !important;

  color: inherit !important;

  text-decoration: none !important;
}

.woocommerce ul.products li.product-category img,
.woocommerce-page ul.products li.product-category img,
.elementor-widget-wc-categories .product-category img {
  width: 100% !important;

  max-width: 100% !important;

  height: 96px !important;

  margin: 0 !important;
  padding: 0 !important;

  object-fit: cover !important;

  border-radius:
    8px
    8px
    0
    0 !important;

  transition:
    transform .45s ease !important;
}

.woocommerce ul.products li.product-category:hover img,
.woocommerce-page ul.products li.product-category:hover img,
.elementor-widget-wc-categories .product-category:hover img {
  transform:
    scale(1.05) !important;
}

.woocommerce ul.products li.product-category::before,
.woocommerce-page ul.products li.product-category::before,
.elementor-widget-wc-categories .product-category::before {
  display: none !important;

  content: none !important;
}

.woocommerce ul.products li.product-category
.woocommerce-loop-category__title,

.woocommerce ul.products li.product-category h2,

.woocommerce-page ul.products li.product-category
.woocommerce-loop-category__title,

.woocommerce-page ul.products li.product-category h2,

.elementor-widget-wc-categories
.product-category
.woocommerce-loop-category__title,

.elementor-widget-wc-categories
.product-category h2 {
  position: static !important;

  width: 100%;
  max-width: 100%;

  min-width: 0;

  display: flex !important;

  align-items: center !important;

  flex-grow: 1 !important;

  margin: 0 !important;

  padding:
    10px
    12px
    8px !important;

  overflow: hidden !important;

  color:
    #24323D !important;

  background:
    #fff !important;

  font-size:
    11px !important;

  line-height:
    1.2 !important;

  font-weight:
    800 !important;

  text-align:
    left !important;

  text-shadow:
    none !important;

  overflow-wrap:
    anywhere;
}

.woocommerce ul.products li.product-category
.woocommerce-loop-category__title mark,

.woocommerce ul.products li.product-category h2 mark,

.woocommerce-page ul.products li.product-category
.woocommerce-loop-category__title mark,

.woocommerce-page ul.products li.product-category h2 mark,

.elementor-widget-wc-categories
.product-category
.woocommerce-loop-category__title mark,

.elementor-widget-wc-categories
.product-category h2 mark {
  display: none !important;
}


/* =========================================================
   WOOCOMMERCE PRODUCT CARDS
========================================================= */

.woocommerce ul.products
li.product:not(.product-category),

.woocommerce-page ul.products
li.product:not(.product-category),

.elementor-widget-woocommerce-products
ul.products
li.product:not(.product-category),

.elementor-widget-wc-products
ul.products
li.product:not(.product-category) {
  position: relative !important;

  width: 100% !important;
  max-width: 100% !important;

  min-width: 0 !important;
  min-height: 290px !important;

  display: flex !important;

  flex-direction: column !important;

  height: 100% !important;

  margin: 0 !important;

  padding-bottom:
    54px !important;

  overflow: hidden !important;

  background:
    #fff !important;

  border:
    1px solid
    #E6EAED !important;

  border-radius:
    8px !important;

  box-shadow:
    0 8px 22px
    rgba(4, 34, 48, .06) !important;

  text-align:
    left !important;

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease !important;
}

.woocommerce ul.products
li.product:not(.product-category):hover,

.woocommerce-page ul.products
li.product:not(.product-category):hover,

.elementor-widget-woocommerce-products
ul.products
li.product:not(.product-category):hover,

.elementor-widget-wc-products
ul.products
li.product:not(.product-category):hover {
  transform:
    translateY(-3px) !important;

  border-color:
    rgba(10, 77, 94, .16) !important;

  box-shadow:
    0 14px 34px
    rgba(4, 34, 48, .11) !important;
}


/* Product image */

.woocommerce ul.products
li.product:not(.product-category) a img,

.woocommerce-page ul.products
li.product:not(.product-category) a img,

.elementor-widget-woocommerce-products
ul.products
li.product:not(.product-category) a img,

.elementor-widget-wc-products
ul.products
li.product:not(.product-category) a img {
  width: 100% !important;
  max-width: 100% !important;

  height: 96px !important;

  aspect-ratio:
    auto !important;

  object-fit:
    contain !important;

  object-position:
    center !important;

  padding:
    10px !important;

  margin:
    0 !important;

  background:
    #fff !important;

  transition:
    transform .45s ease !important;
}

.woocommerce ul.products
li.product:not(.product-category):hover img,

.woocommerce-page ul.products
li.product:not(.product-category):hover img,

.elementor-widget-woocommerce-products
ul.products
li.product:not(.product-category):hover img,

.elementor-widget-wc-products
ul.products
li.product:not(.product-category):hover img {
  transform:
    scale(1.04) !important;
}


/* Product title */

.woocommerce ul.products
li.product:not(.product-category)
.woocommerce-loop-product__title,

.woocommerce-page ul.products
li.product:not(.product-category)
.woocommerce-loop-product__title,

.elementor-widget-woocommerce-products
ul.products
li.product:not(.product-category)
.woocommerce-loop-product__title,

.elementor-widget-wc-products
ul.products
li.product:not(.product-category)
.woocommerce-loop-product__title {
  min-width: 0;

  flex-grow: 1 !important;

  margin: 0 !important;

  padding:
    8px
    10px
    4px !important;

  color:
    #24323D !important;

  font-size:
    11px !important;

  line-height:
    1.25 !important;

  font-weight:
    800 !important;

  text-align:
    left !important;

  overflow-wrap:
    anywhere;
}


/* Price */

.woocommerce ul.products
li.product:not(.product-category)
.price,

.woocommerce-page ul.products
li.product:not(.product-category)
.price,

.elementor-widget-woocommerce-products
ul.products
li.product:not(.product-category)
.price,

.elementor-widget-wc-products
ul.products
li.product:not(.product-category)
.price {
  max-width:
    calc(100% - 52px);

  display: block !important;

  margin:
    auto
    42px
    10px
    10px !important;

  padding:
    0 !important;

  color:
    #0A4D5E !important;

  font-size:
    15px !important;

  line-height:
    1 !important;

  font-weight:
    800 !important;

  overflow-wrap:
    anywhere;
}


/* =========================================================
   WOOCOMMERCE PRODUCT BUTTON
========================================================= */

.woocommerce ul.products
li.product:not(.product-category)
.button,

.woocommerce-page ul.products
li.product:not(.product-category)
.button,

.elementor-widget-woocommerce-products
ul.products
li.product:not(.product-category)
.button,

.elementor-widget-wc-products
ul.products
li.product:not(.product-category)
.button {
  position: absolute !important;

  right: 10px !important;
  bottom: 16px !important;

  width: 40px !important;
  height: 40px !important;

  min-width: 40px !important;
  min-height: 40px !important;

  max-width: 40px !important;

  display: inline-flex !important;

  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden !important;

  border: 0 !important;

  border-radius:
    5px !important;

  color:
    #fff !important;

  background:
    #0A4D5E !important;

  font-size:
    0 !important;

  line-height:
    1 !important;

  font-weight:
    600 !important;

  text-align:
    center !important;

  transition:
    all .25s ease !important;
}

.woocommerce ul.products
li.product:not(.product-category)
.button::before,

.woocommerce-page ul.products
li.product:not(.product-category)
.button::before,

.elementor-widget-woocommerce-products
ul.products
li.product:not(.product-category)
.button::before,

.elementor-widget-wc-products
ul.products
li.product:not(.product-category)
.button::before {
  width: 20px !important;
  height: 20px !important;

  display: block !important;

  flex:
    0
    0
    auto !important;

  margin:
    auto !important;

  background:
    currentColor !important;

  content:
    "" !important;

  -webkit-mask:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='21' r='1'/%3E%3Ccircle cx='19' cy='21' r='1'/%3E%3Cpath d='M2.05 2.05h2l2.7 12.5a2 2 0 0 0 2 1.55h8.9a2 2 0 0 0 2-1.55L21 7H5.1'/%3E%3C/g%3E%3C/svg%3E")
    center /
    contain
    no-repeat !important;

  mask:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='21' r='1'/%3E%3Ccircle cx='19' cy='21' r='1'/%3E%3Cpath d='M2.05 2.05h2l2.7 12.5a2 2 0 0 0 2 1.55h8.9a2 2 0 0 0 2-1.55L21 7H5.1'/%3E%3C/g%3E%3C/svg%3E")
    center /
    contain
    no-repeat !important;
}

.woocommerce ul.products
li.product:not(.product-category)
.button:hover,

.woocommerce-page ul.products
li.product:not(.product-category)
.button:hover,

.elementor-widget-woocommerce-products
ul.products
li.product:not(.product-category)
.button:hover,

.elementor-widget-wc-products
ul.products
li.product:not(.product-category)
.button:hover {
  background:
    #E84C3D !important;

  transform:
    translateY(-2px) !important;
}


/* Added to cart link */

.woocommerce ul.products
li.product:not(.product-category)
.added_to_cart,

.woocommerce-page ul.products
li.product:not(.product-category)
.added_to_cart,

.elementor-widget-woocommerce-products
ul.products
li.product:not(.product-category)
.added_to_cart,

.elementor-widget-wc-products
ul.products
li.product:not(.product-category)
.added_to_cart {
  max-width:
    calc(100% - 20px);

  margin:
    6px
    10px
    10px !important;

  overflow-wrap:
    anywhere;
}


/* =========================================================
   SALE BADGE
========================================================= */

.woocommerce span.onsale {
  top: 15px;
  left: 15px;

  min-width: auto;
  min-height: auto;

  max-width:
    calc(100% - 30px);

  padding:
    8px
    14px;

  overflow: hidden;

  color:
    #fff;

  background:
    #E84C3D !important;

  border-radius:
    50px;

  white-space: nowrap;
}


/* =========================================================
   MOBILE WOOCOMMERCE
========================================================= */

@media (max-width: 767px) {

  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .elementor-widget-wc-categories ul.products,
  .elementor-widget-woocommerce-products ul.products,
  .elementor-widget-woocommerce-product-categories ul.products,
  .elementor-widget-wc-products ul.products {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      ) !important;

    gap:
      14px !important;
  }

  .woocommerce ul.products
  li.product:not(.product-category),

  .woocommerce-page ul.products
  li.product:not(.product-category),

  .elementor-widget-woocommerce-products
  ul.products
  li.product:not(.product-category),

  .elementor-widget-wc-products
  ul.products
  li.product:not(.product-category) {
    min-width:
      0 !important;

    min-height:
      260px !important;

    padding-bottom:
      50px !important;

    border-radius:
      8px !important;
  }

  .woocommerce ul.products
  li.product:not(.product-category)
  .woocommerce-loop-product__title,

  .woocommerce-page ul.products
  li.product:not(.product-category)
  .woocommerce-loop-product__title,

  .elementor-widget-woocommerce-products
  ul.products
  li.product:not(.product-category)
  .woocommerce-loop-product__title,

  .elementor-widget-wc-products
  ul.products
  li.product:not(.product-category)
  .woocommerce-loop-product__title {
    font-size:
      12px !important;
  }

  .woocommerce ul.products
  li.product:not(.product-category)
  .price,

  .woocommerce-page ul.products
  li.product:not(.product-category)
  .price,

  .elementor-widget-woocommerce-products
  ul.products
  li.product:not(.product-category)
  .price,

  .elementor-widget-wc-products
  ul.products
  li.product:not(.product-category)
  .price {
    font-size:
      15px !important;
  }
}


/* =========================================================
   VERY SMALL PHONES
========================================================= */

@media (max-width: 360px) {

  .kh-hero__inner.kh-shell {
    width:
      calc(100% - 20px);
  }

  .kh-shell,
  .kh-section.kh-shell {
    width:
      calc(100% - 20px);
  }

  .kh-benefits__inner {
    width:
      calc(100% - 20px);
  }


  /*
   * Keep WooCommerce two-column layout,
   * but explicitly allow the columns/cards to shrink.
   */

  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .elementor-widget-wc-categories ul.products,
  .elementor-widget-woocommerce-products ul.products,
  .elementor-widget-woocommerce-product-categories ul.products,
  .elementor-widget-wc-products ul.products {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      ) !important;

    gap:
      10px !important;
  }

  .woocommerce ul.products
  li.product:not(.product-category)
  .button,

  .woocommerce-page ul.products
  li.product:not(.product-category)
  .button,

  .elementor-widget-woocommerce-products
  ul.products
  li.product:not(.product-category)
  .button,

  .elementor-widget-wc-products
  ul.products
  li.product:not(.product-category)
  .button {
    right:
      8px !important;

    width:
      36px !important;

    min-width:
      36px !important;

    max-width:
      36px !important;

    height:
      36px !important;

    min-height:
      36px !important;
  }

  .woocommerce ul.products
  li.product:not(.product-category)
  .price,

  .woocommerce-page ul.products
  li.product:not(.product-category)
  .price {
    max-width:
      calc(100% - 48px);

    margin-right:
      38px !important;
  }
}

/* =========================================================
   WIDE FEATURE PANELS — SAFE HORIZONTAL GUTTERS
   Keeps Trust + Expert CTA wide, but prevents them from
   touching the left/right viewport borders.
========================================================= */

.kh-trust,
.kh-expert {
  width: calc(100% - 96px);
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 1280px) {
  .kh-trust,
  .kh-expert {
    width: calc(100% - 48px);
  }
}

@media (max-width: 768px) {
  .kh-trust,
  .kh-expert {
    width: calc(100% - 32px);
  }
}

@media (max-width: 480px) {
  .kh-trust,
  .kh-expert {
    width: calc(100% - 24px);
  }
}

@media (max-width: 360px) {
  .kh-trust,
  .kh-expert {
    width: calc(100% - 20px);
  }
}/* End custom CSS */