


:root {
	--fse-hot:      #e8491d;
	--fse-fire:     #c23a12;
	--fse-ember:    #e8491d;
	--fse-gold:     #e8491d;
	--fse-gold-dim: #c23a12;
	--fse-cream:    #fdf1e5;
	--fse-sand:     #f6dcc4;
	--fse-carbon:   #3a1610;
	--fse-smoke:    #54241a;
	--fse-text:     #3a1610;
	--fse-muted:    #7a5548;
	--fse-border:   rgba(232, 73, 29, 0.32);
	--fse-surface:  #f6dcc4;
	--fse-white:    #fdf1e5;
	--fse-font-display: "Playfair Display", Georgia, serif;
	--fse-font-body:    "Cormorant Garamond", Georgia, serif;

	--pec-vino: #2a0f0a;
	--pec-vino-2: #3a1610;
	--pec-gold: #e8491d;
	--pec-cream: #fbe6d2;
	--pec-cream-2: #fdf1e5;
	--pec-ink: #3a1610;
	--pec-muted: #7a5548;
	--pec-font-script: "Alex Brush", cursive;
}

body.fse-page-shell {
	background: var(--pec-cream);
	color: var(--pec-ink);
	font-family: var(--fse-font-body);
	margin: 0;
}

.pec-display { font-family: "Playfair Display", Georgia, serif; }
.pec-script  { font-family: var(--pec-font-script); color: var(--pec-gold); font-size: 1.4rem; line-height: 1.3; }

.pec-caps, .pec-eyebrow {
	font-family: "Plus Jakarta Sans", sans-serif;
	text-transform: uppercase;
	letter-spacing: .16em;
}
.pec-eyebrow { font-size: .72rem; color: var(--pec-gold); display: block; margin-bottom: 8px; }
.pec-eyebrow--center { text-align: center; }
.pec-caps { font-size: .78rem; color: var(--pec-vino); margin: 0 0 8px; }

.pec-rule {
	display: block;
	width: 56px;
	height: 1px;
	background: var(--pec-gold);
	margin: 18px auto;
}

.pec-btn-outline {
	display: inline-block;
	border: 1px solid var(--pec-gold);
	color: var(--pec-gold);
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: .74rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 12px 26px;
	border-radius: 2px;
	background: rgba(42, 15, 10, .25);
	backdrop-filter: blur(2px);
	transition: background .2s ease, color .2s ease;
}
.pec-btn-outline:hover { background: var(--pec-gold); color: var(--pec-vino); }

/* Botón sólido -- CTA primario ("Haz tu pedido", abre el chat de IA), a
   diferencia de .pec-btn-outline (secundario, "Ver la carta"). Mismo tamaño/
   tipografía, relleno dorado en vez de borde. */
.pec-btn-solid {
	display: inline-block;
	border: 1px solid var(--pec-gold);
	background: var(--pec-gold);
	color: var(--pec-vino);
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: .74rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 12px 26px;
	border-radius: 2px;
	cursor: pointer;
	transition: opacity .2s ease, transform .1s ease;
}
.pec-btn-solid:hover { opacity: .88; }
.pec-btn-solid:active { transform: scale(.98); }

/* ── HERO (home + menú) ──────────────────────────────────────────────────── */
.pec-hero {
	position: relative;
	min-height: 78vh;
	display: flex;
	flex-direction: column;
	background: linear-gradient(180deg, #1d0906 0%, #3a1610 55%, #1d0906 100%);
	background-size: cover;
	background-position: center;
	color: var(--pec-cream-2);
	overflow: hidden;
	padding: 18px 20px;
}
.pec-hero--menu { min-height: 46vh; }
.pec-hero::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(29, 9, 6,.65) 0%, rgba(29, 9, 6,.35) 45%, rgba(29, 9, 6,.75) 100%);
	pointer-events: none;
}
.pec-hero__topbar {
	position: relative; z-index: 1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}
.pec-hero__brand {
	display: inline-flex; align-items: center; gap: 10px;
	min-width: 0;
	text-decoration: none; color: var(--pec-cream-2);
}
.pec-hero__brand-badge {
	flex: 0 0 auto;
	width: 40px; height: 40px; border-radius: 50%;
	background: var(--pec-cream-2);
	display: flex; align-items: center; justify-content: center;
	padding: 6px;
	box-shadow: 0 0 0 1px rgba(232, 73, 29,.4);
}
.pec-hero__brand-badge img { width: 100%; height: 100%; object-fit: contain; }
/* Pedido explícito del usuario: el nombre en el header más grande y con
   tipografía "con estilo" como el logo real (serif alto-contraste), no el
   sans chico de antes. */
.pec-hero__brand-word {
	font-family: "Playfair Display", Georgia, serif;
	font-weight: 700;
	font-size: 1.35rem;
	letter-spacing: .01em;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pec-hero__cta {
	flex: 0 0 auto;
	font-size: .66rem;
	padding: 9px 14px;
	white-space: nowrap;
}
.pec-hero__content {
	position: relative; z-index: 1;
	margin: auto 0 12px;
	text-align: center;
	display: flex; flex-direction: column; align-items: center;
	gap: 6px;
}
.pec-hero__badge {
	width: 92px; height: 92px; border-radius: 50%;
	background: var(--pec-cream-2);
	display: flex; align-items: center; justify-content: center;
	padding: 14px;
	margin-bottom: 10px;
	box-shadow: 0 0 0 1px rgba(232, 73, 29,.4);
}
.pec-hero__badge img { width: 100%; height: 100%; object-fit: contain; }
/* Pedido explícito del usuario: que el título del hero se vea como las
   referencias que mandó -- serif alto-contraste bien destacado, tracking
   generoso entre letras (no apretado). Playfair Display en 600 (no 700/900:
   más peso engrosaba también los hairlines finos, perdía la elegancia de la
   referencia) + letter-spacing marcado. */
.pec-display--xl { font-size: clamp(2.6rem, 12vw, 4.2rem); line-height: 1.05; margin: 4px 0; font-weight: 600; letter-spacing: .02em; }
.pec-hero--menu .pec-display { font-size: clamp(2.2rem, 10vw, 3.4rem); line-height: 1.08; margin: 4px 0; font-weight: 600; letter-spacing: .02em; }
.pec-hero__sub { letter-spacing: .3em; color: var(--pec-gold); font-size: .82rem; margin: 2px 0 14px; }
.pec-hero__lead { font-size: 1rem; letter-spacing: .1em; text-transform: uppercase; margin: 6px 0 18px; }
/* .pec-script hereda uppercase de .pec-hero__lead -- Alex Brush (cursiva) no
   tiene formas de mayúscula pensadas para eso, se ve rota ("para disfrutar"
   -> algo ilegible tipo "PCARA DISFRUTAR"). El script SIEMPRE se ve en
   minúscula, como en la maqueta real. */
.pec-hero__lead .pec-script { text-transform: none; }
.pec-hero__cta-big { margin-top: 6px; }
.pec-hero__ctas { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.pec-hero__ctas .pec-hero__cta-big { margin-top: 0; }


.pec-band { padding: 56px 22px; text-align: center; }
.pec-band--vino { background: var(--pec-vino); color: var(--pec-cream-2); }
.pec-band--vino .pec-display { color: var(--pec-cream-2); }
.pec-band--cream { background: var(--pec-cream); }
.pec-band__title { font-size: clamp(1.6rem, 6vw, 2.2rem); line-height: 1.25; font-weight: 600; }
.pec-band__title--center { text-align: center; }
.pec-band__text { max-width: 640px; margin: 0 auto; color: inherit; opacity: .82; line-height: 1.7; }
.pec-band--vino .pec-band__text { opacity: .78; }
.pec-band__script { margin-top: 22px; }
.pec-band__cta { margin-top: 28px; }

.pec-band--split {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: 24px;
	align-items: start;
	text-align: center;
}
.pec-band--split .pec-rule { margin: 0; height: 100%; width: 1px; }
@media (max-width: 640px) {
	.pec-band--split { grid-template-columns: 1fr; }
	.pec-band--split .pec-rule { width: 56px; height: 1px; margin: 8px auto; }
}

/* ── Favoritos (home) ────────────────────────────────────────────────────── */
.pec-favoritos {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
	max-width: 720px;
	margin: 32px auto 0;
	text-align: left;
}
@media (min-width: 640px) { .pec-favoritos { grid-template-columns: repeat(4, 1fr); } }
.pec-favorito__img-wrap {
	aspect-ratio: 1/1;
	border-radius: 10px;
	overflow: hidden;
	background: var(--pec-cream-2);
	box-shadow: 0 0 0 1px var(--fse-border);
	margin-bottom: 10px;
}
.pec-favorito__img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.pec-favorito__nombre { font-family: "Playfair Display", serif; font-size: 1rem; margin: 0 0 3px; }
.pec-favorito__desc { font-size: .82rem; color: var(--pec-muted); margin: 0 0 6px; line-height: 1.4; }
.pec-favorito__precio { color: var(--pec-gold); font-weight: 700; font-variant-numeric: tabular-nums; }

/* ── Footer ──────────────────────────────────────────────────────────────── */
.pec-footer {
	background: var(--pec-vino);
	color: var(--pec-cream-2);
	text-align: center;
	padding: 48px 22px;
}
.pec-footer__tagline { margin-bottom: 18px; }
.pec-footer__info {
	font-size: .74rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	opacity: .7;
	max-width: 480px;
	margin: 0 auto 26px;
	line-height: 1.8;
}
.pec-footer__word { display: block; font-size: 1.4rem; }
.pec-footer__sub { display: block; letter-spacing: .3em; font-size: .7rem; color: var(--pec-gold); margin-top: 4px; }

/* ── Toolbar del menú: buscador + secciones (todo/comida/bebida) ───────── */
.pec-menu-toolbar {
	position: sticky; top: 0; z-index: 5;
	background: var(--pec-cream);
	padding: 14px 16px 0;
	display: flex; flex-wrap: wrap; gap: 10px;
	align-items: center;
}
.pec-buscar {
	flex: 1 1 160px;
	min-width: 0;
	background: var(--pec-cream-2);
	border: 1px solid var(--fse-border);
	border-radius: 4px;
	padding: 10px 14px;
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: .84rem;
	color: var(--pec-ink);
}
.pec-secciones { display: flex; gap: 8px; flex-wrap: wrap; }
.pec-seccion-tab {
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: .76rem;
	letter-spacing: .1em;
	text-transform: lowercase;
	background: transparent;
	border: none;
	color: var(--pec-muted);
	padding: 10px 14px;
	cursor: pointer;
	border-radius: 4px;
}
.pec-seccion-tab--active { background: var(--pec-vino); color: var(--pec-cream-2); }

/* ── Subcategorías: sidebar del motor → fila de píldoras horizontal ───────
   fse-public.css deja #fse-cat-nav como un riel VERTICAL FIJO (position:
   fixed; left:0; top; bottom; width:84/96px, ver --fse-cat-nav-w) para
   convivir con .fse-products que le reserva ese mismo ancho con
   margin-left. Acá se lo saca del flujo fijo por completo -- position:
   static + reset de todos los ejes que fixed dejaba activos -- y se
   compensa el margin-left que ya no hace falta. */
.pec-page .fse-menu-body { display: block; }
.pec-page .fse-cat-nav {
	position: static;
	top: auto; left: auto; right: auto; bottom: auto;
	z-index: auto;
	flex-direction: row;
	overflow-x: auto;
	overflow-y: visible;
	width: 100%;
	max-width: 720px;
	margin: 0 auto;
	height: auto;
	padding: 14px 16px;
	gap: 10px;
	background: transparent;
	border-right: none;
	box-shadow: none;
}
.pec-page .fse-products {
	margin-left: 0;
	max-width: 720px;
}
.pec-page .fse-cat-tab {
	flex-direction: row;
	flex-shrink: 0;
	width: auto;
	white-space: nowrap;
	background: transparent;
	border: 1px solid var(--fse-border);
	border-radius: 4px;
	padding: 10px 16px;
	color: var(--pec-ink);
}
.pec-page .fse-cat-tab__label {
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: .76rem;
	letter-spacing: .12em;
	text-transform: uppercase;
}
.pec-page .fse-cat-tab__emoji { display: none; }
.pec-page .fse-cat-tab--active {
	background: var(--pec-cream-2);
	border-color: var(--pec-gold);
	color: var(--pec-ink);
}
.pec-page .fse-cat-tab[hidden] { display: none; }

/* Título/subtítulo de categoría que ya arma fse-public.js (reusa
   .fse-section-header si existe; si no, el nombre de categoría activo se
   ve solo reflejado en la píldora -- suficiente, evita duplicar markup). */

/* ── Tarjeta de producto → fila horizontal con miniatura ────────────────── */
.pec-page .fse-product-grid {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 4px 16px 100px;
	max-width: 720px;
	margin: 0 auto;
}
.pec-page .fse-card {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	gap: 14px;
	background: var(--pec-cream-2);
	border: 1px solid var(--fse-border);
	border-radius: 12px;
	box-shadow: none;
	cursor: pointer;
	padding: 10px;
}
.pec-page .fse-card:hover { transform: none; box-shadow: 0 4px 16px rgba(42, 15, 10,.08); }
.pec-page .fse-card__img-wrap {
	flex: 0 0 104px;
	width: 104px; height: 104px;
	aspect-ratio: auto;
	border-radius: 8px;
}
.pec-page .fse-card__body { padding: 2px 4px 2px 0; flex: 1 1 auto; min-width: 0; }
.pec-page .fse-card__cats { display: none; }
.pec-page .fse-card__title {
	font-family: "Playfair Display", serif;
	font-weight: 600;
	font-size: 1.08rem;
	color: var(--pec-ink);
}
.pec-page .fse-card__desc { color: var(--pec-muted); font-size: .86rem; -webkit-line-clamp: 2; margin-bottom: 8px; }
.pec-page .fse-card__price { color: var(--pec-gold); font-size: 1.02rem; }
.pec-page .fse-card__add-btn {
	width: 34px; height: 34px;
	background: var(--pec-vino);
	bottom: 6px; right: 6px; top: auto; left: auto;
}
.pec-page .fse-card__add-btn--fire, .pec-page button.fse-card__add-btn--fire { background: var(--pec-vino); }

/* ── Buscador propio: oculta filas que no matchean (ver pec-public.js) ──── */
.pec-page .fse-card[data-pec-hidden] { display: none; }


.fse-cart-item__precio,
.fse-cart-total__amount {
	color: var(--pec-ink);
}
.fse-cart-item__nombre {
	font-size: 1rem;
}



.pec-page--v2 {
	background: var(--pec-vino);
	color: var(--pec-cream-2);
	font-family: "Plus Jakarta Sans", sans-serif;
}
.pec-page--v2 a { text-decoration: none; }
.pec-btn--lg { padding: 15px 30px !important; font-size: .8rem !important; }
.pec-btn-whatsapp {
	display: inline-flex; align-items: center; justify-content: center; gap: 6px;
	border: none; border-radius: 30px;
	background: #25d366; color: #06210f;
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: .74rem; font-weight: 700;
	letter-spacing: .1em; text-transform: uppercase;
	padding: 12px 26px; cursor: pointer;
	transition: transform .2s ease, opacity .2s ease;
}
.pec-btn-whatsapp:hover { transform: scale(1.03); opacity: .92; }

/* ── Navbar ────────────────────────────────────────────────────────────── */
.pec-navbar {
	position: fixed; inset-block-start: 0; inset-inline: 0; z-index: 60;
	background: transparent;
	transition: background .4s ease, border-color .4s ease;
	border-bottom: 1px solid transparent;
}
.pec-navbar.is-scrolled {
	background: rgba(42, 15, 10, .88);
	backdrop-filter: blur(14px);
	border-bottom-color: rgba(232, 73, 29, .25);
}
.pec-navbar__inner {
	max-width: 1200px; margin: 0 auto;
	display: flex; align-items: center; justify-content: space-between;
	padding: 14px 20px;
}
.pec-navbar__brand {
	display: inline-flex; align-items: center; gap: 8px;
	font-family: "Playfair Display", Georgia, serif;
	font-size: 1.2rem; font-weight: 700;
	color: var(--pec-cream-2);
}
.pec-navbar__brand span:first-child { color: var(--pec-gold); }
.pec-navbar__links { display: none; align-items: center; gap: 26px; }
.pec-navbar__links a:not(.pec-navbar__cta) {
	font-size: .84rem; color: var(--pec-cream-2); opacity: .78;
	transition: opacity .2s ease, color .2s ease;
}
.pec-navbar__links a:not(.pec-navbar__cta):hover { opacity: 1; color: var(--pec-gold); }
.pec-navbar__cta { padding: 9px 18px !important; font-size: .7rem !important; flex-shrink: 0; }
@media (min-width: 1024px) {
	.pec-navbar__links { display: flex; }
}

/* El carrito flotante de FSE (cart-widget.php, compartido por TODO el motor)
   comparte las MISMAS coordenadas bottom-right que el botón del chat de IA
   (.fse-chat-fab) -- se pisaban (reportado 2026-09-28, capturas reales, tanto
   en la home como en la Carta). En vez de tocar fse-public.css (usado por
   todos los sitios de FSE, no solo este), se reubica SOLO acá -- el selector
   de hermanos funciona porque cart-widget.php se incluye DESPUÉS de cerrar
   .pec-page en home.php/menu.php, ambos hijos directos del <body>.
   !important necesario para ganarle al !important de position/bottom/right
   de fse-public.css (misma especificidad, esta hoja carga después).
   Regla general (Carta, sin navbar fija propia -- esquina superior simple)
   PRIMERO, override específico de la home (junto a "Reservar mesa") ABAJO
   -- mismo elemento cumple las dos clases ahí, gana la que está después. */
.pec-page ~ .fse-cart-fab {
	position: fixed !important;
	top: 16px !important;
	bottom: auto !important;
	right: 16px !important;
	width: 44px !important;
	height: 44px !important;
	z-index: 65 !important;
	animation: none !important;
}
.pec-page ~ .fse-cart-fab .fse-cart-fab__icon { width: 19px; height: 19px; }

.pec-page--v2 ~ .fse-cart-fab {
	top: 12px !important;
	right: 152px !important;
	width: 42px !important;
	height: 42px !important;
}
.pec-page--v2 ~ .fse-cart-fab .fse-cart-fab__icon { width: 18px; height: 18px; }
@media (max-width: 480px) {
	.pec-page--v2 ~ .fse-cart-fab { right: 128px !important; width: 36px !important; height: 36px !important; }
	.pec-page--v2 ~ .fse-cart-fab .fse-cart-fab__icon { width: 16px; height: 16px; }
}

/* ── Hero v2 ───────────────────────────────────────────────────────────── */
.pec-hero2 {
	position: relative; min-height: 92vh;
	display: flex; flex-direction: column; justify-content: center;
	background-size: cover; background-position: center;
	overflow: hidden;
}
.pec-hero2__overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(42, 15, 10,.55) 0%, rgba(42, 15, 10,.72) 45%, var(--pec-vino) 100%);
}
.pec-hero2__content {
	position: relative; z-index: 1;
	max-width: 1200px; margin: 0 auto; width: 100%;
	padding: 130px 20px 90px;
}
.pec-hero2__titulo {
	font-family: "Playfair Display", Georgia, serif;
	font-weight: 600; letter-spacing: -.01em;
	font-size: clamp(2.8rem, 11vw, 5.5rem); line-height: .98;
	margin: 16px 0 0; color: var(--pec-cream-2);
}
.pec-hero2__tagline {
	margin: 14px 0 0; color: var(--pec-gold);
	text-transform: uppercase; letter-spacing: .22em; font-size: .95rem;
}
.pec-hero2__lead {
	margin: 16px 0 0; max-width: 560px;
	font-size: 1.05rem; line-height: 1.6; color: rgba(251, 230, 210,.78);
}
.pec-hero2__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }

/* ── QuickBar ──────────────────────────────────────────────────────────── */
.pec-quickbar-wrap { position: relative; z-index: 5; margin-top: -56px; padding: 0 16px; }
.pec-quickbar {
	max-width: 1200px; margin: 0 auto;
	display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px;
	background: rgba(232, 73, 29,.18);
	border: 1px solid rgba(232, 73, 29,.22);
	border-radius: 18px; overflow: hidden;
	box-shadow: 0 22px 45px -25px rgba(0,0,0,.6);
}
.pec-quickbar a {
	background: var(--pec-vino-2);
	display: flex; flex-direction: column; align-items: center; gap: 6px;
	padding: 20px 10px; text-align: center;
	font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
	color: var(--pec-cream-2);
	transition: background .2s ease;
}
.pec-quickbar a span { font-size: 1.3rem; }
.pec-quickbar a:hover { background: rgba(232, 73, 29,.14); }
@media (min-width: 600px) { .pec-quickbar { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .pec-quickbar { grid-template-columns: repeat(5, 1fr); } }

/* ── Secciones genéricas ───────────────────────────────────────────────── */
.pec-section { padding: 78px 16px; }
.pec-section--navy { background: rgba(255,255,255,.02); }
.pec-section__inner { max-width: 1200px; margin: 0 auto; }
.pec-section-heading { max-width: 640px; margin: 0 auto; text-align: center; }
.pec-section-heading__titulo {
	font-family: "Playfair Display", Georgia, serif; font-weight: 600;
	font-size: clamp(1.8rem, 5vw, 2.8rem); margin: 10px 0 0; color: var(--pec-cream-2);
}
.pec-section-heading__sub { margin: 14px 0 0; color: rgba(251, 230, 210,.68); line-height: 1.6; }
.pec-section-heading .pec-rule { margin: 22px auto 0; background: var(--pec-gold); opacity: .7; }
.pec-section__cta { text-align: center; margin-top: 40px; }

/* ── Experiencia ───────────────────────────────────────────────────────── */
.pec-experience-grid { display: grid; gap: 22px; margin-top: 48px; }
.pec-experience-card {
	background: linear-gradient(160deg, rgba(232, 73, 29,.06), rgba(58, 22, 16,.5));
	border: 1px solid rgba(232, 73, 29,.18);
	border-radius: 18px; overflow: hidden;
	transition: transform .3s ease, border-color .3s ease;
}
.pec-experience-card:hover { transform: translateY(-4px); border-color: rgba(232, 73, 29,.4); }
.pec-experience-card__img { height: 190px; background-size: cover; background-position: center; }
.pec-experience-card__body { padding: 22px; }
.pec-experience-card__icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; border-radius: 50%;
	background: rgba(232, 73, 29,.12); border: 1px solid rgba(232, 73, 29,.35);
	font-size: 1.2rem;
}
.pec-experience-card__body h3 { margin: 14px 0 0; font-size: 1.15rem; color: var(--pec-cream-2); }
.pec-experience-card__body p { margin: 8px 0 0; font-size: .88rem; line-height: 1.6; color: rgba(251, 230, 210,.68); }
@media (min-width: 900px) { .pec-experience-grid { grid-template-columns: repeat(3, 1fr); } }

/* ── Menú (platos/bebidas) ─────────────────────────────────────────────── */
.pec-menu-grid { display: grid; gap: 22px; margin-top: 48px; }
.pec-menu-card {
	background: linear-gradient(160deg, rgba(232, 73, 29,.06), rgba(58, 22, 16,.5));
	border: 1px solid rgba(232, 73, 29,.18);
	border-radius: 18px; overflow: hidden; height: 100%;
	display: flex; flex-direction: column;
	transition: transform .3s ease, border-color .3s ease;
}
.pec-menu-card:hover { transform: translateY(-4px); border-color: rgba(232, 73, 29,.4); }
.pec-menu-card__img-wrap { position: relative; aspect-ratio: 4/3; background: rgba(42, 15, 10,.6); }
.pec-menu-card__img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.pec-menu-card__emoji { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 2.6rem; opacity: .5; }
.pec-menu-card__precio {
	position: absolute; top: 12px; right: 12px;
	background: rgba(42, 15, 10,.82); color: var(--pec-gold);
	font-weight: 700; font-size: .82rem;
	padding: 5px 12px; border-radius: 20px; backdrop-filter: blur(4px);
}
.pec-menu-card__body { padding: 22px; display: flex; flex-direction: column; flex: 1; }
.pec-menu-card__nombre { margin: 0; font-size: 1.08rem; color: var(--pec-cream-2); }
.pec-menu-card__desc { margin: 8px 0 0; font-size: .86rem; line-height: 1.6; color: rgba(251, 230, 210,.68); flex: 1; }
.pec-menu-card__cta { margin-top: 16px; align-self: flex-start; }
@media (min-width: 640px) { .pec-menu-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .pec-menu-grid { grid-template-columns: repeat(3, 1fr); } }
/* En una sola columna (mobile), la relación 4/3 sobre el ancho completo de
   pantalla dejaba la foto ocupando casi toda la pantalla por tarjeta
   (reportado como "sobredimensionado", 2026-09-28) -- se limita a una
   altura fija bastante más chica en vez de escalar con el ancho. */
@media (max-width: 639px) {
	.pec-menu-card__img-wrap { aspect-ratio: auto; height: 150px; }
}

/* ── Reservas ──────────────────────────────────────────────────────────── */
.pec-reservation-form {
	max-width: 720px; margin: 48px auto 0;
	background: linear-gradient(160deg, rgba(232, 73, 29,.06), rgba(58, 22, 16,.5));
	border: 1px solid rgba(232, 73, 29,.18);
	border-radius: 18px; padding: 26px;
}
.pec-reservation-form__grid { display: grid; gap: 18px; }
.pec-reservation-form__full { grid-column: 1 / -1; }
.pec-reservation-form label {
	display: block; margin-bottom: 8px;
	font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
	color: var(--pec-gold);
}
.pec-reservation-form input,
.pec-reservation-form select,
.pec-reservation-form textarea {
	width: 100%; box-sizing: border-box;
	background: rgba(42, 15, 10,.55); border: 1px solid rgba(232, 73, 29,.25);
	border-radius: 10px; padding: 11px 14px;
	font-family: inherit; font-size: .88rem; color: var(--pec-cream-2);
}
.pec-reservation-form input::placeholder,
.pec-reservation-form textarea::placeholder { color: rgba(251, 230, 210,.4); }
.pec-reservation-form input:focus,
.pec-reservation-form select:focus,
.pec-reservation-form textarea:focus { outline: none; border-color: var(--pec-gold); }
.pec-reservation-form textarea { resize: vertical; }
.pec-reservation-form__submit { width: 100%; margin-top: 26px; }
.pec-reservation-form__resultado { margin: 14px 0 0; padding: 12px 14px; border-radius: 10px; font-size: .92rem; line-height: 1.5; }
.pec-reservation-form__resultado.is-ok { background: rgba(67, 192, 122, .14); border: 1px solid rgba(67, 192, 122, .45); color: #b9f0cf; }
.pec-reservation-form__resultado.is-error { background: rgba(233, 70, 70, .12); border: 1px solid rgba(233, 70, 70, .45); color: #ffc2c2; }
.pec-reservation-form__nota { margin: 12px 0 0; text-align: center; font-size: .76rem; color: rgba(251, 230, 210,.55); }
.pec-reservation-fallback {
	max-width: 480px; margin: 40px auto 0; text-align: center;
	background: linear-gradient(160deg, rgba(232, 73, 29,.06), rgba(58, 22, 16,.5));
	border: 1px solid rgba(232, 73, 29,.18); border-radius: 18px; padding: 28px;
	color: rgba(251, 230, 210,.82); line-height: 1.7;
}
@media (min-width: 640px) { .pec-reservation-form__grid { grid-template-columns: repeat(2, 1fr); } }

/* ── Eventos ───────────────────────────────────────────────────────────── */
.pec-events-grid { display: grid; gap: 22px; margin-top: 48px; }
.pec-event-card {
	background: linear-gradient(160deg, rgba(232, 73, 29,.06), rgba(58, 22, 16,.5));
	border: 1px solid rgba(232, 73, 29,.18); border-radius: 18px; padding: 26px;
}
.pec-event-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.pec-event-card__top h3 { margin: 0; font-size: 1.12rem; color: var(--pec-cream-2); }
.pec-event-card__horario { margin: 8px 0 0; color: var(--pec-gold); font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.pec-event-card__desc { margin: 12px 0 0; font-size: .88rem; line-height: 1.6; color: rgba(251, 230, 210,.68); }
@media (min-width: 640px) { .pec-events-grid { grid-template-columns: repeat(2, 1fr); } }

/* ── Ubicación ─────────────────────────────────────────────────────────── */
.pec-location-grid { display: grid; gap: 22px; margin-top: 48px; }
.pec-location-map { border-radius: 18px; overflow: hidden; border: 1px solid rgba(232, 73, 29,.18); min-height: 320px; }
.pec-location-map iframe { width: 100%; height: 100%; min-height: 320px; border: 0; display: block; }
.pec-location-info {
	background: linear-gradient(160deg, rgba(232, 73, 29,.06), rgba(58, 22, 16,.5));
	border: 1px solid rgba(232, 73, 29,.18); border-radius: 18px; padding: 26px;
}
.pec-location-info__direccion { margin: 0; font-weight: 600; color: var(--pec-cream-2); }
.pec-location-info__horarios { margin-top: 24px; }
.pec-location-info__horarios h3 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 1.05rem; color: var(--pec-cream-2); }
.pec-location-info__horarios p { margin: 10px 0 0; padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,.08); color: rgba(251, 230, 210,.72); font-size: .88rem; }
.pec-location-info__wa { width: 100%; margin-top: 24px; }
.pec-location-info__redes { display: flex; gap: 10px; margin-top: 18px; }
.pec-location-info__redes a {
	display: inline-flex; align-items: center; justify-content: center;
	width: 42px; height: 42px; border-radius: 50%;
	border: 1px solid rgba(232, 73, 29,.3); font-size: 1.1rem;
}
@media (min-width: 1024px) { .pec-location-grid { grid-template-columns: 3fr 2fr; } }

/* ── Footer v2 ─────────────────────────────────────────────────────────── */
.pec-footer2 { background: var(--pec-vino-2); border-top: 1px solid rgba(232, 73, 29,.18); padding: 60px 20px 30px; }
.pec-footer2__inner { max-width: 1200px; margin: 0 auto; display: grid; gap: 34px; }
.pec-footer2__brand { display: flex; align-items: center; gap: 8px; font-family: "Playfair Display", Georgia, serif; font-size: 1.4rem; font-weight: 700; color: var(--pec-cream-2); }
.pec-footer2__brand span:first-child { color: var(--pec-gold); }
.pec-footer2__lead { margin: 12px 0 0; max-width: 340px; font-size: .88rem; line-height: 1.6; color: rgba(251, 230, 210,.62); }
.pec-footer2__redes { display: flex; gap: 10px; margin-top: 20px; }
.pec-footer2__redes a { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(232, 73, 29,.3); font-size: 1rem; }
.pec-footer2__col h3 { margin: 0; font-size: .74rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--pec-gold); }
.pec-footer2__col ul { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.pec-footer2__col ul a { font-size: .86rem; color: rgba(251, 230, 210,.68); }
.pec-footer2__col p { margin: 10px 0 0; font-size: .86rem; color: rgba(251, 230, 210,.68); }
.pec-footer2__contacto { color: var(--pec-cream-2) !important; }
.pec-footer2__legal { max-width: 1200px; margin: 36px auto 0; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.08); text-align: center; font-size: .74rem; color: rgba(251, 230, 210,.5); }
@media (min-width: 768px) { .pec-footer2__inner { grid-template-columns: repeat(4, 1fr); } .pec-footer2__brand-col { grid-column: span 2; } }

/* ── Reveal (aparición suave al hacer scroll, ver pec-public.js) ─────────── */
.pec-reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease-out, transform .7s cubic-bezier(.22,1,.36,1); }
.pec-reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .pec-reveal { opacity: 1; transform: none; transition: none; } }

.pec-navbar__logo{border-radius:50%;object-fit:cover}
.pec-experience-card__body{padding-top:28px}
.pec-experience-card__icon{font-size:30px}

/* La barra rápida se reparte entre los accesos que haya (sin horarios cargados son 4). */
.pec-quickbar { display: flex; }
.pec-quickbar > a { flex: 1 1 0; }
/* El botón flotante del carrito queda en esa esquina; «Reservar mesa» ya está en la portada. */
.pec-navbar__cta, .pec-hero__cta { display: none; }
.pec-navbar__inner { justify-content: flex-start; gap: 44px; }
/* Naranja más claro para texto pequeño sobre el vino. */
.pec-hero2 .pec-eyebrow, .pec-hero2__tagline, .pec-hero .pec-eyebrow, .pec-hero .pec-script { color: #ff9a6b; }

/* Ubicación: los botones no se salen de su tarjeta. */
.pec-location-info a { box-sizing: border-box; max-width: 100%; }
.pec-location-info > .pec-btn-outline { display: inline-block; margin: 10px 0 16px; }
.pec-page { overflow-x: clip; }
