/* ============================================================
   Ofishel Jewelry - custom widget styles
   Paste this entire file into Punchmark Site Manager under
   Design or Theme Settings in the Global CSS field.

   Colors and fonts are inherited from the master template
   (Sound & Sand / Editorial Coastal). Nothing here hardcodes
   a hex value or a font family on purpose.
   ============================================================ */

/* --- Malo Bands embed --------------------------------------- */
.ofishel-malo-embed {
  width: 100%;
  margin: 0 0 2rem;
}

.ofishel-malo-embed__intro {
  max-width: 46rem;
  margin: 0 auto 1.5rem;
  text-align: center;
}

.ofishel-malo-embed__title {
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  line-height: 1.2;
  margin: 0 0 .5rem;
}

.ofishel-malo-embed__text {
  font-size: 1rem;
  line-height: 1.6;
  margin: 0;
}

.ofishel-malo-embed__frame {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.ofishel-malo-embed__frame iframe {
  display: block;
  width: 100%;
  min-height: 4200px;
  border: 0;
}

@media (max-width: 991.98px) {
  .ofishel-malo-embed__frame iframe { min-height: 5200px; }
}

@media (max-width: 575.98px) {
  .ofishel-malo-embed__frame iframe { min-height: 6400px; }
}

/* --- Loose diamonds page ------------------------------------ */
.ofishel-diamonds {
  width: 100%;
  max-width: 72rem;
  margin: 0 auto;
  padding: 0 1rem 3rem;
}

.ofishel-diamonds__intro {
  max-width: 52rem;
  margin: 0 auto 3rem;
  text-align: center;
}

.ofishel-diamonds__title {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  line-height: 1.15;
  margin: 0 0 1rem;
}

.ofishel-diamonds__lead {
  font-size: 1.125rem;
  line-height: 1.7;
  margin: 0;
}

.ofishel-diamonds__section {
  margin: 0 0 3.5rem;
}

.ofishel-diamonds__heading {
  font-size: clamp(1.375rem, 2.75vw, 2rem);
  line-height: 1.2;
  margin: 0 0 .75rem;
  text-align: center;
}

.ofishel-diamonds__text {
  font-size: 1rem;
  line-height: 1.7;
  max-width: 50rem;
  margin: 0 auto 2rem;
  text-align: center;
}

.ofishel-diamonds__text--note {
  margin-top: 2rem;
  margin-bottom: 0;
  font-style: italic;
  opacity: .9;
}

.ofishel-diamonds__grid {
  margin-bottom: 0;
}

.ofishel-diamonds__card,
.ofishel-diamonds__panel {
  height: 100%;
  padding: 1.75rem 1.5rem;
  border: 1px solid currentColor;
  border-color: color-mix(in srgb, currentColor 25%, transparent);
  border-radius: .25rem;
  background: color-mix(in srgb, currentColor 5%, transparent);
}

.ofishel-diamonds__panel {
  padding: 2rem 1.75rem;
  background: color-mix(in srgb, currentColor 8%, transparent);
}

.ofishel-diamonds__card-title {
  font-size: 1.25rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin: 0 0 .75rem;
}

.ofishel-diamonds__panel-title {
  font-size: 1.375rem;
  margin: 0 0 .75rem;
}

.ofishel-diamonds__card-text {
  font-size: .9375rem;
  line-height: 1.65;
  margin: 0 0 1rem;
}

.ofishel-diamonds__card-text:last-child {
  margin-bottom: 0;
}

.ofishel-diamonds__card-text--muted {
  font-size: .875rem;
  opacity: .82;
}

.ofishel-diamonds__cta {
  text-align: center;
  padding: 2.5rem 1.5rem;
  border-top: 1px solid currentColor;
  border-top-color: color-mix(in srgb, currentColor 25%, transparent);
}

.ofishel-diamonds__buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .75rem;
}

.ofishel-diamonds__btn {
  min-width: 14rem;
}

@media (max-width: 575.98px) {
  .ofishel-diamonds__btn {
    width: 100%;
    min-width: 0;
  }
}