/* Catálogo Master. Los colores se ajustan por sitio con las variables --mm-*. */
:root {
	--mm-accent: #ee2f37;
	--mm-accent-dark: #c81e26;
	--mm-ink: #111111;
	--mm-muted: #5f6368;
	--mm-line: #e2e2e2;
	--mm-soft: #f4f4f4;
	--mm-wa: #1fa855;
	--mm-radius: 4px;
}

.mm-container { width: 90%; max-width: 1240px; margin: 0 auto; }

/* Botones */
.mm-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	padding: .8em 1.4em; border-radius: var(--mm-radius); border: 2px solid transparent;
	font-weight: 700; font-size: 15px; line-height: 1.2; text-transform: uppercase; letter-spacing: .02em;
	text-decoration: none !important; cursor: pointer; transition: background-color .15s, color .15s, border-color .15s;
}
.mm-btn--wa { background: var(--mm-accent); color: #fff !important; }
.mm-btn--wa::before {
	content: ""; width: 1.15em; height: 1.15em; flex: none; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C9 3 3.3 8.7 3.3 15.7c0 2.3.6 4.5 1.7 6.4L3.2 29l7.1-1.9a12.7 12.7 0 0 0 5.7 1.4C23 28.5 28.8 22.8 28.8 15.7S23.1 3 16 3zm5.9 15.4c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2-.2.3-.8 1-1 1.3-.2.2-.4.2-.7.1-.3-.2-1.4-.5-2.6-1.6-.9-.9-1.6-1.9-1.8-2.2-.2-.3 0-.5.1-.7l.5-.6c.2-.2.2-.3.3-.5.1-.2.1-.4 0-.6l-1-2.4c-.3-.6-.5-.5-.7-.6h-.6c-.2 0-.6.1-.9.4-.3.3-1.1 1.1-1.1 2.7s1.1 3.1 1.3 3.3c.2.2 2.3 3.4 5.5 4.8 2.7 1.1 3.2.9 3.8.8.6-.1 1.9-.8 2.2-1.5.3-.8.3-1.4.2-1.5-.1-.1-.3-.2-.6-.4z'/%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C9 3 3.3 8.7 3.3 15.7c0 2.3.6 4.5 1.7 6.4L3.2 29l7.1-1.9a12.7 12.7 0 0 0 5.7 1.4C23 28.5 28.8 22.8 28.8 15.7S23.1 3 16 3zm5.9 15.4c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2-.2.3-.8 1-1 1.3-.2.2-.4.2-.7.1-.3-.2-1.4-.5-2.6-1.6-.9-.9-1.6-1.9-1.8-2.2-.2-.3 0-.5.1-.7l.5-.6c.2-.2.2-.3.3-.5.1-.2.1-.4 0-.6l-1-2.4c-.3-.6-.5-.5-.7-.6h-.6c-.2 0-.6.1-.9.4-.3.3-1.1 1.1-1.1 2.7s1.1 3.1 1.3 3.3c.2.2 2.3 3.4 5.5 4.8 2.7 1.1 3.2.9 3.8.8.6-.1 1.9-.8 2.2-1.5.3-.8.3-1.4.2-1.5-.1-.1-.3-.2-.6-.4z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.mm-btn--wa:hover { background: var(--mm-accent-dark); }
.mm-btn--ghost { background: transparent; color: var(--mm-ink) !important; border-color: var(--mm-ink); }
.mm-btn--ghost:hover { background: var(--mm-ink); color: #fff !important; }
.mm-btn--block { display: flex; width: 100%; font-size: 16px; padding: 1em 1.4em; }

/* Catálogo: buscador y filtros a la izquierda, tarjetas a la derecha */
.mm-cat { display: block; color: var(--mm-ink); }
.mm-cat--filtros { display: grid; grid-template-columns: 250px 1fr; gap: 32px; align-items: start; }
.mm-cat__side { position: sticky; top: 24px; }
.mm-cat__search input {
	width: 100%; box-sizing: border-box; padding: 12px 14px; font-size: 15px;
	border: 1px solid #cfcfcf; border-radius: var(--mm-radius); background: #fff; color: var(--mm-ink);
}
.mm-cat__search input:focus { outline: 2px solid var(--mm-accent); outline-offset: 1px; }
.mm-cat__facet { border: 0; margin: 22px 0 0; padding: 0; }
.mm-cat__facet legend {
	font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 8px; padding: 0;
}
.mm-chip { display: inline-block; margin: 0 6px 6px 0; cursor: pointer; }
.mm-chip input { position: absolute; opacity: 0; pointer-events: none; }
.mm-chip span {
	display: inline-block; padding: 6px 12px; border: 1px solid #cfcfcf; border-radius: 999px;
	font-size: 14px; background: #fff; transition: all .15s;
}
.mm-chip small { color: var(--mm-muted); font-size: 12px; }
.mm-chip input:checked + span { background: var(--mm-ink); border-color: var(--mm-ink); color: #fff; }
.mm-chip input:checked + span small { color: #ddd; }
.mm-chip input:focus-visible + span { outline: 2px solid var(--mm-accent); outline-offset: 2px; }
.mm-cat__count { margin-top: 16px; font-size: 14px; color: var(--mm-muted); }

.mm-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.mm-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mm-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mm-card {
	display: flex; flex-direction: column; background: #fff; border: 1px solid var(--mm-line);
	border-radius: 6px; overflow: hidden; box-shadow: 0 2px 10px rgba(0,0,0,.05); transition: box-shadow .2s, transform .2s;
}
.mm-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.12); transform: translateY(-2px); }
.mm-card[hidden] { display: none; }
.mm-card__img { display: block; aspect-ratio: 4 / 3; background: var(--mm-soft); }
.mm-card__img img { width: 100%; height: 100%; object-fit: contain; display: block; }
.mm-card__body { display: flex; flex-direction: column; flex: 1; padding: 16px 18px 18px; }
.mm-card__title { font-size: 18px !important; line-height: 1.3 !important; font-weight: 700; margin: 0 0 6px !important; padding: 0 !important; }
.mm-card__title a { color: var(--mm-ink) !important; text-decoration: none; }
.mm-card__title a:hover { color: var(--mm-accent) !important; }
.mm-card__meta { font-size: 14px; color: var(--mm-muted); margin: 0 0 14px !important; padding: 0 !important; }
.mm-card__actions { margin-top: auto; display: grid; gap: 8px; }
.mm-card__actions .mm-btn { font-size: 14px; padding: .75em 1em; }
.mm-noresults { grid-column: 1 / -1; padding: 24px; background: var(--mm-soft); border-radius: 6px; text-align: center; }
.mm-noresults button { background: none; border: 0; color: var(--mm-accent); text-decoration: underline; cursor: pointer; font: inherit; }
.mm-empty { padding: 24px; background: var(--mm-soft); text-align: center; }

/* Ficha */
.mm-ficha-wrap { padding: 32px 0 64px; background: #fff; color: var(--mm-ink); }
.mm-breadcrumb { font-size: 14px; color: var(--mm-muted); margin-bottom: 20px; display: flex; flex-wrap: wrap; gap: 8px; }
.mm-breadcrumb a { color: var(--mm-accent); text-decoration: none; }
.mm-ficha {
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: start;
	padding: 32px; border: 1px solid var(--mm-line); border-left: 8px solid var(--mm-ink); border-radius: 8px;
	box-shadow: 0 4px 18px rgba(0,0,0,.06);
}
.mm-ficha__main { background: var(--mm-soft); border-radius: 6px; overflow: hidden; }
.mm-ficha__main img { width: 100%; height: auto; max-height: 560px; object-fit: contain; display: block; }
.mm-ficha__thumbs { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.mm-ficha__thumbs button { padding: 0; border: 1px solid var(--mm-line); background: #fff; cursor: pointer; width: 72px; height: 72px; }
.mm-ficha__thumbs img { width: 100%; height: 100%; object-fit: cover; }
.mm-badge {
	display: inline-block; background: var(--mm-ink); color: #fff; font-weight: 700; font-size: 14px;
	padding: 6px 14px; border-radius: 999px; margin: 0 0 14px !important;
}
.mm-ficha__title { font-size: 32px !important; line-height: 1.2 !important; font-weight: 800; margin: 0 0 12px !important; padding: 0 !important; color: var(--mm-ink); }
.mm-ficha__lead p { font-size: 17px; line-height: 1.55; color: #333; padding-bottom: .6em; }
.mm-specs { width: 100%; border-collapse: collapse; margin: 18px 0 22px; font-size: 16px; border: 1px solid #d0d0d0 !important; }
.mm-specs th, .mm-specs td { border: 1px solid #d0d0d0 !important; padding: 11px 14px !important; text-align: left; vertical-align: top; }
.mm-specs th { width: 42%; color: var(--mm-muted); font-weight: 500; background: #fafafa; }
.mm-ficha__note { font-size: 14px; color: var(--mm-muted); margin-top: 10px !important; }
.mm-ficha__back { margin-top: 18px !important; font-size: 15px; }
.mm-ficha__back a { color: var(--mm-ink); font-weight: 600; }
.mm-ficha__desc { margin-top: 40px; padding: 32px; background: #eeeeee; border-left: 8px solid var(--mm-ink); border-radius: 8px; }
.mm-ficha__desc h2, .mm-ficha__related h2 { font-size: 22px !important; font-weight: 700; margin: 0 0 14px !important; }
.mm-ficha__desc p { font-size: 16px; line-height: 1.65; }
.mm-ficha__related { margin-top: 48px; }

/* Botón flotante de WhatsApp */
.mm-wa-float {
	position: fixed; right: 22px; bottom: 22px; z-index: 9999; width: 58px; height: 58px; border-radius: 50%;
	background: #25d366; color: #fff !important; display: flex; align-items: center; justify-content: center;
	box-shadow: 0 6px 18px rgba(0,0,0,.25); transition: transform .15s;
}
.mm-wa-float:hover { transform: scale(1.07); }

@media (max-width: 980px) {
	.mm-cat--filtros { grid-template-columns: 1fr; gap: 20px; }
	.mm-cat__side { position: static; }
	.mm-grid, .mm-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mm-ficha { grid-template-columns: 1fr; gap: 24px; padding: 20px; }
}
@media (max-width: 600px) {
	.mm-grid, .mm-grid--2, .mm-grid--4 { grid-template-columns: 1fr; }
	.mm-ficha__title { font-size: 26px !important; }
	.mm-ficha__desc { padding: 20px; }
	.mm-wa-float { right: 16px; bottom: 16px; width: 52px; height: 52px; }
}

/* Tarjeta con el estilo del sitio anterior (estilo="original") */
.mm-grid--original { gap: 20px; }
.mm-card--original { background: #ededed; border: 0; border-radius: 0; box-shadow: 0 2px 6px rgba(0,0,0,.18); }
.mm-card--original:hover { transform: none; box-shadow: 0 4px 12px rgba(0,0,0,.22); }
.mm-card--original .mm-card__img { aspect-ratio: auto; height: 231px; background: #ddd; }
.mm-card--original .mm-card__img img { object-fit: cover; }
.mm-card--original .mm-card__body { padding: 15px 10px 24px; }
.mm-card--original .mm-card__title { font-size: 18px !important; font-weight: 400; line-height: 1.17 !important; margin: 0 !important; }
.mm-card--original .mm-card__meta { font-size: 16px; color: #656565; margin: 0 0 10px !important; text-transform: uppercase; }
.mm-card--original .mm-card__actions { display: flex; align-items: center; gap: 10px; }
.mm-btn-orig { display: inline-flex; align-items: center; justify-content: center; width: 165px; height: 42px; background: var(--mm-accent); color: #fff !important; font-weight: 700; font-size: 16px; border-radius: 2px; text-decoration: none !important; transition: background-color .2s; }
.mm-btn-orig:hover { background: #414345; }
.mm-wa-mini { width: 42px; height: 42px; border-radius: 2px; background: #25d366; display: inline-block; position: relative; transition: filter .2s; }
.mm-wa-mini::before { content: ""; position: absolute; inset: 9px; background: #fff;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C9 3 3.3 8.7 3.3 15.7c0 2.3.6 4.5 1.7 6.4L3.2 29l7.1-1.9a12.7 12.7 0 0 0 5.7 1.4C23 28.5 28.8 22.8 28.8 15.7S23.1 3 16 3zm5.9 15.4c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2-.2.3-.8 1-1 1.3-.2.2-.4.2-.7.1-.3-.2-1.4-.5-2.6-1.6-.9-.9-1.6-1.9-1.8-2.2-.2-.3 0-.5.1-.7l.5-.6c.2-.2.2-.3.3-.5.1-.2.1-.4 0-.6l-1-2.4c-.3-.6-.5-.5-.7-.6h-.6c-.2 0-.6.1-.9.4-.3.3-1.1 1.1-1.1 2.7s1.1 3.1 1.3 3.3c.2.2 2.3 3.4 5.5 4.8 2.7 1.1 3.2.9 3.8.8.6-.1 1.9-.8 2.2-1.5.3-.8.3-1.4.2-1.5-.1-.1-.3-.2-.6-.4z'/%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C9 3 3.3 8.7 3.3 15.7c0 2.3.6 4.5 1.7 6.4L3.2 29l7.1-1.9a12.7 12.7 0 0 0 5.7 1.4C23 28.5 28.8 22.8 28.8 15.7S23.1 3 16 3zm5.9 15.4c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2-.2.3-.8 1-1 1.3-.2.2-.4.2-.7.1-.3-.2-1.4-.5-2.6-1.6-.9-.9-1.6-1.9-1.8-2.2-.2-.3 0-.5.1-.7l.5-.6c.2-.2.2-.3.3-.5.1-.2.1-.4 0-.6l-1-2.4c-.3-.6-.5-.5-.7-.6h-.6c-.2 0-.6.1-.9.4-.3.3-1.1 1.1-1.1 2.7s1.1 3.1 1.3 3.3c.2.2 2.3 3.4 5.5 4.8 2.7 1.1 3.2.9 3.8.8.6-.1 1.9-.8 2.2-1.5.3-.8.3-1.4.2-1.5-.1-.1-.3-.2-.6-.4z'/%3E%3C/svg%3E") center/contain no-repeat; }
.mm-wa-mini:hover { filter: brightness(.92); }
@media (max-width: 767px) {
	.mm-grid--original .mm-card__img { height: 327px; }
	.mm-grid--original .mm-card__body { text-align: center; }
	.mm-grid--original .mm-card__actions { justify-content: center; }
}
