.elementor-13795 .elementor-element.elementor-element-e28c4aa{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;}/* Start custom CSS for html, class: .elementor-element-f83cbb6 *//* =========================================================
   NOVINDERM — HAIR REMOVAL COMPARISON
   PREMIUM CLINICAL / MED-TECH
   ========================================================= */

#nd-hair-compare {
  --nd-deep: #071A25;
  --nd-teal: #0B5F63;
  --nd-turquoise: #35C9C3;
  --nd-light-turquoise: #6DE5DF;
  --nd-ivory: #FCFAF6;
  --nd-beige: #F3EEE5;
  --nd-border: #E6E0D6;
  --nd-champagne: #A97845;
  --nd-muted: #60747B;
  --nd-white: #FFFFFF;

  direction: rtl;
  color: var(--nd-deep);
  font-family: inherit;
  width: 100%;
  max-width: 100%;
  position: relative;
}


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

#nd-hair-compare .ndhc-hero {

  display: grid;
  grid-template-columns: 175px minmax(0, 1fr) 210px;

  align-items: start;

  gap: 28px;

  padding: 30px 30px 28px;

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.96),
      rgba(243,238,229,.76)
    );

  border: 1px solid rgba(230,224,214,.92);

  border-radius: 26px;

  box-shadow:
    0 16px 42px rgba(7,26,37,.07);

  position: relative;

  overflow: hidden;

  margin-bottom: 22px;

}


#nd-hair-compare .ndhc-hero::before {

  content: "";

  position: absolute;

  width: 260px;
  height: 260px;

  left: -110px;
  top: -130px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(53,201,195,.14),
      transparent 68%
    );

  pointer-events: none;

}


#nd-hair-compare .ndhc-hero-content {

  min-width: 0;

  text-align: right;

}


#nd-hair-compare .ndhc-eyebrow {

  display: inline-flex;

  align-items: center;

  gap: 7px;

  color: var(--nd-teal);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: .04em;

  margin-bottom: 9px;

}


#nd-hair-compare .ndhc-eyebrow::before {

  content: "";

  width: 22px;
  height: 1px;

  background: var(--nd-turquoise);

}


#nd-hair-compare .ndhc-hero h1 {

  margin: 0;

  color: var(--nd-deep);

  font-size: clamp(24px, 2.2vw, 34px);

  line-height: 1.45;

  font-weight: 800;

  letter-spacing: -.02em;

}


#nd-hair-compare .ndhc-hero p {

  max-width: 850px;

  margin: 10px 0 0;

  color: #5B6D73;

  font-size: 13px;

  line-height: 2.05;

}


#nd-hair-compare .ndhc-brand {

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  justify-content: flex-start;

  padding-top: 2px;

  direction: ltr;

  text-align: left;

}


#nd-hair-compare .ndhc-brand-main {

  color: var(--nd-deep);

  font-size: 22px;

  font-weight: 900;

  letter-spacing: .13em;

  line-height: 1;

}


#nd-hair-compare .ndhc-brand-sub {

  color: var(--nd-champagne);

  font-size: 9px;

  letter-spacing: .29em;

  margin-top: 8px;

  font-weight: 700;

}


#nd-hair-compare .ndhc-count-card {

  grid-column: 1;

  grid-row: 1;

  display: flex;

  align-items: center;

  gap: 11px;

  min-height: 74px;

  padding: 13px;

  background: rgba(255,255,255,.74);

  border: 1px solid rgba(11,95,99,.14);

  border-radius: 18px;

  box-shadow:
    0 8px 24px rgba(7,26,37,.045);

}


#nd-hair-compare .ndhc-count-orb {

  width: 38px;
  height: 38px;

  flex: 0 0 38px;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  color: var(--nd-teal);

  border: 1px solid rgba(53,201,195,.5);

  background:
    radial-gradient(
      circle,
      rgba(109,229,223,.22),
      rgba(255,255,255,.7)
    );

  font-size: 14px;

  font-weight: 800;

}


#nd-hair-compare .ndhc-count-number {

  display: block;

  color: var(--nd-teal);

  font-size: 23px;

  line-height: 1.05;

  font-weight: 900;

}


#nd-hair-compare .ndhc-count-label {

  display: block;

  margin-top: 3px;

  color: #718188;

  font-size: 10px;

  white-space: nowrap;

}


/* =========================================================
   CONTROL PANEL
   ========================================================= */

#nd-hair-compare .ndhc-control-panel {

  padding: 18px 20px 15px;

  background: rgba(255,255,255,.76);

  border: 1px solid var(--nd-border);

  border-radius: 22px;

  box-shadow:
    0 10px 28px rgba(7,26,37,.045);

  margin-bottom: 24px;

}


#nd-hair-compare .ndhc-search-row {

  width: 100%;

}


#nd-hair-compare .ndhc-search {

  width: 100%;

  max-width: 520px;

  height: 49px;

  display: flex;

  align-items: center;

  gap: 10px;

  padding: 0 15px;

  background: var(--nd-ivory);

  border: 1px solid #DCD7CE;

  border-radius: 14px;

  transition:
    border-color .2s ease,
    box-shadow .2s ease;

}


#nd-hair-compare .ndhc-search:focus-within {

  border-color: rgba(53,201,195,.72);

  box-shadow:
    0 0 0 3px rgba(53,201,195,.09);

}


#nd-hair-compare .ndhc-search svg {

  width: 19px;
  height: 19px;

  flex: 0 0 19px;

  stroke: var(--nd-teal);

  stroke-width: 1.8;

  fill: none;

}


#nd-hair-compare .ndhc-search input {

  width: 100%;

  min-width: 0;

  border: 0;

  outline: 0;

  background: transparent;

  color: var(--nd-deep);

  font: inherit;

  font-size: 12px;

}


#nd-hair-compare .ndhc-search input::placeholder {

  color: #94A0A3;

}


#nd-hair-compare .ndhc-filter-area {

  display: flex;

  flex-wrap: wrap;

  align-items: flex-start;

  gap: 24px;

  margin-top: 16px;

}


#nd-hair-compare .ndhc-filter-group {

  display: flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 9px;

}


#nd-hair-compare .ndhc-filter-title {

  color: var(--nd-deep);

  font-size: 11px;

  font-weight: 800;

  white-space: nowrap;

}


#nd-hair-compare .ndhc-filter-buttons {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

}


#nd-hair-compare .ndhc-filter {

  border: 1px solid #DDD9D1;

  background: #FFFFFF;

  color: #627279;

  border-radius: 999px;

  min-height: 31px;

  padding: 5px 12px;

  font: inherit;

  font-size: 10px;

  font-weight: 700;

  cursor: pointer;

  transition:
    .2s ease;

}


#nd-hair-compare .ndhc-filter:hover {

  border-color: rgba(53,201,195,.6);

  color: var(--nd-teal);

}


#nd-hair-compare .ndhc-filter.active {

  color: #FFFFFF;

  background: var(--nd-teal);

  border-color: var(--nd-teal);

  box-shadow:
    0 5px 12px rgba(11,95,99,.14);

}


#nd-hair-compare .ndhc-filter-note {

  margin-top: 13px;

  padding-top: 11px;

  border-top: 1px solid rgba(230,224,214,.72);

  color: #7A888D;

  font-size: 10px;

  line-height: 1.8;

}


/* =========================================================
   RESULTS
   ========================================================= */

#nd-hair-compare .ndhc-results {

  width: 100%;

}


#nd-hair-compare .ndhc-results-top {

  display: flex;

  justify-content: space-between;

  align-items: center;

  gap: 15px;

  margin-bottom: 14px;

}


#nd-hair-compare .ndhc-results-caption {

  display: block;

  color: #849196;

  font-size: 9px;

  margin-bottom: 3px;

}


#nd-hair-compare .ndhc-results-top strong {

  color: var(--nd-deep);

  font-size: 14px;

  font-weight: 800;

}


#nd-hair-compare .ndhc-reset {

  border: 0;

  background: transparent;

  color: var(--nd-teal);

  font: inherit;

  font-size: 10px;

  cursor: pointer;

}


#nd-hair-compare .ndhc-device-grid {

  display: grid;

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

  gap: 18px;

  align-items: stretch;

}


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

#nd-hair-compare .ndhc-card {

  display: flex;

  flex-direction: column;

  min-width: 0;

  height: 100%;

  overflow: hidden;

  background: #FFFFFF;

  border: 1px solid var(--nd-border);

  border-radius: 21px;

  box-shadow:
    0 9px 28px rgba(7,26,37,.055);

  transition:
    border-color .22s ease,
    box-shadow .22s ease;

}


#nd-hair-compare .ndhc-card:hover {

  border-color: rgba(53,201,195,.48);

  box-shadow:
    0 15px 36px rgba(7,26,37,.085);

}


#nd-hair-compare .ndhc-card.is-selected {

  border-color: rgba(53,201,195,.8);

  box-shadow:
    0 0 0 2px rgba(53,201,195,.08),
    0 16px 38px rgba(11,95,99,.12);

}


#nd-hair-compare .ndhc-card-image {

  height: 194px;

  min-height: 194px;

  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 19px 23px;

  background:
    linear-gradient(
      145deg,
      #FCFAF6,
      #F3EEE5
    );

  border-bottom: 1px solid rgba(230,224,214,.75);

}


#nd-hair-compare .ndhc-card-image::after {

  content: "";

  position: absolute;

  width: 150px;
  height: 42px;

  bottom: 16px;

  left: 50%;

  transform: translateX(-50%);

  background:
    radial-gradient(
      ellipse,
      rgba(7,26,37,.10),
      transparent 70%
    );

  filter: blur(8px);

  pointer-events: none;

}


#nd-hair-compare .ndhc-card-image img {

  width: 100%;

  height: 100%;

  max-width: 92%;

  max-height: 155px;

  object-fit: contain;

  object-position: center;

  position: relative;

  z-index: 1;

  display: block;

}


#nd-hair-compare .ndhc-select-circle {

  position: absolute;

  top: 13px;

  left: 13px;

  z-index: 5;

  width: 32px;
  height: 32px;

  padding: 0;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  background: rgba(255,255,255,.94);

  color: var(--nd-teal);

  border: 1px solid rgba(11,95,99,.22);

  cursor: pointer;

  font-size: 17px;

  font-weight: 700;

  box-shadow:
    0 5px 13px rgba(7,26,37,.09);

}


#nd-hair-compare .ndhc-select-circle.selected {

  background: var(--nd-teal);

  color: #FFFFFF;

  border-color: var(--nd-teal);

}


#nd-hair-compare .ndhc-card-content {

  flex: 1;

  display: flex;

  flex-direction: column;

  min-width: 0;

  padding: 16px 16px 15px;

}


#nd-hair-compare .ndhc-card-topline {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 7px;

  min-height: 20px;

}


#nd-hair-compare .ndhc-card-brand {

  color: var(--nd-teal);

  font-size: 9px;

  font-weight: 900;

  letter-spacing: .08em;

  text-transform: uppercase;

}


#nd-hair-compare .ndhc-market-badge {

  color: var(--nd-champagne);

  background: rgba(169,120,69,.08);

  border: 1px solid rgba(169,120,69,.18);

  border-radius: 999px;

  padding: 3px 7px;

  font-size: 8px;

  white-space: nowrap;

}


#nd-hair-compare .ndhc-card h3 {

  margin: 5px 0 8px;

  color: var(--nd-deep);

  font-size: 17px;

  line-height: 1.4;

  font-weight: 850;

}


#nd-hair-compare .ndhc-card-tags {

  display: flex;

  flex-wrap: wrap;

  gap: 5px;

  min-height: 24px;

}


#nd-hair-compare .ndhc-card-tag {

  display: inline-flex;

  align-items: center;

  padding: 3px 7px;

  color: var(--nd-teal);

  background: rgba(53,201,195,.07);

  border: 1px solid rgba(53,201,195,.16);

  border-radius: 999px;

  font-size: 8px;

  font-weight: 700;

}


#nd-hair-compare .ndhc-card-description {

  min-height: 66px;

  margin: 10px 0 8px;

  color: #66777C;

  font-size: 10.5px;

  line-height: 1.95;

}


#nd-hair-compare .ndhc-highlights {

  list-style: none;

  margin: 0;

  padding: 0;

  min-height: 91px;

}


#nd-hair-compare .ndhc-highlights li {

  position: relative;

  padding-right: 13px;

  margin-bottom: 5px;

  color: #52656B;

  font-size: 9.5px;

  line-height: 1.65;

}


#nd-hair-compare .ndhc-highlights li::before {

  content: "";

  position: absolute;

  right: 0;

  top: .65em;

  width: 5px;
  height: 5px;

  border-radius: 50%;

  background: var(--nd-turquoise);

}


#nd-hair-compare .ndhc-card-bottom {

  margin-top: auto;

  display: flex;

  flex-direction: column;

  gap: 7px;

  padding-top: 10px;

}


#nd-hair-compare .ndhc-card-select {

  width: 100%;

  min-height: 37px;

  border: 1px solid var(--nd-teal);

  border-radius: 10px;

  background: var(--nd-teal);

  color: #FFFFFF;

  font: inherit;

  font-size: 10px;

  font-weight: 800;

  cursor: pointer;

}


#nd-hair-compare .ndhc-card.is-selected .ndhc-card-select {

  background: rgba(11,95,99,.055);

  color: var(--nd-teal);

}


#nd-hair-compare .ndhc-device-link {

  text-align: center;

  color: #879498;

  text-decoration: none;

  font-size: 9px;

}


#nd-hair-compare .ndhc-device-link:hover {

  color: var(--nd-teal);

}


/* =========================================================
   EMPTY
   ========================================================= */

#nd-hair-compare .ndhc-empty {

  padding: 55px 20px;

  text-align: center;

  background: var(--nd-ivory);

  border: 1px dashed var(--nd-border);

  border-radius: 20px;

}


#nd-hair-compare .ndhc-empty strong {

  display: block;

  font-size: 15px;

  margin-bottom: 7px;

}


#nd-hair-compare .ndhc-empty span {

  color: #718188;

  font-size: 11px;

}


/* =========================================================
   STICKY SELECTION BAR
   ========================================================= */

#nd-hair-compare .ndhc-selection-bar {

  position: fixed;

  left: 50%;

  bottom: 20px;

  transform:
    translate(-50%, 150%);

  z-index: 99990;

  width: min(820px, calc(100vw - 32px));

  min-height: 58px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 15px;

  padding: 9px 12px 9px 10px;

  background:
    rgba(7,26,37,.96);

  border: 1px solid rgba(109,229,223,.18);

  border-radius: 17px;

  box-shadow:
    0 18px 55px rgba(7,26,37,.25);

  opacity: 0;

  pointer-events: none;

  transition:
    transform .25s ease,
    opacity .25s ease;

}


#nd-hair-compare .ndhc-selection-bar.is-visible {

  transform:
    translate(-50%, 0);

  opacity: 1;

  pointer-events: auto;

}


#nd-hair-compare .ndhc-selection-info {

  display: flex;

  align-items: center;

  gap: 8px;

  color: #FFFFFF;

  font-size: 10px;

}


#nd-hair-compare .ndhc-selection-dot {

  width: 7px;
  height: 7px;

  border-radius: 50%;

  background: var(--nd-turquoise);

  box-shadow:
    0 0 0 5px rgba(53,201,195,.09);

}


#nd-hair-compare .ndhc-selection-actions {

  display: flex;

  align-items: center;

  gap: 8px;

}


#nd-hair-compare .ndhc-selection-clear {

  border: 0;

  background: transparent;

  color: #AFC0C4;

  font: inherit;

  font-size: 9px;

  cursor: pointer;

}


#nd-hair-compare .ndhc-compare-button {

  min-height: 38px;

  padding: 0 15px;

  border: 0;

  border-radius: 10px;

  background: var(--nd-turquoise);

  color: var(--nd-deep);

  font: inherit;

  font-size: 10px;

  font-weight: 850;

  cursor: pointer;

}


#nd-hair-compare .ndhc-compare-button:disabled {

  background: rgba(255,255,255,.12);

  color: #718388;

  cursor: not-allowed;

}


/* =========================================================
   MODAL
   ========================================================= */

#nd-hair-compare .ndhc-modal {

  position: fixed;

  inset: 0;

  z-index: 100000;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 20px;

  opacity: 0;

  visibility: hidden;

  pointer-events: none;

  transition:
    opacity .2s ease,
    visibility .2s ease;

}


#nd-hair-compare .ndhc-modal.is-open {

  opacity: 1;

  visibility: visible;

  pointer-events: auto;

}


#nd-hair-compare .ndhc-modal-backdrop {

  position: absolute;

  inset: 0;

  background:
    rgba(4,17,24,.72);

  backdrop-filter:
    blur(5px);

}


#nd-hair-compare .ndhc-modal-dialog {

  position: relative;

  z-index: 2;

  width: min(1400px, 100%);

  max-height: min(92vh, 920px);

  display: flex;

  flex-direction: column;

  background: var(--nd-ivory);

  border-radius: 24px;

  overflow: hidden;

  box-shadow:
    0 30px 90px rgba(0,0,0,.30);

  transform:
    translateY(12px);

  transition:
    transform .25s ease;

}


#nd-hair-compare .ndhc-modal.is-open
.ndhc-modal-dialog {

  transform:
    translateY(0);

}


#nd-hair-compare .ndhc-modal-header {

  flex: 0 0 auto;

  display: flex;

  justify-content: space-between;

  align-items: flex-start;

  gap: 20px;

  padding: 23px 25px 19px;

  background:
    linear-gradient(
      135deg,
      #FFFFFF,
      #F3EEE5
    );

  border-bottom: 1px solid var(--nd-border);

}


#nd-hair-compare .ndhc-modal-eyebrow {

  display: block;

  color: var(--nd-champagne);

  font-size: 8px;

  letter-spacing: .14em;

  font-weight: 800;

  direction: ltr;

  margin-bottom: 6px;

}


#nd-hair-compare .ndhc-modal-header h2 {

  margin: 0;

  color: var(--nd-deep);

  font-size: 21px;

  line-height: 1.45;

  font-weight: 850;

}


#nd-hair-compare .ndhc-modal-header p {

  margin: 5px 0 0;

  color: #718188;

  font-size: 10px;

}


#nd-hair-compare .ndhc-modal-close {

  flex: 0 0 auto;

  width: 38px;
  height: 38px;

  border-radius: 50%;

  border: 1px solid var(--nd-border);

  background: #FFFFFF;

  color: var(--nd-deep);

  display: flex;

  align-items: center;

  justify-content: center;

  cursor: pointer;

  font-size: 25px;

  line-height: 1;

}


#nd-hair-compare .ndhc-modal-body {

  flex: 1;

  min-height: 0;

  overflow: auto;

  padding: 18px 20px 22px;

}


/* =========================================================
   COMPARISON TABLE
   ========================================================= */

#nd-hair-compare .ndhc-comparison-scroll {

  width: 100%;

  overflow-x: auto;

  overflow-y: visible;

  -webkit-overflow-scrolling: touch;

  border: 1px solid var(--nd-border);

  border-radius: 16px;

  background: #FFFFFF;

}


#nd-hair-compare .ndhc-comparison-table {

  width: max-content;

  min-width: 100%;

  border-collapse: separate;

  border-spacing: 0;

  direction: rtl;

  font-size: 10px;

}


#nd-hair-compare .ndhc-comparison-table th,
#nd-hair-compare .ndhc-comparison-table td {

  padding: 11px 12px;

  border-left: 1px solid #ECE8E0;

  border-bottom: 1px solid #ECE8E0;

  vertical-align: middle;

  text-align: right;

  line-height: 1.75;

}


#nd-hair-compare .ndhc-comparison-table th:last-child,
#nd-hair-compare .ndhc-comparison-table td:last-child {

  border-left: 0;

}


#nd-hair-compare .ndhc-feature-header,
#nd-hair-compare .ndhc-feature-cell {

  position: sticky;

  right: 0;

  z-index: 8;

  width: 190px;

  min-width: 190px;

  background: #F3EEE5;

  color: var(--nd-deep);

  font-weight: 800;

}


#nd-hair-compare .ndhc-feature-header {

  z-index: 12;

}


#nd-hair-compare .ndhc-device-header {

  width: 220px;

  min-width: 220px;

  background: #FCFAF6;

  color: var(--nd-deep);

}


#nd-hair-compare .ndhc-table-device {

  display: flex;

  align-items: center;

  gap: 10px;

}


#nd-hair-compare .ndhc-table-device-image {

  width: 58px;
  height: 50px;

  flex: 0 0 58px;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 4px;

  background: #F3EEE5;

  border-radius: 9px;

}


#nd-hair-compare .ndhc-table-device-image img {

  width: 100%;
  height: 100%;

  object-fit: contain;

}


#nd-hair-compare .ndhc-table-brand {

  display: block;

  color: var(--nd-teal);

  font-size: 8px;

  font-weight: 900;

  letter-spacing: .06em;

  margin-bottom: 2px;

}


#nd-hair-compare .ndhc-table-device strong {

  display: block;

  color: var(--nd-deep);

  font-size: 11px;

  line-height: 1.45;

}


#nd-hair-compare .ndhc-section-row th {

  position: sticky;

  right: 0;

  z-index: 7;

  padding: 9px 12px;

  background:
    linear-gradient(
      90deg,
      #F3EEE5,
      #EDE7DC
    );

  color: var(--nd-teal);

  font-size: 9px;

  font-weight: 900;

  letter-spacing: .01em;

}


#nd-hair-compare .ndhc-section-row th span {

  display: inline-flex;

  align-items: center;

  gap: 7px;

}


#nd-hair-compare .ndhc-section-row th span::before {

  content: "";

  width: 5px;
  height: 5px;

  border-radius: 50%;

  background: var(--nd-turquoise);

}


#nd-hair-compare .ndhc-comparison-table tbody tr:not(.ndhc-section-row):nth-child(even) td {

  background: #FCFBF8;

}


#nd-hair-compare .ndhc-comparison-table tbody tr:not(.ndhc-section-row):hover td {

  background: rgba(53,201,195,.045);

}


#nd-hair-compare .ndhc-comparison-table td {

  color: #52656B;

  font-size: 9.5px;

  min-width: 220px;

}


#nd-hair-compare .ndhc-comparison-table td.is-empty {

  color: #B0B9BC;

  text-align: center;

}


#nd-hair-compare .ndhc-comparison-table td.is-config {

  color: #7A6C59;

}


#nd-hair-compare .ndhc-config-value {

  display: inline-flex;

  align-items: flex-start;

  gap: 5px;

}


#nd-hair-compare .ndhc-config-value i {

  width: 15px;
  height: 15px;

  flex: 0 0 15px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  background: rgba(169,120,69,.10);

  color: var(--nd-champagne);

  font-style: normal;

  font-size: 9px;

  font-weight: 900;

}


#nd-hair-compare .ndhc-comparison-table td.is-number {

  text-align: center;

}


#nd-hair-compare .ndhc-value-number {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-width: 27px;
  height: 27px;

  padding: 0 7px;

  border-radius: 50%;

  color: var(--nd-teal);

  background: rgba(53,201,195,.09);

  font-size: 11px;

}


#nd-hair-compare .ndhc-check {

  color: var(--nd-teal);

  font-weight: 900;

}


#nd-hair-compare .ndhc-comparison-table td.is-positive-soft {

  color: #315F60;

}


#nd-hair-compare .ndhc-source-cell {

  text-align: center !important;

}


#nd-hair-compare .ndhc-source-link {

  color: var(--nd-teal);

  text-decoration: none;

  font-weight: 800;

  white-space: nowrap;

}


#nd-hair-compare .ndhc-source-link:hover {

  text-decoration: underline;

}


/* =========================================================
   LEGEND / FOOTNOTE
   ========================================================= */

#nd-hair-compare .ndhc-comparison-legend {

  display: flex;

  flex-wrap: wrap;

  gap: 18px;

  margin-top: 13px;

  padding: 11px 13px;

  background: #FFFFFF;

  border: 1px solid var(--nd-border);

  border-radius: 12px;

}


#nd-hair-compare .ndhc-legend-item {

  display: flex;

  align-items: center;

  gap: 6px;

  color: #748388;

  font-size: 9px;

}


#nd-hair-compare .ndhc-legend-mark {

  width: 18px;
  height: 18px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  font-size: 9px;

  font-weight: 900;

}


#nd-hair-compare .ndhc-mark-verified {

  color: var(--nd-teal);

  background: rgba(53,201,195,.1);

}


#nd-hair-compare .ndhc-mark-config {

  color: var(--nd-champagne);

  background: rgba(169,120,69,.1);

}


#nd-hair-compare .ndhc-mark-unknown {

  color: #9BA6A9;

  background: #F1F0ED;

}


#nd-hair-compare .ndhc-comparison-footnote {

  margin-top: 10px;

  padding: 0 3px;

  color: #7B888C;

  font-size: 9px;

  line-height: 1.9;

}


/* =========================================================
   RESPONSIVE — TABLET
   ========================================================= */

@media (max-width: 1100px) {

  #nd-hair-compare .ndhc-device-grid {

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

  }

  #nd-hair-compare .ndhc-hero {

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

    gap: 20px;

  }

}


/* =========================================================
   RESPONSIVE — SMALL TABLET
   ========================================================= */

@media (max-width: 820px) {

  #nd-hair-compare .ndhc-hero {

    grid-template-columns:
      1fr 155px;

    gap: 18px;

  }

  #nd-hair-compare .ndhc-hero-content {

    grid-column: 1 / -1;

    grid-row: 2;

  }

  #nd-hair-compare .ndhc-brand {

    grid-column: 2;

    grid-row: 1;

  }

  #nd-hair-compare .ndhc-count-card {

    grid-column: 1;

    grid-row: 1;

  }

  #nd-hair-compare .ndhc-device-grid {

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

  }

}


/* =========================================================
   RESPONSIVE — MOBILE
   ========================================================= */

@media (max-width: 560px) {

  #nd-hair-compare .ndhc-hero {

    display: flex;

    flex-direction: column;

    padding: 20px;

    border-radius: 21px;

    gap: 15px;

  }

  #nd-hair-compare .ndhc-brand {

    order: 1;

    align-items: flex-start;

  }

  #nd-hair-compare .ndhc-hero-content {

    order: 2;

  }

  #nd-hair-compare .ndhc-count-card {

    order: 3;

    width: max-content;

  }

  #nd-hair-compare .ndhc-hero h1 {

    font-size: 23px;

  }

  #nd-hair-compare .ndhc-hero p {

    font-size: 11px;

  }

  #nd-hair-compare .ndhc-control-panel {

    padding: 14px;

    border-radius: 17px;

  }

  #nd-hair-compare .ndhc-filter-area {

    gap: 14px;

  }

  #nd-hair-compare .ndhc-filter-group {

    display: block;

  }

  #nd-hair-compare .ndhc-filter-title {

    display: block;

    margin-bottom: 7px;

  }

  #nd-hair-compare .ndhc-device-grid {

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

    gap: 10px;

  }

  #nd-hair-compare .ndhc-card-image {

    height: 145px;

    min-height: 145px;

    padding: 13px;

  }

  #nd-hair-compare .ndhc-card-image img {

    max-height: 116px;

  }

  #nd-hair-compare .ndhc-card-content {

    padding: 12px;

  }

  #nd-hair-compare .ndhc-card h3 {

    font-size: 14px;

  }

  #nd-hair-compare .ndhc-card-description {

    min-height: 88px;

    font-size: 9.5px;

  }

  #nd-hair-compare .ndhc-highlights {

    min-height: 105px;

  }

  #nd-hair-compare .ndhc-highlights li {

    font-size: 8.5px;

  }

  #nd-hair-compare .ndhc-selection-bar {

    bottom: 10px;

    width: calc(100vw - 18px);

    flex-direction: column;

    align-items: stretch;

    padding: 10px;

  }

  #nd-hair-compare .ndhc-selection-actions {

    width: 100%;

  }

  #nd-hair-compare .ndhc-compare-button {

    flex: 1;

  }

  #nd-hair-compare .ndhc-selection-clear {

    padding: 0 8px;

  }

  #nd-hair-compare .ndhc-modal {

    padding: 7px;

  }

  #nd-hair-compare .ndhc-modal-dialog {

    max-height: 96vh;

    border-radius: 18px;

  }

  #nd-hair-compare .ndhc-modal-header {

    padding: 17px 15px;

  }

  #nd-hair-compare .ndhc-modal-header h2 {

    font-size: 17px;

  }

  #nd-hair-compare .ndhc-modal-body {

    padding: 10px;

  }

  #nd-hair-compare .ndhc-feature-header,
  #nd-hair-compare .ndhc-feature-cell {

    width: 145px;

    min-width: 145px;

  }

  #nd-hair-compare .ndhc-device-header,
  #nd-hair-compare .ndhc-comparison-table td {

    width: 190px;

    min-width: 190px;

  }

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

#nd-hair-compare button:focus-visible,
#nd-hair-compare a:focus-visible,
#nd-hair-compare input:focus-visible {

  outline: 2px solid var(--nd-turquoise);

  outline-offset: 2px;

}


body.ndhc-modal-open {

  overflow: hidden;

}/* End custom CSS */