/*
 * Fanzine Skateplaces — main stylesheet.
 *
 * Color roles (do not mix):
 * - --sp-pink: editorial accent (ticker, "Nuevo" sticker, link hover). Customizer-editable.
 * - --sp-lime: ONLY for things that lead to the app/map. Never lime text on paper.
 * - --sp-magenta: meta label text on paper (contrast-safe).
 * - --sp-cat-*: category pill fills (black or paper text, >= 4.5:1). Never lime.
 */

:root {
	--sp-paper: #F2EEE4;
	--sp-ink: #111111;
	--sp-pink: #FF4F9A;
	--sp-lime: #C6F135;
	--sp-magenta: #6B1240;
	--sp-white: #FFFFFF;
	--sp-paper-dark: #E0DACB;

	/* Category pill fills; pink is fixed here so the Customizer accent can change alone. */
	--sp-cat-pink: #FF4F9A;
	--sp-cat-orange: #FF8A1F;
	--sp-cat-cyan: #4FD1FF;
	--sp-cat-violet: #B9A2FF;

	--sp-font-display: "Anton", "Impact", "Arial Narrow Bold", sans-serif;
	--sp-font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	--sp-font-body: "Work Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	--sp-border: 4px solid var(--sp-ink);
	--sp-border-thin: 3px solid var(--sp-ink);
	--sp-shadow-lg: 10px 10px 0 var(--sp-ink);
	--sp-shadow-md: 5px 5px 0 var(--sp-ink);
	--sp-shadow-sm: 4px 4px 0 var(--sp-ink);

	--sp-gutter: 48px;
	--sp-max: 1440px;
}

/* ---------- Reset / base ---------- */

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

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body {
	margin: 0;
	background: var(--sp-paper);
	color: var(--sp-ink);
	font-family: var(--sp-font-body);
	font-size: 18px;
	line-height: 1.55;
	overflow-x: clip;
}

img,
video,
svg {
	max-width: 100%;
	height: auto;
}

a {
	color: inherit;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

/* Pink hover as a highlight (pink text on paper would fail contrast). */
a:hover {
	background-color: var(--sp-pink);
	color: var(--sp-ink);
}

a:has(> img):hover,
.wp-block-image a:hover {
	background-color: transparent;
}

:focus {
	outline: none;
}

:focus-visible {
	outline: 3px solid var(--sp-ink);
	outline-offset: 3px;
	box-shadow: 0 0 0 7px var(--sp-pink);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--sp-font-display);
	font-weight: 400;
	text-transform: uppercase;
	line-height: 0.98;
	letter-spacing: 0.005em;
	margin: 0 0 0.5em;
	overflow-wrap: break-word;
}

p {
	margin: 0 0 1em;
}

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.skip-link {
	position: absolute;
	left: 16px;
	top: -100px;
	z-index: 1000;
	padding: 12px 18px;
	background: var(--sp-ink);
	color: var(--sp-lime);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	text-decoration: none;
}

.skip-link:focus {
	top: 16px;
}

.skip-link:hover {
	background: var(--sp-ink);
	color: var(--sp-lime);
}

.container {
	width: 100%;
	max-width: var(--sp-max);
	margin: 0 auto;
	padding-left: var(--sp-gutter);
	padding-right: var(--sp-gutter);
}

.site-main:focus {
	outline: none;
	box-shadow: none;
}

/* ---------- Buttons ---------- */

.btn,
.btn-map,
.search-form__submit,
.wp-block-button__link,
input[type="submit"] {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 22px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 16px;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	text-decoration: none;
	border: var(--sp-border-thin);
	cursor: pointer;
	transition: transform 0.08s ease, box-shadow 0.08s ease;
}

.btn:hover,
.btn-map:hover,
.search-form__submit:hover {
	transform: translate(2px, 2px);
}

.btn--outline {
	background: transparent;
	color: var(--sp-ink);
	box-shadow: var(--sp-shadow-md);
}

.btn--outline:hover {
	background: var(--sp-pink);
	color: var(--sp-ink);
	box-shadow: 3px 3px 0 var(--sp-ink);
}

.btn--ink,
.search-form__submit,
input[type="submit"] {
	background: var(--sp-ink);
	color: var(--sp-paper);
	box-shadow: var(--sp-shadow-sm);
}

.btn--ink:hover,
.search-form__submit:hover {
	background: var(--sp-ink);
	color: var(--sp-paper);
}

/* App/map buttons: lime fill, black text. */
.btn-map,
.btn--app {
	background: var(--sp-lime);
	color: var(--sp-ink);
	border: 3px solid var(--sp-ink);
	box-shadow: var(--sp-shadow-sm);
}

.btn-map:hover,
.btn--app:hover {
	background: var(--sp-lime);
	color: var(--sp-ink);
	box-shadow: 2px 2px 0 var(--sp-ink);
}

.icon-pin {
	flex: none;
	width: 18px;
	height: 18px;
}

/* ---------- Header ---------- */

.site-header {
	border-bottom: var(--sp-border);
	background: var(--sp-paper);
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	min-height: 104px;
	padding-top: 20px;
	padding-bottom: 20px;
}

.site-branding {
	flex: none;
	line-height: 0;
}

.custom-logo-link {
	display: inline-block;
}

.custom-logo-link:hover {
	background: transparent;
}

.custom-logo {
	display: block;
	height: 64px;
	width: auto;
	max-width: 260px;
	object-fit: contain;
}

.site-title {
	font-family: var(--sp-font-display);
	font-size: 44px;
	line-height: 1;
	text-transform: uppercase;
	text-decoration: none;
}

.site-header__actions {
	display: flex;
	align-items: center;
	gap: 28px;
}

.primary-nav__list,
.primary-nav__list ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.primary-nav {
	margin-left: auto;
}

.primary-nav__list {
	display: flex;
	align-items: center;
	gap: 28px;
}

.primary-nav__list > li {
	position: relative;
}

.primary-nav__list a {
	display: inline-block;
	padding: 6px 4px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 16px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	text-decoration: none;
}

.primary-nav__list .current-menu-item > a,
.primary-nav__list .current_page_item > a {
	text-decoration: underline;
	text-decoration-thickness: 3px;
}

.primary-nav__list .sub-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 50;
	min-width: 200px;
	padding: 8px 0;
	background: var(--sp-paper);
	border: var(--sp-border-thin);
	box-shadow: var(--sp-shadow-md);
}

.primary-nav__list li:hover > .sub-menu,
.primary-nav__list li:focus-within > .sub-menu {
	display: block;
}

.primary-nav__list .sub-menu a {
	display: block;
	padding: 8px 16px;
}

.nav-toggle {
	display: none;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	background: transparent;
	color: var(--sp-ink);
	border: var(--sp-border-thin);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	cursor: pointer;
}

.nav-toggle__bars,
.nav-toggle__bars::before,
.nav-toggle__bars::after {
	display: block;
	width: 18px;
	height: 3px;
	background: currentColor;
}

.nav-toggle__bars {
	position: relative;
}

.nav-toggle__bars::before,
.nav-toggle__bars::after {
	content: "";
	position: absolute;
	left: 0;
}

.nav-toggle__bars::before {
	top: -6px;
}

.nav-toggle__bars::after {
	top: 6px;
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bars {
	background: transparent;
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bars::before {
	top: 0;
	transform: rotate(45deg);
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bars::after {
	top: 0;
	transform: rotate(-45deg);
}

/* ---------- Ticker ---------- */

.ticker {
	background: var(--sp-pink);
	color: var(--sp-ink);
	border-bottom: var(--sp-border);
	font-family: var(--sp-font-mono);
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.ticker__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding-top: 12px;
	padding-bottom: 12px;
}

.ticker__text {
	display: flex;
	flex-wrap: wrap;
	gap: 0 12px;
	margin: 0;
	font-weight: 600;
}

.ticker__pill {
	flex: none;
	padding: 6px 14px;
	background: var(--sp-ink);
	color: var(--sp-lime);
	font-weight: 600;
	font-size: 14px;
	text-decoration: none;
	border: 2px solid var(--sp-ink);
}

.ticker__pill:hover {
	background: var(--sp-ink);
	color: var(--sp-lime);
	text-decoration: underline;
}

.ticker__pill:focus-visible {
	outline-color: var(--sp-ink);
	box-shadow: 0 0 0 7px var(--sp-lime);
}

/* ---------- Post label (CATEGORY · date) ---------- */

.post-label {
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.1em;
	color: var(--sp-magenta);
}

.post-label__cat {
	text-transform: uppercase;
	text-decoration: none;
	color: var(--sp-magenta);
}

.post-label__cat:hover {
	color: var(--sp-ink);
}

/* Category pill: filled sticker, text color picked per fill for contrast. */
.cat-pill {
	display: inline-block;
	padding: 3px 8px;
	border: 2px solid var(--sp-ink);
	background: var(--sp-ink);
	color: var(--sp-paper);
	font-size: 13px;
	line-height: 1.3;
	letter-spacing: 0.08em;
	vertical-align: baseline;
}

.cat-pill--pink {
	background: var(--sp-cat-pink);
	color: var(--sp-ink);
}

.cat-pill--orange {
	background: var(--sp-cat-orange);
	color: var(--sp-ink);
}

.cat-pill--cyan {
	background: var(--sp-cat-cyan);
	color: var(--sp-ink);
}

.cat-pill--violet {
	background: var(--sp-cat-violet);
	color: var(--sp-ink);
}

.cat-pill--ink {
	background: var(--sp-ink);
	color: var(--sp-paper);
}

/* Keep the fill on hover (the global pink link highlight would erase it). */
.cat-pill:hover {
	text-decoration: underline;
	text-decoration-thickness: 2px;
}

.cat-pill--pink:hover {
	background: var(--sp-cat-pink);
	color: var(--sp-ink);
}

.cat-pill--orange:hover {
	background: var(--sp-cat-orange);
	color: var(--sp-ink);
}

.cat-pill--cyan:hover {
	background: var(--sp-cat-cyan);
	color: var(--sp-ink);
}

.cat-pill--violet:hover {
	background: var(--sp-cat-violet);
	color: var(--sp-ink);
}

.cat-pill--ink:hover {
	background: var(--sp-ink);
	color: var(--sp-paper);
}

.post-label__date {
	text-transform: none;
}

/* ---------- Hero ---------- */

.hero {
	padding: 56px 0 72px;
	border-bottom: var(--sp-border);
}

.hero__grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 48px;
	align-items: center;
}

.hero__media {
	grid-column: span 7;
	position: relative;
}

.hero__image-link {
	display: block;
}

.hero__image-link:hover {
	background: transparent;
}

.hero__image {
	display: block;
	width: 100%;
	height: 560px;
	object-fit: cover;
	border: var(--sp-border);
	box-shadow: var(--sp-shadow-lg);
	background: var(--sp-ink);
}

/* Event flyers are tall posters: keep their headline in frame. */
.is-event .hero__image,
.is-event .entry-thumbnail__image {
	object-position: top;
}

.hero__image--empty {
	background: var(--sp-ink);
}

.sticker {
	position: absolute;
	top: -22px;
	left: -18px;
	z-index: 2;
	padding: 10px 18px;
	background: var(--sp-pink);
	color: var(--sp-ink);
	border: var(--sp-border-thin);
	box-shadow: var(--sp-shadow-sm);
	font-family: var(--sp-font-display);
	font-size: 30px;
	line-height: 1;
	text-transform: uppercase;
	transform: rotate(-4deg);
}

.hero__text {
	grid-column: span 5;
	min-width: 0;
}

.hero__label {
	display: inline-block;
	margin: 0 0 24px;
	padding: 8px 12px;
	border: var(--sp-border-thin);
	background: var(--sp-paper);
}

.hero__title {
	font-size: clamp(56px, 7vw, 120px);
	line-height: 0.92;
	margin: 0 0 24px;
}

.hero__title.is-long {
	font-size: clamp(48px, 5.2vw, 88px);
}

.hero__title.is-very-long {
	font-size: clamp(40px, 4vw, 68px);
	line-height: 0.96;
}

.hero__title a {
	text-decoration: none;
}

.hero__title a:hover {
	background: transparent;
	color: var(--sp-ink);
	text-decoration: underline;
	text-decoration-color: var(--sp-pink);
	text-decoration-thickness: 6px;
}

.hero__excerpt {
	font-size: 21px;
	line-height: 1.55;
	margin: 0 0 28px;
}

/* ---------- Layout: main + sidebar ---------- */

.layout {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 48px;
	padding-top: 56px;
	padding-bottom: 72px;
}

.layout__main {
	grid-column: span 8;
	min-width: 0;
}

.sidebar {
	grid-column: span 4;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.section-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 36px;
	padding-bottom: 12px;
	border-bottom: var(--sp-border);
}

.section-header__title {
	font-size: 56px;
	line-height: 1;
	margin: 0;
}

.section-header__link {
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	padding-bottom: 6px;
}

/* ---------- Cards ---------- */

.card-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 48px 36px;
}

.card-grid--three {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.card {
	min-width: 0;
}

.card__media {
	position: relative;
	margin-bottom: 16px;
}

.card__image-link {
	display: block;
}

.card__image-link:hover {
	background: transparent;
}

.card__image {
	display: block;
	width: 100%;
	height: 300px;
	object-fit: cover;
	object-position: top;
	border: var(--sp-border-thin);
	background: var(--sp-ink);
	transition: box-shadow 0.1s ease, transform 0.1s ease;
}

.card__image-link:hover .card__image,
.card:focus-within .card__image {
	box-shadow: var(--sp-shadow-md);
	transform: translate(-3px, -3px);
}

.card__label {
	margin: 0 0 8px;
}

.card__title {
	font-size: 36px;
	line-height: 1;
	margin: 0;
}

.card__title a {
	text-decoration: none;
}

.card__title a:hover {
	background: var(--sp-pink);
	color: var(--sp-ink);
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

/* ---------- Pagination ---------- */

.fz-pagination {
	margin-top: 56px;
}

.fz-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.fz-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 48px;
	min-height: 48px;
	padding: 10px 14px;
	border: var(--sp-border-thin);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	text-decoration: none;
	background: var(--sp-paper);
	box-shadow: var(--sp-shadow-sm);
}

.fz-pagination .page-numbers.current {
	background: var(--sp-ink);
	color: var(--sp-paper);
}

.fz-pagination .page-numbers.dots {
	border-color: transparent;
	box-shadow: none;
	background: transparent;
}

/* ---------- Map card (sidebar) ---------- */

.map-card {
	padding: 32px 28px;
	background: var(--sp-ink);
	color: var(--sp-paper);
	border: var(--sp-border);
	box-shadow: 8px 8px 0 var(--sp-lime);
}

.map-card__label {
	margin: 0 0 12px;
	color: var(--sp-lime);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.map-card__title {
	font-size: 44px;
	line-height: 0.98;
	color: var(--sp-paper);
	margin: 0 0 16px;
}

.map-card__body {
	font-size: 17px;
	margin: 0 0 24px;
}

.map-card .btn--app {
	border-color: var(--sp-lime);
	box-shadow: none;
}

.map-card .btn--app:hover {
	box-shadow: none;
}

.map-card :focus-visible {
	outline-color: var(--sp-lime);
	box-shadow: 0 0 0 7px var(--sp-paper);
}

/* ---------- Widgets ---------- */

.widget {
	margin: 0;
}

.widget-area {
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.widget-title,
.widget .wp-block-heading {
	font-size: 32px;
	margin: 0 0 16px;
	padding-bottom: 8px;
	border-bottom: var(--sp-border-thin);
}

.widget img,
.widget .wp-block-image img {
	display: block;
	border: var(--sp-border);
}

.widget .wp-block-image {
	margin: 0;
}

.widget ul {
	padding-left: 1.2em;
}

/* YouTube/Vimeo embeds: black frame + responsive 16:9. Spotify and ad
   iframes keep their own dimensions on purpose. */
.wp-block-embed-youtube .wp-block-embed__wrapper,
.wp-block-embed-vimeo .wp-block-embed__wrapper,
.widget .wp-block-embed.is-type-video .wp-block-embed__wrapper {
	background: var(--sp-ink);
	border: var(--sp-border);
	padding: 6px;
}

.wp-block-embed-youtube.wp-has-aspect-ratio .wp-block-embed__wrapper,
.wp-block-embed-vimeo.wp-has-aspect-ratio .wp-block-embed__wrapper {
	padding: 0;
	border-width: 10px 6px;
	border-color: var(--sp-ink);
}

.widget .wp-block-embed {
	margin: 0;
}

iframe[src*="youtube.com"],
iframe[src*="youtube-nocookie.com"],
iframe[src*="player.vimeo.com"] {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border: 0;
}

.wp-has-aspect-ratio iframe[src*="youtube.com"],
.wp-has-aspect-ratio iframe[src*="youtube-nocookie.com"],
.wp-has-aspect-ratio iframe[src*="player.vimeo.com"] {
	height: 100%;
}

.wp-block-embed iframe {
	max-width: 100%;
}

/* ---------- Page header (archives, search) ---------- */

.page-header {
	padding: 56px 0 40px;
	border-bottom: var(--sp-border);
}

.page-header__kicker,
.entry-meta {
	display: inline-block;
	margin: 0 0 16px;
	padding: 6px 12px;
	border: var(--sp-border-thin);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.page-header__title {
	font-size: clamp(56px, 8vw, 128px);
	line-height: 0.92;
	margin: 0;
}

.page-header__description {
	max-width: 720px;
	margin-top: 20px;
	font-size: 19px;
}

.page-header__search {
	max-width: 640px;
	margin-top: 28px;
}

/* ---------- Search form ---------- */

.search-form__label {
	display: block;
	margin-bottom: 8px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.search-form__row {
	display: flex;
	gap: 12px;
}

.search-form__input,
input[type="text"],
input[type="email"],
input[type="url"],
textarea {
	flex: 1 1 auto;
	min-width: 0;
	padding: 12px 14px;
	background: var(--sp-white);
	color: var(--sp-ink);
	border: var(--sp-border-thin);
	font-family: var(--sp-font-body);
	font-size: 17px;
}

.search-form__input:focus-visible,
input:focus-visible,
textarea:focus-visible {
	outline-offset: 0;
}

/* ---------- Single entry ---------- */

.entry-header {
	padding: 56px 0 40px;
	border-bottom: var(--sp-border);
}

.entry-header__label {
	margin: 0 0 20px;
}

.entry-title {
	max-width: 1200px;
	font-size: clamp(52px, 7vw, 120px);
	line-height: 0.92;
	margin: 0 0 24px;
}

.entry-title.is-long {
	font-size: clamp(44px, 5.5vw, 96px);
}

.entry-title.is-very-long {
	font-size: clamp(38px, 4.4vw, 76px);
	line-height: 0.96;
}

.entry-meta {
	margin: 0;
}

.entry-meta a {
	text-decoration: none;
}

.entry-thumbnail {
	position: relative;
	margin: 0 0 48px;
}

.entry-thumbnail__image {
	display: block;
	width: 100%;
	max-height: 640px;
	object-fit: cover;
	border: var(--sp-border);
	box-shadow: var(--sp-shadow-lg);
	background: var(--sp-ink);
}

.entry-thumbnail figcaption,
.entry-content figcaption,
.wp-caption-text {
	margin-top: 16px;
	font-family: var(--sp-font-mono);
	font-size: 13px;
	letter-spacing: 0.04em;
}

.entry-content {
	max-width: 720px;
	font-size: 19px;
	line-height: 1.6;
}

.entry-content > * {
	margin-top: 0;
	margin-bottom: 1.2em;
}

.entry-content h2 {
	font-size: 48px;
	margin-top: 1.4em;
}

.entry-content h3 {
	font-size: 36px;
	margin-top: 1.3em;
}

.entry-content h4,
.entry-content h5,
.entry-content h6 {
	font-size: 26px;
	margin-top: 1.2em;
}

.entry-content a {
	text-decoration-color: var(--sp-pink);
	text-decoration-thickness: 3px;
}

.entry-content ul,
.entry-content ol {
	padding-left: 1.4em;
}

.entry-content ul {
	list-style: square;
}

.entry-content li {
	margin-bottom: 0.4em;
}

.entry-content li::marker {
	font-family: var(--sp-font-mono);
	font-weight: 600;
}

.entry-content blockquote,
.entry-content .wp-block-quote {
	margin: 1.6em 0;
	padding: 24px 28px;
	border: var(--sp-border);
	background: var(--sp-white);
	box-shadow: var(--sp-shadow-md);
	font-size: 22px;
	font-weight: 500;
}

.entry-content blockquote p:last-of-type {
	margin-bottom: 0;
}

.entry-content blockquote cite,
.entry-content .wp-block-quote cite {
	display: block;
	margin-top: 12px;
	font-family: var(--sp-font-mono);
	font-size: 14px;
	font-style: normal;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.entry-content .wp-block-pullquote {
	border-top: var(--sp-border);
	border-bottom: var(--sp-border);
	padding: 32px 0;
}

.entry-content .wp-block-pullquote blockquote {
	border: 0;
	box-shadow: none;
	background: transparent;
	font-family: var(--sp-font-display);
	font-size: 40px;
	text-transform: uppercase;
	line-height: 1;
}

.entry-content img {
	height: auto;
}

.entry-content .wp-block-image img,
.entry-content .wp-caption img,
.entry-content p > img {
	border: var(--sp-border-thin);
}

.entry-content .wp-block-image,
.entry-content .wp-caption {
	max-width: 100%;
}

.entry-content .alignwide,
.entry-content .alignfull {
	max-width: 100%;
}

.entry-content .alignleft {
	float: left;
	margin: 0 24px 16px 0;
}

.entry-content .alignright {
	float: right;
	margin: 0 0 16px 24px;
}

.entry-content .aligncenter {
	margin-left: auto;
	margin-right: auto;
}

.entry-content table,
.entry-content .wp-block-table table {
	width: 100%;
	border-collapse: collapse;
	border: var(--sp-border-thin);
	font-size: 16px;
}

.entry-content .wp-block-table {
	overflow-x: auto;
}

.entry-content th,
.entry-content td {
	padding: 10px 12px;
	border: 2px solid var(--sp-ink);
	text-align: left;
	vertical-align: top;
}

.entry-content th,
.entry-content thead td {
	background: var(--sp-ink);
	color: var(--sp-paper);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.entry-content pre,
.entry-content code {
	font-family: var(--sp-font-mono);
	font-size: 15px;
}

.entry-content pre {
	padding: 16px;
	overflow-x: auto;
	background: var(--sp-ink);
	color: var(--sp-paper);
	border: var(--sp-border-thin);
}

.entry-content hr,
.entry-content .wp-block-separator {
	border: 0;
	border-top: var(--sp-border);
	margin: 2em 0;
}

.entry-content .wp-block-embed {
	margin: 1.6em 0;
}

.entry-content::after {
	content: "";
	display: table;
	clear: both;
}

.page-links {
	font-family: var(--sp-font-mono);
	font-weight: 600;
	text-transform: uppercase;
}

.entry-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	max-width: 720px;
	margin: 40px 0 0;
	padding: 0;
	list-style: none;
}

.entry-tags a {
	display: inline-block;
	padding: 6px 12px;
	border: var(--sp-border-thin);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	text-decoration: none;
	color: var(--sp-magenta);
}

.entry-tags a:hover {
	color: var(--sp-ink);
}

/* App CTA after content: lime box, black text. */
.app-cta {
	max-width: 720px;
	margin: 48px 0;
	padding: 28px;
	background: var(--sp-lime);
	color: var(--sp-ink);
	border: var(--sp-border);
	box-shadow: var(--sp-shadow-lg);
}

.app-cta__title {
	margin: 0 0 8px;
	font-family: var(--sp-font-display);
	font-size: 40px;
	line-height: 1;
	text-transform: uppercase;
}

.app-cta__body {
	margin: 0 0 20px;
	font-size: 18px;
}

.app-cta .btn--ink {
	background: var(--sp-ink);
	color: var(--sp-lime);
	box-shadow: none;
}

.app-cta .btn--ink:hover {
	color: var(--sp-lime);
}

/* Prev/next post navigation */
.post-nav {
	max-width: 720px;
	margin: 48px 0;
}

.post-nav .nav-links {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

.post-nav .nav-next {
	grid-column: 2;
	text-align: right;
}

.post-nav a {
	display: block;
	height: 100%;
	padding: 18px;
	border: var(--sp-border-thin);
	box-shadow: var(--sp-shadow-md);
	text-decoration: none;
	background: var(--sp-paper);
}

.post-nav__kicker {
	display: block;
	margin-bottom: 8px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.post-nav__title {
	display: block;
	font-family: var(--sp-font-display);
	font-size: 26px;
	line-height: 1;
	text-transform: uppercase;
}

/* ---------- Comments ---------- */

.comments {
	max-width: 720px;
	margin-top: 48px;
	padding-top: 24px;
	border-top: var(--sp-border);
}

.comments__list {
	padding-left: 0;
	list-style: none;
}

.comments__closed {
	font-family: var(--sp-font-mono);
	text-transform: uppercase;
}

/* ---------- Empty state / 404 ---------- */

.empty-state {
	padding: 32px;
	border: var(--sp-border);
	box-shadow: var(--sp-shadow-md);
	background: var(--sp-white);
}

.empty-state__title {
	font-family: var(--sp-font-display);
	font-size: 48px;
	line-height: 1;
	text-transform: uppercase;
}

.error-404 {
	padding-top: 64px;
	padding-bottom: 80px;
}

.error-404__code {
	margin: 0;
	font-family: var(--sp-font-display);
	font-size: clamp(120px, 22vw, 320px);
	line-height: 0.85;
	color: var(--sp-paper);
	-webkit-text-stroke: 4px var(--sp-ink);
	text-shadow: 10px 10px 0 var(--sp-pink);
}

.error-404__title {
	font-size: clamp(48px, 7vw, 104px);
	line-height: 0.92;
	margin: 16px 0 20px;
}

.error-404__body {
	max-width: 640px;
	font-size: 21px;
}

.error-404__search {
	max-width: 640px;
	margin: 32px 0;
}

.error-404__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin-bottom: 64px;
}

.error-404__recent-title {
	margin-bottom: 32px;
	padding-bottom: 12px;
	border-bottom: var(--sp-border);
}

/* ---------- Footer ---------- */

.site-footer {
	border-top: var(--sp-border);
	font-family: var(--sp-font-mono);
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.footer-widgets {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 32px;
	padding-top: 40px;
	padding-bottom: 40px;
	border-bottom: var(--sp-border-thin);
	text-transform: none;
	letter-spacing: 0;
	font-family: var(--sp-font-body);
	font-size: 16px;
}

.site-footer__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-top: 28px;
	padding-bottom: 28px;
}

.site-footer__credit {
	margin: 0;
	font-weight: 600;
}

.footer-nav__list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.footer-nav__list a {
	font-weight: 600;
	text-decoration: none;
}

.footer-nav__list a:hover {
	text-decoration: underline;
}

/* Social links as offset-shadow stickers. */
.social-links {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.social-links__item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 8px 14px;
	border: 3px solid var(--sp-ink);
	background: var(--sp-paper);
	color: var(--sp-ink);
	box-shadow: 4px 4px 0 var(--sp-ink);
	font-weight: 600;
	text-decoration: none;
	transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.social-links__item:hover {
	background: var(--sp-pink);
	color: var(--sp-ink);
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 var(--sp-ink);
}

/* ---------- Core block alignment helpers ---------- */

.wp-block-button__link {
	background: var(--sp-ink);
	color: var(--sp-paper);
	box-shadow: var(--sp-shadow-sm);
}

.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--sp-ink);
}

/* ---------- Banda de la semana (sidebar) ---------- */

.band-card {
	padding: 28px;
	background: var(--sp-white);
	border: var(--sp-border);
	box-shadow: 8px 8px 0 var(--sp-pink);
}

.band-card__label {
	display: inline-block;
	margin: 0 0 16px;
	padding: 4px 10px;
	background: var(--sp-pink);
	color: var(--sp-ink);
	border: 2px solid var(--sp-ink);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.band-card__image-link {
	display: block;
	margin-bottom: 16px;
}

.band-card__image-link:hover {
	background: transparent;
}

.band-card__image {
	display: block;
	width: 100%;
	height: 220px;
	object-fit: cover;
	object-position: top;
	border: var(--sp-border-thin);
	background: var(--sp-ink);
}

.band-card__name {
	font-size: 44px;
	line-height: 0.98;
	margin: 0 0 8px;
}

.band-card__subtitle {
	margin: 0 0 12px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--sp-magenta);
}

.band-card__excerpt {
	font-size: 17px;
	margin: 0 0 20px;
}

.band-card__player {
	display: block;
	width: 100%;
	height: 152px;
	margin: 0 0 20px;
	border: 0;
	background: var(--sp-ink);
}

/* ---------- Share row (single) ---------- */

.share {
	max-width: 720px;
	margin: 48px 0 0;
	padding-top: 20px;
	border-top: var(--sp-border);
}

.share__title {
	margin: 0 0 16px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	line-height: 1.3;
	letter-spacing: 0.12em;
}

.share__list {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.share__list > [hidden] {
	display: none;
}

/* Same sticker as .social-links__item. */
.share__item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 8px 14px;
	border: 3px solid var(--sp-ink);
	background: var(--sp-paper);
	color: var(--sp-ink);
	box-shadow: 4px 4px 0 var(--sp-ink);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	text-decoration: none;
	cursor: pointer;
	transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.share__item:hover {
	background: var(--sp-pink);
	color: var(--sp-ink);
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 var(--sp-ink);
}

.share__item svg {
	flex: none;
}

.share__item--native {
	background: var(--sp-ink);
	color: var(--sp-paper);
}

.share__fallback {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 16px 0 0;
}

.js .share__fallback {
	display: none;
}

.js .share__fallback.is-visible {
	display: flex;
}

.share__fallback-label {
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.share__url {
	width: 100%;
	padding: 10px 12px;
	background: var(--sp-white);
	color: var(--sp-ink);
	border: var(--sp-border-thin);
	font-family: var(--sp-font-mono);
	font-size: 15px;
}

.share__status {
	min-height: 1.4em;
	margin: 12px 0 0;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* ---------- Event ticket stamp ---------- */

.ticket-stamp {
	position: absolute;
	top: -14px;
	right: -12px;
	z-index: 2;
	transform: rotate(5deg);
	pointer-events: none;
}

/* Perforated ticket: solid outline plus a dashed tear line inside. */
.ticket-stamp__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 10px 14px 8px;
	background: var(--sp-paper);
	color: var(--sp-ink);
	border: var(--sp-border-thin);
	outline: 2px dashed var(--sp-ink);
	outline-offset: -8px;
	box-shadow: var(--sp-shadow-sm);
	line-height: 1;
	text-align: center;
}

.ticket-stamp__day {
	font-family: var(--sp-font-display);
	font-size: 40px;
	line-height: 0.95;
}

.ticket-stamp__month {
	margin-top: 4px;
	padding-top: 4px;
	border-top: 2px dashed var(--sp-ink);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.ticket-stamp__inner--plain {
	padding: 14px 16px;
	font-family: var(--sp-font-display);
	font-size: 22px;
	text-transform: uppercase;
}

/* Same-month range ("03–04"): smaller digits so the stamp keeps its width. */
.ticket-stamp--range .ticket-stamp__day {
	font-size: 28px;
}

/* Cross-month range: two stacked "28 SEP" / "02 OCT" lines. */
.ticket-stamp__line {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 6px;
}

.ticket-stamp--cross .ticket-stamp__day {
	font-size: 24px;
}

.ticket-stamp--cross .ticket-stamp__month {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 12px;
}

.ticket-stamp__to {
	display: block;
	margin: 2px 0;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 12px;
	line-height: 1;
}

.ticket-stamp--large {
	top: -22px;
	right: -16px;
}

.ticket-stamp--large .ticket-stamp__inner {
	padding: 14px 20px 12px;
	outline-offset: -10px;
}

.ticket-stamp--large .ticket-stamp__day {
	font-size: 64px;
}

.ticket-stamp--large .ticket-stamp__month {
	font-size: 16px;
}

.ticket-stamp--large .ticket-stamp__inner--plain {
	padding: 18px 22px;
	font-size: 32px;
}

.ticket-stamp--large.ticket-stamp--range .ticket-stamp__day {
	font-size: 44px;
}

.ticket-stamp--large.ticket-stamp--cross .ticket-stamp__day {
	font-size: 36px;
}

.ticket-stamp--large.ticket-stamp--cross .ticket-stamp__month {
	font-size: 14px;
}

/* ---------- Lightbox ---------- */

.lightbox-trigger {
	cursor: zoom-in;
}

.entry-thumbnail__link {
	position: relative;
	display: block;
}

.lightbox-trigger__hint {
	position: absolute;
	left: 14px;
	bottom: 14px;
	padding: 6px 10px;
	background: var(--sp-ink);
	color: var(--sp-paper);
	border: 2px solid var(--sp-paper);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 13px;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* Content images wrapped by lightbox.js: an invisible button around the image. */
.lightbox-trigger--content {
	display: inline-block;
	max-width: 100%;
	margin: 0;
	padding: 0;
	background: transparent;
	border: 0;
	font: inherit;
	line-height: 0;
	vertical-align: top;
}

.lightbox-trigger--content img {
	display: block;
}

html.has-lightbox,
html.has-lightbox body {
	overflow: hidden;
}

/* The dialog fills the viewport so clicks around the image close it. */
.lightbox {
	width: 100vw;
	height: 100vh;
	max-width: 100vw;
	max-height: 100vh;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--sp-paper);
}

.lightbox::backdrop {
	background: rgba(17, 17, 17, 0.92);
}

.lightbox__figure {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 16px;
}

.lightbox__image {
	display: block;
	max-width: 92vw;
	max-height: 90vh;
	width: auto;
	height: auto;
	object-fit: contain;
	border: var(--sp-border);
	border-color: var(--sp-paper);
	background: var(--sp-ink);
}

.lightbox__caption {
	max-width: 92vw;
	margin-top: 10px;
	color: var(--sp-paper);
	font-family: var(--sp-font-mono);
	font-size: 13px;
	letter-spacing: 0.04em;
	text-align: center;
}

.lightbox__close {
	position: fixed;
	top: 16px;
	right: 16px;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	padding: 0;
	background: var(--sp-paper);
	color: var(--sp-ink);
	border: var(--sp-border-thin);
	box-shadow: 4px 4px 0 var(--sp-pink);
	cursor: pointer;
}

.lightbox__close:focus-visible {
	outline-color: var(--sp-paper);
	box-shadow: 0 0 0 7px var(--sp-pink);
}

/* ---------- Event facts, "¿Cómo llego?" and related posts (single) ---------- */

.event-facts {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	max-width: 720px;
	margin: 0 0 24px;
	background: var(--sp-white);
	border: var(--sp-border-thin);
}

.event-facts--two {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.event-facts__cell {
	min-width: 0;
	padding: 14px 16px;
}

.event-facts--two .event-facts__cell + .event-facts__cell {
	border-left: var(--sp-border-thin);
}

.event-facts__label {
	margin: 0 0 6px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--sp-magenta);
}

.event-facts__value {
	margin: 0;
	font-family: var(--sp-font-display);
	font-size: 26px;
	line-height: 1;
	text-transform: uppercase;
	overflow-wrap: break-word;
}

/* Leads to the app: black card with lime icon square and lime shadow. */
.how-to-get {
	display: flex;
	align-items: center;
	gap: 16px;
	max-width: 720px;
	margin: 0 0 40px;
	padding: 16px 18px;
	background: var(--sp-ink);
	color: var(--sp-paper);
	border: var(--sp-border-thin);
	box-shadow: 6px 6px 0 var(--sp-lime);
	text-decoration: none;
}

.how-to-get:hover {
	background: var(--sp-ink);
	color: var(--sp-paper);
}

.how-to-get:hover .how-to-get__title {
	text-decoration: underline;
}

.how-to-get:focus-visible {
	outline-color: var(--sp-ink);
	box-shadow: 0 0 0 7px var(--sp-lime);
}

.how-to-get__icon {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background: var(--sp-lime);
	color: var(--sp-ink);
}

.how-to-get__icon .icon-pin {
	width: 24px;
	height: 24px;
}

.how-to-get__text {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.how-to-get__title {
	font-family: var(--sp-font-display);
	font-size: 28px;
	line-height: 1;
	text-transform: uppercase;
}

.how-to-get__body {
	font-size: 15px;
}

.how-to-get__arrow {
	flex: none;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 24px;
	color: var(--sp-lime);
}

.related {
	margin: 48px 0;
}

.related__title {
	font-size: 40px;
	margin: 0 0 24px;
	padding-bottom: 10px;
	border-bottom: var(--sp-border);
}

.related__grid {
	gap: 32px 24px;
}

.related .card__image {
	height: 200px;
}

.related .card__title {
	font-size: 26px;
}

/* ---------- SkatePlaces TV (click-to-load YouTube) ---------- */

.yt-card__label,
.sponsor-slot__label {
	margin: 0 0 12px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.yt-card__frame {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 16 / 9;
	background: var(--sp-ink);
	border: var(--sp-border);
}

.yt-card__frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.yt-card__play {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 84px;
	height: 64px;
	padding: 0;
	background: var(--sp-pink);
	color: var(--sp-ink);
	border: var(--sp-border-thin);
	box-shadow: 5px 5px 0 var(--sp-paper);
	cursor: pointer;
	transition: transform 0.08s ease, box-shadow 0.08s ease;
}

.yt-card__play:hover {
	transform: translate(2px, 2px);
	box-shadow: 3px 3px 0 var(--sp-paper);
}

.yt-card__play:focus-visible {
	outline-color: var(--sp-paper);
}

.no-js .yt-card__play {
	display: none;
}

.yt-card__channel {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	margin-top: 8px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* ---------- Sponsor slot ---------- */

.sponsor-slot__label {
	display: inline-block;
	padding: 2px 8px;
	border: 2px solid var(--sp-ink);
	font-size: 12px;
}

.sponsor-slot__stage {
	display: grid;
}

.sponsor-slot__item {
	display: block;
	grid-area: 1 / 1;
}

.sponsor-slot__item:hover {
	background: transparent;
}

.sponsor-slot__item[hidden] {
	display: none;
}

/* Once JS rotates, every item is stacked and only .is-active is visible. */
.sponsor-slot.is-rotating .sponsor-slot__item {
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.5s ease, visibility 0.5s;
}

.sponsor-slot.is-rotating .sponsor-slot__item.is-active {
	opacity: 1;
	visibility: visible;
}

.sponsor-slot__image {
	display: block;
	width: 100%;
	height: auto;
	border: var(--sp-border);
}

.sponsor-slot__dots {
	display: flex;
	gap: 4px;
	margin-top: 8px;
}

.sponsor-slot__dots[hidden] {
	display: none;
}

/* 44px target around a small square dot. */
.sponsor-slot__dot {
	position: relative;
	width: 44px;
	height: 44px;
	padding: 0;
	background: transparent;
	border: 0;
	cursor: pointer;
}

.sponsor-slot__dot::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 14px;
	height: 14px;
	margin: -7px 0 0 -7px;
	background: var(--sp-paper);
	border: 2px solid var(--sp-ink);
}

.sponsor-slot__dot[aria-current="true"]::before {
	background: var(--sp-ink);
}

/* ---------- Search suggestions (combobox) ---------- */

.search-form.has-suggest {
	position: relative;
}

.search-suggest {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	z-index: 60;
	max-height: 70vh;
	margin: 6px 0 0;
	padding: 0;
	overflow-y: auto;
	list-style: none;
	background: var(--sp-white);
	border: var(--sp-border-thin);
	box-shadow: var(--sp-shadow-md);
}

.search-suggest[hidden] {
	display: none;
}

.search-suggest__option {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 44px;
	padding: 8px 12px;
	border-bottom: 2px solid var(--sp-ink);
	cursor: pointer;
}

.search-suggest__option:last-child {
	border-bottom: 0;
}

.search-suggest__option[aria-selected="true"],
.search-suggest__option:hover {
	background: var(--sp-pink);
	color: var(--sp-ink);
}

.search-suggest__thumb {
	flex: none;
	width: 48px;
	height: 48px;
	background: var(--sp-ink);
	border: 2px solid var(--sp-ink);
}

.search-suggest__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top;
}

.search-suggest__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	min-width: 0;
}

.search-suggest__text .cat-pill {
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 11px;
	text-transform: uppercase;
}

.search-suggest__title {
	font-family: var(--sp-font-display);
	font-size: 19px;
	line-height: 1.05;
	text-transform: uppercase;
	overflow-wrap: break-word;
}

.search-suggest__all {
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

/* ---------- Ticker countdown ---------- */

.ticker__countdown {
	flex: 0 1 auto;
	min-width: 0;
	margin: 0;
	font-weight: 600;
}

.ticker__countdown[hidden],
.ticker__countdown-link[hidden] {
	display: none;
}

.ticker__countdown-link {
	text-decoration: none;
}

.ticker__countdown-link:hover {
	background: var(--sp-ink);
	color: var(--sp-paper);
}

.ticker__countdown-when {
	padding: 2px 6px;
	background: var(--sp-ink);
	color: var(--sp-paper);
}

/* ---------- Band ficha (collectible card on band posts) ---------- */

.band-ficha {
	max-width: 520px;
	margin: 0 0 40px;
	background: var(--sp-white);
	border: var(--sp-border);
	box-shadow: 8px 8px 0 var(--sp-pink);
	transform: rotate(-1deg);
}

.band-ficha__strip {
	margin: 0;
	padding: 8px 14px;
	background: var(--sp-ink);
	color: var(--sp-paper);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

.band-ficha__body {
	padding: 20px;
	border: 2px dashed var(--sp-ink);
	margin: 8px;
}

.band-ficha__name {
	font-size: 48px;
	line-height: 0.95;
	margin: 0 0 16px;
}

.band-ficha__facts {
	margin: 0 0 20px;
	border-top: 2px solid var(--sp-ink);
}

.band-ficha__fact {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	gap: 12px;
	padding: 8px 0;
	border-bottom: 2px solid var(--sp-ink);
}

.band-ficha__fact dt {
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 12px;
	line-height: 1.6;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--sp-magenta);
}

.band-ficha__fact dd {
	margin: 0;
	font-weight: 500;
	overflow-wrap: break-word;
}

.band-ficha__links {
	margin-bottom: 20px;
}

.band-ficha__player {
	display: block;
	width: 100%;
	height: 152px;
	border: 0;
	background: var(--sp-ink);
}

/* ---------- Band directory (/bandas/) ---------- */

.band-dir {
	padding-top: 40px;
	padding-bottom: 72px;
}

.band-dir__content {
	margin-bottom: 32px;
}

.band-dir__filters {
	display: grid;
	gap: 20px;
	margin-bottom: 24px;
	padding: 20px;
	background: var(--sp-white);
	border: var(--sp-border-thin);
	box-shadow: var(--sp-shadow-md);
}

.no-js .band-dir__filters {
	display: none;
}

.band-dir__search {
	display: flex;
	flex-direction: column;
	max-width: 480px;
	margin: 0;
}

.band-dir__input {
	padding: 12px 14px;
	background: var(--sp-white);
	color: var(--sp-ink);
	border: var(--sp-border-thin);
	font-family: var(--sp-font-body);
	font-size: 17px;
}

.band-dir__facet-label {
	margin: 0 0 8px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.band-dir__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.band-dir__chip {
	min-height: 44px;
	padding: 6px 14px;
	background: var(--sp-paper);
	color: var(--sp-ink);
	border: var(--sp-border-thin);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	cursor: pointer;
}

.band-dir__chip:hover {
	background: var(--sp-pink);
}

.band-dir__chip[aria-pressed="true"] {
	background: var(--sp-ink);
	color: var(--sp-paper);
	box-shadow: 3px 3px 0 var(--sp-pink);
}

.band-dir__count {
	margin: 0 0 24px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.band-dir__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 40px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.band-dir__item[hidden] {
	display: none;
}

.band-dir__card {
	min-width: 0;
}

.band-dir__image-link {
	display: block;
	margin-bottom: 12px;
}

.band-dir__image-link:hover {
	background: transparent;
}

.band-dir__image {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: top;
	border: var(--sp-border-thin);
	background: var(--sp-ink);
}

.band-dir__name {
	font-size: 28px;
	line-height: 1;
	margin: 0 0 8px;
}

.band-dir__name a {
	text-decoration: none;
}

.band-dir__genre,
.band-dir__city {
	margin: 0 0 6px;
}

.genre-pill {
	display: inline-block;
	padding: 3px 8px;
	background: var(--sp-white);
	color: var(--sp-ink);
	border: 2px solid var(--sp-ink);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.band-dir__city {
	font-family: var(--sp-font-mono);
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.band-dir__empty {
	font-family: var(--sp-font-mono);
	font-weight: 600;
	text-transform: uppercase;
}

/* ---------- Team page (staff ID badges) ---------- */

.team {
	padding-top: 56px;
	padding-bottom: 72px;
}

.team__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 64px 48px;
	max-width: 980px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.team-badge {
	position: relative;
	min-width: 0;
	transform: rotate(-2deg);
}

.team-badge:nth-child(even) {
	transform: rotate(2deg);
}

/* Two strips of tape holding the badge to the page. */
.team-badge::before,
.team-badge::after {
	content: "";
	position: absolute;
	top: -16px;
	z-index: 1;
	width: 96px;
	height: 28px;
	background: rgba(242, 238, 228, 0.85);
	border: 1px solid rgba(17, 17, 17, 0.25);
}

.team-badge::before {
	left: 18%;
	transform: rotate(-6deg);
}

.team-badge::after {
	right: 18%;
	transform: rotate(5deg);
}

.team-badge__card {
	background: var(--sp-white);
	border: var(--sp-border);
	box-shadow: var(--sp-shadow-lg);
}

.team-badge__strip {
	margin: 0;
	padding: 10px 16px;
	background: var(--sp-ink);
	color: var(--sp-paper);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.16em;
}

.team-badge__photo {
	display: block;
	width: calc(100% - 40px);
	height: auto;
	aspect-ratio: 4 / 5;
	margin: 20px 20px 0;
	object-fit: cover;
	object-position: top;
	border: var(--sp-border-thin);
	background: var(--sp-ink);
}

.team-badge__body {
	padding: 16px 20px 22px;
}

.team-badge__name {
	font-size: 44px;
	line-height: 0.95;
	margin: 0 0 8px;
}

.team-badge__role {
	margin: 0 0 12px;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--sp-magenta);
}

.team-badge__extra {
	font-size: 17px;
}

.team-badge__links {
	margin-top: 16px;
}

/* Generic fallback: taped photos, Anton headings (already global). */
.team-generic {
	max-width: 720px;
	margin-top: 56px;
}

.team-generic .wp-block-image {
	position: relative;
	transform: rotate(-1.5deg);
}

.team-generic .wp-block-image img {
	border: var(--sp-border-thin);
	box-shadow: var(--sp-shadow-md);
}

.team-generic .wp-block-image::before {
	content: "";
	position: absolute;
	top: -12px;
	left: 50%;
	z-index: 1;
	width: 96px;
	height: 26px;
	margin-left: -48px;
	background: rgba(242, 238, 228, 0.85);
	border: 1px solid rgba(17, 17, 17, 0.25);
	transform: rotate(-4deg);
}

/* ---------- Story viewer (mobile home) ---------- */

.story-viewer {
	width: 100vw;
	height: 100vh;
	height: 100dvh;
	max-width: 100vw;
	max-height: 100vh;
	max-height: 100dvh;
	margin: 0;
	padding: 10px 12px calc(12px + env(safe-area-inset-bottom));
	border: 0;
	background: var(--sp-ink);
	color: var(--sp-paper);
}

.story-viewer[open] {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.story-viewer::backdrop {
	background: var(--sp-ink);
}

.story-viewer__bars {
	display: flex;
	gap: 4px;
}

.story-viewer__bar {
	flex: 1 1 0;
	height: 4px;
	background: rgba(242, 238, 228, 0.35);
}

.story-viewer__fill {
	display: block;
	height: 100%;
	background: var(--sp-paper);
	transform: scaleX(0);
	transform-origin: 0 50%;
}

.story-viewer__head {
	display: flex;
	align-items: center;
	gap: 10px;
}

.story-viewer__avatar {
	flex: none;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	overflow: hidden;
	border: 2px solid var(--sp-ink);
	box-shadow: 0 0 0 3px var(--story-ring, var(--sp-paper));
}

.story-viewer__avatar img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.story-viewer__meta {
	flex: 1 1 auto;
	min-width: 0;
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.story-viewer__pos {
	opacity: 0.8;
}

.story-viewer__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	background: transparent;
	color: var(--sp-paper);
	border: 2px solid var(--sp-paper);
	cursor: pointer;
}

.story-viewer__btn[hidden] {
	display: none;
}

.story-viewer :focus-visible {
	outline-color: var(--sp-paper);
	box-shadow: 0 0 0 6px var(--sp-pink);
}

.story-viewer__stage {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
	border: var(--sp-border-thin);
	border-color: var(--sp-paper);
}

.story-viewer__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.story-viewer__image.is-flyer {
	object-position: top;
}

.story-viewer__stamp {
	top: 12px;
	right: 12px;
}

.story-viewer__stamp[hidden] {
	display: none;
}

.story-viewer__tap {
	position: absolute;
	top: 0;
	bottom: 0;
	z-index: 2;
	padding: 0;
	background: transparent;
	border: 0;
	cursor: pointer;
}

.story-viewer__tap--prev {
	left: 0;
	width: 33.33%;
}

.story-viewer__tap--next {
	right: 0;
	width: 66.67%;
}

.story-viewer__caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	padding: 12px 14px 14px;
	background: var(--sp-ink);
	color: var(--sp-paper);
	pointer-events: none;
}

.story-viewer__pill {
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 11px;
	text-transform: uppercase;
}

.story-viewer__pill[hidden] {
	display: none;
}

.story-viewer__title {
	margin: 8px 0 0;
	font-family: var(--sp-font-display);
	font-size: 28px;
	line-height: 1;
	text-transform: uppercase;
}

.story-viewer__actions {
	display: flex;
	gap: 10px;
}

.story-viewer__read,
.story-viewer__wa,
.story-viewer__map {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	border: var(--sp-border-thin);
	text-decoration: none;
}

.story-viewer__read {
	flex: 1 1 auto;
	padding: 0 14px;
	background: var(--sp-paper);
	color: var(--sp-ink);
	font-family: var(--sp-font-mono);
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.story-viewer__wa {
	width: 48px;
	background: var(--sp-ink);
	color: var(--sp-paper);
	border-color: var(--sp-paper);
}

.story-viewer__wa[hidden] {
	display: none;
}

.story-viewer__map {
	width: 48px;
	background: var(--sp-lime);
	color: var(--sp-ink);
}

.story-viewer__read:hover,
.story-viewer__wa:hover,
.story-viewer__map:hover {
	text-decoration: underline;
}

.story-viewer__read:hover {
	background: var(--sp-paper);
	color: var(--sp-ink);
}

.story-viewer__wa:hover {
	background: var(--sp-ink);
	color: var(--sp-paper);
}

.story-viewer__map:hover {
	background: var(--sp-lime);
	color: var(--sp-ink);
}

.story-viewer--eventos {
	--story-ring: var(--sp-cat-cyan);
}

.story-viewer--bandas {
	--story-ring: var(--sp-cat-pink);
}

.story-viewer--skate {
	--story-ring: var(--sp-cat-orange);
}

.story-viewer--tiendas {
	--story-ring: #D9D3C4;
}

/* Mobile-only pieces start hidden; the 640px block reveals them. */
.search-toggle,
.header-search,
.cat-chips,
.bottom-nav,
.share-bar,
.read-progress,
.home-inline,
.stories {
	display: none;
}

/* ---------- Tablet ---------- */

@media (max-width: 1100px) {
	:root {
		--sp-gutter: 32px;
	}

	.hero__grid {
		gap: 36px;
	}

	.hero__image {
		height: 460px;
	}

	.card-grid--three,
	.band-dir__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 960px) {
	.hero__media,
	.hero__text,
	.layout__main,
	.sidebar {
		grid-column: 1 / -1;
	}

	.hero__image {
		height: 440px;
	}

	/* A 12-track grid keeps its 11 gaps even when every child spans all of it,
	   which alone is wider than a phone. Collapse to one track instead. */
	.hero,
	.layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.layout {
		gap: 56px;
	}

	/* Collapsible nav (only when JS is available; without JS the menu stays visible). */
	.site-header__inner {
		flex-wrap: wrap;
	}

	.site-header__actions {
		gap: 12px;
	}

	.js .nav-toggle {
		display: inline-flex;
	}

	.primary-nav {
		order: 3;
		flex-basis: 100%;
	}

	.js .primary-nav {
		display: none;
	}

	.js .primary-nav.is-open {
		display: block;
		padding-top: 8px;
		border-top: var(--sp-border-thin);
	}

	.primary-nav__list {
		flex-wrap: wrap;
		gap: 4px 20px;
	}

	.js .primary-nav__list {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.js .primary-nav__list a {
		display: block;
		padding: 14px 0;
		border-bottom: 2px solid var(--sp-ink);
	}

	.js .primary-nav__list .sub-menu {
		display: block;
		position: static;
		border: 0;
		box-shadow: none;
		padding: 0 0 0 16px;
		background: transparent;
	}
}

/* ---------- Phone ---------- */

@media (max-width: 640px) {
	:root {
		--sp-gutter: 16px;
		--sp-shadow-lg: 6px 6px 0 var(--sp-ink);
	}

	body {
		font-size: 17px;
	}

	.site-header__inner {
		min-height: 0;
		padding-top: 14px;
		padding-bottom: 14px;
		gap: 12px;
	}

	.custom-logo {
		height: 40px;
		max-width: 150px;
	}

	.site-title {
		font-size: 30px;
	}

	.btn-map {
		padding: 10px 12px;
		font-size: 14px;
	}

	.nav-toggle__label {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(1px, 1px, 1px, 1px);
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.ticker {
		font-size: 13px;
	}

	/* Ticker: one line, the app pill stays out (the bottom nav has the map). */
	.ticker__inner {
		padding-top: 8px;
		padding-bottom: 8px;
	}

	.ticker__text {
		display: block;
		min-width: 0;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.ticker__sep {
		margin: 0 8px;
	}

	.ticker__pill {
		display: none;
	}

	.hero {
		padding: 36px 0 48px;
	}

	.hero__grid {
		gap: 28px;
	}

	.hero__image {
		height: 380px;
		border-width: 3px;
		box-shadow: 6px 6px 0 var(--sp-ink);
	}

	.sticker {
		top: -14px;
		left: -6px;
		font-size: 22px;
		padding: 8px 12px;
	}

	.hero__title,
	.hero__title.is-long,
	.hero__title.is-very-long {
		font-size: 44px;
	}

	.hero__excerpt {
		font-size: 18px;
	}

	.layout {
		padding-top: 36px;
		padding-bottom: 48px;
		gap: 48px;
	}

	.section-header__title {
		font-size: 40px;
	}

	.card-grid,
	.card-grid--three {
		grid-template-columns: minmax(0, 1fr);
		gap: 40px;
	}

	.card__image {
		height: 240px;
	}

	.card__title {
		font-size: 30px;
	}

	.map-card {
		padding: 24px 20px;
		box-shadow: 6px 6px 0 var(--sp-lime);
	}

	.map-card__title {
		font-size: 36px;
	}

	.band-card {
		padding: 22px 18px;
		box-shadow: 6px 6px 0 var(--sp-pink);
	}

	.band-card__name {
		font-size: 36px;
	}

	.ticket-stamp {
		right: -4px;
	}

	.ticket-stamp--large {
		top: -16px;
		right: -6px;
	}

	.ticket-stamp--large .ticket-stamp__inner--plain {
		font-size: 24px;
	}

	.page-header,
	.entry-header {
		padding: 36px 0 28px;
	}

	.page-header__title,
	.entry-title,
	.entry-title.is-long,
	.entry-title.is-very-long {
		font-size: clamp(36px, 11vw, 52px);
	}

	.entry-content {
		font-size: 18px;
	}

	.entry-content h2 {
		font-size: 36px;
	}

	.entry-content h3 {
		font-size: 28px;
	}

	.entry-content blockquote,
	.entry-content .wp-block-quote {
		padding: 18px;
		font-size: 19px;
	}

	.entry-content .alignleft,
	.entry-content .alignright {
		float: none;
		margin: 0 0 16px;
	}

	.search-form__row {
		flex-direction: column;
	}

	.post-nav .nav-links {
		grid-template-columns: minmax(0, 1fr);
	}

	.post-nav .nav-next {
		grid-column: 1;
	}

	.app-cta__title {
		font-size: 32px;
	}

	.site-footer__bar {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* ---------- Mobile layout (approved mockup, <= 640px) ---------- */

@media (max-width: 640px) {
	body.has-bottom-nav {
		padding-bottom: calc(76px + env(safe-area-inset-bottom));
	}

	body.has-share-bar {
		padding-bottom: calc(72px + env(safe-area-inset-bottom));
	}

	/* Compact header: logo left, search button right. */
	.btn-map,
	.has-bottom-nav .nav-toggle {
		display: none;
	}

	.js .has-bottom-nav .nav-toggle {
		display: none;
	}

	.search-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		padding: 0;
		background: var(--sp-paper);
		color: var(--sp-ink);
		border: var(--sp-border-thin);
		cursor: pointer;
	}

	.no-js .search-toggle {
		display: none;
	}

	.search-toggle[aria-expanded="true"] {
		background: var(--sp-ink);
		color: var(--sp-paper);
	}

	.header-search {
		display: block;
		padding-bottom: 16px;
	}

	.js .header-search:not(.is-open) {
		display: none;
	}

	/* Menu as a bottom sheet above the bottom nav. */
	.js .has-bottom-nav .primary-nav.is-open {
		position: fixed;
		left: 0;
		right: 0;
		bottom: calc(60px + env(safe-area-inset-bottom));
		z-index: 94;
		max-height: 70vh;
		overflow-y: auto;
		padding: 8px 16px 16px;
		background: var(--sp-paper);
		border-top: var(--sp-border);
		box-shadow: 0 -8px 0 var(--sp-pink);
	}

	/* Category chips row under the ticker. */
	.cat-chips {
		display: block;
		border-bottom: var(--sp-border-thin);
	}

	.cat-chips__list {
		display: flex;
		gap: 8px;
		margin: 0;
		padding: 10px 16px;
		list-style: none;
		overflow-x: auto;
		scroll-snap-type: x proximity;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	.cat-chips__list::-webkit-scrollbar {
		display: none;
	}

	.cat-chips__list > li {
		flex: none;
		scroll-snap-align: start;
	}

	.cat-chips__item {
		display: inline-flex;
		align-items: center;
		min-height: 40px;
		padding: 0 14px;
		font-family: var(--sp-font-mono);
		font-weight: 600;
		font-size: 13px;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		text-decoration: none;
	}

	.cat-chips__item[aria-current="page"] {
		box-shadow: 3px 3px 0 var(--sp-ink);
		text-decoration: underline;
	}

	/* Bottom navigation. */
	.bottom-nav {
		display: block;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 95;
		padding-bottom: env(safe-area-inset-bottom);
		background: var(--sp-ink);
		color: var(--sp-paper);
	}

	.bottom-nav__list {
		display: grid;
		grid-auto-columns: minmax(0, 1fr);
		grid-auto-flow: column;
		align-items: end;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.bottom-nav__item {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 5px;
		width: 100%;
		min-height: 60px;
		padding: 8px 2px;
		background: transparent;
		color: var(--sp-paper);
		border: 0;
		font-family: var(--sp-font-mono);
		font-weight: 600;
		font-size: 10px;
		line-height: 1;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		text-decoration: none;
		cursor: pointer;
	}

	.bottom-nav__item:hover {
		background: transparent;
		color: var(--sp-paper);
		text-decoration: underline;
	}

	.bottom-nav__item[aria-current="page"],
	.bottom-nav__item[aria-expanded="true"] {
		box-shadow: inset 0 4px 0 var(--sp-pink);
	}

	.bottom-nav__item:focus-visible {
		outline: 3px solid var(--sp-paper);
		outline-offset: -3px;
		box-shadow: none;
	}

	.bottom-nav__item--map,
	.bottom-nav__item--map:hover {
		padding-top: 0;
		color: var(--sp-lime);
	}

	.bottom-nav__map-icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 62px;
		height: 62px;
		margin-top: -24px;
		background: var(--sp-lime);
		color: var(--sp-ink);
		border: var(--sp-border-thin);
	}

	.bottom-nav__map-icon .icon-pin {
		width: 28px;
		height: 28px;
	}

	/* "Lo último" / "Sigue leyendo": compact rows instead of big cards. */
	.card-grid--compact-mobile,
	.related__grid {
		gap: 0;
		border-top: 2px solid var(--sp-ink);
	}

	.card-grid--compact-mobile .card {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		align-items: start;
		padding: 14px 0;
		border-bottom: 2px solid var(--sp-ink);
	}

	.card-grid--compact-mobile .card.has-post-thumbnail {
		grid-template-columns: 96px minmax(0, 1fr);
		column-gap: 14px;
	}

	.card-grid--compact-mobile .card__media {
		grid-row: 1 / span 2;
		margin: 0;
	}

	.card-grid--compact-mobile .has-post-thumbnail .card__label,
	.card-grid--compact-mobile .has-post-thumbnail .card__title {
		grid-column: 2;
	}

	.card-grid--compact-mobile .card__label {
		margin: 0 0 6px;
	}

	.card-grid--compact-mobile .card__image,
	.related .card-grid--compact-mobile .card__image {
		width: 96px;
		height: 96px;
		border-width: 2px;
		object-position: top;
	}

	.card-grid--compact-mobile .card__image-link:hover .card__image,
	.card-grid--compact-mobile .card:focus-within .card__image {
		box-shadow: none;
		transform: none;
	}

	.card-grid--compact-mobile .card__title,
	.related .card-grid--compact-mobile .card__title {
		font-size: 22px;
		line-height: 1.05;
	}

	/* Mini stamp ("03 OCT", dashed) over the thumb corner. */
	.card-grid--compact-mobile .ticket-stamp {
		top: -6px;
		left: -6px;
		right: auto;
		transform: rotate(-4deg);
	}

	.card-grid--compact-mobile .ticket-stamp__inner {
		flex-direction: row;
		align-items: baseline;
		gap: 3px;
		padding: 2px 5px;
		border: 2px dashed var(--sp-ink);
		outline: 0;
		box-shadow: none;
	}

	.card-grid--compact-mobile .ticket-stamp__day {
		font-size: 15px;
	}

	.card-grid--compact-mobile .ticket-stamp__month {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 9px;
	}

	.card-grid--compact-mobile .ticket-stamp--cross .ticket-stamp__inner {
		flex-direction: column;
		align-items: center;
		gap: 0;
	}

	.card-grid--compact-mobile .ticket-stamp__to {
		margin: 0;
		font-size: 8px;
	}

	.card-grid--compact-mobile .ticket-stamp__inner--plain {
		padding: 3px 5px;
		font-size: 11px;
	}

	/* Home: sidebar cards repeated inline; hide the sidebar copies. */
	.home-inline {
		display: flex;
		flex-direction: column;
		gap: 40px;
		margin-top: 48px;
	}

	.home-inline:not(:has(> *)) {
		display: none;
	}

	.layout:has(.home-inline .band-card) .sidebar .band-card,
	.layout:has(.home-inline .yt-card) .sidebar .yt-card,
	.layout:has(.home-inline .sponsor-slot) .sidebar .sponsor-slot {
		display: none;
	}

	/* Single: progress bar, full-bleed image, share bar. */
	.read-progress {
		display: block;
		position: sticky;
		top: 0;
		z-index: 80;
		height: 5px;
		background: var(--sp-paper-dark);
	}

	.read-progress__bar {
		display: block;
		height: 100%;
		background: var(--sp-pink);
		transform: scaleX(0);
		transform-origin: 0 50%;
	}

	.single-entry .entry-thumbnail {
		margin: 0 calc(-1 * var(--sp-gutter)) 28px;
	}

	.single-entry .entry-thumbnail__image {
		height: 470px;
		max-height: none;
		border-left: 0;
		border-right: 0;
		box-shadow: none;
	}

	.single-entry .entry-thumbnail figcaption {
		padding: 0 var(--sp-gutter);
	}

	.entry-thumbnail .ticket-stamp--large {
		top: 12px;
		right: 12px;
	}

	.event-facts__value {
		font-size: 22px;
	}

	.how-to-get__title {
		font-size: 24px;
	}

	.related__title {
		font-size: 32px;
	}

	/* Stories row (home): 70px circles with a category-colored ring. */
	.stories {
		display: block;
		border-bottom: var(--sp-border-thin);
	}

	.no-js .stories {
		display: none;
	}

	.stories__list {
		display: flex;
		gap: 14px;
		margin: 0;
		padding: 14px 16px 10px;
		list-style: none;
		overflow-x: auto;
		scroll-snap-type: x proximity;
		scrollbar-width: none;
	}

	.stories__list::-webkit-scrollbar {
		display: none;
	}

	.stories__cell {
		flex: none;
		scroll-snap-align: start;
	}

	.stories__circle {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 8px;
		width: 82px;
		padding: 6px 0 0;
		background: transparent;
		color: var(--sp-ink);
		border: 0;
		text-decoration: none;
		cursor: pointer;
	}

	.stories__circle:hover {
		background: transparent;
		color: var(--sp-ink);
	}

	.stories__ring {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 70px;
		height: 70px;
		border-radius: 50%;
		overflow: hidden;
		background: var(--sp-ink);
		border: 2px solid var(--sp-ink);
		box-shadow: 0 0 0 4px var(--story-ring, var(--sp-paper-dark));
	}

	.stories__ring img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: top;
	}

	.stories__ring--icon {
		color: var(--sp-lime);
	}

	.stories__ring--icon .icon-pin {
		width: 30px;
		height: 30px;
	}

	.stories__circle--eventos {
		--story-ring: var(--sp-cat-cyan);
	}

	.stories__circle--bandas {
		--story-ring: var(--sp-cat-pink);
	}

	.stories__circle--spots {
		--story-ring: var(--sp-lime);
	}

	.stories__circle--skate {
		--story-ring: var(--sp-cat-orange);
	}

	.stories__circle--tiendas {
		--story-ring: #D9D3C4;
	}

	.stories__circle.is-seen {
		--story-ring: #A8A294;
	}

	.stories__count {
		position: absolute;
		top: 0;
		right: 0;
		min-width: 24px;
		padding: 3px 6px;
		background: var(--sp-ink);
		color: var(--sp-paper);
		border: 2px solid var(--sp-paper);
		border-radius: 999px;
		font-family: var(--sp-font-mono);
		font-weight: 600;
		font-size: 11px;
		line-height: 1;
	}

	.stories__label {
		font-family: var(--sp-font-mono);
		font-weight: 600;
		font-size: 11px;
		text-transform: uppercase;
		letter-spacing: 0.06em;
	}

	/* Team: one badge per row. */
	.team__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 56px;
	}

	.team-badge__name {
		font-size: 36px;
	}

	/* Ticker: the countdown replaces the static text. */
	.ticker.has-countdown .ticker__text {
		display: none;
	}

	.ticker__countdown {
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.band-ficha {
		transform: none;
		box-shadow: 6px 6px 0 var(--sp-pink);
	}

	.band-ficha__name {
		font-size: 38px;
	}

	/* Directory: compact rows. */
	.band-dir__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
		border-top: 2px solid var(--sp-ink);
	}

	.band-dir__card {
		display: grid;
		grid-template-columns: 80px minmax(0, 1fr);
		gap: 14px;
		align-items: center;
		padding: 12px 0;
		border-bottom: 2px solid var(--sp-ink);
	}

	.band-dir__image-link {
		margin: 0;
	}

	.band-dir__image {
		border-width: 2px;
	}

	.band-dir__name {
		font-size: 22px;
	}

	/* The sticky share bar replaces the share row on phones. */
	.share {
		display: none;
	}

	.share-bar {
		display: flex;
		gap: 10px;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 95;
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
		background: var(--sp-paper);
		border-top: var(--sp-border-thin);
	}

	.share-bar__whatsapp {
		display: inline-flex;
		flex: 1 1 auto;
		align-items: center;
		justify-content: center;
		gap: 10px;
		min-width: 0;
		min-height: 48px;
		padding: 0 12px;
		background: var(--sp-ink);
		color: var(--sp-paper);
		border: var(--sp-border-thin);
		font-family: var(--sp-font-mono);
		font-weight: 600;
		font-size: 13px;
		line-height: 1.1;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		text-decoration: none;
	}

	.share-bar__whatsapp:hover {
		background: var(--sp-ink);
		color: var(--sp-paper);
		text-decoration: underline;
	}

	.share-bar__native,
	.share-bar__map {
		display: inline-flex;
		flex: none;
		align-items: center;
		justify-content: center;
		width: 48px;
		height: 48px;
		padding: 0;
		border: var(--sp-border-thin);
		cursor: pointer;
	}

	.share-bar__native,
	.share-bar__native:hover {
		background: var(--sp-paper);
		color: var(--sp-ink);
	}

	.share-bar__native[hidden] {
		display: none;
	}

	.share-bar__map,
	.share-bar__map:hover {
		background: var(--sp-lime);
		color: var(--sp-ink);
	}

	.share-bar__map .icon-pin {
		width: 22px;
		height: 22px;
	}

	.ticket-stamp--large .ticket-stamp__day {
		font-size: 44px;
	}

	.ticket-stamp--large.ticket-stamp--range .ticket-stamp__day {
		font-size: 32px;
	}

	.ticket-stamp--large.ticket-stamp--cross .ticket-stamp__day {
		font-size: 28px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sponsor-slot.is-rotating .sponsor-slot__item {
		transition: none;
	}

	*,
	*::before,
	*::after {
		transition: none !important;
	}
}