/* =========================================================
   V6 — correcciones Luciana (oct 2026)
   Se carga último: pisa a home-v5 / home-v5-iter2 sin borrarlos.
   ========================================================= */

/* ---------- ¿CÓMO FUNCIONA? ----------
   Fondo crema fijo (como la carta). Texto negro.
   Los pasos arrancan apagados y se "prenden" en bordó al scrollear. */
.mr-how{
  background:var(--mr-cream)!important;
  color:var(--mr-ink)!important;
}
.mr-how-title,
.mr-how-intro{color:var(--mr-ink)!important}
.mr-process::before{background:var(--mr-line)!important}

.mr-step{
  opacity:.28!important;
  transition:opacity .45s ease!important;
}
.mr-step .mr-step-num,
.mr-step h3,
.mr-step p{
  color:var(--mr-ink)!important;
  opacity:1!important;
  transition:color .45s ease!important;
}
/* paso actual y los ya recorridos: bordó, opacidad plena */
.mr-step.is-active,
.mr-step.is-past{opacity:1!important}
.mr-step.is-active .mr-step-num,
.mr-step.is-active h3,
.mr-step.is-active p,
.mr-step.is-past .mr-step-num,
.mr-step.is-past h3,
.mr-step.is-past p{color:#58272D!important}

/* +1 punto en el cuerpo de texto */
@media (max-width:759px){
  .mr-how-intro{font-size:14px!important;line-height:1.45!important}
  .mr-step p{font-size:13px!important;line-height:1.45!important}
  .mr-receive-row{font-size:13px!important}
  .mr-receive-copy{font-size:13px!important}
}
@media (min-width:760px){
  .mr-how-intro{font-size:15px!important}
  .mr-step p{font-size:13px!important}
  .mr-receive-row{font-size:13px!important}
  .mr-receive-copy{font-size:15px!important}
}

/* ---------- QUÉ RECIBÍS → imagen fija + bloque centrado ---------- */
.mr-receive{
  background:var(--mr-cream)!important;
  padding:0 0 35svh!important;
  overflow:visible!important;
}
.mr-receive-head{display:none!important}
.mr-receive-visual{
  position:sticky!important;
  top:0!important;
  height:100svh!important;
  min-height:100svh!important;
  margin:0!important;
  background-image:url('assets/mesas.png')!important;
  background-size:cover!important;
  background-position:center!important;
}
.mr-receive-center{
  position:relative;
  z-index:4;
  margin-top:-100svh;
  min-height:100svh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 17px;
}
.mr-receive-center .mr-receive-sheet{
  margin:0!important;
  width:100%;
  max-width:560px;
}
@media (min-width:760px){
  .mr-receive-center .mr-receive-sheet{max-width:820px}
}

/* ---------- CIERRE: frase + firma a pantalla completa ---------- */
.mr-close{
  min-height:100svh!important;
  padding:0 26px 110px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  position:relative!important;
  overflow:hidden!important;
  background:var(--mr-green)!important;
  background-image:none!important;
  color:var(--mr-cream)!important;
}
.mr-close-inner{
  position:relative!important;
  left:auto!important;right:auto!important;bottom:auto!important;
  width:100%!important;
  max-width:640px!important;
  margin:0 auto!important;
  z-index:3!important;
  transform:none!important;
}
.mr-close h2{
  font-family:var(--serif)!important;
  font-weight:400!important;
  font-size:44px!important;
  line-height:.92!important;
  letter-spacing:-.02em!important;
  text-transform:none!important;
  color:var(--mr-cream)!important;
  max-width:none!important;
  margin:0 auto!important;
  transform:none!important;
}
.mr-close p{
  display:block!important;
  font-family:var(--sans)!important;
  font-size:14px!important;
  line-height:1.5!important;
  max-width:330px!important;
  margin:22px auto 0!important;
  color:rgba(242,235,221,.82)!important;
}
.mr-close-signature{
  display:block!important;
  position:relative!important;
  left:auto!important;right:auto!important;bottom:auto!important;
  width:min(68vw,360px)!important;
  height:auto!important;
  opacity:1!important;
  transform:rotate(-4deg)!important;
  margin:44px auto 0!important;
}
/* Pie: solo palabras clickeables, sin botones */
.mr-footer{
  position:absolute!important;
  left:26px!important;right:26px!important;bottom:30px!important;
  max-width:760px!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:1fr auto 1fr!important;
  align-items:center!important;
  gap:12px!important;
  z-index:4!important;
  font-family:var(--serif)!important;
  text-transform:uppercase!important;
  color:var(--mr-cream)!important;
}
.mr-footer a,
.mr-footer strong{
  min-height:0!important;
  padding:0!important;
  border-radius:0!important;
  background:none!important;
  display:block!important;
  color:var(--mr-cream)!important;
  font-family:var(--serif)!important;
  font-weight:400!important;
  white-space:nowrap!important;
  text-decoration:none!important;
}
.mr-footer a{font-size:12px!important;letter-spacing:.12em!important;opacity:.78;transition:opacity .2s ease}
.mr-footer a:hover{opacity:1;text-decoration:underline!important;text-underline-offset:4px}
.mr-footer a:first-child{text-align:left!important}
.mr-footer a:last-child{text-align:right!important}
.mr-footer strong{font-size:14px!important;letter-spacing:.1em!important;text-align:center!important}

@media (min-width:760px){
  .mr-close h2{font-size:76px!important}
  .mr-close p{font-size:16px!important;max-width:480px!important}
  .mr-close-signature{width:420px!important}
  .mr-footer{bottom:40px!important}
  .mr-footer a{font-size:13px!important}
  .mr-footer strong{font-size:16px!important}
}

/* ---------- MENÚ: horizontal en escritorio, hamburguesa en celular ---------- */
.header-nav{display:none}
@media (min-width:760px){
  .mr-app .header{padding:0 7vw!important}
  .header-nav{
    display:flex;
    align-items:center;
    gap:36px;
  }
  .header-nav a{
    font-family:var(--serif);
    font-size:13px;
    letter-spacing:.1em;
    text-transform:uppercase;
    color:inherit;
    text-decoration:none;
    opacity:.8;
    transition:opacity .2s ease;
  }
  .header-nav a:hover{opacity:1;text-decoration:underline;text-underline-offset:5px}
  .mr-app .menu-button{display:none!important}
  .menu-overlay{display:none!important}
}

/* ---------- QUÉ RECIBÍS en escritorio: foto a todo el ancho, tarjeta centrada ---------- */
@media (min-width:760px){
  .mr-receive{display:block!important;grid-template-columns:none!important}
  .mr-receive-visual{width:100%!important;min-height:100vh!important;height:100vh!important}
  .mr-receive-center{margin-top:-100vh;min-height:100vh;padding:0 48px}
  .mr-receive-center .mr-receive-sheet{
    display:block!important;
    padding:56px 64px 58px!important;
    border-radius:30px!important;
  }
}

/* ---------- CARTA: placeholder para platos sin foto ---------- */
.mr-dish-media--empty{background:var(--mr-green);display:grid;place-items:start center;border-radius:28px}
.mr-dish-media--empty span{margin-top:38%;font-family:var(--sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(242,235,221,.45)}

/* ---------- CARTA en escritorio: grilla (2 columnas en tablet, 4 + 4 en escritorio) ---------- */
@media (min-width:760px){
  .mr-carta-sticky{position:relative!important;box-shadow:none!important;border-bottom:0!important}
  .mr-carta-head{padding-left:7vw!important;padding-right:7vw!important;max-width:none!important;width:auto!important;margin:0!important}
  .mr-dish-index{display:none!important}
  .mr-dish-stack{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:22px!important;
    padding:6px 7vw 110px!important;
  }
  .mr-dish{
    position:relative!important;
    top:auto!important;
    width:auto!important;
    min-height:0!important;
    aspect-ratio:3/4;
    margin:0!important;
    border-radius:22px!important;
    box-shadow:none!important;
  }
  .mr-dish-media,.mr-dish-media img,.mr-dish-media--empty{border-radius:22px!important}
  .mr-dish-content{padding:24px 22px 20px!important}
  .mr-dish h3{font-size:30px!important;line-height:.95!important;max-width:none!important}
  .mr-dish h3 br{display:none}
  .mr-dish-no{font-size:10px!important}
  .mr-dish-desc{
    font-size:12px!important;line-height:1.4!important;max-width:none!important;margin-bottom:14px!important;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  }
  .mr-dish-time{font-size:10px!important}
}
@media (min-width:1100px){
  .mr-dish-stack{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
