/* Mantel Rojo · Portada "La mesa" (scroll). Todo vive bajo .mm-mesa para no chocar con el resto del sitio. */
.mm-mesa{--mm-rojo:#B23B3B;--mm-crema:#F8F0DE;--mm-carbon:#17130F;--mm-dorado:#C5A368;--mm-suave:rgba(248,240,222,.74);
  --mm-serif:"Newsreader",Georgia,"Times New Roman",serif;--mm-sans:"Manrope","Helvetica Neue",Arial,sans-serif;--mm-top:0px;
  position:relative;background:var(--mm-carbon);color:var(--mm-crema);overflow:clip!important;isolation:isolate}
.mm-mesa.cover-hero::before{display:none}
.mm-scroll{position:relative;height:900vh}
.mm-stage{position:sticky;top:var(--mm-top);height:calc(100vh - var(--mm-top));height:calc(100svh - var(--mm-top));overflow:hidden;
  background:radial-gradient(ellipse 70% 60% at 60% 45%,#2b211a 0%,#17130F 72%)}
.mm-world{position:absolute;left:0;top:0;transform-origin:0 0}
.mm-wood{position:absolute;inset:0;border-radius:26px;background:#3a2418 center/cover no-repeat;box-shadow:0 60px 120px -20px rgba(0,0,0,.8),inset 0 0 0 1px rgba(0,0,0,.4)}
.mm-mantel{position:absolute;border-radius:10px;background-color:var(--mm-rojo);background-size:120px 120px;
  box-shadow:0 18px 40px -10px rgba(0,0,0,.55);clip-path:inset(46% 49% 46% 49% round 10px)}
.mm-go .mm-mantel{animation:mm-unfold 1.7s .15s cubic-bezier(.2,.7,.2,1) forwards}
.mm-mantel::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:
  linear-gradient(90deg,transparent calc(33.33% - 14px),rgba(0,0,0,.10) calc(33.33% - 1px),rgba(255,230,220,.07) calc(33.33% + 1px),transparent calc(33.33% + 14px)),
  linear-gradient(90deg,transparent calc(66.66% - 14px),rgba(0,0,0,.10) calc(66.66% - 1px),rgba(255,230,220,.07) calc(66.66% + 1px),transparent calc(66.66% + 14px)),
  linear-gradient(180deg,transparent calc(50% - 16px),rgba(0,0,0,.11) calc(50% - 1px),rgba(255,230,220,.07) calc(50% + 1px),transparent calc(50% + 16px)),
  radial-gradient(ellipse 60% 55% at 50% 45%,rgba(255,200,170,.10),transparent 70%),linear-gradient(180deg,transparent,rgba(0,0,0,.18))}
.mm-mantel::after{content:"";position:absolute;inset:16px;border:2px dashed rgba(60,10,10,.35);border-radius:4px;pointer-events:none}
@keyframes mm-unfold{0%{clip-path:inset(46% 49% 46% 49% round 10px)}45%{clip-path:inset(46% 0 46% 0 round 10px)}100%{clip-path:inset(0 0 0 0 round 10px)}}
.mm-fade{opacity:0}
.mm-go .mm-fade{animation:mm-appear .9s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes mm-appear{to{opacity:1}}

.mm-item{position:absolute;transform:translate(-50%,-50%)}
.mm-plate{width:300px;height:300px;opacity:0}
.mm-plate .mm-shadow{position:absolute;inset:0;border-radius:50%;background:rgba(20,0,0,.6);filter:blur(16px);transform:translate(10px,16px)}
.mm-plate .mm-dish{position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle,#fbf8f1 0 59%,#e8e1d4 63%,#fffdf8 67%,#f1ebe0 82%,#d9cfbf 100%);
  box-shadow:0 0 0 1px rgba(0,0,0,.08),inset -6px -8px 18px rgba(120,100,80,.18),inset 6px 8px 14px rgba(255,255,255,.7)}
.mm-plate .mm-food{position:absolute;inset:16%;border-radius:50%;background-size:cover;background-position:center;box-shadow:0 0 0 3px rgba(255,255,255,.6),inset 0 0 18px rgba(0,0,0,.35)}
.mm-plate .mm-gloss{position:absolute;inset:0;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse 40% 22% at 34% 22%,rgba(255,255,255,.55),transparent 70%)}
.mm-plate .mm-ring{position:absolute;inset:-14px;border-radius:50%;border:2px solid var(--mm-dorado);opacity:0;transition:opacity .4s}
.mm-plate.mm-on .mm-ring{opacity:.9}
.mm-cutlery{width:28px;height:240px;filter:drop-shadow(6px 10px 6px rgba(30,0,0,.45))}
.mm-glass{width:118px;height:118px;border-radius:50%;
  background:radial-gradient(circle at 38% 32%,rgba(255,255,255,.55),rgba(255,255,255,.10) 32%,rgba(255,255,255,.03) 60%,rgba(255,255,255,.18) 96%);
  box-shadow:0 0 0 2px rgba(255,255,255,.28),16px 22px 26px -6px rgba(30,0,0,.45),inset 0 0 22px rgba(255,255,255,.12)}
.mm-glass.mm-vino::before{content:"";position:absolute;inset:26%;border-radius:50%;background:radial-gradient(circle at 40% 36%,#8e2433,#4a0d17 70%);box-shadow:inset 0 0 10px rgba(0,0,0,.6)}
.mm-napkin{width:210px;height:210px;border-radius:6px;box-shadow:10px 14px 22px -6px rgba(30,0,0,.45);
  background-image:linear-gradient(90deg,transparent 49.6%,rgba(0,0,0,.06) 50%,transparent 50.4%),linear-gradient(0deg,transparent 49.6%,rgba(0,0,0,.06) 50%,transparent 50.4%),linear-gradient(135deg,#fbf5e6,#efe4cb)}
.mm-logo{width:150px;height:150px;border-radius:50%;background:#F8F0DE center/86% no-repeat;box-shadow:0 6px 18px rgba(0,0,0,.25),inset 0 0 0 4px rgba(178,59,59,.15)}
.mm-salt{width:70px;height:70px;border-radius:50%;background:radial-gradient(circle,#fff 0 30%,#e9e5dc 46%,#f7f3ec 56%,#d8d1c4 100%);box-shadow:8px 12px 14px -4px rgba(30,0,0,.45)}
.mm-sprig{width:120px;height:60px}

.mm-light{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 65% 60% at 55% 45%,transparent 40%,rgba(10,7,5,.55) 100%)}
.mm-shade{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:0;background:linear-gradient(90deg,transparent 38%,rgba(18,13,10,.82) 66%,rgba(18,13,10,.94))}

/* Texto original de la portada, encima de la mesa */
.mm-intro{position:absolute;inset:0;z-index:5;display:flex;align-items:center;pointer-events:none;
  background:linear-gradient(90deg,rgba(20,19,16,.92) 0%,rgba(20,19,16,.7) 30%,rgba(20,19,16,0) 52%)}
.mm-intro .cover-inner{width:100%;padding-top:24px;padding-bottom:24px}
.mm-intro .cover-copy{max-width:520px;padding-bottom:0;pointer-events:auto}
.mm-intro .cover-logo{width:84px;height:84px;margin-bottom:20px}
.mm-intro .cover-copy>p{font-size:15px;line-height:1.6;color:var(--mm-suave)}
.mm-mesa .mm-intro.mm-off .cover-copy{pointer-events:none}

.mm-cue{position:absolute;left:62%;bottom:24px;transform:translateX(-50%);z-index:5;display:flex;flex-direction:column;align-items:center;gap:10px;
  font:600 11px/1.2 var(--mm-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--mm-suave);pointer-events:none;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.mm-cue i{display:block;width:1px;height:40px;background:linear-gradient(var(--mm-crema),transparent);animation:mm-cue 1.8s ease-in-out infinite}
@keyframes mm-cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

.mm-panels{position:absolute;z-index:6;top:50%;right:max(48px,calc((100vw - 1280px)/2 + 48px));width:min(36vw,500px);transform:translateY(-50%)}
.mm-panel{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);opacity:0;pointer-events:none}
.mm-panel.mm-on{pointer-events:auto}
.mm-panel .mm-num{font:italic 400 20px/1 var(--mm-serif);color:var(--mm-dorado)}
.mm-mesa .mm-panel h3{font:400 clamp(38px,4.2vw,62px)/1.02 var(--mm-serif);letter-spacing:-.015em;margin:12px 0 18px;color:var(--mm-crema);text-wrap:balance}
.mm-mesa .mm-panel p{font:400 17px/1.6 var(--mm-sans);color:var(--mm-suave);margin:0 0 20px;max-width:40ch}
.mm-panel .mm-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.mm-panel .mm-tags span{font:600 11px/1 var(--mm-sans);letter-spacing:.08em;text-transform:uppercase;padding:8px 12px;border-radius:999px;color:var(--mm-crema);background:rgba(248,240,222,.08);box-shadow:inset 0 0 0 1px rgba(248,240,222,.18)}
.mm-panel a.mm-more{font:600 15px/1.4 var(--mm-sans);color:var(--mm-crema);text-decoration:none;border-bottom:1px solid rgba(248,240,222,.4);padding-bottom:3px}
.mm-panel a.mm-more:hover{border-color:var(--mm-crema)}

.mm-index{position:absolute;z-index:7;left:max(48px,calc((100vw - 1280px)/2 + 48px));bottom:28px;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;opacity:0;transition:opacity .4s}
.mm-index button{all:unset;cursor:pointer;display:flex;align-items:center;gap:12px;font:500 13px/1.3 var(--mm-sans);color:rgba(248,240,222,.5);padding:3px 0;transition:color .3s}
.mm-index button::before{content:"";width:18px;height:1px;background:currentColor;transition:width .4s cubic-bezier(.2,.7,.2,1)}
.mm-index button.mm-on{color:var(--mm-crema)}
.mm-index button.mm-on::before{width:40px;background:var(--mm-dorado)}
.mm-index button:focus-visible{outline:2px solid var(--mm-dorado);outline-offset:4px}

.mm-outro{position:absolute;left:0;right:0;top:5vh;z-index:5;text-align:center;opacity:0;pointer-events:none;padding:0 16px}
.mm-outro.mm-on{pointer-events:auto}
.mm-outro .mm-eyebrow{font:600 11px/1.2 var(--mm-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--mm-dorado)}
.mm-mesa .mm-outro h2{font:400 clamp(38px,5.2vw,78px)/1 var(--mm-serif);letter-spacing:-.02em;margin:12px 0 22px;color:var(--mm-crema)}
.mm-mesa .mm-outro h2 em{font-style:italic;color:#f0c9a8}
.mm-outro .mm-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.mm-outro .btn.ghost{color:var(--mm-crema);border-color:rgba(248,240,222,.4)}

@media (max-width:760px){
  .mm-intro{align-items:flex-start;background:linear-gradient(180deg,rgba(20,19,16,.94) 0%,rgba(20,19,16,.86) 62%,rgba(20,19,16,.2) 86%,rgba(20,19,16,0) 100%)}
  .mm-intro .cover-inner{padding-top:20px}
  .mm-intro .cover-logo{width:60px;height:60px;margin-bottom:14px}
  .mm-intro .cover-copy>p{font-size:14px}
  .mm-cue{left:50%;bottom:16px}
  .mm-shade{background:linear-gradient(180deg,transparent 42%,rgba(18,13,10,.86) 62%,rgba(18,13,10,.96))}
  .mm-panels{top:auto;bottom:20px;left:16px;right:16px;width:auto;height:40%;transform:none}
  .mm-panel{top:auto;bottom:0;transform:none}
  .mm-mesa .mm-panel h3{font-size:34px;margin:6px 0 10px}
  .mm-mesa .mm-panel p{font-size:15px;margin-bottom:12px}
  .mm-panel .mm-tags{margin-bottom:14px}
  .mm-index{display:none}
  .mm-outro{top:3vh}
}
@media (prefers-reduced-motion:reduce){
  .mm-mantel,.mm-go .mm-mantel{animation:none;clip-path:none}
  .mm-fade,.mm-go .mm-fade{animation:none;opacity:1}
  .mm-cue i{animation:none}
}
