/* ============================================================
   Maison Ponce — Patisserie artesanal · Villa Devoto
   Estetica refinada afrancesada (chocolatier elegante):
     Crema #F5EFE6 (fondo del cuerpo) · Crema calida #EDE4D6 (apoyos)
     Blanco #FFFFFF (cards) · Tinta chocolate #3B2D22 · Gris #857467
     Chocolate #6B4A33 (CTA primario y acentos) · hover #553A28
     Dorado champagne #B0894F (labels uppercase, lineas finas)
     Espresso #2C2018 queda en navbar sobre el hero, velo de imagenes y footer.
   Tipografias: Cormorant Garamond (titulares y carta) · Jost (funcional)
   ============================================================ */

:root {
	--mp-font-titulos: "Cormorant Garamond", Georgia, serif;
	--mp-font-texto: "Jost", "Helvetica Neue", sans-serif;
	--mp-espresso: #2C2018;
	--mp-espresso-2: #3A2A1E;
	--mp-crema: #F5EFE6;
	--mp-crema-2: #EDE4D6;
	--mp-blanco: #FFFFFF;
	--mp-tinta: #3B2D22;
	--mp-gris: #857467;
	--mp-chocolate: #6B4A33;
	--mp-chocolate-hover: #553A28;
	--mp-dorado: #B0894F;
	--mp-dorado-claro: #C9A66B;
	--mp-lino: #F2EBDD;
	--mp-borde: #E0D6C6;
	--mp-borde-2: #D8CCB8;
	--mp-muted-oscuro: #C9B79E;
	--mp-muted-oscuro-2: #A8967E;
}

/* ---------- Tipografia ---------- */

body {
	background-color: var(--mp-crema);
	color: var(--mp-tinta);
	font-family: var(--mp-font-texto);
	font-weight: 400;
}

.bg-light {
	background-color: var(--mp-crema) !important;
}

.divider .text-white, .divider path {
	color: var(--mp-crema) !important;
}

h1, h2, h3, h4, h5, h6,
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
	font-family: var(--mp-font-titulos);
	font-weight: 500;
	letter-spacing: 0.01em;
}

.lead {
	font-family: var(--mp-font-texto);
	font-weight: 300;
}

.navbar-brand img {
	width: 125px;
}

.navbar-stick .navbar-brand img {
	padding: 15px;
}

.logo-menu-mobile {
	width: 116px;
}

@media (max-width: 991.98px) {
	.navbar-brand img {
		padding: 15px 10px 15px 0px !important;
	}
}

/* ---------- Botones (estilo fino: outline dorado, sin relleno marron) ---------- */

.btn-primary,
.btn-outline-primary {
	background: transparent !important;
	border: 1px solid var(--mp-dorado) !important;
	border-radius: 2px;
	color: var(--mp-tinta) !important;
	font-family: var(--mp-font-texto);
	font-size: 13px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0.04em;
	padding: 12px 30px;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
	background: var(--mp-dorado) !important;
	border-color: var(--mp-dorado) !important;
	color: var(--mp-espresso) !important;
}

/* El icono del boton hereda el color del texto (el tema lo dejaba blanco,
   invisible sobre los botones finos). Vale para todos los botones del tenant. */
.btn-primary i,
.btn-outline-primary i,
.boton-cta-menu i,
.swiper-hero a.btn-primary i,
body.carta-body .carta-btn-reservar i,
body.carta-body .carta-btn-agregar i,
body.carta-body .carta-btn-enviar i,
body.carta-body .carta-barra-pedido i {
	color: inherit !important;
}

/* ---------- Inputs ---------- */
.input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3), .input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
	border-radius: 0;
}

/* ---------- Links ---------- */

a {
	color: var(--mp-chocolate);
}

a:hover {
	color: var(--mp-chocolate-hover);
}

/* ---------- Superficies ---------- */

.card {
	background-color: var(--mp-blanco);
	border-color: var(--mp-borde);
}

.bg-gray {
	background-color: var(--mp-crema-2) !important;
}

#divBloqueNewsletter .card {
	background-image: none !important;
	background-color: var(--mp-blanco) !important;
	border: 1px solid var(--mp-borde);
}

#divBloqueNewsletter .card :is(h1, h2, h3, h4),
#divBloqueNewsletter .card .text-white {
	color: var(--mp-tinta) !important;
}

#divBloqueNewsletter .card p {
	color: var(--mp-gris);
}

/* --------------- Navbar (espresso) --------------
   Transparente y superpuesta SOLO en paginas con hero (home).
   En las demas (tienda, ficha, nosotros, contacto) queda solida y legible. */

@media (min-width: 991.98px) {
	body:has(.swiper-hero) header.wrapper.bg-color-secundario {
		background: transparent;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		z-index: 1020;
	}
}

@media (max-width: 991.98px) {
	body:has(.swiper-hero) header.wrapper.bg-color-secundario {
		background: transparent;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		z-index: 1020;
	}

	.swiper-hero .swiper-content {
		padding-top: 72px;
	}
}

body:has(.swiper-hero) .navbar.navbar-bg-color-secundario {
	background: transparent;
}

@media (min-width: 991.98px) {
	#mobileMenu {
		background: transparent;
	}
}

.navbar-stick {
	background: var(--color-secundario) !important;
}

.navbar-unstick .navbar-nav .nav-link {
	color: #ffffff;
}

.navbar.navbar-bg-color-secundario {
	background: transparent;
}

.navbar-unstick + div nav {
	box-shadow: none;
}

@media (max-width: 991.98px) {
	.navbar-dark .navbar-nav .nav-link {
		color: #ffffff;
	}
}

/* Links del navbar con tracking fino editorial */
.navbar-nav .nav-link {
	font-family: var(--mp-font-texto);
	font-size: 0.82rem;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0.05em;
}

/* ---------- Hero (portadas) ---------- */

.swiper-hero-sin-barra, .swiper-hero-sin-barra .swiper-slide {
	height: calc(100vw / 2.12);
}

.swiper-hero .swiper-slide .mp4-video-container {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Velo espresso sobre la imagen del hero para que el texto lino contraste */
.swiper-hero .swiper-slide .mp4-video-container::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(44, 32, 24, 0.42);
	pointer-events: none;
}

.swiper-hero .swiper-content p,
.swiper-hero .swiper-content .lead {
	text-shadow: 0 1px 16px rgba(44, 32, 24, 0.6);
}

.swiper-hero .portada-texto-pequeno {
	font-family: var(--mp-font-texto);
	font-weight: 500;
	font-size: 0.78rem !important;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado-claro);
}

.swiper-hero .portada-texto-grande {
	font-family: var(--mp-font-titulos);
	font-weight: 500;
	font-size: clamp(2.6rem, 5vw, 4.4rem) !important;
	line-height: 1.08;
	max-width: 13em;
}

.swiper-hero .portada-texto-normal {
	font-family: var(--mp-font-texto);
	font-weight: 300;
	font-size: 1.08rem !important;
	line-height: 1.6;
	max-width: 34em;
}

.swiper-hero .rounded-pill {
	border-radius: 2px !important;
}

.swiper-hero a.btn-primary {
	font-family: var(--mp-font-texto);
	font-size: 12px;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.05em;
	padding: 13px 30px;
}

@media (max-width: 991.98px) {
	.swiper-hero-sin-barra, .swiper-hero-sin-barra .swiper-slide {
		height: calc(100vw / 1.6);
	}
}

@media (max-width: 767.98px) {
	.swiper-hero-sin-barra, .swiper-hero-sin-barra .swiper-slide {
		height: calc(100vw / 1.07);
	}
}

@media (max-width: 575.98px) {
	.swiper-hero-sin-barra, .swiper-hero-sin-barra .swiper-slide {
		height: calc(100vw / 0.62);
	}
}

/* Botones del hero (sobre foto/velo oscuro): outline crema fino para todos.
   El !important pisa el color de relleno que trae el componente de portada (pco_color). */
.swiper-hero a.btn-primary {
	background-color: transparent !important;
	border: 1px solid var(--mp-crema) !important;
	color: var(--mp-crema) !important;
}

.swiper-hero a.btn-primary + a.btn-primary {
	margin-left: 12px;
}

.swiper-hero a.btn-primary:hover,
.swiper-hero a.btn-primary:focus,
.swiper-hero a.btn-primary:active {
	background-color: var(--mp-crema) !important;
	color: var(--mp-espresso) !important;
}

/* Slide de portada cuyo UNICO contenido es un boton (sin textos):
   anclar el boton al pie del slide en lugar de centrarlo verticalmente.
   El :not(:has(textos)) deja intactos los slides que combinan texto + boton. */
.swiper-hero .swiper-slide .swiper-content .row > [class*="col-"]:has(.portada-boton-normal):not(:has(.portada-texto-pequeno, .portada-texto-grande, .portada-texto-normal)) {
	position: absolute;
	bottom: 50px;
}

/* ---------- Boton flotante de WhatsApp ---------- */

.btn-whatsapp {
	--color-boton-whatsapp: transparent;
}

.btn-whatsapp a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: linear-gradient(217deg, rgb(85, 217, 96) 9.6%, rgb(32, 176, 56) 82%);
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
}

.btn-whatsapp svg {
	background: none;
}

/* El video/hero no tiene audio: el boton de sonido no va */
.video-unmute-btn {
	display: none !important;
}

/* ---------- Footer: claim de marca ---------- */

.mp-claim {
	display: block;
	font-family: var(--mp-font-titulos);
	font-style: italic;
	font-size: 1.5rem;
	color: var(--mp-lino);
}

.mp-bajada {
	display: block;
	margin-top: 0.5rem;
	font-family: var(--mp-font-texto);
	font-size: 0.7rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado);
}

/* ---------- Footer: estructura de tres columnas ---------- */

footer hr.footer-hr {
	border-top: 1px solid rgba(242, 235, 221, 0.12);
	opacity: 1;
}

footer .footer-desktop > .col-lg-3:has(img.footer-logo) {
	flex: 0 0 100%;
	max-width: 100%;
	display: flex;
	justify-content: center;
}

footer .footer-desktop img.footer-logo {
	margin-bottom: 2rem !important;
}

footer .footer-desktop > .col-auto:has(.puntos-venta-footer) {
	flex: 0 0 100%;
	max-width: 100%;
}

footer .puntos-venta-footer h4.footer-titulo {
	font-family: var(--mp-font-texto);
	font-size: 0.74rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado);
	text-align: center;
	margin-bottom: 2rem !important;
}

footer .footer-desktop .puntos-venta-footer {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	grid-auto-flow: row dense;
	align-items: start;
	column-gap: 3rem;
	row-gap: 0.1rem;
	max-width: 920px;
	margin: 0 auto 2.5rem !important;
	padding-left: 0;
}

footer .footer-desktop .puntos-venta-footer h4.footer-titulo {
	grid-column: 1 / -1;
}

footer .footer-desktop .puntos-venta-footer li:has(a[href*="maps.google"]),
footer .footer-desktop .puntos-venta-footer li:not(:has(a)):not(:has(strong)) {
	grid-column: 1;
}

footer .footer-desktop .puntos-venta-footer li:has(a[href^="tel:"]),
footer .footer-desktop .puntos-venta-footer li:has(a[href^="mailto:"]) {
	grid-column: 2;
}

footer .footer-desktop .puntos-venta-footer li:not(:has(a)):has(strong) {
	grid-column: 3;
}

footer .puntos-venta-footer li {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

footer .puntos-venta-footer li a {
	display: contents;
}

footer .puntos-venta-footer li i.uil {
	position: static !important;
	display: block;
	order: -1;
	color: var(--mp-dorado);
	font-size: 1.75rem !important;
	margin: 0 auto 0.35rem;
}

footer .puntos-venta-footer li i.uil-envelope {
	display: none;
}

footer .puntos-venta-footer li:has(a[href*="maps.google"])::before {
	content: "Donde retirar";
}

footer .puntos-venta-footer li:has(a[href^="tel:"])::before {
	content: "Telefono y pedidos";
}

footer .puntos-venta-footer li:has(i.uil-clock)::before {
	content: "Horarios";
}

footer .puntos-venta-footer li::before {
	font-family: var(--mp-font-texto);
	font-size: 0.72rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-crema);
	margin-bottom: 0.35rem;
}

footer .puntos-venta-footer li span.fs-15 {
	color: var(--mp-muted-oscuro);
	font-size: 0.92rem !important;
	line-height: 1.35;
}

footer .puntos-venta-footer li span.fs-15 strong {
	font-weight: 500;
	color: var(--mp-crema);
}

footer .puntos-venta-footer li a:hover span.fs-15,
footer .puntos-venta-footer li a:hover span.fs-15 strong {
	color: var(--mp-dorado);
}

footer .social.social-white a,
footer .social.social-white a i {
	color: var(--mp-dorado) !important;
}

footer .social.social-white a:hover,
footer .social.social-white a:hover i {
	color: var(--mp-crema) !important;
}

footer .core-devs,
footer .pie-pagina a.core-devs {
	color: var(--mp-muted-oscuro-2);
}

footer .pie-pagina a.core-devs:hover {
	color: var(--mp-crema);
}

@media (max-width: 767.98px) {
	footer .footer-mobile .puntos-venta-footer {
		padding-left: 0;
		margin-bottom: 2rem !important;
	}

	footer .footer-mobile .puntos-venta-footer li {
		margin-bottom: 1.1rem;
	}

	footer .footer-mobile img.footer-logo {
		margin: 0 auto;
		display: block;
	}

	footer .footer-mobile .d-block:has(img.footer-logo) {
		text-align: center;
	}

	footer .footer-mobile .widget {
		text-align: center;
	}

	footer .footer-mobile .widget .social {
		justify-content: center;
	}

	footer .footer-mobile h4.footer-titulo {
		font-family: var(--mp-font-texto);
		font-size: 0.74rem;
		font-weight: 500;
		text-transform: none;
		letter-spacing: 0.06em;
		color: var(--mp-dorado);
	}
}

/* ---------- Boton CTA del menu (compacto) ---------- */

@media (max-width: 991.98px) {
	.boton-cta-menu {
		padding: 6px 12px !important;
		font-size: 11px !important;
		letter-spacing: 0.1em;
	}
}

.boton-cta-menu {
	padding: 9px 20px;
	font-size: 12px;
	background: transparent !important;
	border: 1px solid var(--mp-dorado-claro) !important;
	color: var(--mp-crema) !important;
	letter-spacing: 0.04em;
}

.boton-cta-menu:hover,
.boton-cta-menu:focus,
.boton-cta-menu:active {
	background: var(--mp-dorado-claro) !important;
	border-color: var(--mp-dorado-claro) !important;
	color: var(--mp-espresso) !important;
}

/* ============================================================
   Carta publica (carta.php) — overrides scopeados a body.carta-body.
   carta.css se carga DESPUES de este archivo: por eso todos los
   selectores van prefijados con body.carta-body (mayor especificidad).
   ============================================================ */

body.carta-body {
	--carta-fondo: #F5EFE6;
	--carta-tinta: #3B2D22;
	--carta-tinta-suave: #857467;
	--carta-borde: #E0D6C6;
	--carta-card: #FFFFFF;
	--mp-dorado: #B0894F;
	background: var(--mp-crema);
	font-family: var(--mp-font-texto);
}

body.carta-body .carta-page {
	width: 100%;
}

/* La imagen del hero de la carta la maneja carta.php via --carta-hero-imagen
   (editable desde Restaurante > Carta > Previsualizacion). No se fija aca. */

/* Logo del hero de la carta mas grande (logo real). Se quita el max-width:130px
   de .carta-logo para que el wordmark ancho no quede recortado a 200px de alto. */
body.carta-body .carta-hero .carta-logo {
	height: 200px;
	max-width: none;
}

body.carta-body .carta-hero-label::before {
	content: "Patisserie artesanal · Villa Devoto";
}

body.carta-body .carta-hero-label {
	font-family: var(--mp-font-texto);
	font-weight: 500;
	letter-spacing: 0.06em;
	color: var(--mp-dorado-claro);
}

body.carta-body .carta-hero-titulo {
	font-family: var(--mp-font-titulos);
	color: var(--mp-lino);
}

body.carta-body .carta-hero-titulo::after {
	background: var(--mp-dorado);
}

/* CTA del hero/pie de la carta (sobre espresso): outline crema fino */
body.carta-body .carta-btn-reservar {
	background: transparent;
	border: 1px solid var(--mp-dorado-claro);
	color: var(--mp-crema);
	border-radius: 2px;
	text-transform: none;
	letter-spacing: 0.04em;
	font-size: 12px;
	font-weight: 400;
	padding: 10px 22px;
}

body.carta-body .carta-btn-reservar:active,
body.carta-body .carta-btn-reservar:hover {
	background: var(--mp-dorado-claro);
	border-color: var(--mp-dorado-claro);
	color: var(--mp-espresso);
}

/* ---------- Nav de categorias (tabs editoriales) ---------- */

body.carta-body .carta-nav {
	background: var(--mp-crema);
	border-bottom-color: var(--mp-borde-2);
}

body.carta-body .carta-nav-item {
	background: transparent;
	border: 0;
	border-bottom: 2px solid transparent;
	border-radius: 0;
	color: var(--mp-gris);
	font-family: var(--mp-font-texto);
	text-transform: none;
	letter-spacing: 0.04em;
	font-size: 0.8rem;
}

body.carta-body .carta-nav-item:hover {
	color: var(--mp-tinta);
	border-bottom-color: var(--mp-dorado);
	background: transparent;
}

body.carta-body .carta-nav-item.activa {
	background: transparent;
	border-bottom-color: var(--mp-dorado);
	color: var(--mp-tinta);
}

/* ---------- Secciones ---------- */

body.carta-body .carta-seccion-titulo {
	font-family: var(--mp-font-titulos);
	font-weight: 500;
	color: var(--mp-tinta);
	display: block;
	text-align: center;
}

body.carta-body .carta-seccion-titulo::before {
	content: none;
}

body.carta-body .carta-seccion-titulo::after {
	content: "";
	display: block;
	width: 40px;
	height: 2px;
	margin: 12px auto 0;
	background: var(--mp-dorado);
}

body.carta-body .carta-pagina-subtitulo {
	color: var(--mp-gris);
}

body.carta-body .carta-grupo-titulo {
	font-family: var(--mp-font-titulos);
	font-weight: 500;
	color: var(--mp-tinta);
}

body.carta-body .carta-texto-libre {
	color: var(--mp-gris);
}

/* ---------- Platos (tarjetas blancas) ---------- */

body.carta-body .carta-plato {
	box-shadow: none;
}

body.carta-body .carta-plato-titulo {
	font-family: var(--mp-font-titulos);
	font-weight: 600;
	font-size: 1.32rem;
}

@media (max-width: 575.98px) {
	body.carta-body .carta-plato-titulo {
		font-size: 1.12rem !important;
	}
}

body.carta-body .carta-plato-precio {
	color: var(--mp-tinta);
	font-family: var(--mp-font-texto);
	font-weight: 500;
}

body.carta-body .carta-badge {
	background: transparent;
	border: 1px solid var(--mp-dorado);
	color: var(--mp-gris);
}

body.carta-body .carta-pill-agotado {
	background: transparent;
	border: 1px solid var(--mp-borde-2);
	color: var(--mp-gris);
}

body.carta-body .carta-btn-agregar {
	border-radius: 2px;
	font-family: var(--mp-font-texto);
	text-transform: none;
	letter-spacing: 0.04em;
	font-size: 12px;
	font-weight: 400;
	border-width: 1px;
	background: transparent;
	border-color: var(--mp-dorado);
	color: var(--mp-tinta);
}

body.carta-body .carta-btn-agregar:active,
body.carta-body .carta-btn-agregar:hover {
	background: var(--mp-dorado);
	border-color: var(--mp-dorado);
	color: var(--mp-espresso);
}

/* ---------- Sheets / pedido ---------- */

body.carta-body .carta-sheet-encabezado h3 {
	font-family: var(--mp-font-titulos);
	font-weight: 600;
}

body.carta-body .carta-variante-precio,
body.carta-body .carta-pedido-item-precio,
body.carta-body .carta-pedido-total,
body.carta-body .carta-cuenta-item-total {
	font-family: var(--mp-font-texto);
	font-weight: 500;
}

body.carta-body .carta-barra-pedido,
body.carta-body .carta-btn-enviar {
	border-radius: 2px;
	background: var(--mp-dorado);
	color: var(--mp-espresso);
}

body.carta-body .carta-btn-enviar:hover {
	background: var(--mp-dorado-claro);
}

body.carta-body .carta-barra-cuenta {
	border-radius: 2px;
}

/* ---------- Carta vacia y pie ---------- */

body.carta-body .carta-vacia .material-symbols-rounded {
	color: var(--mp-borde-2);
}

body.carta-body .carta-vacia h2 {
	font-family: var(--mp-font-titulos);
	font-weight: 500;
	color: var(--mp-tinta);
}

body.carta-body .carta-vacia p {
	color: var(--mp-gris);
}

body.carta-body .carta-pie p {
	color: var(--mp-dorado);
	letter-spacing: 0.06em;
}

/* ============================================================
   Home editorial — bloques (#divBloque...). Labels dorados
   uppercase, titulos serif en tinta, acento chocolate.
   ============================================================ */

/* Kicker dorado + titulo serif para los bloques de tienda predefinidos */
#divBloqueCategorias h2,
#divBloqueDestacados h2,
#divBloqueNovedades h2 {
	display: block;
	text-align: center;
	color: var(--mp-tinta);
}

#divBloqueCategorias h2::before,
#divBloqueDestacados h2::before,
#divBloqueNovedades h2::before {
	display: block;
	font-family: var(--mp-font-texto);
	font-size: 0.74rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado);
	margin-bottom: 0.9rem;
}

#divBloqueCategorias h2::before { content: "Maison Ponce"; }
#divBloqueDestacados h2::before { content: "Los favoritos"; }
#divBloqueNovedades h2::before { content: "Recien sumados"; }

#divBloqueCategorias h2::after,
#divBloqueDestacados h2::after,
#divBloqueNovedades h2::after {
	content: "";
	display: block;
	width: 42px;
	height: 2px;
	margin: 14px auto 0;
	background: var(--mp-dorado);
}

/* Categorias estilo avip: el nombre va superpuesto DENTRO de la imagen.
   La tarjeta (slide/item) en relative para anclar el h4 absoluto a cada imagen. */
#divBloqueCategorias .project.item,
#divBloqueCategorias .swiper-slide,
#divBloqueCategorias .project.item figure,
#divBloqueCategorias .swiper-slide figure {
	position: relative;
}

#divBloqueCategorias figure.card-img-top {
	overflow: hidden;
}

#divBloqueCategorias figure.card-img-top::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(44, 32, 24, 0.78), rgba(44, 32, 24, 0) 58%);
	pointer-events: none;
	z-index: 1;
}

/* Nombre de la categoria dentro del recuadro, al pie, mismo tamano que tenia
   debajo (fs-22). Pointer-events none: el click pasa al enlace de la imagen. */
#divBloqueCategorias .titulo-categoria {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 10;
	margin: 0 !important;
	padding: 0.9rem 0.75rem;
	color: #ffffff !important;
	pointer-events: none;
}

#divBloqueCategorias h4,
#divBloqueCategorias h4 a {
	color: #ffffff !important;
}

/* ---------- Nuestra carta (modelo 3) ---------- */

#divBloqueNuestraCarta {
	padding-top: 5rem !important;
	padding-bottom: 5rem !important;
}

#divBloqueNuestraCarta h3.display-5 {
	font-size: clamp(2rem, 3.2vw, 2.75rem);
	color: var(--mp-tinta);
	margin-bottom: 1rem;
}

#divBloqueNuestraCarta h3.display-5::before {
	content: "Nuestra carta";
	display: block;
	font-family: var(--mp-font-texto);
	font-size: 0.74rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado);
	margin-bottom: 0.9rem;
}

#divBloqueNuestraCarta p {
	color: var(--mp-gris);
	font-size: 1.02rem;
	line-height: 1.65;
	max-width: 30em;
}

#divBloqueNuestraCarta figure {
	position: relative;
	z-index: 1;
	border-radius: 0 !important;
}

/* En mobile el texto va primero que la imagen */
@media (max-width: 767.98px) {
	#divBloqueNuestraCarta .row > [class*="col-"]:first-child,
	#divBloqueElAtelier .row > [class*="col-"]:first-child {
		order: 2;
	}
}

/* ---------- Banda CTA full-bleed (modelo 9) ---------- */

#divBloqueBanda {
	padding-top: 4rem !important;
	padding-bottom: 4rem;
	background: url("../../../img/maisonponce/bloques/banda-artesanal.jpg?v=2") no-repeat center center !important;
	background-size: cover !important;
	background-attachment: fixed !important;
	position: relative;
	z-index: 0;
}

#divBloqueBanda::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(44, 32, 24, 0.62);
	pointer-events: none;
	z-index: 0;
}

@media (max-width: 991.98px) {
	#divBloqueBanda {
		background-attachment: scroll !important;
	}
}

#divBloqueBanda .componente-content {
	padding: 0 !important;
	position: relative;
	min-height: clamp(360px, 28vw, 420px);
	z-index: 1;
}

#divBloqueBanda figure {
	display: none;
}

#divBloqueBanda .contenido-bloque {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	pointer-events: none;
	padding: 0 1.5rem;
}

#divBloqueBanda .contenido-bloque h4.display-6 {
	font-family: var(--mp-font-titulos);
	font-size: clamp(1.8rem, 3vw, 2.7rem);
	font-weight: 500;
	color: var(--mp-crema);
	text-align: center;
	max-width: 16em;
	margin: 0 auto;
	text-shadow: 0 2px 18px rgba(44, 32, 24, 0.7);
}

#divBloqueBanda .contenido-bloque h4.display-6::before {
	content: "Maison Ponce · Villa Devoto";
	display: block;
	font-family: var(--mp-font-texto);
	font-size: 0.74rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado-claro);
	margin-bottom: 0.9rem;
	text-shadow: none;
}

#divBloqueBanda .contenido-bloque h5.display-7 {
	font-family: var(--mp-font-texto);
	font-size: 1rem;
	font-weight: 300;
	line-height: 1.55;
	color: rgba(245, 239, 230, 0.88);
	text-align: center;
	max-width: 40em;
	margin: 0.9rem auto 0;
	text-shadow: 0 1px 12px rgba(44, 32, 24, 0.65);
}

#divBloqueBanda .contenido-bloque a.btn-primary {
	pointer-events: auto;
	margin-top: 1.6rem !important;
}

/* ---------- El atelier (modelo 3, alternancia) ---------- */

section.wrapper + section.wrapper#divBloqueElAtelier {
	padding-top: 3rem !important;
}

#divBloqueElAtelier h3.display-4 {
	color: var(--mp-tinta);
	margin-bottom: 3.5rem !important;
}

#divBloqueElAtelier h3.display-4::before {
	content: "Villa Devoto · Hecho a mano";
	display: block;
	font-family: var(--mp-font-texto);
	font-size: 0.74rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado);
	margin-bottom: 0.9rem;
}

#divBloqueElAtelier h3.display-5 {
	font-size: clamp(1.55rem, 2.4vw, 2.1rem);
	line-height: 1.25;
	color: var(--mp-tinta);
}

#divBloqueElAtelier p {
	color: var(--mp-gris);
	font-size: 1.02rem;
	line-height: 1.65;
	max-width: 30em;
}

#divBloqueElAtelier figure {
	position: relative;
	z-index: 1;
}

#divBloqueElAtelier figure img {
	width: 100%;
	aspect-ratio: 5 / 4;
	object-fit: cover;
}

/* ---------- Testimonios ---------- */

#divBloqueTestimonios .container {
	padding-top: 4rem !important;
}

#divBloqueTestimonios h2.display-4 {
	display: block;
	color: var(--mp-tinta);
}

#divBloqueTestimonios h2.display-4::before {
	content: "Quienes ya probaron";
	display: block;
	font-family: var(--mp-font-texto);
	font-size: 0.74rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado);
	margin-bottom: 0.9rem;
}

#divBloqueTestimonios .card {
	border: 1px solid var(--mp-borde);
	box-shadow: none;
}

#divBloqueTestimonios .testimonio-calificacion i {
	color: var(--mp-dorado) !important;
}

#divBloqueTestimonios .card-body p {
	font-family: var(--mp-font-titulos);
	font-style: italic;
	font-size: 1.12rem;
	line-height: 1.5;
	color: var(--mp-tinta) !important;
}

#divBloqueTestimonios .card-body h6 {
	font-family: var(--mp-font-texto);
	color: var(--mp-tinta) !important;
}

#divBloqueTestimonios .card-body small {
	color: var(--mp-gris) !important;
}

/* ---------- Donde estamos ---------- */

#divBloqueDondeEstamos .container {
	padding-bottom: 4rem !important;
}

#divBloqueDondeEstamos h2.display-4 {
	display: block;
	color: var(--mp-tinta);
}

#divBloqueDondeEstamos h2.display-4::before {
	content: "Retiro y envios";
	display: block;
	font-family: var(--mp-font-texto);
	font-size: 0.74rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado);
	margin-bottom: 0.9rem;
}

#divBloqueDondeEstamos .accordion-item {
	border: 1px solid var(--mp-borde);
}

#divBloqueDondeEstamos .card-header button {
	font-family: var(--mp-font-titulos);
	font-size: 1.25rem;
	font-weight: 500;
	color: var(--mp-tinta);
}

#divBloqueDondeEstamos .icon-list i {
	color: var(--mp-dorado);
}

#divBloqueDondeEstamos .icon-list span,
#divBloqueDondeEstamos .icon-list a:not(.btn) {
	color: var(--mp-tinta);
}

#divBloqueDondeEstamos .icon-list a:not(.btn):hover {
	color: var(--color-primario) !important;
}

#divBloqueDondeEstamos .gmap_canvas > a,
#divBloqueDondeEstamos .gmap_canvas script {
	display: none;
}

/* ---------- Newsletter ---------- */

#divBloqueNewsletter .card h3,
#divBloqueNewsletter .card h4 {
	font-family: var(--mp-font-titulos);
	color: var(--mp-tinta);
}

/* ---------- Mapa en el footer ---------- */

.puntos-venta-footer-mapa {
	width: 100%;
	height: 200px;
	margin: 1.25rem 0 1.5rem;
	border-radius: .4rem;
	overflow: hidden;
	filter: grayscale(25%) sepia(6%);
}

.puntos-venta-footer-mapa .gmap_canvas,
.puntos-venta-footer-mapa iframe {
	width: 100% !important;
	height: 100% !important;
	border: 0;
	display: block;
}

/* ============================================================
   Seccion Nosotros — pagina de historia (.mp-nosotros-*).
   ============================================================ */

.img-logo-nosotros, .img-logo-contacto {
	width: 175px;
}

/* Secciones sin video: ocultar el boton de play del hero */
.content-wrapper section.image-wrapper .btn-play {
	display: none !important;
}

/* Hero de secciones con portada: titulo serif grande, subtitulo arriba como label dorado */
.content-wrapper > section.image-wrapper .col-encabezado-seccion {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.content-wrapper > section.image-wrapper .col-encabezado-seccion h3.fs-30 {
	font-family: var(--mp-font-titulos);
	font-size: clamp(2.4rem, 5vw, 3.6rem) !important;
	margin-bottom: 1.4rem !important;
}

.content-wrapper > section.image-wrapper .col-encabezado-seccion h3.fs-25 {
	order: -1;
	font-family: var(--mp-font-texto);
	font-size: 0.78rem !important;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado-claro) !important;
	margin-bottom: 1.2rem !important;
}

.mp-nosotros {
	max-width: 1080px;
	margin: 0 auto;
	padding: 2rem 0 1rem;
}

.mp-nosotros-bloque {
	margin-bottom: 5rem;
	row-gap: 2rem;
}

@media (min-width: 991.98px) {
	.mp-nosotros-bloque > [class*="col-"] {
		padding-left: 2rem;
		padding-right: 2rem;
	}
}

.mp-nosotros-label {
	display: block;
	font-family: var(--mp-font-texto);
	font-size: 0.74rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.06em;
	color: var(--mp-dorado);
	margin-bottom: 0.9rem;
}

.mp-nosotros-titulo {
	font-family: var(--mp-font-titulos);
	font-size: clamp(1.55rem, 2.4vw, 2.1rem);
	line-height: 1.25;
	color: var(--mp-tinta);
	margin-bottom: 1.2rem;
}

.mp-nosotros p {
	color: var(--mp-gris);
	font-size: 1.02rem;
	line-height: 1.65;
	max-width: 30em;
}

.mp-nosotros-foto {
	position: relative;
	z-index: 1;
	margin: 0;
}

.mp-nosotros-foto img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: .4rem;
}

.mp-nosotros-cita {
	text-align: center;
	max-width: 24em;
	margin: 4.5rem auto;
}

.mp-nosotros-cita::before {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	background: var(--mp-dorado);
	margin: 0 auto 1.4rem;
	transform: rotate(45deg);
}

.mp-nosotros-cita p {
	font-family: var(--mp-font-titulos);
	font-style: italic;
	font-size: clamp(1.9rem, 3.4vw, 2.7rem);
	line-height: 1.3;
	color: var(--mp-tinta);
	max-width: none;
	margin: 0;
}

.mp-nosotros-cierre {
	text-align: center;
	padding: 1rem 0 4rem;
}

.mp-nosotros-cierre .mp-nosotros-titulo {
	margin-bottom: 1.8rem;
}

@media (max-width: 991.98px) {
	.mp-nosotros-bloque {
		margin-bottom: 3.5rem;
	}

	.mp-nosotros-cita {
		margin: 3rem auto;
	}
}

/* ============================================================
   Refinamientos (iteracion)
   ============================================================ */

/* ---- CTA: relleno dorado, texto blanco, apenas mas grande ---- */
.btn-primary,
.btn-outline-primary,
.swiper-hero a.btn-primary,
.boton-cta-menu,
body.carta-body .carta-btn-reservar,
body.carta-body .carta-btn-agregar,
body.carta-body .carta-btn-enviar,
body.carta-body .carta-barra-pedido {
	background: var(--mp-dorado) !important;
	border: 1px solid var(--mp-dorado) !important;
	color: #ffffff !important;
	font-size: 14px !important;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active,
.swiper-hero a.btn-primary:hover, .swiper-hero a.btn-primary:focus, .swiper-hero a.btn-primary:active,
.boton-cta-menu:hover, .boton-cta-menu:focus, .boton-cta-menu:active,
body.carta-body .carta-btn-reservar:hover, body.carta-body .carta-btn-reservar:active,
body.carta-body .carta-btn-agregar:hover, body.carta-body .carta-btn-agregar:active,
body.carta-body .carta-btn-enviar:hover,
body.carta-body .carta-barra-pedido:hover {
	background: #9a7740 !important;
	border-color: #9a7740 !important;
	color: #ffffff !important;
}

/* ---- Bloques destacados/novedades: titulo del bloque centrado;
        titulo de producto sin kicker dorado ni linea, alineado a la izquierda ---- */
#divBloqueDestacados .d-flex.justify-content-between:has(> h2.display-4),
#divBloqueNovedades .d-flex.justify-content-between:has(> h2.display-4) {
	flex-direction: column;
	align-items: center;
	gap: 0.4rem;
}

#divBloqueDestacados h2.post-title::before,
#divBloqueDestacados h2.post-title::after,
#divBloqueNovedades h2.post-title::before,
#divBloqueNovedades h2.post-title::after {
	content: none !important;
	display: none !important;
}

#divBloqueDestacados h2.post-title,
#divBloqueNovedades h2.post-title {
	text-align: left !important;
	justify-content: flex-start !important;
}

/* El titulo del producto en Novedades venia en fs-15 (15px) por el tema, casi
   igual que el subtitulo. Se agranda para darle jerarquia editorial. */
#divBloqueNovedades h2.post-title,
#divBloqueNovedades h2.post-title a {
	font-size: 1rem !important;
	line-height: 1.2 !important;
}

/* Vidriera sin ecommerce: en Destacados ocultar el selector de variantes, la
   descripcion y el area de precio/compra (vacia sin carrito). La card queda con
   titulo + subtitulo + categoria. */
#divBloqueDestacados #divAtributos,
#divBloqueNovedades #divAtributos,
#divBloqueDestacados .texto-producto-destacado,
#divBloqueDestacados .d-flex.align-items-center.flex-wrap {
	display: none !important;
}

/* ---- Footer ---- */
.footer-logo {
	width: 200px;
}

/* El telefono del pie es link de WhatsApp (no tel:): asignarlo a la columna
   "Telefono y pedidos" igual que hacia el tel: */
footer .footer-desktop .puntos-venta-footer li:has(a[href*="whatsapp"]),
footer .footer-desktop .puntos-venta-footer li:has(a[href*="wa.me"]) {
	grid-column: 2;
}

footer .puntos-venta-footer li:has(a[href*="whatsapp"])::before,
footer .puntos-venta-footer li:has(a[href*="wa.me"])::before {
	content: "Telefono y pedidos";
}

/* ---- Espaciados pedidos ---- */
#divBloqueFlyers {
	padding-bottom: 3.5rem !important;
}

#divBloqueNuestraCarta {
	padding-bottom: 2rem !important;
}

/* ---- Bloque flyer (galeria mosaico): 3 imagenes en fila, mismo alto, ancho libre ---- */
#divBloqueFlyers .container {
	padding-top: 2.5rem;
	padding-bottom: 2.5rem;
}

#divBloqueFlyers .row.justify-content-center {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: center;
	gap: 1.5rem;
}

#divBloqueFlyers .row.justify-content-center > div {
	width: auto !important;
	max-width: none !important;
	flex: 0 0 auto;
	padding: 0 !important;
	margin: 0 !important;
}

#divBloqueFlyers figure {
	margin: 0;
}

#divBloqueFlyers figure img {
	height: 480px !important;
	width: auto !important;
	max-width: none !important;
	object-fit: contain;
	display: block;
}

@media (max-width: 767.98px) {
	#divBloqueFlyers figure img {
		height: 300px !important;
	}
}

/* ============================================================
   Ritmo vertical uniforme entre bloques de la home (~80px de aire
   entre cada bloque y el de arriba/abajo). Cada bloque de contenido
   aporta 2.5rem arriba y 2.5rem abajo; la franja de beneficios va mas
   ajustada; la banda parallax conserva su alto (su padding es la imagen).
   ============================================================ */
#divBloqueNuestraCarta {
	padding-top: 2.5rem !important;
	padding-bottom: 2.5rem !important;
}

#divBloqueFlyers .container,
#divBloqueCategorias .container,
#divBloqueCategorias .container-sm,
#divBloqueDestacados .container,
#divBloqueDestacados .container-sm,
#divBloqueNovedades .container,
#divBloqueNovedades .container-sm,
#divBloqueTestimonios .container,
#divBloqueDondeEstamos .container {
	padding-top: 2.5rem !important;
	padding-bottom: 2.5rem !important;
}

#divBloqueBanners .container {
	padding-top: 1.25rem !important;
	padding-bottom: 1.25rem !important;
}

/* Ajustes finos para emparejar los outliers de gap:
   - aire arriba de Novedades para separarla de la banda parallax. Va en el
     .container-sm (el tema fuerza padding-top:0 en secciones .wrapper seguidas;
     el aire real lo da el contenedor interno, que en este bloque es .container-sm).
   - los bloques con titulo centrado + "Ver mas" arrastran aire arriba: se recortan */
#divBloqueNovedades .container-sm {
	padding-top: 5rem !important;
}

#divBloqueDestacados .container-sm,
#divBloqueDestacados .container,
#divBloqueDondeEstamos .container {
	padding-top: 1rem !important;
}

/* Flyers: un poco mas de aire para igualar el gap con sus vecinos (~95px) */
#divBloqueFlyers .container {
	padding-top: 3.5rem !important;
	padding-bottom: 3.5rem !important;
}

/* ---- Drawer de carrito / favoritos ---- */
#carritoMenu,
#favoritosMenu {
	width: 20rem;
	background: var(--mp-crema-2) !important;
}

/* ============================================================
   Mobile: ritmo vertical entre bloques de la home. Los espaciados
   globales de arriba estan calibrados para desktop; en telefono el
   aire queda disparejo, asi que se reajusta bloque por bloque.
   Va al final del archivo para pisar las reglas globales (misma
   especificidad, gana la ultima cuando el media query aplica).
   ============================================================ */
@media (max-width: 575.98px) {
	#divBloqueFlyers .container {
		padding-top: 1.5rem !important;
	}

	#divBloqueFlyers {
		padding-bottom: 0.5rem !important;
	}

	#divBloqueNuestraCarta {
		padding-bottom: 0.5rem !important;
	}

	#divBloqueCategorias .container {
		padding-bottom: 0.5rem !important;
	}

	#divBloqueDestacados .swiper-container {
		margin-bottom: 0px !important;
	}

	#divBloqueNovedades .container-sm {
		padding-top: 2.5rem !important;
	}

	#divBloqueTestimonios .container {
		padding-top: 0rem !important;
	}

	#divBloqueDondeEstamos .container {
		padding-top: 0rem !important;
	}
}