/*
Theme Name: Kooka Rock 'n' Rolls
Stylesheet: Main
Version: 1.0.3
*/

@import url('https://fonts.googleapis.com/css2?family=Anton&family=Inter:wght@400;500;600;700&family=Oswald:wght@500;600;700&display=swap');

/* ==========================================================
   1. DESIGN TOKENS
   ========================================================== */

:root {
	--colour-red: #b31e24;
	--colour-red-dark: #861419;
	--colour-blue: #335e73;
	--colour-blue-dark: #234657;
	--colour-cream: #f6ede1;
	--colour-cream-light: #fffaf2;
	--colour-charcoal: #1e1e1e;
	--colour-chrome: #c7ccd1;
	--colour-chrome-dark: #7e878e;
	--colour-white: #ffffff;
	--colour-focus: #d99a1b;

	--font-display: 'Oswald', 'Arial Narrow', sans-serif;
	--font-body: 'Inter', Arial, sans-serif;

	--container-width: 1800px;
	--page-gutter: clamp(24px, 4vw, 80px);
	--header-height: 120px;
	--announcement-height: 36px;
	--radius-small: 10px;
	--radius-medium: 16px;
	--transition: 180ms ease;
}

/* ==========================================================
   2. RESET + GLOBALS
   ========================================================== */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--colour-cream);
	color: var(--colour-charcoal);
	font-family: var(--font-body);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

body.menu-open {
	overflow: hidden;
}

img,
svg {
	display: block;
	max-width: 100%;
}

a {
	color: inherit;
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
}

button,
input,
select,
textarea {
	font: inherit;
}

button,
a {
	-webkit-tap-highlight-color: transparent;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0 0 0.6em;
	font-family: var(--font-display);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: 0.025em;
	text-transform: uppercase;
}

p {
	margin: 0 0 1.25em;
}

.container {
	width: min(calc(100% - (var(--page-gutter) * 2)), var(--container-width));
	margin-inline: auto;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: fixed;
	top: 12px;
	left: 12px;
	z-index: 100000;
	padding: 12px 18px;
	background: var(--colour-charcoal);
	color: var(--colour-white);
	font-weight: 700;
	transform: translateY(-150%);
	transition: transform var(--transition);
}

.skip-link:focus {
	transform: translateY(0);
}

:focus-visible {
	outline: 3px solid var(--colour-focus);
	outline-offset: 4px;
}

/* ==========================================================
   3. SITE HEADER
   ========================================================== */

.site-header {
	position: relative;
	z-index: 1000;
	background: var(--colour-cream);
}

.site-header__announcement {
	height: var(--announcement-height);
	background:
		linear-gradient(90deg, var(--colour-red-dark), var(--colour-red) 35%, #c2292e 65%, var(--colour-red-dark));
	color: var(--colour-cream-light);
	box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.2);
}

.site-header__announcement-inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	height: 100%;
	font-family: var(--font-display);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.22em;
	line-height: 1;
	text-align: center;
	text-transform: uppercase;
}

.announcement-star {
	font-size: 14px;
	line-height: 1;
}

.announcement-dot {
	opacity: 0.75;
}

.site-header__main {
	position: relative;
	min-height: var(--header-height);
	background:
		radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.65), transparent 28%),
		var(--colour-cream);
	border-bottom: 1px solid rgba(51, 94, 115, 0.18);
	box-shadow: 0 8px 20px rgba(30, 30, 30, 0.05);
}

.site-header__inner {
	display: grid;
	grid-template-columns: 106px minmax(470px, 1fr) auto;
	align-items: center;
	column-gap: clamp(18px, 2vw, 38px);
	width: calc(100% - (var(--page-gutter) * 2));
	max-width: none;
	min-height: var(--header-height);
	margin-inline: auto;
}

/* ==========================================================
   4. LOGO
   ========================================================== */

.site-brand {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 106px;
	height: 106px;
}

.site-brand__link {
	display: block;
	width: 106px;
	height: 106px;
	text-decoration: none;
}

.site-brand__logo,
.site-brand img,
.site-brand .custom-logo {
	display: block;
	width: 106px;
	height: 106px;
	max-width: none;
	max-height: none;
	object-fit: contain;
}

/* ==========================================================
   5. DESKTOP DINER NAVIGATION
   ========================================================== */

.primary-nav {
	width: 100%;
	min-width: 0;
}

.diner-nav__menu {
	display: grid;
	grid-template-columns: repeat(5, minmax(96px, 1fr));
	gap: 5px;
	width: 100%;
	margin: 0;
	padding: 6px;
	list-style: none;
	background: linear-gradient(180deg, #eef1f3 0%, #adb4ba 48%, #737c83 100%);
	border: 2px solid #879198;
	border-radius: 16px;
	box-shadow:
		inset 0 0 0 3px #e8ebed,
		inset 0 -5px 8px rgba(30, 30, 30, 0.2),
		0 8px 14px rgba(30, 30, 30, 0.22);
}

.diner-nav__item {
	position: relative;
	min-width: 0;
}

.diner-nav__item a {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 8px 10px;
	border: 1px solid rgba(30, 30, 30, 0.18);
	border-radius: 10px;
	font-family: var(--font-display);
	font-size: clamp(13px, 0.82vw, 16px);
	font-weight: 600;
	letter-spacing: 0.12em;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	white-space: nowrap;
	box-shadow:
		inset 0 2px 1px rgba(255, 255, 255, 0.45),
		0 3px 5px rgba(30, 30, 30, 0.2);
	transition:
		transform var(--transition),
		filter var(--transition),
		box-shadow var(--transition);
}

.diner-nav__item a:hover,
.diner-nav__item a:focus-visible {
	filter: brightness(1.09) saturate(1.08);
	transform: translateY(-3px);
	box-shadow:
		inset 0 2px 1px rgba(255, 255, 255, 0.5),
		0 7px 10px rgba(30, 30, 30, 0.25);
}

.diner-nav__item--red a {
	background: linear-gradient(180deg, #ca2a31 0%, var(--colour-red) 58%, var(--colour-red-dark) 100%);
	color: var(--colour-white);
}

.diner-nav__item--cream a {
	background: linear-gradient(180deg, #fffdf8 0%, var(--colour-cream) 58%, #ded1bf 100%);
	color: var(--colour-blue);
}

.diner-nav__item--charcoal a {
	background: linear-gradient(180deg, #353535 0%, var(--colour-charcoal) 58%, #090909 100%);
	color: var(--colour-cream-light);
}

.diner-nav__item--blue a {
	background: linear-gradient(180deg, #487f98 0%, var(--colour-blue) 58%, var(--colour-blue-dark) 100%);
	color: var(--colour-white);
}

.diner-nav__item.is-current::after,
.diner-nav__item.current-menu-item::after,
.diner-nav__item.current_page_item::after {
	position: absolute;
	left: 50%;
	bottom: -19px;
	width: 11px;
	height: 11px;
	background: var(--colour-red);
	border: 3px solid var(--colour-cream-light);
	border-radius: 50%;
	box-shadow: 0 0 0 2px var(--colour-blue);
	content: '';
	transform: translateX(-50%);
}

/* ==========================================================
   6. HEADER ACTIONS
   ========================================================== */

.site-header__actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
}

.header-order-button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	width: 190px;
	min-height: 54px;
	padding: 11px 17px;
	background: linear-gradient(180deg, #487f98 0%, var(--colour-blue) 55%, var(--colour-blue-dark) 100%);
	color: var(--colour-white);
	border: 3px solid var(--colour-blue);
	border-radius: 16px;
	font-family: var(--font-display);
	font-size: clamp(14px, 0.9vw, 17px);
	font-weight: 600;
	letter-spacing: 0.12em;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	white-space: nowrap;
	box-shadow:
		inset 0 0 0 6px var(--colour-cream),
		0 6px 0 rgba(35, 70, 87, 0.25);
	transition:
		background var(--transition),
		color var(--transition),
		transform var(--transition),
		box-shadow var(--transition);
}

.header-order-button:hover,
.header-order-button:focus-visible {
	background: linear-gradient(180deg, #ca2a31 0%, var(--colour-red) 55%, var(--colour-red-dark) 100%);
	border-color: var(--colour-red-dark);
	transform: translateY(-3px);
	box-shadow:
		inset 0 0 0 6px var(--colour-cream),
		0 9px 0 rgba(134, 20, 25, 0.25);
}

.header-order-button__star {
	font-size: 18px;
	transition: transform var(--transition);
}

.header-order-button:hover .header-order-button__star {
	transform: rotate(90deg) scale(1.18);
}

.header-utility-button {
	position: relative;
	display: inline-flex;
	flex: 0 0 54px;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	border: 2px solid transparent;
	border-radius: 13px;
	color: var(--colour-white);
	text-decoration: none;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.28),
		0 5px 0 rgba(30, 30, 30, 0.16);
	transition:
		transform var(--transition),
		filter var(--transition),
		box-shadow var(--transition);
}

.header-utility-button--account {
	background: linear-gradient(180deg, #487f98 0%, var(--colour-blue) 58%, var(--colour-blue-dark) 100%);
	border-color: var(--colour-blue-dark);
}

.header-utility-button--cart {
	background: linear-gradient(180deg, #ca2a31 0%, var(--colour-red) 58%, var(--colour-red-dark) 100%);
	border-color: var(--colour-red-dark);
}

.header-utility-button:hover,
.header-utility-button:focus-visible {
	color: var(--colour-white);
	filter: brightness(1.1) saturate(1.06);
	transform: translateY(-3px);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.32),
		0 8px 0 rgba(30, 30, 30, 0.14);
}

.header-utility-button svg {
	width: 25px;
	height: 25px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.header-cart-count {
	position: absolute;
	top: -7px;
	right: -7px;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 21px;
	height: 21px;
	padding: 0 5px;
	background: var(--colour-cream-light);
	color: var(--colour-red-dark);
	border: 2px solid var(--colour-red-dark);
	border-radius: 999px;
	font-family: var(--font-body);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
}

.header-cart-count.is-empty {
	display: none;
}

.menu-toggle {
	display: none;
	position: relative;
	width: 54px;
	height: 54px;
	padding: 0;
	background: var(--colour-red);
	border: 2px solid var(--colour-red-dark);
	border-radius: 12px;
	cursor: pointer;
	box-shadow: inset 0 0 0 3px var(--colour-cream), 0 4px 0 rgba(30, 30, 30, 0.2);
}

.menu-toggle__line {
	position: absolute;
	left: 14px;
	width: 22px;
	height: 3px;
	background: var(--colour-white);
	border-radius: 3px;
	transition: transform var(--transition), opacity var(--transition), top var(--transition);
}

.menu-toggle__line--top {
	top: 16px;
}

.menu-toggle__line--middle {
	top: 24px;
}

.menu-toggle__line--bottom {
	top: 32px;
}

.menu-toggle[aria-expanded='true'] .menu-toggle__line--top {
	top: 24px;
	transform: rotate(45deg);
}

.menu-toggle[aria-expanded='true'] .menu-toggle__line--middle {
	opacity: 0;
}

.menu-toggle[aria-expanded='true'] .menu-toggle__line--bottom {
	top: 24px;
	transform: rotate(-45deg);
}

/* ==========================================================
   7. PAGE SHELL
   ========================================================== */

.site-main {
	position: relative;
	min-height: 55vh;
}

body:not(.elementor-page) .entry-content {
	width: min(calc(100% - (var(--page-gutter) * 2)), 1200px);
	margin-inline: auto;
	padding-block: 72px;
}

body.elementor-page .site-main,
body.elementor-page .site-content,
body.elementor-page .content-area,
body.elementor-page article,
body.elementor-page .entry-content {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

body.page .entry-title,
body.page .page-title,
body.page .elementor-page-title,
body.page header.entry-header {
	display: none !important;
}

/* ==========================================================
   8. SITE FOOTER
   ========================================================== */

.site-footer {
	padding: 64px 0 32px;
	background: var(--colour-charcoal);
	color: rgba(255, 255, 255, 0.72);
	border-top: 8px solid var(--colour-red);
}

.site-footer__inner {
	display: grid;
	grid-template-columns: minmax(180px, 1fr) auto;
	align-items: center;
	gap: 32px 64px;
}

.site-footer__brand img,
.site-footer .custom-logo {
	width: 160px;
	height: auto;
	max-height: 160px;
	object-fit: contain;
}

.footer-nav ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 14px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.footer-nav a,
.site-footer a {
	color: var(--colour-cream);
}

.footer-nav a {
	font-family: var(--font-display);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-decoration: none;
	text-transform: uppercase;
}

.footer-nav a:hover,
.footer-nav a:focus-visible,
.site-footer a:hover,
.site-footer a:focus-visible {
	color: var(--colour-white);
}

.site-footer__copyright,
.site-footer__credit {
	margin: 0;
	font-size: 14px;
}

/* ==========================================================
   9. LARGE DESKTOP ADJUSTMENTS
   ========================================================== */

@media (max-width: 1550px) {
	:root {
		--header-height: 116px;
		--page-gutter: 34px;
	}

	.site-header__inner {
		grid-template-columns: 102px minmax(440px, 1fr) auto;
		column-gap: 20px;
	}

	.site-brand,
	.site-brand__link,
	.site-brand__logo,
	.site-brand img,
	.site-brand .custom-logo {
		width: 102px;
		height: 102px;
	}

	.diner-nav__item a {
		min-height: 44px;
		padding-inline: 8px;
	}

	.header-order-button {
		width: 175px;
		min-height: 50px;
		padding-inline: 14px;
	}

	.header-utility-button {
		flex-basis: 50px;
		width: 50px;
		height: 50px;
	}
}

@media (max-width: 1250px) {
	:root {
		--header-height: 108px;
		--page-gutter: 28px;
	}

	.site-header__inner {
		grid-template-columns: 94px minmax(410px, 1fr) auto;
		column-gap: 15px;
	}

	.site-brand,
	.site-brand__link,
	.site-brand__logo,
	.site-brand img,
	.site-brand .custom-logo {
		width: 94px;
		height: 94px;
	}

	.diner-nav__menu {
		gap: 5px;
		padding: 7px;
	}

	.diner-nav__item a {
		min-height: 42px;
		padding-inline: 7px;
		font-size: 12px;
		letter-spacing: 0.08em;
	}

	.header-order-button {
		width: 160px;
		min-height: 48px;
		gap: 10px;
		font-size: 14px;
		letter-spacing: 0.08em;
	}

	.header-utility-button {
		flex-basis: 48px;
		width: 48px;
		height: 48px;
	}
}

/* ==========================================================
   10. TABLET + MOBILE PUBLIC WEBSITE HEADER
   The separate ordering webapp can use its own interface.
   ========================================================== */

@media (max-width: 800px) {
	:root {
		--announcement-height: 40px;
		--header-height: 92px;
		--page-gutter: 18px;
	}

	.site-header__announcement-inner {
		gap: 9px;
		font-size: 11px;
		letter-spacing: 0.12em;
	}

	.announcement-dot {
		display: none;
	}

	.site-header__main {
		min-height: var(--header-height);
	}

	.site-header__inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: calc(100% - (var(--page-gutter) * 2));
		min-height: var(--header-height);
	}

	.site-brand,
	.site-brand__link,
	.site-brand__logo,
	.site-brand img,
	.site-brand .custom-logo {
		width: 82px;
		height: 82px;
	}

	.site-header__actions {
		gap: 8px;
	}

	.header-order-button {
		display: none;
	}

	.header-utility-button {
		flex-basis: 46px;
		width: 46px;
		height: 46px;
		border-radius: 11px;
	}

	.header-utility-button svg {
		width: 22px;
		height: 22px;
	}

	.menu-toggle {
		display: block;
		flex: 0 0 54px;
	}

	.primary-nav {
		position: fixed;
		top: calc(var(--announcement-height) + var(--header-height));
		left: 0;
		z-index: 999;
		width: 100%;
		height: calc(100dvh - var(--announcement-height) - var(--header-height));
		padding: 24px 18px 40px;
		overflow-y: auto;
		background:
			linear-gradient(rgba(246, 237, 225, 0.96), rgba(246, 237, 225, 0.98)),
			repeating-linear-gradient(45deg, transparent 0 12px, rgba(51, 94, 115, 0.07) 12px 24px);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-16px);
		transition: opacity var(--transition), visibility var(--transition), transform var(--transition);
	}

	.admin-bar .primary-nav {
		top: calc(var(--wp-admin--admin-bar--height, 46px) + var(--announcement-height) + var(--header-height));
		height: calc(100dvh - var(--wp-admin--admin-bar--height, 46px) - var(--announcement-height) - var(--header-height));
	}

	.primary-nav.is-open {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	.diner-nav__menu {
		display: grid;
		grid-template-columns: 1fr;
		gap: 10px;
		width: min(100%, 520px);
		margin-inline: auto;
		padding: 10px;
		border-radius: 18px;
	}

	.diner-nav__item a {
		min-height: 68px;
		padding: 16px 22px;
		font-size: 19px;
		letter-spacing: 0.12em;
	}

	.diner-nav__item.is-current::after,
	.diner-nav__item.current-menu-item::after,
	.diner-nav__item.current_page_item::after {
		display: none;
	}

	.diner-nav__item.is-current a,
	.diner-nav__item.current-menu-item a,
	.diner-nav__item.current_page_item a {
		box-shadow:
			inset 0 0 0 3px var(--colour-cream-light),
			inset 0 0 0 6px rgba(51, 94, 115, 0.55),
			0 5px 8px rgba(30, 30, 30, 0.22);
	}

	.entry-content {
		padding-block: 48px;
	}

	.site-footer__inner {
		grid-template-columns: 1fr;
		justify-items: center;
		text-align: center;
	}

	.footer-nav ul {
		justify-content: center;
	}
}

@media (max-width: 480px) {
	.site-header__announcement-inner {
		gap: 7px;
		font-size: 10px;
		letter-spacing: 0.08em;
	}

	.announcement-star:last-child {
		display: none;
	}

	.site-brand,
	.site-brand__link,
	.site-brand__logo,
	.site-brand img,
	.site-brand .custom-logo {
		width: 76px;
		height: 76px;
	}

	.header-utility-button {
		flex-basis: 43px;
		width: 43px;
		height: 43px;
	}

	.menu-toggle {
		width: 50px;
		height: 50px;
		flex-basis: 50px;
	}
}

/* ==========================================================
   11. WORDPRESS ADMIN BAR OFFSETS
   ========================================================== */

@media (max-width: 782px) {
	.admin-bar .site-header {
		position: relative;
	}
}

/* ==========================================================
   12. REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}

/* ==========================================================
   13. ROCK 'N' ROLLS — HERO
   ========================================================== */

.rr-hero {
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: center;
	width: 100%;
	height: clamp(700px, 56.2vw, 940px);
	min-height: 700px;
	overflow: hidden;
	background-color: #f3e2c5;
	background-image: url('https://rocknrolls.com.au/wp-content/uploads/2026/08/rock-n-rolls-diner-braemar-airstream-cafe-hero.webp');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

.rr-hero__content {
	position: relative;
	z-index: 2;
	width: min(47vw, 850px);
	margin: 0 0 95px clamp(30px, 5.5vw, 105px);
}

.rr-hero__title {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin: 0 0 26px;
	padding: 0;
	font-family: 'Anton', Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
	font-size: clamp(78px, 6vw, 118px);
	font-weight: 400;
	line-height: 0.86;
	letter-spacing: 0.005em;
	text-transform: uppercase;
}

.rr-hero__title span {
	--rr-title-colour: #174b60;
	display: block;
	color: var(--rr-title-colour);
	background-image:
		radial-gradient(circle at 18% 26%, rgba(246, 237, 225, 0.85) 0 0.8px, transparent 1.4px),
		radial-gradient(circle at 72% 64%, rgba(246, 237, 225, 0.7) 0 1px, transparent 1.7px),
		radial-gradient(circle at 45% 82%, rgba(246, 237, 225, 0.55) 0 0.7px, transparent 1.4px),
		linear-gradient(var(--rr-title-colour), var(--rr-title-colour));
	background-position: 0 0, 3px 5px, 6px 2px, 0 0;
	background-size: 9px 11px, 13px 17px, 17px 19px, 100% 100%;
	background-repeat: repeat;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	filter: drop-shadow(1px 2px 0 rgba(45, 27, 17, 0.09));
}

.rr-hero__title-red {
	--rr-title-colour: #ad211d !important;
	margin-top: 11px;
}

.rr-hero__text {
	max-width: 510px;
	margin: 0 0 27px;
	padding: 0;
	color: #201b17;
	font-family: var(--font-body);
	font-size: clamp(17px, 1.25vw, 23px);
	font-weight: 700;
	line-height: 1.25;
}

.rr-hero__buttons {
	display: grid;
	grid-template-columns: repeat(2, 230px);
	align-items: stretch;
	gap: 14px;
	width: max-content;
	max-width: 100%;
}

.rr-button {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	min-height: 58px;
	padding: 12px 20px;
	border: 2px solid rgba(63, 24, 18, 0.24);
	border-radius: 13px;
	box-shadow:
		0 5px 0 rgba(72, 33, 20, 0.18),
		inset 0 1px 0 rgba(255, 255, 255, 0.25);
	color: #fff5dc !important;
	font-family: 'Anton', Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.045em;
	text-align: center;
	text-decoration: none !important;
	text-transform: uppercase;
	white-space: nowrap;
	transition:
		transform var(--transition),
		box-shadow var(--transition),
		filter var(--transition);
}

.rr-button--red {
	background: linear-gradient(180deg, #bd2d25 0%, #991712 100%);
}

.rr-button--blue {
	background: linear-gradient(180deg, #326b7e 0%, #17485b 100%);
}

.rr-button__star {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	font-size: 23px;
	font-weight: 400;
	line-height: 1;
}

.rr-button:hover,
.rr-button:focus-visible {
	color: #fff5dc !important;
	filter: brightness(1.08);
	transform: translateY(-3px);
	box-shadow:
		0 8px 0 rgba(72, 33, 20, 0.16),
		inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.rr-button:active {
	transform: translateY(1px);
	box-shadow:
		0 3px 0 rgba(72, 33, 20, 0.18),
		inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

/* Hero: portátiles y tablets */

@media (max-width: 1250px) {
	.rr-hero {
		height: 760px;
		min-height: 760px;
		background-position: 53% center;
	}

	.rr-hero__content {
		width: min(50vw, 650px);
		margin-bottom: 85px;
		margin-left: 38px;
	}

	.rr-hero__title {
		font-size: clamp(70px, 7.2vw, 96px);
	}

	.rr-hero__text {
		max-width: 440px;
		font-size: 18px;
	}

	.rr-hero__buttons {
		grid-template-columns: repeat(2, 205px);
	}

	.rr-button {
		min-height: 54px;
		padding-inline: 17px;
		font-size: 18px;
	}
}

/* Hero: móvil */

@media (max-width: 767px) {
	.rr-hero {
		align-items: flex-start;
		height: 800px;
		min-height: 800px;
		background-color: #f3e2c5;
		background-position: 58% bottom;
		background-size: auto 72%;
	}

	.rr-hero::before {
		position: absolute;
		z-index: 1;
		inset: 0;
		background: linear-gradient(
			180deg,
			rgba(243, 226, 197, 1) 0%,
			rgba(243, 226, 197, 0.97) 30%,
			rgba(243, 226, 197, 0.7) 43%,
			rgba(243, 226, 197, 0) 59%
		);
		content: '';
		pointer-events: none;
	}

	.rr-hero__content {
		width: 100%;
		margin: 0;
		padding: 38px 20px 0;
	}

	.rr-hero__title {
		margin-bottom: 17px;
		font-size: clamp(59px, 17vw, 78px);
		line-height: 0.86;
	}

	.rr-hero__title-red {
		margin-top: 7px;
	}

	.rr-hero__text {
		max-width: 350px;
		margin-bottom: 20px;
		font-size: 17px;
		line-height: 1.22;
	}

	.rr-hero__buttons {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 9px;
		width: 100%;
	}

	.rr-button {
		min-height: 50px;
		padding: 9px 12px;
		font-size: 16px;
		letter-spacing: 0.025em;
	}

	.rr-button__star {
		font-size: 19px;
	}
}

@media (max-width: 370px) {
	.rr-hero__title {
		font-size: 55px;
	}

	.rr-hero__buttons {
		grid-template-columns: 1fr;
		width: 205px;
	}
}
/* HOME: menú flotando sobre el hero */

body.home .site-header {
	background: transparent;
}

body.home .site-header__main {
	position: absolute;
	top: var(--announcement-height);
	left: 0;
	right: 0;
	z-index: 1000;

	background: transparent;
	border-bottom: 0;
	box-shadow: none;
}

/* Evitar choque entre cabecera y contenido en móvil */

@media (max-width: 800px) {
	body.home .rr-hero__content {
		padding-top: calc(var(--header-height) + 30px);
	}
}
/* Overlay suave sobre el background del hero */

.rr-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background: rgba(20, 25, 27, 0.10);
	mix-blend-mode: multiply;

	pointer-events: none;
}
/* ==========================================================
   ROCK 'N' ROLLS — THE GREATEST HITS
   ========================================================== */

.rr-greatest,
.rr-greatest *,
.rr-greatest *::before,
.rr-greatest *::after {
	box-sizing: border-box;
}

.rr-greatest {
	position: relative;
	isolation: isolate;
	width: 100%;
	overflow: hidden;
	padding: 58px 0 68px;

	background-color: #f1dfbd;
	background-image:
		radial-gradient(
			circle,
			rgba(91, 59, 34, 0.08) 0 1px,
			transparent 1.4px
		);

	background-position: 0 0;
	background-size: 18px 18px;
}

/* Decoración sutil */

.rr-greatest::before {
	position: absolute;
	z-index: -1;
	top: -230px;
	left: -250px;

	width: 480px;
	height: 480px;

	border: 2px solid rgba(172, 31, 27, 0.11);
	border-radius: 50%;

	box-shadow:
		0 0 0 38px rgba(172, 31, 27, 0.025),
		0 0 0 76px rgba(172, 31, 27, 0.018);

	content: "";
	pointer-events: none;
}

.rr-greatest__container {
	width: calc(100% - 48px);
	max-width: 1180px;
	margin-inline: auto;
}

/* ==========================================================
   CABECERA DE LA SECCIÓN
   ========================================================== */

.rr-greatest__heading {
	display: grid;
	grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.55fr);
	align-items: end;
	gap: 50px;
	margin-bottom: 35px;
}

.rr-greatest__eyebrow {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 9px;

	color: #174b60;
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.17em;
	text-transform: uppercase;
}

.rr-greatest__eyebrow span {
	color: #ad211d;
	font-size: 15px;
}

.rr-greatest__title {
	margin: 0;
	padding: 0;

	color: #174b60;
	font-family: "Anton", Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
	font-size: clamp(54px, 5.1vw, 74px);
	font-weight: 400;
	line-height: 0.92;
	letter-spacing: 0.005em;
	text-transform: uppercase;
}

.rr-greatest__title span {
	color: #ad211d;
}

.rr-greatest__heading-copy {
	max-width: 330px;
	padding-bottom: 3px;
}

.rr-greatest__heading-copy p {
	margin: 0 0 14px;

	color: #332a23;
	font-family: "Inter", Arial, sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.45;
}

.rr-greatest__menu-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;

	color: #ad211d;
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.09em;
	text-decoration: none;
	text-transform: uppercase;
}

.rr-greatest__menu-link svg {
	width: 19px;
	height: 19px;

	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;

	transition: transform 180ms ease;
}

.rr-greatest__menu-link:hover svg {
	transform: translateX(4px);
}

/* ==========================================================
   GRID
   ========================================================== */

.rr-greatest__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

/* ==========================================================
   TARJETAS
   ========================================================== */

.rr-food-card {
	position: relative;
	min-width: 0;
	overflow: hidden;

	border: 1px solid rgba(64, 43, 29, 0.23);
	border-radius: 14px;

	background: #e0cca7;

	box-shadow:
		0 6px 0 rgba(78, 49, 29, 0.1),
		0 14px 24px rgba(62, 41, 26, 0.08);

	transition:
		transform 200ms ease,
		box-shadow 200ms ease;
}

.rr-food-card:hover {
	transform: translateY(-5px);

	box-shadow:
		0 9px 0 rgba(78, 49, 29, 0.08),
		0 19px 30px rgba(62, 41, 26, 0.13);
}

.rr-food-card__link {
	display: flex;
	flex-direction: column;
	height: 100%;

	color: inherit;
	text-decoration: none;
}

.rr-food-card__visual {
	position: relative;
	height: 250px;
	overflow: hidden;
}

/* Fondos individuales */

.rr-food-card--coffee .rr-food-card__visual {
	background:
		radial-gradient(
			circle at 52% 48%,
			#ead9ba 0%,
			#d8c09a 72%,
			#cbb187 100%
		);
}

.rr-food-card--roll .rr-food-card__visual {
	background:
		radial-gradient(
			circle at 50% 48%,
			#ead7b3 0%,
			#d9bd90 72%,
			#caa87b 100%
		);
}

.rr-food-card--toastie .rr-food-card__visual {
	background:
		radial-gradient(
			circle at 50% 48%,
			#e6d1ad 0%,
			#d3bb93 72%,
			#c4a77d 100%
		);
}

/* Textura ligera sobre las fotografías */

.rr-food-card__visual::after {
	position: absolute;
	inset: 0;
	z-index: 1;

	background:
		linear-gradient(
			180deg,
			rgba(255, 246, 226, 0.06) 0%,
			rgba(39, 29, 21, 0.06) 100%
		);

	content: "";
	pointer-events: none;
}

.rr-food-card__visual img {
	position: relative;
	z-index: 1;

	display: block;
	width: 100%;
	height: 100%;
	padding: 18px 22px 5px;

	object-fit: contain;
	object-position: center bottom;

	filter: drop-shadow(0 12px 11px rgba(55, 37, 25, 0.16));

	transition: transform 350ms ease;
}

.rr-food-card--coffee .rr-food-card__visual img {
	padding: 19px 34px 4px;
}

.rr-food-card--roll .rr-food-card__visual img {
	padding: 22px 20px 4px;
}

.rr-food-card--toastie .rr-food-card__visual img {
	padding: 16px 13px 0;
}

.rr-food-card:hover .rr-food-card__visual img {
	transform: scale(1.035);
}

/* Número */

.rr-food-card__number {
	position: absolute;
	z-index: 3;
	top: 14px;
	left: 14px;

	display: grid;
	width: 38px;
	height: 38px;
	place-items: center;

	border: 1px solid rgba(74, 48, 29, 0.2);
	border-radius: 50%;

	background: #f6e7c8;
	box-shadow:
		0 3px 8px rgba(65, 43, 27, 0.14),
		inset 0 1px 0 rgba(255, 255, 255, 0.8);

	color: #25211d;
	font-family: "Anton", Impact, sans-serif;
	font-size: 15px;
	line-height: 1;
}

/* ==========================================================
   PIE DE LAS TARJETAS
   ========================================================== */

.rr-food-card__information {
	display: flex;
	flex: 1;
	align-items: center;
	justify-content: space-between;
	gap: 14px;

	min-height: 92px;
	padding: 16px 17px 17px;

	color: #fff3d8;
}

.rr-food-card--coffee .rr-food-card__information {
	background: #ae211d;
}

.rr-food-card--roll .rr-food-card__information {
	background: #174f63;
}

.rr-food-card--toastie .rr-food-card__information {
	background: #292722;
}

.rr-food-card__text {
	min-width: 0;
}

.rr-food-card__label {
	display: block;
	margin-bottom: 5px;

	color: rgba(255, 243, 216, 0.72);
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.rr-food-card h3 {
	margin: 0;
	padding: 0;

	color: #fff3d8;
	font-family: "Anton", Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
	font-size: clamp(27px, 2.25vw, 34px);
	font-weight: 400;
	line-height: 0.96;
	letter-spacing: 0.005em;
	text-transform: uppercase;
}

.rr-food-card__arrow {
	display: grid;
	flex: 0 0 auto;

	width: 38px;
	height: 38px;
	place-items: center;

	border: 1px solid rgba(255, 243, 216, 0.62);
	border-radius: 50%;

	color: #fff3d8;

	transition:
		background-color 180ms ease,
		color 180ms ease,
		transform 180ms ease;
}

.rr-food-card__arrow svg {
	width: 20px;
	height: 20px;

	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
}

.rr-food-card:hover .rr-food-card__arrow {
	background: #fff0d1;
	color: #292722;
	transform: translateX(3px);
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 920px) {

	.rr-greatest {
		padding: 52px 0 60px;
	}

	.rr-greatest__heading {
		grid-template-columns: 1fr;
		gap: 16px;
		margin-bottom: 30px;
	}

	.rr-greatest__heading-copy {
		max-width: 520px;
	}

	.rr-greatest__heading-copy p {
		margin-bottom: 10px;
	}

	.rr-greatest__grid {
		gap: 14px;
	}

	.rr-food-card__visual {
		height: 215px;
	}

	.rr-food-card__information {
		min-height: 86px;
		padding: 14px;
	}

	.rr-food-card h3 {
		font-size: 26px;
	}

	.rr-food-card__arrow {
		width: 34px;
		height: 34px;
	}
}

/* ==========================================================
   MÓVIL
   ========================================================== */

@media (max-width: 767px) {

	.rr-greatest {
		padding: 46px 0 54px;
	}

	.rr-greatest__container {
		width: calc(100% - 30px);
		max-width: 500px;
	}

	.rr-greatest__heading {
		margin-bottom: 27px;
	}

	.rr-greatest__eyebrow {
		font-size: 10px;
		letter-spacing: 0.14em;
	}

	.rr-greatest__title {
		font-size: clamp(48px, 14vw, 62px);
	}

	.rr-greatest__heading-copy p {
		font-size: 14px;
	}

	.rr-greatest__grid {
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.rr-food-card {
		display: block;
	}

	.rr-food-card__visual {
		height: 220px;
	}

	.rr-food-card__information {
		min-height: 82px;
	}

	.rr-food-card h3 {
		font-size: 29px;
	}
}

/* ==========================================================
   MÓVILES PEQUEÑOS
   ========================================================== */

@media (max-width: 390px) {

	.rr-greatest__title {
		font-size: 46px;
	}

	.rr-food-card__visual {
		height: 205px;
	}

	.rr-food-card h3 {
		font-size: 27px;
	}
}
/* Quitar completamente los espacios entre hero y secciones */

.elementor-element.elementor-element-684ec0e {
	--gap: 0px !important;
	--row-gap: 0px !important;
	--column-gap: 0px !important;

	gap: 0 !important;
	row-gap: 0 !important;
	column-gap: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}

.elementor-element.elementor-element-684ec0e > .e-con-inner {
	gap: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

.elementor-element.elementor-element-684ec0e > .elementor-element,
.elementor-element.elementor-element-684ec0e > .elementor-widget {
	margin: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.elementor-element.elementor-element-684ec0e .elementor-widget-container {
	margin: 0 !important;
}

.rr-hero,
.rr-greatest {
	margin: 0 !important;
}
/* ==========================================================
   ROCK 'N' ROLLS — STORY
   ========================================================== */

.rr-story,
.rr-story *,
.rr-story *::before,
.rr-story *::after {
	box-sizing: border-box;
}

.rr-story {
	position: relative;
	isolation: isolate;
	width: 100%;
	overflow: hidden;
	margin: 0;
	padding: 72px 0;

	background-color: #f8f4eb;
	border-top: 1px solid rgba(42, 37, 31, 0.12);
	border-bottom: 1px solid rgba(42, 37, 31, 0.12);
}

/* Fondo decorativo muy suave */

.rr-story::before {
	position: absolute;
	z-index: -1;
	top: -210px;
	right: -220px;

	width: 440px;
	height: 440px;

	border: 1px solid rgba(23, 75, 96, 0.09);
	border-radius: 50%;

	box-shadow:
		0 0 0 38px rgba(23, 75, 96, 0.018),
		0 0 0 76px rgba(23, 75, 96, 0.012);

	content: "";
	pointer-events: none;
}

.rr-story__container {
	display: grid;
	grid-template-columns: minmax(0, 1.12fr) minmax(390px, 0.88fr);
	align-items: center;
	gap: clamp(46px, 5vw, 76px);

	width: calc(100% - 48px);
	max-width: 1200px;
	margin-inline: auto;
}

/* ==========================================================
   IMAGE
   ========================================================== */

.rr-story__visual {
	position: relative;
	height: 500px;
	overflow: visible;
}

.rr-story__visual::before {
	position: absolute;
	z-index: -1;
	inset: 15px -14px -15px 14px;

	border: 2px solid #174b60;
	border-radius: 18px;

	content: "";
	pointer-events: none;
}

.rr-story__visual img {
	display: block;
	width: 100%;
	height: 100%;

	border: 1px solid rgba(45, 34, 25, 0.24);
	border-radius: 18px;

	box-shadow:
		0 14px 32px rgba(45, 34, 25, 0.16),
		0 5px 0 rgba(72, 43, 24, 0.1);

	object-fit: cover;
	object-position: center;
}

/* ==========================================================
   OPEN TICKET
   ========================================================== */

.rr-story__ticket {
	position: absolute;
	right: -22px;
	bottom: 27px;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	width: 145px;
	min-height: 140px;
	padding: 15px 17px;

	border: 2px solid #ad211d;
	border-radius: 8px;

	background-color: #f3e2c2;
	background-image:
		radial-gradient(
			circle,
			rgba(84, 55, 34, 0.1) 0 0.7px,
			transparent 1.2px
		);

	background-size: 12px 12px;

	box-shadow:
		0 8px 20px rgba(45, 29, 19, 0.22),
		inset 0 0 0 5px #f3e2c2,
		inset 0 0 0 6px rgba(173, 33, 29, 0.28);

	color: #ad211d;
	text-align: center;
	text-transform: uppercase;

	transform: rotate(-4deg);
}

.rr-story__ticket::before,
.rr-story__ticket::after {
	position: absolute;
	top: 50%;

	width: 17px;
	height: 17px;

	border-radius: 50%;
	background: #f8f4eb;

	content: "";
	transform: translateY(-50%);
}

.rr-story__ticket::before {
	left: -10px;
}

.rr-story__ticket::after {
	right: -10px;
}

.rr-story__ticket-small {
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.13em;
}

.rr-story__ticket strong {
	display: block;
	margin: 5px 0 3px;

	font-family: "Anton", Impact, sans-serif;
	font-size: 47px;
	font-weight: 400;
	line-height: 0.95;
	letter-spacing: 0.01em;
}

.rr-story__ticket-line {
	width: 74px;
	height: 2px;
	margin: 3px 0 6px;
	background: #174b60;
}

/* ==========================================================
   CONTENT
   ========================================================== */

.rr-story__content {
	position: relative;
	max-width: 480px;
}

.rr-story__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 12px;

	color: #174b60;
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.rr-story__eyebrow span {
	color: #ad211d;
	font-size: 14px;
}

.rr-story__title {
	margin: 0;
	padding: 0;

	color: #174b60;
	font-family: "Anton", Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
	font-size: clamp(62px, 5.4vw, 82px);
	font-weight: 400;
	line-height: 0.88;
	letter-spacing: 0.005em;
	text-transform: uppercase;
}

.rr-story__title span {
	color: #ad211d;
}

.rr-story__divider {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	margin: 20px 0;
}

.rr-story__divider span {
	flex: 1;
	height: 1px;
	background: rgba(23, 75, 96, 0.32);
}

.rr-story__divider i {
	color: #ad211d;
	font-size: 14px;
	font-style: normal;
	line-height: 1;
}

.rr-story__lead {
	margin: 0 0 12px;

	color: #29241f;
	font-family: "Inter", Arial, sans-serif;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.42;
}

.rr-story__text {
	margin: 0;

	color: #655a50;
	font-family: "Inter", Arial, sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.55;
}

/* ==========================================================
   FACTS
   ========================================================== */

.rr-story__facts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 26px 0;

	border-top: 1px solid rgba(42, 37, 31, 0.14);
	border-bottom: 1px solid rgba(42, 37, 31, 0.14);
}

.rr-story-fact {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 9px;
	min-width: 0;
	padding: 17px 12px;
}

.rr-story-fact:first-child {
	padding-left: 0;
}

.rr-story-fact + .rr-story-fact {
	border-left: 1px solid rgba(42, 37, 31, 0.14);
}

.rr-story-fact svg {
	width: 22px;
	height: 22px;

	fill: none;
	stroke: #174b60;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
}

.rr-story-fact span {
	display: block;
	margin-bottom: 3px;

	color: #827366;
	font-family: "Inter", Arial, sans-serif;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.rr-story-fact strong {
	display: block;

	color: #ad211d;
	font-family: "Oswald", "Arial Narrow", sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: 0.035em;
	text-transform: uppercase;
	white-space: nowrap;
}

/* ==========================================================
   BUTTONS
   ========================================================== */

.rr-story__actions {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.rr-story-button {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;

	min-height: 54px;
	padding: 12px 17px;

	border: 2px solid rgba(54, 29, 20, 0.2);
	border-radius: 12px;

	box-shadow:
		0 5px 0 rgba(68, 40, 23, 0.13),
		inset 0 1px 0 rgba(255, 255, 255, 0.22);

	color: #fff3d8 !important;
	font-family: "Anton", Impact, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.055em;
	text-decoration: none !important;
	text-transform: uppercase;

	transition:
		transform 180ms ease,
		filter 180ms ease,
		box-shadow 180ms ease;
}

.rr-story-button--red {
	background: linear-gradient(180deg, #bd2d25 0%, #9e1915 100%);
}

.rr-story-button--blue {
	background: linear-gradient(180deg, #286379 0%, #174b60 100%);
}

.rr-story-button svg {
	width: 21px;
	height: 21px;

	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
}

.rr-story-button:hover {
	filter: brightness(1.07);
	transform: translateY(-3px);

	box-shadow:
		0 8px 0 rgba(68, 40, 23, 0.11),
		inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 1024px) {

	.rr-story {
		padding: 60px 0;
	}

	.rr-story__container {
		grid-template-columns: minmax(0, 1fr) minmax(340px, 0.9fr);
		gap: 42px;
	}

	.rr-story__visual {
		height: 440px;
	}

	.rr-story__ticket {
		right: -15px;
		width: 130px;
		min-height: 128px;
	}

	.rr-story__ticket strong {
		font-size: 42px;
	}

	.rr-story__title {
		font-size: 63px;
	}

	.rr-story__lead {
		font-size: 16px;
	}

	.rr-story-fact {
		padding-inline: 8px;
	}

	.rr-story-fact strong {
		font-size: 12px;
	}
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 767px) {

	.rr-story {
		padding: 48px 0 54px;
	}

	.rr-story__container {
		grid-template-columns: 1fr;
		gap: 48px;

		width: calc(100% - 30px);
		max-width: 520px;
	}

	.rr-story__visual {
		height: 315px;
	}

	.rr-story__visual::before {
		inset: 10px -8px -10px 8px;
		border-radius: 14px;
	}

	.rr-story__visual img {
		border-radius: 14px;
	}

	.rr-story__ticket {
		right: 10px;
		bottom: -28px;

		width: 116px;
		min-height: 108px;
		padding: 12px;
	}

	.rr-story__ticket-small {
		font-size: 9px;
	}

	.rr-story__ticket strong {
		margin-block: 3px;
		font-size: 36px;
	}

	.rr-story__ticket-line {
		width: 60px;
		margin-bottom: 4px;
	}

	.rr-story__content {
		max-width: none;
	}

	.rr-story__eyebrow {
		font-size: 10px;
	}

	.rr-story__title {
		font-size: clamp(56px, 17vw, 72px);
	}

	.rr-story__lead {
		font-size: 16px;
	}

	.rr-story__facts {
		margin: 23px 0;
	}

	.rr-story-fact {
		padding: 14px 7px;
	}

	.rr-story-fact:first-child {
		padding-left: 0;
	}

	.rr-story-fact svg {
		width: 19px;
		height: 19px;
	}

	.rr-story-fact span {
		font-size: 8px;
	}

	.rr-story-fact strong {
		font-size: 11px;
	}

	.rr-story-button {
		min-height: 51px;
		padding-inline: 14px;
		font-size: 16px;
	}
}

/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 390px) {

	.rr-story__visual {
		height: 280px;
	}

	.rr-story__title {
		font-size: 54px;
	}

	.rr-story__facts {
		grid-template-columns: 1fr;
	}

	.rr-story-fact {
		flex-direction: row;
		align-items: center;
		padding: 12px 0;
	}

	.rr-story-fact + .rr-story-fact {
		border-top: 1px solid rgba(42, 37, 31, 0.14);
		border-left: 0;
	}

	.rr-story__actions {
		grid-template-columns: 1fr;
	}
}
/* =====================================================
   ROCK 'N' ROLLS — HOW IT WORKS
===================================================== */

.rnr-how-it-works,
.rnr-how-it-works * {
    box-sizing: border-box;
}

.rnr-how-it-works {
    position: relative;
    width: 100vw;
    max-width: none;
    aspect-ratio: 1563 / 1011;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow: hidden;

    background-color: #07384d;
    background-image:
        url("https://rocknrolls.com.au/wp-content/uploads/2026/08/Background_how_it_works.webp");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 100%;

    isolation: isolate;
}


/* =====================================================
   MAIN HEADING
===================================================== */

.rnr-how-it-works__heading {
    position: absolute;
    z-index: 3;
    top: 7.2%;
    left: 50%;
    width: min(88%, 1180px);
    transform: translateX(-50%);

    display: grid;
    grid-template-columns: minmax(90px, 1fr) auto minmax(90px, 1fr);
    align-items: center;
    gap: clamp(16px, 2.2vw, 36px);
}

.rnr-how-it-works__title-group {
    text-align: center;
    padding-top: 35px;
}

.rnr-how-it-works__title-group h2 {
    margin: 0;
    color: #f8e8c7;

    font-family: "Bebas Neue", "Arial Narrow", sans-serif;
    font-size: clamp(34px, 4.2vw, 72px);
    font-weight: 700;
    line-height: 0.92;
    letter-spacing: 0.035em;
    text-transform: uppercase;

    text-shadow: 0 3px 0 rgba(0, 0, 0, 0.16);
}

.rnr-how-it-works__title-group h2 span {
    color: #c42a28;
}

.rnr-how-it-works__title-group p {
    max-width: 650px;
    margin: clamp(8px, 1vw, 15px) auto 0;

    color: rgba(248, 232, 199, 0.9);
    font-family: "Montserrat", Arial, sans-serif;
    font-size: clamp(11px, 1.05vw, 17px);
    font-weight: 600;
    line-height: 1.5;
}


/* =====================================================
   SIDE LINES AND STARS
===================================================== */

.rnr-heading-decoration {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: clamp(9px, 1vw, 15px);
}

.rnr-heading-decoration--right {
    justify-content: flex-start;
}

.rnr-heading-decoration__lines {
    display: block;
    position: relative;
    width: 100%;
    max-width: 190px;
    height: 18px;
    border-top: 2px solid rgba(248, 232, 199, 0.78);
    border-bottom: 2px solid rgba(248, 232, 199, 0.78);
}

.rnr-heading-decoration__lines::after {
    content: "";
    position: absolute;
    top: 7px;
    right: 0;
    width: 78%;
    border-top: 2px solid rgba(248, 232, 199, 0.78);
}

.rnr-heading-decoration--right
.rnr-heading-decoration__lines::after {
    right: auto;
    left: 0;
}

.rnr-heading-decoration__star {
    flex: 0 0 auto;
    color: #c42a28;
    font-size: clamp(18px, 1.8vw, 30px);
    line-height: 1;
}


/* =====================================================
   EXTRA STATIC DECORATION
===================================================== */

.rnr-spark {
    position: absolute;
    z-index: 2;
    color: rgba(248, 232, 199, 0.72);
    font-size: clamp(13px, 1.4vw, 24px);
    line-height: 1;
    pointer-events: none;
}

.rnr-spark--one {
    left: 6%;
    top: 71%;
    color: #c42a28;
    transform: rotate(12deg);
}

.rnr-spark--two {
    left: 13%;
    top: 82%;
    font-size: clamp(18px, 2vw, 32px);
}

.rnr-spark--three {
    left: 28%;
    top: 75%;
    color: rgba(248, 232, 199, 0.52);
}

.rnr-spark--four {
    right: 27%;
    top: 77%;
    color: rgba(248, 232, 199, 0.52);
}

.rnr-spark--five {
    right: 13%;
    top: 83%;
    font-size: clamp(18px, 2vw, 32px);
}

.rnr-spark--six {
    right: 6%;
    top: 70%;
    color: #c42a28;
    transform: rotate(-12deg);
}


/* =====================================================
   CTA
===================================================== */

.rnr-how-it-works__cta {
    position: absolute;
    z-index: 4;
    bottom: 15.5%;
    left: 50%;
    transform: translateX(-50%);
}

.rnr-order-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 24px;

    min-width: clamp(230px, 21vw, 340px);
    min-height: clamp(56px, 5vw, 78px);
    padding: 12px 28px;

    color: #fff3d6;
    background: linear-gradient(180deg, #cf302e 0%, #a91319 100%);
    border: 3px solid #7e1014;
    border-radius: 13px;

    box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.25),
        0 8px 0 #671017,
        0 13px 22px rgba(0, 0, 0, 0.28);

    font-family: "Bebas Neue", "Arial Narrow", sans-serif;
    font-size: clamp(21px, 2vw, 34px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.075em;
    text-decoration: none;
    text-transform: uppercase;

    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        filter 180ms ease;
}

.rnr-order-button__star {
    font-size: 0.7em;
    transition: transform 180ms ease;
}

.rnr-order-button:hover {
    color: #fff3d6;
    filter: brightness(1.08);
    transform: translateY(-3px);

    box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.28),
        0 11px 0 #671017,
        0 17px 26px rgba(0, 0, 0, 0.32);
}

.rnr-order-button:hover .rnr-order-button__star {
    transform: rotate(90deg) scale(1.15);
}

.rnr-order-button:active {
    transform: translateY(4px);
    box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.2),
        0 4px 0 #671017,
        0 8px 14px rgba(0, 0, 0, 0.25);
}

.rnr-order-button:focus-visible {
    outline: 4px solid #f5dfaa;
    outline-offset: 6px;
}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 1024px) {

    .rnr-how-it-works__heading {
        top: 6.8%;
        width: 92%;
        grid-template-columns: minmax(55px, 1fr) auto minmax(55px, 1fr);
        gap: 14px;
    }

    .rnr-how-it-works__title-group p {
        max-width: 520px;
    }

    .rnr-order-button {
        gap: 17px;
        border-width: 2px;
        border-radius: 10px;
    }

}


/* =====================================================
   MOBILE
   The complete background remains visible without cropping.
===================================================== */

@media (max-width: 767px) {

    .rnr-how-it-works {
        aspect-ratio: 1563 / 1011;
    }

    .rnr-how-it-works__heading {
        top: 6%;
        width: 94%;
        grid-template-columns: 42px auto 42px;
        gap: 7px;
    }

    .rnr-how-it-works__title-group h2 {
        font-size: clamp(20px, 7vw, 34px);
    }

    .rnr-how-it-works__title-group p {
        display: none;
    }

    .rnr-heading-decoration {
        gap: 5px;
    }

    .rnr-heading-decoration__lines {
        height: 9px;
        border-width: 1px;
    }

    .rnr-heading-decoration__lines::after {
        top: 3px;
        border-width: 1px;
    }

    .rnr-heading-decoration__star {
        font-size: 12px;
    }

    .rnr-how-it-works__cta {
        bottom: 15.5%;
    }

    .rnr-order-button {
        min-width: 145px;
        min-height: 34px;
        padding: 7px 14px;
        gap: 10px;

        border-width: 1px;
        border-radius: 6px;

        font-size: 15px;

        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.25),
            0 4px 0 #671017,
            0 7px 12px rgba(0, 0, 0, 0.25);
    }

    .rnr-spark {
        font-size: 9px;
    }

    .rnr-spark--two,
    .rnr-spark--five {
        font-size: 12px;
    }

}
/* =====================================================
   ROCK 'N' ROLLS — FOOTER
===================================================== */

.rnr-footer,
.rnr-footer * {
    box-sizing: border-box;
}

.rnr-footer {
    --blue: #07384d;
    --dark-blue: #032b3d;
    --red: #c52626;
    --cream: #f6e8ca;
    --cream-soft: rgba(246, 232, 202, 0.78);
    --cream-muted: rgba(246, 232, 202, 0.63);

    position: relative;
    width: 100%;
    overflow: hidden;

    color: var(--cream);
    background-color: var(--dark-blue);

    background-image:
        radial-gradient(
            circle,
            rgba(246, 232, 202, 0.15) 0 1px,
            transparent 1.5px
        );

    background-size: 8px 8px;
    font-family: "Montserrat", Arial, sans-serif;
}

.rnr-footer__accent {
    height: 11px;

    background:
        linear-gradient(
            to bottom,
            #d32d2d 0 4px,
            #8c1518 4px 7px,
            #d6c7a8 7px 9px,
            transparent 9px
        );
}


/* MAIN GRID */

.rnr-footer__container {
    display: grid;
    grid-template-columns:
        minmax(230px, 1.15fr)
        minmax(120px, 0.56fr)
        minmax(140px, 0.68fr)
        minmax(190px, 0.82fr)
        minmax(280px, 1.3fr);

    align-items: start;
    gap: clamp(34px, 3.4vw, 65px);

    width: min(1500px, 91%);
    margin: 0 auto;
    padding: clamp(52px, 4.6vw, 74px) 0;
}


/* LOGO AND BRAND */

.rnr-footer__logo {
    display: inline-block;
    margin-bottom: 18px;
}

.rnr-footer__logo img {
    display: block;
    width: auto;
    height: auto;
    max-width: 136px;
    max-height: 125px;
    object-fit: contain;
}

.rnr-footer__brand p {
    max-width: 310px;
    margin: 0;

    color: var(--cream-soft);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.7;
}


/* HEADINGS */

.rnr-footer h3 {
    position: relative;
    margin: 0 0 24px;
    padding-bottom: 11px;

    color: var(--cream);
    font-family: "Bebas Neue", "Arial Narrow", sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.1em;
    white-space: nowrap;
}

.rnr-footer h3::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;

    width: 30px;
    height: 2px;
    background: var(--red);
}


/* NAVIGATION */

.rnr-footer__column ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.rnr-footer__column li + li {
    margin-top: 13px;
}

.rnr-footer__column a {
    display: inline-flex;
    align-items: center;

    color: var(--cream-soft);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    text-decoration: none;

    transition:
        color 160ms ease,
        transform 160ms ease;
}

.rnr-footer__column a::before {
    content: "";
    width: 4px;
    height: 4px;
    margin-right: 0;

    background: var(--red);
    border-radius: 50%;

    opacity: 0;
    transform: translateX(-5px);

    transition:
        opacity 160ms ease,
        margin 160ms ease,
        transform 160ms ease;
}

.rnr-footer__column a:hover {
    color: var(--cream);
    transform: translateX(3px);
}

.rnr-footer__column a:hover::before {
    margin-right: 7px;
    opacity: 1;
    transform: translateX(0);
}


/* OPENING HOURS AND PHONE */

.rnr-footer__contact-item {
    padding-bottom: 18px;
    margin-bottom: 18px;
    border-bottom: 1px solid rgba(246, 232, 202, 0.17);
}

.rnr-footer__contact-item small {
    display: block;
    margin-bottom: 8px;

    color: var(--cream-muted);
    font-family: "Bebas Neue", "Arial Narrow", sans-serif;
    font-size: 11px;
    line-height: 1;
    letter-spacing: 0.15em;
}

.rnr-footer__contact-item strong,
.rnr-footer__contact-item a {
    display: block;

    color: var(--cream);
    font-family: "Bebas Neue", "Arial Narrow", sans-serif;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0.04em;
    text-decoration: none;
}

.rnr-footer__hours {
    white-space: nowrap;
}

.rnr-footer__contact-item a:hover {
    color: var(--red);
}


/* MAP */

.rnr-footer__map {
    position: relative;
    height: 190px;
    padding: 5px;
    overflow: hidden;

    background: #d8c9ab;
    border: 1px solid rgba(246, 232, 202, 0.55);
    border-radius: 8px;

    box-shadow:
        0 9px 22px rgba(0, 0, 0, 0.23),
        0 0 0 3px rgba(3, 43, 61, 0.9),
        0 0 0 4px rgba(246, 232, 202, 0.22);
}

.rnr-footer__map iframe {
    display: block;
    width: 100%;
    height: 100%;

    border: 0;
    border-radius: 4px;

    filter:
        grayscale(1)
        contrast(1.06)
        brightness(0.92)
        sepia(0.06);
}


/* ADDRESS UNDER MAP */

.rnr-footer__address {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-top: 16px;

    color: var(--cream);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.4;
    text-decoration: none;

    transition: color 160ms ease;
}

.rnr-footer__address svg {
    flex: 0 0 27px;
    width: 27px;
    height: 27px;

    fill: none;
    stroke: var(--red);
    stroke-width: 1.7;
}

.rnr-footer__address span {
    display: block;
}

.rnr-footer__address small {
    display: block;
    margin-top: 3px;

    color: var(--cream-muted);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.rnr-footer__address:hover {
    color: var(--red);
}


/* BOTTOM BAR */

.rnr-footer__bottom {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 28px;

    padding: 23px 4.5%;

    color: rgba(246, 232, 202, 0.74);
    background: rgba(0, 0, 0, 0.24);

    border-top: 1px solid rgba(246, 232, 202, 0.18);

    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
}

.rnr-footer__bottom p {
    margin: 0;
}

.rnr-footer__credit {
    text-align: center;
    white-space: nowrap;
}

.rnr-footer__credit a {
    margin-left: 4px;

    color: var(--cream);
    font-weight: 700;
    text-decoration: none;

    border-bottom: 1px solid var(--red);
}

.rnr-footer__credit a:hover {
    color: var(--red);
}

.rnr-footer__legal {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 18px;
}

.rnr-footer__legal a {
    color: rgba(246, 232, 202, 0.76);
    font-size: 12px;
    font-weight: 550;
    line-height: 1.4;
    text-decoration: none;
    white-space: nowrap;

    transition: color 160ms ease;
}

.rnr-footer__legal a:hover {
    color: var(--cream);
}


/* MEDIUM DESKTOP */

@media (max-width: 1250px) {

    .rnr-footer__container {
        grid-template-columns:
            minmax(220px, 1fr)
            minmax(120px, 0.55fr)
            minmax(140px, 0.65fr)
            minmax(180px, 0.8fr);

        width: 90%;
    }

    .rnr-footer__location {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 1fr 2fr;
        column-gap: 35px;
    }

    .rnr-footer__location h3 {
        grid-column: 1;
    }

    .rnr-footer__map {
        grid-column: 2;
        grid-row: 1 / span 3;
        height: 225px;
    }

    .rnr-footer__address {
        grid-column: 1;
        align-self: end;
        margin-top: 0;
    }

    .rnr-footer__bottom {
        grid-template-columns: 1fr 1fr;
    }

    .rnr-footer__credit {
        grid-column: 1 / -1;
        grid-row: 1;
    }

}


/* TABLET */

@media (max-width: 900px) {

    .rnr-footer__container {
        grid-template-columns: 1fr 1fr;
        gap: 45px 35px;
    }

    .rnr-footer__brand,
    .rnr-footer__location {
        grid-column: 1 / -1;
    }

    .rnr-footer__contact {
        grid-column: 1 / -1;
    }

    .rnr-footer__contact {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 25px;
    }

    .rnr-footer__contact h3 {
        grid-column: 1 / -1;
    }

    .rnr-footer__location {
        display: block;
    }

    .rnr-footer__map {
        height: 240px;
    }

    .rnr-footer__address {
        margin-top: 16px;
    }

    .rnr-footer__bottom {
        display: flex;
        flex-direction: column;
        gap: 12px;
        text-align: center;
    }

    .rnr-footer__credit {
        order: -1;
    }

    .rnr-footer__legal {
        justify-content: center;
        flex-wrap: wrap;
    }

}


/* MOBILE */

@media (max-width: 560px) {

    .rnr-footer__container {
        grid-template-columns: 1fr;
        width: 86%;
        gap: 43px;
        padding: 50px 0;
    }

    .rnr-footer__brand,
    .rnr-footer__contact,
    .rnr-footer__location {
        grid-column: auto;
    }

    .rnr-footer__brand,
    .rnr-footer__column,
    .rnr-footer__contact,
    .rnr-footer__location {
        text-align: center;
    }

    .rnr-footer__logo img {
        margin: 0 auto;
    }

    .rnr-footer__brand p {
        margin: 0 auto;
    }

    .rnr-footer h3::after {
        left: 50%;
        transform: translateX(-50%);
    }

    .rnr-footer__column a {
        justify-content: center;
    }

    .rnr-footer__contact {
        display: block;
    }

    .rnr-footer__hours {
        white-space: normal;
    }

    .rnr-footer__map {
        height: 230px;
    }

    .rnr-footer__address {
        justify-content: center;
        text-align: left;
    }

    .rnr-footer__bottom {
        padding: 25px 7%;
    }

    .rnr-footer__legal {
        gap: 9px 15px;
    }

}
.entry__title {
    display:none!important;
}
/* =====================================================
   ROCK 'N' ROLLS — LOGIN COMPACTO
   ===================================================== */

body.page-id-107 main#content > .page-header,
body.page-id-107 main#content > .entry-header,
body.page-id-107 main#content > h1:first-child,
body.page-id-107 .site-main > .page-header,
body.page-id-107 .site-main > .entry-header,
body.page-id-107 .wp-block-post-title,
body.page-id-107 h1.entry-title {
    display: none !important;
}

body.page-id-107 main#content,
body.page-id-107 .site-main,
body.page-id-107 .page-content,
body.page-id-107 .entry-content {
    margin: 0 !important;
    padding: 0 !important;
}

.rnr-auth,
.rnr-auth * {
    box-sizing: border-box;
}

.rnr-auth {
    --rnr-red: #bd1927;
    --rnr-red-dark: #8f111b;
    --rnr-navy: #0d3147;
    --rnr-cream: #f6ead6;
    --rnr-light: #fffaf0;
    --rnr-text: #173548;

    position: relative;
    width: 100%;
    height: calc(100svh - 220px);
    min-height: 580px;
    overflow: hidden;
    isolation: isolate;

    background-color: var(--rnr-cream);
    background-image:
        url("https://rocknrolls.com.au/wp-content/uploads/2026/08/rock-n-rolls-airstream-diner-login-background-braemar.webp");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;

    font-family: "Montserrat", Arial, sans-serif;
}

body.admin-bar .rnr-auth {
    height: calc(100svh - 252px);
}

/* Suavizado detrás del formulario */

.rnr-auth__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;

    background: linear-gradient(
        90deg,
        rgba(246, 234, 214, 0) 0%,
        rgba(246, 234, 214, 0) 48%,
        rgba(246, 234, 214, 0.35) 66%,
        rgba(246, 234, 214, 0.72) 100%
    );
}

/* DISTRIBUCIÓN */

.rnr-auth__layout {
    width: min(100%, 1500px);
    height: 100%;
    margin: 0 auto;
    padding: 22px clamp(35px, 5vw, 78px);

    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(370px, 445px);
    align-items: center;
    gap: clamp(30px, 5vw, 75px);
}

.rnr-auth__card {
    position: relative;
    width: 100%;
    max-height: calc(100% - 20px);
    padding: 7px;
    border-radius: 22px;
    color: var(--rnr-text);
    background: var(--rnr-navy);

    box-shadow:
        8px 9px 0 var(--rnr-red),
        0 18px 45px rgba(8, 35, 51, 0.22);
}

.rnr-auth__card::before {
    content: "";
    position: absolute;
    inset: 4px;
    z-index: 0;
    border: 1px solid var(--rnr-cream);
    border-radius: 18px;
    pointer-events: none;
}

.rnr-auth__tabs,
.rnr-auth__panel,
.rnr-auth__secure {
    position: relative;
    z-index: 1;
}

/* TABS */

.rnr-auth__tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    padding: 5px 5px 0;
}

.rnr-auth__tab {
    min-height: 44px;
    padding: 9px 15px;
    border: 0;
    border-radius: 12px 12px 4px 4px;

    color: var(--rnr-cream);
    background: rgba(255, 255, 255, 0.1);

    font-family: "Oswald", "Arial Narrow", Arial, sans-serif;
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;

    cursor: pointer;
    transition: background 0.18s ease;
}

.rnr-auth__tab:hover {
    background: rgba(255, 255, 255, 0.16);
}

.rnr-auth__tab.is-active {
    color: #ffffff;
    background: var(--rnr-red);
}

/* PANEL INTERIOR */

.rnr-auth__panel {
    margin: 6px;
    padding: 19px 25px 20px;
    border-radius: 6px 6px 15px 15px;

    background:
        radial-gradient(
            circle at 20% 0%,
            rgba(255, 255, 255, 0.68),
            transparent 38%
        ),
        var(--rnr-cream);

    animation: rnrPanelIn 0.22s ease both;
}

.rnr-auth__panel[hidden] {
    display: none !important;
}

@keyframes rnrPanelIn {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* CABECERA */

.rnr-auth__heading {
    margin-bottom: 16px;
    text-align: center;
}

.rnr-auth__eyebrow {
    display: inline-block;
    margin-bottom: 6px;
    color: var(--rnr-red);

    font-size: 9px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.rnr-auth__heading h1,
.rnr-auth__heading h2 {
    margin: 0;
    color: var(--rnr-navy);

    font-family: "Oswald", "Arial Narrow", Arial, sans-serif;
    font-size: clamp(31px, 3vw, 41px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.rnr-auth__heading p {
    max-width: 340px;
    margin: 8px auto 0;
    color: #596c76;
    font-size: 11px;
    line-height: 1.45;
}

.rnr-auth__divider {
    width: 155px;
    margin: 9px auto 0;

    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 7px;

    color: var(--rnr-red);
}

.rnr-auth__divider i {
    height: 1px;
    display: block;
    background: currentColor;
    opacity: 0.6;
}

.rnr-auth__divider b {
    font-size: 11px;
    line-height: 1;
}

/* FORMULARIOS */

.rnr-auth__form {
    display: grid;
    gap: 11px;
}

.rnr-auth__columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.rnr-auth__field {
    display: grid;
    gap: 5px;
}

.rnr-auth__field label,
.rnr-auth__label-row label {
    margin: 0;
    color: var(--rnr-navy);

    font-size: 9px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.rnr-auth__label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.rnr-auth__label-row a {
    color: var(--rnr-red);
    font-size: 9px;
    font-weight: 800;
    text-decoration: none;
}

.rnr-auth__label-row a:hover {
    text-decoration: underline;
}

.rnr-auth__field input {
    width: 100%;
    height: 42px;
    margin: 0;
    padding: 0 13px;

    border: 1px solid rgba(13, 49, 71, 0.38);
    border-radius: 7px;
    outline: none;

    color: var(--rnr-text);
    background: rgba(255, 250, 240, 0.88);

    font: inherit;
    font-size: 12px;
    box-shadow: none;

    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

.rnr-auth__field input::placeholder {
    color: #8a9295;
}

.rnr-auth__field input:focus {
    border-color: var(--rnr-red);
    box-shadow: 0 0 0 3px rgba(189, 25, 39, 0.1);
}

/* CONTRASEÑA */

.rnr-auth__password {
    position: relative;
}

.rnr-auth__password input {
    padding-right: 44px;
}

.rnr-auth__password-toggle {
    position: absolute;
    top: 50%;
    right: 5px;

    width: 33px;
    height: 33px;
    padding: 8px;

    border: 0;
    border-radius: 50%;
    color: var(--rnr-navy);
    background: transparent;

    transform: translateY(-50%);
    cursor: pointer;
}

.rnr-auth__password-toggle:hover {
    background: rgba(13, 49, 71, 0.08);
}

.rnr-auth__password-toggle svg {
    width: 100%;
    height: 100%;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
}

/* CHECKBOXES */

.rnr-auth__remember,
.rnr-auth__terms {
    margin: 0;
    display: flex;
    align-items: flex-start;
    gap: 8px;

    color: #556871;
    font-size: 10px;
    line-height: 1.4;
    cursor: pointer;
}

.rnr-auth__remember {
    align-items: center;
}

.rnr-auth__remember input,
.rnr-auth__terms input {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    margin: 0;
    accent-color: var(--rnr-red);
}

.rnr-auth__terms a {
    color: var(--rnr-red);
    font-weight: 800;
}

/* BOTÓN */

.rnr-auth__submit {
    min-height: 45px;
    margin-top: 1px;
    padding: 10px 18px;
    border: 0;
    border-radius: 7px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    color: #ffffff;
    background: var(--rnr-red);

    font-family: "Oswald", "Arial Narrow", Arial, sans-serif;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;

    cursor: pointer;

    box-shadow: 0 4px 0 var(--rnr-red-dark);

    transition:
        transform 0.16s ease,
        box-shadow 0.16s ease,
        background 0.16s ease;
}

.rnr-auth__submit:hover {
    background: #cb2230;
    transform: translateY(-1px);
    box-shadow: 0 5px 0 var(--rnr-red-dark);
}

.rnr-auth__submit:active {
    transform: translateY(3px);
    box-shadow: 0 1px 0 var(--rnr-red-dark);
}

.rnr-auth__submit svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* CAMBIO LOGIN / REGISTRO */

.rnr-auth__switch {
    margin: 15px 0 0;
    padding-top: 12px;
    border-top: 1px solid rgba(13, 49, 71, 0.16);

    color: #52666f;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
}

.rnr-auth__switch button {
    padding: 0;
    border: 0;
    color: var(--rnr-red);
    background: transparent;

    font: inherit;
    font-weight: 900;
    text-decoration: underline;
    cursor: pointer;
}

/* SEGURIDAD */

.rnr-auth__secure {
    margin: 0 6px 5px;
    padding: 6px 14px 8px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    color: rgba(246, 234, 214, 0.82);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.rnr-auth__secure svg {
    width: 11px;
    height: 11px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
}

/* MENSAJES */

.rnr-auth__message {
    display: none;
    padding: 8px 10px;
    border-radius: 6px;
    font-size: 10px;
    line-height: 1.4;
}

.rnr-auth__message.is-visible {
    display: block;
}

.rnr-auth__message.is-error {
    display: block;
    color: #8b1520;
    background: rgba(189, 25, 39, 0.1);
    border: 1px solid rgba(189, 25, 39, 0.24);
}

.rnr-auth__message.is-success {
    display: block;
    color: #225d42;
    background: rgba(45, 134, 91, 0.11);
    border: 1px solid rgba(45, 134, 91, 0.24);
}

/* PORTÁTILES */

@media (max-width: 1200px) {
    .rnr-auth__layout {
        grid-template-columns: minmax(0, 1fr) minmax(350px, 415px);
        padding: 18px 34px;
        gap: 30px;
    }

    .rnr-auth {
        background-position: 45% center;
    }
}

/* MÓVIL Y TABLET */

@media (max-width: 780px) {
    .rnr-auth {
        height: auto;
        min-height: calc(100svh - 150px);
        padding-top: 220px;
        overflow: visible;

        background-position: 27% top;
        background-size: auto 305px;
        background-color: var(--rnr-cream);
    }

    body.admin-bar .rnr-auth {
        height: auto;
    }

    .rnr-auth__shade {
        background: linear-gradient(
            180deg,
            rgba(246, 234, 214, 0) 0,
            rgba(246, 234, 214, 0.1) 160px,
            var(--rnr-cream) 290px
        );
    }

    .rnr-auth__layout {
        height: auto;
        min-height: 0;
        padding: 0 16px 30px;
        display: block;
    }

    .rnr-auth__space {
        display: none;
    }

    .rnr-auth__card {
        width: 100%;
        max-width: 475px;
        max-height: none;
        margin: 0 auto;
    }
}

@media (max-width: 480px) {
    .rnr-auth {
        padding-top: 190px;
        background-position: 25% top;
        background-size: auto 265px;
    }

    .rnr-auth__columns {
        grid-template-columns: 1fr;
    }

    .rnr-auth__panel {
        padding: 18px 16px 19px;
    }

    .rnr-auth__heading h1,
    .rnr-auth__heading h2 {
        font-size: 32px;
    }

    .rnr-auth__tab {
        min-height: 42px;
        font-size: 13px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rnr-auth *,
    .rnr-auth *::before,
    .rnr-auth *::after {
        animation: none !important;
        transition: none !important;
    }
}
/* Quitar el texto inferior que queda atrapado */
.rnr-auth__secure {
    display: none !important;
}

/* Cerrar correctamente el cuadro */
.rnr-auth__panel {
    margin-bottom: 6px !important;
}

.rnr-auth__card {
    max-height: none !important;
}

/* Ajustar el login dentro de la pantalla */
.rnr-auth__layout {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
}

/* Compactar ligeramente el formulario */
.rnr-auth__heading {
    margin-bottom: 12px !important;
}

.rnr-auth__form {
    gap: 9px !important;
}

.rnr-auth__switch {
    margin-top: 11px !important;
    padding-top: 9px !important;
}

/* ==========================================================
   ROCK N ROLLS — COMPACT PREMIUM SINGLE PRODUCT
   ========================================================== */

body.single-product {
    background: var(--colour-cream, #f4ead8);
}

.single-product .site-main {
    padding: clamp(18px, 2vw, 30px) 0 54px;
    background: linear-gradient(180deg, #f7efe1 0%, #efe1ca 100%);
}

.single-product .content-area,
.single-product .site-main > .container,
.single-product .woocommerce {
    width: min(calc(100% - 40px), 1540px);
    max-width: 1540px;
    margin-inline: auto;
    padding-inline: 0;
}

/* Product card */

.single-product .woocommerce div.product {
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(440px, 0.94fr);
    width: 100%;
    margin: 0;
    overflow: hidden;
    background: #fffaf1;
    border: 1px solid rgba(23, 57, 76, 0.16);
    border-radius: 20px;
    box-shadow:
        0 22px 54px rgba(31, 40, 46, 0.14),
        0 3px 10px rgba(31, 40, 46, 0.07);
}

.single-product .woocommerce div.product::before,
.single-product .woocommerce div.product::after {
    display: none;
    content: none;
}

/* ==========================================================
   PRODUCT GALLERY
   ========================================================== */

.single-product div.product div.images,
.single-product .woocommerce-product-gallery {
    position: relative;
    float: none;
    display: block;
    width: 100%;
    min-width: 0;
    height: 520px;
    min-height: 520px;
    margin: 0;
    overflow: hidden;
    box-sizing: border-box;
    background:
        radial-gradient(
            ellipse at 50% 48%,
            rgba(104, 190, 192, 0.88) 0%,
            rgba(56, 125, 146, 0.68) 37%,
            rgba(21, 58, 77, 0) 70%
        ),
        linear-gradient(145deg, #214f63 0%, #173b4f 54%, #102d3d 100%);
    border-right: 1px solid rgba(23, 57, 76, 0.16);
    box-shadow: inset 0 -6px 0 #b91f27;
}

.single-product .woocommerce-product-gallery::before,
.single-product .woocommerce-product-gallery::after {
    display: none;
    content: none;
}

.single-product .woocommerce-product-gallery .flex-viewport,
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper {
    width: 100%;
    height: 520px !important;
    min-height: 520px !important;
    margin: 0;
}

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 520px !important;
    min-height: 520px !important;
    padding: 24px 38px 68px !important;
    box-sizing: border-box;
}

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
}

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img:not(.zoomImg) {
    display: block !important;
    width: min(74%, 620px) !important;
    max-width: 100% !important;
    height: 360px !important;
    max-height: 100% !important;
    margin: auto !important;
    object-fit: contain !important;
    object-position: 50% 50% !important;
    background: transparent !important;
    opacity: 1 !important;
    filter:
        drop-shadow(0 20px 17px rgba(0, 0, 0, 0.22))
        drop-shadow(0 5px 5px rgba(0, 0, 0, 0.13));
    transform: none !important;
}

/* Disable WooCommerce hover zoom without affecting the original image. */

.single-product .woocommerce-product-gallery .zoomImg {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.single-product .woocommerce-product-gallery__trigger {
    top: 18px !important;
    right: 18px !important;
    z-index: 8;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 42px !important;
    height: 42px !important;
    background: #fffaf1 !important;
    border: 1px solid rgba(23, 57, 76, 0.22) !important;
    border-radius: 10px !important;
    box-shadow: 0 7px 18px rgba(0, 0, 0, 0.14);
}

/* Thumbnails */

.single-product .woocommerce-product-gallery .flex-control-thumbs {
    position: absolute;
    bottom: 13px;
    left: 50%;
    z-index: 7;
    display: flex;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    backdrop-filter: none;
    transform: translateX(-50%);
}

.single-product .woocommerce-product-gallery .flex-control-thumbs li {
    float: none;
    width: 46px;
    height: 44px;
    margin: 0;
}

.single-product .woocommerce-product-gallery .flex-control-thumbs img {
    width: 100% !important;
    height: 100% !important;
    padding: 4px;
    object-fit: contain;
    background: rgba(255, 250, 241, 0.88);
    border: 1px solid rgba(255, 255, 255, 0.54);
    border-radius: 6px;
    opacity: 0.66;
    cursor: pointer;
    transition:
        opacity 160ms ease,
        border-color 160ms ease,
        transform 160ms ease;
}

.single-product .woocommerce-product-gallery .flex-control-thumbs img:hover {
    opacity: 1;
    border-color: rgba(255, 255, 255, 0.72);
    transform: translateY(-1px);
}

.single-product .woocommerce-product-gallery .flex-control-thumbs img.flex-active {
    opacity: 1;
    border-color: #bd2028;
    background: #fffaf1;
    box-shadow: 0 0 0 1px rgba(255, 250, 241, 0.82);
    transform: none;
}

/* Secondary gallery images use a wider internal canvas.
   This compensates visually without moving the principal image. */

.single-product
.woocommerce-product-gallery__wrapper
> .woocommerce-product-gallery__image:nth-child(n + 2)
img:not(.zoomImg) {
    transform: translateX(-20%) !important;
}

/* ==========================================================
   PRODUCT INFORMATION
   ========================================================== */

.single-product div.product div.summary {
    float: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    min-width: 0;
    height: 520px;
    min-height: 520px;
    margin: 0;
    padding: clamp(28px, 3vw, 44px);
    box-sizing: border-box;
    background: #fffaf1;
}

.single-product div.product div.summary::before {
    display: none !important;
    content: none !important;
}

.single-product div.product div.summary h1.product_title.entry-title,
.single-product div.product div.summary .rnr-product-title {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin: 0 0 11px !important;
    color: #17394c !important;
    font-family: var(--font-display, sans-serif);
    font-size: clamp(34px, 2.8vw, 46px);
    font-weight: 700;
    line-height: 0.98;
    letter-spacing: 0.012em;
    text-transform: uppercase;
}

.single-product div.product p.price {
    display: flex;
    align-items: center;
    width: fit-content;
    margin: 0 0 17px;
    padding: 0 0 6px;
    color: #bd2028;
    font-family: var(--font-display, sans-serif);
    font-size: clamp(32px, 2.35vw, 40px);
    font-weight: 700;
    line-height: 1;
    border-bottom: 3px solid #bd2028;
}

.single-product div.product p.price ins {
    color: inherit;
    text-decoration: none;
}

.single-product div.product p.price del {
    margin-right: 10px;
    color: #7a7a72;
    font-size: 0.65em;
}

.single-product .woocommerce-product-details__short-description {
    max-width: 660px;
    margin: 0 0 18px;
    color: #3f5059;
    font-family: var(--font-body, sans-serif);
    font-size: clamp(14px, 1vw, 16px);
    font-weight: 400;
    line-height: 1.5;
}

.single-product .woocommerce-product-details__short-description p {
    margin: 0;
}

/* ==========================================================
   VARIATIONS
   ========================================================== */

.single-product div.product form.cart {
    width: 100%;
    margin: 0;
    padding-top: 16px;
    border-top: 1px solid rgba(23, 57, 76, 0.18);
}

.single-product div.product form.cart .variations {
    display: block;
    width: 100%;
    margin: 0 0 14px;
}

.single-product form.variations_form .variations tbody,
.single-product form.variations_form .variations tr,
.single-product form.variations_form .variations th,
.single-product form.variations_form .variations td {
    display: block;
    width: 100%;
}

.single-product form.variations_form .variations th.label {
    margin: 0 0 8px;
    padding: 0;
    text-align: left;
}

.single-product form.variations_form .variations th.label label {
    color: #17394c;
    font-family: var(--font-body, sans-serif);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.single-product form.variations_form .variations td.value {
    position: relative;
    padding: 0;
}

.single-product form.variations_form select {
    display: block;
    width: 100%;
    height: 48px;
    margin: 0;
    padding: 0 48px 0 17px;
    color: #17394c;
    font-family: var(--font-body, sans-serif);
    font-size: 15px;
    font-weight: 700;
    background-color: #fffdf8;
    border: 1px solid rgba(23, 57, 76, 0.34);
    border-radius: 8px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        0 3px 10px rgba(23, 57, 76, 0.05);
    cursor: pointer;
    outline: none;
    transition:
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.single-product form.variations_form select:hover {
    border-color: #17394c;
}

.single-product form.variations_form select:focus {
    border-color: #bd2028;
    box-shadow: 0 0 0 3px rgba(189, 32, 40, 0.11);
}

.single-product .reset_variations {
    display: inline-block;
    margin-top: 7px;
    color: #bd2028;
    font-size: 12px;
    font-weight: 700;
    text-decoration: underline;
}

.single-product .single_variation_wrap {
    width: 100%;
}

.single-product .single_variation {
    margin-bottom: 10px;
}

.single-product .single_variation:empty {
    display: none;
}

/* Quantity and primary action */

.single-product .woocommerce-variation-add-to-cart,
.single-product form.cart:not(.variations_form) {
    display: grid;
    grid-template-columns: 82px minmax(210px, 1fr);
    gap: 10px;
    align-items: stretch;
    width: 100%;
}

.single-product form.cart .quantity {
    float: none;
    width: 100%;
    margin: 0;
}

.single-product form.cart .quantity .qty {
    width: 100%;
    height: 48px;
    padding: 0 10px;
    color: #17394c;
    font-family: var(--font-body, sans-serif);
    font-size: 17px;
    font-weight: 800;
    text-align: center;
    background: #fffdf8;
    border: 1px solid rgba(23, 57, 76, 0.36);
    border-radius: 8px;
    outline: none;
}

.single-product form.cart .quantity .qty:focus {
    border-color: #bd2028;
    box-shadow: 0 0 0 3px rgba(189, 32, 40, 0.11);
}

.single-product div.product form.cart button.single_add_to_cart_button {
    float: none;
    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 11px 20px;
    color: #ffffff;
    font-family: var(--font-body, sans-serif);
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    background: #bd2028;
    border: 0;
    border-radius: 8px;
    box-shadow:
        0 4px 0 #81151a,
        0 10px 20px rgba(189, 32, 40, 0.19);
    cursor: pointer;
    transition:
        background-color 160ms ease,
        transform 160ms ease,
        box-shadow 160ms ease;
}

.single-product div.product form.cart button.single_add_to_cart_button::after {
    margin-left: 10px;
    content: "→";
}

.single-product div.product form.cart button.single_add_to_cart_button:hover {
    color: #ffffff;
    background: #d1262f;
    transform: translateY(-1px);
    box-shadow:
        0 5px 0 #81151a,
        0 13px 25px rgba(189, 32, 40, 0.24);
}

.single-product div.product form.cart button.single_add_to_cart_button:active {
    transform: translateY(2px);
    box-shadow:
        0 2px 0 #81151a,
        0 6px 12px rgba(189, 32, 40, 0.17);
}

.single-product div.product form.cart button.single_add_to_cart_button.disabled,
.single-product div.product form.cart button.single_add_to_cart_button:disabled {
    color: rgba(255, 255, 255, 0.86);
    background: #9c8989;
    box-shadow:
        0 3px 0 #716262,
        0 7px 14px rgba(0, 0, 0, 0.09);
    cursor: not-allowed;
    opacity: 1;
    transform: none;
}

.single-product .product_meta {
    display: none;
}

.single-product .woocommerce-variation-price .price {
    margin-bottom: 10px;
    color: #bd2028;
    font-family: var(--font-display, sans-serif);
    font-size: 25px;
    font-weight: 700;
}

/* Lower product content */

.single-product .woocommerce-tabs,
.single-product .related.products,
.single-product .up-sells {
    grid-column: 1 / -1;
    width: 100%;
    padding: 28px clamp(24px, 3.5vw, 52px);
    background: #fffaf1;
    border-top: 1px solid rgba(23, 57, 76, 0.14);
}

/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 1050px) {

    .single-product .woocommerce div.product {
        grid-template-columns: 1fr;
    }

    .single-product div.product div.images,
    .single-product .woocommerce-product-gallery,
    .single-product .woocommerce-product-gallery .flex-viewport,
    .single-product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper,
    .single-product .woocommerce-product-gallery .woocommerce-product-gallery__image {
        height: 520px !important;
        min-height: 520px !important;
    }

    .single-product div.product div.images,
    .single-product .woocommerce-product-gallery {
        border-right: 0;
        border-bottom: 1px solid rgba(23, 57, 76, 0.16);
    }

    .single-product .woocommerce-product-gallery .woocommerce-product-gallery__image {
        padding: 30px 38px 84px !important;
    }

    .single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img:not(.zoomImg) {
        width: min(82%, 650px) !important;
        height: 380px !important;
        transform: none !important;
    }

    .single-product
    .woocommerce-product-gallery__wrapper
    > .woocommerce-product-gallery__image:nth-child(n + 2)
    img:not(.zoomImg) {
        transform: translateX(-10%) !important;
    }

    .single-product div.product div.summary {
        height: auto;
        min-height: 0;
        padding: 42px;
    }
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 640px) {

    .single-product .site-main {
        padding: 10px 0 40px;
    }

    .single-product .content-area,
    .single-product .site-main > .container,
    .single-product .woocommerce {
        width: calc(100% - 18px);
    }

    .single-product .woocommerce div.product {
        border-radius: 14px;
    }

    .single-product div.product div.images,
    .single-product .woocommerce-product-gallery,
    .single-product .woocommerce-product-gallery .flex-viewport,
    .single-product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper,
    .single-product .woocommerce-product-gallery .woocommerce-product-gallery__image {
        height: 410px !important;
        min-height: 410px !important;
    }

    .single-product .woocommerce-product-gallery .woocommerce-product-gallery__image {
        padding: 24px 18px 76px !important;
    }

    .single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img:not(.zoomImg) {
        width: 94% !important;
        height: 300px !important;
        transform: none !important;
    }

    .single-product
    .woocommerce-product-gallery__wrapper
    > .woocommerce-product-gallery__image:nth-child(n + 2)
    img:not(.zoomImg) {
        transform: translateX(-6%) !important;
    }

    .single-product .woocommerce-product-gallery .flex-control-thumbs {
        bottom: 14px;
        left: 50%;
        gap: 7px;
        padding: 0;
        transform: translateX(-50%);
    }

    .single-product .woocommerce-product-gallery .flex-control-thumbs li {
        width: 44px;
        height: 42px;
    }

    .single-product .woocommerce-product-gallery__trigger {
        top: 13px !important;
        right: 13px !important;
        width: 38px !important;
        height: 38px !important;
    }

    .single-product div.product div.summary {
        padding: 30px 22px 34px;
    }

    .single-product div.product div.summary h1.product_title.entry-title,
    .single-product div.product div.summary .rnr-product-title {
        margin-bottom: 12px !important;
        font-size: clamp(34px, 11vw, 43px);
    }

    .single-product div.product p.price {
        margin-bottom: 19px;
        font-size: 36px;
    }

    .single-product .woocommerce-product-details__short-description {
        margin-bottom: 21px;
        font-size: 15px;
        line-height: 1.55;
    }

    .single-product div.product form.cart {
        padding-top: 18px;
    }

    .single-product .woocommerce-variation-add-to-cart,
    .single-product form.cart:not(.variations_form) {
        grid-template-columns: 78px minmax(0, 1fr);
        gap: 9px;
    }

    .single-product div.product form.cart button.single_add_to_cart_button {
        padding-inline: 10px;
        font-size: 11px;
        letter-spacing: 0.08em;
    }
}

@media (max-width: 390px) {

    .single-product .woocommerce-variation-add-to-cart,
    .single-product form.cart:not(.variations_form) {
        grid-template-columns: 1fr;
    }
}
/* =========================================================
   ROCK 'N' ROLLS — COMPACT CART
   Solo afecta a la página del carrito
========================================================= */

body.woocommerce-cart {
    --rnr-red: #bd2029;
    --rnr-red-dark: #981820;
    --rnr-blue: #123f52;
    --rnr-blue-soft: #2f6377;
    --rnr-cream: #f7efe2;
    --rnr-paper: #fffaf2;
    --rnr-ink: #172f3a;
    --rnr-muted: #64747b;
    --rnr-line: rgba(18, 63, 82, 0.15);
    --rnr-shadow: 0 16px 38px rgba(32, 45, 50, 0.10);
}


/* Elimina la altura excesiva que genera el espacio vacío */

body.woocommerce-cart main,
body.woocommerce-cart .site-main,
body.woocommerce-cart .entry-content {
    min-height: 0 !important;
}

body.woocommerce-cart .wp-block-woocommerce-cart {
    width: min(100% - 48px, 1420px);
    min-height: 0 !important;
    margin: 34px auto 54px !important;
    padding: 0 !important;
}


/* Estructura principal */

body.woocommerce-cart .wc-block-cart {
    display: grid !important;
    grid-template-columns: minmax(0, 1.55fr) minmax(340px, 0.75fr);
    gap: 26px;
    align-items: start;
    margin: 0 !important;
}

body.woocommerce-cart .wc-block-cart__main,
body.woocommerce-cart .wc-block-cart__sidebar {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
}


/* Tarjeta de productos */

body.woocommerce-cart .wc-block-cart__main {
    padding: 22px 24px 12px !important;
    background: rgba(255, 250, 242, 0.78);
    border: 1px solid var(--rnr-line);
    border-radius: 18px;
    box-shadow: var(--rnr-shadow);
    overflow: hidden;
}

body.woocommerce-cart table.wc-block-cart-items {
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-collapse: collapse;
}

body.woocommerce-cart table.wc-block-cart-items thead {
    border-bottom: 1px solid var(--rnr-line);
}

body.woocommerce-cart table.wc-block-cart-items thead th {
    padding: 0 0 14px !important;
    color: var(--rnr-blue);
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.2;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

body.woocommerce-cart table.wc-block-cart-items thead th:last-child {
    text-align: right;
}


/* Fila del producto */

body.woocommerce-cart
table.wc-block-cart-items
.wc-block-cart-items__row {
    position: relative;
    border-bottom: 0 !important;
}

body.woocommerce-cart
table.wc-block-cart-items
.wc-block-cart-items__row td {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
    border-bottom: 0 !important;
    vertical-align: middle !important;
}

body.woocommerce-cart
table.wc-block-cart-items
.wc-block-cart-items__row:not(:last-child) td {
    border-bottom: 1px solid var(--rnr-line) !important;
}


/* Imagen */

body.woocommerce-cart
.wc-block-cart-item__image {
    width: 108px !important;
    padding-right: 18px !important;
}

body.woocommerce-cart
.wc-block-cart-item__image a {
    display: flex;
    width: 96px;
    height: 96px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #f0e5d4;
    border: 1px solid rgba(18, 63, 82, 0.12);
    border-radius: 14px;
}

body.woocommerce-cart
.wc-block-cart-item__image img {
    display: block;
    width: 88px !important;
    height: 88px !important;
    max-width: none !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 !important;
}


/* Información del producto */

body.woocommerce-cart
.wc-block-cart-item__product {
    padding-right: 20px !important;
}

body.woocommerce-cart
.wc-block-components-product-name {
    display: inline-block;
    margin: 0 0 5px !important;
    color: var(--rnr-ink) !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
}

body.woocommerce-cart
.wc-block-components-product-name:hover {
    color: var(--rnr-red) !important;
}

body.woocommerce-cart
.wc-block-components-product-price {
    margin: 0 0 5px !important;
    color: var(--rnr-red);
    font-size: 15px !important;
    font-weight: 800;
}

body.woocommerce-cart
.wc-block-components-product-details {
    margin: 0 0 10px !important;
    color: var(--rnr-muted);
    font-size: 13px !important;
    line-height: 1.45;
}

body.woocommerce-cart
.wc-block-components-product-details li {
    margin: 0 !important;
}


/* Precio total del producto */

body.woocommerce-cart
.wc-block-cart-item__total {
    min-width: 90px;
    padding-left: 14px !important;
    text-align: right !important;
}

body.woocommerce-cart
.wc-block-cart-item__total-price-and-sale-badge-wrapper {
    justify-content: flex-end !important;
}

body.woocommerce-cart
.wc-block-cart-item__total .wc-block-components-product-price {
    color: var(--rnr-ink);
    font-size: 17px !important;
}


/* Selector de cantidad */

body.woocommerce-cart
.wc-block-components-quantity-selector {
    width: 142px !important;
    min-height: 40px !important;
    margin: 0 !important;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(18, 63, 82, 0.22) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

body.woocommerce-cart
.wc-block-components-quantity-selector::after {
    display: none !important;
}

body.woocommerce-cart
.wc-block-components-quantity-selector input {
    min-width: 48px !important;
    height: 40px !important;
    color: var(--rnr-ink);
    font-size: 15px !important;
    font-weight: 800;
}

body.woocommerce-cart
.wc-block-components-quantity-selector button {
    width: 44px !important;
    min-width: 44px !important;
    height: 40px !important;
    color: var(--rnr-blue) !important;
    font-size: 18px !important;
    transition:
        color 0.2s ease,
        background-color 0.2s ease;
}

body.woocommerce-cart
.wc-block-components-quantity-selector button:hover {
    color: #fff !important;
    background: var(--rnr-blue) !important;
}


/* Botón eliminar */

body.woocommerce-cart
.wc-block-cart-item__remove-link {
    display: inline-flex !important;
    width: 38px;
    height: 38px;
    margin: 0 0 0 10px !important;
    padding: 0 !important;
    align-items: center;
    justify-content: center;
    color: var(--rnr-muted) !important;
    font-size: 0 !important;
    text-decoration: none !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 10px;
}

body.woocommerce-cart
.wc-block-cart-item__remove-link::before {
    content: "×";
    font-family: Arial, sans-serif;
    font-size: 25px;
    font-weight: 400;
    line-height: 1;
}

body.woocommerce-cart
.wc-block-cart-item__remove-link:hover {
    color: #fff !important;
    background: var(--rnr-red) !important;
    border-color: var(--rnr-red) !important;
}


/* Resumen del carrito */

body.woocommerce-cart .wc-block-cart__sidebar {
    position: sticky;
    top: 24px;
    padding: 24px !important;
    background: var(--rnr-paper);
    border: 1px solid var(--rnr-line);
    border-top: 4px solid var(--rnr-red);
    border-radius: 18px;
    box-shadow: var(--rnr-shadow);
}

body.woocommerce-cart
.wc-block-cart__sidebar
.wc-block-cart__totals-title {
    margin: 0 !important;
    padding: 0 0 17px !important;
    color: var(--rnr-blue);
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1.2;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}


/* Cupón */

body.woocommerce-cart
.wc-block-components-totals-coupon {
    margin: 0 !important;
    border-top: 1px solid var(--rnr-line);
    border-bottom: 1px solid var(--rnr-line);
}

body.woocommerce-cart
.wc-block-components-totals-coupon
.wc-block-components-panel__button {
    min-height: 52px !important;
    padding: 0 !important;
    color: var(--rnr-ink) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

body.woocommerce-cart
.wc-block-components-totals-coupon__content {
    padding: 0 0 16px !important;
}

body.woocommerce-cart
.wc-block-components-totals-coupon__input {
    min-height: 46px;
    border-radius: 9px !important;
}

body.woocommerce-cart
.wc-block-components-totals-coupon__button {
    min-height: 46px !important;
    color: #fff !important;
    font-weight: 800 !important;
    background: var(--rnr-blue) !important;
    border-radius: 9px !important;
}


/* Total */

body.woocommerce-cart
.wc-block-components-totals-footer-item {
    padding: 20px 0 !important;
    border-bottom: 1px solid var(--rnr-line);
}

body.woocommerce-cart
.wc-block-components-totals-footer-item
.wc-block-components-totals-item__label {
    color: var(--rnr-ink);
    font-size: 20px !important;
    font-weight: 800 !important;
}

body.woocommerce-cart
.wc-block-components-totals-footer-item
.wc-block-components-totals-item__value {
    color: var(--rnr-red);
    font-size: 25px !important;
    font-weight: 900 !important;
}


/* Botón checkout */

body.woocommerce-cart
.wc-block-cart__submit {
    margin: 20px 0 0 !important;
}

body.woocommerce-cart
.wc-block-cart__submit-button {
    min-height: 58px !important;
    padding: 0 24px !important;
    color: #fff !important;
    background: var(--rnr-red) !important;
    border: 0 !important;
    border-radius: 11px !important;
    box-shadow: 0 8px 18px rgba(189, 32, 41, 0.22);
    font-size: 14px !important;
    font-weight: 900 !important;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    transition:
        transform 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease;
}

body.woocommerce-cart
.wc-block-cart__submit-button:hover {
    color: #fff !important;
    background: var(--rnr-red-dark) !important;
    box-shadow: 0 10px 22px rgba(152, 24, 32, 0.28);
    transform: translateY(-2px);
}

body.woocommerce-cart
.wc-block-cart__submit-button::after {
    content: " →";
    margin-left: 8px;
}


/* Oculta bloques vacíos que generan altura innecesaria */

body.woocommerce-cart
.wc-block-components-sidebar-layout:empty,
body.woocommerce-cart
.wc-block-cart__main:empty,
body.woocommerce-cart
.wc-block-cart__sidebar:empty {
    display: none !important;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 980px) {

    body.woocommerce-cart .wp-block-woocommerce-cart {
        width: min(100% - 32px, 760px);
        margin-top: 26px !important;
    }

    body.woocommerce-cart .wc-block-cart {
        grid-template-columns: 1fr !important;
        gap: 20px;
    }

    body.woocommerce-cart .wc-block-cart__sidebar {
        position: static;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    body.woocommerce-cart .wp-block-woocommerce-cart {
        width: calc(100% - 24px);
        margin: 18px auto 34px !important;
    }

    body.woocommerce-cart .wc-block-cart__main,
    body.woocommerce-cart .wc-block-cart__sidebar {
        padding: 18px !important;
        border-radius: 15px;
    }

    body.woocommerce-cart
    table.wc-block-cart-items thead {
        display: none !important;
    }

    body.woocommerce-cart
    table.wc-block-cart-items
    .wc-block-cart-items__row {
        display: grid !important;
        grid-template-columns: 82px minmax(0, 1fr);
        padding: 18px 0 !important;
    }

    body.woocommerce-cart
    table.wc-block-cart-items
    .wc-block-cart-items__row td {
        padding: 0 !important;
    }

    body.woocommerce-cart
    .wc-block-cart-item__image {
        grid-column: 1;
        grid-row: 1 / span 2;
        width: 82px !important;
        padding-right: 12px !important;
    }

    body.woocommerce-cart
    .wc-block-cart-item__image a {
        width: 70px;
        height: 70px;
        border-radius: 11px;
    }

    body.woocommerce-cart
    .wc-block-cart-item__image img {
        width: 64px !important;
        height: 64px !important;
    }

    body.woocommerce-cart
    .wc-block-cart-item__product {
        grid-column: 2;
        padding: 0 !important;
    }

    body.woocommerce-cart
    .wc-block-cart-item__total {
        grid-column: 2;
        padding: 9px 0 0 !important;
        text-align: left !important;
    }

    body.woocommerce-cart
    .wc-block-cart-item__total-price-and-sale-badge-wrapper {
        justify-content: flex-start !important;
    }

    body.woocommerce-cart
    .wc-block-components-product-name {
        font-size: 16px !important;
    }

    body.woocommerce-cart
    .wc-block-components-quantity-selector {
        width: 128px !important;
    }

    body.woocommerce-cart
    .wc-block-components-totals-footer-item
    .wc-block-components-totals-item__label {
        font-size: 18px !important;
    }

    body.woocommerce-cart
    .wc-block-components-totals-footer-item
    .wc-block-components-totals-item__value {
        font-size: 22px !important;
    }

    body.woocommerce-cart
    .wc-block-cart__submit-button {
        min-height: 54px !important;
        font-size: 13px !important;
    }
}

/* ==========================================================
   ROCK N ROLLS — LOGIN / REGISTER COMPACT FIX
   Pegar al FINAL del CSS actual.
   ========================================================== */

.rnr-auth,
.rnr-auth * {
    box-sizing: border-box;
}

/* La sección crece con el formulario: nunca vuelve a recortarlo. */
.rnr-auth {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: clamp(640px, calc(100svh - 220px), 820px) !important;
    margin: 0 !important;
    overflow: visible !important;
    isolation: isolate;
    background-position: center center !important;
}

body.admin-bar .rnr-auth {
    height: auto !important;
    min-height: clamp(610px, calc(100svh - 252px), 790px) !important;
}

/* El contenido comienza dentro de la sección y no se desplaza bajo el header. */
.rnr-auth__layout {
    width: min(100%, 1500px) !important;
    height: auto !important;
    min-height: inherit !important;
    margin: 0 auto !important;
    padding: 22px clamp(32px, 4.5vw, 72px) 26px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 430px) !important;
    align-items: center !important;
    gap: clamp(28px, 4vw, 64px) !important;
}

.rnr-auth__card {
    width: 100% !important;
    max-width: 430px !important;
    max-height: none !important;
    margin: 0 0 0 auto !important;
    padding: 6px !important;
    border-radius: 18px !important;
}

.rnr-auth__card::before {
    border-radius: 15px !important;
}

.rnr-auth__tabs {
    gap: 5px !important;
    padding: 4px 4px 0 !important;
}

.rnr-auth__tab {
    min-height: 40px !important;
    padding: 8px 12px !important;
    font-size: 12px !important;
}

.rnr-auth__panel {
    margin: 5px !important;
    padding: 16px 21px 17px !important;
    border-radius: 5px 5px 12px 12px !important;
}

.rnr-auth__heading {
    margin-bottom: 12px !important;
}

.rnr-auth__eyebrow {
    margin-bottom: 5px !important;
    font-size: 8px !important;
}

.rnr-auth__heading h1,
.rnr-auth__heading h2 {
    font-size: clamp(28px, 2.5vw, 35px) !important;
    line-height: 1 !important;
}

.rnr-auth__heading p {
    margin-top: 6px !important;
    font-size: 10px !important;
    line-height: 1.35 !important;
}

.rnr-auth__divider {
    width: 135px !important;
    margin-top: 7px !important;
}

.rnr-auth__form {
    gap: 8px !important;
}

.rnr-auth__columns {
    gap: 8px !important;
}

.rnr-auth__field {
    gap: 4px !important;
}

.rnr-auth__field label,
.rnr-auth__label-row label {
    font-size: 8px !important;
}

.rnr-auth__field input {
    height: 38px !important;
    padding: 0 12px !important;
    border-radius: 6px !important;
    font-size: 11px !important;
}

.rnr-auth__password input {
    padding-right: 42px !important;
}

.rnr-auth__password-toggle {
    width: 31px !important;
    height: 31px !important;
}

.rnr-auth__remember,
.rnr-auth__terms {
    gap: 7px !important;
    font-size: 9px !important;
    line-height: 1.3 !important;
}

.rnr-auth__submit {
    min-height: 40px !important;
    padding: 9px 16px !important;
    font-size: 12px !important;
}

.rnr-auth__switch {
    margin-top: 10px !important;
    padding-top: 9px !important;
    font-size: 9px !important;
}

.rnr-auth__message {
    padding: 7px 9px !important;
    font-size: 9px !important;
}

.rnr-auth__secure {
    display: none !important;
}

@media (max-width: 1200px) {
    .rnr-auth__layout {
        grid-template-columns: minmax(0, 1fr) minmax(345px, 405px) !important;
        padding: 18px 30px 22px !important;
        gap: 26px !important;
    }
}

@media (max-width: 780px) {
    .rnr-auth {
        min-height: 0 !important;
        padding-top: 205px !important;
        overflow: visible !important;
        background-position: 27% top !important;
        background-size: auto 285px !important;
    }

    body.admin-bar .rnr-auth {
        min-height: 0 !important;
    }

    .rnr-auth__layout {
        min-height: 0 !important;
        padding: 0 15px 32px !important;
        display: block !important;
    }

    .rnr-auth__space {
        display: none !important;
    }

    .rnr-auth__card {
        max-width: 460px !important;
        margin: 0 auto !important;
    }
}

@media (max-width: 480px) {
    .rnr-auth {
        padding-top: 170px !important;
        background-size: auto 245px !important;
    }

    .rnr-auth__columns {
        grid-template-columns: 1fr !important;
    }

    .rnr-auth__panel {
        padding: 15px 14px 16px !important;
    }

    .rnr-auth__heading h1,
    .rnr-auth__heading h2 {
        font-size: 28px !important;
    }
}
/* HOT DRINKS — título y precio en la misma línea */
body.kooka-hot-drink-product div.product .summary.entry-summary {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: baseline !important;
    column-gap: 16px !important;
}

body.kooka-hot-drink-product div.product .summary.entry-summary > .product_title {
    flex: 0 1 auto !important;
    width: auto !important;
    margin: 0 0 14px !important;
}

body.kooka-hot-drink-product div.product .summary.entry-summary > p.price {
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
}

/* El resto vuelve a ocupar toda la línea */
body.kooka-hot-drink-product div.product .summary.entry-summary >
.woocommerce-product-details__short-description,
body.kooka-hot-drink-product div.product .summary.entry-summary > form.cart,
body.kooka-hot-drink-product div.product .summary.entry-summary > .product_meta {
    flex: 0 0 100% !important;
    width: 100% !important;
}
/* =====================================================
   ROCK 'N' ROLLS — RELATED HOT DRINKS
   ===================================================== */

body.kooka-hot-drink-product .related.products {
    margin: 0 !important;
    padding: 45px 36px 50px !important;
    border-top: 4px solid #c91f2c;
    background:
        radial-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
        linear-gradient(145deg, #123f51, #092d3c);
    background-size: 9px 9px, auto;
}

/* Título de la sección */
body.kooka-hot-drink-product .related.products > h2 {
    margin: 0 0 30px !important;
    color: #fff !important;
    font-size: clamp(26px, 3vw, 38px) !important;
    line-height: 1 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase;
}

body.kooka-hot-drink-product .related.products > h2::after {
    content: "";
    display: block;
    width: 70px;
    height: 4px;
    margin-top: 12px;
    border-radius: 4px;
    background: #d92532;
}

/* Rejilla */
body.kooka-hot-drink-product .related.products ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
    margin: 0 !important;
}

/* Tarjetas */
body.kooka-hot-drink-product .related.products ul.products li.product {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 14px 14px 16px !important;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.22);
    border-bottom: 5px solid #c91f2c;
    border-radius: 16px;
    background: #fff9ee;
    box-shadow: 0 14px 30px rgba(0,0,0,.2);
    transition: transform .2s ease, box-shadow .2s ease;
}

body.kooka-hot-drink-product .related.products ul.products li.product:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 38px rgba(0,0,0,.28);
}

/* Zona de imagen */
body.kooka-hot-drink-product .related.products li.product a img {
    width: 100% !important;
    height: 230px !important;
    margin: 0 0 15px !important;
    padding: 18px !important;
    object-fit: contain !important;
    border-radius: 12px;
    background: linear-gradient(145deg, #174f64, #0a3445);
}

/* Nombre */
body.kooka-hot-drink-product .related.products li.product h2,
body.kooka-hot-drink-product .related.products li.product .woocommerce-loop-product__title {
    margin: 0 0 7px !important;
    padding: 0 !important;
    color: #14283b !important;
    font-size: 20px !important;
    line-height: 1.1 !important;
    letter-spacing: .7px !important;
    text-transform: uppercase;
}

/* Precio */
body.kooka-hot-drink-product .related.products li.product .price {
    display: block !important;
    margin: 0 0 14px !important;
    color: #c91f2c !important;
    font-size: 21px !important;
    font-weight: 800 !important;
}

body.kooka-hot-drink-product .related.products li.product .price * {
    color: inherit !important;
}

/* Botón */
body.kooka-hot-drink-product .related.products li.product .button {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-height: 46px;
    margin: 0 !important;
    padding: 11px 15px !important;
    border: 2px solid #c91f2c !important;
    border-radius: 9px !important;
    background: #c91f2c !important;
    color: #fff !important;
    box-shadow: 0 5px 0 #8f1320 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 1.5px !important;
    text-align: center;
    text-transform: uppercase;
}

body.kooka-hot-drink-product .related.products li.product .button:hover {
    transform: translateY(2px);
    background: #14283b !important;
    border-color: #14283b !important;
    box-shadow: 0 3px 0 #071725 !important;
}

/* Tablet */
@media (max-width: 900px) {
    body.kooka-hot-drink-product .related.products {
        padding: 35px 22px 40px !important;
    }

    body.kooka-hot-drink-product .related.products ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* Móvil */
@media (max-width: 580px) {
    body.kooka-hot-drink-product .related.products {
        padding: 30px 16px 35px !important;
    }

    body.kooka-hot-drink-product .related.products ul.products {
        grid-template-columns: 1fr !important;
    }

    body.kooka-hot-drink-product .related.products li.product a img {
        height: 210px !important;
    }
}
/* CORRECCIÓN — tarjetas más pequeñas y alineadas */
body.kooka-hot-drink-product .related.products {
    padding: 32px 25px 38px !important;
}

/* Eliminar elementos invisibles de WooCommerce que rompen el grid */
body.kooka-hot-drink-product .related.products ul.products::before,
body.kooka-hot-drink-product .related.products ul.products::after {
    content: none !important;
    display: none !important;
}

/* Grid compacto y centrado */
body.kooka-hot-drink-product .related.products ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 285px)) !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 20px !important;
    width: 100% !important;
    max-width: 950px !important;
    margin: 0 auto !important;
}

/* Tarjeta compacta */
body.kooka-hot-drink-product .related.products ul.products li.product {
    display: flex !important;
    float: none !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 10px 10px 13px !important;
}

/* Enlace ocupa el espacio disponible */
body.kooka-hot-drink-product .related.products li.product >
.woocommerce-LoopProduct-link {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
}

/* Imagen más pequeña */
body.kooka-hot-drink-product .related.products li.product a img {
    width: 100% !important;
    height: 175px !important;
    margin: 0 0 12px !important;
    padding: 13px !important;
    object-fit: contain !important;
}

/* Textos más compactos */
body.kooka-hot-drink-product .related.products li.product h2,
body.kooka-hot-drink-product .related.products li.product
.woocommerce-loop-product__title {
    margin: 0 5px 5px !important;
    font-size: 16px !important;
}

body.kooka-hot-drink-product .related.products li.product .price {
    margin: 0 5px 12px !important;
    font-size: 18px !important;
}

/* Botones siempre alineados abajo */
body.kooka-hot-drink-product .related.products li.product .button {
    width: 100% !important;
    min-height: 42px !important;
    margin-top: auto !important;
    padding: 9px 12px !important;
    font-size: 11px !important;
}

/* Tablet */
@media (max-width: 850px) {
    body.kooka-hot-drink-product .related.products ul.products {
        grid-template-columns: repeat(2, minmax(0, 260px)) !important;
    }
}

/* Móvil */
@media (max-width: 580px) {
    body.kooka-hot-drink-product .related.products ul.products {
        grid-template-columns: minmax(0, 290px) !important;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — SIMPLE COLD DRINKS
   Coca-Cola, Coca-Cola Zero, Sprite, etc.
   ===================================================== */

/* Título y precio en la misma línea */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary {
    display: flex !important;
    flex-flow: row wrap !important;
    align-items: baseline !important;
    column-gap: 16px !important;
}

body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary > .product_title {
    flex: 0 1 auto !important;
    width: auto !important;
    margin: 0 0 14px !important;
}

body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary > p.price {
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
}

/* Descripción y compra ocupan su propia línea */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary >
.woocommerce-product-details__short-description,
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary > form.cart,
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary > .product_meta {
    flex: 0 0 100% !important;
    width: 100% !important;
}

/* Cantidad y botón juntos */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart {
    display: flex !important;
    align-items: stretch !important;
    gap: 10px !important;
    margin-top: 14px !important;
}

/* Selector compacto */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart .quantity {
    display: block !important;
    flex: 0 0 90px !important;
    width: 90px !important;
    margin: 0 !important;
}

body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart .quantity input.qty {
    width: 100% !important;
    height: 54px !important;
    min-height: 54px !important;
    margin: 0 !important;
    padding: 8px !important;
    border: 2px solid #d8d5cc !important;
    border-radius: 9px !important;
    background: #fff !important;
    color: #14253a !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    text-align: center !important;
}

/* Botón ancho y correctamente alineado */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart .single_add_to_cart_button {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    flex: 1 1 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: none !important;
    min-height: 54px !important;
    margin: 0 !important;
    padding: 10px 22px !important;
    transform: none !important;
    white-space: nowrap !important;
    font-size: 12px !important;
    line-height: 1 !important;
    letter-spacing: 1.5px !important;
}
/* =====================================================
   SIMPLE COLD DRINKS — COMPOSICIÓN PREMIUM
   ===================================================== */

body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary {
    justify-content: flex-start !important;
    align-content: center !important;
    row-gap: 0 !important;
    padding: clamp(35px, 5vw, 70px) !important;
}

/* Distintivo superior */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary::before {
    content: "ICE COLD  •  375ML";
    display: block !important;
    flex: 0 0 100% !important;
    width: fit-content !important;
    margin: 0 0 13px !important;
    color: #c91f2c !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: 2.2px !important;
}

/* Título */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary > .product_title {
    margin: 0 0 18px !important;
    color: #15384a !important;
    font-size: clamp(34px, 4vw, 52px) !important;
    line-height: .95 !important;
    letter-spacing: 1px !important;
}

/* Precio convertido en sello */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary > p.price {
    align-self: center !important;
    margin: 0 0 18px 4px !important;
    padding: 8px 13px 7px !important;
    border-radius: 8px !important;
    background: #c91f2c !important;
    color: #fff !important;
    box-shadow: 0 4px 0 #92131c !important;
    font-size: 22px !important;
    line-height: 1 !important;
    text-decoration: none !important;
}

body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.summary.entry-summary > p.price * {
    color: #fff !important;
    text-decoration: none !important;
}

/* Descripción con diseño */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.woocommerce-product-details__short-description {
    margin: 0 0 18px !important;
    padding: 15px 17px !important;
    border-left: 5px solid #c91f2c !important;
    border-radius: 0 10px 10px 0 !important;
    background: #f3ede2 !important;
    color: #394b57 !important;
}

body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
.woocommerce-product-details__short-description p {
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

/* Caja completa de pedido */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart {
    display: grid !important;
    grid-template-columns: 90px minmax(0, 1fr) !important;
    align-items: stretch !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 18px !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    border-left: 6px solid #c91f2c !important;
    border-radius: 14px !important;
    background:
        radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(145deg, #174f64, #0c3445) !important;
    background-size: 8px 8px, auto !important;
    box-shadow: 0 14px 28px rgba(15,49,64,.2) !important;
}

/* Cabecera de la caja */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart::before {
    content: "ADD TO YOUR ORDER";
    grid-column: 1 / -1 !important;
    display: block !important;
    margin-bottom: 3px !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: 2px !important;
}

/* Cantidad */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart .quantity {
    width: 90px !important;
}

body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart .quantity input.qty {
    width: 90px !important;
    height: 56px !important;
    min-height: 56px !important;
    border: 2px solid rgba(255,255,255,.7) !important;
    border-radius: 9px !important;
    background: #fffaf1 !important;
    color: #15384a !important;
    box-shadow: inset 0 2px 5px rgba(0,0,0,.07) !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

/* Botón principal */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart .single_add_to_cart_button {
    min-height: 56px !important;
    border: 2px solid #ed3945 !important;
    border-radius: 9px !important;
    background: linear-gradient(#d82733, #bd1823) !important;
    color: #fff !important;
    box-shadow: 0 5px 0 #821019 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: 1.7px !important;
}

body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart .single_add_to_cart_button:hover {
    transform: translateY(2px) !important;
    box-shadow: 0 3px 0 #821019 !important;
}

/* Texto inferior */
body:not(.kooka-cold-drink-product)
div.product.product_cat-cold-drinks
form.cart::after {
    content: "CHILLED AND READY TO GO";
    grid-column: 1 / -1 !important;
    display: block !important;
    margin-top: 4px !important;
    color: rgba(255,255,255,.66) !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: 1.8px !important;
}

/* Móvil */
@media (max-width: 640px) {
    body:not(.kooka-cold-drink-product)
    div.product.product_cat-cold-drinks
    .summary.entry-summary {
        padding: 28px 22px !important;
    }

    body:not(.kooka-cold-drink-product)
    div.product.product_cat-cold-drinks
    form.cart {
        grid-template-columns: 78px minmax(0, 1fr) !important;
        padding: 14px !important;
    }

    body:not(.kooka-cold-drink-product)
    div.product.product_cat-cold-drinks
    form.cart .quantity,
    body:not(.kooka-cold-drink-product)
    div.product.product_cat-cold-drinks
    form.cart .quantity input.qty {
        width: 78px !important;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — RELATED PRODUCTS GLOBAL
   ===================================================== */

body.single-product .related.products {
    margin: 0 !important;
    padding: 34px 35px 40px !important;
    border-top: 5px solid #c91f2c !important;
    background:
        radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(145deg, #174f64, #092f40) !important;
    background-size: 9px 9px, auto !important;
}

/* Título */
body.single-product .related.products > h2 {
    margin: 0 0 25px !important;
    color: #fff !important;
    font-size: clamp(25px, 3vw, 34px) !important;
    line-height: 1 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
}

body.single-product .related.products > h2::after {
    content: "" !important;
    display: block !important;
    width: 65px !important;
    height: 4px !important;
    margin-top: 10px !important;
    border-radius: 4px !important;
    background: #d92532 !important;
}

/* Quitar clearfix de WooCommerce */
body.single-product .related.products ul.products::before,
body.single-product .related.products ul.products::after {
    content: none !important;
    display: none !important;
}

/* Cuatro tarjetas compactas */
body.single-product .related.products ul.products {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 17px !important;
    width: 100% !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
}

/* Tarjeta */
body.single-product .related.products ul.products li.product {
    display: flex !important;
    float: none !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 10px 10px 13px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    border-bottom: 5px solid #c91f2c !important;
    border-radius: 14px !important;
    background: #fff9ee !important;
    box-shadow: 0 12px 25px rgba(0,0,0,.22) !important;
    transition: transform .2s ease, box-shadow .2s ease !important;
}

body.single-product .related.products ul.products li.product:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 18px 32px rgba(0,0,0,.3) !important;
}

/* Enlace interior */
body.single-product .related.products li.product >
.woocommerce-LoopProduct-link {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
}

/* Imagen */
body.single-product .related.products li.product a img {
    display: block !important;
    width: 100% !important;
    height: 155px !important;
    margin: 0 0 12px !important;
    padding: 12px !important;
    object-fit: contain !important;
    border-radius: 10px !important;
    background:
        radial-gradient(circle at 50% 45%, #276b7e, #0d3b4c) !important;
}

/* Nombre */
body.single-product .related.products li.product
.woocommerce-loop-product__title {
    margin: 0 5px 5px !important;
    padding: 0 !important;
    color: #14283b !important;
    font-size: 15px !important;
    line-height: 1.15 !important;
    letter-spacing: .7px !important;
    text-transform: uppercase !important;
}

/* Precio */
body.single-product .related.products li.product .price {
    display: block !important;
    margin: 0 5px 12px !important;
    color: #c91f2c !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

body.single-product .related.products li.product .price * {
    color: inherit !important;
}

/* Botones alineados abajo */
body.single-product .related.products li.product .button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 42px !important;
    margin: auto 0 0 !important;
    padding: 9px 10px !important;
    border: 2px solid #c91f2c !important;
    border-radius: 8px !important;
    background: #c91f2c !important;
    color: #fff !important;
    box-shadow: 0 4px 0 #8f1320 !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    letter-spacing: 1.2px !important;
    text-align: center !important;
    text-transform: uppercase !important;
}

body.single-product .related.products li.product .button:hover {
    transform: translateY(2px) !important;
    border-color: #14283b !important;
    background: #14283b !important;
    box-shadow: 0 2px 0 #071725 !important;
}

/* Tablet */
@media (max-width: 900px) {
    body.single-product .related.products ul.products {
        grid-template-columns: repeat(2, minmax(0, 260px)) !important;
        justify-content: center !important;
    }
}

/* Móvil */
@media (max-width: 560px) {
    body.single-product .related.products {
        padding: 28px 16px 34px !important;
    }

    body.single-product .related.products ul.products {
        grid-template-columns: minmax(0, 290px) !important;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — MENU HERO + CATEGORY NAV
   ===================================================== */

html {
    scroll-behavior: smooth;
}

/* Permite que el bloque ocupe todo el ancho */
.rnr-menu-header {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    overflow: visible;
    background: #fff8ec;
}

/* =====================================================
   HERO
   ===================================================== */

.rnr-menu-hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 255px;
    padding: 48px 25px 43px;
    overflow: hidden;
    border-top: 1px solid rgba(21, 56, 74, .22);
    border-bottom: 4px double #15384a;
    background:
        radial-gradient(
            circle at center,
            rgba(255, 255, 255, .8),
            rgba(255, 248, 236, .92) 60%,
            #f5ead8 100%
        );
}

/* Líneas decorativas */
.rnr-menu-hero::before,
.rnr-menu-hero::after {
    content: "";
    position: absolute;
    left: 50%;
    width: min(82%, 1100px);
    height: 1px;
    transform: translateX(-50%);
    background: rgba(201, 31, 44, .28);
}

.rnr-menu-hero::before {
    top: 19px;
}

.rnr-menu-hero::after {
    bottom: 19px;
}

/* Puntos retro laterales */
.rnr-menu-hero__dots {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 175px;
    opacity: .34;
    background-image:
        radial-gradient(
            circle,
            #d92532 2.2px,
            transparent 2.6px
        );
    background-size: 15px 15px;
    pointer-events: none;
}

.rnr-menu-hero__dots--left {
    left: -35px;
    mask-image: linear-gradient(
        90deg,
        #000,
        transparent
    );
}

.rnr-menu-hero__dots--right {
    right: -35px;
    mask-image: linear-gradient(
        -90deg,
        #000,
        transparent
    );
}

/* Contenido */
.rnr-menu-hero__content {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1000px;
    text-align: center;
}

.rnr-menu-hero__eyebrow {
    display: inline-block;
    margin-bottom: 10px;
    color: #c91f2c;
    font-family: "Arial Narrow", sans-serif;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 4px;
    text-transform: uppercase;
}

/* Título y rayos */
.rnr-menu-hero__title-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(18px, 4vw, 48px);
}

.rnr-menu-hero h1 {
    margin: 0 !important;
    color: #161616 !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(66px, 9vw, 118px) !important;
    font-weight: 900 !important;
    line-height: .83 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase;
    text-shadow: 3px 3px 0 rgba(21, 56, 74, .12);
}

.rnr-menu-hero__bolt {
    display: block;
    color: #c91f2c;
    font-family: Impact, sans-serif;
    font-size: clamp(38px, 5vw, 65px);
    font-weight: 900;
    line-height: 1;
    transform: rotate(-12deg);
}

.rnr-menu-hero__bolt--right {
    transform: scaleX(-1) rotate(-12deg);
}

/* Frase */
.rnr-menu-hero p {
    position: relative;
    display: inline-block;
    margin: 18px 0 0 !important;
    color: #c91f2c !important;
    font-family:
        "Lobster",
        "Brush Script MT",
        cursive !important;
    font-size: clamp(19px, 2.4vw, 30px) !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
}

.rnr-menu-hero p::before,
.rnr-menu-hero p::after {
    content: "★";
    display: inline-block;
    margin: 0 15px;
    color: #15384a;
    font-family: Arial, sans-serif;
    font-size: 10px;
    vertical-align: middle;
}

/* =====================================================
   CATEGORY NAVIGATION
   ===================================================== */

.rnr-menu-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 10px clamp(15px, 4vw, 55px);
    background: #fff8ec;
    box-shadow: 0 9px 20px rgba(12, 47, 64, .13);
}

/* Ajuste para barra de WordPress */
body.admin-bar .rnr-menu-nav {
    top: 32px;
}

.rnr-menu-nav__inner {
    display: flex;
    align-items: stretch;
    justify-content: center;
    width: 100%;
    max-width: 1320px;
    min-height: 60px;
    margin: 0 auto;
    padding: 6px;
    overflow: hidden;
    border: 3px solid #8d9da3;
    border-radius: 18px;
    background:
        linear-gradient(
            180deg,
            #173e50,
            #092d3d
        );
    box-shadow:
        inset 0 0 0 2px #d9dedc,
        0 5px 0 rgba(21, 56, 74, .18);
}

/* Enlaces */
.rnr-menu-nav__link {
    position: relative;
    display: flex;
    flex: 1 1 0;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-width: 125px;
    padding: 14px 18px;
    border-right: 1px solid rgba(255, 255, 255, .28);
    color: #fff !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif !important;
    font-size: 16px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.3px;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;
    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}

.rnr-menu-nav__link:last-child {
    border-right: 0;
}

.rnr-menu-nav__link span {
    color: #fff;
    font-family: Arial, sans-serif;
    font-size: 10px;
}

.rnr-menu-nav__link:hover {
    background: rgba(255, 255, 255, .11);
    color: #fff !important;
}

/* Popular activo */
.rnr-menu-nav__link--active {
    border-right: 0;
    border-radius: 10px;
    background:
        linear-gradient(
            180deg,
            #df303b,
            #b91622
        );
    box-shadow:
        inset 0 0 0 2px rgba(255, 255, 255, .22),
        0 4px 0 #791019;
}

/* IDs de las próximas secciones */
#popular-picks,
#burgers,
#rolls,
#toasties-sandwiches,
#hot-drinks,
#cold-drinks {
    scroll-margin-top: 105px;
}

/* =====================================================
   TABLET
   ===================================================== */

@media (max-width: 900px) {
    .rnr-menu-hero {
        min-height: 225px;
        padding: 42px 20px 38px;
    }

    .rnr-menu-nav {
        padding: 9px 15px;
    }

    .rnr-menu-nav__inner {
        justify-content: flex-start;
        overflow-x: auto;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .rnr-menu-nav__inner::-webkit-scrollbar {
        display: none;
    }

    .rnr-menu-nav__link {
        flex: 0 0 auto;
        min-width: 145px;
        scroll-snap-align: start;
    }
}

/* =====================================================
   MOBILE
   ===================================================== */

@media (max-width: 782px) {
    body.admin-bar .rnr-menu-nav {
        top: 46px;
    }
}

@media (max-width: 600px) {
    .rnr-menu-hero {
        min-height: 205px;
        padding: 38px 15px 34px;
    }

    .rnr-menu-hero__dots {
        width: 85px;
        opacity: .22;
    }

    .rnr-menu-hero__eyebrow {
        margin-bottom: 9px;
        font-size: 9px;
        letter-spacing: 3px;
    }

    .rnr-menu-hero__title-row {
        gap: 12px;
    }

    .rnr-menu-hero h1 {
        font-size: clamp(55px, 18vw, 78px) !important;
    }

    .rnr-menu-hero__bolt {
        font-size: 34px;
    }

    .rnr-menu-hero p {
        max-width: 290px;
        margin-top: 15px !important;
        font-size: 19px !important;
    }

    .rnr-menu-hero p::before,
    .rnr-menu-hero p::after {
        display: none;
    }

    .rnr-menu-nav {
        padding: 8px 10px;
    }

    .rnr-menu-nav__inner {
        min-height: 54px;
        border-radius: 14px;
    }

    .rnr-menu-nav__link {
        min-width: 125px;
        padding: 12px 14px;
        font-size: 14px;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — POPULAR PICKS
   ===================================================== */

.rnr-popular {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    padding: 52px clamp(18px, 5vw, 75px) 60px;
    overflow: hidden;
    border-bottom: 5px solid #c91f2c;
    background:
        radial-gradient(
            circle at 50% 0,
            rgba(255,255,255,.85),
            transparent 48%
        ),
        #fff8ec;
}

.rnr-popular__inner {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
}

/* =====================================================
   SECTION HEADING
   ===================================================== */

.rnr-section-heading {
    margin-bottom: 30px;
    text-align: center;
}

.rnr-section-heading__eyebrow {
    display: block;
    margin-bottom: 9px;
    color: #c91f2c;
    font-family: "Arial Narrow", sans-serif;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.rnr-section-heading__title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
}

.rnr-section-heading__title h2 {
    flex: 0 0 auto;
    margin: 0 !important;
    color: #151515 !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(38px, 5vw, 58px) !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase;
}

.rnr-section-heading__line {
    width: min(18vw, 230px);
    height: 1px;
    background: #c91f2c;
}

.rnr-section-heading__star {
    flex: 0 0 auto;
    color: #c91f2c;
    font-family: Arial, sans-serif;
    font-size: 15px;
}

.rnr-section-heading > p {
    margin: 10px 0 0 !important;
    color: #56636a !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
}

/* =====================================================
   GRID
   ===================================================== */

.rnr-popular__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

/* =====================================================
   CARD
   ===================================================== */

.rnr-popular-card {
    display: grid;
    grid-template-columns: minmax(145px, 45%) minmax(0, 55%);
    min-width: 0;
    overflow: hidden;
    border: 2px solid #8e9ca1;
    border-bottom: 6px solid #c91f2c;
    border-radius: 17px;
    background: #fffaf1;
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.75),
        0 13px 28px rgba(13,47,63,.15);
    transition:
        transform .22s ease,
        box-shadow .22s ease;
}

.rnr-popular-card:hover {
    transform: translateY(-5px);
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.75),
        0 20px 36px rgba(13,47,63,.22);
}

/* =====================================================
   IMAGE
   ===================================================== */

.rnr-popular-card__image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 275px;
    padding: 23px 15px 18px;
    overflow: hidden;
    border-right: 1px solid rgba(255,255,255,.22);
    background:
        radial-gradient(
            circle at 50% 44%,
            #327b8d,
            #174f64 42%,
            #0a3343 100%
        );
}

.rnr-popular-card__image::after {
    content: "";
    position: absolute;
    right: 13%;
    bottom: 14px;
    left: 13%;
    height: 14px;
    border-radius: 50%;
    background: rgba(0,0,0,.28);
    filter: blur(8px);
}

.rnr-popular-card__image img {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    height: 220px;
    object-fit: contain;
    transition: transform .25s ease;
}

.rnr-popular-card:hover .rnr-popular-card__image img {
    transform: scale(1.045);
}

/* Badge */
.rnr-popular-card__badge {
    position: absolute;
    top: 13px;
    left: 12px;
    z-index: 4;
    padding: 6px 9px 5px;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 6px;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 3px 0 #821019;
    font-family: "Arial Narrow", sans-serif;
    font-size: 8px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

/* =====================================================
   CONTENT
   ===================================================== */

.rnr-popular-card__content {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 24px 20px 21px;
}

.rnr-popular-card__top {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
    margin-bottom: 11px;
}

.rnr-popular-card h3 {
    flex: 1 1 135px;
    margin: 0 !important;
    color: #142f3f !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(22px, 2vw, 29px) !important;
    font-weight: 900 !important;
    line-height: .98 !important;
    letter-spacing: .6px !important;
    text-transform: uppercase;
}

.rnr-popular-card__price {
    flex: 0 0 auto;
    padding: 7px 9px 6px;
    border-radius: 7px;
    background: #123f51;
    color: #fff;
    box-shadow: 0 3px 0 #071f2a;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 17px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .5px;
}

.rnr-popular-card__content > p {
    margin: 0 0 18px !important;
    color: #4f5f67 !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* =====================================================
   BUTTON
   ===================================================== */

.rnr-popular-card__button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 45px;
    margin-top: auto;
    padding: 11px 14px;
    border: 2px solid #e33a45;
    border-radius: 8px;
    background:
        linear-gradient(
            180deg,
            #dc303b,
            #ba1722
        );
    color: #fff !important;
    box-shadow: 0 4px 0 #811019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.6px;
    text-decoration: none !important;
    text-transform: uppercase;
    transition:
        transform .18s ease,
        background .18s ease,
        box-shadow .18s ease;
}

.rnr-popular-card__button span {
    font-family: Arial, sans-serif;
    font-size: 18px;
    line-height: 1;
}

.rnr-popular-card__button:hover {
    transform: translateY(2px);
    background:
        linear-gradient(
            180deg,
            #194f63,
            #0d3444
        );
    border-color: #194f63;
    color: #fff !important;
    box-shadow: 0 2px 0 #071f2a;
}

/* =====================================================
   RESPONSIVE
   ===================================================== */

@media (max-width: 1150px) {
    .rnr-popular__grid {
        grid-template-columns: 1fr;
        max-width: 780px;
        margin: 0 auto;
    }

    .rnr-popular-card {
        grid-template-columns: 42% 58%;
    }

    .rnr-popular-card__image {
        min-height: 240px;
    }
}

@media (max-width: 600px) {
    .rnr-popular {
        padding: 38px 15px 45px;
    }

    .rnr-section-heading__line {
        width: 30px;
    }

    .rnr-section-heading__star {
        display: none;
    }

    .rnr-popular-card {
        grid-template-columns: 1fr;
    }

    .rnr-popular-card__image {
        min-height: 220px;
        border-right: 0;
        border-bottom: 1px solid rgba(255,255,255,.25);
    }

    .rnr-popular-card__image img {
        height: 185px;
    }

    .rnr-popular-card__content {
        padding: 19px 18px 20px;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — BURGERS
   ===================================================== */

.rnr-burgers {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    padding: 52px clamp(18px, 5vw, 75px) 62px;
    overflow: hidden;
    border-bottom: 5px solid #c91f2c;
    background:
        radial-gradient(
            rgba(255,255,255,.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            145deg,
            #174f64,
            #082d3d 72%
        );
    background-size: 9px 9px, auto;
}

.rnr-burgers::before,
.rnr-burgers::after {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 50%;
    pointer-events: none;
}

.rnr-burgers::before {
    top: -145px;
    left: -110px;
}

.rnr-burgers::after {
    right: -120px;
    bottom: -160px;
}

.rnr-burgers__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* Cabecera clara */
.rnr-section-heading--light
.rnr-section-heading__eyebrow {
    color: #f2b4aa;
}

.rnr-section-heading--light
.rnr-section-heading__title h2 {
    color: #fff !important;
    text-shadow: 3px 3px 0 rgba(0,0,0,.18);
}

.rnr-section-heading--light
.rnr-section-heading__line {
    background: rgba(255,255,255,.42);
}

.rnr-section-heading--light
.rnr-section-heading__star {
    color: #ef3743;
}

.rnr-section-heading--light > p {
    color: rgba(255,255,255,.72) !important;
}

/* Grid */
.rnr-burgers__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 21px;
}

/* Tarjeta */
.rnr-burger-card {
    display: flex;
    min-width: 0;
    overflow: hidden;
    flex-direction: column;
    border: 2px solid #96a3a7;
    border-bottom: 6px solid #c91f2c;
    border-radius: 17px;
    background: #fff9ee;
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.75),
        0 16px 32px rgba(0,0,0,.25);
    transition:
        transform .22s ease,
        box-shadow .22s ease;
}

.rnr-burger-card:hover {
    transform: translateY(-6px);
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.75),
        0 23px 42px rgba(0,0,0,.33);
}

/* Imagen */
.rnr-burger-card__image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 260px;
    padding: 28px 25px 18px;
    overflow: hidden;
    border-bottom: 1px solid rgba(20,47,63,.12);
    background:
        radial-gradient(
            circle at 50% 45%,
            #fffdf7,
            #f0e4d2 80%
        );
}

.rnr-burger-card__image::after {
    content: "";
    position: absolute;
    right: 19%;
    bottom: 18px;
    left: 19%;
    height: 15px;
    border-radius: 50%;
    background: rgba(20,47,63,.2);
    filter: blur(8px);
}

.rnr-burger-card__image img {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    height: 220px;
    object-fit: contain;
    transition: transform .25s ease;
}

.rnr-burger-card:hover
.rnr-burger-card__image img {
    transform: scale(1.05);
}

/* Badge */
.rnr-burger-card__badge {
    position: absolute;
    top: 15px;
    left: 15px;
    z-index: 4;
    padding: 7px 10px 6px;
    border-radius: 6px;
    background: #123f51;
    color: #fff;
    box-shadow: 0 3px 0 #071f2a;
    font-family: "Arial Narrow", sans-serif;
    font-size: 8px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.4px;
    text-transform: uppercase;
}

/* Contenido */
.rnr-burger-card__content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 22px 21px 20px;
}

.rnr-burger-card__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
}

.rnr-burger-card h3 {
    flex: 1 1 auto;
    margin: 0 !important;
    color: #142f3f !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(23px, 2.2vw, 31px) !important;
    font-weight: 900 !important;
    line-height: .98 !important;
    letter-spacing: .6px !important;
    text-transform: uppercase;
}

.rnr-burger-card__price {
    flex: 0 0 auto;
    padding: 8px 10px 7px;
    border-radius: 7px;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 3px 0 #811019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
}

.rnr-burger-card__content > p {
    margin: 0 0 19px !important;
    color: #526169 !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* Botón */
.rnr-burger-card__button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 45px;
    margin-top: auto;
    padding: 11px 14px;
    border: 2px solid #dc3440;
    border-radius: 8px;
    background:
        linear-gradient(
            180deg,
            #dc303b,
            #b91622
        );
    color: #fff !important;
    box-shadow: 0 4px 0 #811019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.6px;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: .18s ease;
}

.rnr-burger-card__button span {
    font-family: Arial, sans-serif;
    font-size: 18px;
}

.rnr-burger-card__button:hover {
    transform: translateY(2px);
    border-color: #123f51;
    background: #123f51;
    color: #fff !important;
    box-shadow: 0 2px 0 #071f2a;
}

/* Tablet */
@media (max-width: 900px) {
    .rnr-burgers__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .rnr-burger-card:last-child {
        grid-column: 1 / -1;
        width: calc(50% - 11px);
        justify-self: center;
    }
}

/* Móvil */
@media (max-width: 600px) {
    .rnr-burgers {
        padding: 40px 15px 48px;
    }

    .rnr-burgers__grid {
        grid-template-columns: 1fr;
    }

    .rnr-burger-card:last-child {
        grid-column: auto;
        width: 100%;
    }

    .rnr-burger-card__image {
        min-height: 225px;
    }

    .rnr-burger-card__image img {
        height: 190px;
    }

    .rnr-burger-card__content {
        padding: 19px 18px 20px;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — ROLLS
   ===================================================== */

.rnr-rolls {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    padding: 52px clamp(18px, 5vw, 75px) 62px;
    overflow: hidden;
    border-bottom: 5px solid #c91f2c;
    background:
        linear-gradient(
            90deg,
            rgba(201,31,44,.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            rgba(201,31,44,.035) 1px,
            transparent 1px
        ),
        #fff8ec;
    background-size: 26px 26px;
}

.rnr-rolls::before {
    content: "";
    position: absolute;
    top: -130px;
    left: 50%;
    width: 500px;
    height: 260px;
    transform: translateX(-50%);
    border: 1px solid rgba(201,31,44,.08);
    border-radius: 50%;
    pointer-events: none;
}

.rnr-rolls__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

.rnr-rolls__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

/* Tarjeta */
.rnr-roll-card {
    display: grid;
    grid-template-columns: minmax(220px, 47%) minmax(0, 53%);
    min-width: 0;
    overflow: hidden;
    border: 2px solid #8e9da2;
    border-bottom: 6px solid #c91f2c;
    border-radius: 18px;
    background: #fffaf1;
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.8),
        0 15px 32px rgba(13,47,63,.16);
    transition:
        transform .22s ease,
        box-shadow .22s ease;
}

.rnr-roll-card:hover {
    transform: translateY(-6px);
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.8),
        0 22px 42px rgba(13,47,63,.23);
}

/* Imagen */
.rnr-roll-card__image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 330px;
    padding: 28px 20px 21px;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 50% 44%,
            #2e7487,
            #164e62 47%,
            #0b3343 100%
        );
}

.rnr-roll-card__image::before {
    content: "";
    position: absolute;
    inset: 12px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 12px;
    pointer-events: none;
}

.rnr-roll-card__image::after {
    content: "";
    position: absolute;
    right: 15%;
    bottom: 25px;
    left: 15%;
    height: 16px;
    border-radius: 50%;
    background: rgba(0,0,0,.32);
    filter: blur(9px);
}

.rnr-roll-card__image img {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    height: 250px;
    object-fit: contain;
    transition: transform .25s ease;
}

.rnr-roll-card:hover
.rnr-roll-card__image img {
    transform: scale(1.05);
}

/* Badge */
.rnr-roll-card__badge {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 4;
    padding: 7px 10px 6px;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 6px;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 3px 0 #811019;
    font-family: "Arial Narrow", sans-serif;
    font-size: 8px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.3px;
    text-transform: uppercase;
}

/* Contenido */
.rnr-roll-card__content {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 31px 25px 25px;
}

.rnr-roll-card__number {
    position: absolute;
    top: 15px;
    right: 19px;
    color: rgba(20,47,63,.08);
    font-family: Impact, sans-serif;
    font-size: 58px;
    font-weight: 900;
    line-height: 1;
    pointer-events: none;
}

.rnr-roll-card__heading {
    position: relative;
    z-index: 2;
    margin: 34px 0 14px;
}

.rnr-roll-card h3 {
    max-width: 190px;
    margin: 0 0 12px !important;
    color: #142f3f !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(27px, 2.6vw, 38px) !important;
    font-weight: 900 !important;
    line-height: .95 !important;
    letter-spacing: .6px !important;
    text-transform: uppercase;
}

.rnr-roll-card__price {
    display: inline-flex;
    padding: 8px 11px 7px;
    border-radius: 7px;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 3px 0 #811019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 19px;
    font-weight: 900;
    line-height: 1;
}

.rnr-roll-card__content > p {
    position: relative;
    z-index: 2;
    margin: 0 0 20px !important;
    color: #526169 !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* Botón */
.rnr-roll-card__button {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 46px;
    margin-top: auto;
    padding: 11px 14px;
    border: 2px solid #173f51;
    border-radius: 8px;
    background:
        linear-gradient(
            180deg,
            #194f63,
            #0d3444
        );
    color: #fff !important;
    box-shadow: 0 4px 0 #071f2a;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.4px;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: .18s ease;
}

.rnr-roll-card__button span {
    font-family: Arial, sans-serif;
    font-size: 18px;
}

.rnr-roll-card__button:hover {
    transform: translateY(2px);
    border-color: #d72b37;
    background: #c91f2c;
    color: #fff !important;
    box-shadow: 0 2px 0 #811019;
}

/* Tablet */
@media (max-width: 1000px) {
    .rnr-rolls__grid {
        grid-template-columns: 1fr;
        max-width: 760px;
        margin: 0 auto;
    }
}

/* Móvil */
@media (max-width: 600px) {
    .rnr-rolls {
        padding: 40px 15px 48px;
    }

    .rnr-roll-card {
        grid-template-columns: 1fr;
    }

    .rnr-roll-card__image {
        min-height: 225px;
    }

    .rnr-roll-card__image img {
        height: 190px;
    }

    .rnr-roll-card__content {
        padding: 22px 19px 20px;
    }

    .rnr-roll-card__heading {
        margin-top: 17px;
    }

    .rnr-roll-card h3 {
        max-width: calc(100% - 75px);
    }

    .rnr-roll-card__number {
        top: 13px;
        font-size: 50px;
    }
}
/* =====================================================
   BURGERS — CORRECCIÓN COMPACTA
   ===================================================== */

/* Rejilla preparada para más hamburguesas */
.rnr-burgers__inner {
    max-width: 1320px !important;
}

.rnr-burgers__grid {
    display: grid !important;
    grid-template-columns:
        repeat(auto-fit, minmax(245px, 295px)) !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 18px !important;
}

/* Tarjetas más pequeñas */
.rnr-burger-card {
    width: 100% !important;
    max-width: 295px !important;
    min-height: 0 !important;
}

/* Limitar completamente la zona de imagen */
.rnr-burger-card__image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 205px !important;
    min-height: 205px !important;
    max-height: 205px !important;
    padding: 25px 20px 13px !important;
}

/* La imagen nunca puede desbordarse */
.rnr-burger-card__image img {
    display: block !important;
    width: auto !important;
    max-width: 225px !important;
    height: auto !important;
    max-height: 165px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
}

/* Sombra ajustada */
.rnr-burger-card__image::after {
    right: 22% !important;
    bottom: 14px !important;
    left: 22% !important;
    height: 10px !important;
}

/* Badge más pequeño */
.rnr-burger-card__badge {
    top: 12px !important;
    left: 12px !important;
    padding: 6px 9px 5px !important;
    font-size: 7px !important;
}

/* Contenido compacto */
.rnr-burger-card__content {
    padding: 17px 16px 16px !important;
}

.rnr-burger-card__heading {
    gap: 8px !important;
    margin-bottom: 8px !important;
}

.rnr-burger-card h3 {
    font-size: 23px !important;
    line-height: .98 !important;
}

/* Precio compacto */
.rnr-burger-card__price {
    padding: 7px 8px 6px !important;
    font-size: 15px !important;
}

/* Descripción */
.rnr-burger-card__content > p {
    display: -webkit-box !important;
    min-height: 54px !important;
    margin: 0 0 13px !important;
    overflow: hidden !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
}

/* Botón más compacto */
.rnr-burger-card__button {
    min-height: 41px !important;
    padding: 9px 12px !important;
    font-size: 12px !important;
}

/* Tablet */
@media (max-width: 900px) {
    .rnr-burgers__grid {
        grid-template-columns:
            repeat(2, minmax(245px, 295px)) !important;
    }

    .rnr-burger-card:last-child {
        grid-column: auto !important;
        width: 100% !important;
    }
}

/* Móvil */
@media (max-width: 580px) {
    .rnr-burgers__grid {
        grid-template-columns: minmax(0, 310px) !important;
    }

    .rnr-burger-card {
        max-width: 310px !important;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — TOASTIES & SANDWICHES
   ===================================================== */

.rnr-toasties {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    padding: 52px clamp(18px, 5vw, 75px) 65px;
    overflow: hidden;
    border-bottom: 5px solid #c91f2c;
    background:
        radial-gradient(
            rgba(255,255,255,.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            145deg,
            #174f64,
            #082d3d 72%
        );
    background-size: 9px 9px, auto;
}

.rnr-toasties::before {
    content: "";
    position: absolute;
    top: 48%;
    left: 50%;
    width: 900px;
    height: 420px;
    transform: translate(-50%, -50%);
    border: 1px solid rgba(255,255,255,.055);
    border-radius: 50%;
    pointer-events: none;
}

.rnr-toasties__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
}

/* =====================================================
   BUILDER CARD
   ===================================================== */

.rnr-toastie-builder {
    display: grid;
    grid-template-columns: minmax(330px, 43%) minmax(0, 57%);
    overflow: hidden;
    border: 3px solid #a6b0b3;
    border-bottom: 7px solid #c91f2c;
    border-radius: 21px;
    background: #fff9ee;
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.7),
        0 22px 45px rgba(0,0,0,.31);
}

/* =====================================================
   IMAGE
   ===================================================== */

.rnr-toastie-builder__visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 440px;
    padding: 40px 35px;
    overflow: hidden;
    border-right: 1px solid rgba(20,47,63,.14);
    background:
        radial-gradient(
            circle at 50% 47%,
            #fffdf7,
            #f0e4d2 78%
        );
}

.rnr-toastie-builder__visual::before {
    content: "";
    position: absolute;
    inset: 18px;
    border: 1px solid rgba(201,31,44,.13);
    border-radius: 15px;
}

.rnr-toastie-builder__visual::after {
    content: "";
    position: absolute;
    right: 18%;
    bottom: 48px;
    left: 18%;
    height: 17px;
    border-radius: 50%;
    background: rgba(20,47,63,.21);
    filter: blur(10px);
}

.rnr-toastie-builder__visual img {
    position: relative;
    z-index: 2;
    display: block;
    width: auto !important;
    max-width: 350px !important;
    height: auto !important;
    max-height: 305px !important;
    object-fit: contain !important;
    transition: transform .25s ease;
}

.rnr-toastie-builder:hover
.rnr-toastie-builder__visual img {
    transform: scale(1.035);
}

/* Badge */
.rnr-toastie-builder__badge {
    position: absolute;
    top: 24px;
    left: 24px;
    z-index: 4;
    padding: 8px 11px 7px;
    border-radius: 6px;
    background: #123f51;
    color: #fff;
    box-shadow: 0 4px 0 #071f2a;
    font-family: "Arial Narrow", sans-serif;
    font-size: 9px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

/* Sello */
.rnr-toastie-builder__stamp {
    position: absolute;
    top: 23px;
    right: 23px;
    z-index: 4;
    display: grid;
    place-items: center;
    width: 69px;
    height: 69px;
    border: 2px dashed #c91f2c;
    border-radius: 50%;
    color: #c91f2c;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 14px;
    font-weight: 900;
    line-height: .95;
    text-align: center;
    text-transform: uppercase;
    transform: rotate(8deg);
}

/* =====================================================
   CONTENT
   ===================================================== */

.rnr-toastie-builder__content {
    display: flex;
    flex-direction: column;
    padding: clamp(30px, 4vw, 48px);
}

.rnr-toastie-builder__eyebrow {
    display: block;
    margin-bottom: 9px;
    color: #c91f2c;
    font-family: "Arial Narrow", sans-serif;
    font-size: 9px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 2.5px;
    text-transform: uppercase;
}

.rnr-toastie-builder__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
}

.rnr-toastie-builder h3 {
    margin: 0 !important;
    color: #142f3f !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(38px, 5vw, 62px) !important;
    font-weight: 900 !important;
    line-height: .9 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase;
}

/* Precio */
.rnr-toastie-builder__price {
    flex: 0 0 auto;
    min-width: 82px;
    padding: 9px 11px 8px;
    border-radius: 8px;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 4px 0 #811019;
    text-align: center;
}

.rnr-toastie-builder__price small {
    display: block;
    margin-bottom: 3px;
    color: rgba(255,255,255,.73);
    font-family: Arial, sans-serif;
    font-size: 7px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 1.3px;
    text-transform: uppercase;
}

.rnr-toastie-builder__price strong {
    display: block;
    color: #fff;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 21px;
    line-height: 1;
}

/* Descripción */
.rnr-toastie-builder__description {
    margin: 0 0 23px !important;
    color: #526169 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

/* =====================================================
   STEPS
   ===================================================== */

.rnr-toastie-steps {
    display: grid;
    gap: 8px;
    margin-bottom: 24px;
}

.rnr-toastie-step {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 57px;
    padding: 8px 12px;
    border: 1px solid rgba(20,47,63,.12);
    border-radius: 10px;
    background: #f3ede2;
}

.rnr-toastie-step > span {
    display: grid;
    flex: 0 0 31px;
    place-items: center;
    width: 31px;
    height: 31px;
    border-radius: 50%;
    background: #123f51;
    color: #fff;
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: 900;
}

.rnr-toastie-step strong,
.rnr-toastie-step small {
    display: block;
}

.rnr-toastie-step strong {
    margin-bottom: 3px;
    color: #142f3f;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.rnr-toastie-step small {
    color: #6b767c;
    font-size: 12px;
    line-height: 1.2;
}

/* =====================================================
   BUTTON
   ===================================================== */

.rnr-toastie-builder__button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 51px;
    margin-top: auto;
    padding: 12px 16px;
    border: 2px solid #dd3541;
    border-radius: 9px;
    background:
        linear-gradient(
            180deg,
            #dc303b,
            #b91622
        );
    color: #fff !important;
    box-shadow: 0 5px 0 #811019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.8px;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: .18s ease;
}

.rnr-toastie-builder__button span {
    font-family: Arial, sans-serif;
    font-size: 20px;
}

.rnr-toastie-builder__button:hover {
    transform: translateY(2px);
    border-color: #123f51;
    background: #123f51;
    color: #fff !important;
    box-shadow: 0 3px 0 #071f2a;
}

/* =====================================================
   RESPONSIVE
   ===================================================== */

@media (max-width: 850px) {
    .rnr-toastie-builder {
        grid-template-columns: 1fr;
        max-width: 650px;
        margin: 0 auto;
    }

    .rnr-toastie-builder__visual {
        min-height: 320px;
        border-right: 0;
        border-bottom: 1px solid rgba(20,47,63,.14);
    }

    .rnr-toastie-builder__visual img {
        max-height: 245px !important;
    }
}

@media (max-width: 600px) {
    .rnr-toasties {
        padding: 40px 15px 48px;
    }

    .rnr-toastie-builder__visual {
        min-height: 260px;
        padding: 35px 25px 22px;
    }

    .rnr-toastie-builder__visual img {
        max-width: 260px !important;
        max-height: 195px !important;
    }

    .rnr-toastie-builder__stamp {
        width: 57px;
        height: 57px;
        font-size: 11px;
    }

    .rnr-toastie-builder__content {
        padding: 25px 19px 22px;
    }

    .rnr-toastie-builder h3 {
        font-size: 42px !important;
    }
}
/* =====================================================
   MENU PAGE — ELIMINAR ESPACIOS ENTRE BLOQUES ELEMENTOR
   Página ID: 208
   ===================================================== */

/* Contenedor principal de la página */
body.page-id-208 .elementor-208 {
    margin: 0 !important;
    padding: 0 !important;
}

/* Elementor Containers */
body.page-id-208 .elementor-208 .e-con {
    --gap: 0px !important;
    --row-gap: 0px !important;
    --column-gap: 0px !important;
    gap: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Solo contenedores estructurales directos */
body.page-id-208 .elementor-208 >
.e-con,
body.page-id-208 .elementor-208 >
.elementor-element {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Widgets HTML que contienen nuestros bloques */
body.page-id-208 .elementor-208
.elementor-widget-html {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

body.page-id-208 .elementor-208
.elementor-widget-html >
.elementor-widget-container {
    margin: 0 !important;
    padding: 0 !important;
}

/* Elementor antiguo: Sections y Columns */
body.page-id-208 .elementor-208
.elementor-section,
body.page-id-208 .elementor-208
.elementor-column,
body.page-id-208 .elementor-208
.elementor-container,
body.page-id-208 .elementor-208
.elementor-column-wrap,
body.page-id-208 .elementor-208
.elementor-widget-wrap {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Eliminar margen automático entre widgets */
body.page-id-208 .elementor-208
.elementor-widget:not(:last-child) {
    margin-bottom: 0 !important;
}

/* Evitar pequeños espacios producidos por párrafos vacíos */
body.page-id-208 .elementor-208
.elementor-widget-html p:empty {
    display: none !important;
    margin: 0 !important;
}

/* Nuestros bloques siempre unidos */
body.page-id-208 .rnr-menu-header,
body.page-id-208 .rnr-popular,
body.page-id-208 .rnr-burgers,
body.page-id-208 .rnr-rolls,
body.page-id-208 .rnr-toasties {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
/* =====================================================
   ROCK 'N' ROLLS — HOT DRINKS
   ===================================================== */

.rnr-hot-drinks {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    padding: 52px clamp(18px, 5vw, 75px) 62px;
    overflow: hidden;
    border-bottom: 5px solid #c91f2c;
    background:
        linear-gradient(
            90deg,
            rgba(201,31,44,.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            rgba(201,31,44,.035) 1px,
            transparent 1px
        ),
        #fff8ec;
    background-size: 27px 27px;
}

.rnr-hot-drinks__inner {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/* Rejilla compacta */
.rnr-hot-drinks__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 270px));
    justify-content: center;
    align-items: stretch;
    gap: 18px;
}

/* Tarjeta */
.rnr-hot-drink-card {
    display: flex;
    width: 100%;
    max-width: 270px;
    overflow: hidden;
    flex-direction: column;
    border: 2px solid #8e9da2;
    border-bottom: 6px solid #c91f2c;
    border-radius: 16px;
    background: #fffaf1;
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.8),
        0 14px 28px rgba(13,47,63,.16);
    transition:
        transform .22s ease,
        box-shadow .22s ease;
}

.rnr-hot-drink-card:hover {
    transform: translateY(-5px);
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.8),
        0 21px 37px rgba(13,47,63,.24);
}

/* Imagen completamente limitada */
.rnr-hot-drink-card__image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 200px;
    min-height: 200px;
    max-height: 200px;
    padding: 29px 20px 14px;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 50% 46%,
            #30798b,
            #174f64 45%,
            #0a3343 100%
        );
}

.rnr-hot-drink-card__image::after {
    content: "";
    position: absolute;
    right: 23%;
    bottom: 13px;
    left: 23%;
    height: 10px;
    border-radius: 50%;
    background: rgba(0,0,0,.32);
    filter: blur(7px);
}

.rnr-hot-drink-card__image img {
    position: relative;
    z-index: 2;
    display: block !important;
    width: auto !important;
    max-width: 185px !important;
    height: auto !important;
    max-height: 155px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    transition: transform .23s ease;
}

.rnr-hot-drink-card:hover
.rnr-hot-drink-card__image img {
    transform: scale(1.045);
}

/* Badge */
.rnr-hot-drink-card__badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 4;
    padding: 6px 9px 5px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 6px;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 3px 0 #811019;
    font-family: "Arial Narrow", sans-serif;
    font-size: 7px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

/* Contenido */
.rnr-hot-drink-card__content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 17px 16px 16px;
}

.rnr-hot-drink-card__heading {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 9px;
}

.rnr-hot-drink-card h3 {
    flex: 1 1 115px;
    margin: 0 !important;
    color: #142f3f !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: 23px !important;
    font-weight: 900 !important;
    line-height: .98 !important;
    letter-spacing: .5px !important;
    text-transform: uppercase;
}

.rnr-hot-drink-card__price {
    flex: 0 0 auto;
    padding: 7px 8px 6px;
    border-radius: 7px;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 3px 0 #811019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.rnr-hot-drink-card__content > p {
    display: -webkit-box;
    min-height: 50px;
    margin: 0 0 13px !important;
    overflow: hidden;
    color: #526169 !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

/* Botón */
.rnr-hot-drink-card__button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 41px;
    margin-top: auto;
    padding: 9px 12px;
    border: 2px solid #173f51;
    border-radius: 8px;
    background:
        linear-gradient(
            180deg,
            #194f63,
            #0d3444
        );
    color: #fff !important;
    box-shadow: 0 4px 0 #071f2a;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.4px;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: .18s ease;
}

.rnr-hot-drink-card__button span {
    font-family: Arial, sans-serif;
    font-size: 17px;
}

.rnr-hot-drink-card__button:hover {
    transform: translateY(2px);
    border-color: #d72b37;
    background: #c91f2c;
    color: #fff !important;
    box-shadow: 0 2px 0 #811019;
}

/* Tablet */
@media (max-width: 1000px) {
    .rnr-hot-drinks__grid {
        grid-template-columns: repeat(2, minmax(0, 270px));
    }
}

/* Móvil */
@media (max-width: 580px) {
    .rnr-hot-drinks {
        padding: 40px 15px 48px;
    }

    .rnr-hot-drinks__grid {
        grid-template-columns: minmax(0, 290px);
    }

    .rnr-hot-drink-card {
        max-width: 290px;
    }
}
/* =====================================================
   MENU — ELIMINAR GAP DEL CONTENEDOR PADRE
   ===================================================== */

.elementor-element.elementor-element-95205fa,
.elementor-element[data-id="95205fa"] {
    --gap: 0px !important;
    --row-gap: 0px !important;
    --column-gap: 0px !important;

    gap: 0 !important;
    row-gap: 0 !important;
    column-gap: 0 !important;

    margin: 0 !important;
    padding: 0 !important;
}

/* Widgets HTML dentro del contenedor */
.elementor-element-95205fa >
.elementor-widget-html {
    margin: 0 !important;
    padding: 0 !important;
}

/* Contenedor interno de cada widget */
.elementor-element-95205fa >
.elementor-widget-html >
.elementor-widget-container {
    margin: 0 !important;
    padding: 0 !important;
}

/* Eliminar cualquier separación automática */
.elementor-element-95205fa >
.elementor-widget:not(:last-child) {
    margin-bottom: 0 !important;
}
/* =====================================================
   ROCK 'N' ROLLS — COLD DRINKS
   ===================================================== */

.rnr-cold-drinks {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    padding: 52px clamp(18px, 5vw, 75px) 65px;
    overflow: hidden;
    border-bottom: 5px solid #c91f2c;
    background:
        radial-gradient(
            rgba(255,255,255,.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            145deg,
            #174f64,
            #082d3d 72%
        );
    background-size: 9px 9px, auto;
}

.rnr-cold-drinks__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
}

/* Tres tarjetas por fila */
.rnr-cold-drinks__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 310px));
    justify-content: center;
    align-items: stretch;
    gap: 19px;
}

/* Tarjeta */
.rnr-cold-drink-card {
    display: flex;
    width: 100%;
    max-width: 310px;
    overflow: hidden;
    flex-direction: column;
    border: 2px solid #97a4a8;
    border-bottom: 6px solid #c91f2c;
    border-radius: 16px;
    background: #fff9ee;
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.78),
        0 15px 30px rgba(0,0,0,.25);
    transition:
        transform .22s ease,
        box-shadow .22s ease;
}

.rnr-cold-drink-card:hover {
    transform: translateY(-5px);
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.78),
        0 22px 40px rgba(0,0,0,.33);
}

/* Zona de imagen limitada */
.rnr-cold-drink-card__image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 205px;
    min-height: 205px;
    max-height: 205px;
    padding: 28px 20px 14px;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 50% 46%,
            #337d8f,
            #174f64 44%,
            #0a3343 100%
        );
}

.rnr-cold-drink-card__image::after {
    content: "";
    position: absolute;
    right: 25%;
    bottom: 13px;
    left: 25%;
    height: 10px;
    border-radius: 50%;
    background: rgba(0,0,0,.34);
    filter: blur(7px);
}

/* Control estricto de imágenes */
.rnr-cold-drink-card__image img {
    position: relative;
    z-index: 2;
    display: block !important;
    width: auto !important;
    max-width: 210px !important;
    height: auto !important;
    max-height: 165px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    transition: transform .23s ease;
}

.rnr-cold-drink-card:hover
.rnr-cold-drink-card__image img {
    transform: scale(1.045);
}

/* Badge */
.rnr-cold-drink-card__badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 4;
    padding: 6px 9px 5px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 6px;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 3px 0 #811019;
    font-family: "Arial Narrow", sans-serif;
    font-size: 7px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

/* Contenido */
.rnr-cold-drink-card__content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 17px 16px 16px;
}

.rnr-cold-drink-card__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 9px;
}

.rnr-cold-drink-card h3 {
    flex: 1 1 auto;
    margin: 0 !important;
    color: #142f3f !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: 23px !important;
    font-weight: 900 !important;
    line-height: .98 !important;
    letter-spacing: .5px !important;
    text-transform: uppercase;
}

.rnr-cold-drink-card__price {
    flex: 0 0 auto;
    padding: 7px 8px 6px;
    border-radius: 7px;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 3px 0 #811019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.rnr-cold-drink-card__content > p {
    display: -webkit-box;
    min-height: 50px;
    margin: 0 0 13px !important;
    overflow: hidden;
    color: #526169 !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

/* Botón */
.rnr-cold-drink-card__button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 41px;
    margin-top: auto;
    padding: 9px 12px;
    border: 2px solid #d92d39;
    border-radius: 8px;
    background:
        linear-gradient(
            180deg,
            #dc303b,
            #b91622
        );
    color: #fff !important;
    box-shadow: 0 4px 0 #811019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.4px;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: .18s ease;
}

.rnr-cold-drink-card__button span {
    font-family: Arial, sans-serif;
    font-size: 17px;
}

.rnr-cold-drink-card__button:hover {
    transform: translateY(2px);
    border-color: #123f51;
    background: #123f51;
    color: #fff !important;
    box-shadow: 0 2px 0 #071f2a;
}

/* Productos simples */
.rnr-cold-drink-card__button--simple {
    border-color: #174f64;
    background:
        linear-gradient(
            180deg,
            #24677b,
            #123f51
        );
    box-shadow: 0 4px 0 #071f2a;
}

/* Tablet */
@media (max-width: 900px) {
    .rnr-cold-drinks__grid {
        grid-template-columns: repeat(2, minmax(0, 290px));
    }

    .rnr-cold-drink-card {
        max-width: 290px;
    }
}

/* Móvil */
@media (max-width: 580px) {
    .rnr-cold-drinks {
        padding: 40px 15px 48px;
    }

    .rnr-cold-drinks__grid {
        grid-template-columns: minmax(0, 300px);
    }

    .rnr-cold-drink-card {
        max-width: 300px;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — MENU CLOSING
   ===================================================== */

.rnr-menu-closing {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    overflow: hidden;
    border-bottom: 5px solid #c91f2c;
    background:
        radial-gradient(
            circle at 20% 20%,
            rgba(255,255,255,.85),
            transparent 38%
        ),
        #fff8ec;
}

.rnr-menu-closing__inner {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr);
    gap: clamp(30px, 5vw, 70px);
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 68px clamp(20px, 5vw, 70px);
}

/* =====================================================
   LEFT CONTENT
   ===================================================== */

.rnr-menu-closing__content {
    align-self: center;
}

.rnr-menu-closing__eyebrow {
    display: block;
    margin-bottom: 12px;
    color: #c91f2c;
    font-family: "Arial Narrow", sans-serif;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.rnr-menu-closing__content > h2 {
    margin: 0 0 20px !important;
    color: #142f3f !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(53px, 7vw, 82px) !important;
    font-weight: 900 !important;
    line-height: .85 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase;
}

.rnr-menu-closing__content > h2::after {
    content: "";
    display: block;
    width: 82px;
    height: 5px;
    margin-top: 20px;
    border-radius: 5px;
    background: #c91f2c;
}

.rnr-menu-closing__intro {
    max-width: 670px;
    margin: 0 0 28px !important;
    color: #4f5f67 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* =====================================================
   VALUES
   ===================================================== */

.rnr-menu-values {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.rnr-menu-value {
    min-width: 0;
    padding: 15px 13px;
    border: 1px solid rgba(20,47,63,.13);
    border-top: 4px solid #c91f2c;
    border-radius: 10px;
    background: #f3ede2;
}

.rnr-menu-value__number {
    display: block;
    margin-bottom: 13px;
    color: rgba(201,31,44,.28);
    font-family: Impact, sans-serif;
    font-size: 27px;
    font-weight: 900;
    line-height: 1;
}

.rnr-menu-value strong {
    display: block;
    margin-bottom: 7px;
    color: #142f3f;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 17px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .7px;
    text-transform: uppercase;
}

.rnr-menu-value p {
    margin: 0 !important;
    color: #69757a !important;
    font-size: 10px !important;
    line-height: 1.5 !important;
}

.rnr-menu-closing__dietary {
    margin: 17px 0 0 !important;
    color: #69757a !important;
    font-size: 10px !important;
    font-style: italic;
    line-height: 1.5 !important;
}

/* =====================================================
   CATERING CTA
   ===================================================== */

.rnr-menu-cta {
    position: relative;
    align-self: center;
    padding: 39px 34px 34px;
    overflow: hidden;
    border: 3px solid #899ca3;
    border-bottom: 7px solid #c91f2c;
    border-radius: 19px;
    background:
        radial-gradient(
            rgba(255,255,255,.06) 1px,
            transparent 1px
        ),
        linear-gradient(
            145deg,
            #174f64,
            #092f40
        );
    background-size: 9px 9px, auto;
    box-shadow: 0 20px 40px rgba(13,47,63,.25);
}

.rnr-menu-cta::before {
    content: "";
    position: absolute;
    top: -110px;
    right: -100px;
    width: 230px;
    height: 230px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 50%;
}

.rnr-menu-cta__star {
    display: grid;
    width: 41px;
    height: 41px;
    margin-bottom: 21px;
    place-items: center;
    border-radius: 50%;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 4px 0 #811019;
    font-family: Arial, sans-serif;
    font-size: 14px;
}

.rnr-menu-cta__eyebrow {
    display: block;
    margin-bottom: 9px;
    color: #f2b4aa;
    font-family: "Arial Narrow", sans-serif;
    font-size: 8px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.rnr-menu-cta h3 {
    max-width: 370px;
    margin: 0 0 15px !important;
    color: #fff !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(35px, 4vw, 49px) !important;
    font-weight: 900 !important;
    line-height: .92 !important;
    letter-spacing: .6px !important;
    text-transform: uppercase;
}

.rnr-menu-cta > p {
    margin: 0 0 23px !important;
    color: rgba(255,255,255,.72) !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
}

/* Buttons */
.rnr-menu-cta__button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 48px;
    margin-bottom: 10px;
    padding: 11px 15px;
    border-radius: 8px;
    color: #fff !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.5px;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: .18s ease;
}

.rnr-menu-cta__button span {
    font-family: Arial, sans-serif;
    font-size: 18px;
}

.rnr-menu-cta__button--primary {
    border: 2px solid #e23a45;
    background:
        linear-gradient(
            #dc303b,
            #b91622
        );
    box-shadow: 0 4px 0 #811019;
}

.rnr-menu-cta__button--secondary {
    border: 2px solid rgba(255,255,255,.68);
    background: rgba(255,255,255,.08);
    box-shadow: none;
}

.rnr-menu-cta__button:hover {
    transform: translateY(2px);
    border-color: #fff;
    background: #fff;
    color: #142f3f !important;
    box-shadow: 0 2px 0 rgba(0,0,0,.25);
}

.rnr-menu-cta > small {
    display: block;
    margin-top: 15px;
    color: rgba(255,255,255,.49);
    font-size: 8px;
    line-height: 1.4;
    letter-spacing: .6px;
}

/* =====================================================
   BOTTOM STRIP
   ===================================================== */

.rnr-menu-closing__bottom {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(15px, 3vw, 38px);
    min-height: 57px;
    padding: 14px 20px;
    overflow: hidden;
    background: #c91f2c;
    color: #fff;
    white-space: nowrap;
}

.rnr-menu-closing__bottom span {
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.rnr-menu-closing__bottom i {
    color: #fff4df;
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-style: normal;
}

/* =====================================================
   RESPONSIVE
   ===================================================== */

@media (max-width: 900px) {
    .rnr-menu-closing__inner {
        grid-template-columns: 1fr;
        max-width: 720px;
    }

    .rnr-menu-cta {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .rnr-menu-closing__inner {
        padding: 48px 17px;
    }

    .rnr-menu-values {
        grid-template-columns: 1fr;
    }

    .rnr-menu-value {
        display: flex;
        align-items: flex-start;
        gap: 13px;
    }

    .rnr-menu-value__number {
        flex: 0 0 auto;
        margin: 0;
    }

    .rnr-menu-cta {
        padding: 30px 22px 26px;
    }

    .rnr-menu-closing__bottom {
        justify-content: flex-start;
        overflow-x: hidden;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — CATERING HERO
   ===================================================== */

.rnr-catering-hero {
    position: relative;
    left: 50%;
    display: flex;
    align-items: center;
    width: 100vw;
    min-height: clamp(570px, 70vh, 720px);
    margin-left: -50vw;
    padding: 75px clamp(24px, 7vw, 135px);
    overflow: hidden;
    border-bottom: 5px solid #c91f2c;
    background-image:
        linear-gradient(
            90deg,
            rgba(255,248,236,1) 0%,
            rgba(255,248,236,.98) 31%,
            rgba(255,248,236,.82) 44%,
            rgba(255,248,236,.18) 63%,
            rgba(255,248,236,0) 76%
        ),
        url("https://rocknrolls.com.au/wp-content/uploads/2026/08/Background_hero_catering.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* Marco interior */
.rnr-catering-hero::before {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 20px;
    border: 1px solid rgba(20,47,63,.2);
    border-radius: 18px;
    pointer-events: none;
}

/* Línea cromada inferior */
.rnr-catering-hero::after {
    content: "";
    position: absolute;
    z-index: 3;
    right: 0;
    bottom: 7px;
    left: 0;
    height: 3px;
    background:
        linear-gradient(
            90deg,
            transparent,
            #99a5a9 15%,
            #edf0ed 50%,
            #99a5a9 85%,
            transparent
        );
}

/* Puntos retro */
.rnr-catering-hero__dots {
    position: absolute;
    z-index: 1;
    top: 0;
    bottom: 0;
    left: 0;
    width: 205px;
    opacity: .25;
    background-image:
        radial-gradient(
            circle,
            #c91f2c 2.2px,
            transparent 2.6px
        );
    background-size: 15px 15px;
    mask-image:
        linear-gradient(
            90deg,
            #000,
            transparent
        );
    pointer-events: none;
}

.rnr-catering-hero__star {
    position: absolute;
    z-index: 2;
    top: 70px;
    left: 48%;
    color: rgba(201,31,44,.5);
    font-family: Arial, sans-serif;
    font-size: 20px;
    transform: rotate(13deg);
}

/* Contenido */
.rnr-catering-hero__content {
    position: relative;
    z-index: 5;
    width: min(100%, 710px);
}

/* Etiqueta */
.rnr-catering-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    padding: 9px 13px 8px;
    border: 1px solid rgba(20,63,81,.25);
    border-radius: 7px;
    background: rgba(255,255,255,.66);
    color: #143f51;
    box-shadow: 0 3px 0 rgba(20,63,81,.15);
    font-family: "Arial Narrow", sans-serif;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 2.7px;
    text-transform: uppercase;
}

.rnr-catering-hero__eyebrow::before {
    content: "★";
    color: #c91f2c;
    font-family: Arial, sans-serif;
    font-size: 12px;
}

/* Título */
.rnr-catering-hero h1 {
    max-width: 690px;
    margin: 0 0 22px !important;
    color: #151515 !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(72px, 8vw, 126px) !important;
    font-weight: 900 !important;
    line-height: .78 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase;
    text-shadow: 3px 3px 0 rgba(20,63,81,.13);
}

.rnr-catering-hero h1 span {
    display: block;
    color: #c91f2c;
    text-shadow: 3px 3px 0 rgba(129,16,25,.16);
}

/* Línea y rayo */
.rnr-catering-hero__rule {
    display: flex;
    align-items: center;
    gap: 11px;
    width: 190px;
    margin-bottom: 21px;
}

.rnr-catering-hero__rule::before {
    content: "";
    flex: 1 1 auto;
    height: 5px;
    border-radius: 5px;
    background: #c91f2c;
}

.rnr-catering-hero__rule::after {
    content: "ϟ";
    color: #c91f2c;
    font-family: Impact, sans-serif;
    font-size: 27px;
    line-height: 1;
    transform: rotate(-12deg);
}

/* Textos */
.rnr-catering-hero__lead {
    max-width: 570px;
    margin: 0 0 13px !important;
    color: #263f4b !important;
    font-size: clamp(17px, 1.6vw, 22px) !important;
    font-weight: 800 !important;
    line-height: 1.42 !important;
}

.rnr-catering-hero__support {
    max-width: 600px;
    margin: 0 0 29px !important;
    color: #5a666c !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* Botones */
.rnr-catering-hero__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 13px;
}

.rnr-catering-hero__button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    min-height: 54px;
    padding: 13px 18px;
    border-radius: 9px;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1.6px;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: .18s ease;
}

.rnr-catering-hero__button span {
    font-family: Arial, sans-serif;
    font-size: 19px;
}

.rnr-catering-hero__button--primary {
    min-width: 245px;
    border: 2px solid #e13a45;
    background:
        linear-gradient(
            #dd303b,
            #b91622
        );
    color: #fff !important;
    box-shadow:
        inset 0 0 0 2px rgba(255,255,255,.16),
        0 5px 0 #801019;
}

.rnr-catering-hero__button--secondary {
    min-width: 215px;
    border: 2px solid #143f51;
    background: rgba(255,248,236,.82);
    color: #143f51 !important;
    box-shadow: 0 5px 0 rgba(20,63,81,.22);
}

.rnr-catering-hero__button:hover {
    transform: translateY(2px);
}

/* Tablet */
@media (max-width: 1050px) {
    .rnr-catering-hero {
        min-height: 650px;
        padding-right: 40px;
        padding-left: 40px;
        background-position: 63% center;
    }

    .rnr-catering-hero__content {
        width: min(65%, 650px);
    }
}

/* Móvil */
@media (max-width: 700px) {
    .rnr-catering-hero {
        align-items: flex-end;
        min-height: 760px;
        padding: 280px 16px 31px;
        background-image:
            linear-gradient(
                180deg,
                rgba(255,248,236,.05) 0%,
                rgba(255,248,236,.35) 28%,
                rgba(255,248,236,.96) 51%,
                #fff8ec 70%
            ),
            url("https://rocknrolls.com.au/wp-content/uploads/2026/08/Background_hero_catering.webp");
        background-position: 68% top;
        background-size: auto 430px;
    }

    .rnr-catering-hero::before {
        inset: 10px;
        border-radius: 13px;
    }

    .rnr-catering-hero__dots,
    .rnr-catering-hero__star {
        display: none;
    }

    .rnr-catering-hero__content {
        width: 100%;
    }

    .rnr-catering-hero h1 {
        font-size: clamp(62px, 19vw, 88px) !important;
    }

    .rnr-catering-hero__lead {
        font-size: 16px !important;
    }

    .rnr-catering-hero__support {
        font-size: 11px !important;
    }

    .rnr-catering-hero__actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .rnr-catering-hero__button {
        width: 100%;
        min-width: 0;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — CATERING EVENT TYPES
   ===================================================== */

.rnr-catering-events {
    position: relative;
    left: 50%;
    z-index: 10;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100vw;
    min-height: 96px;
    margin-left: -50vw;
    overflow: hidden;
    border-top: 2px solid #9ca9ad;
    border-bottom: 5px solid #c91f2c;
    background:
        radial-gradient(
            rgba(255,255,255,.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            180deg,
            #174f64,
            #092f40
        );
    background-size: 8px 8px, auto;
    box-shadow: 0 9px 22px rgba(13,47,63,.18);
}

/* Evento */
.rnr-catering-event {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    min-width: 0;
    padding: 18px 22px;
    overflow: hidden;
    border-right: 1px solid rgba(255,255,255,.22);
    color: #fff !important;
    text-decoration: none !important;
    transition:
        background .18s ease,
        transform .18s ease;
}

.rnr-catering-event:last-child {
    border-right: 0;
}

/* Línea roja al pasar */
.rnr-catering-event::after {
    content: "";
    position: absolute;
    right: 50%;
    bottom: 0;
    left: 50%;
    height: 4px;
    background: #ef3743;
    transition:
        right .2s ease,
        left .2s ease;
}

.rnr-catering-event:hover {
    background: rgba(255,255,255,.09);
    color: #fff !important;
}

.rnr-catering-event:hover::after {
    right: 0;
    left: 0;
}

/* Número */
.rnr-catering-event__number {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 50%;
    background:
        linear-gradient(
            180deg,
            #dc303b,
            #b91622
        );
    color: #fff;
    box-shadow:
        inset 0 0 0 2px rgba(255,255,255,.12),
        0 4px 0 #801019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
}

/* Textos */
.rnr-catering-event__content {
    display: block;
    min-width: 0;
}

.rnr-catering-event__content strong,
.rnr-catering-event__content small {
    display: block;
}

.rnr-catering-event__content strong {
    margin-bottom: 5px;
    color: #fff;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 19px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.rnr-catering-event__content small {
    color: rgba(255,255,255,.58);
    font-size: 12px;
    line-height: 1.3;
}

/* Tablet */
@media (max-width: 900px) {
    .rnr-catering-events {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .rnr-catering-event:nth-child(2) {
        border-right: 0;
    }

    .rnr-catering-event:nth-child(-n+2) {
        border-bottom: 1px solid rgba(255,255,255,.18);
    }
}

/* Móvil */
@media (max-width: 560px) {
    .rnr-catering-events {
        grid-template-columns: 1fr;
    }

    .rnr-catering-event {
        justify-content: flex-start;
        min-height: 74px;
        padding: 14px 21px;
        border-right: 0;
        border-bottom: 1px solid rgba(255,255,255,.18);
    }

    .rnr-catering-event:last-child {
        border-bottom: 0;
    }

    .rnr-catering-event__number {
        flex-basis: 38px;
        width: 38px;
        height: 38px;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — CATERING OPTIONS
   ===================================================== */

.rnr-catering-options {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    padding: 55px clamp(18px, 5vw, 70px) 65px;
    overflow: hidden;
    border-bottom: 5px solid #c91f2c;
    background:
        linear-gradient(
            90deg,
            rgba(201,31,44,.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            rgba(201,31,44,.035) 1px,
            transparent 1px
        ),
        #fff8ec;
    background-size: 27px 27px;
}

.rnr-catering-options__inner {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
}

/* =====================================================
   HEADING
   ===================================================== */

.rnr-catering-options__heading {
    margin-bottom: 31px;
    text-align: center;
}

.rnr-catering-options__eyebrow {
    display: block;
    margin-bottom: 9px;
    color: #c91f2c;
    font-family: "Arial Narrow", sans-serif;
    font-size: 9px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.rnr-catering-options__title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
}

.rnr-catering-options__title > span {
    width: min(17vw, 210px);
    height: 1px;
    background: #c91f2c;
}

.rnr-catering-options__title i {
    color: #c91f2c;
    font-family: Arial, sans-serif;
    font-size: 13px;
    font-style: normal;
}

.rnr-catering-options__title h2 {
    flex: 0 0 auto;
    margin: 0 !important;
    color: #151515 !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(39px, 5vw, 58px) !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase;
}

.rnr-catering-options__heading > p {
    max-width: 650px;
    margin: 10px auto 0 !important;
    color: #657177 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

/* =====================================================
   GRID
   ===================================================== */

.rnr-catering-options__grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 185px));
    justify-content: center;
    align-items: stretch;
    gap: 13px;
}

/* =====================================================
   CARD
   ===================================================== */

.rnr-catering-option {
    display: flex;
    width: 100%;
    min-width: 0;
    max-width: 185px;
    overflow: hidden;
    flex-direction: column;
    border: 2px solid #929fa3;
    border-bottom: 5px solid #c91f2c;
    border-radius: 14px;
    background: #fffaf1;
    box-shadow:
        inset 0 0 0 2px rgba(255,255,255,.8),
        0 12px 24px rgba(13,47,63,.15);
    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

.rnr-catering-option:hover {
    transform: translateY(-5px);
    box-shadow:
        inset 0 0 0 2px rgba(255,255,255,.8),
        0 18px 30px rgba(13,47,63,.23);
}

/* Imagen */
.rnr-catering-option__image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 145px;
    min-height: 145px;
    max-height: 145px;
    padding: 20px 14px 10px;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 50% 46%,
            #327b8d,
            #174f64 47%,
            #0a3343
        );
}

.rnr-catering-option__image::after {
    content: "";
    position: absolute;
    right: 24%;
    bottom: 10px;
    left: 24%;
    height: 8px;
    border-radius: 50%;
    background: rgba(0,0,0,.3);
    filter: blur(6px);
}

.rnr-catering-option__image img {
    position: relative;
    z-index: 2;
    display: block !important;
    width: auto !important;
    max-width: 140px !important;
    height: auto !important;
    max-height: 110px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    transition: transform .2s ease;
}

.rnr-catering-option:hover
.rnr-catering-option__image img {
    transform: scale(1.05);
}

/* Contenido */
.rnr-catering-option__content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 13px 12px 12px;
}

.rnr-catering-option__number {
    display: block;
    margin-bottom: 7px;
    color: rgba(201,31,44,.32);
    font-family: Impact, sans-serif;
    font-size: 17px;
    line-height: 1;
}

.rnr-catering-option h3 {
    min-height: 38px;
    margin: 0 0 7px !important;
    color: #142f3f !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    line-height: 1.03 !important;
    letter-spacing: .4px !important;
    text-transform: uppercase;
}

.rnr-catering-option__content > p {
    min-height: 48px;
    margin: 0 0 11px !important;
    color: #657177 !important;
    font-size: 9px !important;
    line-height: 1.45 !important;
}

/* Link */
.rnr-catering-option__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid rgba(20,47,63,.13);
    color: #c91f2c !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 1px;
    text-decoration: none !important;
    text-transform: uppercase;
}

.rnr-catering-option__link span {
    font-family: Arial, sans-serif;
    font-size: 14px;
}

/* =====================================================
   CUSTOM CARD
   ===================================================== */

.rnr-catering-option--custom {
    border-color: #c91f2c;
    background: #fff4e6;
}

.rnr-catering-option__custom-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 145px;
    min-height: 145px;
    flex-direction: column;
    background:
        radial-gradient(
            rgba(255,255,255,.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            145deg,
            #d62c38,
            #a81420
        );
    background-size: 8px 8px, auto;
    color: #fff !important;
    text-decoration: none !important;
}

.rnr-catering-option__custom-visual > span {
    display: grid;
    width: 58px;
    height: 58px;
    margin-bottom: 9px;
    place-items: center;
    border: 2px solid rgba(255,255,255,.75);
    border-radius: 50%;
    color: #fff;
    font-family: Arial, sans-serif;
    font-size: 31px;
    font-weight: 300;
    line-height: 1;
}

.rnr-catering-option__custom-visual small {
    color: rgba(255,255,255,.77);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* Tablet */
@media (max-width: 1100px) {
    .rnr-catering-options__grid {
        grid-template-columns: repeat(3, minmax(0, 185px));
    }
}

/* Móvil */
@media (max-width: 650px) {
    .rnr-catering-options {
        padding: 42px 15px 50px;
    }

    .rnr-catering-options__title > span {
        width: 28px;
    }

    .rnr-catering-options__title i {
        display: none;
    }

    .rnr-catering-options__grid {
        grid-template-columns: repeat(2, minmax(0, 155px));
        gap: 10px;
    }

    .rnr-catering-option {
        max-width: 155px;
    }

    .rnr-catering-option__image,
    .rnr-catering-option__custom-visual {
        height: 128px;
        min-height: 128px;
        max-height: 128px;
    }

    .rnr-catering-option__image img {
        max-width: 120px !important;
        max-height: 96px !important;
    }

    .rnr-catering-option h3 {
        font-size: 16px !important;
    }
}
/* =====================================================
   ROCK 'N' ROLLS — FINAL CATERING ENQUIRY
   Minimum font size: 12px
   ===================================================== */

.rnr-catering-final {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    padding: 72px clamp(20px, 5vw, 75px);
    overflow: hidden;
    border-bottom: 6px solid #c91f2c;
    background:
        radial-gradient(
            rgba(255,255,255,.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            145deg,
            #174f64,
            #082d3d 72%
        );
    background-size: 9px 9px, auto;
}

.rnr-catering-final::before {
    content: "";
    position: absolute;
    top: -170px;
    left: -150px;
    width: 400px;
    height: 400px;
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 50%;
    pointer-events: none;
}

.rnr-catering-final::after {
    content: "";
    position: absolute;
    right: -180px;
    bottom: -220px;
    width: 480px;
    height: 480px;
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 50%;
    pointer-events: none;
}

.rnr-catering-final__inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns:
        minmax(0, .88fr)
        minmax(520px, 1.12fr);
    gap: clamp(38px, 6vw, 85px);
    align-items: center;
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
}

/* =====================================================
   LEFT CONTENT
   ===================================================== */

.rnr-catering-final__eyebrow {
    display: block;
    margin-bottom: 14px;
    color: #f1b3ab;
    font-family: "Arial Narrow", sans-serif;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 2.8px;
    text-transform: uppercase;
}

.rnr-catering-final__content h2 {
    max-width: 610px;
    margin: 0 0 23px !important;
    color: #fff !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(54px, 6vw, 79px) !important;
    font-weight: 900 !important;
    line-height: .86 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase;
}

.rnr-catering-final__content h2 span {
    display: block;
    color: #ef3743;
}

.rnr-catering-final__lead {
    max-width: 590px;
    margin: 0 0 17px !important;
    color: #fff !important;
    font-size: 19px !important;
    font-weight: 800 !important;
    line-height: 1.45 !important;
}

.rnr-catering-final__text {
    max-width: 610px;
    margin: 0 0 14px !important;
    color: rgba(255,255,255,.7) !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* =====================================================
   STEPS
   ===================================================== */

.rnr-catering-final__steps {
    display: grid;
    gap: 9px;
    margin-top: 25px;
}

.rnr-catering-final__step {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    min-height: 72px;
    padding: 13px 15px;
    border: 1px solid rgba(255,255,255,.14);
    border-left: 5px solid #ef3743;
    border-radius: 0 9px 9px 0;
    background: rgba(255,255,255,.065);
}

.rnr-catering-final__step > span {
    display: grid;
    flex: 0 0 39px;
    width: 39px;
    height: 39px;
    place-items: center;
    border-radius: 50%;
    background: #c91f2c;
    color: #fff;
    box-shadow: 0 3px 0 #801019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 14px;
    font-weight: 900;
}

.rnr-catering-final__step strong {
    display: block;
    margin: 1px 0 5px;
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.2;
    text-transform: uppercase;
}

.rnr-catering-final__step p {
    margin: 0 !important;
    color: rgba(255,255,255,.65) !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

/* Aviso */
.rnr-catering-final__notice {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 17px;
    padding: 13px 15px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 9px;
    background: rgba(0,0,0,.09);
}

.rnr-catering-final__notice > span {
    flex: 0 0 auto;
    color: #ef3743;
    font-family: Arial, sans-serif;
    font-size: 15px;
}

.rnr-catering-final__notice p {
    margin: 0 !important;
    color: rgba(255,255,255,.7) !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

/* =====================================================
   FORM SHELL
   ===================================================== */

.rnr-catering-form-shell {
    position: relative;
    padding: 31px;
    overflow: hidden;
    border: 3px solid #96a2a6;
    border-bottom: 7px solid #c91f2c;
    border-radius: 20px;
    background: #fff8ec;
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.7),
        0 24px 50px rgba(0,0,0,.32);
}

.rnr-catering-form-shell::before {
    content: "";
    position: absolute;
    top: -105px;
    right: -95px;
    width: 230px;
    height: 230px;
    border: 1px solid rgba(201,31,44,.09);
    border-radius: 50%;
    pointer-events: none;
}

/* Cabecera del formulario */
.rnr-catering-form-shell__top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 17px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(20,47,63,.14);
}

.rnr-catering-form-shell__number {
    display: grid;
    flex: 0 0 62px;
    width: 62px;
    height: 62px;
    place-items: center;
    border-radius: 50%;
    background:
        linear-gradient(
            #dc303b,
            #b91622
        );
    color: #fff;
    box-shadow:
        inset 0 0 0 2px rgba(255,255,255,.15),
        0 4px 0 #801019;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        sans-serif;
    font-size: 19px;
    font-weight: 900;
    letter-spacing: 1px;
}

.rnr-catering-form-shell__eyebrow {
    display: block;
    margin-bottom: 6px;
    color: #c91f2c;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.rnr-catering-form-shell h3 {
    margin: 0 !important;
    color: #142f3f !important;
    font-family:
        "Bebas Neue",
        "Arial Narrow",
        Impact,
        sans-serif !important;
    font-size: clamp(34px, 4vw, 47px) !important;
    font-weight: 900 !important;
    line-height: .94 !important;
    letter-spacing: .6px !important;
    text-transform: uppercase;
}

.rnr-catering-form-shell__intro {
    position: relative;
    z-index: 2;
    margin: 0 0 21px !important;
    color: #657177 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

/* Shortcode */
.rnr-catering-form-shell__shortcode {
    position: relative;
    z-index: 2;
    min-height: 300px;
}

/* Pie del formulario */
.rnr-catering-form-shell__footer {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 19px;
    padding-top: 16px;
    border-top: 1px solid rgba(20,47,63,.14);
}

.rnr-catering-form-shell__footer span {
    color: #68747a;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
}

.rnr-catering-form-shell__footer i {
    color: #c91f2c;
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-style: normal;
}

/* =====================================================
   RESPONSIVE
   ===================================================== */

@media (max-width: 1050px) {
    .rnr-catering-final__inner {
        grid-template-columns: 1fr;
        max-width: 760px;
    }
}

@media (max-width: 650px) {
    .rnr-catering-final {
        padding: 49px 16px;
    }

    .rnr-catering-final__lead {
        font-size: 17px !important;
    }

    .rnr-catering-form-shell {
        padding: 24px 18px 21px;
    }

    .rnr-catering-form-shell__number {
        flex-basis: 53px;
        width: 53px;
        height: 53px;
        font-size: 16px;
    }

    .rnr-catering-form-shell__footer {
        flex-direction: column;
    }

    .rnr-catering-form-shell__footer i {
        display: none;
    }
}
/* ==========================================================
   ROCK N ROLLS — CONTACT HERO
   COMPLETELY ISOLATED VERSION
========================================================== */

#krr-contact-cover {
    position: relative;
    width: 100%;
    min-height: 450px;

    display: flex;
    align-items: center;

    margin: 0;
    padding: 40px 0;

    overflow: hidden;

    background-image:
        url("https://rocknrolls.com.au/wp-content/uploads/2026/08/Background_hero_contact.webp");

    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}


/* =========================
   INNER WIDTH
========================= */

#krr-contact-cover .krr-contact-cover__container {
    position: relative;
    z-index: 2;

    width: min(1380px, calc(100% - 80px));
    margin: 0 auto;
}


/* =========================
   COPY
========================= */

#krr-contact-cover .krr-contact-cover__copy {
    width: 48%;
    max-width: 650px;
}


/* =========================
   SMALL CONTACT LABEL
========================= */

#krr-contact-cover .krr-contact-cover__tag {
    display: inline-flex;
    align-items: center;

    margin: 0 0 18px;

    color: #bd2026;

    font-size: 13px;
    font-weight: 800;
    line-height: 1;

    letter-spacing: 4px;
    text-transform: uppercase;
}


#krr-contact-cover .krr-contact-cover__tag::before {
    content: "✦";

    display: inline-block;

    margin-right: 12px;

    font-size: 17px;
    line-height: 1;

    color: #bd2026;
}


/* =========================
   MAIN TITLE
========================= */

#krr-contact-cover .krr-contact-cover__title {
    display: block;

    margin: 0 !important;
    padding: 0 !important;

    font-family: inherit;

    font-size: clamp(82px, 8.8vw, 142px) !important;
    font-weight: 900 !important;

    line-height: .78 !important;
    letter-spacing: -6px !important;

    text-transform: uppercase;
}


#krr-contact-cover .krr-contact-cover__title-blue,
#krr-contact-cover .krr-contact-cover__title-red {
    display: block;
}


#krr-contact-cover .krr-contact-cover__title-blue {
    color: #0d4761 !important;
}


#krr-contact-cover .krr-contact-cover__title-red {
    color: #bd2026 !important;
}


/* =========================
   RED LINE
========================= */

#krr-contact-cover .krr-contact-cover__line {
    width: 78px;
    height: 5px;

    margin: 29px 0 20px;

    background: #bd2026;

    border: 0;
    border-radius: 50px;
}


/* =========================
   DESCRIPTION
========================= */

#krr-contact-cover .krr-contact-cover__text {
    width: 100%;
    max-width: 470px;

    margin: 0 !important;
    padding: 0 !important;

    color: #252525 !important;

    font-size: 18px !important;
    font-weight: 600 !important;

    line-height: 1.55 !important;
}


/* ==========================================================
   TABLET
========================================================== */

@media screen and (max-width: 1050px) {

    #krr-contact-cover {
        min-height: 580px;

        background-position: 58% center;
    }


    #krr-contact-cover .krr-contact-cover__container {
        width: calc(100% - 50px);
    }


    #krr-contact-cover .krr-contact-cover__copy {
        width: 55%;
    }


    #krr-contact-cover .krr-contact-cover__title {
        font-size: clamp(70px, 10vw, 105px) !important;
        letter-spacing: -4px !important;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media screen and (max-width: 700px) {

    #krr-contact-cover {
        min-height: 510px;

        align-items: flex-start;

        padding: 75px 0 55px;

        background-position: 65% center;
    }


    #krr-contact-cover .krr-contact-cover__container {
        width: calc(100% - 30px);
    }


    #krr-contact-cover .krr-contact-cover__copy {
        width: 70%;
        max-width: 360px;
    }


    #krr-contact-cover .krr-contact-cover__tag {
        margin-bottom: 13px;

        font-size: 10px;
        letter-spacing: 3px;
    }


    #krr-contact-cover .krr-contact-cover__title {
        font-size: clamp(55px, 17vw, 78px) !important;

        line-height: .82 !important;
        letter-spacing: -3px !important;
    }


    #krr-contact-cover .krr-contact-cover__line {
        width: 58px;
        height: 4px;

        margin: 22px 0 17px;
    }


    #krr-contact-cover .krr-contact-cover__text {
        max-width: 300px;

        font-size: 15px !important;
        line-height: 1.5 !important;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media screen and (max-width: 430px) {

    #krr-contact-cover {
        min-height: 470px;

        background-position: 68% center;
    }


    #krr-contact-cover .krr-contact-cover__copy {
        width: 75%;
    }


    #krr-contact-cover .krr-contact-cover__title {
        font-size: 56px !important;
    }

}
/* ==========================================================
   ROCK 'N' ROLLS
   KITCHEN SCREEN HEADER
========================================================== */

#krr-kitchen-header {
    --krr-cream: #f3e7d1;
    --krr-cream-light: #fbf5e9;

    --krr-blue: #073b55;
    --krr-blue-dark: #052c40;

    --krr-red: #c92329;
    --krr-red-dark: #9f171c;

    --krr-green: #378b48;

    position: sticky;
    top: 0;
    z-index: 9999;

    width: 100%;

    margin: 0;
    padding: 0;

    background: var(--krr-cream-light);

    border-bottom: 5px solid var(--krr-red);

    box-shadow:
        0 4px 16px rgba(0, 0, 0, .08);
}


/* ==========================================================
   INNER
========================================================== */

#krr-kitchen-header .krr-kitchen-header__inner {

    width: 100%;

    min-height: 92px;

    margin: 0;
    padding: 12px 24px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;
}


/* ==========================================================
   BRAND
========================================================== */

#krr-kitchen-header .krr-kitchen-header__brand {

    display: flex;
    align-items: center;

    gap: 17px;

    min-width: 0;
}


#krr-kitchen-header .krr-kitchen-header__logo {

    display: block;

    width: 82px;
    height: 68px;

    object-fit: contain;

    flex: 0 0 auto;
}


/* ==========================================================
   SCREEN TITLE
========================================================== */

#krr-kitchen-header .krr-kitchen-header__title {

    display: flex;
    flex-direction: column;

    justify-content: center;

    min-width: 0;
}


#krr-kitchen-header .krr-kitchen-header__title strong {

    margin: 0;

    color: var(--krr-blue);

    font-size: 25px;
    line-height: 1;

    font-weight: 900;

    letter-spacing: -.02em;
}


#krr-kitchen-header .krr-kitchen-header__title span {

    display: block;

    margin-top: 6px;

    color: var(--krr-red);

    font-size: 9px;
    line-height: 1;

    font-weight: 900;

    letter-spacing: .19em;
}


/* ==========================================================
   RIGHT
========================================================== */

#krr-kitchen-header .krr-kitchen-header__right {

    display: flex;
    align-items: center;

    gap: 24px;

    margin-left: auto;
}


/* ==========================================================
   SOUND BUTTON
========================================================== */

#krr-kitchen-header .krr-kitchen-sound {

    appearance: none;

    min-height: 55px;

    margin: 0;
    padding: 8px 16px;

    display: flex;
    align-items: center;

    gap: 11px;

    background: #ffffff;

    border: 2px solid rgba(7, 59, 85, .16);
    border-radius: 8px;

    cursor: pointer;

    box-shadow: none;

    transition:
        border-color .15s ease,
        background .15s ease;
}


#krr-kitchen-header .krr-kitchen-sound:hover {

    border-color: var(--krr-blue);
}


#krr-kitchen-header .krr-kitchen-sound__icon {

    display: flex;
    align-items: center;
    justify-content: center;

    width: 35px;
    height: 35px;

    font-size: 21px;

    background: rgba(55, 139, 72, .12);

    border-radius: 50%;
}


#krr-kitchen-header .krr-kitchen-sound__copy {

    display: flex;
    flex-direction: column;

    align-items: flex-start;

    gap: 3px;
}


#krr-kitchen-header .krr-kitchen-sound__copy small {

    margin: 0;

    color: #727272;

    font-size: 8px;
    line-height: 1;

    font-weight: 800;

    letter-spacing: .12em;
}


#krr-kitchen-header .krr-kitchen-sound__copy strong {

    margin: 0;

    color: var(--krr-green);

    font-size: 13px;
    line-height: 1;

    font-weight: 900;

    letter-spacing: .04em;
}


/* ACTIVE DOT */

#krr-kitchen-header .krr-kitchen-sound__copy strong::before {

    content: "";

    display: inline-block;

    width: 7px;
    height: 7px;

    margin-right: 6px;

    background: var(--krr-green);

    border-radius: 50%;

    vertical-align: 1px;
}


/* ==========================================================
   SOUND OFF STATE
   JS CAN TOGGLE .is-active
========================================================== */

#krr-kitchen-header .krr-kitchen-sound:not(.is-active)
.krr-kitchen-sound__icon {

    background: rgba(201, 35, 41, .1);

    opacity: .65;
}


#krr-kitchen-header .krr-kitchen-sound:not(.is-active)
.krr-kitchen-sound__copy strong {

    color: var(--krr-red);
}


#krr-kitchen-header .krr-kitchen-sound:not(.is-active)
.krr-kitchen-sound__copy strong::before {

    background: var(--krr-red);
}


/* ==========================================================
   KOOKA DIGITAL
========================================================== */

#krr-kitchen-header .krr-kitchen-credit {

    display: flex;
    flex-direction: column;

    align-items: flex-end;
    justify-content: center;

    min-width: 130px;

    color: inherit;

    text-decoration: none !important;
}


#krr-kitchen-header .krr-kitchen-credit span {

    display: block;

    margin-bottom: 4px;

    color: #777;

    font-size: 8px;
    line-height: 1;

    font-weight: 800;

    letter-spacing: .15em;
}


#krr-kitchen-header .krr-kitchen-credit strong {

    display: block;

    color: var(--krr-blue);

    font-size: 15px;
    line-height: 1;

    font-weight: 900;

    letter-spacing: -.01em;

    transition: color .15s ease;
}


#krr-kitchen-header .krr-kitchen-credit:hover strong {

    color: var(--krr-red);
}


/* ==========================================================
   TABLET
========================================================== */

@media screen and (max-width: 900px) {

    #krr-kitchen-header .krr-kitchen-header__inner {

        min-height: 82px;

        padding: 10px 16px;

        gap: 18px;
    }


    #krr-kitchen-header .krr-kitchen-header__logo {

        width: 68px;
        height: 58px;
    }


    #krr-kitchen-header .krr-kitchen-header__title strong {

        font-size: 20px;
    }


    #krr-kitchen-header .krr-kitchen-header__right {

        gap: 14px;
    }


    #krr-kitchen-header .krr-kitchen-credit {

        min-width: 110px;
    }

}


/* ==========================================================
   SMALL SCREEN
========================================================== */

@media screen and (max-width: 680px) {

    #krr-kitchen-header .krr-kitchen-header__title span {

        display: none;
    }


    #krr-kitchen-header .krr-kitchen-header__title strong {

        font-size: 17px;
    }


    #krr-kitchen-header .krr-kitchen-sound {

        min-height: 46px;

        padding: 6px 10px;
    }


    #krr-kitchen-header .krr-kitchen-sound__icon {

        width: 30px;
        height: 30px;

        font-size: 17px;
    }


    #krr-kitchen-header .krr-kitchen-sound__copy small {

        display: none;
    }


    #krr-kitchen-header .krr-kitchen-sound__copy strong {

        font-size: 10px;
    }


    #krr-kitchen-header .krr-kitchen-credit span {

        display: none;
    }


    #krr-kitchen-header .krr-kitchen-credit strong {

        font-size: 11px;
    }

}


/* ==========================================================
   VERY SMALL
========================================================== */

@media screen and (max-width: 500px) {

    #krr-kitchen-header .krr-kitchen-header__logo {

        width: 52px;
        height: 48px;
    }


    #krr-kitchen-header .krr-kitchen-header__title {

        display: none;
    }


    #krr-kitchen-header .krr-kitchen-header__right {

        width: 100%;

        justify-content: flex-end;
    }


    #krr-kitchen-header .krr-kitchen-credit {

        min-width: auto;
    }

}
/* =========================================================
   ROCK 'N' ROLLS — MY ACCOUNT V2
   REPLACE ALL PREVIOUS ACCOUNT CSS
========================================================= */

body.woocommerce-account {
    --acc-blue: #0b455f;
    --acc-blue-dark: #07364c;
    --acc-red: #c9242b;
    --acc-red-dark: #a41920;
    --acc-cream: #f5ead8;
    --acc-paper: #fffaf0;
    --acc-text: #202020;
    --acc-line: rgba(11, 69, 95, .15);
}


/* =========================================================
   MASTER LAYOUT
========================================================= */

body.woocommerce-account .woocommerce {
    width: min(1280px, calc(100% - 60px)) !important;
    max-width: 1280px !important;

    margin: 0 auto !important;
    padding: 55px 0 80px !important;

    display: grid !important;
    grid-template-columns: 240px minmax(0, 1fr) !important;
    gap: 28px !important;

    align-items: start !important;
}


/* absolutely kill Woo floats */

body.woocommerce-account .woocommerce-MyAccount-navigation,
body.woocommerce-account .woocommerce-MyAccount-content {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
}


/* FORCE CORRECT POSITION */

body.woocommerce-account .woocommerce-MyAccount-navigation {
    grid-column: 1 !important;
    grid-row: 1 !important;
    order: 1 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content {
    grid-column: 2 !important;
    grid-row: 1 !important;
    order: 2 !important;
}


/* =========================================================
   LEFT MENU
========================================================= */

body.woocommerce-account .woocommerce-MyAccount-navigation {
    position: sticky;
    top: 25px;

    overflow: hidden;

    background: var(--acc-blue);

    border: 1px solid rgba(0,0,0,.08);
    border-radius: 12px;

    box-shadow: 0 12px 30px rgba(0,0,0,.09);
}


body.woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: block !important;

    list-style: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


body.woocommerce-account .woocommerce-MyAccount-navigation li {
    display: block !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
}


body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
    border-bottom: 0 !important;
}


body.woocommerce-account .woocommerce-MyAccount-navigation li a {
    position: relative;

    display: flex !important;
    align-items: center !important;

    width: 100% !important;
    min-height: 54px !important;

    margin: 0 !important;
    padding: 0 20px !important;

    background: transparent !important;

    color: #f7ecd9 !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    text-decoration: none !important;

    border: 0 !important;

    transition:
        background .18s ease,
        padding-left .18s ease;
}


body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
    background: rgba(255,255,255,.07) !important;
    padding-left: 25px !important;
}


/* active */

body.woocommerce-account
.woocommerce-MyAccount-navigation-link.is-active a {
    background: var(--acc-red) !important;
    color: #fff !important;
}


body.woocommerce-account
.woocommerce-MyAccount-navigation-link.is-active a::after {
    content: "";

    position: absolute;
    right: 17px;

    width: 7px;
    height: 7px;

    background: #fff;
    border-radius: 50%;
}


/* Logout */

body.woocommerce-account
.woocommerce-MyAccount-navigation-link--customer-logout a {
    background: var(--acc-blue-dark) !important;
}


/* =========================================================
   MAIN CONTENT
========================================================= */

body.woocommerce-account .woocommerce-MyAccount-content {
    min-width: 0 !important;
    min-height: 390px;

    padding: 38px 42px !important;

    background: rgba(255,250,240,.92);

    border: 1px solid var(--acc-line);
    border-radius: 12px;

    box-shadow: 0 12px 30px rgba(0,0,0,.06);
}


/* =========================================================
   DASHBOARD COPY
========================================================= */

body.woocommerce-account
.woocommerce-MyAccount-content > p {
    max-width: 850px;

    margin: 0 0 22px !important;

    color: var(--acc-text);

    font-size: 16px !important;
    line-height: 1.7 !important;
}


body.woocommerce-account
.woocommerce-MyAccount-content > p:first-child {
    margin-bottom: 28px !important;

    padding-bottom: 22px;

    border-bottom: 1px solid var(--acc-line);

    font-size: 18px !important;
}


body.woocommerce-account
.woocommerce-MyAccount-content strong {
    color: var(--acc-blue);
    font-weight: 800;
}


/* regular links */

body.woocommerce-account
.woocommerce-MyAccount-content a:not(.button) {
    color: var(--acc-red) !important;

    font-weight: 700;

    text-decoration: none !important;
    border-bottom: 1px solid rgba(201,36,43,.30);
}


body.woocommerce-account
.woocommerce-MyAccount-content a:not(.button):hover {
    color: var(--acc-blue) !important;
    border-bottom-color: var(--acc-blue);
}


/* =========================================================
   HEADINGS
========================================================= */

body.woocommerce-account
.woocommerce-MyAccount-content h2 {
    margin: 0 0 25px !important;

    color: var(--acc-blue);

    font-size: 31px !important;
    line-height: 1.1;

    font-weight: 900;
    letter-spacing: -.035em;
}


body.woocommerce-account
.woocommerce-MyAccount-content h3 {
    color: var(--acc-blue);

    font-size: 21px;
    font-weight: 850;
}


/* =========================================================
   ORDERS
========================================================= */

body.woocommerce-account
table.woocommerce-orders-table {
    width: 100% !important;

    margin: 0 !important;

    border: 1px solid var(--acc-line) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;

    border-radius: 9px !important;

    overflow: hidden;

    background: #fff;
}


body.woocommerce-account
table.woocommerce-orders-table thead th {
    padding: 14px 16px !important;

    background: var(--acc-blue) !important;
    color: #fff !important;

    border: 0 !important;

    font-size: 10px !important;
    font-weight: 800 !important;

    letter-spacing: .1em;
    text-transform: uppercase;
}


body.woocommerce-account
table.woocommerce-orders-table tbody td {
    padding: 15px 16px !important;

    background: #fff;

    color: #252525;

    border: 0 !important;
    border-bottom: 1px solid var(--acc-line) !important;
}


body.woocommerce-account
table.woocommerce-orders-table tbody tr:last-child td {
    border-bottom: 0 !important;
}


/* =========================================================
   BUTTONS
========================================================= */

body.woocommerce-account .woocommerce a.button,
body.woocommerce-account .woocommerce button.button,
body.woocommerce-account .woocommerce input.button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    min-height: 44px;

    padding: 0 19px !important;

    background: var(--acc-red) !important;
    color: #fff !important;

    border: 0 !important;
    border-radius: 7px !important;

    font-size: 11px !important;
    font-weight: 800 !important;

    letter-spacing: .06em;
    text-transform: uppercase;

    box-shadow: 0 3px 0 var(--acc-red-dark);

    text-decoration: none !important;
}


body.woocommerce-account .woocommerce a.button:hover,
body.woocommerce-account .woocommerce button.button:hover,
body.woocommerce-account .woocommerce input.button:hover {
    transform: translateY(-1px);
}


/* =========================================================
   ACCOUNT FORMS
========================================================= */

body.woocommerce-account
.woocommerce-MyAccount-content input[type="text"],
body.woocommerce-account
.woocommerce-MyAccount-content input[type="email"],
body.woocommerce-account
.woocommerce-MyAccount-content input[type="tel"],
body.woocommerce-account
.woocommerce-MyAccount-content input[type="password"],
body.woocommerce-account
.woocommerce-MyAccount-content select,
body.woocommerce-account
.woocommerce-MyAccount-content textarea {
    width: 100% !important;

    min-height: 48px;

    padding: 11px 14px !important;

    background: #fff !important;
    color: #222 !important;

    border: 1px solid rgba(11,69,95,.20) !important;
    border-radius: 7px !important;

    box-shadow: none !important;

    outline: none !important;
}


body.woocommerce-account
.woocommerce-MyAccount-content textarea {
    min-height: 120px;
}


body.woocommerce-account
.woocommerce-MyAccount-content input:focus,
body.woocommerce-account
.woocommerce-MyAccount-content textarea:focus,
body.woocommerce-account
.woocommerce-MyAccount-content select:focus {
    border-color: var(--acc-red) !important;

    box-shadow:
        0 0 0 3px rgba(201,36,43,.08) !important;
}


body.woocommerce-account
.woocommerce-MyAccount-content label {
    margin-bottom: 6px !important;

    color: var(--acc-blue);

    font-size: 11px !important;
    font-weight: 800 !important;

    letter-spacing: .06em;
}


/* =========================================================
   ADDRESSES
========================================================= */

body.woocommerce-account .woocommerce-Addresses {
    display: grid;

    grid-template-columns: repeat(2, minmax(0,1fr));

    gap: 20px;
}


body.woocommerce-account .woocommerce-Address {
    float: none !important;
    width: auto !important;

    padding: 22px;

    background: #fff;

    border: 1px solid var(--acc-line);
    border-radius: 9px;
}


/* =========================================================
   NOTICES
========================================================= */

body.woocommerce-account .woocommerce-message,
body.woocommerce-account .woocommerce-info,
body.woocommerce-account .woocommerce-error {
    margin: 0 0 24px !important;

    padding: 17px 20px 17px 48px !important;

    background: #fff !important;

    border: 1px solid var(--acc-line) !important;
    border-top: 4px solid var(--acc-blue) !important;

    border-radius: 8px;
}


body.woocommerce-account .woocommerce-error {
    border-top-color: var(--acc-red) !important;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    body.woocommerce-account .woocommerce {
        width: calc(100% - 30px) !important;

        grid-template-columns: 205px minmax(0,1fr) !important;
        gap: 20px !important;

        padding: 40px 0 60px !important;
    }


    body.woocommerce-account
    .woocommerce-MyAccount-content {
        padding: 28px !important;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    body.woocommerce-account .woocommerce {
        display: flex !important;
        flex-direction: column !important;

        width: calc(100% - 24px) !important;

        padding: 25px 0 45px !important;
    }


    body.woocommerce-account
    .woocommerce-MyAccount-navigation {
        position: static !important;

        width: 100% !important;

        order: 1 !important;
    }


    body.woocommerce-account
    .woocommerce-MyAccount-navigation ul {
        display: grid !important;

        grid-template-columns: repeat(2,1fr) !important;
    }


    body.woocommerce-account
    .woocommerce-MyAccount-navigation li {
        border-right: 1px solid rgba(255,255,255,.10) !important;
    }


    body.woocommerce-account
    .woocommerce-MyAccount-navigation li a {
        min-height: 47px !important;

        padding: 0 14px !important;

        font-size: 12px !important;
    }


    body.woocommerce-account
    .woocommerce-MyAccount-content {
        width: 100% !important;

        order: 2 !important;

        min-height: 0;

        padding: 23px 20px !important;
    }


    body.woocommerce-account
    .woocommerce-Addresses {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 430px) {

    body.woocommerce-account
    .woocommerce-MyAccount-navigation ul {
        grid-template-columns: 1fr !important;
    }

}
/* =========================================================
   ROCK 'N' ROLLS — KITCHEN ORDERS
   CURRENT SCREEN DESIGN
========================================================= */

body.krr-kitchen-panel-page {
    background: #f3e8d5 !important;
}


/* =========================================================
   MAIN APP
========================================================= */

#krr-kitchen-orders-app {
    width: 100%;
    min-height: calc(100vh - 108px);
    padding: 18px 22px 30px;
    background: #f3e8d5;
    box-sizing: border-box;
}


/* =========================================================
   DAY SELECTOR
========================================================= */

#krr-kitchen-orders-app .krr-kitchen-days {
    width: 100%;

    display: flex;
    align-items: stretch;

    gap: 8px;

    margin: 0 0 18px;
    padding: 0;

    overflow-x: auto;
    scrollbar-width: none;
}

#krr-kitchen-orders-app .krr-kitchen-days::-webkit-scrollbar {
    display: none;
}


#krr-kitchen-orders-app .krr-kitchen-day {
    appearance: none;
    -webkit-appearance: none;

    flex: 1 0 120px;

    min-width: 120px;
    height: 66px;

    margin: 0;
    padding: 8px 12px;

    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto 1fr;

    align-items: center;

    background: #fffaf0;

    border: 2px solid rgba(5, 58, 82, 0.14);
    border-radius: 8px;

    box-shadow: 0 2px 5px rgba(0,0,0,.04);

    color: #063a52;

    cursor: pointer;

    font-family: inherit;

    transition:
        background .15s ease,
        border-color .15s ease,
        transform .15s ease;
}


#krr-kitchen-orders-app .krr-kitchen-day:hover {
    border-color: #063a52;
    transform: translateY(-1px);
}


#krr-kitchen-orders-app .krr-kitchen-day__name {
    grid-column: 1;
    grid-row: 1;

    display: block;

    color: #777;

    font-size: 10px;
    line-height: 1;

    font-weight: 900;
    letter-spacing: .09em;

    text-align: left;
}


#krr-kitchen-orders-app .krr-kitchen-day strong {
    grid-column: 1;
    grid-row: 2;

    display: block;

    margin: 3px 0 0;

    color: #063a52;

    font-size: 25px;
    line-height: 1;

    font-weight: 900;

    text-align: left;
}


#krr-kitchen-orders-app .krr-kitchen-day small {
    grid-column: 2;
    grid-row: 1 / 3;

    display: flex;
    align-items: center;

    color: #999;

    font-size: 10px;
    line-height: 1;

    font-weight: 900;
    letter-spacing: .06em;
}


/* TODAY */

#krr-kitchen-orders-app
.krr-kitchen-day.is-today:not(.is-active)
.krr-kitchen-day__name {
    color: #d3222a;
}


/* ACTIVE */

#krr-kitchen-orders-app .krr-kitchen-day.is-active {
    background: #063a52;
    border-color: #063a52;

    box-shadow: 0 4px 10px rgba(6,58,82,.16);
}


#krr-kitchen-orders-app
.krr-kitchen-day.is-active
.krr-kitchen-day__name,

#krr-kitchen-orders-app
.krr-kitchen-day.is-active strong,

#krr-kitchen-orders-app
.krr-kitchen-day.is-active small {
    color: #fff;
}


/* =========================================================
   OTHER DAY WARNING
========================================================= */

#krr-kitchen-orders-app .krr-kitchen-date-warning {
    width: 100%;

    margin: -5px 0 15px;
    padding: 9px 15px;

    box-sizing: border-box;

    background: #d3222a;

    border-radius: 6px;

    color: #fff;

    font-size: 11px;
    line-height: 1.2;

    font-weight: 900;
    letter-spacing: .07em;

    text-align: center;

    box-shadow: 0 3px 7px rgba(211,34,42,.13);
}


#krr-kitchen-orders-app
.krr-kitchen-date-warning[hidden] {
    display: none !important;
}


/* =========================================================
   ORDERS GRID
========================================================= */

#krr-kitchen-orders-root {
    width: 100%;

    display: grid;

    grid-template-columns:
        repeat(auto-fill, minmax(310px, 1fr));

    gap: 14px;

    align-items: start;
}


/* =========================================================
   ORDER CARD
========================================================= */

#krr-kitchen-orders-root .krr-test-order {
    position: relative;

    min-width: 0;

    margin: 0;
    padding: 0 17px 18px;

    overflow: hidden;

    background: #fffaf0;

    border: 2px solid rgba(6,58,82,.12);
    border-top: 7px solid #063a52;
    border-radius: 9px;

    box-shadow:
        0 5px 14px rgba(35,35,35,.07);

    color: #202427;

    font-size: 14px;
    line-height: 1.55;

    box-sizing: border-box;
}


/* ORDER NUMBER */

#krr-kitchen-orders-root
.krr-test-order > strong:first-child {
    display: block;

    margin: 0 -17px 12px;
    padding: 12px 17px 11px;

    background: #063a52;

    color: #fff;

    font-size: 22px;
    line-height: 1;

    font-weight: 900;
    letter-spacing: -.02em;
}


/* NORMAL INFORMATION AREA */

#krr-kitchen-orders-root .krr-test-order {
    color: #343434;
}


/* DIVIDER BEFORE PRODUCTS */

#krr-kitchen-orders-root .krr-test-order hr {
    height: 1px;

    margin: 12px -17px 8px;

    border: 0;

    background: rgba(6,58,82,.14);
}


/* PRODUCTS */

#krr-kitchen-orders-root
.krr-test-order > div {
    margin: 0;
    padding: 7px 0;
}


#krr-kitchen-orders-root
.krr-test-order > div strong {
    display: block;

    color: #17272f;

    font-size: 15px;
    line-height: 1.25;

    font-weight: 900;
}


/* PRODUCT SEPARATION */

#krr-kitchen-orders-root
.krr-test-order > div + div {
    border-top: 1px solid rgba(6,58,82,.08);
}


/* =========================================================
   EMPTY / LOADING
========================================================= */

#krr-kitchen-orders-root
#krr-kitchen-loading,

#krr-kitchen-orders-root
.krr-kitchen-empty {
    grid-column: 1 / -1;

    min-height: 280px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: rgba(255,250,240,.55);

    border: 2px dashed rgba(6,58,82,.16);
    border-radius: 10px;

    color: #063a52;

    font-size: 20px;
    font-weight: 900;
    letter-spacing: .04em;
}


/* =========================================================
   LARGE KITCHEN DISPLAY
========================================================= */

@media (min-width: 1450px) {

    #krr-kitchen-orders-app {
        padding: 20px 26px 35px;
    }

    #krr-kitchen-orders-root {
        grid-template-columns:
            repeat(auto-fill, minmax(330px, 1fr));

        gap: 16px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    #krr-kitchen-orders-app {
        padding: 12px;
    }

    #krr-kitchen-orders-root {
        grid-template-columns:
            repeat(auto-fill, minmax(280px, 1fr));
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    #krr-kitchen-orders-app {
        padding: 10px;
    }

    #krr-kitchen-orders-app .krr-kitchen-days {
        gap: 6px;
    }

    #krr-kitchen-orders-app .krr-kitchen-day {
        flex-basis: 105px;
        min-width: 105px;
    }

    #krr-kitchen-orders-root {
        grid-template-columns: 1fr;
        gap: 10px;
    }

}
/* =========================================================
   ROCK 'N' ROLLS — EMPTY CART
========================================================= */

body.woocommerce-cart .woocommerce {
    max-width: 1450px;
    margin: 0 auto;
    padding: 45px 30px 35px;
}


/* =========================================================
   EMPTY CART MESSAGE
========================================================= */

body.woocommerce-cart .cart-empty,
body.woocommerce-cart .woocommerce-info.cart-empty {
    margin: 0 auto 8px !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;

    color: #222 !important;

    font-size: 18px !important;
    line-height: 1.2 !important;

    font-weight: 900 !important;
    text-align: center !important;
    text-transform: uppercase;
}


/* Remove Woo default notice decoration */

body.woocommerce-cart .cart-empty::before,
body.woocommerce-cart .woocommerce-info::before {
    display: none !important;
}


/* =========================================================
   RETURN TO SHOP
========================================================= */

body.woocommerce-cart .return-to-shop {
    margin: 15px 0 25px;
    text-align: center;
}

body.woocommerce-cart .return-to-shop .button {
    min-height: 42px;
    padding: 0 22px !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    background: #073a52 !important;
    color: #fff !important;

    border: 0 !important;
    border-radius: 999px !important;

    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: .04em;
}


/* =========================================================
   NEW IN STORE / RELATED PRODUCTS
========================================================= */

body.woocommerce-cart .woocommerce > h2,
body.woocommerce-cart .woocommerce-products-header + h2,
body.woocommerce-cart .products + h2,
body.woocommerce-cart section > h2 {
    margin: 22px 0 25px !important;

    color: #222;

    font-size: 28px !important;
    line-height: 1 !important;

    font-weight: 900 !important;
    text-align: center;

    text-transform: uppercase;
}


/* =========================================================
   CLASSIC WOOCOMMERCE PRODUCT GRID
========================================================= */

body.woocommerce-cart ul.products {
    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;

    gap: 28px !important;

    margin: 0 !important;
    padding: 0 !important;
}


body.woocommerce-cart ul.products::before,
body.woocommerce-cart ul.products::after {
    display: none !important;
}


body.woocommerce-cart ul.products li.product {
    float: none !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 10px 8px !important;

    display: flex !important;
    flex-direction: column;
    align-items: center;

    text-align: center;

    background: transparent !important;
}


/* =========================================================
   PRODUCT IMAGE
========================================================= */

body.woocommerce-cart ul.products li.product a img {
    width: 100% !important;
    max-width: 230px !important;
    height: 245px !important;

    margin: 0 auto 14px !important;

    object-fit: contain !important;

    display: block !important;

    transition: transform .2s ease;
}


body.woocommerce-cart ul.products li.product:hover a img {
    transform: translateY(-4px);
}


/* =========================================================
   PRODUCT TITLE
========================================================= */

body.woocommerce-cart ul.products li.product h2,
body.woocommerce-cart ul.products li.product .woocommerce-loop-product__title {
    margin: 0 0 7px !important;
    padding: 0 !important;

    color: #222 !important;

    font-size: 15px !important;
    line-height: 1.25 !important;

    font-weight: 900 !important;

    text-decoration: underline;
    text-underline-offset: 4px;
}


/* =========================================================
   PRICE
========================================================= */

body.woocommerce-cart ul.products li.product .price {
    margin: 0 0 13px !important;

    color: #222 !important;

    font-size: 14px !important;
    line-height: 1 !important;

    font-weight: 500 !important;
}


/* =========================================================
   ADD TO CART BUTTON
========================================================= */

body.woocommerce-cart ul.products li.product .button,
body.woocommerce-cart ul.products li.product a.button {
    min-height: 42px !important;

    margin: auto 0 0 !important;
    padding: 0 20px !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    background: #31373b !important;
    color: #fff !important;

    border: 0 !important;
    border-radius: 999px !important;

    font-size: 12px !important;
    line-height: 1 !important;

    font-weight: 600 !important;

    box-shadow: none !important;

    transition:
        background .15s ease,
        transform .15s ease;
}


body.woocommerce-cart ul.products li.product .button:hover {
    background: #cf2228 !important;
    color: #fff !important;

    transform: translateY(-1px);
}


/* =========================================================
   WOOCOMMERCE BLOCK PRODUCT GRID FALLBACK
========================================================= */

body.woocommerce-cart .wc-block-grid__products,
body.woocommerce-cart .wp-block-woocommerce-product-collection ul {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
    gap: 28px !important;
}


body.woocommerce-cart .wc-block-grid__product {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 10px !important;
}


body.woocommerce-cart .wc-block-grid__product-image img {
    width: 100% !important;
    max-width: 230px !important;
    height: 245px !important;

    margin: 0 auto !important;

    object-fit: contain !important;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 950px) {

    body.woocommerce-cart ul.products,
    body.woocommerce-cart .wc-block-grid__products,
    body.woocommerce-cart .wp-block-woocommerce-product-collection ul {
        grid-template-columns:
            repeat(2, minmax(0,1fr)) !important;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    body.woocommerce-cart .woocommerce {
        padding: 30px 15px;
    }

    body.woocommerce-cart ul.products,
    body.woocommerce-cart .wc-block-grid__products,
    body.woocommerce-cart .wp-block-woocommerce-product-collection ul {
        gap: 22px 10px !important;
    }

    body.woocommerce-cart ul.products li.product a img,
    body.woocommerce-cart .wc-block-grid__product-image img {
        max-width: 160px !important;
        height: 180px !important;
    }

}
/* =========================================================
   ROCK 'N' ROLLS — CART STYLE OVERRIDES
========================================================= */

/* =========================================================
   MAIN TEXT COLOURS
========================================================= */

body.woocommerce-cart {
    --rnr-blue: #073a52;
    --rnr-red: #cf2228;
    --rnr-cream: #f3e8d5;
    --rnr-paper: #fff8ea;
    --rnr-dark: #202629;
}


/* EMPTY CART MESSAGE */

body.woocommerce-cart .cart-empty,
body.woocommerce-cart .woocommerce-info.cart-empty {

    color: var(--rnr-blue) !important;

    font-size: 20px !important;
    line-height: 1.15 !important;

    font-weight: 900 !important;

    letter-spacing: .035em;

    text-transform: uppercase;
}


/* =========================================================
   NEW IN STORE TITLE
========================================================= */

body.woocommerce-cart .woocommerce > h2,
body.woocommerce-cart section > h2 {

    color: var(--rnr-blue) !important;

    font-size: 30px !important;
    line-height: 1 !important;

    font-weight: 900 !important;

    letter-spacing: .025em;

    text-transform: uppercase;

    position: relative;

    padding-bottom: 13px !important;
}


/* RED UNDERLINE */

body.woocommerce-cart .woocommerce > h2::after,
body.woocommerce-cart section > h2::after {

    content: "";

    display: block;

    width: 58px;
    height: 4px;

    margin: 11px auto 0;

    background: var(--rnr-red);

    border-radius: 999px;
}


/* =========================================================
   PRODUCT TITLE
========================================================= */

body.woocommerce-cart ul.products li.product h2,
body.woocommerce-cart ul.products li.product .woocommerce-loop-product__title {

    color: var(--rnr-blue) !important;

    font-size: 16px !important;
    line-height: 1.2 !important;

    font-weight: 900 !important;

    text-decoration: none !important;

    text-transform: uppercase;

    letter-spacing: .015em;

    transition: color .15s ease;
}


body.woocommerce-cart ul.products li.product:hover h2,
body.woocommerce-cart ul.products li.product:hover .woocommerce-loop-product__title {

    color: var(--rnr-red) !important;
}


/* =========================================================
   PRICE
========================================================= */

body.woocommerce-cart ul.products li.product .price {

    color: var(--rnr-red) !important;

    font-size: 16px !important;

    font-weight: 900 !important;

    letter-spacing: .01em;
}


/* =========================================================
   ADD TO CART BUTTON
========================================================= */

body.woocommerce-cart ul.products li.product .button,
body.woocommerce-cart ul.products li.product a.button {

    min-width: 128px;
    min-height: 44px !important;

    padding: 0 22px !important;

    background: var(--rnr-blue) !important;

    color: #fff !important;

    border: 2px solid var(--rnr-blue) !important;

    border-radius: 6px !important;

    font-size: 11px !important;

    font-weight: 900 !important;

    letter-spacing: .08em;

    text-transform: uppercase;

    box-shadow:
        0 3px 0 rgba(0,0,0,.14) !important;

    transition:
        background .15s ease,
        border-color .15s ease,
        transform .15s ease,
        box-shadow .15s ease;
}


/* HOVER */

body.woocommerce-cart ul.products li.product .button:hover,
body.woocommerce-cart ul.products li.product a.button:hover {

    background: var(--rnr-red) !important;

    border-color: var(--rnr-red) !important;

    color: #fff !important;

    transform: translateY(-2px);

    box-shadow:
        0 5px 0 rgba(0,0,0,.13) !important;
}


/* ACTIVE */

body.woocommerce-cart ul.products li.product .button:active,
body.woocommerce-cart ul.products li.product a.button:active {

    transform: translateY(1px);

    box-shadow:
        0 1px 0 rgba(0,0,0,.15) !important;
}


/* =========================================================
   RETURN TO SHOP BUTTON
========================================================= */

body.woocommerce-cart .return-to-shop .button {

    min-height: 46px !important;

    padding: 0 25px !important;

    background: var(--rnr-red) !important;

    color: #fff !important;

    border: 2px solid var(--rnr-red) !important;

    border-radius: 6px !important;

    font-size: 11px !important;

    font-weight: 900 !important;

    letter-spacing: .08em;

    text-transform: uppercase;

    box-shadow:
        0 3px 0 rgba(0,0,0,.14) !important;
}


body.woocommerce-cart .return-to-shop .button:hover {

    background: var(--rnr-blue) !important;

    border-color: var(--rnr-blue) !important;

    color: #fff !important;
}


/* =========================================================
   PRODUCT IMAGE AREA
========================================================= */

body.woocommerce-cart ul.products li.product {

    position: relative;

    padding: 15px 14px 18px !important;

    border-radius: 8px;

    transition:
        background .15s ease,
        transform .15s ease;
}


body.woocommerce-cart ul.products li.product:hover {

    background: rgba(255,248,234,.7) !important;

    transform: translateY(-2px);
}


/* =========================================================
   SUBTLE RETRO TOP DETAIL
========================================================= */

body.woocommerce-cart ul.products li.product::before {

    content: "";

    position: absolute;

    top: 0;
    left: 50%;

    width: 34px;
    height: 3px;

    transform: translateX(-50%);

    background: var(--rnr-red);

    border-radius: 999px;

    opacity: .85;
}
/* =========================================================
   ROCK 'N' ROLLS — EMPTY CART
   COMPACT FINAL VERSION
========================================================= */

body.woocommerce-cart {
    --rnr-blue: #073a52;
    --rnr-red: #cf2228;
    --rnr-cream: #f4ead8;
    --rnr-dark: #20272b;
}


/* =========================================================
   EMPTY CART MAIN BLOCK
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block {

    padding-top: 12px !important;
    padding-bottom: 20px !important;

    margin: 0 !important;
}


/* =========================================================
   EMPTY CART ICON
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wp-block-woocommerce-empty-cart-block__empty-cart-icon {

    margin: 0 auto 5px !important;

    transform: scale(.62) !important;
    transform-origin: center center;
}


/* =========================================================
   EMPTY CART TITLE
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wp-block-heading:first-of-type {

    margin: 0 0 7px !important;
    padding: 0 !important;

    color: var(--rnr-blue) !important;

    font-size: 22px !important;
    line-height: 1 !important;

    font-weight: 900 !important;
    letter-spacing: .025em !important;

    text-transform: uppercase !important;
}


/* SMALL RED DETAIL */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wp-block-heading:first-of-type::after {

    content: "";

    display: block;

    width: 34px !important;
    height: 3px !important;

    margin: 6px auto 0 !important;

    background: var(--rnr-red) !important;

    border-radius: 20px;
}


/* =========================================================
   REMOVE DOTS / SEPARATOR GAP
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wp-block-separator {

    display: none !important;
}


/* =========================================================
   NEW IN STORE TITLE
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
h2.wp-block-heading {

    margin: 8px 0 10px !important;
    padding: 0 !important;

    color: var(--rnr-blue) !important;

    font-size: 22px !important;
    line-height: 1 !important;

    font-weight: 900 !important;
    letter-spacing: .025em !important;

    text-transform: uppercase !important;
}


body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
h2.wp-block-heading::after {

    content: "";

    display: block;

    width: 34px !important;
    height: 3px !important;

    margin: 6px auto 0 !important;

    background: var(--rnr-red) !important;

    border-radius: 20px;
}


/* =========================================================
   PRODUCT GRID
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__products {

    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;

    gap: 12px !important;

    margin: 0 !important;
    padding: 0 !important;

    align-items: start !important;
}


/* =========================================================
   PRODUCT
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product {

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 5px 8px 10px !important;

    border: 0 !important;

    background: transparent !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;

    text-align: center !important;

    box-sizing: border-box;

    transition:
        transform .15s ease,
        background .15s ease;
}


body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product:hover {

    background: rgba(255,255,255,.18) !important;

    transform: translateY(-2px);
}


/* REMOVE BIG DECORATIVE RED LINES */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product::before {

    content: "";

    display: block;

    width: 22px !important;
    height: 2px !important;

    margin: 0 auto 4px !important;

    position: static !important;

    transform: none !important;

    background: var(--rnr-red);

    border-radius: 10px;
}


/* =========================================================
   PRODUCT IMAGE
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product-image {

    margin: 0 auto 6px !important;
    padding: 0 !important;
}


body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product-image img {

    display: block !important;

    width: 100% !important;

    max-width: 155px !important;
    height: 165px !important;

    margin: 0 auto !important;

    object-fit: contain !important;
}


/* =========================================================
   PRODUCT TITLE
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product-title {

    margin: 0 0 4px !important;
    padding: 0 !important;

    color: var(--rnr-blue) !important;

    font-size: 12px !important;
    line-height: 1.1 !important;

    font-weight: 900 !important;

    letter-spacing: .015em !important;

    text-transform: uppercase !important;
    text-decoration: none !important;
}


body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product-link {

    color: var(--rnr-blue) !important;

    text-decoration: none !important;
}


body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product-link:hover
.wc-block-grid__product-title {

    color: var(--rnr-red) !important;
}


/* =========================================================
   PRICE
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product-price {

    margin: 0 0 7px !important;

    color: var(--rnr-red) !important;

    font-size: 13px !important;
    line-height: 1 !important;

    font-weight: 900 !important;
}


body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product-price
.woocommerce-Price-amount {

    color: var(--rnr-red) !important;

    font-weight: 900 !important;
}


/* =========================================================
   BUTTON
========================================================= */

body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product-add-to-cart {

    margin: 0 !important;
    padding: 0 !important;
}


body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product-add-to-cart
.wp-block-button__link {

    min-width: 108px !important;
    min-height: 34px !important;

    margin: 0 !important;
    padding: 0 14px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: var(--rnr-blue) !important;

    color: #fff !important;

    border: 0 !important;

    border-radius: 4px !important;

    box-shadow:
        0 2px 0 rgba(0,0,0,.13) !important;

    font-size: 9px !important;
    line-height: 1 !important;

    font-weight: 900 !important;

    letter-spacing: .075em !important;

    text-transform: uppercase !important;

    transition:
        background .15s ease,
        transform .15s ease !important;
}


body.woocommerce-cart
.wp-block-woocommerce-empty-cart-block
.wc-block-grid__product-add-to-cart
.wp-block-button__link:hover {

    background: var(--rnr-red) !important;

    color: #fff !important;

    transform: translateY(-1px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    body.woocommerce-cart
    .wp-block-woocommerce-empty-cart-block
    .wc-block-grid__products {

        grid-template-columns:
            repeat(2, minmax(0,1fr)) !important;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    body.woocommerce-cart
    .wp-block-woocommerce-empty-cart-block {

        padding-top: 8px !important;
    }


    body.woocommerce-cart
    .wp-block-woocommerce-empty-cart-block
    .wc-block-grid__product-image img {

        max-width: 125px !important;
        height: 135px !important;
    }


    body.woocommerce-cart
    .wp-block-woocommerce-empty-cart-block
    .wc-block-grid__product {

        padding-left: 4px !important;
        padding-right: 4px !important;
    }

}
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Barlow+Condensed:wght@600;700;800&family=Barlow:wght@500;600;700&display=swap');

.rnr-contact-hero,
.rnr-contact-hero * {
    box-sizing: border-box;
}

.rnr-contact-hero {
    --rnr-navy: #082c46;
    --rnr-red: #cf292e;
    --rnr-cream: #f2e4c5;
    --rnr-dark: #142d3c;

    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    width: 100%;
    height: clamp(350px, 25vw, 400px);
    min-height: 350px;
    max-height: 400px;
    padding: 24px clamp(35px, 8vw, 150px);
    overflow: hidden;

    background-color: var(--rnr-cream);
    background-image:
        linear-gradient(
            90deg,
            rgba(242, 228, 197, 0.98) 0%,
            rgba(242, 228, 197, 0.91) 28%,
            rgba(242, 228, 197, 0.3) 48%,
            rgba(242, 228, 197, 0) 67%
        ),
        url('https://rocknrolls.com.au/wp-content/uploads/2026/08/Background_hero_contact.webp');

    background-repeat: no-repeat;
    background-position: center 62%;
    background-size: cover;
    border-bottom: 4px solid var(--rnr-red);
}

.rnr-contact-hero::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0;
    height: 45px;
    pointer-events: none;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(8, 44, 70, 0.08)
    );
}

.rnr-contact-hero__content {
    position: relative;
    z-index: 2;
    width: min(470px, 42vw);
    animation: rnr-contact-entry 0.7s ease-out both;
}

.rnr-contact-hero__eyebrow {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 6px 4px;
    color: var(--rnr-red);
    font-family: "Barlow Condensed", sans-serif;
    font-size: clamp(14px, 1.1vw, 18px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.rnr-contact-hero__eyebrow span:first-child,
.rnr-contact-hero__eyebrow span:last-child {
    font-size: 13px;
}

.rnr-contact-hero__eyebrow::before,
.rnr-contact-hero__eyebrow::after {
    content: "";
    display: block;
    width: 24px;
    height: 2px;
    background: var(--rnr-red);
}

.rnr-contact-hero__title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 0;
    color: var(--rnr-red);
    font-family: "Anton", "Arial Narrow", sans-serif;
    font-size: clamp(72px, 6.5vw, 102px);
    font-weight: 400;
    line-height: 0.72;
    letter-spacing: -0.035em;
    text-transform: uppercase;
    transform: rotate(-1deg);
}

.rnr-contact-hero__title span {
    display: block;
    text-shadow:
        2px 2px 0 var(--rnr-cream),
        4px 4px 0 var(--rnr-dark),
        6px 6px 0 rgba(8, 44, 70, 0.15);
}

.rnr-contact-hero__title span:last-child {
    margin-left: clamp(20px, 2.5vw, 40px);
}

.rnr-contact-hero__stroke {
    position: relative;
    width: min(285px, 78%);
    height: 6px;
    margin: 15px 0 16px 22px;
    border-radius: 50%;
    background: var(--rnr-red);
    box-shadow: 0 3px 0 rgba(8, 44, 70, 0.1);
    transform: rotate(-3deg) skewX(-22deg);
}

.rnr-contact-hero__stroke::after {
    content: "";
    position: absolute;
    right: 22px;
    bottom: -7px;
    width: 150px;
    height: 2px;
    border-radius: 50%;
    background: var(--rnr-navy);
    opacity: 0.45;
}

.rnr-contact-hero__message {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    min-width: 390px;
    padding: 10px 16px;
    border-top: 2px solid rgba(8, 44, 70, 0.2);
    border-bottom: 2px solid rgba(8, 44, 70, 0.2);
    color: var(--rnr-navy);
    transform: rotate(-0.5deg);
}

.rnr-contact-hero__message p {
    margin: 0;
    font-family: "Barlow Condensed", sans-serif;
    font-size: clamp(16px, 1.2vw, 19px);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: 0.015em;
    text-transform: uppercase;
}

.rnr-contact-hero__message div > span {
    display: block;
    margin-top: 3px;
    color: var(--rnr-red);
    font-family: "Barlow", sans-serif;
    font-size: 13px;
    font-weight: 700;
    font-style: italic;
    letter-spacing: 0.04em;
}

.rnr-contact-hero__message-star {
    flex: 0 0 auto;
    color: var(--rnr-red);
    font-size: 18px;
}

.rnr-contact-hero__stars {
    position: absolute;
    z-index: 1;
    color: var(--rnr-red);
    pointer-events: none;
}

.rnr-contact-hero__stars span {
    position: absolute;
    display: block;
    line-height: 1;
}

.rnr-contact-hero__stars--one {
    top: 48px;
    left: 5%;
}

.rnr-contact-hero__stars--one span:first-child {
    font-size: 27px;
    transform: rotate(12deg);
}

.rnr-contact-hero__stars--one span:last-child {
    top: 31px;
    left: 27px;
    color: var(--rnr-navy);
    font-size: 14px;
}

.rnr-contact-hero__stars--two {
    bottom: 64px;
    left: 44%;
}

.rnr-contact-hero__stars--two span:first-child {
    font-size: 21px;
}

.rnr-contact-hero__stars--two span:last-child {
    top: 25px;
    left: 29px;
    color: var(--rnr-navy);
    font-size: 11px;
}

@keyframes rnr-contact-entry {
    from {
        opacity: 0;
        transform: translateX(-22px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@media (max-width: 900px) {
    .rnr-contact-hero {
        height: 380px;
        min-height: 380px;
        padding: 24px 38px;
        background-position: 59% 62%;
    }

    .rnr-contact-hero__content {
        width: 49%;
    }

    .rnr-contact-hero__title {
        font-size: clamp(68px, 10vw, 90px);
    }

    .rnr-contact-hero__message {
        min-width: 330px;
    }

    .rnr-contact-hero__message p {
        font-size: 16px;
    }

    .rnr-contact-hero__stars--two {
        display: none;
    }
}

@media (max-width: 600px) {
    .rnr-contact-hero {
        align-items: flex-start;
        height: 400px;
        min-height: 400px;
        max-height: 400px;
        padding: 27px 20px;

        background-image:
            linear-gradient(
                90deg,
                rgba(242, 228, 197, 0.98) 0%,
                rgba(242, 228, 197, 0.92) 50%,
                rgba(242, 228, 197, 0.14) 82%
            ),
            url('https://rocknrolls.com.au/wp-content/uploads/2026/08/Background_hero_contact.webp');

        background-position: 67% 61%;
    }

    .rnr-contact-hero__content {
        width: 70%;
    }

    .rnr-contact-hero__eyebrow {
        gap: 5px;
        font-size: 12px;
    }

    .rnr-contact-hero__eyebrow::before,
    .rnr-contact-hero__eyebrow::after {
        width: 12px;
    }

    .rnr-contact-hero__title {
        font-size: clamp(62px, 19vw, 78px);
    }

    .rnr-contact-hero__title span:last-child {
        margin-left: 16px;
    }

    .rnr-contact-hero__stroke {
        width: 190px;
        height: 5px;
        margin: 13px 0 14px 15px;
    }

    .rnr-contact-hero__message {
        min-width: 0;
        width: 100%;
        gap: 8px;
        padding: 9px 5px;
    }

    .rnr-contact-hero__message p {
        font-size: 14px;
        line-height: 1.05;
    }

    .rnr-contact-hero__message div > span {
        font-size: 12px;
    }

    .rnr-contact-hero__message-star:last-child {
        display: none;
    }

    .rnr-contact-hero__stars--one {
        top: 22px;
        left: auto;
        right: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rnr-contact-hero__content {
        animation: none;
    }
}
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Barlow+Condensed:wght@600;700;800&family=Barlow:wght@500;600;700&display=swap');

.rnr-contact-section,
.rnr-contact-section * {
    box-sizing: border-box;
}

.rnr-contact-section {
    --rnr-navy: #082c46;
    --rnr-red: #cf292e;
    --rnr-cream: #f2e4c5;
    --rnr-paper: #fffaf0;
    position: relative;
    padding: clamp(58px, 6vw, 88px) 24px;
    overflow: hidden;
    background-color: var(--rnr-cream);
    background-image: radial-gradient(rgba(8, 44, 70, .10) .8px, transparent .8px);
    background-size: 8px 8px;
}

.rnr-contact-section::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 12px;
    background: repeating-conic-gradient(var(--rnr-navy) 0 25%, var(--rnr-paper) 0 50%) 0 / 24px 24px;
}

.rnr-contact-section__inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(320px, .8fr) minmax(520px, 1.2fr);
    gap: clamp(38px, 5vw, 74px);
    align-items: center;
    width: min(1180px, 100%);
    margin: 0 auto;
}

.rnr-contact-info__heading > span {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    color: var(--rnr-red);
    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.rnr-contact-info__heading > span i {
    font-size: 12px;
    font-style: normal;
}

.rnr-contact-info__heading h2 {
    margin: 0;
    color: var(--rnr-navy);
    font-family: "Anton", "Arial Narrow", sans-serif;
    font-size: clamp(48px, 4.5vw, 68px);
    font-weight: 400;
    line-height: .96;
    letter-spacing: -.025em;
    text-transform: uppercase;
}

.rnr-contact-info__heading p {
    max-width: 430px;
    margin: 16px 0 25px;
    color: #142d3c;
    font-family: "Barlow", Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
}

.rnr-contact-links {
    display: grid;
    gap: 11px;
}

.rnr-contact-link {
    display: grid;
    grid-template-columns: 46px 1fr 22px;
    gap: 13px;
    align-items: center;
    min-height: 70px;
    padding: 10px 14px;
    border: 1px solid rgba(8, 44, 70, .17);
    border-left: 5px solid var(--rnr-red);
    border-radius: 7px;
    color: var(--rnr-navy);
    background: rgba(255, 250, 240, .9);
    box-shadow: 0 4px 0 rgba(8, 44, 70, .09), 0 9px 20px rgba(8, 44, 70, .06);
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease;
}

.rnr-contact-link:hover {
    color: var(--rnr-navy);
    border-color: var(--rnr-red);
    transform: translateX(5px);
}

.rnr-contact-link__icon {
    display: grid;
    place-items: center;
    width: 43px;
    height: 43px;
    border: 2px solid var(--rnr-navy);
    border-radius: 50%;
    color: var(--rnr-red);
    background: var(--rnr-cream);
    font-family: Arial, sans-serif;
    font-size: 20px;
    font-weight: 800;
}

.rnr-contact-link small,
.rnr-contact-link strong {
    display: block;
}

.rnr-contact-link small {
    margin-bottom: 3px;
    color: var(--rnr-red);
    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    line-height: 1;
    text-transform: uppercase;
}

.rnr-contact-link strong {
    overflow-wrap: anywhere;
    font-family: "Barlow", Arial, sans-serif;
    font-size: 15px;
    font-weight: 700;
}

.rnr-contact-link > b {
    color: var(--rnr-red);
    font-size: 20px;
}

.rnr-contact-location {
    display: grid;
    grid-template-columns: 26px 1fr 25px;
    gap: 11px;
    align-items: center;
    margin-top: 18px;
    padding: 16px;
    border-radius: 7px;
    color: var(--rnr-cream);
    background: var(--rnr-navy);
    box-shadow: 7px 7px 0 var(--rnr-red);
}

.rnr-contact-location__star,
.rnr-contact-location__note {
    color: var(--rnr-red);
    font-size: 20px;
    text-align: center;
}

.rnr-contact-location strong {
    display: block;
    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.rnr-contact-location p {
    margin: 3px 0 0;
    font-family: "Barlow", Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
}

.rnr-contact-form-panel {
    position: relative;
    padding: clamp(27px, 3.4vw, 43px);
    border: 2px solid var(--rnr-navy);
    border-radius: 11px;
    background: rgba(255, 250, 240, .97);
    box-shadow: 10px 10px 0 var(--rnr-navy), 15px 15px 0 rgba(207, 41, 46, .15);
}

@media (max-width: 950px) {
    .rnr-contact-section__inner {
        grid-template-columns: 1fr;
        max-width: 720px;
    }
}

@media (max-width: 600px) {
    .rnr-contact-section {
        padding: 52px 17px 62px;
    }

    .rnr-contact-section__inner {
        gap: 42px;
    }

    .rnr-contact-info__heading h2 {
        font-size: 48px;
    }

    .rnr-contact-link {
        grid-template-columns: 43px 1fr 20px;
        gap: 10px;
        padding: 10px 11px;
    }

    .rnr-contact-link strong {
        font-size: 13px;
    }

    .rnr-contact-form-panel {
        padding: 27px 18px;
        box-shadow: 6px 6px 0 var(--rnr-navy), 10px 10px 0 rgba(207, 41, 46, .15);
    }
}
.elementor-element.elementor-element-87338c0 {
    --gap: 0px !important;
    gap: 0 !important;
    row-gap: 0 !important;
}
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Barlow+Condensed:wght@600;700;800&family=Barlow:wght@500;600;700&display=swap');

.rnr-home-hero,
.rnr-home-hero * {
    box-sizing: border-box;
}

.rnr-home-hero {
    --rnr-navy: #082c46;
    --rnr-red: #c9282c;
    --rnr-cream: #f2e4c5;
    --rnr-dark: #142d3c;

    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    width: 100%;
    height: clamp(540px, 43vw, 660px);
    min-height: 540px;
    max-height: 660px;
    overflow: hidden;

    background-color: var(--rnr-cream);

    background-image:
        linear-gradient(
            90deg,
            rgba(242, 228, 197, 0.99) 0%,
            rgba(242, 228, 197, 0.91) 25%,
            rgba(242, 228, 197, 0.28) 46%,
            rgba(242, 228, 197, 0) 61%
        ),
        url('https://rocknrolls.com.au/wp-content/uploads/2026/08/Hero_home_1.webp');

    background-repeat: no-repeat;
    background-position: center 58%;
    background-size: cover;
}

.rnr-home-hero__inner {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    width: min(1440px, 100%);
    height: 100%;
    margin: 0 auto;
    padding: 42px clamp(38px, 6vw, 100px);
}

.rnr-home-hero__content {
    width: min(520px, 43%);
    animation: rnr-home-hero-in 0.7s ease-out both;
}

.rnr-home-hero__eyebrow {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 9px 3px;
    color: var(--rnr-navy);
    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: clamp(14px, 1.1vw, 17px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.rnr-home-hero__eyebrow span:first-child,
.rnr-home-hero__eyebrow span:last-child {
    color: var(--rnr-red);
    font-size: 13px;
}

.rnr-home-hero__title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 0;
    color: var(--rnr-navy);
    font-family: "Anton", "Arial Narrow", sans-serif;
    font-size: clamp(72px, 6.1vw, 105px);
    font-weight: 400;
    line-height: 0.79;
    letter-spacing: -0.035em;
    text-transform: uppercase;
}

.rnr-home-hero__title span {
    display: block;
    text-shadow: 2px 2px 0 rgba(242, 228, 197, 0.7);
}

.rnr-home-hero__title span:nth-child(2) {
    margin-left: clamp(12px, 1.5vw, 24px);
}

.rnr-home-hero__title span:last-child {
    margin-top: 5px;
    color: var(--rnr-red);
    font-size: 0.81em;
}

.rnr-home-hero__description {
    max-width: 490px;
    margin: 22px 0 20px;
    color: var(--rnr-dark);
    font-family: "Barlow", Arial, sans-serif;
    font-size: clamp(16px, 1.25vw, 19px);
    font-weight: 700;
    line-height: 1.42;
}

.rnr-home-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
}

.rnr-home-hero__button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 23px;
    min-width: 196px;
    min-height: 51px;
    padding: 12px 15px 12px 22px;
    border: 2px solid;
    border-radius: 7px;
    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 16px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.075em;
    text-decoration: none;
    text-transform: uppercase;
    box-shadow: 0 4px 0 rgba(20, 45, 60, 0.22);

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        background-color 0.2s ease,
        color 0.2s ease;
}

.rnr-home-hero__button > span:last-child {
    font-size: 14px;
}

.rnr-home-hero__button--navy {
    border-color: var(--rnr-navy);
    color: var(--rnr-cream);
    background: var(--rnr-navy);
}

.rnr-home-hero__button--red {
    border-color: var(--rnr-red);
    color: var(--rnr-red);
    background: rgba(242, 228, 197, 0.8);
}

.rnr-home-hero__button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 0 rgba(20, 45, 60, 0.25);
}

.rnr-home-hero__button--navy:hover {
    color: var(--rnr-cream);
    background: #0d3b5b;
}

.rnr-home-hero__button--red:hover {
    color: #ffffff;
    background: var(--rnr-red);
}

.rnr-home-hero__button:focus-visible {
    outline: 3px solid var(--rnr-red);
    outline-offset: 4px;
}

.rnr-home-hero__details {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 23px;
    color: var(--rnr-navy);
    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.rnr-home-hero__details span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.rnr-home-hero__details b {
    color: var(--rnr-red);
    font-size: 19px;
    line-height: 1;
}

.rnr-home-hero__details i {
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--rnr-red);
}

@keyframes rnr-home-hero-in {
    from {
        opacity: 0;
        transform: translateX(-24px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@media (max-width: 1050px) {
    .rnr-home-hero {
        background-position: 57% 58%;
    }

    .rnr-home-hero__inner {
        padding-right: 35px;
        padding-left: 35px;
    }

    .rnr-home-hero__content {
        width: 48%;
    }

    .rnr-home-hero__title {
        font-size: clamp(68px, 8vw, 88px);
    }

    .rnr-home-hero__button {
        min-width: 180px;
    }
}

@media (max-width: 760px) {
    .rnr-home-hero {
        align-items: flex-start;
        height: 650px;
        min-height: 650px;
        max-height: 650px;

        background-image:
            linear-gradient(
                90deg,
                rgba(242, 228, 197, 0.98) 0%,
                rgba(242, 228, 197, 0.92) 53%,
                rgba(242, 228, 197, 0.12) 100%
            ),
            url('https://rocknrolls.com.au/wp-content/uploads/2026/08/Hero_home_1.webp');

        background-position: 64% 56%;
    }

    .rnr-home-hero__inner {
        align-items: flex-start;
        padding: 48px 22px;
    }

    .rnr-home-hero__content {
        width: min(390px, 76%);
    }

    .rnr-home-hero__title {
        font-size: clamp(61px, 15vw, 78px);
    }

    .rnr-home-hero__description {
        max-width: 340px;
        font-size: 15px;
    }

    .rnr-home-hero__actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .rnr-home-hero__button {
        min-width: 205px;
    }

    .rnr-home-hero__details {
        max-width: 280px;
        gap: 9px;
    }
}

@media (max-width: 460px) {
    .rnr-home-hero {
        height: 620px;
        min-height: 620px;
        max-height: 620px;
        background-position: 67% 56%;
    }

    .rnr-home-hero__inner {
        padding-top: 38px;
    }

    .rnr-home-hero__content {
        width: 82%;
    }

    .rnr-home-hero__eyebrow {
        font-size: 12px;
    }

    .rnr-home-hero__title {
        font-size: clamp(56px, 17vw, 70px);
    }

    .rnr-home-hero__details {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rnr-home-hero__content {
        animation: none;
    }

    .rnr-home-hero__button {
        transition: none;
    }
}
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Barlow+Condensed:wght@600;700;800&family=Barlow:wght@500;600;700&display=swap');

.rr-lineup,
.rr-lineup * {
    box-sizing: border-box;
}

.rr-lineup {
    --rr-navy: #082c46;
    --rr-blue: #145b72;
    --rr-red: #c9282c;
    --rr-red-dark: #941c20;
    --rr-cream: #f2e4c5;
    --rr-paper: #fff8e9;
    --rr-ink: #1f2526;

    position: relative;
    isolation: isolate;
    width: 100%;
    padding: clamp(58px, 6vw, 88px) 24px;
    overflow: hidden;

    color: var(--rr-cream);
    background-color: var(--rr-navy);

    background-image:
        radial-gradient(
            circle at 20% 20%,
            rgba(242, 228, 197, 0.08) 0 1px,
            transparent 1.5px
        );

    background-size: 9px 9px;
}

/* Decoración editorial de fondo */

.rr-lineup::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -340px;
    right: -260px;
    width: 750px;
    height: 750px;
    border: 2px solid rgba(242, 228, 197, 0.08);
    border-radius: 50%;
    box-shadow:
        0 0 0 65px rgba(242, 228, 197, 0.025),
        0 0 0 130px rgba(242, 228, 197, 0.018);
}

.rr-lineup::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 12px;

    background:
        repeating-conic-gradient(
            var(--rr-red) 0 25%,
            var(--rr-cream) 0 50%
        )
        0 / 24px 24px;
}

.rr-lineup__container {
    position: relative;
    z-index: 2;
    width: min(1220px, 100%);
    margin: 0 auto;
}

/* ========================================
   CABECERA
======================================== */

.rr-lineup__header {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(300px, 0.7fr);
    gap: 60px;
    align-items: end;
    margin-bottom: clamp(32px, 4vw, 48px);
}

.rr-lineup__eyebrow {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 9px;

    color: var(--rr-cream);

    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.rr-lineup__eyebrow span {
    color: var(--rr-red);
    font-size: 13px;
}

.rr-lineup__header h2 {
    margin: 0;

    color: var(--rr-cream);

    font-family: "Anton", "Arial Narrow", sans-serif;
    font-size: clamp(58px, 5.6vw, 84px);
    font-weight: 400;
    line-height: 0.92;
    letter-spacing: -0.035em;
    text-transform: uppercase;
}

.rr-lineup__header h2 span {
    color: var(--rr-red);
}

.rr-lineup__intro {
    padding-left: 24px;
    border-left: 3px solid var(--rr-red);
}

.rr-lineup__intro p {
    max-width: 410px;
    margin: 0 0 16px;

    color: rgba(242, 228, 197, 0.86);

    font-family: "Barlow", Arial, sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
}

.rr-lineup__intro a {
    display: inline-flex;
    align-items: center;
    gap: 11px;

    color: var(--rr-cream);

    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.09em;
    text-decoration: none;
    text-transform: uppercase;

    transition:
        gap 0.2s ease,
        color 0.2s ease;
}

.rr-lineup__intro a span {
    color: var(--rr-red);
    font-size: 22px;
}

.rr-lineup__intro a:hover {
    gap: 17px;
    color: #ffffff;
}

/* ========================================
   COMPOSICIÓN ASIMÉTRICA
======================================== */

.rr-lineup__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(340px, 0.88fr);
    grid-template-rows: repeat(2, minmax(175px, 1fr));
    gap: 18px;
    min-height: 440px;
}

/* ========================================
   TARJETA BASE
======================================== */

.rr-lineup-card {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: flex-end;
    min-width: 0;
    padding: 30px;
    overflow: hidden;

    border: 2px solid rgba(242, 228, 197, 0.35);
    border-radius: 14px;

    color: inherit;
    text-decoration: none;

    box-shadow:
        0 6px 0 rgba(0, 0, 0, 0.18),
        0 18px 35px rgba(0, 0, 0, 0.18);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.rr-lineup-card::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 8px;

    border: 1px solid rgba(242, 228, 197, 0.25);
    border-radius: 9px;

    pointer-events: none;
}

/* Palabra gigante de fondo */

.rr-lineup-card::after {
    content: attr(data-word);

    position: absolute;
    z-index: -2;
    right: -10px;
    bottom: -24px;

    color: rgba(242, 228, 197, 0.075);

    font-family: "Anton", "Arial Narrow", sans-serif;
    font-size: clamp(100px, 11vw, 175px);
    font-weight: 400;
    line-height: 0.8;
    letter-spacing: -0.04em;
    text-transform: uppercase;
    white-space: nowrap;

    pointer-events: none;
}

.rr-lineup-card:hover {
    transform: translateY(-6px);

    box-shadow:
        0 10px 0 rgba(0, 0, 0, 0.2),
        0 25px 43px rgba(0, 0, 0, 0.25);
}

.rr-lineup-card--feature {
    grid-row: 1 / 3;

    color: var(--rr-navy);
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(201, 40, 44, 0.13),
            transparent 38%
        ),
        var(--rr-cream);

    border-color: var(--rr-cream);
}

.rr-lineup-card--feature::before {
    border-color: rgba(8, 44, 70, 0.22);
}

.rr-lineup-card--feature::after {
    color: rgba(8, 44, 70, 0.075);
    font-size: clamp(145px, 15vw, 230px);
}

.rr-lineup-card--coffee {
    color: var(--rr-cream);
    background: var(--rr-red);
}

.rr-lineup-card--toasties {
    color: var(--rr-cream);
    background: var(--rr-blue);
}

/* ========================================
   CONTENIDO DE LAS TARJETAS
======================================== */

.rr-lineup-card__number {
    position: absolute;
    top: 22px;
    left: 24px;

    display: grid;
    place-items: center;

    width: 48px;
    height: 48px;

    border: 2px solid currentColor;
    border-radius: 50%;

    font-family: "Anton", "Arial Narrow", sans-serif;
    font-size: 16px;
    line-height: 1;

    opacity: 0.9;
}

.rr-lineup-card__content {
    position: relative;
    z-index: 2;
    max-width: 520px;
}

.rr-lineup-card__kicker {
    display: block;
    margin-bottom: 7px;

    color: currentColor;
    opacity: 0.72;

    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.rr-lineup-card h3 {
    margin: 0;

    color: currentColor;

    font-family: "Anton", "Arial Narrow", sans-serif;
    font-size: clamp(45px, 5vw, 75px);
    font-weight: 400;
    line-height: 0.88;
    letter-spacing: -0.035em;
    text-transform: uppercase;
}

.rr-lineup-card--coffee h3,
.rr-lineup-card--toasties h3 {
    font-size: clamp(40px, 4vw, 58px);
}

.rr-lineup-card__content p {
    max-width: 390px;
    margin: 15px 0 0;

    color: currentColor;
    opacity: 0.85;

    font-family: "Barlow", Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.45;
}

.rr-lineup-card--coffee .rr-lineup-card__content p,
.rr-lineup-card--toasties .rr-lineup-card__content p {
    max-width: 290px;
    margin-top: 9px;
    font-size: 14px;
}

/* Etiquetas inferiores */

.rr-lineup-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
}

.rr-lineup-card__tags span {
    display: block;
    padding: 8px 12px;

    border: 1px solid rgba(8, 44, 70, 0.3);
    border-radius: 999px;

    color: var(--rr-navy);
    background: rgba(255, 248, 233, 0.45);

    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* Flechas */

.rr-lineup-card__arrow {
    position: absolute;
    right: 24px;
    bottom: 25px;

    display: grid;
    place-items: center;

    width: 49px;
    height: 49px;

    border: 2px solid currentColor;
    border-radius: 50%;

    transition:
        transform 0.3s ease,
        color 0.3s ease,
        background-color 0.3s ease;
}

.rr-lineup-card__arrow svg {
    width: 23px;
    height: 23px;

    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.rr-lineup-card:hover .rr-lineup-card__arrow {
    transform: translateX(5px) rotate(-8deg);
}

.rr-lineup-card--feature:hover .rr-lineup-card__arrow {
    color: var(--rr-cream);
    background: var(--rr-navy);
}

.rr-lineup-card--coffee:hover .rr-lineup-card__arrow,
.rr-lineup-card--toasties:hover .rr-lineup-card__arrow {
    color: var(--rr-navy);
    background: var(--rr-cream);
}

/* Estrellas */

.rr-lineup-card__star {
    position: absolute;
    top: 25px;
    right: 27px;

    color: currentColor;
    font-size: 24px;

    opacity: 0.75;

    transition: transform 0.4s ease;
}

.rr-lineup-card:hover .rr-lineup-card__star {
    transform: rotate(90deg) scale(1.15);
}

/* ========================================
   PIE DEL BLOQUE
======================================== */

.rr-lineup__footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;

    margin-top: 29px;

    color: rgba(242, 228, 197, 0.78);
}

.rr-lineup__footer > span {
    color: var(--rr-red);
    font-size: 18px;
}

.rr-lineup__footer p {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;

    margin: 0;

    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.rr-lineup__footer i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--rr-red);
}

/* ========================================
   TABLET
======================================== */

@media (max-width: 900px) {
    .rr-lineup__header {
        grid-template-columns: 1fr;
        gap: 21px;
    }

    .rr-lineup__intro {
        max-width: 600px;
    }

    .rr-lineup__grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
        min-height: 0;
    }

    .rr-lineup-card--feature {
        grid-column: 1 / -1;
        grid-row: auto;
        min-height: 370px;
    }

    .rr-lineup-card--coffee,
    .rr-lineup-card--toasties {
        min-height: 230px;
    }
}

/* ========================================
   MOBILE
======================================== */

@media (max-width: 650px) {
    .rr-lineup {
        padding: 52px 17px 67px;
    }

    .rr-lineup__header h2 {
        font-size: clamp(51px, 15vw, 66px);
    }

    .rr-lineup__intro {
        padding-left: 17px;
    }

    .rr-lineup__intro p {
        font-size: 15px;
    }

    .rr-lineup__grid {
        grid-template-columns: 1fr;
    }

    .rr-lineup-card {
        min-height: 225px;
        padding: 25px 22px;
    }

    .rr-lineup-card--feature {
        grid-column: auto;
        min-height: 350px;
    }

    .rr-lineup-card h3,
    .rr-lineup-card--coffee h3,
    .rr-lineup-card--toasties h3 {
        font-size: clamp(43px, 13vw, 58px);
    }

    .rr-lineup-card__content {
        padding-right: 42px;
    }

    .rr-lineup-card__content p {
        font-size: 14px;
    }

    .rr-lineup-card__number {
        top: 18px;
        left: 19px;
        width: 42px;
        height: 42px;
        font-size: 14px;
    }

    .rr-lineup-card__star {
        top: 20px;
        right: 21px;
        font-size: 20px;
    }

    .rr-lineup-card__arrow {
        right: 19px;
        bottom: 20px;
        width: 44px;
        height: 44px;
    }

    .rr-lineup__footer {
        gap: 10px;
    }

    .rr-lineup__footer > span {
        display: none;
    }

    .rr-lineup__footer p {
        gap: 8px;
        font-size: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rr-lineup-card,
    .rr-lineup-card__arrow,
    .rr-lineup-card__star,
    .rr-lineup__intro a {
        transition: none;
    }
}
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Barlow+Condensed:wght@600;700;800&family=Barlow:wght@500;600;700&display=swap');

.rr-origin,
.rr-origin * {
    box-sizing: border-box;
}

.rr-origin {
    --rr-navy: #082c46;
    --rr-blue: #155c73;
    --rr-red: #c9282c;
    --rr-red-dark: #941c20;
    --rr-cream: #f2e4c5;
    --rr-paper: #fff8e9;
    --rr-ink: #202528;

    position: relative;
    isolation: isolate;
    width: 100%;
    padding: clamp(60px, 7vw, 105px) 24px;
    overflow: hidden;

    background-color: var(--rr-cream);
    background-image:
        radial-gradient(
            circle at 15% 20%,
            rgba(8, 44, 70, 0.08) 0 1px,
            transparent 1.5px
        );

    background-size: 10px 10px;
}

.rr-origin::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -270px;
    right: -220px;
    width: 620px;
    height: 620px;
    border: 2px solid rgba(8, 44, 70, 0.08);
    border-radius: 50%;
    box-shadow:
        0 0 0 65px rgba(8, 44, 70, 0.025),
        0 0 0 130px rgba(8, 44, 70, 0.016);
}

/* ========================================
   MAIN STAGE
======================================== */

.rr-origin__stage {
    position: relative;
    isolation: isolate;
    width: min(1240px, 100%);
    min-height: 610px;
    margin: 0 auto;
    overflow: hidden;

    border: 3px solid var(--rr-navy);
    border-radius: 18px;

    background: var(--rr-navy);

    box-shadow:
        10px 10px 0 var(--rr-red),
        18px 18px 0 rgba(8, 44, 70, 0.13),
        0 30px 55px rgba(8, 44, 70, 0.17);
}

.rr-origin__stage::before {
    content: "";
    position: absolute;
    z-index: 5;
    top: 0;
    right: 0;
    left: 0;
    height: 11px;

    background:
        repeating-conic-gradient(
            var(--rr-cream) 0 25%,
            var(--rr-red) 0 50%
        )
        0 / 22px 22px;
}

/* ========================================
   PHOTOGRAPH
======================================== */

.rr-origin__media {
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    width: 63%;
    overflow: hidden;
}

.rr-origin__media::before {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            var(--rr-navy) 0%,
            rgba(8, 44, 70, 0.85) 9%,
            rgba(8, 44, 70, 0.18) 35%,
            rgba(8, 44, 70, 0) 65%
        ),
        linear-gradient(
            0deg,
            rgba(8, 44, 70, 0.5) 0%,
            transparent 38%
        );

    pointer-events: none;
}

.rr-origin__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 53% center;

    transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.rr-origin__stage:hover .rr-origin__media img {
    transform: scale(1.025);
}

.rr-origin__location-tag {
    position: absolute;
    z-index: 4;
    top: 35px;
    right: 31px;

    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 10px 15px;

    border: 2px solid var(--rr-cream);
    border-radius: 999px;

    color: var(--rr-cream);
    background: rgba(8, 44, 70, 0.88);
    backdrop-filter: blur(5px);

    box-shadow: 4px 4px 0 var(--rr-red);

    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.rr-origin__location-tag span {
    color: var(--rr-red);
    font-size: 13px;
}

/* ========================================
   CONTENT
======================================== */

.rr-origin__content {
    position: relative;
    z-index: 3;
    width: 51%;
    padding:
        clamp(62px, 6vw, 84px)
        clamp(40px, 5vw, 68px)
        145px;
}

.rr-origin__eyebrow {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 9px;

    color: var(--rr-cream);

    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.rr-origin__eyebrow span {
    color: var(--rr-red);
    font-size: 13px;
}

.rr-origin__content h2 {
    margin: 0;

    color: var(--rr-cream);

    font-family: "Anton", "Arial Narrow", sans-serif;
    font-size: clamp(75px, 7vw, 108px);
    font-weight: 400;
    line-height: 0.77;
    letter-spacing: -0.04em;
    text-transform: uppercase;
}

.rr-origin__content h2 span {
    display: inline-block;
    margin-left: clamp(22px, 3vw, 45px);
    color: var(--rr-red);
}

.rr-origin__stroke {
    width: min(290px, 75%);
    height: 6px;
    margin: 25px 0 24px 20px;

    border-radius: 50%;
    background: var(--rr-red);

    transform: rotate(-3deg) skewX(-20deg);
}

.rr-origin__lead {
    max-width: 455px;
    margin: 0 0 13px;

    color: var(--rr-cream);

    font-family: "Barlow", Arial, sans-serif;
    font-size: clamp(17px, 1.5vw, 21px);
    font-weight: 700;
    line-height: 1.4;
}

.rr-origin__text {
    max-width: 450px;
    margin: 0;

    color: rgba(242, 228, 197, 0.72);

    font-family: "Barlow", Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.55;
}

/* ========================================
   BUTTONS
======================================== */

.rr-origin__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 25px;
}

.rr-origin-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;

    min-width: 185px;
    min-height: 50px;
    padding: 12px 15px 12px 21px;

    border: 2px solid;
    border-radius: 7px;

    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.07em;
    text-decoration: none;
    text-transform: uppercase;

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        color 0.2s ease,
        background-color 0.2s ease;
}

.rr-origin-button svg {
    width: 21px;
    height: 21px;

    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.rr-origin-button--red {
    border-color: var(--rr-red);
    color: #ffffff;
    background: var(--rr-red);

    box-shadow: 0 4px 0 var(--rr-red-dark);
}

.rr-origin-button--outline {
    border-color: var(--rr-cream);
    color: var(--rr-cream);
    background: transparent;
}

.rr-origin-button:hover {
    transform: translateY(-2px);
}

.rr-origin-button--red:hover {
    color: var(--rr-navy);
    background: var(--rr-cream);
    border-color: var(--rr-cream);
    box-shadow: 0 5px 0 rgba(0, 0, 0, 0.25);
}

.rr-origin-button--outline:hover {
    color: var(--rr-navy);
    background: var(--rr-cream);
}

.rr-origin-button:focus-visible {
    outline: 4px solid var(--rr-red);
    outline-offset: 4px;
}

/* ========================================
   INFORMATION BAR
======================================== */

.rr-origin__facts {
    position: absolute;
    z-index: 6;
    right: 28px;
    bottom: 27px;

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    width: min(650px, 55%);
    overflow: hidden;

    border: 2px solid var(--rr-navy);
    border-radius: 10px;

    color: var(--rr-navy);
    background: rgba(255, 248, 233, 0.96);
    backdrop-filter: blur(7px);

    box-shadow:
        6px 6px 0 var(--rr-red),
        0 15px 30px rgba(0, 0, 0, 0.2);
}

.rr-origin-fact {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 10px;
    align-items: center;

    min-height: 82px;
    padding: 14px 15px;

    border-right: 1px solid rgba(8, 44, 70, 0.18);
}

.rr-origin-fact:last-child {
    border-right: 0;
}

.rr-origin-fact__icon {
    display: grid;
    place-items: center;

    width: 36px;
    height: 36px;

    border: 2px solid var(--rr-navy);
    border-radius: 50%;

    color: var(--rr-red);
}

.rr-origin-fact__icon svg {
    width: 19px;
    height: 19px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.rr-origin-fact small,
.rr-origin-fact strong {
    display: block;
}

.rr-origin-fact small {
    margin-bottom: 3px;

    color: rgba(8, 44, 70, 0.64);

    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.rr-origin-fact strong {
    color: var(--rr-red);

    font-family: "Barlow Condensed", Arial, sans-serif;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.1;
    text-transform: uppercase;
}

/* ========================================
   TABLET
======================================== */

@media (max-width: 950px) {
    .rr-origin__stage {
        min-height: 720px;
    }

    .rr-origin__media {
        top: 0;
        right: 0;
        bottom: auto;
        width: 56%;
        height: 100%;
    }

    .rr-origin__content {
        width: 59%;
        padding-right: 35px;
    }

    .rr-origin__content h2 {
        font-size: clamp(72px, 10vw, 94px);
    }

    .rr-origin__facts {
        right: 22px;
        bottom: 23px;
        width: calc(100% - 44px);
    }
}

/* ========================================
   MOBILE
======================================== */

@media (max-width: 700px) {
    .rr-origin {
        padding: 52px 16px 65px;
    }

    .rr-origin__stage {
        display: flex;
        flex-direction: column;
        min-height: 0;

        box-shadow:
            6px 6px 0 var(--rr-red),
            11px 11px 0 rgba(8, 44, 70, 0.13);
    }

    .rr-origin__media {
        position: relative;
        order: 1;
        width: 100%;
        height: 285px;
    }

    .rr-origin__media::before {
        background:
            linear-gradient(
                0deg,
                var(--rr-navy) 0%,
                rgba(8, 44, 70, 0.2) 35%,
                transparent 65%
            );
    }

    .rr-origin__media img {
        object-position: center;
    }

    .rr-origin__location-tag {
        top: 25px;
        right: 20px;
        font-size: 12px;
    }

    .rr-origin__content {
        position: relative;
        order: 2;
        width: 100%;
        padding: 35px 24px 31px;
    }

    .rr-origin__content h2 {
        font-size: clamp(69px, 21vw, 88px);
    }

    .rr-origin__lead {
        font-size: 17px;
    }

    .rr-origin__text {
        font-size: 14px;
    }

    .rr-origin__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .rr-origin-button {
        width: 100%;
    }

    .rr-origin__facts {
        position: relative;
        order: 3;
        right: auto;
        bottom: auto;

        grid-template-columns: 1fr;
        width: calc(100% - 34px);
        margin: 0 17px 24px;

        box-shadow: 5px 5px 0 var(--rr-red);
    }

    .rr-origin-fact {
        min-height: 70px;
        border-right: 0;
        border-bottom: 1px solid rgba(8, 44, 70, 0.17);
    }

    .rr-origin-fact:last-child {
        border-bottom: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rr-origin__media img,
    .rr-origin-button {
        transition: none;
    }
}