/* ============================================================
   PICK YOUR SKIN — clean editorial collection section
   ============================================================ */

body.dartee-home .collsec {
  background: #F4F0E6 !important;
  padding: 0 !important;
}

/* Header band on macro belt photography */
body.dartee-home .collhero {
  position: relative;
  background-color: #0B0906 !important;
  background-image: url("assets/photos/dartee-belts-band.jpg") !important;
  background-size: cover !important;
  background-position: 62% 50% !important;
  background-repeat: no-repeat !important;
  min-height: 0 !important;
  height: auto !important;
  padding: clamp(52px, 6vw, 88px) 0 clamp(52px, 6vw, 88px) 0;
  display: block;
  overflow: hidden;
}

body.dartee-home .collhero__img { display: none !important; }

/* legibility scrim, strongest on the left where the copy sits */
body.dartee-home .collhero::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    90deg,
    rgba(8, 42, 36, 0.88) 0%,
    rgba(8, 42, 36, 0.72) 34%,
    rgba(8, 42, 36, 0.28) 66%,
    rgba(8, 42, 36, 0.12) 100%
  ) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

body.dartee-home .collhero__inner {
  position: relative;
  z-index: 2;
  width: 100%;
}

body.dartee-home .collhero__copy,
body.dartee-home .collsec__head--editorial {
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 0 clamp(16px, 2.4vw, 40px) !important;
  text-align: left !important;
  background: none !important;
  border: 0 !important;
}

body.dartee-home .collsec__head--editorial .collsec__eyebrow {
  display: block !important;
  color: #F7A8C7 !important;
  font-family: "Archivo", system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  margin: 0 0 10px !important;
}

body.dartee-home .collsec__head--editorial .collsec__title {
  color: #F4F0E6 !important;
  font-family: "Anton", system-ui, sans-serif !important;
  font-size: clamp(28px, 3.6vw, 48px) !important;
  line-height: 0.98 !important;
  letter-spacing: 0.005em !important;
  margin: 0 !important;
  text-transform: uppercase !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.35) !important;
}


body.dartee-home .collsec__head--editorial .collsec__link {
  display: inline-block !important;
  margin-top: 12px !important;
  font-family: "Archivo", system-ui, sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  color: #F4F0E6 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid #EC4D8B !important;
  border-radius: 0 !important;
  padding: 0 0 4px !important;
  box-shadow: none !important;
}

body.dartee-home .collsec__head--editorial .collsec__link:hover {
  color: #F7A8C7 !important;
  border-bottom-color: #F7A8C7 !important;

}

/* ---------- Card row ---------- */
body.dartee-home .collsec__cards {
  width: 100% !important;
  max-width: none !important;
  padding: clamp(14px, 1.6vw, 22px) clamp(16px, 2.4vw, 40px) clamp(44px, 4vw, 68px) !important;
  margin: 0 !important;
}

body.dartee-home .collsec__cards .edcoll--editorial {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(14px, 1.2vw, 20px) !important;
  max-width: 1560px !important;
  margin: 0 auto !important;
}

/* three across only — fourth tile hidden on desktop */
body.dartee-home .collsec__cards .edcoll--editorial > .edcoll__tile:nth-child(n + 4) {
  display: none !important;
}

/* tall image panels */
body.dartee-home .collsec__cards .edcoll--editorial .edcoll__tile {
  position: relative !important;
  display: block !important;
  height: clamp(540px, 72vh, 920px) !important;
  min-height: 540px !important;
  aspect-ratio: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

body.dartee-home .collsec__cards .edcoll--editorial .edcoll__tile img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
  will-change: transform;
}

body.dartee-home .collsec__cards .edcoll--editorial .edcoll__tile:hover img {
  transform: scale(1.02) !important;
}

/* subtle bottom gradient for text legibility */
body.dartee-home .collsec__cards .edcoll--editorial .edcoll__tile::after {
  content: "" !important;
  position: absolute !important;
  inset: auto 0 0 0 !important;
  height: 52% !important;
  background: linear-gradient(180deg, rgba(8, 42, 36, 0) 0%, rgba(8, 42, 36, 0.62) 100%) !important;
  pointer-events: none !important;
}

/* collection name */
body.dartee-home .collsec__cards .edcoll--editorial .edcoll__cap {
  position: absolute !important;
  z-index: 2 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: clamp(96px, 6.6vw, 118px) !important;
  padding: 0 clamp(16px, 1.8vw, 28px) !important;
  text-align: center !important;
  background: none !important;
  border: 0 !important;
}

body.dartee-home .collsec__cards .edcoll--editorial .edcoll__name {
  display: block !important;
  font-family: "Archivo", system-ui, sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(12px, 1.05vw, 15px) !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #FCFBF7 !important;
  line-height: 1.1 !important;
}

body.dartee-home .collsec__cards .edcoll--editorial .edcoll__note {
  display: none !important;
}

/* compact white rectangular shop button */
body.dartee-home .collsec__cards .edcoll--editorial .edcoll__shop {
  position: absolute !important;
  z-index: 2 !important;
  left: 50% !important;
  bottom: clamp(44px, 3.8vw, 60px) !important;
  transform: translateX(-50%) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: "Archivo", system-ui, sans-serif !important;
  font-weight: 700 !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  color: #082A24 !important;
  background: #FCFBF7 !important;
  border: 1px solid rgba(8, 42, 36, 0.12) !important;
  border-radius: 0 !important;
  padding: 8px 18px !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease !important;
}

body.dartee-home .collsec__cards .edcoll--editorial .edcoll__tile:hover .edcoll__shop {
  background: #082A24 !important;
  color: #FCFBF7 !important;
  border-color: #082A24 !important;
  transform: translateX(-50%) !important;
}

/* ---------- MOBILE ---------- */
@media (max-width: 860px) {
  body.dartee-home .collhero {
    padding: clamp(34px, 9vw, 52px) 0 clamp(34px, 9vw, 52px) 0 !important;
    background-position: 58% 50% !important;
  }
  body.dartee-home .collhero::after {
    background: linear-gradient(
      90deg,
      rgba(8, 42, 36, 0.9) 0%,
      rgba(8, 42, 36, 0.74) 55%,
      rgba(8, 42, 36, 0.4) 100%
    ) !important;
  }

  body.dartee-home .collsec__head--editorial .collsec__title {
    font-size: clamp(22px, 6.5vw, 30px) !important;
  }
  body.dartee-home .collsec__head--editorial .collsec__link {
    margin-top: 0 !important;
  }
  body.dartee-home .collsec__cards {
    padding: 12px 16px clamp(32px, 8vw, 48px) !important;
  }
  body.dartee-home .collsec__cards .edcoll--editorial {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  body.dartee-home .collsec__cards .edcoll--editorial .edcoll__tile {
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 3 / 5 !important;
  }
}