
/* =========================================================
   HOME PROBLEMS SECTION
========================================================= */

.dhm-home-problems {
  position: relative;
  overflow: hidden;
  padding: clamp(58px, 7vw, 96px) 20px;
  background:
    radial-gradient(circle at 12% 10%, rgba(54,214,255,0.14), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #f3fbff 100%);
}

.dhm-home-problems::before {
  content: "";
  position: absolute;
  right: -120px;
  top: -120px;
  width: 320px;
  height: 320px;
  border-radius: 999px;
  border: 1px solid rgba(7,95,159,0.10);
  pointer-events: none;
}

.dhm-home-problems__head {
  position: relative;
  z-index: 2;
  max-width: 820px;
  margin: 0 auto 38px;
  text-align: center;
}



.dhm-home-problems__head h2 {
  margin: 0 0 16px;
  color: var(--dhm-navy);
  font-size: clamp(34px, 4vw, 56px);
  line-height: 1.05;
  letter-spacing: -0.045em;
}

.dhm-home-problems__head p {
  margin: 0 auto;
  max-width: 720px;
  color: var(--dhm-muted);
  font-size: 18px;
  line-height: 1.62;
}

.dhm-home-problems__grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.dhm-home-problem-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--dhm-border);
  border-radius: 26px;
  background: #ffffff;
  box-shadow: var(--dhm-shadow);
}

.dhm-home-problem-card__image {
  min-height: 180px;
  position: relative;
  overflow: hidden;
}

.dhm-home-problem-card__image::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 24% 20%, rgba(255,255,255,0.34), transparent 28%),
    linear-gradient(135deg, var(--card-start), var(--card-mid), var(--card-end));
}

.dhm-home-problem-card__image::after {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.30);
  opacity: 0.65;
  box-shadow:
    0 0 0 28px rgba(255,255,255,0.06),
    0 0 34px rgba(255,255,255,0.12);
}

.dhm-home-problem-card__image--green {
  --card-start: #2f6f75;
  --card-mid: #4d8b7e;
  --card-end: #7aa089;
}

.dhm-home-problem-card__image--cloudy {
  --card-start: #7aaec7;
  --card-mid: #b9dce9;
  --card-end: #f2fbff;
}

.dhm-home-problem-card__image--algae {
  --card-start: #194d3f;
  --card-mid: #377c58;
  --card-end: #7ea56d;
}

.dhm-home-problem-card__image--confused {
  --card-start: #075f9f;
  --card-mid: #0aa7df;
  --card-end: #bceeff;
}

.dhm-home-problem-card__content {
  padding: 22px;
}

.dhm-home-problem-card h3 {
  margin: 0 0 8px;
  color: var(--dhm-navy);
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.08;
  letter-spacing: -0.03em;
}

.dhm-home-problem-card p {
  margin: 0;
  color: var(--dhm-muted);
  font-size: 15.5px;
  line-height: 1.55;
}

@media (max-width: 1080px) {
  .dhm-home-problems__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dhm-home-problem-card__image {
    min-height: 160px;
  }
}

@media (max-width: 640px) {
  .dhm-home-problems {
    padding: 46px 16px;
  }

  .dhm-home-problems__head {
    text-align: center;
    margin-bottom: 28px;
  }

  .dhm-home-problems__grid {
    grid-template-columns: 1fr;
    max-width: 520px;
    margin: 0 auto;
  }

  .dhm-home-problem-card__image {
    min-height: 150px;
  }
}


/* =========================================================
   HOME SOLUTION SECTION
========================================================= */

.dhm-home-solution {
  position: relative;
  overflow: hidden;
  padding: clamp(58px, 7vw, 96px) 20px;
  color: #ffffff;
  background:
    radial-gradient(circle at 14% 18%, rgba(54,214,255,0.26), transparent 34%),
    radial-gradient(circle at 84% 20%, rgba(255,255,255,0.12), transparent 28%),
    linear-gradient(135deg, #021d38 0%, #052b4f 48%, #075f9f 100%);
}

.dhm-home-solution::before {
  content: "";
  position: absolute;
  inset: -20%;
  pointer-events: none;
  opacity: 0.22;
  mix-blend-mode: screen;
  background:
    radial-gradient(circle at 18% 26%, rgba(255,255,255,0.24), transparent 15%),
    radial-gradient(circle at 70% 18%, rgba(255,255,255,0.18), transparent 18%),
    radial-gradient(circle at 86% 74%, rgba(255,255,255,0.15), transparent 20%);
  animation: dhm-home-water-shimmer 18s ease-in-out infinite alternate;
}

.dhm-home-solution__grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: clamp(26px, 5vw, 58px);
  align-items: center;
}

.dhm-home-solution__copy {
  max-width: 760px;
}



.dhm-home-solution h2 {
  margin: 0 0 20px;
  color: #ffffff;
  font-size: clamp(36px, 4.6vw, 62px);
  line-height: 1.02;
  letter-spacing: -0.055em;
}

.dhm-home-solution__copy p {
  max-width: 680px;
  margin: 0 0 18px;
  color: rgba(255,255,255,0.84);
  font-size: 18px;
  line-height: 1.62;
}

.dhm-home-solution__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 28px;
}

.dhm-home-solution__text-link {
  color: #ffffff;
  font-size: 15px;
  font-weight: 900;
  text-decoration: none;
  border-bottom: 2px solid rgba(255,255,255,0.42);
  padding-bottom: 4px;
}

.dhm-home-solution__text-link:hover {
  border-bottom-color: #ffffff;
}

.dhm-home-solution__panel {
  position: relative;
  overflow: hidden;
  padding: clamp(26px, 4vw, 42px);
  border: 1px solid rgba(255,255,255,0.26);
  border-radius: 32px;
  background: rgba(255,255,255,0.14);
  box-shadow:
    0 24px 60px rgba(0,0,0,0.18),
    inset 0 0 0 1px rgba(255,255,255,0.12);
  backdrop-filter: blur(12px);
}

.dhm-home-solution__panel::before {
  content: "";
  position: absolute;
  right: -70px;
  top: -70px;
  width: 190px;
  height: 190px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.16);
  box-shadow: 0 0 0 34px rgba(255,255,255,0.05);
  pointer-events: none;
}

.dhm-home-solution__orb {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  margin-bottom: 22px;
  border-radius: 22px;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,0.32), transparent 36%),
    linear-gradient(135deg, #36d6ff, #075f9f);
  color: #ffffff;
  box-shadow:
    0 16px 34px rgba(0,0,0,0.18),
    0 0 24px rgba(54,214,255,0.26);
}

.dhm-home-solution__orb span {
  font-size: 34px;
  font-weight: 900;
  line-height: 1;
}

.dhm-home-solution__panel h3 {
  margin: 0 0 18px;
  color: #ffffff;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.05;
  letter-spacing: -0.045em;
}

.dhm-home-solution__panel ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.dhm-home-solution__panel li {
  position: relative;
  margin: 0 0 12px;
  padding-left: 30px;
  color: rgba(255,255,255,0.88);
  font-size: 16px;
  line-height: 1.45;
}

.dhm-home-solution__panel li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0.1em;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: rgba(255,255,255,0.16);
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
}

@media (max-width: 900px) {
  .dhm-home-solution__grid {
    grid-template-columns: 1fr;
  }

  .dhm-home-solution__copy {
    text-align: center;
    margin: 0 auto;
  }

  

  .dhm-home-solution__copy p {
    margin-left: auto;
    margin-right: auto;
  }

  .dhm-home-solution__actions {
    justify-content: center;
  }

  .dhm-home-solution__panel {
    max-width: 620px;
    width: 100%;
    margin: 0 auto;
  }
}

@media (max-width: 640px) {
  .dhm-home-solution {
    padding: 46px 16px;
  }

  .dhm-home-solution__actions {
    flex-direction: column;
    align-items: center;
  }

  .dhm-home-solution__actions .dhm-btn {
    width: min(100%, 320px);
  }

  .dhm-home-solution__panel {
    text-align: left;
  }
}

/* =========================================================
   HOME HOW TO USE SECTION
========================================================= */

.dhm-home-how {
  position: relative;
  overflow: hidden;
  padding: clamp(58px, 7vw, 96px) 20px;
  background:
    radial-gradient(circle at 12% 18%, rgba(54,214,255,0.18), transparent 30%),
    radial-gradient(circle at 86% 72%, rgba(10,167,223,0.13), transparent 34%),
    linear-gradient(180deg, #ffffff 0%, #f2fbff 100%);
}

.dhm-home-how::before {
  content: "";
  position: absolute;
  left: -110px;
  bottom: -120px;
  width: 330px;
  height: 330px;
  border-radius: 999px;
  border: 1px solid rgba(7,95,159,0.10);
  pointer-events: none;
}

.dhm-home-how__wrap {
  position: relative;
  z-index: 2;
}

.dhm-home-how__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(24px, 4vw, 54px);
  align-items: stretch;
}

.dhm-home-how__feature {
  position: sticky;
  top: 112px;
  align-self: start;
  min-height: 520px;
  padding: clamp(28px, 4vw, 46px);
  border-radius: 34px;
  color: #ffffff;
  background:
    radial-gradient(circle at 22% 22%, rgba(255,255,255,0.28), transparent 30%),
    radial-gradient(circle at 76% 72%, rgba(54,214,255,0.26), transparent 36%),
    linear-gradient(135deg, var(--dhm-navy), var(--dhm-blue));
  box-shadow: var(--dhm-shadow);
  overflow: hidden;
}

.dhm-home-how__feature::before,
.dhm-home-how__feature::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
}

.dhm-home-how__feature::before {
  width: 260px;
  height: 260px;
  right: -90px;
  top: -80px;
  border: 1px solid rgba(255,255,255,0.24);
  box-shadow: 0 0 70px rgba(54,214,255,0.22);
}

.dhm-home-how__feature::after {
  width: 190px;
  height: 190px;
  left: -74px;
  bottom: -72px;
  border: 1px solid rgba(255,255,255,0.18);
}

.dhm-home-how__feature > * {
  position: relative;
  z-index: 2;
}

.dhm-home-how__feature h2 {
  margin: 14px 0 18px;
  color: #ffffff;
  font-size: clamp(36px, 4.4vw, 60px);
  line-height: 1;
  letter-spacing: -0.055em;
}

.dhm-home-how__feature p {
  max-width: 520px;
  margin: 0 0 26px;
  color: rgba(255,255,255,0.9);
  font-size: 18px;
  line-height: 1.62;
}

.dhm-home-how__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 28px;
}

.dhm-home-how__text-link {
  color: #ffffff;
  font-size: 15px;
  font-weight: 900;
  text-decoration: none;
  border-bottom: 2px solid rgba(255,255,255,0.42);
  padding-bottom: 4px;
}

.dhm-home-how__text-link:hover {
  border-bottom-color: #ffffff;
}

.dhm-home-how__product-card {
  margin-top: 30px;
  padding: 22px;
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 26px;
  background: rgba(255,255,255,0.12);
  backdrop-filter: blur(10px);
}

.dhm-home-how__product-card strong {
  display: block;
  margin-bottom: 7px;
  color: #ffffff;
  font-size: 24px;
  line-height: 1.1;
}

.dhm-home-how__product-card span {
  display: block;
  color: rgba(255,255,255,0.78);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
}

.dhm-home-how__steps {
  display: grid;
  gap: 18px;
}

.dhm-home-how__step {
  position: relative;
  display: grid;
  grid-template-columns: 76px minmax(0,1fr);
  gap: 20px;
  padding: clamp(22px, 3vw, 30px);
  border: 1px solid var(--dhm-border);
  border-radius: 28px;
  background: rgba(255,255,255,0.88);
  box-shadow: 0 14px 34px rgba(5,43,79,0.10);
}

.dhm-home-how__step-number {
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  border-radius: 22px;
  background: linear-gradient(135deg, var(--dhm-aqua), var(--dhm-blue));
  color: #ffffff;
  font-weight: 900;
  font-size: 19px;
  box-shadow: 0 12px 24px rgba(10,167,223,0.22);
}

.dhm-home-how__step h3 {
  margin: 0 0 8px;
  color: var(--dhm-navy);
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.14;
  letter-spacing: -0.035em;
}

.dhm-home-how__step p {
  margin: 0;
  color: var(--dhm-muted);
  font-size: 16px;
  line-height: 1.58;
}

.dhm-home-how__note {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  margin-top: 18px;
  padding: 20px;
  border-radius: 24px;
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,0.74), transparent 38%),
    linear-gradient(135deg, #f0fff6 0%, #e3f8ec 100%);
  border: 1px solid rgba(70, 178, 112, 0.22);
  box-shadow: 0 12px 28px rgba(5,43,79,0.08);
}

.dhm-home-how__note-icon {
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, #68d391, #2f9e57);
  font-weight: 900;
  box-shadow: 0 10px 22px rgba(47, 158, 87, 0.18);
}

.dhm-home-how__note p {
  margin: 0;
  color: var(--dhm-muted);
  line-height: 1.55;
}

@media (max-width: 980px) {
  .dhm-home-how__grid {
    grid-template-columns: 1fr;
  }

  .dhm-home-how__feature {
    position: relative;
    top: auto;
    min-height: auto;
  }
}

@media (max-width: 720px) {
  .dhm-home-how {
    padding: 46px 16px;
  }

  .dhm-home-how__step {
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
  }

  .dhm-home-how__step > div:not(.dhm-home-how__step-number) {
    display: contents;
  }

  .dhm-home-how__step h3 {
    grid-column: 2;
    align-self: center;
    margin-bottom: 0;
  }

  .dhm-home-how__step p {
    grid-column: 1 / -1;
  }

  .dhm-home-how__step-number {
    width: 58px;
    height: 58px;
    border-radius: 20px;
  }

  .dhm-home-how__actions {
    flex-direction: column;
    align-items: flex-start;
  }

  .dhm-home-how__actions .dhm-btn {
    width: min(100%, 320px);
  }

  .dhm-home-how__note {
    flex-direction: column;
  }
}


/* =========================================================
   HOME PRODUCTS SECTION
========================================================= */

.dhm-home-products {
  position: relative;
  overflow: hidden;
  padding: clamp(58px, 7vw, 96px) 20px;
  background:
    radial-gradient(circle at 10% 14%, rgba(10,167,223,0.14), transparent 31%),
    radial-gradient(circle at 86% 16%, rgba(54,214,255,0.16), transparent 30%),
    linear-gradient(180deg, #f2fbff 0%, #ffffff 100%);
}

.dhm-home-products::before {
  content: "";
  position: absolute;
  right: -110px;
  bottom: -125px;
  width: 340px;
  height: 340px;
  border-radius: 999px;
  border: 1px solid rgba(7,95,159,0.10);
  box-shadow: 0 0 0 42px rgba(10,167,223,0.045);
  pointer-events: none;
}

.dhm-home-products__head {
  position: relative;
  z-index: 2;
  max-width: 850px;
  margin: 0 auto 40px;
  text-align: center;
}

.dhm-home-products__head h2 {
  margin: 0 0 16px;
  color: var(--dhm-navy);
  font-size: clamp(34px, 4vw, 56px);
  line-height: 1.05;
  letter-spacing: -0.045em;
}

.dhm-home-products__head p {
  max-width: 720px;
  margin: 0 auto;
  color: var(--dhm-muted);
  font-size: 18px;
  line-height: 1.62;
}

.dhm-home-products__grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}

.dhm-home-product-card {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  border: 1px solid var(--dhm-border);
  border-radius: 30px;
  background: #ffffff;
  box-shadow: 0 16px 40px rgba(5,43,79,0.10);
}

.dhm-home-product-card--featured {
  border-color: rgba(10,167,223,0.46);
  box-shadow:
    0 20px 52px rgba(5,43,79,0.14),
    0 0 34px rgba(54,214,255,0.18);
  transform: translateY(-10px);
}

.dhm-home-product-card__badge {
  position: absolute;
  top: 18px;
  left: 18px;
  z-index: 3;
  padding: 8px 13px;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--dhm-bright), var(--dhm-blue));
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  box-shadow: 0 10px 22px rgba(10,167,223,0.22);
}

.dhm-home-product-card__top {
  position: relative;
  min-height: 190px;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 30% 24%, rgba(255,255,255,0.42), transparent 28%),
    radial-gradient(circle at 68% 74%, rgba(54,214,255,0.20), transparent 36%),
    linear-gradient(135deg, #052b4f, #075f9f 58%, #36d6ff);
}

.dhm-home-product-card__top::before,
.dhm-home-product-card__top::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.24);
  pointer-events: none;
}

.dhm-home-product-card__top::before {
  width: 150px;
  height: 150px;
  right: -42px;
  top: -42px;
  box-shadow: 0 0 0 24px rgba(255,255,255,0.05);
}

.dhm-home-product-card__top::after {
  width: 105px;
  height: 105px;
  left: -30px;
  bottom: -30px;
}

.dhm-home-product-card__size {
  position: relative;
  z-index: 2;
  width: 132px;
  height: 132px;
  display: grid;
  place-items: center;
  border-radius: 34px;
  color: #ffffff;
  background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.26);
  box-shadow:
    0 18px 40px rgba(0,0,0,0.18),
    inset 0 0 0 1px rgba(255,255,255,0.12);
  backdrop-filter: blur(8px);
  font-size: 42px;
  font-weight: 900;
  letter-spacing: -0.05em;
}

.dhm-home-product-card__shine {
  position: absolute;
  inset: 22px;
  border-radius: 26px;
  background: linear-gradient(115deg, transparent 0%, rgba(255,255,255,0.18) 44%, transparent 58%);
  opacity: 0.7;
  pointer-events: none;
}

.dhm-home-product-card__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: clamp(24px, 3vw, 30px);
}

.dhm-home-product-card h3 {
  margin: 0 0 10px;
  color: var(--dhm-navy);
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.08;
  letter-spacing: -0.04em;
}

.dhm-home-product-card p {
  margin: 0 0 18px;
  color: var(--dhm-muted);
  font-size: 16px;
  line-height: 1.55;
}

.dhm-home-product-card ul {
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
}

.dhm-home-product-card li {
  position: relative;
  margin: 0 0 10px;
  padding-left: 26px;
  color: var(--dhm-muted);
  line-height: 1.45;
}

.dhm-home-product-card li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0.05em;
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--dhm-aqua), var(--dhm-blue));
  font-size: 11px;
  font-weight: 900;
}

.dhm-home-product-card .dhm-btn {
  margin-top: auto;
  align-self: flex-start;
}

.dhm-home-products__calculator {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 28px;
  padding: clamp(24px, 4vw, 34px);
  border-radius: 30px;
  color: #ffffff;
  background:
    radial-gradient(circle at 20% 24%, rgba(255,255,255,0.18), transparent 30%),
    linear-gradient(135deg, var(--dhm-navy), var(--dhm-blue));
  box-shadow: var(--dhm-shadow);
}

.dhm-home-products__calculator h3 {
  margin: 0 0 7px;
  color: #ffffff;
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.1;
  letter-spacing: -0.04em;
}

.dhm-home-products__calculator p {
  margin: 0;
  max-width: 620px;
  color: rgba(255,255,255,0.84);
  font-size: 16px;
  line-height: 1.55;
}

@media (max-width: 980px) {
  .dhm-home-products__grid {
    grid-template-columns: 1fr;
    max-width: 620px;
    margin: 0 auto;
  }

  .dhm-home-product-card--featured {
    transform: none;
  }

  .dhm-home-products__calculator {
    max-width: 620px;
    margin-left: auto;
    margin-right: auto;
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 640px) {
  .dhm-home-products {
    padding: 46px 16px;
  }

  .dhm-home-products__head {
    margin-bottom: 28px;
  }

  .dhm-home-product-card__top {
    min-height: 165px;
  }

  .dhm-home-product-card__size {
    width: 112px;
    height: 112px;
    border-radius: 30px;
    font-size: 36px;
  }

  .dhm-home-product-card .dhm-btn,
  .dhm-home-products__calculator .dhm-btn {
    width: min(100%, 320px);
  }
}

/* =========================================================
   PRODUCT CAROUSEL SECTION - moved from reference homepage
========================================================= */

.dhm-section {
  width: 100%;
  padding: clamp(52px, 7vw, 92px) 20px;
}

.dhm-section-white {
  background:
    radial-gradient(circle at 10% 14%, rgba(10,167,223,0.14), transparent 31%),
    radial-gradient(circle at 86% 16%, rgba(54,214,255,0.16), transparent 30%),
    linear-gradient(180deg, #f2fbff 0%, #ffffff 100%);
}

.dhm-section-head {
  position: relative;
  z-index: 2;
  max-width: 850px;
  margin: 0 auto 40px;
  text-align: center;
}

.dhm-section-head h2 {
  margin: 0 0 16px;
  color: var(--dhm-navy);
  font-size: clamp(34px, 4vw, 56px);
  line-height: 1.05;
  letter-spacing: -0.045em;
}

.dhm-section-head p {
  max-width: 720px;
  margin: 0 auto;
  color: var(--dhm-muted);
  font-size: 18px;
  line-height: 1.62;
}

#dhm-products-section {
  position: relative;
  overflow: hidden;
}

#dhm-products-section::before {
  content: "";
  position: absolute;
  right: -110px;
  bottom: -125px;
  width: 340px;
  height: 340px;
  border-radius: 999px;
  border: 1px solid rgba(7,95,159,0.10);
  box-shadow: 0 0 0 42px rgba(10,167,223,0.045);
  pointer-events: none;
}

#dhm-products-section .dhm-product-carousel-shell {
  position: relative;
  z-index: 2;
}

#dhm-products-section .dhm-product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}

#dhm-products-section .dhm-product-card,
#dhm-products-section .dhm-featured-product {
  position: relative;
  overflow: visible;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  border: 2px solid rgba(10, 167, 223, 0.42);
  border-radius: 30px;
  background: #ffffff;
  box-shadow:
    0 18px 45px rgba(5,43,79,0.14),
    0 0 0 1px rgba(255,255,255,0.70) inset;
}

#dhm-products-section .dhm-featured-product {
  border-color: rgba(10,167,223,0.64);
  box-shadow:
    0 22px 58px rgba(5,43,79,0.16),
    0 0 34px rgba(54,214,255,0.20),
    0 0 0 1px rgba(255,255,255,0.74) inset;
  transform: translateY(-10px);
}

#dhm-products-section .dhm-badge {
  position: absolute;
  top: 18px;
  left: 18px;
  z-index: 5;
  padding: 8px 13px;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--dhm-bright), var(--dhm-blue));
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  box-shadow: 0 10px 22px rgba(10,167,223,0.22);
}

#dhm-products-section .dhm-product-image {
  position: relative;
  z-index: 2;
  padding: 18px 18px 6px;
  margin-bottom: 0;
  border-top-left-radius: 28px;
  border-top-right-radius: 28px;
  overflow: hidden;
  background:
    radial-gradient(circle at 30% 24%, rgba(255,255,255,0.42), transparent 28%),
    radial-gradient(circle at 68% 74%, rgba(54,214,255,0.20), transparent 36%),
    linear-gradient(135deg, #052b4f, #075f9f 58%, #36d6ff);
}

#dhm-products-section .dhm-product-image::before,
#dhm-products-section .dhm-product-image::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.24);
  pointer-events: none;
}

#dhm-products-section .dhm-product-image::before {
  width: 150px;
  height: 150px;
  right: -42px;
  top: -42px;
  box-shadow: 0 0 0 24px rgba(255,255,255,0.05);
}

#dhm-products-section .dhm-product-image::after {
  width: 105px;
  height: 105px;
  left: -30px;
  bottom: -30px;
}

#dhm-products-section .dhm-product-eyebrow {
  position: absolute;
  top: 10px;
  left: 12px;
  z-index: 5;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #075f9f;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(10,167,223,0.25);
  box-shadow: 0 6px 14px rgba(5,43,79,0.12);
}

#dhm-products-section .dhm-featured-product .dhm-product-eyebrow {
  background: linear-gradient(135deg, #36d6ff, #0aa7df);
  color: #ffffff;
  border: none;
}

#dhm-products-section .dhm-product-placeholder {
  position: relative;
  z-index: 2;
  height: 190px;
  display: grid;
  place-items: center;
  border-radius: 26px;
  color: #ffffff;
  background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.26);
  box-shadow:
    0 18px 40px rgba(0,0,0,0.18),
    inset 0 0 0 1px rgba(255,255,255,0.12);
  backdrop-filter: blur(8px);
  font-size: 42px;
  font-weight: 900;
  letter-spacing: -0.05em;
}

#dhm-products-section .dhm-product-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 18px;
  border-bottom-left-radius: 28px;
  border-bottom-right-radius: 28px;
  background: #ffffff;
}

#dhm-products-section .dhm-product-content h3 {
  margin: 0 0 10px;
  color: var(--dhm-navy);
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.08;
  letter-spacing: -0.04em;
}

#dhm-products-section .dhm-product-content p {
  margin: 0 0 18px;
  color: var(--dhm-muted);
  font-size: 16px;
  line-height: 1.55;
}

#dhm-products-section .dhm-product-card ul {
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
}

#dhm-products-section .dhm-product-card li {
  position: relative;
  margin: 0 0 10px;
  padding-left: 28px;
  color: var(--dhm-muted);
  line-height: 1.45;
}

#dhm-products-section .dhm-product-card li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0.05em;
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--dhm-aqua), var(--dhm-blue));
  font-size: 11px;
  font-weight: 900;
  box-shadow: 0 6px 14px rgba(7,95,159,0.18);
}

#dhm-products-section .dhm-product-content .dhm-btn {
  margin-top: auto;
  align-self: flex-start;
}

#dhm-products-section .dhm-card-edge-indicator,
#dhm-products-section .dhm-product-carousel-controls,
#dhm-products-section .dhm-product-carousel-dots {
  display: none;
}

.dhm-products-calculator-cta {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 28px;
  padding: clamp(24px, 4vw, 34px);
  border-radius: 30px;
  color: #ffffff;
  background:
    radial-gradient(circle at 20% 24%, rgba(255,255,255,0.18), transparent 30%),
    linear-gradient(135deg, var(--dhm-navy), var(--dhm-blue));
  box-shadow: var(--dhm-shadow);
}

.dhm-products-calculator-cta h3 {
  margin: 0 0 7px;
  color: #ffffff;
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.1;
  letter-spacing: -0.04em;
}

.dhm-products-calculator-cta p {
  margin: 0;
  max-width: 620px;
  color: rgba(255,255,255,0.84);
  font-size: 16px;
  line-height: 1.55;
}

@media (max-width: 980px) {
  #dhm-products-section .dhm-product-grid {
    grid-template-columns: 1fr;
    max-width: 620px;
    margin: 0 auto;
  }

  #dhm-products-section .dhm-featured-product {
    transform: none;
  }

  .dhm-products-calculator-cta {
    max-width: 620px;
    margin-left: auto;
    margin-right: auto;
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 720px) {
  #dhm-products-section {
    padding: 46px 16px;
  }

  #dhm-products-section .dhm-section-head {
    margin-bottom: 28px;
    text-align: center;
  }

  #dhm-products-section .dhm-product-carousel-shell {
    overflow: visible;
    padding: 4px 0 16px;
  }

  #dhm-products-section .dhm-product-grid {
    display: block;
    position: relative;
    height: 560px;
    overflow: visible;
    padding: 44px 0 56px;
    touch-action: pan-y;
    perspective: 1200px;
  }

  #dhm-products-section .dhm-product-card {
    position: absolute;
    left: 50%;
    top: 0;
    width: min(78vw, 340px);
    min-width: 0;
    margin-left: calc(-1 * min(78vw, 340px) / 2);
    transform-origin: center center;
    will-change: transform, opacity, filter;
    transition:
      transform 560ms cubic-bezier(.22, 1, .36, 1),
      opacity 420ms ease,
      filter 420ms ease,
      box-shadow 420ms ease;
  }

  #dhm-products-section .dhm-product-card[data-pos="active"] {
    z-index: 5;
    opacity: 1;
    filter: blur(0) saturate(1) brightness(1);
    transform:
      translateX(calc(var(--dhm-drag-x, 0px) * 0.24))
      translateY(0)
      rotate(calc(var(--dhm-drag-x, 0px) * 0.018deg))
      scale(1)
      translateZ(72px);
    box-shadow:
      0 30px 70px rgba(5,43,79,0.26),
      0 0 0 2px rgba(10,167,223,0.22),
      0 0 0 1px rgba(255,255,255,0.82) inset;
  }

  #dhm-products-section .dhm-product-card[data-pos="prev"] {
    z-index: 3;
    opacity: 0.64;
    filter: blur(1.6px) saturate(0.82) brightness(0.96);
    transform: translateX(calc(-58% + (var(--dhm-drag-x, 0px) * 0.10))) translateY(26px) rotate(-7deg) scale(0.88);
  }

  #dhm-products-section .dhm-product-card[data-pos="next"] {
    z-index: 3;
    opacity: 0.64;
    filter: blur(1.6px) saturate(0.82) brightness(0.96);
    transform: translateX(calc(58% + (var(--dhm-drag-x, 0px) * 0.10))) translateY(26px) rotate(7deg) scale(0.88);
  }

  #dhm-products-section .dhm-product-card[data-pos="hidden-left"],
  #dhm-products-section .dhm-product-card[data-pos="hidden-right"] {
    z-index: 1;
    opacity: 0;
    pointer-events: none;
    filter: blur(3px) saturate(0.7);
  }

  #dhm-products-section .dhm-product-grid.is-dragging .dhm-product-card {
    transition: transform 80ms linear, opacity 180ms ease, filter 180ms ease;
  }

  #dhm-products-section .dhm-product-grid.is-snapping .dhm-product-card {
    transition:
      transform 620ms cubic-bezier(.22, 1, .36, 1),
      opacity 420ms ease,
      filter 420ms ease,
      box-shadow 420ms ease;
  }

  #dhm-products-section .dhm-product-grid.dhm-loop-glow .dhm-product-card[data-pos="active"] {
    animation: dhm-product-loop-glow 0.72s ease-out 1;
  }

  @keyframes dhm-product-loop-glow {
    42% {
      box-shadow:
        0 30px 74px rgba(5,43,79,0.28),
        0 0 0 2px rgba(10,167,223,0.34),
        0 0 26px rgba(54,214,255,0.42),
        0 0 0 1px rgba(255,255,255,0.82) inset;
    }
  }

  #dhm-products-section .dhm-product-image {
    padding-top: 14px;
    padding-bottom: 2px;
  }

  #dhm-products-section .dhm-product-placeholder {
    height: 158px;
    font-size: 36px;
  }

  #dhm-products-section .dhm-product-content {
    padding: 10px 16px 18px;
  }

  #dhm-products-section .dhm-product-content h3 {
    margin-bottom: 5px;
    line-height: 1.08;
  }

  #dhm-products-section .dhm-product-card ul {
    margin: 6px 0 12px;
  }

  #dhm-products-section .dhm-product-card li {
    margin-bottom: 4px;
    line-height: 1.28;
  }

  #dhm-products-section .dhm-card-edge-indicator {
    display: none;
  }

  #dhm-products-section .dhm-product-card.is-product-active .dhm-card-edge-indicator {
    position: absolute;
    left: 50%;
    z-index: 90;
    width: 132px;
    height: 28px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    transform: translateX(-50%);
    background: rgba(255,255,255,0.97);
    border: 1px solid rgba(10,167,223,0.24);
    box-shadow:
      0 8px 20px rgba(5,43,79,0.14),
      0 0 14px rgba(54,214,255,0.18);
    pointer-events: auto;
    overflow: visible;
  }

  #dhm-products-section .dhm-product-card.is-product-active .dhm-card-edge-indicator-top {
    top: -22px;
  }

  #dhm-products-section .dhm-product-card.is-product-active .dhm-card-edge-indicator-bottom {
    bottom: -22px;
  }

  #dhm-products-section .dhm-card-edge-indicator span {
    display: block;
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: rgba(7,95,159,0.22);
    transition:
      width 0.22s ease,
      background 0.22s ease,
      transform 0.22s ease;
  }

  #dhm-products-section .dhm-card-edge-indicator span.is-current {
    width: 20px;
    background: linear-gradient(135deg, #0aa7df, #075f9f);
    transform: scale(1.04);
  }

  #dhm-products-section .dhm-card-indicator-chevron {
    width: 22px;
    height: 22px;
    padding: 0;
    border: none;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: rgba(10,167,223,0.08);
    color: rgba(5,43,79,0.58);
    font-size: 16px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    pointer-events: auto;
    touch-action: manipulation;
  }

  #dhm-products-section .dhm-card-indicator-chevron:active {
    transform: scale(0.92);
    background: rgba(10,167,223,0.16);
  }

  #dhm-products-section .dhm-product-card.is-product-active .dhm-product-eyebrow {
    animation: dhm-eyebrow-focus-pop 0.72s cubic-bezier(.22, 1, .36, 1) 1;
  }

  #dhm-products-section .dhm-product-card.is-product-active .dhm-product-eyebrow::after {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: inherit;
    border: 1px solid rgba(54,214,255,0.45);
    opacity: 0;
    animation: dhm-eyebrow-focus-ring 0.72s ease-out 1;
    pointer-events: none;
  }

  .dhm-products-calculator-cta .dhm-btn {
    width: min(100%, 320px);
  }
}

@keyframes dhm-eyebrow-focus-pop {
  0% { transform: translateY(-3px) scale(0.96); filter: brightness(0.96); }
  48% { transform: translateY(-1px) scale(1.06); filter: brightness(1.08); }
  100% { transform: translateY(0) scale(1); filter: brightness(1); }
}

@keyframes dhm-eyebrow-focus-ring {
  0% { opacity: 0.7; transform: scale(0.92); }
  100% { opacity: 0; transform: scale(1.18); }
}

@media (min-width: 721px) {
  #dhm-products-section .dhm-card-edge-indicator {
    display: none !important;
  }
}

/* FINAL POLISH: centered dosing calculator help box */
.dhm-products-calculator-cta {
  width: min(100%, 760px) !important;
  margin: 34px auto 0 !important;
  padding: 8px !important;
  border: 1px solid rgba(10, 167, 223, 0.24) !important;
  border-radius: 34px !important;
  color: var(--dhm-text) !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(54, 214, 255, 0.18), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(243,251,255,0.96) 100%) !important;
  box-shadow:
    0 0 12px rgba(255,255,255,0.42),
    0 18px 45px rgba(5,43,79,0.14),
    inset 0 0 0 1px rgba(255,255,255,0.72) !important;
  backdrop-filter: blur(8px);
}

.dhm-products-calculator-cta > div {
  flex: 1 1 auto;
  min-width: 0;
  padding: clamp(16px, 2.6vw, 24px);
  border: 1px solid rgba(10,167,223,0.16);
  border-radius: 26px;
  text-align: center;
  background: rgba(255,255,255,0.72);
  box-shadow:
    0 0 12px rgba(255,255,255,0.36),
    inset 0 0 0 1px rgba(255,255,255,0.70);
}

.dhm-products-calculator-cta h3 {
  color: var(--dhm-navy) !important;
  text-align: center !important;
}

.dhm-products-calculator-cta p {
  max-width: 560px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: var(--dhm-muted) !important;
  text-align: center !important;
}

.dhm-products-calculator-cta .dhm-btn {
  flex: 0 0 auto;
  box-shadow:
    0 14px 30px rgba(10,167,223,0.25),
    0 0 18px rgba(54,214,255,0.24) !important;
}

@media (max-width: 980px) {
  .dhm-products-calculator-cta {
    width: min(100%, 620px) !important;
    align-items: center !important;
    text-align: center !important;
  }

  .dhm-products-calculator-cta .dhm-btn {
    width: 100%;
    max-width: 340px;
  }
}

@media (max-width: 520px) {
  .dhm-products-calculator-cta {
    border-radius: 28px !important;
  }

  .dhm-products-calculator-cta > div {
    border-radius: 22px;
  }
}


/* Product image files + premium hover glow */
#dhm-products-section .dhm-product-photo {
  position: relative;
  z-index: 3;
  display: block;
  width: 100%;
  height: 190px;
  object-fit: contain;
  object-position: center;
  padding: 10px;
  border-radius: 26px;
  background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.26);
  box-shadow:
    0 18px 40px rgba(0,0,0,0.18),
    0 0 0 1px rgba(255,255,255,0.12) inset;
  backdrop-filter: blur(8px);
  transform: translateZ(0) scale(1);
  transition:
    transform 320ms cubic-bezier(.22, 1, .36, 1),
    filter 320ms ease,
    box-shadow 320ms ease;
}

#dhm-products-section .dhm-product-card:hover .dhm-product-photo,
#dhm-products-section .dhm-product-card:focus-within .dhm-product-photo,
#dhm-products-section .dhm-product-card.is-product-active .dhm-product-photo {
  transform: translateY(-4px) scale(1.055);
  filter:
    drop-shadow(0 10px 20px rgba(5,43,79,0.22))
    drop-shadow(0 0 16px rgba(54,214,255,0.42));
  box-shadow:
    0 22px 48px rgba(0,0,0,0.20),
    0 0 24px rgba(54,214,255,0.30),
    0 0 0 1px rgba(255,255,255,0.18) inset;
}

#dhm-products-section .dhm-product-card:hover .dhm-product-image::before,
#dhm-products-section .dhm-product-card:focus-within .dhm-product-image::before,
#dhm-products-section .dhm-product-card.is-product-active .dhm-product-image::before {
  box-shadow:
    0 0 0 24px rgba(255,255,255,0.07),
    0 0 30px rgba(54,214,255,0.22);
}

#dhm-products-section .dhm-product-card:hover .dhm-product-image::after,
#dhm-products-section .dhm-product-card:focus-within .dhm-product-image::after,
#dhm-products-section .dhm-product-card.is-product-active .dhm-product-image::after {
  box-shadow: 0 0 24px rgba(54,214,255,0.20);
}

@media (max-width: 720px) {
  #dhm-products-section .dhm-product-photo {
    height: 158px;
    padding: 8px;
  }

  #dhm-products-section .dhm-product-card:hover .dhm-product-photo,
  #dhm-products-section .dhm-product-card:focus-within .dhm-product-photo,
  #dhm-products-section .dhm-product-card.is-product-active .dhm-product-photo {
    transform: translateY(-3px) scale(1.035);
  }
}

@media (prefers-reduced-motion: reduce) {
  #dhm-products-section .dhm-product-photo {
    transition: none;
  }

  #dhm-products-section .dhm-product-card:hover .dhm-product-photo,
  #dhm-products-section .dhm-product-card:focus-within .dhm-product-photo,
  #dhm-products-section .dhm-product-card.is-product-active .dhm-product-photo {
    transform: none;
  }
}

/* FINAL PRODUCT IMAGE POLISH: framed images, rounded corners, drop shadow, hover float + sparkle pulse */
#dhm-products-section .dhm-product-image {
  overflow: hidden !important;
}

#dhm-products-section .dhm-product-photo {
  width: 100% !important;
  height: 230px !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
  padding: 8px !important;
  background: #ffffff !important;
  border: 15px solid #ffffff !important;
  border-radius: 24px !important;
  box-shadow:
    0 16px 34px rgba(5, 43, 79, 0.24),
    0 0 0 1px rgba(10, 167, 223, 0.10),
    0 0 22px rgba(255, 255, 255, 0.36) !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  transition:
    transform 420ms cubic-bezier(.22, 1, .36, 1),
    filter 420ms ease,
    box-shadow 420ms ease !important;
}

#dhm-products-section .dhm-product-card:hover .dhm-product-photo,
#dhm-products-section .dhm-product-card:focus-within .dhm-product-photo,
#dhm-products-section .dhm-product-card.is-product-active .dhm-product-photo {
  transform: translate3d(0, -7px, 0) scale(1.045) !important;
  filter:
    drop-shadow(0 12px 22px rgba(5, 43, 79, 0.24))
    drop-shadow(0 0 18px rgba(54, 214, 255, 0.38)) !important;
  box-shadow:
    0 22px 46px rgba(5, 43, 79, 0.28),
    0 0 0 1px rgba(255, 255, 255, 0.92),
    0 0 24px rgba(54, 214, 255, 0.34),
    0 0 42px rgba(255, 255, 255, 0.42) !important;
}

#dhm-products-section .dhm-product-card .dhm-product-image::after {
  content: "" !important;
  position: absolute !important;
  z-index: 4 !important;
  right: 28px !important;
  top: 30px !important;
  width: 11px !important;
  height: 11px !important;
  border-radius: 999px !important;
  border: none !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow:
    0 0 0 0 rgba(255, 255, 255, 0),
    0 0 12px rgba(255, 255, 255, 0.62),
    18px 36px 0 -3px rgba(255, 255, 255, 0.72),
    -28px 56px 0 -4px rgba(255, 255, 255, 0.58) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: scale(0.72) rotate(0deg) !important;
}

#dhm-products-section .dhm-product-card:hover .dhm-product-image::after,
#dhm-products-section .dhm-product-card:focus-within .dhm-product-image::after,
#dhm-products-section .dhm-product-card.is-product-active .dhm-product-image::after {
  animation: dhm-product-sparkle-pulse 1.35s ease-out infinite !important;
}

@keyframes dhm-product-sparkle-pulse {
  0%, 100% {
    opacity: 0;
    transform: translate3d(0, 2px, 0) scale(0.72) rotate(0deg);
  }

  28% {
    opacity: 1;
    transform: translate3d(-2px, -1px, 0) scale(1.14) rotate(18deg);
    box-shadow:
      0 0 0 8px rgba(255, 255, 255, 0),
      0 0 16px rgba(255, 255, 255, 0.82),
      18px 36px 0 -3px rgba(255, 255, 255, 0.86),
      -28px 56px 0 -4px rgba(255, 255, 255, 0.72),
      0 0 24px rgba(54, 214, 255, 0.36) !important;
  }

  58% {
    opacity: 0.55;
    transform: translate3d(2px, -5px, 0) scale(0.94) rotate(35deg);
  }
}

@media (max-width: 720px) {
  #dhm-products-section .dhm-product-photo {
    height: 168px !important;
    padding: 6px !important;
    border-width: 15px !important;
    border-radius: 22px !important;
  }

  #dhm-products-section .dhm-product-card:hover .dhm-product-photo,
  #dhm-products-section .dhm-product-card:focus-within .dhm-product-photo,
  #dhm-products-section .dhm-product-card.is-product-active .dhm-product-photo {
    transform: translate3d(0, -4px, 0) scale(1.028) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #dhm-products-section .dhm-product-photo {
    transition: none !important;
  }

  #dhm-products-section .dhm-product-card:hover .dhm-product-photo,
  #dhm-products-section .dhm-product-card:focus-within .dhm-product-photo,
  #dhm-products-section .dhm-product-card.is-product-active .dhm-product-photo {
    transform: none !important;
  }

  #dhm-products-section .dhm-product-card:hover .dhm-product-image::after,
  #dhm-products-section .dhm-product-card:focus-within .dhm-product-image::after,
  #dhm-products-section .dhm-product-card.is-product-active .dhm-product-image::after {
    animation: none !important;
  }
}

/* FINAL PRODUCT SECTION ECOMMERCE ALIGNMENT + HARD IMAGE SIZE FIX */
#dhm-products-section .dhm-product-grid {
  align-items: stretch !important;
}

#dhm-products-section .dhm-product-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-height: 100% !important;
}

#dhm-products-section .dhm-product-image {
  position: relative !important;
  min-height: 255px !important;
  height: 255px !important;
  padding: 22px 18px 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  background: linear-gradient(180deg, #f3fbff 0%, #ffffff 100%) !important;
}

#dhm-products-section .dhm-product-photo {
  width: auto !important;
  height: auto !important;
  max-width: 190px !important;
  max-height: 190px !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
  box-sizing: border-box !important;
  padding: 8px !important;
  background: #ffffff !important;
  border: 15px solid #ffffff !important;
  border-radius: 24px !important;
  box-shadow:
    0 16px 34px rgba(5, 43, 79, 0.22),
    0 0 0 1px rgba(10, 167, 223, 0.10),
    0 0 22px rgba(255, 255, 255, 0.36) !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
}

#dhm-products-section .dhm-product-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  height: 100% !important;
}

#dhm-products-section .dhm-product-content p {
  min-height: 48px !important;
}

#dhm-products-section .dhm-product-content ul {
  flex: 1 1 auto !important;
}

#dhm-products-section .dhm-product-content .dhm-btn {
  margin-top: auto !important;
  width: 100% !important;
}

#dhm-products-section .dhm-product-card:hover .dhm-product-photo,
#dhm-products-section .dhm-product-card:focus-within .dhm-product-photo,
#dhm-products-section .dhm-product-card.is-product-active .dhm-product-photo {
  transform: translate3d(0, -6px, 0) scale(1.035) !important;
}

@media (min-width: 981px) {
  #dhm-products-section .dhm-product-grid {
    align-items: stretch !important;
  }

  #dhm-products-section .dhm-product-card {
    min-height: 590px !important;
  }
}

@media (max-width: 720px) {
  #dhm-products-section .dhm-product-card {
    height: auto !important;
    min-height: 500px !important;
  }

  #dhm-products-section .dhm-product-image {
    min-height: 205px !important;
    height: 205px !important;
    padding: 18px 14px 10px !important;
  }

  #dhm-products-section .dhm-product-photo {
    max-width: 145px !important;
    max-height: 145px !important;
    padding: 6px !important;
    border-width: 15px !important;
    border-radius: 22px !important;
  }

  #dhm-products-section .dhm-product-content p {
    min-height: 0 !important;
  }

  #dhm-products-section .dhm-product-card:hover .dhm-product-photo,
  #dhm-products-section .dhm-product-card:focus-within .dhm-product-photo,
  #dhm-products-section .dhm-product-card.is-product-active .dhm-product-photo {
    transform: translate3d(0, -4px, 0) scale(1.02) !important;
  }
}


/* Product cards: keep one eyebrow label only; hide surplus badge labels */
#dhm-products-section .dhm-badge {
  display: none !important;
}

/* FINAL PRODUCT IMAGE SIZE BALANCE: larger product, smaller white border */
#dhm-products-section .dhm-product-image {
  min-height: 300px !important;
  height: 300px !important;
  padding: 24px 18px 14px !important;
}

#dhm-products-section .dhm-product-photo {
  max-width: 245px !important;
  max-height: 245px !important;
  padding: 4px !important;
  border: 5px solid #ffffff !important;
  border-radius: 18px !important;
  box-shadow:
    0 14px 30px rgba(5, 43, 79, 0.20),
    0 0 0 1px rgba(10, 167, 223, 0.10),
    0 0 18px rgba(255, 255, 255, 0.30) !important;
}

#dhm-products-section .dhm-product-card:hover .dhm-product-photo,
#dhm-products-section .dhm-product-card:focus-within .dhm-product-photo,
#dhm-products-section .dhm-product-card.is-product-active .dhm-product-photo {
  transform: translate3d(0, -5px, 0) scale(1.045) !important;
}

@media (min-width: 981px) {
  #dhm-products-section .dhm-product-card {
    min-height: 610px !important;
  }
}

@media (max-width: 720px) {
  #dhm-products-section .dhm-product-image {
    min-height: 245px !important;
    height: 245px !important;
    padding: 20px 14px 10px !important;
  }

  #dhm-products-section .dhm-product-photo {
    max-width: 190px !important;
    max-height: 190px !important;
    padding: 4px !important;
    border-width: 5px !important;
    border-radius: 16px !important;
  }
}

/* FINAL PRODUCT IMAGE FRAME UPDATE: no border, rounded corners only */
#dhm-products-section .dhm-product-photo {
  border: none !important;
  padding: 0 !important;
  border-radius: 20px !important;
  box-shadow:
    0 16px 34px rgba(5, 43, 79, 0.22),
    0 0 20px rgba(54, 214, 255, 0.16) !important;
}

#dhm-products-section .dhm-product-card:hover .dhm-product-photo,
#dhm-products-section .dhm-product-card:focus-within .dhm-product-photo,
#dhm-products-section .dhm-product-card.is-product-active .dhm-product-photo {
  transform: translate3d(0, -5px, 0) scale(1.045) !important;
  box-shadow:
    0 18px 40px rgba(5, 43, 79, 0.26),
    0 0 24px rgba(54, 214, 255, 0.24) !important;
}

@media (max-width: 720px) {
  #dhm-products-section .dhm-product-photo {
    border: none !important;
    padding: 0 !important;
    border-radius: 18px !important;
  }
}

/* =========================================================
   HOMEPAGE COMPLETION SECTIONS
========================================================= */

.dhm-home-dose,
.dhm-home-results,
.dhm-home-learning,
.dhm-home-faq {
  position: relative;
  overflow: hidden;
  padding: clamp(58px, 7vw, 96px) 20px;
}

.dhm-home-dose {
  background:
    radial-gradient(circle at 12% 14%, rgba(54,214,255,0.18), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #f3fbff 100%);
}

.dhm-home-dose__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.82fr);
  gap: clamp(26px, 5vw, 58px);
  align-items: center;
}

.dhm-home-dose__copy h2,
.dhm-home-results .dhm-section-head h2,
.dhm-home-learning__head h2,
.dhm-home-faq__intro h2,
.dhm-home-final h2,
.dhm-home-retail h2 {
  margin: 0 0 16px;
  color: var(--dhm-navy);
  font-size: clamp(34px, 4vw, 56px);
  line-height: 1.05;
  letter-spacing: -0.045em;
}

.dhm-home-dose__copy p,
.dhm-home-learning__head p,
.dhm-home-faq__intro p {
  margin: 0 0 22px;
  color: var(--dhm-muted);
  font-size: 18px;
  line-height: 1.62;
}

.dhm-home-dose__list {
  display: grid;
  gap: 12px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.dhm-home-dose__list li {
  position: relative;
  padding-left: 32px;
  color: var(--dhm-text);
  font-size: 16px;
  line-height: 1.45;
}

.dhm-home-dose__list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0.05em;
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--dhm-aqua), var(--dhm-blue));
  font-size: 12px;
  font-weight: 900;
}

.dhm-home-dose__card {
  padding: clamp(24px, 4vw, 38px);
  border: 1px solid var(--dhm-border);
  border-radius: 32px;
  background:
    radial-gradient(circle at 18% 12%, rgba(54,214,255,0.20), transparent 34%),
    #ffffff;
  box-shadow: var(--dhm-shadow);
}

.dhm-home-dose__card label {
  display: block;
  margin-bottom: 10px;
  color: var(--dhm-navy);
  font-weight: 900;
}

.dhm-home-dose__controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.dhm-home-dose__controls input {
  width: 100%;
  min-height: 52px;
  padding: 0 16px;
  border: 1px solid rgba(7,95,159,0.24);
  border-radius: 18px;
  color: var(--dhm-navy);
  background: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.6);
  font-size: 18px;
  font-weight: 900;
}

.dhm-home-dose__result {
  display: block;
  margin: 18px 0 12px;
  padding: 18px;
  border-radius: 22px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--dhm-navy), var(--dhm-blue));
  box-shadow: 0 14px 30px rgba(5,43,79,0.18);
  font-size: 20px;
  font-weight: 900;
  line-height: 1.25;
}

.dhm-home-dose__help {
  margin: 0 0 14px;
  color: var(--dhm-muted);
  font-size: 15px;
  line-height: 1.55;
}

.dhm-home-dose__link,
.dhm-home-learning__link,
.dhm-home-retail__link {
  color: var(--dhm-blue);
  font-weight: 900;
  text-decoration: none;
  border-bottom: 2px solid rgba(10,167,223,0.28);
  padding-bottom: 4px;
}

.dhm-home-results {
  background:
    radial-gradient(circle at 84% 10%, rgba(54,214,255,0.18), transparent 30%),
    linear-gradient(180deg, #f3fbff 0%, #ffffff 100%);
}

.dhm-home-results__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.dhm-home-result-card {
  position: relative;
  overflow: hidden;
  min-height: 330px;
  padding: 28px;
  border-radius: 32px;
  color: #ffffff;
  box-shadow: var(--dhm-shadow);
  background:
    radial-gradient(circle at 24% 20%, rgba(255,255,255,0.28), transparent 30%),
    linear-gradient(135deg, var(--card-start), var(--card-end));
}

.dhm-home-result-card::after {
  content: "";
  position: absolute;
  right: -70px;
  bottom: -70px;
  width: 210px;
  height: 210px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.26);
  box-shadow: 0 0 0 34px rgba(255,255,255,0.06);
}

.dhm-home-result-card--before {
  --card-start: #2f6f75;
  --card-end: #7aa089;
}

.dhm-home-result-card--during {
  --card-start: #075f9f;
  --card-end: #36d6ff;
}

.dhm-home-result-card--after {
  --card-start: #0aa7df;
  --card-end: #bceeff;
}

.dhm-home-result-card span {
  display: inline-flex;
  margin-bottom: 84px;
  padding: 7px 13px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.36);
  background: rgba(255,255,255,0.18);
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.dhm-home-result-card__copy {
  position: relative;
  z-index: 2;
  padding: 18px 20px;
  border-radius: 22px;
  background: rgba(80, 80, 80, 0.45);
  backdrop-filter: blur(2px);
}

.dhm-home-result-card h3 {
  position: relative;
  z-index: 2;
  margin: 0 0 10px;
  color: #ffffff;
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.05;
  letter-spacing: -0.04em;
}

.dhm-home-result-card p {
  position: relative;
  z-index: 2;
  margin: 0;
  color: rgba(255,255,255,0.90);
  font-size: 16px;
  line-height: 1.58;
}

.dhm-home-retail {
  position: relative;
  overflow: hidden;
  padding: clamp(58px, 7vw, 96px) 20px;
  background: #ffffff;
}

.dhm-home-retail__panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding: clamp(30px, 5vw, 58px);
  border-radius: 36px;
  color: #ffffff;
  background:
    radial-gradient(circle at 16% 18%, rgba(54,214,255,0.28), transparent 34%),
    linear-gradient(135deg, var(--dhm-navy), var(--dhm-blue));
  box-shadow: var(--dhm-shadow);
}

.dhm-home-retail h2,
.dhm-home-final h2 {
  color: #ffffff;
}

.dhm-home-retail__copy p,
.dhm-home-final__panel p {
  max-width: 720px;
  margin: 0;
  color: rgba(255,255,255,0.88);
  font-size: 18px;
  line-height: 1.62;
}

.dhm-home-retail__actions,
.dhm-home-final__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  flex: 0 0 auto;
}

.dhm-home-retail__link {
  color: #ffffff;
  border-bottom-color: rgba(255,255,255,0.40);
}

.dhm-home-learning {
  background:
    radial-gradient(circle at 10% 12%, rgba(54,214,255,0.16), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #f3fbff 100%);
}

.dhm-home-learning__grid {
  display: grid;
  grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(26px, 5vw, 58px);
  align-items: start;
}

.dhm-home-learning__head {
  position: sticky;
  top: 116px;
}

.dhm-home-learning__cards {
  display: grid;
  gap: 18px;
}

.dhm-home-learning-card {
  display: block;
  padding: 26px;
  border: 1px solid var(--dhm-border);
  border-radius: 28px;
  background: #ffffff;
  box-shadow: 0 14px 34px rgba(5,43,79,0.10);
  text-decoration: none;
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.dhm-home-learning-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 44px rgba(5,43,79,0.14);
}

.dhm-home-learning-card span {
  display: inline-flex;
  margin-bottom: 12px;
  color: var(--dhm-blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.dhm-home-learning-card h3 {
  margin: 0 0 9px;
  color: var(--dhm-navy);
  font-size: clamp(23px, 2.4vw, 32px);
  line-height: 1.1;
  letter-spacing: -0.035em;
}

.dhm-home-learning-card p {
  margin: 0;
  color: var(--dhm-muted);
  font-size: 16px;
  line-height: 1.55;
}

.dhm-home-faq {
  background: #ffffff;
}

.dhm-home-faq__grid {
  display: grid;
  grid-template-columns: minmax(280px, 0.78fr) minmax(0, 1.22fr);
  gap: clamp(26px, 5vw, 58px);
  align-items: start;
}

.dhm-home-faq__intro .dhm-btn {
  margin-top: 8px;
}

.dhm-home-faq__items {
  display: grid;
  gap: 14px;
}

.dhm-home-faq__item {
  border: 1px solid var(--dhm-border);
  border-radius: 24px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(5,43,79,0.08);
  overflow: hidden;
}

.dhm-home-faq__item summary {
  cursor: pointer;
  padding: 20px 56px 20px 22px;
  color: var(--dhm-navy);
  font-size: 18px;
  font-weight: 900;
  list-style: none;
  position: relative;
}

.dhm-home-faq__item summary::-webkit-details-marker {
  display: none;
}

.dhm-home-faq__item summary::after {
  content: "+";
  position: absolute;
  right: 22px;
  top: 50%;
  width: 30px;
  height: 30px;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--dhm-aqua), var(--dhm-blue));
  font-size: 20px;
  line-height: 1;
}

.dhm-home-faq__item[open] summary::after {
  content: "–";
}

.dhm-home-faq__item p {
  margin: 0;
  padding: 0 22px 22px;
  color: var(--dhm-muted);
  font-size: 16px;
  line-height: 1.58;
}

.dhm-home-final {
  position: relative;
  overflow: hidden;
  padding: clamp(58px, 7vw, 96px) 20px;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,0.34), transparent 27%),
    radial-gradient(circle at 78% 28%, rgba(54, 214, 255, 0.32), transparent 34%),
    linear-gradient(135deg, #0a7fc5 0%, #10b7ec 45%, #74ddff 100%);
}

.dhm-home-final__panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding: clamp(30px, 5vw, 58px);
  border: 1px solid rgba(255,255,255,0.34);
  border-radius: 36px;
  background: rgba(5,43,79,0.28);
  box-shadow: 0 24px 60px rgba(5,43,79,0.20);
  backdrop-filter: blur(12px);
}

@media (max-width: 980px) {
  .dhm-home-dose__grid,
  .dhm-home-learning__grid,
  .dhm-home-faq__grid {
    grid-template-columns: 1fr;
  }

  .dhm-home-learning__head {
    position: static;
    top: auto;
    text-align: center;
    max-width: 760px;
    margin: 0 auto;
  }

  .dhm-home-results__grid {
    grid-template-columns: 1fr;
    max-width: 620px;
    margin: 0 auto;
  }

  .dhm-home-retail__panel,
  .dhm-home-final__panel {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 720px) {
  .dhm-home-dose,
  .dhm-home-results,
  .dhm-home-retail,
  .dhm-home-learning,
  .dhm-home-faq,
  .dhm-home-final {
    padding: 46px 16px;
  }

  .dhm-home-dose__copy,
  .dhm-home-faq__intro,
  .dhm-section-head {
    text-align: center;
  }

  .dhm-home-dose__controls {
    grid-template-columns: 1fr;
  }

  .dhm-home-dose__controls .dhm-btn,
  .dhm-home-retail__actions,
  .dhm-home-retail__actions .dhm-btn,
  .dhm-home-final__actions,
  .dhm-home-final__actions .dhm-btn {
    width: 100%;
  }

  .dhm-home-result-card {
    min-height: 280px;
  }

  .dhm-home-result-card span {
    margin-bottom: 58px;
  }
}

/* =========================================================
   DOSING CALCULATOR POPUP
========================================================= */
html.dhm-dose-modal-open,
body.dhm-dose-modal-open {
  overflow: hidden;
}

.dhm-dose-modal {
  position: fixed;
  inset: 0;
  z-index: 2147483001;
  display: none;
  align-items: center;
  justify-content: center;
  padding: clamp(16px, 3vw, 34px);
}

.dhm-dose-modal.is-open {
  display: flex;
}

.dhm-dose-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(2, 29, 56, 0.72);
  backdrop-filter: blur(8px);
}

.dhm-dose-modal__dialog {
  position: relative;
  z-index: 2;
  width: min(720px, 100%);
  max-height: min(92vh, 860px);
  overflow-y: auto;
  padding: clamp(24px, 4vw, 38px);
  border: 1px solid rgba(255,255,255,0.48);
  border-radius: 32px;
  background:
    radial-gradient(circle at 12% 10%, rgba(54,214,255,0.20), transparent 32%),
    linear-gradient(180deg, #ffffff 0%, #f3fbff 100%);
  box-shadow:
    0 34px 90px rgba(2, 29, 56, 0.34),
    inset 0 0 0 1px rgba(255,255,255,0.70);
  outline: none;
}

.dhm-dose-modal__close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 42px;
  height: 42px;
  border: none;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(7,95,159,0.10);
  color: var(--dhm-navy, #052b4f);
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
  transition: transform 0.2s ease, background 0.2s ease;
}

.dhm-dose-modal__close:hover {
  transform: scale(1.06);
  background: rgba(10,167,223,0.18);
}

.dhm-dose-modal__head {
  max-width: 560px;
  margin-bottom: 22px;
  padding-right: 42px;
}

.dhm-dose-modal__head h2 {
  margin: 0 0 12px;
  color: var(--dhm-navy, #052b4f);
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.04;
  letter-spacing: -0.045em;
}

.dhm-dose-modal__head p {
  margin: 0;
  color: var(--dhm-muted, #5f7488);
  font-size: 17px;
  line-height: 1.55;
}

.dhm-dose-modal__calculator {
  display: grid;
  gap: 16px;
}

.dhm-dose-modal__calculator label {
  color: var(--dhm-navy, #052b4f);
  font-weight: 900;
}

.dhm-dose-modal__controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.dhm-dose-modal__controls input {
  width: 100%;
  min-height: 54px;
  padding: 0 18px;
  border: 1px solid rgba(7,95,159,0.20);
  border-radius: 999px;
  background: #ffffff;
  color: var(--dhm-navy, #052b4f);
  font-size: 18px;
  font-weight: 900;
  box-shadow: inset 0 2px 8px rgba(5,43,79,0.06);
}

.dhm-dose-modal__result {
  display: grid;
  gap: 6px;
  padding: 18px 20px;
  border: 1px solid rgba(10,167,223,0.24);
  border-radius: 22px;
  background:
    radial-gradient(circle at 92% 16%, rgba(54,214,255,0.16), transparent 32%),
    #ffffff;
  box-shadow: 0 14px 36px rgba(5,43,79,0.10);
}

.dhm-dose-modal__result-label {
  color: var(--dhm-muted, #5f7488);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.dhm-dose-modal__result strong {
  color: var(--dhm-blue, #075f9f);
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.05;
}

.dhm-dose-modal__result small {
  color: var(--dhm-muted, #5f7488);
  font-size: 14px;
  line-height: 1.4;
}

.dhm-dose-modal__product {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  padding: 18px;
  border: 1px solid rgba(7,95,159,0.16);
  border-radius: 26px;
  background: rgba(255,255,255,0.76);
  box-shadow: 0 16px 40px rgba(5,43,79,0.10);
}

.dhm-dose-modal__product-image {
  min-height: 180px;
  display: grid;
  place-items: center;
  border-radius: 22px;
  background:
    radial-gradient(circle at 50% 20%, rgba(54,214,255,0.14), transparent 38%),
    #ffffff;
}

.dhm-dose-modal__product-image img {
  max-width: 150px;
  max-height: 150px;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 16px;
  filter: drop-shadow(0 14px 20px rgba(5,43,79,0.18));
}

.dhm-dose-modal__product-copy h3 {
  margin: 0 0 8px;
  color: var(--dhm-navy, #052b4f);
  font-size: clamp(22px, 3vw, 30px);
  line-height: 1.1;
  letter-spacing: -0.03em;
}

.dhm-dose-modal__product-copy p {
  margin: 0 0 14px;
  color: var(--dhm-muted, #5f7488);
  line-height: 1.55;
}

.dhm-dose-modal__shopify {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 18px;
  border: 1px dashed rgba(7,95,159,0.30);
  border-radius: 999px;
  background: rgba(10,167,223,0.08);
  color: var(--dhm-blue, #075f9f);
  font-size: 13px;
  font-weight: 900;
}

.dhm-dose-modal__note {
  margin: 0;
  color: var(--dhm-muted, #5f7488);
  font-size: 13px;
  line-height: 1.45;
}

@media (max-width: 720px) {
  .dhm-dose-modal {
    align-items: flex-end;
    padding: 10px;
  }

  .dhm-dose-modal__dialog {
    width: 100%;
    max-height: 94vh;
    border-radius: 28px;
    padding: 24px 18px 20px;
  }

  .dhm-dose-modal__head {
    padding-right: 46px;
  }

  .dhm-dose-modal__controls,
  .dhm-dose-modal__product {
    grid-template-columns: 1fr;
  }

  .dhm-dose-modal__controls .dhm-btn {
    width: 100%;
  }

  .dhm-dose-modal__product {
    text-align: center;
  }

  .dhm-dose-modal__product-image {
    min-height: 150px;
  }

  .dhm-dose-modal__product-image img {
    max-width: 132px;
    max-height: 132px;
  }

  .dhm-dose-modal__shopify {
    width: 100%;
  }
}


/* Condensed dosing popup update */
.dhm-dose-modal__dialog {
  width: min(600px, 100%) !important;
  max-height: min(86vh, 680px) !important;
  padding: clamp(18px, 3vw, 26px) !important;
  border-radius: 26px !important;
}

.dhm-dose-modal__head {
  max-width: 460px !important;
  margin-bottom: 14px !important;
}

.dhm-dose-modal__head .dhm-eyebrow {
  margin-bottom: 8px !important;
}

.dhm-dose-modal__head h2 {
  margin-bottom: 6px !important;
  font-size: clamp(28px, 3.2vw, 38px) !important;
}

.dhm-dose-modal__head p {
  font-size: 15px !important;
  line-height: 1.4 !important;
}

.dhm-dose-modal__calculator {
  gap: 10px !important;
}

.dhm-dose-modal__calculator label {
  font-size: 14px !important;
}

.dhm-dose-modal__controls input {
  min-height: 48px !important;
  font-size: 16px !important;
}

.dhm-dose-modal__controls .dhm-btn {
  min-height: 48px !important;
  padding: 12px 22px !important;
}

.dhm-dose-modal__result[hidden],
.dhm-dose-modal__product[hidden] {
  display: none !important;
}

.dhm-dose-modal__result {
  gap: 4px !important;
  padding: 12px 16px !important;
  border-radius: 18px !important;
}

.dhm-dose-modal__result strong {
  font-size: clamp(21px, 2.4vw, 28px) !important;
}

.dhm-dose-modal__result small {
  font-size: 13px !important;
}

.dhm-dose-modal__product {
  grid-template-columns: 112px minmax(0, 1fr) !important;
  gap: 14px !important;
  padding: 12px !important;
  border-radius: 20px !important;
}

.dhm-dose-modal__product-image {
  min-height: 112px !important;
  border-radius: 16px !important;
}

.dhm-dose-modal__product-image img {
  max-width: 92px !important;
  max-height: 92px !important;
  border-radius: 12px !important;
}

.dhm-dose-modal__product-copy h3 {
  margin-bottom: 4px !important;
  font-size: clamp(20px, 2.4vw, 25px) !important;
}

.dhm-dose-modal__product-copy p {
  margin-bottom: 8px !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}

.dhm-dose-modal__shopify {
  min-height: 42px !important;
  padding: 10px 14px !important;
}

.dhm-dose-modal__note {
  font-size: 12px !important;
  line-height: 1.35 !important;
}

@media (max-width: 720px) {
  .dhm-dose-modal {
    align-items: center !important;
    padding: 10px !important;
  }

  .dhm-dose-modal__dialog {
    max-height: 88vh !important;
    padding: 18px 14px 16px !important;
    border-radius: 22px !important;
  }

  .dhm-dose-modal__close {
    top: 10px !important;
    right: 10px !important;
    width: 36px !important;
    height: 36px !important;
    font-size: 26px !important;
  }

  .dhm-dose-modal__head {
    padding-right: 38px !important;
    margin-bottom: 12px !important;
  }

  .dhm-dose-modal__controls,
  .dhm-dose-modal__product {
    grid-template-columns: 1fr !important;
  }

  .dhm-dose-modal__product {
    text-align: center !important;
    gap: 10px !important;
  }

  .dhm-dose-modal__product-image {
    min-height: 96px !important;
  }

  .dhm-dose-modal__product-image img {
    max-width: 84px !important;
    max-height: 84px !important;
  }
}


/* FINAL MODAL REAL ESTATE + DESKTOP SCROLLBAR CLEANUP */
@media (min-width: 981px) {
  html,
  body {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  html::-webkit-scrollbar,
  body::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
  }
}

.dhm-dose-modal,
.dhm-dose-modal * {
  box-sizing: border-box;
}

.dhm-dose-modal__dialog {
  width: min(560px, 100%) !important;
  max-height: min(82vh, 620px) !important;
  overflow-y: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  padding: clamp(12px, 2vw, 19px) !important;
  border-radius: 24px !important;
}

.dhm-dose-modal__dialog::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.dhm-dose-modal__head {
  margin-bottom: 8px !important;
  padding-right: 38px !important;
}

.dhm-dose-modal__eyebrow,
.dhm-dose-modal__head .dhm-eyebrow {
  margin: 0 0 5px !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  background: rgba(10,167,223,0.10) !important;
  color: var(--dhm-blue, #075f9f) !important;
  border: 1px solid rgba(10,167,223,0.18) !important;
  box-shadow: none !important;
  font-size: 10px !important;
  line-height: 1 !important;
  letter-spacing: 0.08em !important;
  font-weight: 900 !important;
}

.dhm-dose-modal__head h2 {
  margin: 0 0 4px !important;
  font-size: clamp(25px, 3vw, 34px) !important;
  line-height: 1 !important;
}

.dhm-dose-modal__head p {
  font-size: 13px !important;
  line-height: 1.3 !important;
}

.dhm-dose-modal__calculator {
  gap: 7px !important;
}

.dhm-dose-modal__calculator label {
  font-size: 12px !important;
  line-height: 1.2 !important;
}

.dhm-dose-modal__controls {
  gap: 8px !important;
}

.dhm-dose-modal__controls input {
  min-height: 42px !important;
  padding: 0 14px !important;
  font-size: 15px !important;
}

.dhm-dose-modal__controls .dhm-btn {
  min-height: 42px !important;
  padding: 9px 17px !important;
  font-size: 14px !important;
}

.dhm-dose-modal__result {
  padding: 9px 10px !important;
  border-radius: 16px !important;
}

.dhm-dose-modal__result-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
}

.dhm-dose-modal__metric {
  min-width: 0;
  padding: 8px 9px;
  border-radius: 14px;
  background: rgba(243,251,255,0.78);
  border: 1px solid rgba(7,95,159,0.10);
}

.dhm-dose-modal__result-label {
  display: block !important;
  margin-bottom: 3px !important;
  font-size: 9px !important;
  line-height: 1.1 !important;
  letter-spacing: 0.08em !important;
}

.dhm-dose-modal__metric strong,
.dhm-dose-modal__result strong {
  display: block !important;
  font-size: clamp(18px, 2.1vw, 24px) !important;
  line-height: 1 !important;
  word-break: normal !important;
}

.dhm-dose-modal__metric small,
.dhm-dose-modal__result small {
  display: block !important;
  margin-top: 4px !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
}

.dhm-dose-modal__product {
  grid-template-columns: 86px minmax(0, 1fr) !important;
  gap: 9px !important;
  padding: 9px !important;
  border-radius: 17px !important;
}

.dhm-dose-modal__product-image {
  min-height: 86px !important;
  border-radius: 14px !important;
}

.dhm-dose-modal__product-image img {
  max-width: 72px !important;
  max-height: 72px !important;
  border-radius: 10px !important;
}

.dhm-dose-modal__product-copy h3 {
  margin-bottom: 3px !important;
  font-size: clamp(18px, 2.1vw, 22px) !important;
}

.dhm-dose-modal__product-copy p {
  margin-bottom: 6px !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
}

.dhm-dose-modal__shopify {
  min-height: 34px !important;
  padding: 7px 10px !important;
  font-size: 11px !important;
}

.dhm-dose-modal__note {
  font-size: 11px !important;
  line-height: 1.25 !important;
}

.dhm-dose-modal__close {
  top: 9px !important;
  right: 9px !important;
  width: 34px !important;
  height: 34px !important;
  font-size: 24px !important;
}

@media (max-width: 720px) {
  .dhm-dose-modal {
    padding: 8px !important;
  }

  .dhm-dose-modal__dialog {
    max-height: 86vh !important;
    padding: 12px !important;
    border-radius: 20px !important;
  }

  .dhm-dose-modal__result-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
  }

  .dhm-dose-modal__metric {
    padding: 7px !important;
  }

  .dhm-dose-modal__metric strong,
  .dhm-dose-modal__result strong {
    font-size: clamp(16px, 5vw, 20px) !important;
  }

  .dhm-dose-modal__metric small,
  .dhm-dose-modal__result small {
    font-size: 10px !important;
  }

  .dhm-dose-modal__product {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    text-align: left !important;
    gap: 8px !important;
  }

  .dhm-dose-modal__product-image {
    min-height: 72px !important;
  }

  .dhm-dose-modal__product-image img {
    max-width: 60px !important;
    max-height: 60px !important;
  }
}

/* Dosing modal: multi-tub recommendation lines */
.dhm-dose-modal__combo {
  display: grid !important;
  gap: 2px !important;
  align-content: center !important;
}

.dhm-dose-modal__combo-line {
  display: block !important;
  font-size: clamp(14px, 1.7vw, 19px) !important;
  line-height: 1.08 !important;
  white-space: nowrap !important;
}

.dhm-dose-modal__shopify[data-dhm-shopify-item] {
  font-size: 11px !important;
  line-height: 1.25 !important;
}

@media (max-width: 520px) {
  .dhm-dose-modal__combo-line {
    font-size: clamp(12px, 3.8vw, 16px) !important;
    white-space: normal !important;
  }
}

/* Dosing modal: highlight cheapest valid combination */
.dhm-dose-modal__value-pill {
  display: inline-flex !important;
  width: fit-content !important;
  margin-top: 5px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(54,214,255,0.22), rgba(10,167,223,0.12)) !important;
  border: 1px solid rgba(10,167,223,0.20) !important;
  color: var(--dhm-blue, #075f9f) !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
  font-style: normal !important;
  font-weight: 900 !important;
  letter-spacing: 0.01em !important;
}

@media (max-width: 520px) {
  .dhm-dose-modal__value-pill {
    font-size: 9px !important;
    padding: 4px 7px !important;
  }
}

/* Dosing modal: dynamic heading/price layout */
.dhm-dose-modal__product-copy h3 {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-bottom: 4px !important;
}

.dhm-dose-modal__product-copy h3 > span {
  min-width: 0 !important;
  color: var(--dhm-navy, #052b4f) !important;
  font-size: clamp(18px, 2.2vw, 24px) !important;
  line-height: 1 !important;
}

.dhm-dose-modal__product-price {
  flex: 0 0 auto !important;
  color: var(--dhm-blue, #075f9f) !important;
  font-size: clamp(22px, 2.8vw, 32px) !important;
  line-height: 0.95 !important;
  font-weight: 950 !important;
  letter-spacing: -0.04em !important;
}

.dhm-dose-modal__shopify {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

.dhm-dose-modal__value-pill:empty {
  display: none !important;
}

@media (max-width: 520px) {
  .dhm-dose-modal__product-copy h3 {
    gap: 7px !important;
  }

  .dhm-dose-modal__product-copy h3 > span {
    font-size: 17px !important;
  }

  .dhm-dose-modal__product-price {
    font-size: 22px !important;
  }
}


/* Dosing modal: final heading/price alignment */
.dhm-dose-modal__product-copy h3 {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 4px 10px !important;
  margin-bottom: 4px !important;
}

.dhm-dose-modal__product-copy h3 > span,
.dhm-dose-modal__product-price {
  color: var(--dhm-navy, #052b4f) !important;
  font-size: clamp(20px, 2.3vw, 28px) !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: -0.04em !important;
}

.dhm-dose-modal__product-copy h3 > span {
  min-width: 0 !important;
}

.dhm-dose-modal__product-price {
  flex: 0 0 auto !important;
}

.dhm-dose-modal__value-pill--heading {
  order: -1 !important;
  flex: 0 0 100% !important;
  margin: 0 0 2px !important;
}

.dhm-dose-modal__metric .dhm-dose-modal__value-pill {
  display: none !important;
}

@media (max-width: 520px) {
  .dhm-dose-modal__product-copy h3 {
    gap: 3px 8px !important;
  }

  .dhm-dose-modal__product-copy h3 > span,
  .dhm-dose-modal__product-price {
    font-size: 20px !important;
  }
}

/* Pool prep calculator button and modal */
.dhm-home-how__mini-button {
  width: fit-content !important;
  min-height: 38px !important;
  margin-top: 12px !important;
  padding: 9px 16px !important;
  font-size: 13px !important;
}

.dhm-chem-modal__fields {
  display: grid;
  grid-template-columns: 1fr 0.72fr;
  gap: 8px;
}

.dhm-chem-modal__fields label {
  display: grid !important;
  gap: 5px !important;
}

.dhm-chem-modal__fields input {
  min-height: 42px !important;
  width: 100% !important;
  padding: 0 14px !important;
  border: 1px solid rgba(7,95,159,0.18) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: var(--dhm-navy, #052b4f) !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  outline: none !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.7) !important;
}

.dhm-chem-modal__fields input:focus {
  border-color: rgba(10,167,223,0.55) !important;
  box-shadow: 0 0 0 3px rgba(54,214,255,0.16) !important;
}

.dhm-chem-modal__button {
  width: 100% !important;
}

.dhm-chem-modal__result {
  display: grid !important;
  gap: 8px !important;
}

.dhm-chem-modal__result[hidden] {
  display: none !important;
}

.dhm-chem-modal__summary {
  display: grid;
  gap: 3px;
  padding: 8px 10px;
  border-radius: 14px;
  background: rgba(220,252,231,0.62);
  border: 1px solid rgba(34,197,94,0.18);
}

.dhm-chem-modal__summary span {
  color: var(--dhm-muted, #5f7488);
  font-size: 11px;
  font-weight: 800;
}

.dhm-chem-modal__summary strong {
  color: var(--dhm-navy, #052b4f);
  font-size: 14px !important;
  line-height: 1.15 !important;
}

.dhm-chem-modal__metric-wide {
  grid-column: 1 / -1;
}

@media (max-width: 720px) {
  .dhm-home-how__mini-button {
    width: auto !important;
  }

  .dhm-chem-modal__fields {
    grid-template-columns: 1fr 0.68fr;
    gap: 7px;
  }

  .dhm-chem-modal__fields input {
    min-height: 40px !important;
    padding: 0 12px !important;
    font-size: 14px !important;
  }
}

/* Prepare pool card list + prep calculator button sizing fix */
.dhm-home-how__prep-list {
  margin: 0 0 14px !important;
  padding: 0 !important;
  list-style: none !important;
  display: grid !important;
  gap: 8px !important;
}

.dhm-home-how__prep-list li {
  position: relative !important;
  margin: 0 !important;
  padding-left: 24px !important;
  color: var(--dhm-muted, #5f7488) !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
}

.dhm-home-how__prep-list li::before {
  content: "✓" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0.12em !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 999px !important;
  display: inline-grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, #36d6ff, #075f9f) !important;
  color: #ffffff !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  box-shadow: 0 6px 14px rgba(7,95,159,0.16) !important;
}

.dhm-home-how__mini-button,
button.dhm-home-how__mini-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 150px !important;
  max-width: max-content !important;
  min-height: 44px !important;
  margin-top: 2px !important;
  padding: 11px 20px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
  line-height: 1 !important;
  font-size: 14px !important;
}

@media (max-width: 720px) {
  .dhm-home-how__mini-button,
  button.dhm-home-how__mini-button {
    width: auto !important;
    min-width: 170px !important;
    max-width: 100% !important;
  }
}


/* Final prepare-pool calculator CTA buttons */
.dhm-home-how__step .dhm-home-how__mini-button,
.dhm-home-how__step button.dhm-home-how__mini-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 178px !important;
  max-width: 100% !important;
  min-height: 50px !important;
  margin-top: 14px !important;
  padding: 14px 26px !important;
  border-radius: 999px !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

@media (max-width: 720px) {
  .dhm-home-how__step .dhm-home-how__mini-button,
  .dhm-home-how__step button.dhm-home-how__mini-button {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* Final homepage prep/Dazzle calculator CTA placement */
.dhm-home-how__step .dhm-home-how__mini-button,
.dhm-home-how__step button.dhm-home-how__mini-button {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 50px !important;
  margin: 16px 0 0 !important;
  padding: 14px 24px !important;
  border-radius: 999px !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: normal !important;
  line-height: 1.15 !important;
  font-size: 15px !important;
  font-weight: 900 !important;
}

.dhm-home-how__step > div {
  width: 100% !important;
}


/* FINAL FIX: homepage how-to calculator buttons full-width + premium CTA style */
.dhm-home-how__step .dhm-home-how__mini-button,
.dhm-home-how__step button.dhm-home-how__mini-button,
.dhm-home-how__step .dhm-btn.dhm-home-how__mini-button,
.dhm-home-how__step button.dhm-btn.dhm-btn-blue.dhm-home-how__mini-button {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 52px !important;
  aspect-ratio: auto !important;
  margin: 16px 0 0 !important;
  padding: 15px 22px !important;
  border: 0 !important;
  border-radius: 18px !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: normal !important;
  line-height: 1.15 !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: 0.01em !important;
  color: #ffffff !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(255,255,255,0.24), transparent 30%),
    linear-gradient(135deg, #36d6ff 0%, #0aa7df 42%, #075f9f 100%) !important;
  box-shadow:
    0 14px 28px rgba(7,95,159,0.24),
    0 0 0 1px rgba(255,255,255,0.34) inset,
    0 0 20px rgba(54,214,255,0.18) !important;
  cursor: pointer !important;
  transform: none !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease !important;
}

.dhm-home-how__step .dhm-home-how__mini-button:hover,
.dhm-home-how__step button.dhm-home-how__mini-button:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.03) !important;
  box-shadow:
    0 18px 34px rgba(7,95,159,0.30),
    0 0 0 1px rgba(255,255,255,0.42) inset,
    0 0 26px rgba(54,214,255,0.28) !important;
}

.dhm-home-how__step .dhm-home-how__mini-button:active,
.dhm-home-how__step button.dhm-home-how__mini-button:active {
  transform: translateY(0) scale(0.98) !important;
}

.dhm-home-how__step > div:not(.dhm-home-how__step-number) {
  width: 100% !important;
  min-width: 0 !important;
}

@media (max-width: 720px) {
  .dhm-home-how__step h3 {
    grid-column: 2 !important;
  }

  .dhm-home-how__step p,
  .dhm-home-how__step .dhm-home-how__prep-list,
  .dhm-home-how__step .dhm-home-how__mini-button,
  .dhm-home-how__step button.dhm-home-how__mini-button {
    grid-column: 1 / -1 !important;
  }
}


/* FINAL POLISH: compact right-aligned how-to calculator buttons + step 3 process */
.dhm-home-how__step > div:not(.dhm-home-how__step-number) {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

.dhm-home-how__step .dhm-home-how__mini-button,
.dhm-home-how__step button.dhm-home-how__mini-button,
.dhm-home-how__step .dhm-btn.dhm-home-how__mini-button,
.dhm-home-how__step button.dhm-btn.dhm-btn-blue.dhm-home-how__mini-button {
  width: auto !important;
  min-width: 160px !important;
  max-width: 230px !important;
  min-height: 48px !important;
  margin: 16px 0 0 auto !important;
  padding: 13px 22px !important;
  border-radius: 999px !important;
  align-self: flex-end !important;
  white-space: nowrap !important;
  box-shadow:
    0 12px 26px rgba(7,95,159,0.22),
    0 0 0 1px rgba(255,255,255,0.34) inset,
    0 0 18px rgba(54,214,255,0.16) !important;
}

.dhm-home-how__process {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}

.dhm-home-how__process span {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 9px 10px;
  border: 1px solid rgba(10,167,223,0.16);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.96), rgba(234,248,255,0.78));
  color: var(--dhm-text);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  box-shadow: 0 8px 18px rgba(5,43,79,0.06);
}

.dhm-home-how__process strong {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(135deg, #36d6ff, #075f9f);
  color: #ffffff;
  font-size: 12px;
  line-height: 1;
}

@media (max-width: 720px) {
  .dhm-home-how__step .dhm-home-how__mini-button,
  .dhm-home-how__step button.dhm-home-how__mini-button,
  .dhm-home-how__step .dhm-btn.dhm-home-how__mini-button,
  .dhm-home-how__step button.dhm-btn.dhm-btn-blue.dhm-home-how__mini-button {
    grid-column: 1 / -1 !important;
    width: auto !important;
    min-width: 160px !important;
    max-width: 230px !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }

  .dhm-home-how__process {
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
  }

  .dhm-home-how__process span {
    font-size: 13px;
  }
}

/* FINAL FIX: mobile how-to card header layout + card 4 CTA */
.dhm-home-how__step .dhm-home-how__mini-button,
.dhm-home-how__step a.dhm-home-how__mini-button,
.dhm-home-how__step button.dhm-home-how__mini-button {
  text-decoration: none !important;
  text-align: center !important;
}

@media (max-width: 720px) {
  .dhm-home-how__step {
    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
    gap: 14px !important;
    align-items: start !important;
  }

  .dhm-home-how__step-number {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  .dhm-home-how__step > div:not(.dhm-home-how__step-number) {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    min-width: 0 !important;
  }

  .dhm-home-how__step h3 {
    grid-column: auto !important;
    margin: 0 0 8px !important;
    align-self: auto !important;
  }

  .dhm-home-how__step p,
  .dhm-home-how__step .dhm-home-how__prep-list,
  .dhm-home-how__step .dhm-home-how__process {
    grid-column: auto !important;
  }

  .dhm-home-how__step .dhm-home-how__mini-button,
  .dhm-home-how__step a.dhm-home-how__mini-button,
  .dhm-home-how__step button.dhm-home-how__mini-button,
  .dhm-home-how__step .dhm-btn.dhm-home-how__mini-button,
  .dhm-home-how__step button.dhm-btn.dhm-btn-blue.dhm-home-how__mini-button {
    grid-column: auto !important;
    width: auto !important;
    min-width: 160px !important;
    max-width: 230px !important;
    margin: 16px 0 0 auto !important;
    align-self: flex-end !important;
  }

  .dhm-home-how__note {
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }

  .dhm-home-how__note-icon {
    width: 40px !important;
    height: 40px !important;
    flex: 0 0 40px !important;
  }

  .dhm-home-how__note p {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
}

/* Update: Section 1 prep intro + single-digit step number polish */
.dhm-home-how__prep-intro {
  margin: 0 0 14px !important;
  color: var(--dhm-muted) !important;
  font-size: 15.5px !important;
  line-height: 1.55 !important;
}

.dhm-home-how__step-number {
  font-size: 22px !important;
  letter-spacing: -0.02em !important;
}

@media (max-width: 720px) {
  .dhm-home-how__step-number {
    width: 48px !important;
    height: 48px !important;
    border-radius: 17px !important;
    font-size: 18px !important;
  }

  .dhm-home-how__step {
    grid-template-columns: 48px minmax(0, 1fr) !important;
  }

  .dhm-home-how__prep-intro {
    font-size: 15px !important;
    margin-bottom: 12px !important;
  }
}

/* Solution box final copy/layout update */
.dhm-home-solution__actions .dhm-btn {
  min-width: 160px;
}

.dhm-home-solution__panel-head {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 20px;
}

.dhm-home-solution__panel-head .dhm-home-solution__orb {
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  margin-bottom: 0;
  border-radius: 20px;
}

.dhm-home-solution__panel-head h3 {
  margin: 0;
}

.dhm-home-solution__panel li::before {
  background: linear-gradient(135deg, #79f2b0, #18b86d) !important;
  color: #ffffff !important;
  box-shadow:
    0 8px 18px rgba(24, 184, 109, 0.24),
    0 0 14px rgba(121, 242, 176, 0.24) !important;
}

@media (max-width: 520px) {
  .dhm-home-solution__panel-head {
    gap: 14px;
    align-items: center;
  }

  .dhm-home-solution__panel-head .dhm-home-solution__orb {
    flex-basis: 54px;
    width: 54px;
    height: 54px;
    border-radius: 17px;
  }

  .dhm-home-solution__panel-head .dhm-home-solution__orb span {
    font-size: 28px;
  }
}


/* Solution CTA and bullet emphasis refinement */
.dhm-home-solution__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.dhm-home-solution__actions .dhm-btn {
  min-width: 160px;
}

.dhm-home-solution__actions .dhm-btn-reset {
  background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.36);
  color: #ffffff;
  box-shadow: 0 14px 30px rgba(5,43,79,0.18);
}

.dhm-home-solution__panel ul {
  display: block !important;
  columns: 1 !important;
  column-count: 1 !important;
}

.dhm-home-solution__panel li {
  margin-bottom: 8px;
  line-height: 1.42;
}

.dhm-home-solution__panel li strong {
  font-weight: 900;
  color: var(--dhm-navy, #052b4f);
}

@media (max-width: 640px) {
  .dhm-home-solution__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .dhm-home-solution__actions .dhm-btn {
    width: 100%;
    min-width: 0;
  }
}

/* ===== Reset step anchor cards + active scroll polish ===== */
html {
  scroll-behavior: smooth;
}

.dhm-home-how__step {
  scroll-margin-top: 96px;
}

.dhm-reset-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0 18px;
}

.dhm-reset-step {
  position: relative;
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid rgba(22, 163, 74, 0.18);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(236, 253, 245, 0.98), rgba(220, 252, 231, 0.88));
  color: #0f7a43;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.15;
  text-decoration: none;
  box-shadow: 0 10px 22px rgba(22, 163, 74, 0.08);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.dhm-reset-step::before {
  content: "";
  flex: 0 0 10px;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.12), 0 0 14px rgba(34, 197, 94, 0.28);
}

.dhm-reset-step:hover,
.dhm-reset-step.is-active {
  transform: translateY(-2px);
  border-color: rgba(22, 163, 74, 0.38);
  background: linear-gradient(135deg, #dcfce7, #bbf7d0);
  box-shadow: 0 14px 30px rgba(22, 163, 74, 0.14);
}

.dhm-reset-step.is-active::before {
  background: #15803d;
  box-shadow: 0 0 0 5px rgba(34, 197, 94, 0.16), 0 0 18px rgba(34, 197, 94, 0.44);
}

/* Step 1 green bullets on screen and mobile */
#dhm-how-step-1 .dhm-home-how__prep-list li::before {
  background: linear-gradient(135deg, #86efac, #16a34a) !important;
  box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.10), 0 7px 14px rgba(22, 163, 74, 0.18) !important;
}

/* Step 3 process bullets: desktop centred above the text with individual colours */
@media (min-width: 721px) {
  #dhm-how-step-3 > div:not(.dhm-home-how__step-number) {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  #dhm-how-step-3 h3 {
    order: 1;
  }

  #dhm-how-step-3 .dhm-home-how__process {
    order: 2;
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 6px 0 18px !important;
  }

  #dhm-how-step-3 p {
    order: 3;
    max-width: 760px;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  #dhm-how-step-3 .dhm-home-how__process span {
    justify-content: center !important;
    text-align: center !important;
  }
}

#dhm-how-step-3 .dhm-home-how__process span:nth-child(1) strong {
  background: linear-gradient(135deg, #22c55e, #15803d) !important;
}

#dhm-how-step-3 .dhm-home-how__process span:nth-child(2) strong {
  background: linear-gradient(135deg, #38bdf8, #075f9f) !important;
}

#dhm-how-step-3 .dhm-home-how__process span:nth-child(3) strong {
  background: linear-gradient(135deg, #fbbf24, #f97316) !important;
}

@media (max-width: 720px) {
  .dhm-reset-steps {
    grid-template-columns: 1fr;
  }

  .dhm-reset-step {
    min-height: 40px;
    padding: 9px 12px;
  }
}

/* ===== Fresh update: reset step arrows, solution emphasis, header polish ===== */
.dhm-reset-step::after {
  content: "\203A";
  flex: 0 0 auto;
  margin-left: auto;
  color: #15803d;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
  opacity: 0.72;
  transform: translateX(0);
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.dhm-reset-step:hover::after,
.dhm-reset-step.is-active::after {
  opacity: 1;
  transform: translateX(3px);
}

.dhm-home-solution__panel li strong {
  color: #ffffff !important;
  font-weight: 900 !important;
}

#dhm-site-header,
.dhm-site-header {
  background:
    radial-gradient(circle at 12% 20%, rgba(255, 255, 255, 0.24), transparent 32%),
    radial-gradient(circle at 0% 50%, rgba(116, 221, 255, 0.40), transparent 38%),
    linear-gradient(135deg, #0fb7ee 0%, #0a84c7 34%, #075f9f 66%, #052b4f 100%) !important;
  border-bottom: 3px solid rgba(116, 221, 255, 0.72) !important;
  box-shadow:
    0 4px 0 rgba(255, 255, 255, 0.18),
    0 16px 34px rgba(5, 43, 79, 0.24),
    0 0 22px rgba(54, 214, 255, 0.20) !important;
}

/* ===== Final polish: reset step arrows + solution bold text ===== */
.dhm-reset-step {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
}

.dhm-reset-step::after {
  content: "→" !important;
  flex: 0 0 auto !important;
  margin-left: auto !important;
  color: #15803d !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  opacity: 0.82 !important;
  transition: transform 0.2s ease, opacity 0.2s ease !important;
}

.dhm-reset-step:hover::after,
.dhm-reset-step.is-active::after {
  opacity: 1 !important;
  transform: translateX(4px) !important;
}

.dhm-home-solution__panel li strong {
  color: #ffffff !important;
  font-weight: 900 !important;
}

/* Header polish for homepage render */
#dhm-site-header,
.dhm-site-header {
  background:
    radial-gradient(circle at 10% 18%, rgba(255, 255, 255, 0.54), transparent 30%),
    radial-gradient(circle at 0% 52%, rgba(191, 243, 255, 0.68), transparent 38%),
    linear-gradient(135deg, #9feeff 0%, #38cfff 26%, #0aa7df 52%, #075f9f 76%, #052b4f 100%) !important;
  border-bottom: 3px solid #8fe9ff !important;
  box-shadow:
    0 3px 0 rgba(255, 255, 255, 0.24),
    0 16px 34px rgba(5, 43, 79, 0.26),
    0 0 24px rgba(54, 214, 255, 0.22) !important;
}


/* ===== Section 4 cleanup and moved Pro Tip spacing ===== */
#dhm-how-step-4 .dhm-home-how__prep-list {
  margin-top: 14px !important;
}

.dhm-home-how__feature .dhm-home-how__note {
  margin-top: 18px;
}


/* ===== Pro tips below Simple Pool Reset box ===== */
.dhm-home-how__tips {
  grid-column: 1;
  grid-row: 2;
  display: grid;
  gap: 12px;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid rgba(5, 43, 79, 0.14);
}

.dhm-home-how__steps {
  grid-column: 2;
  grid-row: 1 / span 2;
}

.dhm-home-how__tip {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 16px 18px;
  border-radius: 22px;
  box-shadow: 0 12px 28px rgba(5,43,79,0.08);
}

.dhm-home-how__tip--success {
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,0.74), transparent 38%),
    linear-gradient(135deg, #f0fff6 0%, #e3f8ec 100%);
  border: 1px solid rgba(70, 178, 112, 0.22);
}

.dhm-home-how__tip--warning {
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,0.78), transparent 38%),
    linear-gradient(135deg, #fff7e8 0%, #ffe8c6 100%);
  border: 1px solid rgba(238, 146, 34, 0.25);
}

.dhm-home-how__tip-icon {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  font-weight: 900;
}

.dhm-home-how__tip--success .dhm-home-how__tip-icon {
  background: linear-gradient(135deg, #68d391, #2f9e57);
  box-shadow: 0 10px 22px rgba(47, 158, 87, 0.18);
}

.dhm-home-how__tip--warning .dhm-home-how__tip-icon {
  background: linear-gradient(135deg, #ffb15f, #df7a18);
  box-shadow: 0 10px 22px rgba(223, 122, 24, 0.18);
}

.dhm-home-how__tip p {
  margin: 0;
  color: var(--dhm-muted);
  line-height: 1.55;
}

.dhm-home-how__tip--warning p strong {
  color: #9a4f00;
}

.dhm-home-how__tip--success p strong {
  color: #246c3d;
}

@media (max-width: 980px) {
  .dhm-home-how__tips,
  .dhm-home-how__steps {
    grid-column: auto;
    grid-row: auto;
  }
}

@media (max-width: 720px) {
  .dhm-home-how__tips {
    margin-top: 16px;
    padding-top: 16px;
  }

  .dhm-home-how__tip {
    padding: 14px 15px;
    border-radius: 20px;
  }

  .dhm-home-how__tip-icon {
    width: 34px;
    height: 34px;
  }
}

/* ===== Simple Pool Reset alignment + compact pro tips ===== */
@media (min-width: 981px) {
  .dhm-home-how__grid {
    align-items: start !important;
  }

  .dhm-home-how__feature {
    align-self: start !important;
    min-height: 0 !important;
    height: auto !important;
  }

  .dhm-home-how__steps {
    align-self: start !important;
  }

  .dhm-home-how__tips {
    align-self: start !important;
  }
}

.dhm-home-how__tips {
  margin-top: 12px !important;
  padding-top: 0 !important;
  border-top: 0 !important;
  gap: 10px !important;
}

.dhm-home-how__tip {
  padding: 13px 15px !important;
}

.dhm-home-how__feature .dhm-home-how__product-card {
  margin-top: 18px !important;
}

.dhm-home-how__feature .dhm-home-how__actions {
  margin-top: 18px !important;
}

.dhm-home-how__feature p {
  margin-bottom: 16px !important;
}

@media (max-width: 720px) {
  .dhm-home-how__tips {
    margin-top: 12px !important;
    padding-top: 0 !important;
  }
}

/* Database/cache-driven public image locations. */
.dhm-home-problem-card__image[style*="--dhm-bg-image"]::before {
  background:
    linear-gradient(180deg, rgba(0, 62, 108, 0.08), rgba(0, 62, 108, 0.30)),
    var(--dhm-bg-image) center/cover no-repeat;
}

.dhm-home-result-card[style*="--dhm-bg-image"] {
  background:
    linear-gradient(180deg, rgba(0, 62, 108, 0.22), rgba(0, 36, 70, 0.70)),
    var(--dhm-bg-image) center/cover no-repeat;
}

/* Keep the full-image colour overlay off the final results card only; the text panel provides readability. */
.dhm-home-result-card--after[style*="--dhm-bg-image"] {
  background: var(--dhm-bg-image) center/cover no-repeat;
}

.dhm-product-price{margin:8px 0 14px;color:var(--navy,#052b4f);font-weight:900;font-size:1.12rem;}
.dhm-product-selector-result{display:grid;grid-template-columns:110px minmax(0,1fr);gap:14px;align-items:center;text-align:left;}
.dhm-product-selector-image{width:110px;height:110px;object-fit:contain;border-radius:16px;background:#fff;padding:8px;box-shadow:0 8px 18px rgba(5,43,79,.08);}
.dhm-product-selector-items{margin:8px 0;padding-left:18px;}
@media(max-width:640px){.dhm-product-selector-result{grid-template-columns:1fr;text-align:center}.dhm-product-selector-image{margin:0 auto}}

/* 2026-05-12 public retail product actions */
.dhm-product-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:12px}.dhm-product-actions .dhm-btn{min-width:132px;justify-content:center}@media(max-width:640px){.dhm-product-actions{display:grid;grid-template-columns:1fr;}.dhm-product-actions .dhm-btn{width:100%;}}

.dhm-dose-modal__shopify {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
@media (max-width: 640px) {
  .dhm-dose-modal__shopify {
    display: grid;
    grid-template-columns: 1fr;
  }
  .dhm-dose-modal__shopify .dhm-btn {
    width: 100%;
    justify-content: center;
  }
}

/* 2026-05-12: product carousel repair and More Info hardening */
#dhm-products-section .dhm-product-actions,
.dhm-product-card .dhm-product-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  align-items:center!important;
  margin-top:12px!important;
}
#dhm-products-section .dhm-product-actions .dhm-btn,
.dhm-product-card .dhm-product-actions .dhm-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:132px!important;
}
@media(max-width:720px){
  #dhm-products-section .dhm-product-actions,
  .dhm-product-card .dhm-product-actions{display:grid!important;grid-template-columns:1fr!important;}
  #dhm-products-section .dhm-product-actions .dhm-btn,
  .dhm-product-card .dhm-product-actions .dhm-btn{width:100%!important;}
}


/* 2026-05-12: keep the dosing calculator CTA below mobile product carousels and force calculator modals above every page layer. */
@media (max-width: 720px) {
  #dhm-products-section .dhm-product-carousel-shell {
    position: relative !important;
    z-index: 2 !important;
    display: block !important;
    overflow: visible !important;
    margin-bottom: 28px !important;
  }

  #dhm-products-section .dhm-product-grid {
    height: var(--dhm-product-carousel-height, 720px) !important;
    min-height: var(--dhm-product-carousel-height, 720px) !important;
    margin-bottom: 0 !important;
  }

  #dhm-products-section .dhm-product-card {
    height: auto !important;
  }

  #dhm-products-section .dhm-products-calculator-cta,
  .dhm-products-calculator-cta {
    position: relative !important;
    z-index: 1 !important;
    clear: both !important;
    margin-top: 12px !important;
  }
}

.dhm-dose-modal,
.dhm-dose-modal.is-open {
  z-index: 2147483647 !important;
}

.dhm-dose-modal__overlay {
  z-index: 2147483646 !important;
}

.dhm-dose-modal__dialog {
  z-index: 2147483647 !important;
}

/* 2026-05-12: carousel action button colour and More Info emphasis */
#dhm-products-section .dhm-product-actions button[data-cart-add],
.dhm-product-card .dhm-product-actions button[data-cart-add] {
  background: var(--dhm-blue, #0799d6) !important;
  border-color: var(--dhm-blue, #0799d6) !important;
  color: #ffffff !important;
}

#dhm-products-section .dhm-product-actions button[data-cart-add]:hover,
.dhm-product-card .dhm-product-actions button[data-cart-add]:hover,
#dhm-products-section .dhm-product-actions button[data-cart-add]:focus-visible,
.dhm-product-card .dhm-product-actions button[data-cart-add]:focus-visible {
  background: #052b4f !important;
  border-color: #052b4f !important;
  color: #ffffff !important;
}



/* 2026-05-12: place carousel More Info below feature list, smaller and centred. */
#dhm-products-section .dhm-carousel-more-info,
.dhm-product-card .dhm-carousel-more-info {
  display: inline-flex !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 36px !important;
  justify-content: center !important;
  align-items: center !important;
  justify-self: center !important;
  align-self: center !important;
  margin: 10px auto 2px !important;
  padding: 8px 16px !important;
  border-radius: 999px !important;
  background: #e8f5fc !important;
  border-color: rgba(5, 43, 79, .18) !important;
  color: #052b4f !important;
  font-size: .9rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

#dhm-products-section .dhm-carousel-more-info:hover,
#dhm-products-section .dhm-carousel-more-info:focus-visible,
.dhm-product-card .dhm-carousel-more-info:hover,
.dhm-product-card .dhm-carousel-more-info:focus-visible {
  background: #052b4f !important;
  border-color: #052b4f !important;
  color: #ffffff !important;
}

/* 2026-05-12: narrower carousel More Info button. */
#dhm-products-section .dhm-carousel-more-info,
.dhm-product-card .dhm-carousel-more-info{max-width:128px!important;padding-left:12px!important;padding-right:12px!important;font-size:.84rem!important}

/* 2026-05-12: smaller carousel More Info width */
#dhm-products-section .dhm-carousel-more-info,.dhm-product-card .dhm-carousel-more-info{max-width:110px!important;min-width:0!important;padding-left:10px!important;padding-right:10px!important}


/* 2026-05-12: compact carousel/calculator spacing, free shipping badge layer, calculator modal actions. */
#dhm-products-section .dhm-product-carousel-shell{margin-bottom:8px!important;}
#dhm-products-section .dhm-products-calculator-cta,.dhm-products-calculator-cta{margin-top:0!important;}
.dhm-product-card{position:relative;}
.dhm-free-shipping-badge{position:absolute;top:-16px;right:-14px;width:86px;height:86px;z-index:12;filter:drop-shadow(0 12px 18px rgba(5,43,79,.22));pointer-events:none;}
.dhm-dose-modal__product{align-items:start!important;}
.dhm-dose-modal__product-image{align-self:start!important;}
.dhm-dose-modal__shopify,.dhm-product-selector-result .dhm-product-actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important;align-items:center!important;margin-top:10px!important;}
.dhm-dose-modal__shopify .dhm-btn,.dhm-product-selector-result .dhm-product-actions .dhm-btn{width:auto!important;min-height:34px!important;padding:8px 12px!important;border-radius:999px!important;font-size:.84rem!important;background:var(--dhm-blue,#0799d6)!important;border-color:var(--dhm-blue,#0799d6)!important;color:#fff!important;text-decoration:none!important;}
.dhm-product-selector-result{align-items:start!important;}
.dhm-product-selector-image{align-self:start!important;}
@media(max-width:720px){#dhm-products-section .dhm-product-carousel-shell{margin-bottom:6px!important;}#dhm-products-section .dhm-products-calculator-cta,.dhm-products-calculator-cta{margin-top:0!important}.dhm-free-shipping-badge{top:-10px;right:-8px;width:72px;height:72px}.dhm-dose-modal__shopify,.dhm-product-selector-result .dhm-product-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}.dhm-dose-modal__shopify .dhm-btn,.dhm-product-selector-result .dhm-product-actions .dhm-btn{width:100%!important;padding-inline:8px!important;font-size:.78rem!important}}

/* 2026-05-12: no free-shipping badges, inline carousel actions, clean calculator action row and discounted prices. */
.dhm-free-shipping-badge{display:none!important;}
.dhm-carousel-actions{display:flex!important;align-items:center!important;justify-content:center!important;gap:15px!important;flex-wrap:wrap!important;}
.dhm-carousel-actions .dhm-carousel-more-info{margin-right:0!important;padding-right:15px!important;}
.dhm-carousel-price{display:flex!important;align-items:baseline!important;justify-content:center!important;gap:10px!important;text-align:center!important;font-size:clamp(1.35rem,2.5vw,1.7rem)!important;font-weight:950!important;line-height:1.1!important;}
.dhm-carousel-price .dhm-card-price-current.is-struck{font-size:.78em!important;color:#718497!important;text-decoration:line-through!important;text-decoration-thickness:2px!important;}
.dhm-carousel-price .dhm-card-price-discounted{color:#146c2e!important;font-size:1.08em!important;font-weight:1000!important;}
.dhm-carousel-price .dhm-card-price-discounted[hidden]{display:none!important;}
.dhm-dose-modal__shopify,.dhm-product-selector-result .dhm-product-actions{background:transparent!important;box-shadow:none!important;border:0!important;padding:0!important;}
.dhm-product-selector-image,.dhm-dose-modal__product-image img{align-self:start!important;object-position:top center!important;}
@media(max-width:720px){.dhm-dose-modal__shopify,.dhm-product-selector-result .dhm-product-actions{display:flex!important;grid-template-columns:none!important;justify-content:center!important;gap:8px!important;}}

/* 2026-05-12: refined dosing modal recommendations and discount-price display. */
.dhm-dose-modal__result small,.dhm-product-selector-items{display:none!important}.dhm-dose-modal__recommended-label{font-size:.8em!important;letter-spacing:.05em!important}.dhm-dose-modal__product-image{display:grid!important;place-items:center!important}.dhm-dose-modal__product-image img,.dhm-product-selector-image{align-self:center!important;justify-self:center!important;object-position:center!important}.dhm-dose-modal__shopify,.dhm-product-selector-result .dhm-product-actions{display:flex!important;align-items:center!important;justify-content:center!important;gap:15px!important;flex-wrap:wrap!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}.dhm-dose-modal__small-btn,.dhm-dose-modal__shopify .dhm-btn,.dhm-product-selector-result .dhm-product-actions .dhm-btn{width:auto!important;min-width:98px!important;min-height:32px!important;padding:7px 12px!important;font-size:.82rem!important;border-radius:999px!important}.dhm-dose-modal__product-price,.dhm-modal-price{display:flex!important;align-items:baseline!important;justify-content:center!important;gap:10px!important;font-size:1.2em!important;color:#718497!important}.dhm-dose-modal__product-price .dhm-card-price-current.is-struck,.dhm-modal-price .dhm-card-price-current.is-struck{text-decoration:line-through!important;text-decoration-thickness:2px!important;color:#718497!important;font-size:.86em!important}.dhm-dose-modal__product-price .dhm-card-price-discounted,.dhm-modal-price .dhm-card-price-discounted{color:#146c2e!important;font-weight:1000!important;font-size:1.08em!important}.dhm-dose-modal__product-price .dhm-card-price-discounted[hidden],.dhm-modal-price .dhm-card-price-discounted[hidden]{display:none!important}.dhm-product-selector-result{align-items:center!important;text-align:center!important}.dhm-product-selector-result>div{min-width:0}.dhm-product-selector-result strong{display:block}.dhm-product-selector-result small{display:block;margin-top:6px}
@media(max-width:720px){.dhm-dose-modal__product{grid-template-columns:1fr!important;text-align:center!important}.dhm-dose-modal__product-image img{max-width:86px!important;max-height:86px!important}.dhm-dose-modal__shopify,.dhm-product-selector-result .dhm-product-actions{gap:15px!important}.dhm-dose-modal__small-btn,.dhm-dose-modal__shopify .dhm-btn,.dhm-product-selector-result .dhm-product-actions .dhm-btn{min-width:104px!important}}

/* 2026-05-12: add breathing room below homepage result cards. */
.dhm-home-result-card,.dhm-dose-modal__result{margin-bottom:15px!important;}

/* 2026-05-12: make product images 33% bigger and tighten mobile card spacing. */
#dhm-products-section .dhm-product-image{
  min-height:380px!important;
  height:380px!important;
  padding:20px 14px 12px!important;
}
#dhm-products-section .dhm-product-photo{
  max-width:326px!important;
  max-height:326px!important;
}
@media(max-width:720px){
  #dhm-products-section .dhm-product-grid{
    height:540px!important;
    padding-top:34px!important;
    padding-bottom:42px!important;
  }
  #dhm-products-section .dhm-product-card{
    min-height:470px!important;
    border-radius:24px!important;
  }
  #dhm-products-section .dhm-product-image{
    min-height:300px!important;
    height:300px!important;
    padding:14px 10px 8px!important;
  }
  #dhm-products-section .dhm-product-photo{
    max-width:253px!important;
    max-height:253px!important;
  }
  #dhm-products-section .dhm-product-content{
    padding:9px 13px 14px!important;
    gap:4px!important;
  }
  #dhm-products-section .dhm-product-content h3{margin-bottom:3px!important;}
  #dhm-products-section .dhm-product-content p{margin-bottom:8px!important;line-height:1.34!important;}
  #dhm-products-section .dhm-product-card ul{margin:4px 0 9px!important;}
  #dhm-products-section .dhm-product-card li{margin-bottom:3px!important;line-height:1.22!important;}
}


/* 2026-05-13: homepage Dazzle calculator uses a volume slider to match the buy page. */
.dhm-dose-modal__controls input[type="range"][data-dhm-home-volume] {
  min-height: 42px !important;
  height: 42px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer;
}
