/* ==========================================================================
   Marina & Curro · Invitación
   Estilos base. Todo cuelga de .mc-body (clase del <body> en la página de la
   invitación). Las clases .mc-* se asignan en Elementor → Avanzado → Clases CSS.
   Lo que cambies en el panel de Elementor tiene prioridad sobre este archivo.
   ========================================================================== */

/* 1. Tokens ----------------------------------------------------------------- */
/* Paleta sacada de la tarjeta de referencia (marfil, oliva de los nombres, terracota de
   la fecha) y de las referencias de naranjos (naranja, albaricoque, salvia). */
:root {
  --mc-crema: #F6F1E7;
  --mc-papel: #FBF8F1;
  --mc-tinta: #3D342C;
  --mc-gris: #7A6B5C;
  --mc-borde: #D8CCB6;
  --mc-borde-suave: #E7DDCC;
  --mc-acento: #C0603A;
  --mc-acento-oscuro: #9A4826;
  --mc-oliva: #6B7A3E;
  --mc-oliva-oscuro: #55632F;
  --mc-oro: #E5AA52;
  --mc-naranja: #E2690D;
  --mc-rosa: #E8B4A0;
  --mc-salvia: #A9B48F;
  --mc-error: #9B3B22;

  --mc-serif: 'Cormorant Garamond', Georgia, serif;
  /* Los rótulos van en versalitas serif muy espaciadas, como "SEVILLA" o "SE RUEGA
     CONFIRMACIÓN" en la tarjeta. La variable conserva el nombre antiguo. */
  --mc-mono: 'Cormorant Garamond', Georgia, serif;
  --mc-script: 'Allura', cursive;

  --mc-ease-out: cubic-bezier(.23, 1, .32, 1);
  --mc-ease-io: cubic-bezier(.77, 0, .175, 1);
}

/* 2. Base ------------------------------------------------------------------- */
.mc-body {
  --kit-widget-spacing: 0px;
  margin: 0;
  background: var(--mc-crema);
  color: var(--mc-tinta);
  font-family: var(--mc-serif);
  font-size: 18px;
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}
.mc-body a { color: var(--mc-acento); }
.mc-body a:hover { color: var(--mc-acento-oscuro); }
.mc-body :focus-visible { outline: 2px solid var(--mc-acento); outline-offset: 3px; }
.mc-body button { font-family: inherit; cursor: pointer; }
.mc-body p:last-child { margin-bottom: 0; }

/* 3. Secciones (contenedores de Elementor) ------------------------------------ */
.mc-body .mc-sec {
  --padding-top: 56px;
  --padding-bottom: 56px;
  --padding-left: 24px;
  --padding-right: 24px;
  --gap: 22px;
  --row-gap: 22px;
  --column-gap: 22px;
}
.mc-body .mc-sec--top-tight { --padding-top: 20px; }
.mc-body .mc-paper {
  background-color: var(--mc-papel);
  border-top: 1px solid var(--mc-borde-suave);
  border-bottom: 1px solid var(--mc-borde-suave);
}
.mc-body .mc-dark {
  background-color: var(--mc-tinta);
  color: var(--mc-crema);
  --padding-top: 48px;
  --padding-bottom: 64px;
  --gap: 14px;
  --row-gap: 14px;
  text-align: center;
}
.mc-body .mc-center { text-align: center; align-items: center; }

.mc-body .mc-card {
  --padding-top: 20px;
  --padding-bottom: 20px;
  --padding-left: 20px;
  --padding-right: 20px;
  --gap: 14px;
  --row-gap: 14px;
  background-color: var(--mc-papel);
  border: 1px solid var(--mc-borde-suave);
  border-radius: 16px;
}
.mc-body .mc-card--small { --gap: 6px; --row-gap: 6px; --padding-top: 18px; --padding-bottom: 18px; }

/* 4. Tipografía ---------------------------------------------------------------- */
.mc-body .mc-h2 .elementor-heading-title,
.mc-body .mc-h2:is(h2, p) {
  margin: 0;
  font-family: var(--mc-serif);
  font-size: 42px;
  line-height: 1.1;
  font-weight: 400;
  font-style: italic;
  color: inherit;
}
.mc-body .mc-h2--sm .elementor-heading-title { font-size: 36px; }
.mc-body .mc-h3 .elementor-heading-title {
  margin: 0;
  font-family: var(--mc-serif);
  font-size: 28px;
  line-height: 1.15;
  font-weight: 500;
  font-style: normal;
  color: var(--mc-tinta);
}
.mc-body .mc-h3--sm .elementor-heading-title { font-size: 24px; }
.mc-body .mc-italic .elementor-heading-title,
.mc-body .mc-italic {
  font-family: var(--mc-serif);
  font-size: 26px;
  font-weight: 400;
  font-style: italic;
  color: inherit;
}
.mc-body .mc-script .elementor-heading-title,
.mc-body .mc-script {
  font-family: var(--mc-script);
  font-weight: 400;
  font-style: normal;
  font-size: 30px;
  line-height: 1.1;
  color: var(--mc-acento);
}
.mc-body .mc-script--xl,
.mc-body .mc-script--xl .elementor-heading-title { font-size: 46px; color: inherit; }
.mc-body .mc-kicker,
.mc-body .mc-kicker .elementor-heading-title,
.mc-body .mc-kicker p {
  font-family: var(--mc-mono);
  font-size: 11px;
  font-weight: 400;
  font-style: normal;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--mc-gris);
}
.mc-body .mc-dark .mc-kicker p { color: var(--mc-borde); letter-spacing: .2em; font-size: 10px; }
.mc-body .mc-lead,
.mc-body .mc-lead p {
  font-family: var(--mc-serif);
  font-size: 24px;
  line-height: 1.4;
  font-style: italic;
  color: var(--mc-tinta);
}
.mc-body .mc-muted,
.mc-body .mc-muted p {
  font-family: var(--mc-serif);
  font-size: 18px;
  line-height: 1.4;
  color: var(--mc-gris);
}
.mc-body .mc-muted--lg p { font-size: 19px; }
.mc-body .elementor-widget-text-editor p { margin: 0 0 .6em; }

/* 5. Botones (widget Botón de Elementor) ------------------------------------- */
.mc-body .mc-btn-outline .elementor-button,
.mc-body .mc-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 20px;
  border: 1px solid var(--mc-tinta);
  border-radius: 999px;
  background: transparent;
  color: var(--mc-tinta);
  font-family: var(--mc-mono);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-decoration: none;
  transition: transform .16s var(--mc-ease-out), background-color .2s, color .2s;
}
.mc-body .mc-btn-dark .elementor-button,
.mc-body .mc-pill--dark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  padding: 0 30px;
  border: 0;
  border-radius: 999px;
  background: var(--mc-tinta);
  color: var(--mc-papel);
  font-family: var(--mc-mono);
  font-size: 12px;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  transition: transform .16s var(--mc-ease-out), background-color .2s;
}
.mc-body .mc-btn-outline .elementor-button:active,
.mc-body .mc-btn-dark .elementor-button:active,
.mc-body .mc-pill:active,
.mc-body .mc-press:active { transform: scale(.97); }
@media (hover: hover) {
  .mc-body .mc-btn-outline .elementor-button:hover,
  .mc-body .mc-pill:hover { background: var(--mc-tinta); color: var(--mc-papel); }
}
.mc-body .mc-link .elementor-button,
.mc-body .mc-link a {
  padding: 0;
  background: none;
  border: 0;
  color: var(--mc-acento);
  font-family: var(--mc-mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* 6. Adornos ---------------------------------------------------------------- */
.mc-ornament { display: block; margin: 0 auto; }
.mc-meta-row {
  display: flex;
  justify-content: space-between;
  font-family: var(--mc-mono);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--mc-gris);
}
.mc-illu { display: block; width: 100%; height: auto; }

/* 7. Portada y sobre ---------------------------------------------------------- */
.mc-body .mc-hero {
  --padding-top: 0;
  --padding-bottom: 32px;
  --padding-left: 0;
  --padding-right: 0;
  position: relative;
  overflow: hidden;
  min-height: min(840px, 100svh);
}
.mc-hero-in {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 28px 24px 0;
}
.mc-garland {
  position: absolute;
  top: 0;
  left: 50%;
  width: max(100%, 390px);
  height: 70px;
  transform: translateX(-50%);
}
.mc-bulb { fill: var(--c); }
.mc-hero-date {
  margin: 44px 0 0;
  font-family: var(--mc-mono);
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--mc-gris);
}

.mc-stage {
  position: relative;
  width: 320px;
  height: 500px;
  overflow: hidden;
  perspective: 900px;
}
.mc-invite {
  position: absolute;
  left: 24px;
  top: 40px;
  z-index: 2;
  width: 272px;
  height: 400px;
  box-sizing: border-box;
  padding: 12px;
  background: var(--mc-papel);
  border-radius: 6px;
  box-shadow: 0 18px 40px -18px rgba(46, 38, 32, .45);
}
.mc-invite-in {
  height: 100%;
  box-sizing: border-box;
  border: 1px solid var(--mc-oliva);
  border-radius: 3px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 24px 18px;
  text-align: center;
}
.mc-invite-in > * { margin: 0; }
.mc-invite-intro { font-style: italic; font-size: 19px; line-height: 1.3; color: var(--mc-gris); }
.mc-invite-names {
  font-family: var(--mc-script);
  font-weight: 400;
  font-size: 50px;
  line-height: 1.1;
  color: var(--mc-tinta);
}
.mc-invite-names span { font-size: 36px; color: var(--mc-acento); }
.mc-invite-date { font-family: var(--mc-mono); font-size: 13px; letter-spacing: .2em; }
.mc-invite-place { font-size: 18px; line-height: 1.35; }

.mc-pocket, .mc-flap { position: absolute; left: 10px; top: 300px; width: 300px; }
.mc-pocket { height: 196px; z-index: 3; }
.mc-flap { height: 118px; z-index: 4; transform-origin: 50% 0; transform-style: preserve-3d; }
.mc-flap-face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.mc-flap-inner { transform: rotateX(180deg); }
.mc-pocket svg, .mc-flap svg { display: block; width: 300px; }

.mc-seal {
  position: absolute;
  left: 124px;
  top: 380px;
  z-index: 5;
  width: 72px;
  height: 72px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mc-acento);
  box-shadow: 0 3px 0 rgba(46, 38, 32, .28), inset 0 0 0 6px rgba(255, 255, 255, .12);
  font-family: var(--mc-script);
  font-size: 30px;
  line-height: 1;
  color: var(--mc-papel);
}
.mc-sobre-foot { display: grid; justify-items: center; min-height: 90px; }
.mc-sobre-foot > * { grid-area: 1 / 1; }
.mc-hint { margin: 0; font-style: italic; font-size: 20px; color: var(--mc-gris); }
.mc-after { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.mc-textbtn {
  height: 44px;
  padding: 0 12px;
  border: 0;
  background: none;
  font-family: var(--mc-serif);
  font-style: italic;
  font-size: 17px;
  color: var(--mc-gris);
}

/* Sin JavaScript o dentro del editor: el sobre se muestra ya abierto. */
.mc-pocket, .mc-flap, .mc-seal, .mc-hint { display: none; }
.mc-sobre .mc-bulb { fill: var(--c); }

/* Con JavaScript: arranca cerrado y GSAP anima la apertura. */
.mc-js .mc-pocket, .mc-js .mc-flap, .mc-js .mc-seal, .mc-js .mc-hint { display: block; }
.mc-js .mc-seal { display: flex; }
.mc-js .mc-invite { opacity: 0; transform: translateY(262px); }
.mc-js .mc-invite .mc-r { opacity: 0; transform: translateY(8px); }
.mc-js .mc-after { opacity: 0; visibility: hidden; transform: translateY(8px); }
.mc-js .mc-sobre .mc-bulb { fill: #DCD2C2; }
.mc-js .mc-sobre.is-closed .mc-seal { animation: mc-breathe 2.6s ease-in-out infinite; }
@keyframes mc-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.04); } }

/* 8. Cuenta atrás -------------------------------------------------------------- */
.mc-countdown { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; width: 100%; }
.mc-cd-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 14px 0;
  border: 1px solid var(--mc-borde);
  border-radius: 12px;
}
.mc-cd-num { font-size: 38px; font-weight: 500; line-height: 1; font-variant-numeric: tabular-nums; }
.mc-cd-lbl { font-family: var(--mc-mono); font-size: 10px; letter-spacing: .16em; color: var(--mc-gris); }
.mc-cd-actions { display: flex; justify-content: center; margin-top: 22px; }

/* 9. Programa (línea de tiempo) ------------------------------------------------- */
.mc-tl { position: relative; margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; }
.mc-tl-line {
  position: absolute;
  left: 27px;
  top: 28px;
  bottom: 28px;
  width: 1px;
  background: #B9AA90;
  transform-origin: top;
}
.mc-tl-item { position: relative; display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding: 14px 0; }
.mc-tl-item svg { width: 56px; height: 56px; }
.mc-tl-txt { display: flex; flex-direction: column; gap: 2px; }
.mc-tl-hora { font-family: var(--mc-mono); font-size: 12px; letter-spacing: .12em; color: var(--mc-acento); }
.mc-tl-titulo { font-size: 24px; font-weight: 500; }
.mc-tl-sub { font-size: 17px; color: var(--mc-gris); }

/* 10. RSVP · Fluent Forms ------------------------------------------------------- */
.mc-body .mc-rsvp .fluentform { font-family: var(--mc-serif); }
.mc-body .mc-rsvp .ff-el-group { margin-bottom: 20px; }
.mc-body .mc-rsvp .ff-el-input--label { margin-bottom: 8px; }
.mc-body .mc-rsvp .ff-el-input--label label {
  font-family: var(--mc-mono);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--mc-gris);
}
.mc-body .mc-rsvp .ff-el-input--label.ff-el-is-required.asterisk-right label::after { color: var(--mc-acento); }
.mc-body .mc-rsvp .ff-el-form-control {
  width: 100%;
  height: 50px;
  box-sizing: border-box;
  border: 1px solid var(--mc-borde);
  border-radius: 12px;
  background: var(--mc-papel);
  padding: 0 16px;
  font-family: var(--mc-serif);
  font-size: 20px;
  color: var(--mc-tinta);
  box-shadow: none;
}
.mc-body .mc-rsvp textarea.ff-el-form-control { height: auto; padding: 12px 16px; resize: none; }
.mc-body .mc-rsvp .ff-el-form-control::placeholder { color: #A39584; opacity: 1; }
.mc-body .mc-rsvp .ff-el-form-control:focus { border-color: var(--mc-tinta); outline: none; }
.mc-body .mc-rsvp .ff-el-is-error .ff-el-form-control { border-color: var(--mc-error); }
.mc-body .mc-rsvp .error.text-danger { font-family: var(--mc-serif); font-size: 16px; color: var(--mc-error); margin-top: 6px; }
.mc-body .mc-rsvp .ff-el-help-message { font-size: 16px; font-style: normal; color: var(--mc-gris); }

/* Sí / No como selector segmentado */
.mc-body .mc-rsvp .mc-seg .ff-el-input--content {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid var(--mc-borde);
  border-radius: 14px;
  padding: 4px;
  background: var(--mc-papel);
}
.mc-body .mc-rsvp .mc-seg .ff-el-form-check { position: relative; z-index: 1; margin: 0; }
.mc-body .mc-rsvp .mc-seg .ff-el-form-check-label {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  margin: 0;
  padding: 0 6px;
  font-size: 20px;
  color: var(--mc-tinta);
  text-align: center;
  cursor: pointer;
  transition: color .25s;
}
.mc-body .mc-rsvp .mc-seg input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.mc-body .mc-rsvp .mc-seg .ff-el-form-check:has(input:checked) .ff-el-form-check-label { color: var(--mc-papel); }
.mc-body .mc-rsvp .mc-seg .ff-el-form-check:has(input:focus-visible) .ff-el-form-check-label { outline: 2px solid var(--mc-acento); outline-offset: -2px; border-radius: 10px; }
.mc-seg-pill {
  position: absolute;
  top: 4px;
  left: 4px;
  width: calc(50% - 4px);
  height: calc(100% - 8px);
  border-radius: 10px;
  background: var(--mc-tinta);
  opacity: 0;
  pointer-events: none;
}

/* Contador de personas */
.mc-body .mc-rsvp .mc-stepper {
  padding: 16px;
  border: 1px solid var(--mc-borde);
  border-radius: 14px;
  background: var(--mc-papel);
}
.mc-stepper-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mc-body .mc-rsvp .mc-stepper.is-enhanced .ff-el-input--label { display: none; }
.mc-body .mc-rsvp .mc-stepper.is-enhanced input[type="number"] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.mc-stepper-q { font-size: 20px; }
.mc-stepper-ctrl {
  display: flex;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--mc-borde);
  border-radius: 999px;
  padding: 3px;
  background: var(--mc-crema);
}
.mc-stepper-ctrl button {
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  font-size: 22px;
  line-height: 1;
  color: var(--mc-tinta);
}
.mc-stepper-ctrl button + .mc-roll + button { background: #E6DBC6; }
.mc-roll { width: 28px; height: 30px; overflow: hidden; text-align: center; }
.mc-roll-strip div { height: 30px; line-height: 30px; font-size: 24px; }
.mc-seats { display: flex; gap: 6px; margin: 12px 0 8px; }
.mc-seat { transform: scale(.7); opacity: .22; }

/* Interruptor del autobús */
.mc-body .mc-rsvp .mc-switch > .ff-el-input--label { display: none; }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check { margin: 0; }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 56px;
  margin: 0;
  padding: 10px 14px 10px 16px;
  box-sizing: border-box;
  border: 1px solid var(--mc-borde);
  border-radius: 14px;
  background: var(--mc-papel);
  font-size: 19px;
  color: var(--mc-tinta);
  cursor: pointer;
}
.mc-body .mc-rsvp .mc-switch input[type="checkbox"] { position: absolute; opacity: 0; pointer-events: none; }
.mc-switch-ui {
  flex-shrink: 0;
  position: relative;
  width: 52px;
  height: 32px;
  border-radius: 999px;
  background: #D3C6AF;
  transition: background-color .25s;
}
.mc-switch-ui::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--mc-papel);
  box-shadow: 0 1px 2px rgba(46, 38, 32, .3);
  transition: transform .3s var(--mc-ease-out);
}
.mc-body .mc-rsvp .mc-switch .ff-el-form-check:has(input:checked) .mc-switch-ui { background: var(--mc-oliva); }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check:has(input:checked) .mc-switch-ui::after { transform: translateX(20px); }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check:has(input:focus-visible) .ff-el-form-check-label { outline: 2px solid var(--mc-acento); outline-offset: 2px; }

/* Ruta del autobús */
.mc-bus-info { overflow: hidden; }
.mc-js .mc-bus-info:not(.is-on) { height: 0; }
.mc-route { position: relative; width: 100%; max-width: 342px; aspect-ratio: 342 / 96; margin: 4px auto 0; }
.mc-route > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.mc-bus { position: absolute; left: 0; top: 0; width: 11.7%; opacity: 0; }
.mc-bus svg { display: block; width: 100%; height: auto; }
.mc-route-ends { display: flex; justify-content: space-between; font-family: var(--mc-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--mc-gris); }
.mc-bus-info p { margin: 6px 0 0; font-size: 18px; color: var(--mc-gris); }

.mc-no-msg {
  margin: 0;
  padding: 16px;
  border-radius: 14px;
  background: var(--mc-papel);
  border: 1px dashed var(--mc-borde);
  font-size: 20px;
  font-style: italic;
  line-height: 1.35;
}

.mc-body .mc-rsvp .ff-el-tc label,
.mc-body .mc-rsvp .ff_gdpr_field + span,
.mc-body .mc-rsvp .ff-el-tc { font-size: 16px; color: var(--mc-gris); }

/* Botón de enviar */
.mc-body .mc-rsvp .ff_submit_btn_wrapper { margin-top: 4px; }
.mc-body .mc-rsvp .ff-btn-submit,
.mc-body .mc-rsvp .ff-btn-submit:hover,
.mc-body .mc-rsvp .ff-btn-submit:focus {
  width: 100%;
  height: 54px;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--mc-acento) !important;
  color: var(--mc-papel) !important;
  font-family: var(--mc-mono);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .2em;
  text-transform: uppercase;
  box-shadow: none;
  opacity: 1;
  transition: transform .16s var(--mc-ease-out), background-color .2s;
}
.mc-body .mc-rsvp .ff-btn-submit:active { transform: scale(.97); }
.mc-body .mc-rsvp .ff-btn-submit.disabled { opacity: .75; }

/* Confirmación (tras enviar) */
.mc-body .mc-rsvp .ff-message-success {
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  font-family: var(--mc-serif);
}
.mc-done {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: 32px 20px;
  background: var(--mc-papel);
  border: 1px solid var(--mc-borde-suave);
  border-radius: 16px;
  text-align: center;
  overflow: hidden;
  font-size: 19px;
  color: var(--mc-gris);
}
.mc-done > p { margin: 0; }
.mc-done-title { font-size: 28px; font-style: italic; color: var(--mc-tinta); }
.mc-stamp {
  width: 132px;
  height: 132px;
  border-radius: 50%;
  border: 2px solid var(--mc-acento);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mc-acento);
  transform: rotate(-8deg);
}
.mc-stamp-in {
  width: 112px;
  height: 112px;
  border-radius: 50%;
  border: 1px solid var(--mc-acento);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
}
.mc-stamp-top { font-family: var(--mc-mono); font-size: 11px; letter-spacing: .18em; }
.mc-stamp-mono { font-family: var(--mc-script); font-size: 26px; line-height: 1; }
.mc-stamp-date { font-family: var(--mc-mono); font-size: 9px; letter-spacing: .14em; }
.mc-petals { position: absolute; inset: 0; pointer-events: none; }
.mc-petal { position: absolute; top: 0; width: 9px; height: 13px; border-radius: 60% 0 60% 0; opacity: 0; }

/* 11. Regalo ------------------------------------------------------------------- */
.mc-iban {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border: 1px dashed var(--mc-borde);
  border-radius: 12px;
}
.mc-iban-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mc-iban-lbl { font-family: var(--mc-mono); font-size: 10px; letter-spacing: .16em; color: var(--mc-gris); }
.mc-iban-num { font-family: var(--mc-mono); font-size: 13px; overflow-wrap: anywhere; }
.mc-copy { gap: 6px; flex-shrink: 0; }
.mc-copy.is-copied { background: var(--mc-tinta); color: var(--mc-papel); }

/* 12. Preguntas frecuentes ------------------------------------------------------- */
.mc-faq { border-top: 1px solid var(--mc-borde); }
.mc-faq:last-child { border-bottom: 1px solid var(--mc-borde); }
.mc-faq summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 56px;
  font-size: 22px;
  color: var(--mc-tinta);
  list-style: none;
  cursor: pointer;
}
.mc-faq summary::-webkit-details-marker { display: none; }
.mc-plus { display: inline-block; font-size: 26px; color: var(--mc-acento); transition: transform .3s var(--mc-ease-out); }
.mc-faq[open] .mc-plus { transform: rotate(45deg); }
.mc-faq-a { overflow: hidden; }
.mc-faq-a p { margin: 0 0 16px; font-size: 18px; color: var(--mc-gris); }

/* 13. Cierre -------------------------------------------------------------------- */
.mc-cierre-illu { display: block; width: 240px; height: auto; margin: 0 auto; }

/* 14. Escritorio: la invitación es una columna centrada ------------------------- */
@media (min-width: 768px) {
  .mc-body .mc-hero { min-height: 100svh; }
}

/* 15. Movimiento reducido ---------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .mc-js .mc-sobre.is-closed .mc-seal { animation: none; }
  .mc-switch-ui, .mc-switch-ui::after, .mc-plus { transition: none; }
}

/* 16. Maquetación con widgets nativos de Elementor -----------------------------------
   La página está hecha con contenedores y widgets (títulos, textos, botones,
   imágenes, desplegable). Estas reglas colocan esas piezas: cada clase .mc-* se
   pone en Avanzado → Clases CSS del contenedor o widget correspondiente.
   ------------------------------------------------------------------------------ */

/* Elementor da a los contenedores transition: transform .4s; con GSAP animando transform
   cada fotograma, esa transición lo retrasa y las animaciones se quedan a medias. */
.mc-body .e-con { --e-con-transform-transition-duration: 0s; }
.mc-body .elementor-element { --e-transform-transition-duration: 0s; }

/* Contenedores interiores sin relleno ni separación propios salvo que se diga */
.mc-body :is(.mc-stage, .mc-invite, .mc-invite-in, .mc-sobre-foot, .mc-after, .mc-meta-row, .mc-tl, .mc-tl-item, .mc-tl-txt).e-con {
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
  --gap: 0; --row-gap: 0; --column-gap: 0;
}

/* Portada: el sobre */
.mc-body .mc-hero > .e-con-inner { align-items: center; gap: 14px; padding: 28px 24px 0; }
.mc-body .mc-garland-w { position: absolute; top: 0; left: 0; width: 100%; height: 70px; pointer-events: none; }
.mc-body .mc-hero-date { margin-top: 44px; text-align: center; }
.mc-body .mc-hero-date p {
  margin: 0;
  font-family: var(--mc-mono);
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--mc-gris);
}
.mc-body .mc-stage.e-con {
  position: relative;
  flex: none;
  width: 320px;
  height: 500px;
  max-width: 100%;
  /* clip y no hidden: con hidden el navegador desplaza el interior al enfocar el sello
     (la tarjeta escondida abajo lo hace "desplazable") y la tarjeta sale cortada. */
  overflow: hidden;
  overflow: clip;
  display: block;
}
.mc-body .mc-invite.e-con {
  position: absolute;
  left: 24px;
  top: 40px;
  z-index: 2;
  width: 272px;
  height: 400px;
  --padding-top: 12px; --padding-bottom: 12px; --padding-left: 12px; --padding-right: 12px;
  background: var(--mc-papel);
  border-radius: 6px;
  box-shadow: 0 18px 40px -18px rgba(46, 38, 32, .45);
}
.mc-body .mc-invite-in.e-con {
  height: 100%;
  border: 1px solid var(--mc-oliva);
  border-radius: 3px;
  justify-content: center;
  align-items: center;
  --gap: 12px; --row-gap: 12px;
  --padding-top: 20px; --padding-bottom: 20px; --padding-left: 16px; --padding-right: 16px;
  text-align: center;
}
.mc-body .mc-invite-in p { margin: 0; }
.mc-body .mc-invite-intro p { font-style: italic; font-size: 16px; line-height: 1.3; color: var(--mc-gris); }
.mc-body .mc-invite-names .elementor-heading-title {
  font-family: var(--mc-script);
  font-weight: 400;
  font-style: normal;
  font-size: 46px;
  line-height: 1.05;
  color: var(--mc-oliva-oscuro);
}
.mc-body .mc-invite-names .elementor-heading-title span { font-size: 34px; color: var(--mc-oliva-oscuro); }
.mc-body .mc-invite-date p {
  font-family: var(--mc-serif);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--mc-acento);
}
.mc-body .mc-invite-place p { font-size: 17px; line-height: 1.35; color: var(--mc-tinta); }

/* El widget HTML del sobre ocupa todo el escenario. Sin z-index ni perspective (las dos
   crean contexto de apilamiento), para que solapa, bolsillo y sello se ordenen con la
   tarjeta (z-index 2). La perspectiva de la solapa la pone el JS. */
.mc-body .mc-env {
  position: absolute;
  inset: 0;
  z-index: auto;
  pointer-events: none;
}
.mc-body .mc-env .mc-seal { pointer-events: auto; }
.mc-body .mc-sobre-foot.e-con { display: grid; justify-items: center; min-height: 90px; }
.mc-body .mc-sobre-foot.e-con > * { grid-area: 1 / 1; }
.mc-body .mc-hint p { margin: 0; font-style: italic; font-size: 20px; color: var(--mc-gris); }
.mc-body .mc-after.e-con { align-items: center; --gap: 6px; --row-gap: 6px; }
.mc-js .mc-hint { display: block; }

/* Textos del panel con las clases tipográficas */
.mc-body .mc-script .elementor-heading-title,
.mc-body .mc-script { color: var(--mc-oliva-oscuro); }
.mc-body .mc-dark .mc-script .elementor-heading-title { color: var(--mc-crema); }
.mc-body .mc-dark .mc-kicker .elementor-heading-title { color: var(--mc-borde); letter-spacing: .2em; font-size: 10px; }
.mc-body .mc-italic .elementor-heading-title { color: inherit; }
.mc-body .mc-center .elementor-heading-title,
.mc-body .mc-dark .elementor-heading-title { text-align: center; }
.mc-body .mc-lead p, .mc-body .mc-muted p { text-align: inherit; }

/* Tarjetas de lugar */
.mc-body .mc-meta-row.e-con { width: 100%; }
.mc-body .mc-meta-row .elementor-heading-title { font-size: 10px; letter-spacing: .18em; }
.mc-body .mc-card .elementor-widget-html svg { display: block; width: 100%; height: auto; }

/* Programa: la línea es el ::before del contenedor y crece con --mc-tl-p */
.mc-body .mc-tl.e-con { position: relative; }
.mc-body .mc-tl.e-con::before {
  content: "";
  position: absolute;
  left: 27px;
  top: 42px;
  bottom: 42px;
  width: 1px;
  background: #B9AA90;
  transform-origin: top;
  transform: scaleY(var(--mc-tl-p, 1));
}
.mc-body .mc-tl-item.e-con { --gap: 16px; --column-gap: 16px; --padding-top: 14px; --padding-bottom: 14px; flex-wrap: nowrap; align-items: center !important; }
.mc-body .mc-tl-icon { position: relative; z-index: 1; flex: none; width: 56px; }
.mc-body .mc-tl-icon svg { display: block; width: 56px; height: 56px; }
.mc-body .mc-tl-txt.e-con { flex: 1; --gap: 2px; --row-gap: 2px; }
.mc-body .mc-tl-hora .elementor-heading-title { font-family: var(--mc-mono); font-size: 12px; font-weight: 400; font-style: normal; letter-spacing: .12em; color: var(--mc-acento); }
.mc-body .mc-tl-titulo .elementor-heading-title { font-family: var(--mc-serif); font-size: 24px; font-weight: 500; font-style: normal; line-height: 1.15; color: var(--mc-tinta); }
.mc-body .mc-tl-sub .elementor-heading-title { font-family: var(--mc-serif); font-size: 17px; font-weight: 400; font-style: normal; color: var(--mc-gris); }

/* Fotos (estilo editorial: grande, con aire y pie pequeño) */
.mc-body .mc-foto {
  --padding-top: 8px; --padding-bottom: 48px; --padding-left: 24px; --padding-right: 24px;
  --gap: 14px; --row-gap: 14px;
}
.mc-body .mc-foto--end { --padding-top: 0; }
.mc-body .mc-foto-img img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 2px;
}
.mc-body .mc-foto--end .mc-foto-img img { aspect-ratio: 4 / 3; }
.mc-body .mc-foto-pie .elementor-heading-title { text-align: center; }

/* Preguntas: widget Desplegable (toggle) de Elementor */
.mc-body .mc-faq-toggle .elementor-toggle-item { border-top: 1px solid var(--mc-borde); margin: 0; }
.mc-body .mc-faq-toggle .elementor-toggle-item:last-child { border-bottom: 1px solid var(--mc-borde); }
.mc-body .mc-faq-toggle .elementor-tab-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 56px;
  padding: 0;
  border: 0;
  cursor: pointer;
}
.mc-body .mc-faq-toggle .elementor-tab-title::after {
  content: "+";
  font-family: var(--mc-serif);
  font-size: 26px;
  line-height: 1;
  color: var(--mc-acento);
  transition: transform .3s var(--mc-ease-out);
}
.mc-body .mc-faq-toggle .elementor-tab-title.elementor-active::after { transform: rotate(45deg); }
.mc-body .mc-faq-toggle .elementor-toggle-icon { display: none; }
.mc-body .mc-faq-toggle .elementor-toggle-title,
.mc-body .mc-faq-toggle .elementor-tab-title a,
.mc-body .mc-faq-toggle .elementor-tab-title.elementor-active a {
  font-family: var(--mc-serif);
  font-size: 22px;
  font-weight: 400;
  font-style: normal;
  color: var(--mc-tinta);
  text-decoration: none;
}

/* El formulario va alineado a la izquierda aunque su sección esté centrada */
.mc-body .mc-rsvp { width: 100%; text-align: left; }

/* 17. Fotos, caligrafía y rótulos animados -------------------------------------------
   Estados iniciales solo con JS (.mc-js), para que en el editor y sin JS se vea todo. */
.mc-body .mc-img-reveal { overflow: hidden; border-radius: 2px; }
.mc-js .mc-img-reveal { clip-path: inset(100% 0 0 0); }
.mc-js .mc-write .elementor-heading-title { clip-path: inset(-40% 100% -40% -10%); }
.mc-js .mc-track .elementor-heading-title { opacity: 0; }
.mc-body .mc-lugar-illu svg { display: block; width: 100%; height: auto; }

/* 18. Cómo llegar: mapa ilustrado ------------------------------------------------------ */
.mc-body .mc-mapa-w { width: 100%; }
.mc-mapa { display: flex; flex-direction: column; align-items: center; gap: 16px; width: 100%; }
.mc-modo {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  max-width: 320px;
  padding: 4px;
  border: 1px solid var(--mc-borde);
  border-radius: 999px;
  background: var(--mc-crema);
}
.mc-modo-pill {
  position: absolute;
  top: 4px;
  left: 4px;
  width: calc(50% - 4px);
  height: calc(100% - 8px);
  border-radius: 999px;
  background: var(--mc-tinta);
}
.mc-modo button {
  position: relative;
  z-index: 1;
  height: 42px;
  border: 0;
  background: none;
  font-family: var(--mc-mono);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--mc-tinta);
  transition: color .25s;
}
.mc-modo button[aria-selected="true"] { color: var(--mc-papel); }
.mc-mapa-lienzo {
  position: relative;
  width: 100%;
  max-width: 420px;
  aspect-ratio: 360 / 460;
  background: var(--mc-papel);
  border: 1px solid var(--mc-borde-suave);
  border-radius: 16px;
  box-shadow: 0 18px 40px -28px rgba(46, 38, 32, .35);
}
.mc-mapa-svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.mc-mapa-svg text { font-family: var(--mc-serif); fill: var(--mc-gris); stroke: none; }
.mc-mapa-pueblo { font-size: 11px; font-style: italic; }
.mc-mapa-rio { font-size: 10px; font-style: italic; fill: #7E9C94 !important; }
.mc-mapa-ciudad-txt { font-family: var(--mc-mono) !important; font-size: 9px; letter-spacing: .24em; text-anchor: middle; fill: var(--mc-tinta) !important; }
.mc-cartel text { font-family: var(--mc-mono) !important; font-size: 7.5px; letter-spacing: .04em; text-anchor: middle; fill: var(--mc-tinta) !important; }
.mc-rosa text { font-family: var(--mc-mono) !important; font-size: 8px; text-anchor: middle; fill: var(--mc-tinta) !important; }
.mc-mapa-dist text { font-size: 13px; font-style: italic; text-anchor: middle; fill: var(--mc-acento) !important; }
.mc-mapa-dist .mc-mapa-dist-t { font-size: 10px; font-style: normal; font-family: var(--mc-mono); letter-spacing: .1em; fill: var(--mc-gris) !important; }
.mc-mapa[data-modo="bus"] .mc-veh--coche,
.mc-mapa[data-modo="coche"] .mc-veh--bus { display: none; }

.mc-pin {
  position: absolute;
  z-index: 2;
  width: 40px;
  height: 48px;
  padding: 0;
  border: 0;
  background: none;
  transform: translate(-50%, -100%);
  filter: drop-shadow(0 4px 6px rgba(46, 38, 32, .25));
  cursor: pointer;
}
.mc-pin svg { display: block; width: 100%; height: 100%; }
.mc-pin::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -4px;
  width: 14px;
  height: 6px;
  margin-left: -7px;
  border-radius: 50%;
  background: rgba(164, 80, 47, .35);
  animation: mc-pin-pulse 2.2s ease-out infinite;
}
@keyframes mc-pin-pulse { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(2.4); opacity: 0; } }
.mc-pop {
  position: absolute;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 220px;
  padding: 14px 16px;
  background: var(--mc-papel);
  border: 1px solid var(--mc-borde);
  border-radius: 12px;
  box-shadow: 0 14px 30px -12px rgba(46, 38, 32, .35);
  text-align: left;
  font-size: 16px;
  line-height: 1.3;
  color: var(--mc-gris);
}
.mc-pop[hidden] { display: none; }
.mc-pop strong { font-size: 20px; font-weight: 500; color: var(--mc-tinta); }
.mc-pop-k { font-family: var(--mc-mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--mc-acento); }
.mc-pop a { margin-top: 6px; font-family: var(--mc-mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; text-underline-offset: 4px; }
.mc-pop[data-pop="iglesia"] { right: 8%; bottom: 17%; }
.mc-pop[data-pop="cortijo"] { left: 8%; top: 18%; }
.mc-mapa-nota { margin: 0; font-size: 16px; font-style: italic; color: var(--mc-gris); }
.mc-body .mc-modo-txt { max-width: 420px; }
.mc-body .mc-modo-txt p { font-size: 19px; line-height: 1.4; color: var(--mc-tinta); }
.mc-body .mc-modo-txt strong { font-weight: 600; }
.mc-js .mc-modo-txt.is-off { display: none; }

/* 19. Collage de fotos y papeles ---------------------------------------------------------- */
.mc-body .mc-collage.e-con {
  position: relative;
  display: block;
  width: 100%;
  max-width: 420px;
  height: 560px;
  margin: 8px auto 0;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
}
.mc-body .mc-col-item { position: absolute; }
.mc-js .mc-col-item { opacity: 0; }
.mc-body .mc-col-oval.e-con {
  left: 2%;
  top: 10px;
  width: 58%;
  rotate: -4deg;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
}
.mc-body .mc-col-oval-img img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 50%;
  border: 6px solid var(--mc-papel);
  outline: 1px solid var(--mc-oliva);
  outline-offset: -12px;
  box-shadow: 0 18px 30px -18px rgba(46, 38, 32, .5);
  filter: grayscale(1) contrast(1.05);
}
.mc-body .mc-col-lazo { position: absolute; left: 50%; top: -22px; width: 92px; transform: translateX(-50%); }
.mc-body .mc-col-lazo svg { display: block; width: 100%; height: auto; }
.mc-body .mc-col-polaroid.e-con {
  right: 0;
  top: 190px;
  width: 52%;
  rotate: 5deg;
  --padding-top: 10px; --padding-bottom: 12px; --padding-left: 10px; --padding-right: 10px;
  --gap: 8px; --row-gap: 8px;
  background: #FFFDF8;
  box-shadow: 0 20px 34px -18px rgba(46, 38, 32, .5);
}
.mc-body .mc-col-polaroid img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
.mc-body .mc-col-pie .elementor-heading-title {
  font-family: var(--mc-script);
  font-size: 26px;
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  text-align: center;
  color: var(--mc-oliva-oscuro);
}
.mc-body .mc-col-nota.e-con {
  left: 4%;
  top: 368px;
  width: 54%;
  rotate: -2deg;
  --padding-top: 18px; --padding-bottom: 18px; --padding-left: 16px; --padding-right: 16px;
  background: var(--mc-papel);
  box-shadow: 0 14px 26px -16px rgba(46, 38, 32, .4);
  /* borde de papel rasgado */
  clip-path: polygon(0 4%, 6% 0, 14% 3%, 24% 0, 34% 2%, 46% 0, 58% 3%, 70% 0, 82% 2%, 92% 0, 100% 3%, 98% 50%, 100% 97%, 90% 100%, 78% 97%, 66% 100%, 52% 98%, 40% 100%, 28% 97%, 16% 100%, 6% 98%, 0 100%, 2% 50%);
}
.mc-body .mc-col-nota-txt p { margin: 0; font-size: 17px; font-style: italic; line-height: 1.35; text-align: center; color: var(--mc-tinta); }
.mc-body .mc-col-fecha { right: 4%; top: 48px; width: 120px; rotate: 8deg; }
.mc-col-fecha-in { position: relative; width: 120px; height: 120px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.mc-col-fecha-in svg { position: absolute; inset: 0; width: 100%; height: 100%; filter: drop-shadow(0 8px 10px rgba(46, 38, 32, .18)); }
.mc-col-fecha-in span { position: relative; line-height: 1; color: var(--mc-acento); }
.mc-col-fecha-d { font-size: 38px; font-weight: 500; }
.mc-col-fecha-m { font-family: var(--mc-script); font-size: 22px; }
.mc-col-fecha-a { font-family: var(--mc-mono); font-size: 10px; letter-spacing: .2em; margin-top: 2px; }
.mc-body .mc-col-sello { right: 14%; top: 470px; width: 74px; }
.mc-col-sello-in {
  width: 74px;
  height: 74px;
  border-radius: 46% 54% 50% 50% / 52% 48% 52% 48%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 35% 30%, #C0663F, var(--mc-acento) 55%, #7E3A20);
  box-shadow: 0 3px 0 rgba(46, 38, 32, .28), inset 0 0 0 6px rgba(255, 255, 255, .12);
  font-family: var(--mc-script);
  font-size: 26px;
  color: var(--mc-papel);
}
@media (prefers-reduced-motion: reduce) {
  .mc-pin::after { animation: none; }
}

/* ==========================================================================
   20. Dirección «papelería de acuarela»
   Lo que venía del boceto inicial (cajas redondeadas, rótulos técnicos, bombillas,
   cierre oscuro) se sustituye aquí por el lenguaje de las referencias: papel marfil
   con textura, caligrafía en oliva, versalitas serif espaciadas, acuarela y aire.
   ========================================================================== */

/* Papel de algodón: grano muy suave sobre el marfil */
.mc-body {
  background-color: var(--mc-crema);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .42 0 0 0 0 .35 0 0 0 0 .27 0 0 0 .08 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  color: var(--mc-tinta);
}
.mc-body .mc-sec { --padding-top: 76px; --padding-bottom: 76px; --gap: 20px; --row-gap: 20px; }
.mc-body .mc-sec--top-tight { --padding-top: 36px; }
.mc-body .mc-paper,
.mc-body .mc-dark { background: transparent; border: 0; color: var(--mc-tinta); }

/* Rótulos: versalitas serif espaciadas */
.mc-body .mc-kicker,
.mc-body .mc-kicker .elementor-heading-title,
.mc-body .mc-kicker p,
.mc-body .mc-dark .mc-kicker .elementor-heading-title {
  font-family: var(--mc-serif);
  font-size: 13px;
  font-weight: 500;
  font-style: normal;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--mc-gris);
}
.mc-body .mc-invite-lugares .elementor-heading-title,
.mc-body .mc-invite-rsvp .elementor-heading-title,
.mc-body .mc-tl-hora .elementor-heading-title { font-style: normal; }
.mc-body .mc-hero-date p { font-family: var(--mc-serif); font-size: 13px; font-weight: 500; letter-spacing: .32em; }

/* Títulos de sección en caligrafía, como en las referencias */
.mc-body .mc-h2 .elementor-heading-title {
  font-family: var(--mc-script);
  font-style: normal;
  font-weight: 400;
  font-size: 48px;
  line-height: 1.05;
  color: var(--mc-oliva-oscuro);
}
.mc-body .mc-h2--sm .elementor-heading-title { font-size: 42px; }
.mc-body .mc-script .elementor-heading-title,
.mc-body .mc-script,
.mc-body .mc-dark .mc-script .elementor-heading-title { font-family: var(--mc-script); font-size: 40px; color: var(--mc-oliva-oscuro); }
.mc-body .mc-script--xl .elementor-heading-title { font-size: 54px; }
.mc-body .mc-lead p { font-size: 22px; line-height: 1.45; color: var(--mc-tinta); }
.mc-body .mc-muted p { font-size: 18px; letter-spacing: .02em; }

/* Botones: enlace subrayado en versalitas (secundario) y píldora oliva (principal) */
.mc-body .mc-btn-outline .elementor-button,
.mc-body .mc-pill {
  height: auto;
  padding: 2px 0 5px;
  border: 0;
  border-bottom: 1px solid var(--mc-acento);
  border-radius: 0;
  background: none;
  color: var(--mc-acento);
  font-family: var(--mc-serif);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .28em;
}
@media (hover: hover) {
  .mc-body .mc-btn-outline .elementor-button:hover,
  .mc-body .mc-pill:hover { background: none; color: var(--mc-acento-oscuro); border-color: var(--mc-acento-oscuro); }
}
.mc-body .mc-copy.is-copied { background: none; color: var(--mc-oliva); border-color: var(--mc-oliva); }
.mc-body .mc-btn-dark .elementor-button,
.mc-body .mc-pill--dark,
.mc-body .mc-rsvp .ff-btn-submit,
.mc-body .mc-rsvp .ff-btn-submit:hover,
.mc-body .mc-rsvp .ff-btn-submit:focus {
  height: 52px;
  padding: 0 34px;
  border-radius: 999px !important;
  background: var(--mc-oliva) !important;
  color: var(--mc-papel) !important;
  font-family: var(--mc-serif);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .28em;
  text-transform: uppercase;
}
.mc-body .mc-btn-left .elementor-button-wrapper { text-align: center; }

/* Tarjetas sin caja: contenido impreso directamente sobre el papel */
.mc-body .mc-card {
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  align-items: center;
  text-align: center;
}
.mc-body .mc-card--small { border-top: 1px solid var(--mc-borde-suave); --padding-top: 26px; }
.mc-body .mc-card + .mc-card { margin-top: 36px; }
.mc-body .mc-card .elementor-heading-title,
.mc-body .mc-card p { text-align: center; }
.mc-body .mc-h3 .elementor-heading-title,
.mc-body .mc-h3--sm .elementor-heading-title {
  font-family: var(--mc-script);
  font-size: 40px;
  font-weight: 400;
  line-height: 1.05;
  color: var(--mc-oliva-oscuro);
}
.mc-body .mc-h3--sm .elementor-heading-title { font-size: 34px; }
.mc-body .mc-address p { font-size: 14px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--mc-gris); }
.mc-body .mc-lugar-illu { width: 100%; max-width: 380px; }
.mc-body .mc-iban { border: 0; border-top: 1px dotted var(--mc-borde); border-bottom: 1px dotted var(--mc-borde); border-radius: 0; }
.mc-body .mc-iban-lbl, .mc-body .mc-iban-num { font-family: var(--mc-serif); letter-spacing: .14em; }
.mc-body .mc-iban-num { font-size: 16px; }

/* Portada: sin guirnalda; el sobre es salvia con forro de vichy */
.mc-body .mc-garland-w { display: none; }
.mc-body .mc-hero-date { margin-top: 36px; }
.mc-body .mc-invite.e-con {
  top: 30px;
  height: 436px;
  background-color: var(--mc-papel);
  border-radius: 2px;
  box-shadow: 0 22px 40px -22px rgba(61, 52, 44, .45), 0 1px 2px rgba(61, 52, 44, .08);
}
.mc-body .mc-invite-in.e-con {
  border: 0;
  flex-wrap: nowrap;
  justify-content: center;
  --gap: 7px; --row-gap: 7px;
  --padding-top: 6px; --padding-bottom: 8px; --padding-left: 10px; --padding-right: 10px;
}
.mc-body .mc-invite-rama { width: 160px; margin-bottom: -6px; }
.mc-body .mc-invite-rama svg { display: block; width: 100%; height: auto; }
.mc-body .mc-invite-lugares .elementor-heading-title { font-family: var(--mc-serif); font-size: 9.5px; font-weight: 600; letter-spacing: .34em; text-transform: uppercase; color: var(--mc-gris); }
.mc-body .mc-invite-names .elementor-heading-title { font-family: var(--mc-script); font-size: 40px; line-height: 1.1; white-space: nowrap; color: var(--mc-oliva-oscuro); }
.mc-body .mc-invite-names .elementor-heading-title span { font-size: inherit; color: inherit; }
.mc-body .mc-invite-intro p { font-style: normal; font-size: 13.5px; line-height: 1.35; letter-spacing: .04em; color: var(--mc-tinta); }
.mc-body .mc-invite-date p { font-size: 13px; font-weight: 500; letter-spacing: .28em; color: var(--mc-acento); }
.mc-body .mc-invite-place p { font-size: 13.5px; line-height: 1.4; letter-spacing: .03em; }
.mc-body .mc-invite-rsvp .elementor-heading-title { font-family: var(--mc-serif); font-size: 9.5px; font-weight: 600; letter-spacing: .34em; text-transform: uppercase; color: var(--mc-tinta); }
.mc-body .mc-seal {
  width: 70px;
  height: 70px;
  left: 125px;
  border-radius: 47% 53% 50% 50% / 52% 46% 54% 48%;
  background: radial-gradient(circle at 34% 30%, #D77A50, var(--mc-acento) 52%, #8E3F20);
  box-shadow: 0 3px 0 rgba(61, 52, 44, .25), inset 0 0 0 5px rgba(255, 255, 255, .14), inset 0 -6px 10px rgba(0, 0, 0, .12);
  font-family: var(--mc-script);
  font-size: 25px;
}
.mc-body .mc-hint p { font-size: 19px; }

/* Cuenta atrás: cifras finas separadas por filetes, sin cajas */
.mc-body .mc-countdown { gap: 0; max-width: 360px; margin: 0 auto; }
.mc-body .mc-cd-box { border: 0; border-radius: 0; padding: 4px 0; }
.mc-body .mc-cd-box + .mc-cd-box { border-left: 1px solid var(--mc-borde); }
.mc-body .mc-cd-num { font-size: 44px; font-weight: 300; color: var(--mc-tinta); }
.mc-body .mc-cd-lbl { font-family: var(--mc-serif); font-size: 11px; font-weight: 600; letter-spacing: .28em; }

/* Programa en zigzag con lazos dibujados, como el itinerario de las referencias */
.mc-body .mc-tl.e-con::before { display: none; }
.mc-body .mc-tl-item.e-con {
  position: relative;
  justify-content: center;
  --gap: 22px; --column-gap: 22px;
  --padding-top: 6px; --padding-bottom: 46px;
}
.mc-body .mc-tl-item.e-con:nth-child(even) { flex-direction: row-reverse !important; }
.mc-body .mc-tl-item.e-con:nth-child(even) .mc-tl-txt .elementor-heading-title { text-align: right; }
.mc-body .mc-tl-item.e-con:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 4px;
  width: 92px;
  height: 38px;
  transform: translateX(-50%);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 92 38' fill='none' stroke='%23C0603A' stroke-width='1.1' stroke-linecap='round'%3E%3Cpath d='M6 4 C 30 4, 34 30, 50 28 C 64 26, 58 12, 50 15 C 42 18, 54 34, 86 34'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity: .75;
}
.mc-body .mc-tl-item.e-con:nth-child(even)::after { transform: translateX(-50%) scaleX(-1); }
.mc-body .mc-tl-icon { width: 78px; }
.mc-body .mc-tl-icon svg { width: 78px; height: 78px; stroke: var(--mc-oliva-oscuro); }
.mc-body .mc-tl-icon svg > circle:first-child { display: none; }
.mc-body .mc-tl-txt.e-con { flex: 0 1 auto; max-width: 62%; }
.mc-body .mc-tl-hora .elementor-heading-title { font-family: var(--mc-serif); font-size: 13px; font-weight: 600; letter-spacing: .26em; color: var(--mc-acento); }
.mc-body .mc-tl-titulo .elementor-heading-title { font-family: var(--mc-script); font-size: 36px; font-weight: 400; line-height: 1; color: var(--mc-oliva-oscuro); }
.mc-body .mc-tl-sub .elementor-heading-title { font-size: 16px; font-style: italic; }

/* Formulario: líneas de escritura en vez de cajas */
.mc-body .mc-rsvp .ff-el-input--label label { font-family: var(--mc-serif); font-size: 12px; font-weight: 600; letter-spacing: .26em; }
.mc-body .mc-rsvp .ff-el-form-control {
  border: 0;
  border-bottom: 1px solid var(--mc-borde);
  border-radius: 0;
  background: transparent;
  padding: 0 2px;
  height: 46px;
}
.mc-body .mc-rsvp textarea.ff-el-form-control { border: 1px solid var(--mc-borde-suave); border-radius: 2px; background: rgba(255, 255, 255, .35); padding: 10px 12px; }
.mc-body .mc-rsvp .ff-el-form-control:focus { border-color: var(--mc-oliva); }
.mc-body .mc-rsvp .mc-seg .ff-el-input--content { border-radius: 999px; background: transparent; }
.mc-body .mc-rsvp .mc-seg .ff-el-form-check-label { font-style: italic; font-size: 19px; }
.mc-body .mc-seg-pill { border-radius: 999px; background: var(--mc-oliva); }
.mc-body .mc-rsvp .mc-stepper { border: 0; border-top: 1px solid var(--mc-borde-suave); border-bottom: 1px solid var(--mc-borde-suave); border-radius: 0; background: transparent; padding: 14px 0; }
.mc-body .mc-seats { display: none; }
.mc-body .mc-stepper-ctrl,
.mc-body .mc-stepper-ctrl button + .mc-roll + button { background: transparent; }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check-label { border: 0; border-bottom: 1px solid var(--mc-borde-suave); border-radius: 0; background: transparent; padding: 10px 0; }
.mc-body .mc-route, .mc-body .mc-route-ends { display: none; }
.mc-body .mc-bus-info p { font-style: italic; }
.mc-body .mc-no-msg { border: 0; background: none; text-align: center; padding: 8px 0; }
.mc-body .mc-done { background: transparent; border: 0; border-top: 1px solid var(--mc-borde-suave); border-bottom: 1px solid var(--mc-borde-suave); border-radius: 0; }
.mc-body .mc-stamp-top, .mc-body .mc-stamp-date { font-family: var(--mc-serif); font-weight: 600; }

/* Mapa: dibujado directamente sobre el papel, a lápiz */
.mc-body .mc-mapa-lienzo { background: transparent; border: 0; box-shadow: none; border-radius: 0; }
.mc-body .mc-modo { background: transparent; }
.mc-body .mc-modo-pill { background: var(--mc-oliva); }
.mc-body .mc-modo button { font-family: var(--mc-serif); font-size: 12px; font-weight: 600; letter-spacing: .24em; }
.mc-body .mc-cartel text { font-family: var(--mc-serif) !important; font-size: 8.5px; font-weight: 700; letter-spacing: .06em; }
.mc-body .mc-mapa-dist .mc-mapa-dist-t,
.mc-body .mc-mapa-ciudad-txt { font-family: var(--mc-serif) !important; font-weight: 600; }
.mc-body .mc-mapa-fin { font-family: var(--mc-script) !important; font-size: 22px; font-style: normal; fill: var(--mc-oliva-oscuro) !important; }
.mc-body .mc-pop { border-radius: 3px; }
.mc-body .mc-pop-k, .mc-body .mc-pop a { font-family: var(--mc-serif); font-weight: 600; font-size: 11px; }
.mc-body .mc-pop strong { font-family: var(--mc-script); font-size: 28px; font-weight: 400; color: var(--mc-oliva-oscuro); }

/* Preguntas */
.mc-body .mc-faq-toggle .elementor-toggle-item { border-color: var(--mc-borde-suave); }

/* Fotos sin esquinas redondeadas */
.mc-body .mc-foto-img img,
.mc-body .mc-img-reveal { border-radius: 0; }

/* Cierre sobre papel, con la rama de naranjo */
.mc-body .mc-cierre-rama { width: 240px; margin: 0 auto; }
.mc-body .mc-cierre-rama svg { display: block; width: 100%; height: auto; }
.mc-body .mc-cierre { --padding-bottom: 96px; }
.mc-body .mc-faq-toggle .elementor-tab-content {
  padding: 0 0 16px;
  border: 0;
  font-family: var(--mc-serif);
  font-size: 18px;
  line-height: 1.4;
  color: var(--mc-gris);
}

/* ==========================================================================
   21. Portada «Save the date», historia y detalles (versión 1.4)
   La portada sustituye al sobre: rótulo repartido arriba, nombres en versalitas
   grandes montados sobre una foto en blanco y negro y, de fondo, la foto aérea del
   cortijo con un velo cálido. La historia sigue el mosaico de la referencia (foto en
   arco con ramas a línea y momentos en rejilla) y los detalles van en filas con icono.
   ========================================================================== */

/* Portada --------------------------------------------------------------------- */
.mc-body .mc-std.e-con {
  position: relative;
  min-height: 100svh;
  overflow: clip;
  color: var(--mc-papel);
  background: #4A3A2A;
  --justify-content: space-between;
  --align-items: center;
  --flex-direction: column;
  --gap: 18px; --row-gap: 18px;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
}
.mc-body .mc-std > .e-con-inner {
  position: relative;
  min-height: 100svh;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: max(22px, env(safe-area-inset-top)) 22px 26px;
}
.mc-body .mc-std-bg.elementor-widget {
  position: absolute !important;
  inset: 0;
  width: 100% !important;
  max-width: none;
  z-index: 0;
  margin: 0;
  overflow: hidden;
}
.mc-body .mc-std-bg :is(.elementor-widget-container, img) { width: 100%; height: 100%; }
.mc-body .mc-std-bg img { display: block; object-fit: cover; object-position: 50% 40%; max-width: none; transform-origin: 50% 40%; }
/* Velo: cálido arriba y abajo para el texto, casi limpio en el centro */
.mc-body .mc-std-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(42, 31, 20, .62) 0%, rgba(42, 31, 20, .18) 26%, rgba(42, 31, 20, .14) 60%, rgba(42, 31, 20, .7) 100%),
    rgba(85, 99, 47, .1);
  pointer-events: none;
}
.mc-body .mc-std > .e-con-inner > :not(.mc-std-bg) { position: relative; z-index: 1; }

.mc-body .mc-std-top.e-con { width: 100%; max-width: 420px; --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0; flex-wrap: nowrap; }
.mc-body .mc-std-word { width: auto; }
.mc-body .mc-std-word .elementor-heading-title {
  font-family: var(--mc-serif);
  font-size: 12px;
  font-weight: 600;
  font-style: normal;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--mc-papel);
}

.mc-body .mc-std-centro.e-con {
  width: 100%;
  align-items: center;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
  --gap: 0; --row-gap: 0;
}
.mc-body .mc-std-name { position: relative; z-index: 2; width: auto; }
.mc-body .mc-std-name .elementor-heading-title {
  margin: 0;
  font-family: var(--mc-serif);
  font-size: clamp(58px, 18vw, 108px);
  font-weight: 500;
  font-style: normal;
  line-height: .82;
  letter-spacing: .03em;
  text-transform: uppercase;
  text-align: center;
  color: var(--mc-papel);
  text-shadow: 0 2px 24px rgba(30, 22, 14, .35);
}
.mc-body .mc-std-name--1 { margin-bottom: -.32em; }
.mc-body .mc-std-name--2 { margin-top: -.3em; }
.mc-body .mc-std-foto { position: relative; z-index: 1; width: min(56vw, 250px); overflow: hidden;
  /* Zoom sobre la pareja: si cambias la foto en Elementor, ajusta estos dos valores */
  --mc-std-zoom: 1.6;
  --mc-std-foco: 50% 90%;
}
.mc-body .mc-std-foto img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: 50% 78%;
  transform: scale(var(--mc-std-zoom));
  transform-origin: var(--mc-std-foco);
  filter: grayscale(1) contrast(1.08) brightness(.96) sepia(.12);
}
.mc-body .mc-std-foto .elementor-widget-container { box-shadow: 0 30px 50px -24px rgba(20, 14, 8, .7); }

.mc-body .mc-std-pie.e-con { align-items: center; --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0; --gap: 6px; --row-gap: 6px; }
.mc-body .mc-std-fecha .elementor-heading-title,
.mc-body .mc-std-lugar .elementor-heading-title {
  font-family: var(--mc-serif);
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
  color: var(--mc-papel);
}
.mc-body .mc-std-fecha .elementor-heading-title { font-size: 14px; font-weight: 600; letter-spacing: .3em; }
.mc-body .mc-std-lugar .elementor-heading-title { font-size: 11px; font-weight: 500; letter-spacing: .3em; opacity: .85; }
.mc-std-scroll { display: block; position: relative; width: 22px; height: 46px; margin-top: 10px; }
.mc-std-scroll span { position: absolute; left: 50%; top: 0; width: 1px; height: 100%; background: rgba(251, 248, 241, .35); overflow: hidden; }
.mc-std-scroll span::after { content: ""; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--mc-papel); animation: mc-scroll 2.2s var(--mc-ease-io) infinite; }
@keyframes mc-scroll { to { top: 100%; } }

/* Estados de partida con JS (la entrada la anima GSAP) */
.mc-js .mc-std :is(.mc-std-word, .mc-std-pie) { opacity: 0; }
.mc-js .mc-std .mc-std-foto { clip-path: inset(100% 0 0 0); }
.mc-js .mc-std .mc-std-name .elementor-heading-title { opacity: 0; }

@media (min-width: 768px) {
  .mc-body .mc-std > .e-con-inner { padding: 34px 40px 34px; }
  .mc-body .mc-std-top.e-con { max-width: 560px; }
  .mc-body .mc-std-name .elementor-heading-title { font-size: 116px; }
  .mc-body .mc-std-foto { width: 280px; }
}
@media (prefers-reduced-motion: reduce) {
  .mc-std-scroll span::after { animation: none; top: 30%; }
}

/* Nuestra historia: foto en arco con ramas a línea ------------------------------- */
.mc-body .mc-arco.e-con {
  position: relative;
  width: min(74vw, 300px);
  margin: 18px auto 10px;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
}
.mc-body .mc-arco-img { position: relative; z-index: 1; width: 78%; margin: 0 auto; }
.mc-body .mc-arco-img img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4.2;
  object-fit: cover;
  border-radius: 999px 999px 0 0;
  filter: saturate(.85) sepia(.08);
}
.mc-body .mc-img-reveal.mc-arco-img { border-radius: 999px 999px 0 0; }
.mc-body .mc-arco-ramas { position: absolute !important; inset: -6% -8% -4%; width: auto !important; max-width: none !important; z-index: 2; pointer-events: none; }
.mc-body .mc-arco-ramas :is(.elementor-widget-container, svg) { display: block; width: 100%; height: 100%; }
.mc-body .mc-historia-adorno { margin: 6px 0 2px; }
.mc-body .mc-historia .mc-muted p { max-width: 30ch; margin-left: auto; margin-right: auto; }

/* Momentos: una foto alta a la izquierda y dos piezas apiladas a la derecha */
.mc-body .mc-momentos.e-con {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 8px;
  width: 100%;
  max-width: 460px;
  height: min(112vw, 500px);
  margin: 4px auto 0;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
}
.mc-body .mc-mom { width: 100% !important; height: 100%; min-height: 0; margin: 0; }
.mc-body .mc-mom--alta { grid-row: 1 / 3; }
.mc-body .mc-mom :is(.elementor-widget-container, img) { width: 100%; height: 100%; }
.mc-body .mc-mom img { display: block; object-fit: cover; border-radius: 0; filter: saturate(.85) sepia(.08); }
.mc-body .mc-mom--nota.e-con {
  position: relative;
  justify-content: center;
  align-items: center;
  background: var(--mc-papel);
  border: 1px solid var(--mc-borde-suave);
  --padding-top: 16px; --padding-bottom: 16px; --padding-left: 14px; --padding-right: 14px;
  --gap: 12px; --row-gap: 12px;
}
.mc-body .mc-mom-nota-txt .elementor-heading-title {
  font-family: var(--mc-script);
  font-size: 30px;
  font-weight: 400;
  font-style: normal;
  line-height: 1.05;
  text-align: center;
  color: var(--mc-oliva-oscuro);
}
.mc-body .mc-mom-sello .mc-col-sello-in { width: 52px; height: 52px; rotate: -8deg; }
.mc-body .mc-mom-sello .mc-col-sello-in span { font-family: var(--mc-serif); font-size: 13px; letter-spacing: .08em; }

/* Los detalles: filas con icono a línea ----------------------------------------- */
.mc-body .mc-dets.e-con {
  width: 100%;
  max-width: 460px;
  margin: 6px auto 0;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
  --gap: 0; --row-gap: 0;
}
.mc-body .mc-det.e-con {
  flex-wrap: nowrap;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  border-top: 1px solid var(--mc-borde);
  --padding-top: 24px; --padding-bottom: 24px; --padding-left: 4px; --padding-right: 4px;
  --gap: 22px; --column-gap: 22px;
}
.mc-body .mc-det.e-con:last-child { border-bottom: 1px solid var(--mc-borde); }
.mc-body .mc-det-icon { flex: none; width: 52px; }
.mc-body .mc-det-icon svg { display: block; width: 52px; height: 52px; }
.mc-body .mc-det-txt.e-con { flex: 1; min-width: 0; --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0; --gap: 4px; --row-gap: 4px; }
.mc-body .mc-det-rot .elementor-heading-title {
  font-family: var(--mc-serif);
  font-size: 13px;
  font-weight: 600;
  font-style: normal;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--mc-acento);
}
.mc-body .mc-det-p p { font-size: 18px; line-height: 1.42; color: var(--mc-tinta); text-align: left; }
.mc-body .mc-det-link .elementor-button-wrapper { text-align: left; }
.mc-body .mc-det-link .elementor-button { padding-left: 0; padding-right: 0; }

/* Confirmación: los acompañantes se van añadiendo debajo del contador */
.mc-body .mc-acomp { margin-bottom: 14px; }
.mc-body .mc-acomp .ff-el-input--label label { font-size: 13px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--mc-gris); }

/* ==========================================================================
   22. Intro (como adovasio.it) y galería editorial (como veleyross.wedding)
   ========================================================================== */

/* La portada ocupa todo el ancho también en escritorio (el resto va en columna) */
.mc-body .mc-std.e-con { --content-width: 100%; }
.mc-body .mc-std > .e-con-inner { max-width: none; }

/* Intro: capa fija sobre la portada. Sin JS no se muestra; en el editor de Elementor se
   ve como una franja normal para poder cambiar las fotos. */
.mc-body .mc-intro.e-con { display: none; }
.elementor-editor-active .mc-intro.e-con { display: flex; }
.mc-js .mc-intro.e-con {
  display: flex;
  position: fixed;
  inset: 0;
  z-index: 9999;
  overflow: hidden;
  background-color: var(--mc-crema);
  --content-width: 100%;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
  /* Red de seguridad: si el JS fallara, la capa se retira sola */
  animation: mc-intro-safety .6s 9s forwards;
}
@keyframes mc-intro-safety { to { opacity: 0; visibility: hidden; } }
.mc-js .mc-intro > .e-con-inner { position: relative; width: 100%; height: 100%; max-width: none; padding: 0; }
.mc-js .mc-intro .elementor-element { margin: 0; }
.mc-js .mc-intro-meta.elementor-widget,
.mc-js .mc-intro-rama.elementor-widget { position: absolute !important; inset: 0; width: auto !important; max-width: none; pointer-events: none; }
.mc-intro-cont {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 22px;
  font-family: var(--mc-serif);
  font-size: 15px;
  letter-spacing: .14em;
  color: var(--mc-tinta);
}
.mc-js .mc-intro-rama { display: flex; align-items: center; justify-content: center; }
.mc-js .mc-intro-rama .elementor-widget-container { width: auto; }
.mc-js .mc-intro-rama svg { display: block; width: min(64vw, 300px); height: auto; }

/* Las fotos se apilan en el centro; el JS fija el tamaño de cada una */
.mc-js .mc-intro-frame.e-con {
  display: block;
  position: absolute;
  inset: 0;
  width: auto;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
}
.mc-js .mc-intro-img.elementor-widget {
  position: absolute !important;
  left: 50%;
  top: 50%;
  width: var(--w, 0px) !important;
  height: var(--h, 0px);
  max-width: none;
  overflow: hidden;
  translate: -50% -50%;
}
.mc-js .mc-intro-img .elementor-widget-container { width: 100%; height: 100%; }
/* La foto tiene el tamaño del marco final (--fw/--fh) y queda centrada: el marco que crece la va descubriendo */
.mc-js .mc-intro-img img {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  width: var(--fw, 100%) !important;
  height: var(--fh, 100%) !important;
  max-width: none;
  object-fit: cover;
  translate: -50% -50%;
}
.mc-js .mc-intro-img--fin img { object-position: 50% 40%; transform-origin: 50% 40%; }
.elementor-editor-active .mc-intro-frame.e-con { flex-direction: row; flex-wrap: wrap; gap: 8px; }
.elementor-editor-active .mc-intro-img { width: 18%; }

/* Galería ---------------------------------------------------------------------- */
.mc-body .mc-galeria-sec.e-con { overflow: clip; }
@media (min-width: 768px) {
  .mc-body .mc-galeria-sec.e-con { --content-width: min(100%, 1100px); }
}
.mc-body .mc-galeria.e-con {
  width: 100%;
  margin: 0 auto;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
  --gap: 0; --row-gap: 0;
}
.mc-body .mc-gal-grupo.e-con {
  position: relative;
  display: flex;
  flex-direction: column;
  --padding-top: 96px; --padding-bottom: 40px; --padding-left: 0; --padding-right: 0;
  --gap: 0; --row-gap: 0;
}
/* Cifra de la fecha enorme, solo contorno */
.mc-body .mc-gal-cifra.elementor-widget { position: absolute !important; top: 0; right: -2%; width: auto; z-index: 0; pointer-events: none; }
.mc-body .mc-gal-cifra .elementor-heading-title {
  font-family: var(--mc-serif);
  font-size: clamp(170px, 52vw, 380px);
  font-weight: 300;
  font-style: normal;
  line-height: .8;
  letter-spacing: -.02em;
  color: transparent;
  -webkit-text-stroke: 1px var(--mc-borde);
}
.mc-body .mc-gal-item.e-con {
  position: relative;
  z-index: 1;
  cursor: zoom-in;
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
  --gap: 10px; --row-gap: 10px;
}
.mc-body .mc-gal-a.e-con { --width: 86%; width: 86%; align-self: flex-start; }
.mc-body .mc-gal-b.e-con { --width: 60%; width: 60%; align-self: flex-end; margin-top: -16%; z-index: 2; }
/* Los grupos pares van al revés */
.mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-a { align-self: flex-end; }
.mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-b { align-self: flex-start; }
.mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-cifra { right: auto; left: -2%; }
/* En los grupos al revés, el pie de la foto grande va a la derecha, donde no lo tapa la pequeña */
.mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-a .mc-gal-cap.e-con { align-self: flex-end; }
.mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-a .mc-gal-cap .elementor-heading-title { text-align: right; }
.mc-body .mc-gal-img { overflow: hidden; width: 100%; }
.mc-body .mc-gal-img img { display: block; width: 100%; object-fit: cover; filter: saturate(.88) sepia(.06); will-change: transform; }
.mc-body .mc-gal-a .mc-gal-img img { aspect-ratio: 4 / 3; }
.mc-body .mc-gal-b .mc-gal-img img { aspect-ratio: 4 / 5; }
.mc-body .mc-gal-cap.e-con {
  --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0;
  --gap: 2px; --row-gap: 2px;
  max-width: 260px;
}
.mc-body .mc-gal-a .mc-gal-cap.e-con { max-width: 46%; }
.mc-body .mc-gal-lugar .elementor-heading-title {
  font-family: var(--mc-serif);
  font-size: 11px;
  font-weight: 600;
  font-style: normal;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--mc-acento);
}
.mc-body .mc-gal-frase .elementor-heading-title {
  font-family: var(--mc-serif);
  font-size: 17px;
  font-weight: 400;
  font-style: italic;
  line-height: 1.25;
  color: var(--mc-gris);
}
.mc-js .mc-gal-img { clip-path: inset(100% 0 0 0); }
.mc-js .mc-gal-cap { opacity: 0; }
@media (min-width: 768px) {
  .mc-body .mc-gal-grupo.e-con { --padding-top: 160px; --padding-bottom: 80px; }
  .mc-body .mc-gal-a.e-con { --width: 58%; width: 58%; margin-left: 4%; }
  .mc-body .mc-gal-b.e-con { --width: 40%; width: 40%; margin-right: 6%; margin-top: -12%; }
  .mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-a { margin-left: 0; margin-right: 4%; }
  .mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-b { margin-right: 0; margin-left: 6%; }
  .mc-body .mc-gal-frase .elementor-heading-title { font-size: 19px; }
}

/* Botón «Ver todas»: octógono a línea, como el de la referencia */
.mc-body .mc-gal-todas-w { display: flex; justify-content: center; margin-top: 20px; }
.mc-gal-todas {
  position: relative;
  width: 132px;
  height: 132px;
  border: 0;
  padding: 0;
  background: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mc-gal-todas svg { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: var(--mc-oliva); stroke-width: 1; transition: rotate .8s var(--mc-ease-out); }
.mc-gal-todas:hover svg, .mc-gal-todas:focus-visible svg { rotate: 22.5deg; }
.mc-gal-todas span {
  position: relative;
  font-family: var(--mc-serif);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--mc-tinta);
}
.mc-body .mc-gal-extra.e-con { display: none; }
.elementor-editor-active .mc-gal-extra.e-con { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; }
.elementor-editor-active .mc-gal-extra-img { width: 30%; }

/* Visor a pantalla completa */
.mc-lb {
  position: fixed;
  inset: 0;
  z-index: 9998;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 56px 16px 72px;
  background: rgba(246, 241, 231, .97);
  visibility: hidden;
  opacity: 0;
  touch-action: pan-y;
}
.mc-lb-fig { margin: 0; flex: 1; min-height: 0; width: 100%; display: flex; align-items: center; justify-content: center; }
.mc-lb-fig img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; box-shadow: 0 30px 60px -30px rgba(46, 38, 32, .5); user-select: none; -webkit-user-drag: none; }
.mc-lb-cap { display: flex; gap: 12px; align-items: baseline; font-family: var(--mc-serif); }
.mc-lb-cap b { font-size: 12px; font-weight: 600; letter-spacing: .22em; color: var(--mc-acento); }
.mc-lb-cap span { font-size: 20px; font-style: italic; color: var(--mc-gris); }
.mc-lb button {
  position: absolute;
  border: 0;
  background: none;
  padding: 10px;
  font-family: var(--mc-serif);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--mc-tinta);
}
.mc-lb-close { top: 10px; right: 10px; }
.mc-lb-prev, .mc-lb-next { bottom: 18px; }
.mc-lb-prev { left: 12px; }
.mc-lb-next { right: 12px; }

/* ==========================================================================
   23. Galería con las proporciones de veleyross, carrusel de hoteles y alergias
   ========================================================================== */

/* Galería: en móvil la referencia no reordena nada, escala la composición de escritorio.
   Todo va en % del ancho: una foto desde el 8 % y la otra desde el 42 %, más abajo y
   montada sobre la primera; la cifra a contorno detrás, en lados alternos. */
.mc-body .mc-galeria.e-con { width: 100vw; max-width: none; margin-left: calc(50% - 50vw); }
@media (min-width: 768px) {
  .mc-body .mc-galeria.e-con { width: 100%; margin-left: 0; }
}
.mc-body .mc-gal-grupo.e-con { --padding-top: 15%; --padding-bottom: 12%; }
.mc-body .mc-gal-cifra.elementor-widget { top: 0; left: 18%; right: auto; }
.mc-body .mc-gal-cifra .elementor-heading-title { font-size: min(24vw, 270px); }
.mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-cifra { left: auto; right: 9%; }
.mc-body .mc-gal-grupo.e-con .mc-gal-item.e-con { align-self: flex-start !important; margin-right: 0 !important; }
.mc-body .mc-gal-grupo.e-con .mc-gal-a.e-con { --width: 50%; width: 50%; margin-left: 8% !important; }
.mc-body .mc-gal-grupo.e-con .mc-gal-b.e-con { --width: 41%; width: 41%; margin-left: 42% !important; margin-top: -14% !important; }
.mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-a.e-con { --width: 42%; width: 42%; }
.mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-b.e-con { --width: 50%; width: 50%; margin-top: -9% !important; }
.mc-body .mc-gal-a .mc-gal-img img { aspect-ratio: 4 / 3; }
.mc-body .mc-gal-b .mc-gal-img img { aspect-ratio: 4 / 5; }

/* Mosaico de la pedida: tres fotos, sin nota */
.mc-body .mc-mom--b { grid-column: 2; }

/* Dónde dormir: carrusel de hoteles --------------------------------------------- */
.mc-body .mc-alojamiento.e-con { overflow: clip; }
.mc-body .mc-center-txt p { text-align: center; }
.mc-body .mc-hoteles.e-con {
  display: flex;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch;
  gap: 14px;
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-left: 24px;
  scrollbar-width: none;
  --padding-top: 6px; --padding-bottom: 6px; --padding-left: 24px; --padding-right: 24px;
}
.mc-body .mc-hoteles.e-con::-webkit-scrollbar { display: none; }
.mc-body .mc-hotel.e-con {
  flex: 0 0 78%;
  max-width: 320px;
  scroll-snap-align: start;
  background: var(--mc-papel);
  border: 1px solid var(--mc-borde);
  --padding-top: 22px; --padding-bottom: 22px; --padding-left: 22px; --padding-right: 22px;
  --gap: 6px; --row-gap: 6px;
}
.mc-body .mc-hotel-num .elementor-heading-title {
  font-family: var(--mc-serif);
  font-size: 46px;
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1px var(--mc-acento);
}
.mc-body .mc-hotel-nombre .elementor-heading-title {
  margin-top: 6px;
  font-family: var(--mc-serif);
  font-size: 25px;
  font-weight: 500;
  font-style: normal;
  line-height: 1.1;
  color: var(--mc-tinta);
}
.mc-body .mc-hotel-dist .elementor-heading-title {
  font-family: var(--mc-serif);
  font-size: 12px;
  font-weight: 600;
  font-style: normal;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--mc-acento);
}
.mc-body .mc-hotel-dir p { margin: 0; font-size: 12px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--mc-gris); }
.mc-body .mc-hotel-nota p { margin: 4px 0 0; font-size: 17px; font-style: italic; line-height: 1.35; color: var(--mc-gris); }
.mc-body .mc-hotel-link { margin-top: auto; }
.mc-body .mc-hotel-link .elementor-button-wrapper { text-align: left; }
.mc-body .mc-hotel-link .elementor-button { padding-left: 0; padding-right: 0; }
@media (min-width: 768px) {
  .mc-body .mc-hoteles.e-con { width: 100%; margin-left: 0; --padding-left: 0; --padding-right: 0; scroll-padding-left: 0; }
  .mc-body .mc-hotel.e-con { flex-basis: 300px; }
}
/* Flechas y contador que añade el JS */
.mc-hot-nav { display: flex; align-items: center; justify-content: center; gap: 22px; margin-top: 14px; font-family: var(--mc-serif); color: var(--mc-tinta); }
.mc-hot-nav button {
  width: 42px;
  height: 42px;
  border: 1px solid var(--mc-borde);
  border-radius: 50%;
  background: transparent;
  font-size: 18px;
  line-height: 1;
  color: var(--mc-tinta);
  transition: border-color .3s, color .3s;
}
.mc-hot-nav button:hover, .mc-hot-nav button:focus-visible { border-color: var(--mc-acento); color: var(--mc-acento); }
.mc-hot-nav button:disabled { opacity: .35; cursor: default; }
.mc-hot-count { min-width: 70px; text-align: center; font-size: 13px; font-weight: 600; letter-spacing: .22em; }

/* Formulario: alergias de cada persona debajo de su nombre */
.mc-body .mc-alergia { margin-bottom: 16px; }
.mc-body .mc-alergia .ff-el-input--label label { font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--mc-gris); }
.mc-body .mc-acomp { margin-top: 10px; padding-top: 16px; border-top: 1px dotted var(--mc-borde); }

/* ==========================================================================
   24. Galería en móvil, como veleyross en un teléfono de verdad
   Dos fotos cuadradas del 75 % del ancho: la primera pegada a la izquierda y encima; la
   segunda pegada a la derecha (desde el 25 %), por debajo y empezando un poco antes de
   que acabe la primera. La cifra a contorno, grande, encima y medio tapada por la primera
   foto; cambia de lado en cada grupo, las fotos no.
   ========================================================================== */
@media (max-width: 767px) {
  .mc-body .mc-gal-grupo.e-con { --padding-top: 23vw; --padding-bottom: 12vw; }
  .mc-body .mc-gal-cifra.elementor-widget { top: 0; left: 8%; right: auto; }
  .mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-cifra { left: auto; right: 7%; }
  .mc-body .mc-gal-cifra .elementor-heading-title { font-size: 50vw; line-height: .74; letter-spacing: -.02em; }
  .mc-body .mc-gal-grupo.e-con .mc-gal-a.e-con,
  .mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-a.e-con {
    --width: 75%; width: 75%; margin-left: 0 !important; margin-top: 0 !important; z-index: 2;
  }
  .mc-body .mc-gal-grupo.e-con .mc-gal-b.e-con,
  .mc-body .mc-gal-grupo.e-con:nth-child(even) .mc-gal-b.e-con {
    --width: 75%; width: 75%; margin-left: 25% !important; margin-top: -16.5% !important; z-index: 1;
  }
  .mc-body .mc-gal-a .mc-gal-img img,
  .mc-body .mc-gal-b .mc-gal-img img { aspect-ratio: 1 / 1; }
}

/* Cifras de la galería con números de caja alta (Cormorant usa por defecto los elzevirianos, que encogen el 0 y el 4) */
.mc-body .mc-gal-cifra .elementor-heading-title { font-variant-numeric: lining-nums; font-feature-settings: "lnum" 1; }

/* 25. Interruptor del autobús: bolita deslizable de verdad (elemento, no ::after) */
.mc-switch-ui {
  width: 64px;
  height: 36px;
  border: 1px solid var(--mc-borde);
  background: #E9E1D2;
  touch-action: pan-y;
  cursor: pointer;
}
.mc-switch-ui::after { display: none; }
.mc-switch-hint {
  position: absolute;
  right: 11px;
  top: 50%;
  translate: 0 -52%;
  font-size: 18px;
  line-height: 1;
  color: var(--mc-gris);
  opacity: .7;
  transition: opacity .25s;
}
.mc-switch-knob {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mc-papel);
  color: var(--mc-oliva-oscuro);
  box-shadow: 0 2px 5px rgba(46, 38, 32, .28), 0 0 0 1px rgba(46, 38, 32, .06);
  transition: transform .35s var(--mc-ease-out), background-color .25s, color .25s;
}
.mc-switch-knob svg { width: 14px; height: 14px; }
.mc-switch-knob .mc-k-on { display: none; }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check:has(input:checked) .mc-switch-ui { background: var(--mc-oliva); border-color: var(--mc-oliva); }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check:has(input:checked) .mc-switch-knob { transform: translateX(28px); color: var(--mc-oliva); }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check:has(input:checked) .mc-switch-knob .mc-k-on { display: block; }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check:has(input:checked) .mc-switch-knob .mc-k-off { display: none; }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check:has(input:checked) .mc-switch-hint { opacity: 0; }
/* Un empujoncito al aparecer, para sugerir que se desliza */
@keyframes mc-nudge { 0%, 70%, 100% { transform: translateX(0); } 80% { transform: translateX(7px); } 90% { transform: translateX(2px); } }
.mc-body .mc-rsvp .mc-switch .ff-el-form-check:not(:has(input:checked)) .mc-switch-knob { animation: mc-nudge 2.8s var(--mc-ease-out) 1s 3; }
@media (prefers-reduced-motion: reduce) {
  .mc-switch-knob { transition: none; animation: none !important; }
}

/* 26. Acuarelas de la iglesia y el cortijo (imágenes): se funden con el papel */
.mc-body .mc-acuarela-img { width: 100%; max-width: 440px; margin: 0 auto; }
.mc-body .mc-acuarela-img img {
  display: block;
  width: 100%;
  height: auto;
  /* El papel de la acuarela es transparente (webp con alfa): solo se ve la pintura sobre el
     papel de la página. El difuminado final solo suaviza las manchas de los bordes. */
  -webkit-mask-image: radial-gradient(closest-side, #000 72%, transparent 100%);
  mask-image: radial-gradient(closest-side, #000 72%, transparent 100%);
}

/* 27. Ajustes: anillo en la celda alta, feria por encima en la 2.ª pareja, opciones de regalo */
.mc-body .mc-mom--anillo img { object-position: 62% 50%; }
.mc-body .mc-gal-grupo.e-con:nth-child(2) .mc-gal-b.e-con { z-index: 3 !important; }
.mc-body .mc-regalo-opcion { margin-top: 14px; }
.mc-body .mc-regalo-opcion .elementor-heading-title { color: var(--mc-acento); }

/* 28. Galería: el 24 más a la vista y el 27 suelto al final */
.mc-body .mc-gal-grupo.e-con:first-child { --padding-top: 21%; }
.mc-body .mc-gal-grupo--solo.e-con { --padding-top: 0; --padding-bottom: 0; min-height: 30vw; }
.mc-body .mc-gal-grupo--solo .mc-gal-cifra.elementor-widget { position: relative !important; top: auto; left: 8%; }
@media (max-width: 767px) {
  .mc-body .mc-gal-grupo.e-con:first-child { --padding-top: 33vw; }
  .mc-body .mc-gal-grupo--solo.e-con { --padding-top: 0; --padding-bottom: 6vw; min-height: 0; }
}
@media (min-width: 768px) {
  .mc-body .mc-gal-grupo--solo.e-con { min-height: 0; --padding-bottom: 40px; }
}