/*!
 * Site · Home
 * Hero con tapas en abanico (parallax), cinta de medios, bento "Ahora", dos libros (noche / día),
 * carrusel de opiniones, novedades, sobre Max y preguntas. Entradas al scrollear con [data-reveal] (site.js).
 */

/* ═════════════ Aparición al scrollear (genérico, solo con JS) ═════════════ */
.mbs-js [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity 700ms var(--ease-out),transform 700ms var(--ease-out);transition-delay:var(--rd,0ms)}
.mbs-js [data-reveal].is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.mbs-js [data-reveal]{transform:none;transition:opacity 300ms ease}}

/* ═════════════ 1 · Hero ═════════════ */
.mbs-hh{position:relative;overflow:hidden;padding:28px 0 36px}
.mbs-hh::before{content:"";position:absolute;inset:-20% -10% auto auto;width:70vw;max-width:820px;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(232,214,55,.28),rgba(232,214,55,0));z-index:-1;pointer-events:none}
.mbs-hh__grid{display:grid;gap:28px}
.mbs-hh__title{margin-top:12px;font-size:clamp(58px,17vw,148px);line-height:.88;letter-spacing:-.05em;text-wrap:balance}
.mbs-hh__lead{max-width:34ch;margin-top:20px;font:300 clamp(20px,4.8vw,26px)/1.38 var(--font-display);letter-spacing:-.01em;color:var(--ink-2);text-wrap:pretty}
.mbs-hh__ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.mbs-hh__ctas .mbs-btn{flex:1 1 170px}
.mbs-hh__art{position:relative;height:clamp(300px,86vw,420px)}
.mbs-hh__cover{position:absolute;display:block;width:52%;max-width:280px;filter:drop-shadow(0 30px 40px rgba(0,0,0,.18));will-change:transform}
.mbs-hh__cover .mbs-img{display:block;width:100%;height:auto;border-radius:4px}
.mbs-hh__cover--d{left:6%;top:4%;rotate:-7deg}
.mbs-hh__cover--j{right:6%;top:14%;rotate:6deg}
.mbs-hh__seal{position:absolute;left:50%;bottom:4%;right:auto;translate:-50% 0;z-index:3}
img.mbs-hh__seal{left:auto;right:2%;bottom:0;translate:none}
.mbs-js .mbs-hh__cover{animation:mbs-hh-in 900ms var(--ease-out) backwards}
.mbs-js .mbs-hh__cover--j{animation-delay:120ms}
.mbs-js .mbs-hh__seal{animation:mbs-hh-pop 520ms var(--ease-out) 520ms backwards}
@keyframes mbs-hh-in{from{opacity:0;translate:0 40px}}
@keyframes mbs-hh-pop{from{opacity:0;scale:.6}}
@media (hover:hover) and (pointer:fine){
  .mbs-hh__cover{transition:rotate 400ms var(--ease-out),scale 400ms var(--ease-out)}
  .mbs-hh__cover:hover{rotate:0deg;scale:1.03;z-index:2}
}
@media (min-width:900px){
  .mbs-hh{padding:48px 0 64px}
  .mbs-hh__grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:40px}
  .mbs-hh__ctas .mbs-btn{flex:none}
  .mbs-hh__art{height:540px}
  .mbs-hh__cover{width:58%}
}
@media (prefers-reduced-motion:reduce){.mbs-js .mbs-hh__cover,.mbs-js .mbs-hh__seal{animation:none}}

/* ═════════════ 2 · Cinta de medios ═════════════ */
.mbs-press-strip{display:grid;gap:10px;padding:18px 0 20px;border-block:1px solid var(--line)}
.mbs-press-strip__label{padding-inline:var(--gutter);font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);text-align:center}
.mbs-marquee{display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.mbs-marquee__track{display:flex;flex:none;gap:44px;padding-right:44px;animation:mbs-marquee 38s linear infinite}
.mbs-marquee__track li{font:500 clamp(20px,4vw,28px)/1.2 var(--font-display);letter-spacing:-.01em;white-space:nowrap;color:var(--ink-2)}
.mbs-marquee__track li::after{content:"✦";margin-left:44px;font-size:.55em;vertical-align:middle;color:var(--accent-press)}
.mbs-marquee:hover .mbs-marquee__track{animation-play-state:paused}
@keyframes mbs-marquee{to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){.mbs-marquee{flex-wrap:wrap;justify-content:center;-webkit-mask-image:none;mask-image:none}.mbs-marquee__track{animation:none;flex-wrap:wrap;justify-content:center;gap:8px 24px;padding:0 var(--gutter)}.mbs-marquee__track[aria-hidden]{display:none}.mbs-marquee__track li::after{display:none}}

/* ═════════════ 3 · Ahora (bento) ═════════════ */
.mbs-home .mbs-now{margin-top:56px}
.mbs-bento{display:grid;gap:12px}
@media (min-width:700px){.mbs-bento{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}}
.mbs-tilex{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-height:230px;padding:22px;overflow:hidden;border-radius:var(--r-l);background:var(--surface);color:var(--ink);text-decoration:none;transition:transform 260ms var(--ease-out),box-shadow 260ms var(--ease-out)}
.mbs-tilex:active{transform:scale(.985)}
@media (hover:hover) and (pointer:fine){.mbs-tilex:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,0,0,.1)}.mbs-tilex:hover .mbs-tilex__go .mbs-icon{transform:translateX(3px)}}
.mbs-tilex__tag{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 11px;border-radius:999px;background:#fff;font-size:11.5px;font-weight:600;letter-spacing:.04em}
.mbs-tilex__tag--red{background:#C82424;color:#fff}
.mbs-tilex__tag--live i{width:8px;height:8px;border-radius:50%;background:#e53935;animation:mbs-live 1.6s ease-in-out infinite}
@keyframes mbs-live{50%{opacity:.25}}
.mbs-tilex__title{margin-top:auto;font:500 26px/1.08 var(--font-display);letter-spacing:-.02em;text-wrap:balance}
.mbs-tilex__text{font-size:14px;line-height:1.5;color:var(--ink-2)}
.mbs-tilex__go{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:13.5px;font-weight:600}
.mbs-tilex__go .mbs-icon{width:16px;height:16px;transition:transform 200ms var(--ease-out)}
/* variantes */
.mbs-tilex--impro{background:var(--ink);color:#fff}
.mbs-tilex--impro .mbs-tilex__text{color:rgba(255,255,255,.72)}
.mbs-tilex--impro .mbs-tilex__tag{background:rgba(255,255,255,.12);color:#fff}
.mbs-tilex__play{position:absolute;right:18px;top:18px;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--accent);color:var(--ink)}
.mbs-tilex__play .mbs-icon{width:20px;height:20px;margin-left:3px}
.mbs-tilex--event{background:var(--accent)}
.mbs-tilex--event .mbs-tilex__text{color:var(--ink)}
.mbs-tilex__date{display:grid;margin-top:6px}
.mbs-tilex__date b{font:600 64px/.9 var(--font-display);letter-spacing:-.04em}
.mbs-tilex__date small{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.mbs-tilex--event .mbs-tilex__title{margin-top:auto;font-size:22px}
.mbs-tilex--club{background:#F1ECE2}
.mbs-tilex__env{position:absolute;right:16px;top:14px;display:grid;place-items:center;width:58px;height:58px;rotate:8deg;border:1px solid var(--ink);border-radius:10px;background:#fff}
.mbs-tilex__env .mbs-icon{width:26px;height:26px}

/* ═════════════ 4 · Dos libros ═════════════ */
.mbs-duo{display:grid;gap:14px}
@media (min-width:960px){.mbs-duo{grid-template-columns:1fr 1fr}}
.mbs-duo__book{position:relative;display:grid;overflow:hidden;border-radius:var(--r-l)}
.mbs-duo__media{display:grid;place-items:center;padding:36px 20% 8px}
.mbs-duo__media .mbs-img{display:block;width:100%;height:auto;max-width:240px;filter:drop-shadow(0 24px 30px rgba(0,0,0,.28));transition:transform 500ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){.mbs-duo__book:hover .mbs-duo__media .mbs-img{transform:translateY(-6px) rotate(-1.5deg)}}
.mbs-duo__body{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:22px 24px 28px}
.mbs-duo__meta{font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.mbs-duo__title{font-size:clamp(34px,8vw,48px);line-height:1;letter-spacing:-.03em}
.mbs-duo__title a{text-decoration:none;color:inherit}
.mbs-duo__text{max-width:46ch;font-size:15.5px;line-height:1.6}
.mbs-duo .mbs-price{font-size:22px;color:inherit}
.mbs-duo .mbs-price small{display:block;margin-top:2px;font-size:12.5px;font-weight:400;opacity:.7}
.mbs-duo__actions{display:flex;flex-wrap:wrap;gap:10px;width:100%}
.mbs-duo__actions .mbs-btn{flex:1 1 150px}
.mbs-duo__alt{display:inline-flex;align-items:center;gap:6px;margin-top:2px;font-size:13.5px;text-decoration:underline;text-underline-offset:3px;color:inherit;opacity:.8}
.mbs-duo__alt .mbs-icon{width:14px;height:14px}
.mbs-duo__seal{display:inline-flex;align-items:center;gap:8px;margin-top:4px;font-size:13px;font-weight:500}
.mbs-duo__seal .mbs-icon{width:22px;height:22px}
.mbs-duo__seal .mbs-seal--inline{width:40px}
/* noche */
.mbs-duo__book--d{background:radial-gradient(130% 90% at 50% 0%,#24222d 0%,#0D0C11 60%);color:#E7E1D5}
.mbs-duo__book--d .mbs-duo__text{color:#C9C1B3}
.mbs-duo__book--d .mbs-price del{color:#8d867b}
.mbs-duo__book--d :focus-visible{outline-color:#E7E1D5}
/* día */
.mbs-duo__book--j{background:radial-gradient(130% 90% at 50% 0%,#FFF6CF 0%,#F4EBD6 65%);color:var(--ink)}
.mbs-duo__book--j .mbs-duo__text{color:var(--ink-2)}
@media (min-width:960px){
  .mbs-duo__media{padding:48px 22% 8px}
  .mbs-duo__body{padding:24px 36px 36px}
  .mbs-duo__actions .mbs-btn{flex:none}
}

/* ═════════════ 5 · Opiniones (carrusel) ═════════════ */
.mbs-hq .mbs-sec-head{align-items:center}
.mbs-hq__nav{display:none;gap:4px}
@media (min-width:760px){.mbs-hq__nav{display:flex}}
.mbs-hq__nav .mbs-iconbtn{border:1px solid var(--line-2);background:#fff}
.mbs-rail{display:grid;grid-auto-flow:column;grid-auto-columns:min(82vw,360px);gap:12px;padding:4px max(var(--gutter),calc((100vw - 1160px)/2 + var(--gutter))) 8px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:max(var(--gutter),calc((100vw - 1160px)/2 + var(--gutter)));scrollbar-width:none;overscroll-behavior-x:contain}
.mbs-rail::-webkit-scrollbar{display:none}
.mbs-rail:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.mbs-rail .mbs-quote{scroll-snap-align:start}

/* ═════════════ 6 · Novedades ═════════════ */
.mbs-hn{display:grid;gap:28px}
@media (min-width:1000px){
  .mbs-hn{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:40px;align-items:start}
  .mbs-hn .mbs-nc--feature .mbs-nc__link{display:flex;flex-direction:column;align-items:stretch;gap:14px}
}
.mbs-hn__list{display:grid;gap:18px}
.mbs-hn__list .mbs-nc+.mbs-nc{padding-top:18px;border-top:1px solid var(--line)}

/* ═════════════ 8 · Sobre Max ═════════════ */
.mbs-hab{display:grid;gap:24px;align-items:center;padding:20px;border-radius:var(--r-l);background:var(--surface)}
.mbs-hab__photo{margin:0}
.mbs-hab__photo img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border:1px solid #000;border-radius:var(--r-m)}
.mbs-hab__copy{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.mbs-hab__title{font-size:clamp(30px,7vw,44px);letter-spacing:-.025em}
.mbs-hab__text{max-width:58ch;font-size:17px;line-height:1.6;color:var(--ink-2)}
.mbs-hab__links{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 8px}
.mbs-hab__links .mbs-icon{width:14px;height:14px}
@media (min-width:860px){.mbs-hab{grid-template-columns:300px minmax(0,1fr);gap:44px;padding:28px}}

/* ═════════════ 9 · Preguntas ═════════════ */
.mbs-hf{display:grid;gap:18px}
.mbs-hf__head{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.mbs-hf__head h2{font-size:clamp(28px,6vw,40px);letter-spacing:-.025em}
@media (min-width:900px){.mbs-hf{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:56px}.mbs-hf__head{position:sticky;top:96px;align-self:start}}

/* Logo de Improvisados en la tarjeta */
.mbs-tilex__logo{display:flex;align-items:center;margin-top:auto;padding:10px 14px;border-radius:12px;background:#fff}
.mbs-tilex__logo img{display:block;max-width:180px;max-height:54px;width:auto;height:auto}

/* Ficha de datos (Sobre Max) */
.mbs-facts-dl{display:grid;gap:0;width:100%;max-width:620px;margin:4px 0 6px;border-top:1px solid var(--line-2)}
.mbs-facts-dl>div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1px solid var(--line-2);font-size:14.5px}
.mbs-facts-dl dt{font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);padding-top:2px}
.mbs-facts-dl dd{margin:0;color:var(--ink)}
.mbs-facts-dl a{color:inherit;text-underline-offset:3px}
