@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  --dm180-ink: #07150e;
  --dm180-ink-soft: #183323;
  --dm180-gold: #d7aa38;
  --dm180-gold-soft: #efcf72;
  --dm180-cream: #fbf5e7;
  --dm180-line: rgba(215, 170, 56, .34);
}

/* Header: preserve the accepted structure; only keep it sticky and slightly enlarge desktop items. */
.dm180-site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 10050 !important;
}
@media (min-width: 1024px) {
  .dm180-site-header nav a:not([class*="button"]):not([class*="btn"]),
  .dm180-site-header .nav a:not([class*="button"]):not([class*="btn"]),
  .dm180-site-header [class*="menu"] a:not([class*="button"]):not([class*="btn"]) {
    font-size: 15.5px !important;
    letter-spacing: .03em !important;
  }
}

/* HOME HERO — one single image asset on every device. No desktop/mobile image swapping. */
.dm180-home-hero {
  position: relative !important;
  isolation: isolate !important;
  display: flex !important;
  align-items: center !important;
  min-height: clamp(620px, calc(100svh - 102px), 820px) !important;
  margin: 0 !important;
  padding: clamp(44px, 6vw, 86px) clamp(22px, 5.2vw, 90px) !important;
  overflow: hidden !important;
  background-color: #e9ddc7 !important;
  background-image: url('/assets/delmonaco-v5/images/hero-v180/del-monaco-real-collection-hero.webp?v=180') !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center center !important;
}
.dm180-home-hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background: linear-gradient(90deg,
    rgba(249, 242, 226, .94) 0%,
    rgba(249, 242, 226, .82) 27%,
    rgba(249, 242, 226, .30) 47%,
    rgba(249, 242, 226, 0) 62%) !important;
}
.dm180-home-hero::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(255,255,255,.06), transparent 42%, rgba(31,22,10,.05)) !important;
}
/* Disable every legacy hero image/video so only the V180 background is visible. */
.dm180-home-hero picture,
.dm180-home-hero video,
.dm180-home-hero > img,
.dm180-home-hero [class*="hero-media"],
.dm180-home-hero [class*="hero-image"],
.dm180-home-hero [class*="background-image"],
.dm180-home-hero [class*="bg-image"] {
  display: none !important;
  visibility: hidden !important;
}
.dm180-home-hero [class*="overlay"],
.dm180-home-hero [class*="shade"],
.dm180-home-hero [class*="veil"] {
  display: none !important;
  opacity: 0 !important;
  background: transparent !important;
}
.dm180-hero-content {
  position: relative !important;
  z-index: 2 !important;
  width: min(720px, 48vw) !important;
  max-width: 720px !important;
  margin: 0 !important;
  color: var(--dm180-ink) !important;
}
.dm180-hero-kicker {
  color: #8b6715 !important;
  font-family: "Manrope", Arial, sans-serif !important;
  font-size: clamp(.69rem, .75vw, .82rem) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
}
.dm180-hero-title {
  max-width: 700px !important;
  margin: 22px 0 20px !important;
  color: var(--dm180-ink) !important;
  font-family: "Manrope", Arial, sans-serif !important;
  font-size: clamp(2.7rem, 4.05vw, 4.25rem) !important;
  font-weight: 600 !important;
  line-height: 1.02 !important;
  letter-spacing: -.045em !important;
  text-wrap: balance !important;
  text-shadow: 0 2px 18px rgba(255,255,255,.42) !important;
}
.dm180-hero-title > span {
  display: block !important;
  white-space: nowrap !important;
}
.dm180-hero-title em {
  color: #b98714 !important;
  font-style: normal !important;
  font-weight: 700 !important;
}
.dm180-hero-copy {
  max-width: 610px !important;
  margin: 0 0 28px !important;
  color: rgba(7, 21, 14, .82) !important;
  font-family: "Manrope", Arial, sans-serif !important;
  font-size: clamp(.96rem, 1.05vw, 1.08rem) !important;
  font-weight: 500 !important;
  line-height: 1.72 !important;
  text-shadow: 0 1px 10px rgba(255,255,255,.38) !important;
}
.dm180-hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 12px !important;
}
.dm180-home-hero .dm180-hero-actions a,
.dm180-home-hero .dm180-hero-actions button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 46px !important;
  padding: 0 22px !important;
  border-radius: 15px !important;
  font-family: "Manrope", Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
}
.dm180-home-hero .dm180-hero-actions a:first-child,
.dm180-home-hero .dm180-hero-actions button:first-child {
  color: #07150e !important;
  background: linear-gradient(135deg, #f1cf68, #dcae35) !important;
  border-color: rgba(132,93,10,.22) !important;
  box-shadow: 0 14px 30px rgba(147,103,14,.18) !important;
}
.dm180-home-hero .dm180-hero-actions a:not(:first-child),
.dm180-home-hero .dm180-hero-actions button:not(:first-child) {
  color: var(--dm180-ink) !important;
  background: rgba(255,255,255,.45) !important;
  border-color: rgba(80,64,24,.34) !important;
  backdrop-filter: blur(8px) !important;
}

/* Four exact collection cards, using the four user-selected product photos. */
.dm180-collection {
  position: relative !important;
  z-index: 2 !important;
  margin: 0 !important;
  padding: clamp(58px, 6.4vw, 100px) clamp(16px, 3.2vw, 54px) !important;
  min-height: auto !important;
  border: 0 !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(215,170,56,.085), transparent 39%),
    linear-gradient(180deg, #050b07 0%, #020704 100%) !important;
}
.dm180-collection, .dm180-collection * { box-sizing: border-box !important; }
.dm180-collection-shell { width: min(1640px, 100%) !important; margin: 0 auto !important; }
.dm180-collection-head { margin: 0 auto clamp(32px, 4vw, 58px) !important; text-align: center !important; }
.dm180-collection-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 11px !important;
  color: var(--dm180-gold-soft) !important;
  font: 800 12px/1 "Manrope", sans-serif !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}
.dm180-collection-kicker::before { content: "" !important; width: 42px !important; height: 1px !important; background: linear-gradient(90deg, transparent, var(--dm180-gold)) !important; }
.dm180-collection-title {
  margin: 17px 0 0 !important;
  color: var(--dm180-cream) !important;
  font-family: "Manrope", Arial, sans-serif !important;
  font-size: clamp(2.3rem, 4.25vw, 4.35rem) !important;
  font-weight: 600 !important;
  line-height: 1.02 !important;
  letter-spacing: -.045em !important;
}
.dm180-collection-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(18px, 2vw, 30px) !important;
  align-items: stretch !important;
}
.dm180-product-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-width: 0 !important;
  padding: 13px 13px 25px !important;
  overflow: hidden !important;
  border: 1px solid rgba(215,170,56,.34) !important;
  border-radius: 28px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.035), transparent 42%), rgba(7,16,11,.9) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.035) !important;
  transition: transform .45s cubic-bezier(.2,.8,.2,1), border-color .45s ease, box-shadow .45s ease !important;
}
.dm180-product-card:hover { transform: translateY(-9px) !important; border-color: rgba(239,207,114,.68) !important; box-shadow: 0 34px 86px rgba(0,0,0,.42), 0 0 34px rgba(215,170,56,.08) !important; }
.dm180-product-media { position: relative !important; aspect-ratio: 4/5 !important; overflow: hidden !important; border-radius: 20px !important; background: #10140f !important; }
.dm180-product-media img { display: block !important; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center !important; transform: scale(1.003) !important; transition: transform .7s cubic-bezier(.2,.8,.2,1), filter .7s ease !important; }
.dm180-product-card:hover .dm180-product-media img { transform: scale(1.04) !important; filter: contrast(1.04) saturate(1.04) !important; }
.dm180-product-body { display: flex !important; flex: 1 1 auto !important; flex-direction: column !important; padding: 22px 15px 0 !important; text-align: center !important; }
.dm180-product-kicker { margin: 0 0 9px !important; color: var(--dm180-gold-soft) !important; font: 800 11px/1.25 "Manrope", sans-serif !important; letter-spacing: .16em !important; text-transform: uppercase !important; }
.dm180-product-title { margin: 0 !important; color: var(--dm180-gold-soft) !important; font: 600 clamp(1.65rem, 1.8vw, 2.1rem)/1.08 "Manrope", sans-serif !important; letter-spacing: -.035em !important; }
.dm180-product-copy { min-height: 5em !important; margin: 13px auto 18px !important; color: rgba(244,236,213,.82) !important; font: 500 clamp(.9rem, .98vw, 1.02rem)/1.65 "Manrope", sans-serif !important; }
.dm180-product-link { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important; width: fit-content !important; margin: auto auto 0 !important; padding: 9px 0 7px !important; color: var(--dm180-gold-soft) !important; border-bottom: 1px solid rgba(215,170,56,.56) !important; font: 800 12px/1 "Manrope", sans-serif !important; letter-spacing: .15em !important; text-decoration: none !important; text-transform: uppercase !important; }
.dm180-product-link span { transition: transform .3s ease !important; }
.dm180-product-link:hover span { transform: translateX(5px) !important; }

@keyframes dm180Rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
.dm180-collection.dm180-visible .dm180-collection-head,
.dm180-collection.dm180-visible .dm180-product-card { animation: dm180Rise .72s both cubic-bezier(.2,.8,.2,1) !important; }
.dm180-collection.dm180-visible .dm180-product-card:nth-child(2) { animation-delay: .07s !important; }
.dm180-collection.dm180-visible .dm180-product-card:nth-child(3) { animation-delay: .14s !important; }
.dm180-collection.dm180-visible .dm180-product-card:nth-child(4) { animation-delay: .21s !important; }

@media (max-width: 1180px) {
  .dm180-collection-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 900px) {
  .dm180-home-hero {
    align-items: flex-end !important;
    min-height: clamp(610px, calc(100svh - 92px), 760px) !important;
    padding: 28px 22px 34px !important;
    background-position: 66% center !important;
  }
  .dm180-home-hero::before {
    background: linear-gradient(180deg,
      rgba(249,242,226,0) 28%,
      rgba(249,242,226,.18) 48%,
      rgba(249,242,226,.83) 72%,
      rgba(249,242,226,.97) 100%) !important;
  }
  .dm180-hero-content { width: min(100%, 620px) !important; max-width: 620px !important; }
  .dm180-hero-title { max-width: 620px !important; margin: 13px 0 13px !important; font-size: clamp(2.15rem, 7.8vw, 3.05rem) !important; line-height: 1.02 !important; }
  .dm180-hero-title > span { white-space: normal !important; }
  .dm180-hero-copy { max-width: 570px !important; margin-bottom: 18px !important; font-size: .92rem !important; line-height: 1.55 !important; }
  .dm180-home-hero .dm180-hero-actions a,
  .dm180-home-hero .dm180-hero-actions button { min-height: 43px !important; padding: 0 17px !important; border-radius: 13px !important; font-size: 10px !important; }
}
@media (max-width: 640px) {
  .dm180-home-hero { min-height: clamp(600px, calc(100svh - 82px), 720px) !important; padding: 24px 17px 27px !important; background-position: 64% center !important; }
  .dm180-hero-kicker { font-size: .62rem !important; letter-spacing: .15em !important; }
  .dm180-hero-title { font-size: clamp(2rem, 9vw, 2.65rem) !important; letter-spacing: -.05em !important; }
  .dm180-hero-copy { display: -webkit-box !important; overflow: hidden !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; }
  .dm180-hero-actions { gap: 9px !important; }
  .dm180-collection { padding: 52px 13px 62px !important; }
  .dm180-collection-grid { grid-template-columns: 1fr !important; gap: 21px !important; }
  .dm180-product-card { padding: 10px 10px 22px !important; border-radius: 23px !important; }
  .dm180-product-media { border-radius: 17px !important; }
  .dm180-product-copy { min-height: 0 !important; }
}
@media (max-width: 390px) {
  .dm180-hero-actions { flex-direction: column !important; align-items: stretch !important; }
  .dm180-home-hero .dm180-hero-actions a,
  .dm180-home-hero .dm180-hero-actions button { width: 100% !important; }
}
@media (prefers-reduced-motion: reduce) {
  .dm180-collection *, .dm180-home-hero * { animation: none !important; transition: none !important; }
}