/* === Landing mínima de la carta por QR de mesa (plantilla page-carta-qr.php) === */
.qr-page {
	background: var(--bg-gray, #f4f7f7);
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

.qr-main {
	flex: 1 0 auto;
	width: 100%;
	max-width: 460px;
	margin: 0 auto;
	padding: clamp(2rem, 7vw, 3.5rem) 1.25rem 2.5rem;
	text-align: center;
}

.qr-logo {
	display: inline-block;
	margin-bottom: clamp(1.5rem, 6vw, 2.5rem);
}

.qr-logo img {
	width: clamp(180px, 55vw, 240px);
	height: auto;
}

.qr-page .qr-carta {
	background: transparent;
	padding: 0;
}

.qr-page .hero-split__title,
.qr-page h1 {
	font-size: clamp(2rem, 9vw, 2.75rem);
	margin-bottom: .5rem;
}

.qr-page .qr-carta p {
	color: var(--color-text);
	margin-bottom: 1.75rem;
}

/* Botones de carta: grandes, apilados y a todo el ancho */
.qr-page .wp-block-buttons {
	gap: .75rem;
}

.qr-page .wp-block-button {
	width: 100%;
}

.qr-page .wp-block-button__link {
	display: block;
	width: 100%;
	padding: 1rem 1.25rem;
	font-size: 1.0625rem;
	border-radius: var(--radius, 14px);
}

/* Footer mínimo: Instagram (publicidad) + franja legal al final */
.qr-footer {
	flex-shrink: 0;
	text-align: center;
	padding: 2rem 1.25rem clamp(1.5rem, 5vw, 2.5rem);
}

.qr-instagram {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-weight: 700;
	color: var(--color-accent, #007179);
	text-decoration: none;
	padding: .75rem 1.5rem;
	border: 2px solid var(--color-accent, #007179);
	border-radius: 999px;
	transition: background .2s var(--ease-out, ease), color .2s ease;
}

.qr-instagram:hover,
.qr-instagram:focus-visible {
	background: var(--color-accent, #007179);
	color: #fff;
}

.qr-instagram svg {
	width: 22px;
	height: 22px;
}

.qr-legal {
	margin-top: 2rem;
	font-size: .8125rem;
	color: var(--color-text-soft, #6b7a7b);
}

.qr-legal a {
	color: inherit;
}