/* ==========================================================================
   HOGAN'S JEWELERS  -  BIRTHSTONE JEWELRY WIDGET
   Scoped to .hogans-birthstones
   Palette: Charcoal #252525 / Antique Gold #8C7A5D / Ivory #FAF8F4 / White #FFFFFF
   Fonts: Cormorant Garamond (display) + Jost (body/UI)
   ========================================================================== */

.hogans-birthstones {
  background-color: #FAF8F4 !important;
  color: #252525 !important;
  padding: 56px 18px 64px !important;
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif !important;
}

.hogans-birthstones * {
  box-sizing: border-box;
}

/* ----- Intro ----- */
.hogans-birthstones__intro {
  max-width: 720px;
  margin: 0 auto 44px !important;
  text-align: center;
}

.hogans-birthstones__eyebrow {
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
  color: #8C7A5D !important;
  margin: 0 0 14px !important;
}

.hogans-birthstones__title {
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif !important;
  font-weight: 400 !important;
  font-size: 2.6rem !important;
  line-height: 1.1 !important;
  color: #252525 !important;
  margin: 0 0 18px !important;
}

.hogans-birthstones__lead {
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 300 !important;
  font-size: 1.04rem !important;
  line-height: 1.7 !important;
  color: #3a3a3a !important;
  margin: 0 auto !important;
  max-width: 620px;
}

/* ----- Grid ----- */
.hogans-birthstones__grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 16px !important;
  max-width: 1100px;
  margin: 0 auto !important;
}

@media (min-width: 768px) {
  .hogans-birthstones__grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
  }
}

@media (min-width: 992px) {
  .hogans-birthstones__grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 22px !important;
  }
}

/* ----- Card ----- */
.hogans-birthstones__card {
  display: flex !important;
  flex-direction: column !important;
  text-decoration: none !important;
  background-color: #FFFFFF !important;
  border: 1px solid #EAE3D6 !important;
  border-radius: 2px !important;
  overflow: hidden !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease !important;
}

.hogans-birthstones__card:hover,
.hogans-birthstones__card:focus {
  border-color: #8C7A5D !important;
  box-shadow: 0 12px 28px rgba(37, 37, 37, 0.10) !important;
  transform: translateY(-3px) !important;
  text-decoration: none !important;
}

/* ----- Card image ----- */
.hogans-birthstones__media {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 3 !important;
  overflow: hidden !important;
  background-color: #EFEAE1 !important;
  text-decoration: none !important;
}

.hogans-birthstones__img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.4s ease !important;
}

.hogans-birthstones__card:hover .hogans-birthstones__img {
  transform: scale(1.05) !important;
}

/* ----- Card text ----- */
.hogans-birthstones__body {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  padding: 22px 16px 26px !important;
}

.hogans-birthstones__month {
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 0.7rem !important;
  font-weight: 500 !important;
  color: #8C7A5D !important;
  margin-bottom: 6px !important;
}

.hogans-birthstones__gem {
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif !important;
  font-weight: 500 !important;
  font-size: 1.55rem !important;
  line-height: 1.1 !important;
  color: #252525 !important;
  margin-bottom: 16px !important;
}

.hogans-birthstones__cta {
  display: inline-block !important;
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.7rem !important;
  font-weight: 500 !important;
  color: #252525 !important;
  text-decoration: none !important;
  padding-bottom: 3px !important;
  border-bottom: 1px solid #8C7A5D !important;
  transition: color 0.2s ease !important;
}

.hogans-birthstones__card:hover .hogans-birthstones__cta {
  color: #8C7A5D !important;
}

/* ----- FAQ ----- */
.hogans-birthstones__faq {
  max-width: 760px;
  margin: 60px auto 0 !important;
}

.hogans-birthstones__faq-title {
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif !important;
  font-weight: 400 !important;
  font-size: 1.9rem !important;
  color: #252525 !important;
  text-align: center;
  margin: 0 0 22px !important;
}

.hogans-birthstones__item {
  border-bottom: 1px solid #EAE3D6 !important;
  padding: 6px 0 !important;
}

.hogans-birthstones__q {
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 400 !important;
  font-size: 1.02rem !important;
  color: #252525 !important;
  list-style: none !important;
  cursor: pointer !important;
  padding: 16px 36px 16px 4px !important;
  position: relative !important;
}

.hogans-birthstones__q::-webkit-details-marker {
  display: none !important;
}

.hogans-birthstones__q::after {
  content: "+" !important;
  position: absolute !important;
  right: 8px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: #8C7A5D !important;
  font-size: 1.3rem !important;
  font-weight: 300 !important;
  line-height: 1 !important;
}

.hogans-birthstones__item[open] .hogans-birthstones__q::after {
  content: "\2013" !important; /* en dash glyph used only as a minus icon, not in copy */
}

.hogans-birthstones__a {
  padding: 0 4px 18px !important;
}

.hogans-birthstones__a p {
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 300 !important;
  font-size: 0.98rem !important;
  line-height: 1.7 !important;
  color: #3a3a3a !important;
  margin: 0 !important;
}

.hogans-birthstones__a a {
  color: #8C7A5D !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

.hogans-birthstones__a a:hover {
  color: #6f6047 !important;
}

/* ----- Closing custom band ----- */
.hogans-birthstones__custom {
  max-width: 760px;
  margin: 64px auto 0 !important;
  text-align: center;
  padding: 44px 24px !important;
  background-color: #FFFFFF !important;
  border: 1px solid #EAE3D6 !important;
  border-radius: 2px !important;
}

.hogans-birthstones__custom-eyebrow {
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 0.7rem !important;
  font-weight: 500 !important;
  color: #8C7A5D !important;
  margin: 0 0 12px !important;
}

.hogans-birthstones__custom-title {
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif !important;
  font-weight: 400 !important;
  font-size: 2rem !important;
  color: #252525 !important;
  margin: 0 0 14px !important;
}

.hogans-birthstones__custom-text {
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 300 !important;
  font-size: 1.02rem !important;
  line-height: 1.7 !important;
  color: #3a3a3a !important;
  max-width: 520px;
  margin: 0 auto 26px !important;
}

.hogans-birthstones__custom-btn {
  display: inline-block !important;
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.74rem !important;
  font-weight: 500 !important;
  color: #FFFFFF !important;
  background-color: #8C7A5D !important;
  text-decoration: none !important;
  padding: 14px 34px !important;
  border: 1px solid #8C7A5D !important;
  border-radius: 2px !important;
  transition: background-color 0.25s ease, border-color 0.25s ease !important;
}

.hogans-birthstones__custom-btn:hover,
.hogans-birthstones__custom-btn:focus {
  background-color: #6f6047 !important;
  border-color: #6f6047 !important;
  color: #FFFFFF !important;
  text-decoration: none !important;
}

/* ----- Small screens ----- */
@media (max-width: 480px) {
  .hogans-birthstones__title { font-size: 2.1rem !important; }
  .hogans-birthstones__gem { font-size: 1.4rem !important; }
}