/* ==========================================================================
   ORNAMENTS — monograma, esquinas filigrana y marco floral (SVG en CSS)
   Colores en dorado; se escalan sin pérdida.
   ========================================================================== */

/* ---- Monograma C & M ---- */
.monogram {
  font-family: var(--font-display);
  color: var(--gold-dark);
  line-height: 1;
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.06em;
  letter-spacing: 0.02em;
}
.monogram span { font-size: 1.75em; font-weight: 600; }
.monogram .amp {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 1.05em;
  color: var(--gold);
  transform: translateY(-0.05em);
}

/* Monograma enmarcado en óvalo (portada) */
.monogram--framed {
  position: relative;
  width: clamp(6rem, 22vw, 8.5rem);
  height: clamp(7rem, 26vw, 10rem);
  margin-inline: auto;
  font-size: clamp(0.95rem, 3vw, 1.25rem);
  align-items: center;
}
.monogram--framed::before {
  content: "";
  position: absolute;
  inset: 0;
  background: no-repeat center / contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 240'%3E%3Cg fill='none' stroke='%23C1984B' stroke-width='1.6'%3E%3Cellipse cx='100' cy='120' rx='58' ry='78'/%3E%3Cellipse cx='100' cy='120' rx='64' ry='84' stroke-width='0.8'/%3E%3Cpath d='M100 33 C90 20 74 20 70 30 C66 20 50 22 52 36 C40 34 36 48 48 52 C40 60 48 72 58 66 C64 76 80 74 82 62 C90 70 104 64 100 52 C112 52 114 38 102 38 Z' stroke-width='1.1' opacity='0.9'/%3E%3Cpath d='M100 207 C90 220 74 220 70 210 C66 220 50 218 52 204 C40 206 36 192 48 188 C40 180 48 168 58 174 C64 164 80 166 82 178 C90 170 104 176 100 188 C112 188 114 202 102 202 Z' stroke-width='1.1' opacity='0.9'/%3E%3Cpath d='M42 120 q-14 -10 -26 0 q14 10 26 0' stroke-width='1'/%3E%3Cpath d='M158 120 q14 -10 26 0 q-14 10 -26 0' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E");
}
.monogram--framed span { font-size: 2.4em; }

/* Monograma chico (carta dentro del sobre) */
.monogram--sm { font-size: 0.7rem; }
.monogram--sm span { font-size: 1.6em; }

/* ---- Esquinas filigrana ---- */
.ornament-corner {
  position: absolute;
  width: clamp(3.5rem, 14vw, 6rem);
  height: clamp(3.5rem, 14vw, 6rem);
  background: no-repeat center / contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%23C1984B' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M8 8 L8 46 M8 8 L46 8'/%3E%3Cpath d='M8 8 L8 40 M8 8 L40 8' stroke-width='0.7' transform='translate(4,4)'/%3E%3Cpath d='M14 30 C14 52 34 58 52 46 C40 60 20 60 14 44 C10 54 6 40 14 30 Z' opacity='0.9'/%3E%3Cpath d='M30 14 C52 14 58 34 46 52 C60 40 60 20 44 14 C54 10 40 6 30 14 Z' opacity='0.9'/%3E%3Cpath d='M20 20 q26 4 40 26' stroke-width='0.9'/%3E%3Ccircle cx='60' cy='48' r='2.4' fill='%23C1984B' stroke='none'/%3E%3Ccircle cx='48' cy='60' r='2.4' fill='%23C1984B' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  opacity: 0.85;
  pointer-events: none;
  z-index: 2;
}
.ornament-corner--tl { top: var(--sp-4); left: var(--sp-4); }
.ornament-corner--tr { top: var(--sp-4); right: var(--sp-4); transform: scaleX(-1); }
.ornament-corner--bl { bottom: var(--sp-4); left: var(--sp-4); transform: scaleY(-1); }
.ornament-corner--br { bottom: var(--sp-4); right: var(--sp-4); transform: scale(-1, -1); }

/* ---- Ramita floral (separador decorado, reutilizable) ---- */
.floral-sprig {
  width: clamp(7rem, 40vw, 11rem);
  height: 2.5rem;
  margin-inline: auto;
  background: no-repeat center / contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 60'%3E%3Cg fill='none' stroke='%23C1984B' stroke-width='1.3' stroke-linecap='round'%3E%3Cline x1='40' y1='30' x2='220' y2='30' stroke-width='0.8'/%3E%3Cg%3E%3Cpath d='M120 30 q-14 -16 -30 -12 q10 8 30 12'/%3E%3Cpath d='M140 30 q14 -16 30 -12 q-10 8 -30 12'/%3E%3Cpath d='M124 30 q-8 14 -22 14 q6 -10 22 -14'/%3E%3Cpath d='M136 30 q8 14 22 14 q-6 -10 -22 -14'/%3E%3C/g%3E%3Ccircle cx='130' cy='30' r='6' fill='%23D9BC7E' stroke='%23C1984B'/%3E%3Ccircle cx='130' cy='30' r='2' fill='%23A67C34' stroke='none'/%3E%3Ccircle cx='60' cy='30' r='3' fill='%23D9BC7E' stroke='none'/%3E%3Ccircle cx='200' cy='30' r='3' fill='%23D9BC7E' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
}
