/*!
 * Site · piezas compartidas (Sobre mí, Preguntas, Contacto, Justo ayer, Noticias)
 * Va después de shop-base.css: usa sus tokens (--ink, --surface, --accent…), botones, migas y animación .mbs-reveal.
 * Animaciones: transform + opacity, ease-out fuerte, < 300 ms en UI, :hover solo con puntero fino, reduced-motion.
 */

/* ═════════════ Secciones ═════════════ */
.mbs-sec{margin-top:64px}
.mbs-sec.mbs-sec--first{margin-top:32px}
.mbs-sec--tint{padding:52px 0 56px;background:var(--surface)}
@media (min-width:900px){.mbs-sec{margin-top:88px}.mbs-sec--tint{padding:72px 0 76px}}
.mbs-sec-head{flex-wrap:wrap}
.mbs-sec-head__count{font-size:13px;color:var(--ink-3)}
.mbs-site .mbs-footer{margin-top:88px}
.mbs-site:has(.mbs-main>.mbs-band:last-child) .mbs-footer{margin-top:0;border-top:0}

/* Encabezado de página */
.mbs-phead{padding-bottom:8px}
.mbs-phead .mbs-eyebrow{margin-top:28px}
.mbs-phead__title{margin-top:10px;font-size:clamp(34px,8.5vw,60px);line-height:1.02;letter-spacing:-.03em;text-wrap:balance}
.mbs-phead__lead{max-width:58ch;margin-top:14px;font-size:17px;line-height:1.55;color:var(--ink-2);text-wrap:pretty}
.mbs-phead--compact .mbs-phead__title{font-size:clamp(28px,6vw,40px)}
@media (min-width:900px){.mbs-phead .mbs-eyebrow{margin-top:44px}.mbs-phead__lead{font-size:18.5px}}

/* Botones extra */
.mbs-btn--light{background:transparent;border-color:rgba(255,255,255,.35);color:#fff}
@media (hover:hover) and (pointer:fine){.mbs-btn--light:hover{border-color:#fff}}
.mbs-btn--sm{min-height:40px;padding:0 16px;font-size:14px}
.mbs-site-buy{display:contents}

/* Chips */
.mbs-chip{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 14px;border:1px solid var(--line-2);border-radius:999px;background:#fff;color:var(--ink-2);font:500 13px/1 var(--font-body);text-decoration:none;white-space:nowrap;cursor:pointer;transition:border-color 160ms ease,color 160ms ease,background-color 160ms ease,transform 160ms var(--ease-out)}
.mbs-chip .mbs-icon{width:15px;height:15px}
.mbs-chip:active{transform:scale(.96)}
.mbs-chip.is-on,.mbs-chip--solid{background:var(--ink);border-color:var(--ink);color:#fff}
@media (hover:hover) and (pointer:fine){.mbs-chip:not(.is-on):not(.mbs-chip--solid):hover{border-color:var(--ink);color:var(--ink)}}
.mbs-chips{display:flex;flex-wrap:wrap;gap:8px}
.mbs-chips li{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 12px;border-radius:999px;background:var(--surface);font-size:13px;color:var(--ink-2)}
.mbs-chips .mbs-icon{width:15px;height:15px}

/* Tarjetas con ícono */
.mbs-cards{display:grid;gap:12px}
@media (min-width:640px){.mbs-cards--4,.mbs-cards--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.mbs-cards--4{grid-template-columns:repeat(4,minmax(0,1fr))}.mbs-cards--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mbs-card-i{display:flex;flex-direction:column;gap:8px;padding:22px;border:1px solid var(--line);border-radius:var(--r-l);background:#fff}
.mbs-card-i__ico{display:grid;place-items:center;width:44px;height:44px;margin-bottom:6px;border-radius:50%;background:var(--accent);color:var(--ink)}
.mbs-card-i__title{font-size:20px}
.mbs-card-i__text{font-size:14.5px;line-height:1.55;color:var(--ink-2)}
.mbs-card-i__more{margin-top:auto;padding-top:6px;font-size:13.5px;font-weight:500;text-decoration:none}

/* ═════════════ Tarjeta de libro ═════════════ */
.mbs-books{display:grid;gap:16px}
@media (min-width:700px){.mbs-books{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.mbs-books:not(.mbs-books--2){grid-template-columns:repeat(3,minmax(0,1fr))}}
.mbs-book{display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r-l);background:#fff;border:1px solid var(--line)}
.mbs-sec--tint .mbs-book{border-color:transparent}
.mbs-book__media{position:relative;display:grid;place-items:center;aspect-ratio:5/4;padding:24px;background:var(--surface);color:var(--ink-3);text-decoration:none;overflow:hidden}
.mbs-sec--tint .mbs-book__media{background:var(--surface-2)}
.mbs-book__media .mbs-img{position:absolute;inset:24px;width:calc(100% - 48px);height:calc(100% - 48px);max-width:none;object-fit:contain;mix-blend-mode:multiply;transition:transform 400ms var(--ease-out)}
.mbs-book__media .mbs-img--art{mix-blend-mode:normal}
.mbs-book__media>.mbs-icon{width:48px;height:48px}
.mbs-book__tag{position:absolute;top:12px;left:12px;padding:6px 11px;border-radius:999px;background:var(--ink);color:#fff;font:600 11.5px/1 var(--font-body);letter-spacing:.03em}
.mbs-book__body{display:flex;flex-direction:column;gap:8px;flex:1;padding:20px 22px 22px}
.mbs-book__title{font-size:28px;letter-spacing:-.02em}
.mbs-book__title a{text-decoration:none}
.mbs-book__text{font-size:15px;line-height:1.55;color:var(--ink-2)}
.mbs-book__buy{display:flex;flex-direction:column;gap:12px;margin-top:auto;padding-top:14px}
.mbs-book__buy .mbs-price{font-size:21px}
.mbs-book__actions{display:flex;flex-wrap:wrap;gap:10px}
.mbs-book__actions .mbs-btn{flex:1 1 150px}
@media (hover:hover) and (pointer:fine){.mbs-book__media:hover .mbs-img{transform:scale(1.03)}}
/* libro solo (cruce de venta / single de noticia): horizontal en desktop */
@media (min-width:860px){
  .mbs-combo .mbs-book,.mbs-post__book .mbs-book{flex-direction:row}
  .mbs-combo .mbs-book__media,.mbs-post__book .mbs-book__media{flex:0 0 42%;aspect-ratio:auto;min-height:340px}
  .mbs-combo .mbs-book__body,.mbs-post__book .mbs-book__body{padding:36px 40px;justify-content:center}
  .mbs-combo .mbs-book__buy,.mbs-post__book .mbs-book__buy{margin-top:12px}
  .mbs-combo .mbs-book__title,.mbs-post__book .mbs-book__title{font-size:36px}
}

/* ═════════════ Tarjeta de noticia ═════════════ */
.mbs-ngrid{display:grid;gap:22px 16px}
@media (min-width:640px){.mbs-ngrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.mbs-ngrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mbs-nc__link{display:flex;flex-direction:column;gap:12px;height:100%;color:inherit;text-decoration:none}
.mbs-nc__media{position:relative;display:grid;place-items:center;aspect-ratio:16/10;overflow:hidden;border-radius:var(--r-m);background:var(--surface);color:var(--ink-3)}
.mbs-nc__media .mbs-icon{width:30px;height:30px}
.mbs-nc__img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform 450ms var(--ease-out)}
.mbs-nc__body{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0}
.mbs-nc__meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:12px;letter-spacing:.02em;color:var(--ink-3)}
.mbs-nc__cat{font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:11px;color:var(--ink)}
.mbs-nc__title{font:500 19px/1.25 var(--font-display);letter-spacing:-.012em;text-wrap:pretty;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.mbs-nc__medium{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;background:var(--surface);font-size:12px;font-weight:500;color:var(--ink-2)}
.mbs-nc__ex{font-size:15px;line-height:1.55;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mbs-nc__link:active .mbs-nc__media{transform:scale(.985);transition:transform 160ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .mbs-nc__link:hover .mbs-nc__img{transform:scale(1.04)}
  .mbs-nc__link:hover .mbs-nc__title{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
}
.mbs-nc--feature .mbs-nc__title{font-size:clamp(24px,5.6vw,34px);line-height:1.12;-webkit-line-clamp:5}
@media (min-width:900px){
  .mbs-nc--feature .mbs-nc__link{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:40px;align-items:center}
  .mbs-nc--feature .mbs-nc__media{aspect-ratio:16/10;border-radius:var(--r-l)}
}
.mbs-nc--row .mbs-nc__link{display:grid;grid-template-columns:96px minmax(0,1fr);gap:14px;align-items:start}
.mbs-nc--row .mbs-nc__media{aspect-ratio:1}
.mbs-nc--row .mbs-nc__title{font-size:16.5px}

/* ═════════════ Banda negra de CTA ═════════════ */
.mbs-band{margin-top:88px;padding:56px 0;background:var(--ink);color:#fff}
.mbs-band__inner{display:grid;gap:24px;align-items:center}
.mbs-band__title{font-size:clamp(28px,6vw,42px);line-height:1.08;letter-spacing:-.025em;text-wrap:balance}
.mbs-band__text{max-width:52ch;margin-top:10px;color:rgba(255,255,255,.72);font-size:16px}
.mbs-band__ctas{display:flex;flex-wrap:wrap;gap:10px}
.mbs-band__ctas .mbs-btn{flex:1 1 180px}
@media (min-width:900px){.mbs-band{padding:76px 0}.mbs-band__inner{grid-template-columns:1fr auto;gap:48px}.mbs-band__ctas .mbs-btn{flex:none}}

/* ═════════════ Redes ═════════════ */
.mbs-socials{display:flex;flex-wrap:wrap;gap:6px}
.mbs-socials a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--line-2);border-radius:50%;color:var(--ink);text-decoration:none;transition:border-color 160ms ease,background-color 160ms ease,transform 160ms var(--ease-out)}
.mbs-socials a span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.mbs-socials a:active{transform:scale(.94)}
@media (hover:hover) and (pointer:fine){.mbs-socials a:hover{border-color:var(--ink);background:var(--surface)}}
.mbs-socials--grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.mbs-socials--grid a{justify-content:flex-start;gap:10px;width:auto;height:44px;padding:0 14px;border-radius:999px;font-size:14px}
.mbs-socials--grid a span{position:static;width:auto;height:auto;clip:auto}

/* Autor (mismos estilos que la caja del single de producto) */
.mbs-author{display:flex;align-items:center;gap:22px;margin-top:56px;padding:22px;border:1px solid var(--line);border-radius:var(--r-l);background:#fff}
.mbs-author__photo{display:block;flex:none;width:84px;height:84px;border:1px solid #000;border-radius:50%;background:var(--surface);overflow:hidden}
.mbs-author__photo img{display:block;width:100%;height:100%;object-fit:cover}
.mbs-author__name{margin:4px 0 8px;font-size:24px}
.mbs-author__bio{max-width:62ch;font-size:15px;line-height:1.55;color:var(--ink-2)}
@media (max-width:599px){.mbs-author{flex-direction:column;align-items:flex-start;gap:16px}}
@media (min-width:900px){.mbs-author{gap:32px;padding:32px 36px}.mbs-author__photo{width:112px;height:112px}.mbs-author__name{font-size:28px}}
.mbs-author--site{margin-top:0}
.mbs-author .mbs-link{display:inline-block;margin-top:10px}

/* Vacío */
.mbs-empty{margin:40px 0;padding:28px;border:1px dashed var(--line-2);border-radius:var(--r-l);text-align:center;color:var(--ink-2)}

/* Paginación (misma que la tienda) */
.mbs-site .mbs-pager{margin-top:40px}
.mbs-site .mbs-pager ul{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.mbs-site .mbs-pager :is(a,span){display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);font-size:14px;text-decoration:none;color:var(--ink)}
.mbs-site .mbs-pager .current{background:var(--ink);border-color:var(--ink);color:#fff}
@media (hover:hover) and (pointer:fine){.mbs-site .mbs-pager a:hover{border-color:var(--ink)}}

@media (prefers-reduced-motion:reduce){
  .mbs-site *{transition-duration:1ms!important}
  .mbs-nc__img,.mbs-book__media .mbs-img{transform:none!important}
}

/* ═════════════ Sello Buen Diseño (imagen real) ═════════════ */
.mbs-seal{display:block;height:auto}
.mbs-seal--sticker{width:118px;rotate:-8deg;filter:drop-shadow(0 12px 22px rgba(0,0,0,.18))}
.mbs-seal--inline{display:inline-block;width:30px;vertical-align:middle}
@media (min-width:900px){.mbs-seal--sticker{width:138px}}