/**
 * Piel editorial de La Fragata sobre fse-public.css -- NO se toca ese
 * archivo. Estrategia de dos capas:
 * 1) Se REDECLARAN los custom properties --fse-* que fse-public.css ya usa
 *    en todos sus componentes (botones, precios, tarjetas…) -- heredan la
 *    paleta navy/crema/dorado y la tipografía nueva gratis, sin tocar cada
 *    selector uno por uno.
 * 2) Overrides puntuales SOLO donde la estructura visual cambia de verdad
 *    (hero editorial, sidebar de categorías → fila de píldoras, tarjeta de
 *    producto → fila horizontal con miniatura), reusando siempre los MISMOS
 *    IDs/clases que ya rellena fse-public.js.
 */

/* ── 1) Paleta + tipografía (pisa los tokens de fse-public.css) ───────────
   0.3.0: colores = paleta del proyecto Lovable "la-fragata-gastro-bar" (navy de puerto #04111c + latón #e8aa4e,
   crema #f3eee3), mismos tokens de siempre. Layout y tipografías sin cambios.
   A propósito en :root (no en .lfc-page): esta hoja SOLO se encola en
   páginas lfc_home/lfc_menu (ver LFC_Public::enqueue_assets()), y el
   carrito flotante/drawer/sheet de FSE (cart-widget.php) se incluyen como
   HERMANOS de .lfc-page, no como descendientes -- si estos custom
   properties quedaran scopeados a .lfc-page, el carrito heredaría la
   paleta vieja de FSE en vez de la de La Fragata. */
:root {
	--fse-hot:      #e8aa4e;
	--fse-fire:     #d6812e;
	--fse-ember:    #e8aa4e;
	--fse-gold:     #e8aa4e;
	--fse-gold-dim: #d6812e;
	--fse-cream:    #f8f4ec;
	--fse-sand:     #ebe4d6;
	--fse-carbon:   #0b1c2a;
	--fse-smoke:    #172b3b;
	--fse-text:     #0b1c2a;
	--fse-muted:    #55687a;
	--fse-border:   rgba(232, 170, 78, 0.32);
	--fse-surface:  #ebe4d6;
	--fse-white:    #f8f4ec;
	--fse-font-display: "Playfair Display", Georgia, serif;
	--fse-font-body:    "Cormorant Garamond", Georgia, serif;

	--lfc-navy: #04111c;
	--lfc-navy-2: #0b1c2a;
	--lfc-gold: #e8aa4e;
	--lfc-cream: #f3eee3;
	--lfc-cream-2: #f8f4ec;
	--lfc-ink: #0b1c2a;
	--lfc-muted: #55687a;
	--lfc-font-script: "Alex Brush", cursive;
}

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

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

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

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

.lfc-btn-outline {
	display: inline-block;
	border: 1px solid var(--lfc-gold);
	color: var(--lfc-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(4, 17, 28, .25);
	backdrop-filter: blur(2px);
	transition: background .2s ease, color .2s ease;
}
.lfc-btn-outline:hover { background: var(--lfc-gold); color: var(--lfc-navy); }

/* Botón sólido -- CTA primario ("Haz tu pedido", abre el chat de IA), a
   diferencia de .lfc-btn-outline (secundario, "Ver la carta"). Mismo tamaño/
   tipografía, relleno dorado en vez de borde. */
.lfc-btn-solid {
	display: inline-block;
	border: 1px solid var(--lfc-gold);
	background: var(--lfc-gold);
	color: var(--lfc-navy);
	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;
}
.lfc-btn-solid:hover { opacity: .88; }
.lfc-btn-solid:active { transform: scale(.98); }

/* ── HERO (home + menú) ──────────────────────────────────────────────────── */
.lfc-hero {
	position: relative;
	min-height: 78vh;
	display: flex;
	flex-direction: column;
	background: linear-gradient(180deg, #020c16 0%, #0b1c2a 55%, #020c16 100%);
	background-size: cover;
	background-position: center;
	color: var(--lfc-cream-2);
	overflow: hidden;
	padding: 18px 20px;
}
.lfc-hero--menu { min-height: 46vh; }
.lfc-hero::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(2, 12, 22,.65) 0%, rgba(2, 12, 22,.35) 45%, rgba(2, 12, 22,.75) 100%);
	pointer-events: none;
}
.lfc-hero__topbar {
	position: relative; z-index: 1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}
.lfc-hero__brand {
	display: inline-flex; align-items: center; gap: 10px;
	min-width: 0;
	text-decoration: none; color: var(--lfc-cream-2);
}
.lfc-hero__brand-badge {
	flex: 0 0 auto;
	width: 40px; height: 40px; border-radius: 50%;
	background: var(--lfc-cream-2);
	display: flex; align-items: center; justify-content: center;
	padding: 6px;
	box-shadow: 0 0 0 1px rgba(232, 170, 78,.4);
}
.lfc-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. */
.lfc-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;
}
.lfc-hero__cta {
	flex: 0 0 auto;
	font-size: .66rem;
	padding: 9px 14px;
	white-space: nowrap;
}
.lfc-hero__content {
	position: relative; z-index: 1;
	margin: auto 0 12px;
	text-align: center;
	display: flex; flex-direction: column; align-items: center;
	gap: 6px;
}
.lfc-hero__badge {
	width: 92px; height: 92px; border-radius: 50%;
	background: var(--lfc-cream-2);
	display: flex; align-items: center; justify-content: center;
	padding: 14px;
	margin-bottom: 10px;
	box-shadow: 0 0 0 1px rgba(232, 170, 78,.4);
}
.lfc-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. */
.lfc-display--xl { font-size: clamp(2.6rem, 12vw, 4.2rem); line-height: 1.05; margin: 4px 0; font-weight: 600; letter-spacing: .02em; }
.lfc-hero--menu .lfc-display { font-size: clamp(2.2rem, 10vw, 3.4rem); line-height: 1.08; margin: 4px 0; font-weight: 600; letter-spacing: .02em; }
.lfc-hero__sub { letter-spacing: .3em; color: var(--lfc-gold); font-size: .82rem; margin: 2px 0 14px; }
.lfc-hero__lead { font-size: 1rem; letter-spacing: .1em; text-transform: uppercase; margin: 6px 0 18px; }
/* .lfc-script hereda uppercase de .lfc-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. */
.lfc-hero__lead .lfc-script { text-transform: none; }
.lfc-hero__cta-big { margin-top: 6px; }
.lfc-hero__ctas { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.lfc-hero__ctas .lfc-hero__cta-big { margin-top: 0; }

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

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

/* ── Favoritos (home) ────────────────────────────────────────────────────── */
.lfc-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) { .lfc-favoritos { grid-template-columns: repeat(4, 1fr); } }
.lfc-favorito__img-wrap {
	aspect-ratio: 1/1;
	border-radius: 10px;
	overflow: hidden;
	background: var(--lfc-cream-2);
	box-shadow: 0 0 0 1px var(--fse-border);
	margin-bottom: 10px;
}
.lfc-favorito__img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.lfc-favorito__nombre { font-family: "Playfair Display", serif; font-size: 1rem; margin: 0 0 3px; }
.lfc-favorito__desc { font-size: .82rem; color: var(--lfc-muted); margin: 0 0 6px; line-height: 1.4; }
.lfc-favorito__precio { color: var(--lfc-gold); font-weight: 700; font-variant-numeric: tabular-nums; }

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

/* ── Toolbar del menú: buscador + secciones (todo/comida/bebida) ───────── */
.lfc-menu-toolbar {
	position: sticky; top: 0; z-index: 5;
	background: var(--lfc-cream);
	padding: 14px 16px 0;
	display: flex; flex-wrap: wrap; gap: 10px;
	align-items: center;
}
.lfc-buscar {
	flex: 1 1 160px;
	min-width: 0;
	background: var(--lfc-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(--lfc-ink);
}
.lfc-secciones { display: flex; gap: 8px; flex-wrap: wrap; }
.lfc-seccion-tab {
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: .76rem;
	letter-spacing: .1em;
	text-transform: lowercase;
	background: transparent;
	border: none;
	color: var(--lfc-muted);
	padding: 10px 14px;
	cursor: pointer;
	border-radius: 4px;
}
.lfc-seccion-tab--active { background: var(--lfc-navy); color: var(--lfc-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. */
.lfc-page .fse-menu-body { display: block; }
.lfc-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;
}
.lfc-page .fse-products {
	margin-left: 0;
	max-width: 720px;
}
.lfc-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(--lfc-ink);
}
.lfc-page .fse-cat-tab__label {
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: .76rem;
	letter-spacing: .12em;
	text-transform: uppercase;
}
.lfc-page .fse-cat-tab__emoji { display: none; }
.lfc-page .fse-cat-tab--active {
	background: var(--lfc-cream-2);
	border-color: var(--lfc-gold);
	color: var(--lfc-ink);
}
.lfc-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 ────────────────── */
.lfc-page .fse-product-grid {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 4px 16px 100px;
	max-width: 720px;
	margin: 0 auto;
}
.lfc-page .fse-card {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	gap: 14px;
	background: var(--lfc-cream-2);
	border: 1px solid var(--fse-border);
	border-radius: 12px;
	box-shadow: none;
	cursor: pointer;
	padding: 10px;
}
.lfc-page .fse-card:hover { transform: none; box-shadow: 0 4px 16px rgba(4, 17, 28,.08); }
.lfc-page .fse-card__img-wrap {
	flex: 0 0 104px;
	width: 104px; height: 104px;
	aspect-ratio: auto;
	border-radius: 8px;
}
.lfc-page .fse-card__body { padding: 2px 4px 2px 0; flex: 1 1 auto; min-width: 0; }
.lfc-page .fse-card__cats { display: none; }
.lfc-page .fse-card__title {
	font-family: "Playfair Display", serif;
	font-weight: 600;
	font-size: 1.08rem;
	color: var(--lfc-ink);
}
.lfc-page .fse-card__desc { color: var(--lfc-muted); font-size: .86rem; -webkit-line-clamp: 2; margin-bottom: 8px; }
.lfc-page .fse-card__price { color: var(--lfc-gold); font-size: 1.02rem; }
.lfc-page .fse-card__add-btn {
	width: 34px; height: 34px;
	background: var(--lfc-navy);
	bottom: 6px; right: 6px; top: auto; left: auto;
}
.lfc-page .fse-card__add-btn--fire, .lfc-page button.fse-card__add-btn--fire { background: var(--lfc-navy); }

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

/* ── Carrito -- legibilidad de números + nombre de producto ───────────────
   Pedido explícito del usuario: los montos ($) se leían débiles porque
   fse-public.css los pinta con --fse-hot, que acá vale el dorado de marca
   (buen acento, bajo contraste como color de texto sobre el fondo crema).
   Se oscurecen a la tinta navy -- mismo color que ya usa el nombre del
   producto, más legible sin perder jerarquía. Sin scope .lfc-page: el
   carrito (cart-widget.php) es HERMANO de .lfc-page en el DOM, no
   descendiente (ver nota de :root más arriba), así que estos selectores
   van sueltos -- de cualquier forma esta hoja solo carga en páginas de La
   Fragata. */
.fse-cart-item__precio,
.fse-cart-total__amount {
	color: var(--lfc-ink);
}
.fse-cart-item__nombre {
	font-size: 1rem;
}

/* ══════════════════════════════════════════════════════════════════════════
   REDISEÑO HOME (2026-09-28) -- portado de la maqueta Lovable del cliente
   (zip "la fragata": Navbar/Hero/QuickBar/Experience/MenuGrid/Reservation/
   Events/LocationContact/Footer). Namespace propio (.lfc-*2/.lfc-section*)
   para no chocar con las clases viejas de arriba, que siguen vivas en la
   página de Carta (menu.php no se tocó). Reusa "Plus Jakarta Sans" (ya
   cargada por fse-public.css) como sans-serif del cuerpo en vez de sumar
   Manrope -- misma familia tipográfica de la maqueta a nivel de peso/look,
   sin una petición de fuente más.
   ═══════════════════════════════════════════════════════════════════════ */

.lfc-page--v2 {
	background: var(--lfc-navy);
	color: var(--lfc-cream-2);
	font-family: "Plus Jakarta Sans", sans-serif;
}
.lfc-page--v2 a { text-decoration: none; }
.lfc-btn--lg { padding: 15px 30px !important; font-size: .8rem !important; }
.lfc-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;
}
.lfc-btn-whatsapp:hover { transform: scale(1.03); opacity: .92; }

/* ── Navbar ────────────────────────────────────────────────────────────── */
.lfc-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;
}
.lfc-navbar.is-scrolled {
	background: rgba(4, 17, 28, .88);
	backdrop-filter: blur(14px);
	border-bottom-color: rgba(232, 170, 78, .25);
}
.lfc-navbar__inner {
	max-width: 1200px; margin: 0 auto;
	display: flex; align-items: center; justify-content: space-between;
	padding: 14px 20px;
}
.lfc-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(--lfc-cream-2);
}
.lfc-navbar__brand span:first-child { color: var(--lfc-gold); }
.lfc-navbar__links { display: none; align-items: center; gap: 26px; }
.lfc-navbar__links a:not(.lfc-navbar__cta) {
	font-size: .84rem; color: var(--lfc-cream-2); opacity: .78;
	transition: opacity .2s ease, color .2s ease;
}
.lfc-navbar__links a:not(.lfc-navbar__cta):hover { opacity: 1; color: var(--lfc-gold); }
.lfc-navbar__cta { padding: 9px 18px !important; font-size: .7rem !important; flex-shrink: 0; }
@media (min-width: 1024px) {
	.lfc-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
   .lfc-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. */
.lfc-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;
}
.lfc-page ~ .fse-cart-fab .fse-cart-fab__icon { width: 19px; height: 19px; }

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

/* ── Hero v2 ───────────────────────────────────────────────────────────── */
.lfc-hero2 {
	position: relative; min-height: 92vh;
	display: flex; flex-direction: column; justify-content: center;
	background-size: cover; background-position: center;
	overflow: hidden;
}
.lfc-hero2__overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(4, 17, 28,.55) 0%, rgba(4, 17, 28,.72) 45%, var(--lfc-navy) 100%);
}
.lfc-hero2__content {
	position: relative; z-index: 1;
	max-width: 1200px; margin: 0 auto; width: 100%;
	padding: 130px 20px 90px;
}
.lfc-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(--lfc-cream-2);
}
.lfc-hero2__tagline {
	margin: 14px 0 0; color: var(--lfc-gold);
	text-transform: uppercase; letter-spacing: .22em; font-size: .95rem;
}
.lfc-hero2__lead {
	margin: 16px 0 0; max-width: 560px;
	font-size: 1.05rem; line-height: 1.6; color: rgba(243, 238, 227,.78);
}
.lfc-hero2__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }

/* ── QuickBar ──────────────────────────────────────────────────────────── */
.lfc-quickbar-wrap { position: relative; z-index: 5; margin-top: -56px; padding: 0 16px; }
.lfc-quickbar {
	max-width: 1200px; margin: 0 auto;
	display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px;
	background: rgba(232, 170, 78,.18);
	border: 1px solid rgba(232, 170, 78,.22);
	border-radius: 18px; overflow: hidden;
	box-shadow: 0 22px 45px -25px rgba(0,0,0,.6);
}
.lfc-quickbar a {
	background: var(--lfc-navy-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(--lfc-cream-2);
	transition: background .2s ease;
}
.lfc-quickbar a span { font-size: 1.3rem; }
.lfc-quickbar a:hover { background: rgba(232, 170, 78,.14); }
@media (min-width: 600px) { .lfc-quickbar { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .lfc-quickbar { grid-template-columns: repeat(5, 1fr); } }

/* ── Secciones genéricas ───────────────────────────────────────────────── */
.lfc-section { padding: 78px 16px; }
.lfc-section--navy { background: rgba(255,255,255,.02); }
.lfc-section__inner { max-width: 1200px; margin: 0 auto; }
.lfc-section-heading { max-width: 640px; margin: 0 auto; text-align: center; }
.lfc-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(--lfc-cream-2);
}
.lfc-section-heading__sub { margin: 14px 0 0; color: rgba(243, 238, 227,.68); line-height: 1.6; }
.lfc-section-heading .lfc-rule { margin: 22px auto 0; background: var(--lfc-gold); opacity: .7; }
.lfc-section__cta { text-align: center; margin-top: 40px; }

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

/* ── Menú (platos/bebidas) ─────────────────────────────────────────────── */
.lfc-menu-grid { display: grid; gap: 22px; margin-top: 48px; }
.lfc-menu-card {
	background: linear-gradient(160deg, rgba(232, 170, 78,.06), rgba(11, 28, 42,.5));
	border: 1px solid rgba(232, 170, 78,.18);
	border-radius: 18px; overflow: hidden; height: 100%;
	display: flex; flex-direction: column;
	transition: transform .3s ease, border-color .3s ease;
}
.lfc-menu-card:hover { transform: translateY(-4px); border-color: rgba(232, 170, 78,.4); }
.lfc-menu-card__img-wrap { position: relative; aspect-ratio: 4/3; background: rgba(4, 17, 28,.6); }
.lfc-menu-card__img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.lfc-menu-card__emoji { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 2.6rem; opacity: .5; }
.lfc-menu-card__precio {
	position: absolute; top: 12px; right: 12px;
	background: rgba(4, 17, 28,.82); color: var(--lfc-gold);
	font-weight: 700; font-size: .82rem;
	padding: 5px 12px; border-radius: 20px; backdrop-filter: blur(4px);
}
.lfc-menu-card__body { padding: 22px; display: flex; flex-direction: column; flex: 1; }
.lfc-menu-card__nombre { margin: 0; font-size: 1.08rem; color: var(--lfc-cream-2); }
.lfc-menu-card__desc { margin: 8px 0 0; font-size: .86rem; line-height: 1.6; color: rgba(243, 238, 227,.68); flex: 1; }
.lfc-menu-card__cta { margin-top: 16px; align-self: flex-start; }
@media (min-width: 640px) { .lfc-menu-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .lfc-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) {
	.lfc-menu-card__img-wrap { aspect-ratio: auto; height: 150px; }
}

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

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

/* ── Ubicación ─────────────────────────────────────────────────────────── */
.lfc-location-grid { display: grid; gap: 22px; margin-top: 48px; }
.lfc-location-map { border-radius: 18px; overflow: hidden; border: 1px solid rgba(232, 170, 78,.18); min-height: 320px; }
.lfc-location-map iframe { width: 100%; height: 100%; min-height: 320px; border: 0; display: block; }
.lfc-location-info {
	background: linear-gradient(160deg, rgba(232, 170, 78,.06), rgba(11, 28, 42,.5));
	border: 1px solid rgba(232, 170, 78,.18); border-radius: 18px; padding: 26px;
}
.lfc-location-info__direccion { margin: 0; font-weight: 600; color: var(--lfc-cream-2); }
.lfc-location-info__horarios { margin-top: 24px; }
.lfc-location-info__horarios h3 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 1.05rem; color: var(--lfc-cream-2); }
.lfc-location-info__horarios p { margin: 10px 0 0; padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,.08); color: rgba(243, 238, 227,.72); font-size: .88rem; }
.lfc-location-info__wa { width: 100%; margin-top: 24px; }
.lfc-location-info__redes { display: flex; gap: 10px; margin-top: 18px; }
.lfc-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, 170, 78,.3); font-size: 1.1rem;
}
@media (min-width: 1024px) { .lfc-location-grid { grid-template-columns: 3fr 2fr; } }

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

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