/* Paleta de Teresa y Ariel: dorado suave, café au lait, Bone y Milk. */
:root {
  --gold: #d1b989;
  --cafe-au-lait: #a3885b;
  --bone: #e2dccc;
  --milk: #fffdf3;
  --taupe: var(--cafe-au-lait);
  --cream: var(--milk);
  --coffee: #4b3b2b;
  --rose-earth: var(--gold);
  --mauve: var(--cafe-au-lait);
  --sage: var(--cafe-au-lait);
  --peach: var(--gold);
  --rust: var(--coffee);
  --paper: var(--milk);
  --ink: var(--coffee);
  --soft-sage: var(--bone);
  --soft-mauve: var(--bone);
  --line: #a3885b55;
}
body {
  background: var(--milk);
  color: var(--coffee);
}
#myHeader,
#navbarResponsive {
  background: var(--milk);
  border-color: var(--line);
}
.nav-link:hover,
.nav-link:focus-visible {
  color: var(--coffee);
  text-decoration: underline;
  text-decoration-color: var(--cafe-au-lait);
  text-underline-offset: 7px;
}
.pre-page.classic-envelope,
html[data-envelope-loading] body {
  background: var(--bone);
}
.classic-layer {
  filter: sepia(.18) saturate(.75);
}
.layer-middle::after {
  background: #fffdf338;
}
.classic-copy > .eyebrow,
.classic-actions > p {
  color: var(--coffee);
}
.classic-copy h2 em {
  color: #80673f;
}
.classic-actions .btn-pre-page {
  background: var(--milk);
  border-color: var(--cafe-au-lait);
  color: var(--coffee);
}
.hero-photo::after {
  background: linear-gradient(0deg, #4b3b2be6, #4b3b2b18 75%);
}
.hero h1,
.hero h1 em,
.hero-date span,
.hero-discover {
  color: var(--milk);
}
.save-date {
  background: var(--bone);
}
.countdown strong {
  color: var(--coffee);
}
.countdown-unit + .countdown-unit::before {
  background: var(--cafe-au-lait);
}
.button {
  background: var(--coffee);
  color: var(--milk);
  border-color: var(--coffee);
}
.button:hover {
  background: var(--bone);
  color: var(--coffee);
  border-color: var(--cafe-au-lait);
}
.section.wedding-message {
  background: var(--milk);
}
.section.venues {
  background: var(--bone);
}
.venues::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url('../images/flores-sobre.png') center / auto 100% repeat-x;
  opacity: .1;
  filter: grayscale(1) sepia(0.65) saturate(0.55);
  pointer-events: none;
}
.venue.reception-only {
  background: var(--milk);
  border: 1px solid var(--cafe-au-lait);
  box-shadow: 0 12px 36px #4b3b2b0a;
}
.venue-copy .eyebrow {
  color: var(--coffee);
}
.section.dress-code {
  background: #fffdf4;
}
.formal-card {
  background: var(--milk);
  border: 1px solid var(--gold);
}
.dress-code .dress-heading .eyebrow {
  color: var(--coffee);
}
.adults-only {
  background: var(--milk);
}
.registry {
  background: var(--bone);
}
.section.rsvp {
  background: var(--milk);
  color: var(--coffee);
}
.rsvp-heading h2,
.rsvp-heading > .eyebrow {
  color: var(--coffee);
}
.confirmation-field input,
.confirmation-field select {
  background: var(--milk);
  border-color: var(--gold);
  color: var(--coffee);
}
.confirmation-field select option {
  background: var(--coffee);
  color: var(--milk);
}
.whatsapp-confirmation .button {
  background: var(--gold);
  color: var(--coffee);
  border-color: var(--gold);
}
.whatsapp-confirmation .button:hover {
  background: var(--milk);
  color: var(--coffee);
}
.site-footer {
  background: var(--bone);
  color: var(--coffee);
}
.site-footer .eyebrow,
.site-footer a,
.site-footer .footer-bottom {
  color: var(--coffee);
  border-color: var(--line);
}
.music-box button {
  background: var(--milk);
  color: var(--coffee);
  border-color: var(--cafe-au-lait);
}
:focus-visible {
  outline-color: var(--cafe-au-lait);
}
/* Solo se dibujan los bordes del PNG; su centro queda libre para el formulario. */
.section.rsvp {
  padding: clamp(24px, 4vw, 64px) clamp(12px, 3vw, 48px);
}
.confirmation-frame {
  max-width: 1480px;
  margin: auto;
  border: clamp(40px, 5.5vw, 82px) solid transparent;
  border-image-source: url('../images/marco-confirmacion.png');
  border-image-slice: 170;
  border-image-repeat: round;
  padding: clamp(16px, 3vw, 40px);
}
@media (max-width: 1100px) {
  .confirmation-frame .confirmation-fields {
    grid-template-columns: 1fr 1fr;
  }
  .confirmation-frame .whatsapp-confirmation .button {
    grid-column: 1 / -1;
  }
}
@media (max-width: 600px) {
  .confirmation-frame {
    border-width: 30px;
    padding: 24px 10px;
  }
  .confirmation-frame .confirmation-fields {
    grid-template-columns: 1fr;
  }
  .confirmation-frame .confirmation-field input,
  .confirmation-frame .confirmation-field select,
  .confirmation-frame .whatsapp-confirmation .button {
    padding-inline: 12px;
    font-size: 16px;
  }
}

.reception-only .venue-copy {
  container-type: inline-size;
}
body .reception-only .venue-copy .eyebrow {
  font-family: var(--signature);
  font-size: clamp(38px, 5vw, 52px);
  font-weight: 400;
  font-style: normal;
  text-transform: none;
}
body .reception-only .venue-copy h3 {
  white-space: nowrap;
  font-size: clamp(10px, 3.4cqi, 28px);
  letter-spacing: 0;
  line-height: 1.4;
}
@media (max-width: 640px) {
  .reception-only .venue-copy {
    padding-inline: 16px;
  }
}
.reception-photo {
  margin: 0;
}
.reception-photo img {
  display: block;
  width: 100%;
  height: auto;
}
.venue.reception-only {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  max-width: 1120px;
  align-items: stretch;
}
.reception-photo {
  min-width: 0;
  min-height: 380px;
}
.reception-photo img {
  height: 100%;
  object-fit: cover;
  object-position: center;
}
@media (max-width: 700px) {
  .venue.reception-only {
    grid-template-columns: 1fr;
  }
  .reception-photo {
    min-height: 0;
  }
  .reception-photo img {
    height: auto;
  }
}
.confirmation-adults {
  max-width: 720px;
  margin: 0 auto 36px;
  padding: 24px 0;
  border-top: 1px solid var(--gold);
  border-bottom: 1px solid var(--gold);
  text-align: center;
}
.confirmation-adults h3 {
  margin: 0 0 12px;
  color: var(--coffee);
  font-size: 22px;
}
.confirmation-adults p {
  margin: 0;
  color: var(--coffee);
  font-size: 16px;
  line-height: 1.8;
}
/* Tarjeta de regalos inspirada en papelería de boda. */
.gift-card {
  max-width: 780px;
  margin: auto;
  border: clamp(32px, 6vw, 64px) solid transparent;
  border-image: none;
  padding: 32px clamp(8px, 3vw, 36px);
  background: transparent;
  text-align: center;
}
.gift-card h2 {
  margin: 0;
}
.gift-envelope {
  display: block;
  width: min(100%, 280px);
  height: auto;
  margin: 28px auto;
}
.gift-card p {
  max-width: 480px;
  margin: 0 auto;
  color: var(--coffee);
  font: 400 17px/1.85 var(--sans);
}
@media (max-width: 600px) {
  .section.registry {
    padding-inline: 16px;
  }
  .gift-card {
    padding-block: 24px;
  }
  .gift-envelope {
    width: min(100%, 220px);
    margin-block: 22px;
  }
  .gift-card p {
    font-size: 16px;
    line-height: 1.75;
  }
}
.section.rsvp .confirmation-field input,
.section.rsvp .confirmation-field select {
  border-color: var(--cafe-au-lait);
}
.section.rsvp .confirmation-field input:focus-visible,
.section.rsvp .confirmation-field select:focus-visible,
.section.rsvp .whatsapp-confirmation .button:focus-visible {
  outline-color: var(--coffee);
}
.section.rsvp .whatsapp-confirmation .button:hover {
  background: var(--bone);
}
.gift-card {
  --gift-frame-edge: clamp(32px, 6vw, 64px);
  position: relative;
  border-width: var(--gift-frame-edge);
}
/* Marco de regalos sobre el fondo de la sección. */
.gift-card {
  isolation: isolate;
}
.wedding-message-card {
  position: relative;
  isolation: isolate;
  border-image: url('../images/marco-historia-ornamental-dorado.png') 180 / 1 / 0 round;
}
/* Tarjeta de papelería con sello de lacre y sobres de línea. */
.section.registry {
  padding: 76px 32px;
  background: #c5b18e;
}
.gift-card {
  width: 100%;
  max-width: 590px;
  padding: 32px 44px 36px;
  background: var(--milk);
  border: 1px solid var(--cafe-au-lait);
  box-shadow: 9px 16px 24px #4b3b2b33, 0 2px 5px #4b3b2b1a;
  transform: rotate(-4deg);
}
.gift-wax-seal {
  position: absolute;
  top: -34px;
  right: -18px;
  width: clamp(76px, 10vw, 102px);
  height: auto;
  filter: drop-shadow(1px 4px 3px #4b3b2b40);
}
.gift-card p {
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.65;
}
.gift-envelope-pair {
  position: relative;
  width: 110px;
  height: 80px;
  margin: 18px auto;
  color: var(--cafe-au-lait);
  transform: scale(.85);
}
.gift-line-envelope {
  position: absolute;
  width: 66px;
  height: 44px;
  border: 2px solid currentColor;
  overflow: hidden;
  background: var(--milk);
}
.gift-line-envelope::before,
.gift-line-envelope::after {
  content: '';
  position: absolute;
  left: 9px;
  width: 44px;
  height: 44px;
  border: 2px solid currentColor;
  transform: rotate(45deg);
}
.gift-line-envelope::before {
  bottom: -32px;
}
.gift-line-envelope::after {
  top: -29px;
  background: var(--milk);
}
.envelope-back {
  right: 4px;
  top: 10px;
  transform: rotate(18deg);
}
.envelope-front {
  left: 6px;
  bottom: 8px;
  transform: rotate(-10deg);
}
@media (max-width: 600px) {
  .section.registry {
    padding: 64px 28px;
  }
  .gift-card {
    padding: 44px 24px 28px;
    transform: rotate(-3deg);
  }
  .gift-wax-seal {
    top: -28px;
    right: -14px;
  }
  .gift-card p {
    font-size: 16px;
  }
}
.wedding-message-card {
  text-align: left;
}
.wedding-message-card h2 {
  margin: 0 0 28px;
  text-align: left;
  font-family: var(--signature);
}
.wedding-message-card .wedding-message-signature {
  text-align: right;
}
.wedding-message-card p {
  font-size: calc(clamp(16px, 1.7vw, 19px) - 3pt);
}
/* Tamaño uniforme del texto de párrafo; los rótulos y nombres usan su jerarquía. */
body#home p:not(.eyebrow):not(.formal-couple) {
  font-size: 15px;
}
body#home .dress-adults p:not(.eyebrow):not(.formal-couple) {
  font-size: 13px;
}
.confirmation-columns {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(28px, 5vw, 70px);
}
.confirmation-columns .whatsapp-confirmation,
.confirmation-information {
  width: 100%;
  min-width: 0;
}
.confirmation-columns .confirmation-fields {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 18px;
}
.section.rsvp .confirmation-information .rsvp-heading {
  margin: 0 0 24px;
  text-align: left;
}
.rsvp-adults {
  padding-top: 22px;
  border-top: 1px solid var(--cafe-au-lait);
  text-align: left;
}
.rsvp-adults h3 {
  margin: 0 0 12px;
  color: var(--coffee);
  font: 400 18px/1.4 var(--serif);
}
body#home .rsvp-adults p:not(.eyebrow):not(.formal-couple) {
  margin: 0;
  font-size: 13px;
  line-height: 1.7;
}
@media (max-width: 800px) {
  .confirmation-columns {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .confirmation-information {
    grid-row: 1;
  }
}
.confirmation-columns .whatsapp-confirmation .button {
  grid-column: 1 / -1;
}
@media (max-width: 600px) {
  .confirmation-columns .confirmation-fields {
    grid-template-columns: 1fr;
  }
}
body#home #confirmation-help {
  font-size: 13px;
  line-height: 1.6;
}
/* Ambos marcos comparten el mismo tono dorado de la paleta. */
.confirmation-frame {
  --confirmation-border: clamp(40px, 5.5vw, 82px);
  position: relative;
  isolation: isolate;
  border-width: var(--confirmation-border);
  border-image: none;
}
.confirmation-frame::before {
  content: '';
  position: absolute;
  inset: calc(-1 * var(--confirmation-border));
  z-index: -1;
  border: var(--confirmation-border) solid transparent;
  border-image: url('../images/marco-historia-transparente.png') 180 / 1 / 0 round;
  filter: drop-shadow(0 2px 2px rgba(75, 59, 43, 0.16));
  pointer-events: none;
}
.wedding-message-card {
  border-image: none;
  background: transparent;
  box-shadow: none;
}
.wedding-message-card::before {
  content: '';
  position: absolute;
  inset: calc(-1 * var(--frame-edge));
  z-index: -1;
  border: var(--frame-edge) solid transparent;
  border-image: url('../images/marco-historia-transparente.png') 180 / 1 / 0 round;
  filter: drop-shadow(0 2px 2px rgba(75, 59, 43, 0.16));
  pointer-events: none;
}
@media (max-width: 600px) {
  .confirmation-frame {
    --confirmation-border: 30px;
  }
}
.site-footer .footer-bottom img {
  filter: url(#footer-logo-coffee);
}

@media (max-width: 640px) {
  .hero {
    justify-content: flex-start;
    padding-top: max(42px, env(safe-area-inset-top));
  }
  .hero h1 {
    font-size: clamp(38px, 15vw, 64px);
    line-height: 1.2;
    white-space: nowrap;
  }
  .hero h1 em {
    display: inline;
    font-size: 0.65em;
    line-height: inherit;
    margin: 0;
    padding-inline: 3px;
  }
  .hero-date {
    display: grid;
    gap: 8px;
    margin-top: 16px;
  }
  .hero-date time,
  .hero-date span {
    white-space: nowrap;
  }
  .hero-date time {
    font-size: clamp(9px, 2.7vw, 12px);
  }
  .hero-date span {
    font-size: clamp(10px, 3vw, 13px);
    border: 0;
    padding: 0;
  }
  .hero-photo::after {
    background: linear-gradient(180deg, rgba(50, 41, 31, 0.62) 0%, rgba(50, 41, 31, 0.32) 23%, transparent 48%, rgba(50, 41, 31, 0.35) 100%);
  }
}
@media (max-width: 640px) {
  .wedding-message-signature strong {
    display: inline-block;
    margin-top: 12px;
    font: 400 clamp(36px, 5vw, 35px) / 1.4 var(--signature);
  }
}
@media (max-width: 640px) {
  .classic-copy h2 {
    font-size: clamp(37px, 14vw, 52px);
  }
}
/* Flores sobre el papel interior, detrás de las solapas. */
.layer-middle {
  overflow: hidden;
}
.envelope-flowers {
  position: absolute;
  top: 6%;
  width: clamp(180px, 32vw, 490px);
  height: 88%;
  object-fit: contain;
  opacity: 0.22;
  filter: grayscale(1) sepia(0.65) saturate(0.55) drop-shadow(1px 1px 0 rgba(75, 59, 43, 0.32)) drop-shadow(-1px -1px 0 rgba(255, 253, 243, 0.75));
  pointer-events: none;
}
.envelope-flowers-left {
  left: -4%;
}
.envelope-flowers-right {
  right: -4%;
  transform: scaleX(-1);
}
@media (max-width: 640px) {
  .envelope-flowers {
    width: 65%;
    opacity: 0.18;
  }
  .envelope-flowers-left {
    left: -15%;
  }
  .envelope-flowers-right {
    right: -15%;
  }
}
/* Solapas de papel en punta y flores laterales. */
.classic-surface {
  overflow: hidden;
  background: var(--milk);
}
.layer-middle {
  background: var(--milk);
}
.middle-paper-base {
  opacity: 0.3;
}
.classic-layer.layer-top {
  height: 65%;
  filter: drop-shadow(0 7px 5px rgba(75, 59, 43, 0.23));
}
.layer-top::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(125deg, #fffdf3, #f2eadb);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.classic-layer.layer-bottom {
  height: 38%;
  filter: drop-shadow(0 -2px 3px rgba(75, 59, 43, 0.12));
}
.layer-bottom::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #f4edde, #fffdf3 50%, #eee4d1);
  clip-path: polygon(0 100%, 50% 0, 100% 100%);
}
.classic-seal {
  top: 64%;
  width: 116px;
  height: 116px;
}
.classic-seal img {
  filter: drop-shadow(0 5px 4px rgba(75, 59, 43, 0.25));
}
.classic-copy {
  top: 18%;
}
.classic-actions {
  top: 80%;
}
.envelope-flowers {
  top: -3%;
  height: 108%;
  width: 43%;
  opacity: 0.38;
}
.envelope-flowers-left {
  left: -8%;
}
.envelope-flowers-right {
  right: -8%;
}
@media (max-width: 640px) {
  .classic-copy {
    top: 19%;
  }
  .classic-seal {
    width: 102px;
    height: 102px;
  }
  .classic-actions {
    top: 80%;
    gap: 12px;
  }
  .envelope-flowers {
    width: 76%;
    opacity: 0.33;
  }
  .envelope-flowers-left {
    left: -24%;
  }
  .envelope-flowers-right {
    right: -24%;
  }
}


.layer-middle .envelope-flowers {
  display: block;
  top: -4%;
  width: 42%;
  height: 108%;
  object-fit: contain;
  opacity: 0.26;
}
.layer-middle .envelope-flowers-left {
  left: -8%;
  transform: rotate(-28deg) scaleY(-1);
}
.layer-middle .envelope-flowers-right {
  right: -8%;
  transform: rotate(28deg) scale(-1, -1);
}
@media (max-width: 640px) {
  .layer-middle .envelope-flowers {
    width: 72%;
    opacity: 0.24;
  }
  .layer-middle .envelope-flowers-left {
    left: -24%;
  }
  .layer-middle .envelope-flowers-right {
    right: -24%;
  }
}
.layer-middle .envelope-flowers {
  top: -2%;
  width: 52%;
  height: 116%;
}
.layer-middle .envelope-flowers-left {
  left: -2%;
  transform: rotate(-38deg) scaleY(-1);
}
.layer-middle .envelope-flowers-right {
  right: -2%;
  transform: rotate(38deg) scale(-1, -1);
}
@media (max-width: 640px) {
  .layer-middle .envelope-flowers {
    width: 86%;
  }
  .layer-middle .envelope-flowers-left {
    left: -20%;
  }
  .layer-middle .envelope-flowers-right {
    right: -20%;
  }
}
/* Ramas pequeñas con caída desde los bordes superiores. */
.layer-middle .envelope-flowers {
  top: 4%;
  width: 30%;
  height: 80%;
  opacity: 0.24;
}
.layer-middle .envelope-flowers-left {
  left: -5%;
  transform: rotate(-12deg) scaleY(-1);
}
.layer-middle .envelope-flowers-right {
  right: -5%;
  transform: rotate(12deg) scale(-1, -1);
}
.layer-middle .envelope-flowers-inner-left {
  top: -12%;
  left: 12%;
  width: 24%;
  height: 74%;
  transform: rotate(-22deg) scaleY(-1);
  opacity: 0.18;
}
.layer-middle .envelope-flowers-inner-right {
  top: -12%;
  right: 12%;
  width: 24%;
  height: 74%;
  transform: rotate(22deg) scale(-1, -1);
  opacity: 0.18;
}
@media (max-width: 640px) {
  .layer-middle .envelope-flowers-left,
  .layer-middle .envelope-flowers-right {
    width: 48%;
    height: 85%;
  }
  .layer-middle .envelope-flowers-left {
    left: -14%;
  }
  .layer-middle .envelope-flowers-right {
    right: -14%;
  }
  .layer-middle .envelope-flowers-inner-left,
  .layer-middle .envelope-flowers-inner-right {
    width: 38%;
    height: 68%;
  }
  .layer-middle .envelope-flowers-inner-left {
    left: 1%;
  }
  .layer-middle .envelope-flowers-inner-right {
    right: 1%;
  }
}
/* Lirios en diagonal hacia el sello. */
.layer-middle .envelope-flowers {
  top: 0;
  width: 59%;
  height: 100%;
  object-fit: contain;
  opacity: 0.24;
  filter: grayscale(0.6) sepia(0.25) saturate(0.65);
}
.layer-middle .envelope-flowers-left {
  left: -7%;
  transform: scaleY(-1);
}
.layer-middle .envelope-flowers-right {
  right: -7%;
  transform: scale(-1, -1);
}
@media (max-width: 640px) {
  .layer-middle .envelope-flowers {
    width: 105%;
    height: 95%;
    top: 0;
    opacity: 0.22;
  }
  .layer-middle .envelope-flowers-left {
    left: -46%;
  }
  .layer-middle .envelope-flowers-right {
    right: -46%;
  }
}
.bottom-floral-paper {
  position: absolute;
  inset: 0;
  clip-path: polygon(0 100%, 50% 0, 100% 100%);
  pointer-events: none;
}
.bottom-floral-paper::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('../images/flores-sobre-lirios.png') center bottom / auto 140% no-repeat;
  opacity: 0.24;
  filter: grayscale(0.6) sepia(0.25) saturate(0.65);
}
.top-floral-paper {
  position: absolute;
  inset: 0;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  pointer-events: none;
}
.top-floral-paper img {
  position: absolute;
  top: -5%;
  width: 28%;
  height: 48%;
  object-fit: contain;
  opacity: 0.18;
  filter: grayscale(0.6) sepia(0.25) saturate(0.65);
}
.top-flower-left {
  left: -3%;
  transform: scaleY(-1);
}
.top-flower-right {
  right: -3%;
  transform: scale(-1, -1);
}
@media (max-width: 640px) {
  .top-floral-paper img {
    width: 43%;
    height: 35%;
  }
}
.classic-surface,
.classic-layer.layer-middle {
  background: var(--coffee);
}
.classic-layer.layer-middle {
  filter: none;
}
.layer-middle::after {
  background: transparent;
}
.classic-layer.layer-bottom {
  height: 48%;
}
.top-floral-paper img {
  top: -6%;
  width: 34%;
  height: 62%;
}
@media (max-width: 640px) {
  .top-floral-paper img {
    width: 50%;
    height: 46%;
  }
}
/* Solapas laterales y ramas que acompañan los pliegues. */
.classic-side {
  position: absolute;
  inset: 0;
  z-index: -3;
  pointer-events: none;
}
.classic-side-left {
  background: linear-gradient(135deg, #e2dccc, #cbb998);
  clip-path: polygon(0 0, 55% 57%, 0 100%);
}
.classic-side-right {
  background: linear-gradient(225deg, #e2dccc, #cbb998);
  clip-path: polygon(100% 0, 45% 57%, 100% 100%);
}
.classic-layer.layer-top {
  height: 62%;
  filter: drop-shadow(0 6px 4px rgba(75, 59, 43, 0.28));
}
.layer-top::before,
.top-floral-paper {
  clip-path: polygon(0 0, 100% 0, 98% 10%, 50% 100%, 2% 10%);
}
.classic-layer.layer-bottom {
  height: 48%;
}
.layer-bottom::before {
  background: linear-gradient(170deg, #eee5d5, #fffdf3);
}
.classic-seal {
  top: 61%;
}
.top-floral-paper img {
  top: 8%;
  width: 54%;
  height: 78%;
  opacity: 0.3;
  filter: grayscale(0.7) sepia(0.4) saturate(0.55) drop-shadow(1px 1px 0 rgba(75, 59, 43, 0.28)) drop-shadow(-1px -1px 0 rgba(255, 253, 243, 0.8));
  object-fit: contain;
}
.top-flower-left {
  left: -3%;
  transform: scaleY(-1) rotate(-8deg);
}
.top-flower-right {
  right: -3%;
  transform: scale(-1, -1) rotate(-8deg);
}
.classic-copy {
  top: 12%;
}
@media (max-width: 640px) {
  .top-floral-paper img {
    top: 2%;
    width: 68%;
    height: 82%;
  }
  .top-flower-left {
    left: -17%;
    transform: scaleY(-1) rotate(-30deg);
  }
  .top-flower-right {
    right: -17%;
    transform: scale(-1, -1) rotate(-30deg);
  }
  .classic-copy {
    top: 17%;
  }
}
/* Papel uniforme y solapa inferior de mayor tamaño. */
.classic-surface,
.classic-layer.layer-middle {
  background: #f2eadb;
}
.classic-side-left,
.classic-side-right,
.layer-top::before,
.layer-bottom::before {
  background: #f2eadb;
}
.classic-layer.layer-top {
  height: 47%;
}
.classic-layer.layer-bottom {
  height: 58%;
}
.classic-seal {
  top: 46%;
}
.classic-copy {
  top: 10%;
}
.top-floral-paper img {
  opacity: 0.46;
  filter: grayscale(1) sepia(0.3) saturate(0.35) brightness(1.12) drop-shadow(1px 2px 1px rgba(75, 59, 43, 0.42)) drop-shadow(-1px -1px 0 rgba(255, 253, 243, 0.95));
}
@media (max-width: 640px) {
  .classic-copy {
    top: 11%;
  }
}
/* Relieve del mismo tono del papel a lo largo de cada diagonal. */
.top-floral-paper img {
  top: 8%;
  width: 58%;
  height: 88%;
  opacity: 0.85;
  object-fit: contain;
  filter: url(#envelope-floral-emboss) drop-shadow(1px 2px 1px rgba(75, 59, 43, 0.34)) drop-shadow(-1px -1px 0 rgba(255, 253, 243, 0.95));
}
.top-flower-left {
  left: -4%;
  transform: scaleY(-1);
}
.top-flower-right {
  right: -4%;
  transform: scale(-1, -1);
}
@media (max-width: 640px) {
  .top-floral-paper img {
    top: 6%;
    width: 61%;
    height: 91%;
    object-fit: contain;
  }
  .top-flower-left {
    left: -6%;
    transform: scaleY(-1) rotate(-22deg);
  }
  .top-flower-right {
    right: -6%;
    transform: scale(-1, -1) rotate(-22deg);
  }
}
/* Bolsillo inferior con punta redondeada y pliegues laterales. */
.classic-layer.layer-bottom {
  height: 58%;
  filter: drop-shadow(0 -2px 2px rgba(75, 59, 43, 0.19));
}
.layer-bottom::before {
  clip-path: polygon(0 100%, 0 94%, 46% 5%, 48% 2%, 50% 1%, 52% 2%, 54% 5%, 100% 94%, 100% 100%);
  background: linear-gradient(125deg, #e7ddca 0%, #f2eadb 22%, #f5eee2 50%, #f2eadb 78%, #e7ddca 100%);
}
.classic-side-left {
  clip-path: polygon(0 0, 52% 45%, 0 100%);
  background: linear-gradient(100deg, #eee5d5, #e5dac5);
}
.classic-side-right {
  clip-path: polygon(100% 0, 48% 45%, 100% 100%);
  background: linear-gradient(260deg, #eee5d5, #e5dac5);
}
/* Puntas superiores descendentes y ramas en las esquinas inferiores. */
.top-flower-left {
  transform: scaleX(-1);
}
.top-flower-right {
  transform: none;
}
.bottom-floral-corners {
  position: absolute;
  inset: 0;
  clip-path: polygon(0 100%, 0 94%, 46% 5%, 48% 2%, 50% 1%, 52% 2%, 54% 5%, 100% 94%, 100% 100%);
  pointer-events: none;
}
.bottom-floral-corners img {
  position: absolute;
  bottom: -10%;
  width: 38%;
  height: 66%;
  object-fit: contain;
  opacity: 0.85;
  filter: url(#envelope-floral-emboss) drop-shadow(1px 2px 1px rgba(75, 59, 43, 0.34)) drop-shadow(-1px -1px 0 rgba(255, 253, 243, 0.95));
}
.bottom-flower-left {
  left: -8%;
  transform: rotate(-12deg);
}
.bottom-flower-right {
  right: -8%;
  transform: scaleX(-1) rotate(-12deg);
}
@media (max-width: 640px) {
  .top-flower-left {
    transform: rotate(22deg) scaleX(-1);
  }
  .top-flower-right {
    transform: rotate(-22deg);
  }
  .bottom-floral-corners img {
    width: 57%;
    height: 66%;
  }
  .bottom-flower-left {
    left: -16%;
  }
  .bottom-flower-right {
    right: -16%;
  }
}
.classic-layer.layer-top {
  height: 55%;
}
.classic-seal {
  top: 54%;
}
.classic-layer.layer-top {
  height: 62%;
}
.classic-seal {
  top: 61%;
}
.classic-copy {
  top: 15%;
}
.classic-cover-date {
  display: block;
  margin-top: 18px;
  font: 400 12px / 1.6 var(--serif);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.classic-actions {
  top: 78%;
}
.classic-actions .classic-invitation-text {
  margin: 0;
  max-width: 340px;
  font: 400 15px / 1.6 var(--sans);
  text-align: center;
  color: var(--coffee);
}
@media (max-width: 640px) {
  .classic-copy {
    top: 17%;
  }
  .classic-cover-date {
    font-size: 10px;
  }
  .classic-actions {
    top: 76%;
  }
}
/* Proporciones del sobre para pantallas verticales. */
@media (max-width: 640px) {
  .classic-layer.layer-top {
    height: 49%;
  }
  .layer-top::before,
  .top-floral-paper {
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }
  .classic-layer.layer-bottom {
    height: 53%;
  }
  .layer-bottom::before {
    clip-path: polygon(0 100%, 0 45%, 48% 1%, 50% 0, 52% 1%, 100% 45%, 100% 100%);
  }
  .classic-side-left {
    clip-path: polygon(0 0, 50% 48%, 0 72%);
  }
  .classic-side-right {
    clip-path: polygon(100% 0, 50% 48%, 100% 72%);
  }
  .classic-seal {
    top: 48%;
  }
  .classic-copy {
    top: 12%;
  }
  .classic-actions {
    top: 72%;
  }
  .top-floral-paper img {
    top: 0;
    width: 56%;
    height: 92%;
  }
}
@media (max-width: 640px) {
  .classic-layer.layer-top,
  .classic-layer.layer-bottom {
    height: 50%;
  }
  .layer-top::before,
  .top-floral-paper {
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }
  .layer-bottom::before {
    clip-path: polygon(0 100%, 50% 0, 100% 100%);
  }
  .classic-side-left {
    clip-path: polygon(0 0, 50% 50%, 0 100%);
  }
  .classic-side-right {
    clip-path: polygon(100% 0, 50% 50%, 100% 100%);
  }
  .classic-seal {
    top: 50%;
  }
}
/* Solapas móviles con pliegues cortos como la referencia. */
@media (max-width: 640px) {
  .classic-layer.layer-top {
    height: 56%;
  }
  .layer-top::before,
  .top-floral-paper {
    clip-path: polygon(0 0, 100% 0, 100% 74%, 50% 100%, 0 74%);
  }
  .classic-layer.layer-bottom {
    height: 46%;
  }
  .layer-bottom::before {
    clip-path: polygon(0 100%, 0 17%, 50% 0, 100% 17%, 100% 100%);
  }
  .classic-seal {
    top: 56%;
  }
  .classic-copy {
    top: 20%;
  }
  .classic-actions {
    top: 72%;
  }
}
/* Flores móviles junto a los bordes diagonales de la solapa. */
@media (max-width: 640px) {
  .top-floral-paper img {
    top: auto;
    bottom: -4%;
    width: 54%;
    height: 38%;
    object-fit: contain;
  }
  .top-flower-left {
    left: -2%;
    transform: scaleX(-1) rotate(8deg);
  }
  .top-flower-right {
    right: -2%;
    transform: rotate(8deg);
  }
}