/*
 * Superpulga City Theme — main styles. Mobile first.
 * Colors come from SP-Settings → City Theme (printed right after this file).
 * Class prefix: spc-  (keeps clear of AWPCP, Algolia and W3.CSS classes).
 */

:root {
	--spc-primary: #0E2A47;
	--spc-primary-deep: #09192c;
	--spc-primary-soft: #e7eaed;
	--spc-accent: #F28C28;
	--spc-accent-ink: #1a1206;
	--spc-ink: #15212d;
	--spc-muted: #56657a;
	--spc-line: #d7dfe7;
	--spc-paper: #f1f4f7;
	--spc-card: #ffffff;
	--spc-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
	--spc-header-h: 56px;
	--spc-tabbar-h: 60px;
	--spc-gutter: clamp(12px, 3.6vw, 28px);
	--spc-max: 1240px;
	--spc-r: 10px;
	--spc-r-s: 6px;
}

/* ---------- Base ---------- */

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

/* :root raises specificity so W3.CSS, which SP Estilos loads later on the
   front page, can't shrink the whole theme to 15px. */
html:root {
	font-size: 100%;
}

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-padding-top: calc(var(--spc-header-h) + 12px);
}

body.spc {
	margin: 0;
	font-family: var(--spc-font);
	font-size: 1rem;
	line-height: 1.55;
	color: var(--spc-ink);
	background: var(--spc-paper);
	-webkit-font-smoothing: antialiased;
}

.spc img,
.spc video,
.spc iframe {
	max-width: 100%;
}

.spc img {
	height: auto;
}

/* Weighs like a plain "a" rule, so plugin classes (AWPCP, SP Estilos) and the
   GeneratePress-style link color on classified pages can override it. */
:where(.spc) a {
	color: var(--spc-primary);
	text-underline-offset: 0.15em;
}

.spc :focus-visible {
	outline: 3px solid var(--spc-focus, var(--spc-primary));
	outline-offset: 2px;
}

.spc-main:focus {
	outline: none;
}

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

.spc-skip {
	position: absolute;
	left: 8px;
	top: -80px;
	z-index: 1000;
	padding: 10px 16px;
	border-radius: var(--spc-r-s);
	background: #fff;
	color: var(--spc-primary);
	font-weight: 700;
}

.spc-skip:focus {
	top: 8px;
}

.spc-wrap {
	width: 100%;
	max-width: var(--spc-max);
	margin-inline: auto;
	padding-inline: var(--spc-gutter);
}

.spc-icon {
	flex: none;
	width: 24px;
	height: 24px;
}

/* ---------- The price tag (Publicar) ---------- */
/* The shape is drawn on ::after so the focus outline isn't clipped. */

.spc .spc-tag {
	--spc-notch: 13px;
	position: relative;
	isolation: isolate;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4em;
	min-height: 44px;
	padding: 0.5em 1.1em 0.5em calc(var(--spc-notch) + 1em);
	color: var(--spc-accent-ink);
	font: inherit;
	font-size: 0.9375rem;
	font-weight: 800;
	line-height: 1.1;
	text-decoration: none;
	white-space: nowrap;
}

.spc-tag::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--spc-accent);
	border-radius: 0 var(--spc-r-s) var(--spc-r-s) 0;
	clip-path: polygon(var(--spc-notch) 0, 100% 0, 100% 100%, var(--spc-notch) 100%, 0 50%);
}

/* The punched hole shows whatever the tag sits on. */
.spc-tag::before {
	content: "";
	position: absolute;
	left: calc(var(--spc-notch) - 2px);
	top: 50%;
	width: 7px;
	height: 7px;
	margin-top: -3.5px;
	border-radius: 50%;
	background: var(--spc-tag-hole, var(--spc-primary));
}

.spc-tag:hover::after {
	filter: brightness(1.07);
}

.spc-tag:active {
	transform: translateY(1px);
}

.spc .spc-tag--block {
	display: flex;
	width: 100%;
}

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

.spc .spc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	min-height: 44px;
	padding: 0.55em 1.1em;
	border: 2px solid var(--spc-primary);
	border-radius: var(--spc-r-s);
	background: var(--spc-primary);
	color: #fff;
	font: inherit;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
}

.spc .spc-btn--ghost {
	background: transparent;
	color: var(--spc-primary);
}

.spc .spc-iconbtn {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: var(--spc-r-s);
	background: transparent;
	color: inherit;
	cursor: pointer;
	text-decoration: none;
}

.spc-iconbtn:hover {
	background: rgba(255, 255, 255, 0.12);
}

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

.spc-header {
	--spc-focus: var(--spc-accent);
	--spc-tag-hole: var(--spc-primary);
	position: sticky;
	top: 0;
	z-index: 60;
	background: var(--spc-primary);
	color: #fff;
}

.admin-bar .spc-header {
	top: 46px;
}

@media (min-width: 783px) {
	.admin-bar .spc-header {
		top: 32px;
	}
}

@media (max-width: 600px) {
	.admin-bar .spc-header {
		top: 0;
	}
}

.spc-header__bar {
	display: flex;
	align-items: center;
	gap: 6px;
	min-height: var(--spc-header-h);
}

.spc .spc-brand {
	display: flex;
	flex: none;
	align-items: center;
	min-height: 44px;
	color: #fff;
	text-decoration: none;
}

.spc-brand__img {
	display: block;
	width: auto;
	max-height: 34px;
}

/* Logo with a white background (Super Pulga's JPG) on a rounded white badge */
.spc .spc-brand--badge {
	min-height: 0;
	padding: 3px 9px;
	border-radius: 9px;
	background: #fff;
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06), 0 8px 18px -10px rgba(0, 0, 0, 0.55);
}

.spc-brand--badge .spc-brand__img {
	max-height: 34px;
}

/* Colored line under the header (superpulga.com: red, .45rem) */
.spc-header--stripe {
	border-bottom: 7px solid var(--spc-stripe, #E03A2F);
}

/* Small phones: room for "San Antonio" or "Fort Worth" next to the logo */
@media (max-width: 419px) {
	.spc .spc-brand--badge {
		padding: 3px 7px;
	}

	.spc-brand .spc-brand__img {
		max-height: 30px;
	}

	.spc-brand + .spc-citybtn .spc-icon:first-child {
		display: none;
	}

	.spc-brand + .spc-citybtn {
		padding-left: 10px;
	}
}

@media (max-width: 374px) {
	.spc-brand + .spc-citybtn .spc-icon {
		display: none;
	}

	.spc-brand + .spc-citybtn {
		padding-inline: 10px;
		font-size: 0.8125rem;
	}
}

.spc-wordmark {
	font-size: 1.3125rem;
	font-weight: 900;
	letter-spacing: -0.04em;
	line-height: 1;
}

.spc .spc-citybtn {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	min-width: 0;
	min-height: 36px;
	margin-left: 4px;
	padding: 4px 8px 4px 6px;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 999px;
	background: transparent;
	color: #fff;
	font: inherit;
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
}

.spc-citybtn .spc-icon {
	width: 16px;
	height: 16px;
}

.spc-citybtn .spc-icon--chevron {
	transition: transform 0.15s ease;
}

.spc-citybtn[aria-expanded="true"] .spc-icon--chevron {
	transform: rotate(180deg);
}

.spc-citybtn__name {
	overflow: hidden;
	max-width: 8.5em;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.spc-header__actions {
	display: flex;
	align-items: center;
	gap: 2px;
	margin-left: auto;
}

.spc .spc-header__cta {
	display: none;
	margin-right: 6px;
}

.spc-header__cta-long {
	display: none;
}

/* No tab bar: the header keeps a short Publicar on phones. */
.spc:not(.spc-has-tabbar) .spc-header__cta {
	display: inline-flex;
	--spc-notch: 11px;
	min-height: 38px;
	font-size: 0.875rem;
}

.spc-cities {
	padding: 12px 0 18px;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	background: var(--spc-primary-deep);
}

.spc-cities__title {
	margin: 0 0 10px;
	color: rgba(255, 255, 255, 0.75);
	font-size: 0.875rem;
	font-weight: 600;
}

@media (min-width: 900px) {
	:root {
		--spc-header-h: 68px;
	}

	.spc-brand__img {
		max-height: 44px;
	}

	.spc .spc-brand--badge {
		padding: 4px 12px;
		border-radius: 11px;
	}

	.spc-brand--badge .spc-brand__img {
		max-height: 46px;
	}

	.spc-wordmark {
		font-size: 1.625rem;
	}

	.spc .spc-header__cta,
	.spc:not(.spc-has-tabbar) .spc-header__cta {
		display: inline-flex;
		--spc-notch: 13px;
		min-height: 44px;
		font-size: 0.9375rem;
	}

	.spc-header__cta-long {
		display: inline;
	}

	.spc-header__cta-short {
		display: none;
	}
}

/* ---------- Chips (cities) and social ---------- */

.spc-chips,
.spc-social,
.spc-linkrow {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}

.spc-chips {
	gap: 8px;
}

.spc .spc-chip {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0 15px;
	border: 1px solid rgba(255, 255, 255, 0.32);
	border-radius: 999px;
	color: #fff;
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
}

.spc .spc-chip[aria-current] {
	border-color: #fff;
	background: #fff;
	color: var(--spc-primary);
}

.spc .spc-chips--light .spc-chip {
	border-color: var(--spc-line);
	color: var(--spc-ink);
}

.spc .spc-chips--light .spc-chip[aria-current] {
	border-color: var(--spc-primary);
	background: var(--spc-primary);
	color: #fff;
}

.spc-social {
	gap: 8px;
}

.spc .spc-social a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0 14px;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: var(--spc-r-s);
	color: #fff;
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
}

.spc .spc-social--light a {
	border-color: var(--spc-line);
	color: var(--spc-ink);
}

/* ---------- Front page ---------- */

.spc-hero {
	padding: 2px 0 14px;
	background: var(--spc-primary);
	color: #fff;
}

.spc .spc-hero__title {
	margin: 0;
	color: #fff;
	font-size: var(--spc-hero-m, 22px); /* teléfonos; en computadoras, más abajo */
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.02em;
	text-wrap: balance;
}

.spc-home {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 14px;
	padding-block: 12px 28px;
}

.spc-home > * {
	min-width: 0;
}

/**
 * Solo los clasificados y los banners ocupan columna propia. Todo lo demás
 * (AdSense, «Arriba de todo», «Abajo de todo» y cualquier cosa que se agregue
 * después) ocupa el ancho completo. Antes, un bloque de AdSense arriba se
 * llevaba la columna ancha y empujaba los clasificados a la angosta.
 *
 * Only the listings and the banners take a column of their own. Everything
 * else (AdSense, the top and bottom boxes, and anything added later) spans the
 * full width. Before, an AdSense block at the top took the wide column and
 * pushed the listings into the narrow one.
 */
.spc-home > * {
	grid-column: 1 / -1;
}

.spc-home > .spc-home__listings,
.spc-home > .spc-home__banners {
	grid-column: auto;
}

.spc-home--phone-side {
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 8px;
}

#buscar {
	scroll-margin-top: calc(var(--spc-header-h) + 8px);
}

.spc-home .ImgBanner img {
	max-width: 100%;
	height: auto;
}

@media (min-width: 900px) {
	.spc-hero {
		padding: 8px 0 28px;
	}

	.spc-home {
		gap: 28px;
		padding-block: 28px 48px;
	}

	/* Live Houston: banners at their own 250px width, listings take the rest */
	.spc-home--split-narrow {
		grid-template-columns: minmax(0, 1fr) 250px;
	}

	.spc-home--split-50 {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}

	.spc-home--split-60 {
		grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	}

	.spc-home--split-67 {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	}
}

/* ---------- Algolia Search classic look ([Algolia-Search], 1.11+) ----------
   From 992px the plugin always puts 4 cards per row, as on live Houston
   (about 145px each). In a narrower listings column that leaves 67–76px
   cards, so on the theme front page the cards per row follow the column
   setting instead. Plain media queries only (no container queries), so
   CSS minifiers such as Hummingbird's can't break it. Below 992px the
   plugin's own phone and tablet grid is untouched. */

@media (min-width: 992px) {
	.spc-home--split-narrow .aes-look-classic .aes-hits .ais-Hits-item {
		width: calc(33.333% - 1rem);
	}

	.spc-home--split-60 .aes-look-classic .aes-hits .ais-Hits-item,
	.spc-home--split-67 .aes-look-classic .aes-hits .ais-Hits-item {
		width: calc(50% - 1rem);
	}

	.spc-home--split-50 .aes-look-classic .aes-hits .ais-Hits-item {
		width: calc(100% - 1rem);
	}
}

@media (min-width: 1200px) {
	.spc-home--split-narrow .aes-look-classic .aes-hits .ais-Hits-item {
		width: calc(25% - 1rem);
	}

	.spc-home--split-60 .aes-look-classic .aes-hits .ais-Hits-item,
	.spc-home--split-67 .aes-look-classic .aes-hits .ais-Hits-item {
		width: calc(33.333% - 1rem);
	}

	.spc-home--split-50 .aes-look-classic .aes-hits .ais-Hits-item {
		width: calc(50% - 1rem);
	}
}

/* ---------- Ad cards ----------
   The card font, size, boldness, line height and lowercase rules are printed
   in the page with the settings (see spc_card_css() in inc/options.php), so
   an old cached copy of this file can never hold them back. */

/* ---------- Pages, posts ---------- */

.spc-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 28px;
	padding-block: 18px 36px;
}

.spc-layout > * {
	min-width: 0;
}

@media (min-width: 1000px) {
	.spc-layout {
		padding-block: 32px 56px;
	}

	.spc-layout.has-sidebar {
		grid-template-columns: minmax(0, 1fr) 300px;
		gap: 44px;
	}
}

/* Banner column beside classified pages (live Houston: 250px on the right) */
.spc-awpcp-banners .ImgBanner img {
	max-width: 100%;
	height: auto;
}

@media (min-width: 769px) {
	.spc-layout.has-banners {
		grid-template-columns: minmax(0, 1fr) 250px;
		gap: 10px;
	}
}

.spc .spc-pagetitle {
	margin: 0 0 0.55em;
	color: var(--spc-primary);
	font-size: clamp(1.5rem, 6vw, 2.375rem);
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -0.02em;
	text-wrap: balance;
}

.spc-lede {
	margin: -0.2em 0 1.4em;
	color: var(--spc-muted);
}

.entry-content {
	overflow-wrap: break-word;
}

.spc-prose {
	max-width: 720px;
	font-size: 1.0625rem;
	line-height: 1.65;
}

.spc-prose h2,
.spc-prose h3 {
	margin: 1.6em 0 0.5em;
	color: var(--spc-primary);
	line-height: 1.2;
	letter-spacing: -0.01em;
}

.spc-prose h2 {
	font-size: 1.5rem;
}

.spc-prose h3 {
	font-size: 1.25rem;
}

.spc-prose table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
}

.spc-prose th,
.spc-prose td {
	padding: 8px 10px;
	border: 1px solid var(--spc-line);
}

.spc-prose img {
	border-radius: var(--spc-r-s);
}

.spc-meta {
	margin: -0.3em 0 1.3em;
	color: var(--spc-muted);
	font-size: 0.9375rem;
}

.spc-single__img {
	margin: 0 0 1.3em;
}

.spc-single__img img {
	display: block;
	width: 100%;
	border-radius: var(--spc-r);
}

.spc-fullwidth {
	width: 100%;
}

/* Post lists */

.spc-posts {
	display: grid;
	gap: 12px;
}

@media (min-width: 640px) {
	.spc-posts {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
	}
}

@media (min-width: 1100px) {
	.spc-layout:not(.has-sidebar) .spc-posts {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.spc-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--spc-line);
	border-radius: var(--spc-r);
	background: var(--spc-card);
}

.spc-card__img img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.spc-card__body {
	padding: 12px 14px 16px;
}

.spc .spc-card__title {
	margin: 0 0 4px;
	font-size: 1.125rem;
	line-height: 1.25;
}

.spc .spc-card__title a {
	color: var(--spc-ink);
	text-decoration: none;
}

.spc-card__meta {
	margin: 0 0 6px;
	color: var(--spc-muted);
	font-size: 0.8125rem;
}

.spc-card__excerpt {
	font-size: 0.9375rem;
}

/* Pagination */

.spc .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 22px;
}

.spc .page-numbers {
	display: inline-grid;
	place-items: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 12px;
	border: 1px solid var(--spc-line);
	border-radius: var(--spc-r-s);
	background: #fff;
	font-weight: 700;
	text-decoration: none;
}

.spc .page-numbers.current {
	border-color: var(--spc-primary);
	background: var(--spc-primary);
	color: #fff;
}

.spc .post-navigation .nav-links {
	display: grid;
	gap: 10px;
	margin: 32px 0;
}

.spc .post-navigation a {
	display: block;
	padding: 12px 14px;
	border: 1px solid var(--spc-line);
	border-radius: var(--spc-r);
	background: #fff;
	color: var(--spc-ink);
	font-weight: 600;
	text-decoration: none;
}

.spc-postnav__label {
	display: block;
	color: var(--spc-muted);
	font-size: 0.8125rem;
	font-weight: 600;
}

/* Empty states, forms */

.spc-empty {
	max-width: 640px;
	padding: 22px;
	border: 1px solid var(--spc-line);
	border-radius: var(--spc-r);
	background: #fff;
}

.spc-empty h2 {
	margin: 0 0 0.4em;
	color: var(--spc-primary);
}

.spc-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 18px 0 0;
}

.spc-searchform {
	display: flex;
	gap: 8px;
	margin: 14px 0 0;
}

.spc .spc-input {
	flex: 1;
	min-width: 0;
	min-height: 44px;
	padding: 10px 12px;
	border: 1px solid #b6c3d0;
	border-radius: var(--spc-r-s);
	background: #fff;
	color: var(--spc-ink);
	font: inherit;
	font-size: 16px; /* 16px stops iPhone zooming into the field */
}

/* Sidebar */

.spc-sidebar .widget {
	margin: 0 0 16px;
	padding: 16px;
	border: 1px solid var(--spc-line);
	border-radius: var(--spc-r);
	background: #fff;
}

.spc .spc-sidebar .widget-title {
	margin: 0 0 10px;
	color: var(--spc-primary);
	font-size: 1rem;
}

/* Comments */

.spc-comments {
	margin-top: 36px;
}

.spc-comments__list {
	padding-left: 1.2em;
}

.spc .comment-form input:not([type="checkbox"]):not([type="submit"]),
.spc .comment-form textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #b6c3d0;
	border-radius: var(--spc-r-s);
	font: inherit;
	font-size: 16px;
}

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

.spc-footer {
	--spc-focus: var(--spc-accent);
	--spc-tag-hole: var(--spc-primary-deep);
	padding: 30px 0 26px;
	background: var(--spc-primary-deep);
	color: rgba(255, 255, 255, 0.86);
	font-size: 0.9375rem;
}

.spc .spc-footer a:not(.spc-tag) {
	color: #fff;
}

.spc-footer__post {
	display: grid;
	justify-items: start;
	gap: 4px;
	margin-bottom: 24px;
	padding-bottom: 24px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.spc .spc-footer__lead {
	margin: 0;
	color: #fff;
	font-size: 1.3125rem;
	font-weight: 800;
	letter-spacing: -0.015em;
}

.spc-footer__note {
	margin: 0 0 12px;
}

.spc-footer__grid {
	display: grid;
	gap: 20px;
}

.spc .spc-footer__heading {
	margin: 0 0 10px;
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.875rem;
	font-weight: 600;
}

.spc-linkrow {
	gap: 0 20px;
	margin-bottom: 10px;
}

.spc .spc-linkrow a {
	display: inline-block;
	padding: 10px 0;
	font-weight: 600;
	text-decoration: none;
}

.spc-footer__legal {
	margin: 24px 0 0;
	color: rgba(255, 255, 255, 0.62);
	font-size: 0.8125rem;
}

.spc .spc-footer__legal a {
	color: rgba(255, 255, 255, 0.85);
}

@media (min-width: 900px) {
	.spc-footer {
		padding-top: 40px;
	}

	.spc-footer__post {
		grid-template-columns: 1fr auto;
		align-items: center;
		column-gap: 32px;
	}

	.spc-footer__post .spc-tag {
		grid-column: 2;
		grid-row: 1 / span 2;
	}

	.spc-footer__note {
		margin: 0;
	}

	.spc-footer__grid {
		grid-template-columns: 1.4fr 1fr;
		gap: 40px;
	}
}

/* ---------- Phone tab bar ---------- */

.spc-has-tabbar {
	padding-bottom: calc(var(--spc-tabbar-h) + env(safe-area-inset-bottom, 0px));
}

.spc-tabbar {
	--spc-tag-hole: #fff;
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 70;
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	height: calc(var(--spc-tabbar-h) + env(safe-area-inset-bottom, 0px));
	padding: 0 4px env(safe-area-inset-bottom, 0px);
	border-top: 1px solid var(--spc-line);
	background: #fff;
	box-shadow: 0 -4px 14px rgba(14, 42, 71, 0.07);
}

.spc .spc-tabbar__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 3px;
	height: var(--spc-tabbar-h);
	padding: 0;
	border: 0;
	background: none;
	color: var(--spc-muted);
	font: inherit;
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.spc .spc-tabbar__item[aria-current="page"] {
	color: var(--spc-primary);
}

.spc-tabbar__item[aria-current="page"] .spc-icon {
	stroke-width: 2.5;
}

.spc .spc-tabbar__post {
	justify-content: flex-start;
}

/* The raised tag in the middle of the bar. */
.spc .spc-tag--tab {
	--spc-notch: 11px;
	flex-direction: column;
	gap: 1px;
	width: 100%;
	max-width: 82px;
	height: 54px;
	min-height: 0;
	margin-top: -12px;
	padding: 4px 6px 4px 17px;
	font-size: 0.75rem;
	transform: rotate(-4deg);
	filter: drop-shadow(0 3px 5px rgba(14, 42, 71, 0.28));
}

.spc-tag--tab .spc-icon {
	width: 22px;
	height: 22px;
	stroke-width: 2.6;
}

.spc-tabbar__post:active .spc-tag--tab {
	transform: rotate(-4deg) translateY(1px);
}

@media (min-width: 900px) {
	.spc-has-tabbar {
		padding-bottom: 0;
	}

	.spc-tabbar {
		display: none;
	}
}

/* ---------- Menu drawer and search window ---------- */

.spc-lock,
.spc-lock body {
	overflow: hidden;
}

.spc-drawer,
.spc-search {
	position: fixed;
	inset: 0;
	z-index: 100;
}

.spc-drawer[hidden],
.spc-search[hidden],
.spc-cities[hidden] {
	display: none;
}

.admin-bar .spc-drawer,
.admin-bar .spc-search {
	top: 46px;
}

@media (min-width: 783px) {
	.admin-bar .spc-drawer,
	.admin-bar .spc-search {
		top: 32px;
	}
}

.spc-drawer__backdrop,
.spc-search__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(6, 18, 31, 0.55);
	opacity: 0;
	transition: opacity 0.2s ease;
}

.is-open > .spc-drawer__backdrop,
.is-open > .spc-search__backdrop {
	opacity: 1;
}

.spc-drawer__panel {
	--spc-tag-hole: #fff;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: min(88vw, 380px);
	padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px));
	overflow-y: auto;
	overscroll-behavior: contain;
	background: #fff;
	color: var(--spc-ink);
	transform: translateX(100%);
	transition: transform 0.22s ease;
}

.spc-drawer.is-open .spc-drawer__panel {
	transform: none;
}

.spc-drawer__panel:focus {
	outline: none;
}

.spc-drawer__head,
.spc-search__head {
	--spc-focus: var(--spc-accent);
	position: sticky;
	top: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: var(--spc-header-h);
	padding: 0 6px 0 18px;
	background: var(--spc-primary);
	color: #fff;
}

.spc .spc-drawer__title,
.spc .spc-search__title {
	margin: 0;
	color: #fff;
	font-size: 1.0625rem;
	font-weight: 800;
}

.spc-drawer__section {
	padding: 0 18px;
}

.spc .spc-drawer__heading {
	margin: 0 0 10px;
	color: var(--spc-muted);
	font-size: 0.875rem;
	font-weight: 700;
}

.spc-drawer .spc-iconbtn:hover {
	background: rgba(255, 255, 255, 0.12);
}

.spc-menu,
.spc-menu .sub-menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

.spc .spc-menu a {
	display: flex;
	align-items: center;
	min-height: 52px;
	padding: 0 18px;
	border-bottom: 1px solid var(--spc-line);
	color: var(--spc-ink);
	font-size: 1.0625rem;
	font-weight: 600;
	text-decoration: none;
}

.spc .spc-menu .sub-menu a {
	padding-left: 34px;
	font-size: 1rem;
	font-weight: 500;
}

.spc .spc-menu .current-menu-item > a {
	color: var(--spc-primary);
	box-shadow: inset 4px 0 0 var(--spc-accent);
}

.spc-search__panel {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	max-height: 100%;
	overflow-y: auto;
	background: #fff;
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.18s ease, transform 0.18s ease;
}

.spc-search.is-open .spc-search__panel {
	opacity: 1;
	transform: none;
}

.spc-search__body {
	max-width: 760px;
	margin: 0 auto;
	padding: 16px var(--spc-gutter) 28px;
}

@media (prefers-reduced-motion: reduce) {
	.spc *,
	.spc *::before,
	.spc *::after {
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

@media print {
	.spc-header,
	.spc-tabbar,
	.spc-footer,
	.spc-drawer,
	.spc-search {
		display: none !important;
	}

	.spc-has-tabbar {
		padding-bottom: 0;
	}
}

/* =====================================================================
   superpulga.com look
   Colors, fonts and shapes from the Super Pulga Jump theme 1.1.0: cream
   header with a red line, yellow "pressed" Publicar button, Archivo
   Black / Archivo type, cream city cards with a colored edge, deep navy
   footer. Applies to the theme's frame (header, front page band, city
   chooser, menu, bottom bar, footer). Listings and ad pages keep their
   own look and letters.
   ===================================================================== */

:root {
	--spc-cream: #FFF8EC;                  /* jump --papel */
	--spc-jump-ink: #14202E;               /* jump --tinta */
	--spc-display: "Archivo Black", "Arial Black", system-ui, sans-serif;
	--spc-ui: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
}

.spc-header,
.spc-hero,
.spc-cities,
.spc-drawer,
.spc-search__head,
.spc-tabbar,
.spc-footer {
	font-family: var(--spc-ui);
}

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

.spc-header {
	--spc-focus: var(--spc-primary);
	background: var(--spc-header-bg, var(--spc-cream));
	color: var(--spc-header-ink, var(--spc-primary));
}

.spc .spc-brand {
	color: inherit;
}

.spc-header .spc-wordmark {
	font-family: var(--spc-display);
	font-weight: 400;
	letter-spacing: -0.01em;
	text-transform: uppercase;
}

.spc .spc-citybtn {
	border-color: color-mix(in srgb, currentColor 35%, transparent);
	color: inherit;
	font-weight: 700;
}

.spc-header .spc-iconbtn:hover,
.spc-header .spc-citybtn:hover {
	background: color-mix(in srgb, currentColor 9%, transparent);
}

/* Computers: a larger logo, closer to superpulga.com's */
@media (min-width: 900px) {
	:root {
		--spc-header-h: 76px;
	}

	.spc-brand .spc-brand__img {
		max-height: 56px;
	}
}

/* ---------- Publicar: yellow button with a pressed edge ---------- */

.spc .spc-tag {
	padding: 0.55em 1.15em;
	border-radius: 0.5rem;
	background: var(--spc-accent);
	box-shadow: 0 3px 0 var(--spc-accent-shadow, #C58F00);
	color: var(--spc-accent-ink);
	font-family: var(--spc-display);
	font-weight: 400;
	letter-spacing: 0.005em;
}

.spc .spc-tag::before,
.spc .spc-tag::after {
	content: none;
}

.spc .spc-tag:hover {
	filter: brightness(1.04);
}

.spc .spc-tag:active {
	transform: translateY(2px);
	box-shadow: 0 1px 0 var(--spc-accent-shadow, #C58F00);
}

.spc-header .spc-tag:focus-visible,
.spc-drawer .spc-tag:focus-visible {
	outline: 3px solid var(--spc-primary);
	outline-offset: 3px;
}

/* The raised Publicar in the phone bar */
.spc .spc-tag--tab {
	padding: 4px 6px;
	border-radius: 0.65rem;
	box-shadow: 0 3px 0 var(--spc-accent-shadow, #C58F00), 0 6px 12px -4px rgba(14, 42, 71, 0.35);
	font-family: var(--spc-ui);
	font-weight: 700;
	transform: none;
	filter: none;
}

.spc-tabbar__post:active .spc-tag--tab {
	transform: translateY(2px);
	box-shadow: 0 1px 0 var(--spc-accent-shadow, #C58F00);
}

/* ---------- Front page band ---------- */

.spc .spc-hero__title {
	color: var(--spc-cream);
	font-family: var(--spc-display);
	font-weight: 400;
	letter-spacing: -0.005em;
}

.spc-hero {
	padding-top: 14px;
}

@media (min-width: 900px) {
	.spc-hero {
		padding-top: 24px;
	}

	.spc .spc-hero__title {
		font-size: var(--spc-hero, 32px);
	}
}

/* ---------- City chooser: superpulga.com city cards ---------- */

.spc-cities {
	padding: 14px 0 18px;
	border-top: 0;
	background: var(--spc-primary);
}

.spc .spc-cities__title {
	margin: 0 0 12px;
	color: var(--spc-cream);
	font-family: var(--spc-display);
	font-size: 1.125rem;
	font-weight: 400;
}

.spc-citycards {
	display: grid;
	gap: 0.6rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 700px) {
	.spc-citycards {
		grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	}
}

.spc .spc-citycard {
	display: flex;
	align-items: center;
	min-height: 4rem;
	padding: 0.7rem 0.9rem 0.7rem 0;
	border-left: 0.7rem solid var(--spc-city, #E03A2F);
	border-radius: 0.6rem;
	background: var(--spc-cream);
	box-shadow: 0 2px 0 rgba(0, 0, 0, 0.35);
	color: var(--spc-jump-ink);
	text-decoration: none;
	transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.spc .spc-citycard:active {
	transform: translateY(2px);
	box-shadow: none;
}

.spc .spc-citycard:focus-visible {
	outline: 3px solid var(--spc-accent);
	outline-offset: 3px;
}

.spc-citycard__text {
	flex: 1;
	min-width: 0;
	padding-left: 0.9rem;
}

.spc-citycard__name {
	display: block;
	font-family: var(--spc-display);
	font-size: 1.3rem;
	line-height: 1.05;
	letter-spacing: -0.01em;
}

.spc .spc-citycard__note {
	display: block;
	margin-top: 0.2rem;
	color: #5B6672;
	font-size: 0.84rem;
	font-weight: 500;
}

.spc-citycard__note b {
	color: var(--spc-city);
	font-weight: 700;
}

.spc-citycard .spc-icon {
	flex: none;
	width: 1.5rem;
	height: 1.5rem;
	color: var(--spc-city, #E03A2F);
	stroke-width: 3;
}

/* ---------- Menu and search window heads ---------- */

.spc-drawer__head,
.spc-search__head {
	--spc-focus: var(--spc-primary);
	border-bottom: 5px solid var(--spc-stripe, #E03A2F);
	background: var(--spc-header-bg, var(--spc-cream));
	color: var(--spc-header-ink, var(--spc-primary));
}

.spc .spc-drawer__title,
.spc .spc-search__title {
	color: inherit;
	font-family: var(--spc-display);
	font-weight: 400;
}

.spc-drawer .spc-iconbtn:hover {
	background: color-mix(in srgb, currentColor 9%, transparent);
}

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

.spc-footer {
	background: var(--spc-primary-deep);
	color: #9FB4C9;
}

.spc .spc-footer a:not(.spc-tag) {
	color: var(--spc-cream);
}

.spc-footer__post {
	justify-items: center;
	margin-bottom: 26px;
	padding: 18px 16px;
	border: 2px dashed rgba(255, 196, 45, 0.55);
	border-radius: 0.7rem;
	text-align: center;
}

.spc .spc-footer__lead {
	color: var(--spc-cream);
	font-family: var(--spc-display);
	font-weight: 400;
	letter-spacing: 0;
}

.spc-footer__note {
	color: #9FB4C9;
}

.spc .spc-footer__heading {
	color: #9FB4C9;
}

.spc .spc-footer .spc-chip,
.spc .spc-footer .spc-social a {
	min-height: 40px;
	padding: 0 0.3rem;
	border: 0;
	border-radius: 0;
	background: none;
	color: #CFE0F0;
	font-weight: 500;
}

.spc .spc-footer .spc-chip[aria-current] {
	background: none;
	color: var(--spc-cream);
	font-weight: 700;
	box-shadow: inset 0 -3px 0 var(--spc-accent);
}

.spc .spc-footer .spc-chips,
.spc .spc-footer .spc-social {
	gap: 0 1rem;
}

.spc-footer__legal,
.spc .spc-footer__legal a {
	color: #9FB4C9;
}

@media (min-width: 900px) {
	.spc-footer__post {
		justify-items: start;
		padding: 22px 26px;
		text-align: left;
	}
}

/* ---------- Page titles (blog, theme pages) ---------- */

.spc .spc-pagetitle {
	font-family: var(--spc-display);
	font-weight: 400;
	letter-spacing: -0.01em;
}

/* ---------- Ad slots ---------- */

.spc-ad {
	/* Ancho completo: si no, la caja se encoge al tamaño del <ins>, que no
	   tiene ancho propio hasta que AdSense lo llena.
	   Full width: otherwise the box shrinks to the <ins>, which has no width
	   of its own until AdSense fills it. */
	width: 100%;
	margin: 0 0 14px;
	text-align: center;
}

.spc-ad ins.adsbygoogle {
	width: 100%;
}

.spc-ad:empty {
	display: none;
}

.spc-ad--home {
	padding-top: 14px;
}

.spc-ad--ad {
	margin-top: 18px;
}

.spc-ad img,
.spc-ad iframe,
.spc-ad ins {
	max-width: 100%;
}

/* ---------- When a city has no banners ----------
   The banner column only fills in after the banner script answers. If nothing
   arrives, the theme's script marks the page and the ads take the whole width
   instead of sharing it with an empty column. */

.spc-home--no-banners {
	grid-template-columns: minmax(0, 1fr) !important;
}

.spc-home--no-banners .spc-home__banners,
.spc-layout--no-banners .spc-awpcp-banners {
	display: none;
}

@media (min-width: 769px) {
	.spc-layout.has-banners.spc-layout--no-banners {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------- Ad counter ---------- */

.spc-home__count {
	margin: 0;
	color: var(--spc-primary);
	font-family: var(--spc-ui);
	font-size: 15px;
	font-weight: 600;
}

@media (min-width: 992px) {
	.spc-home__count {
		font-size: 16px;
	}
}

.spc-ad--list {
	margin-top: 16px;
}

.spc-ref {
	color: #6b7280;
	font-size: 0.9em;
}

/* ---------- Front page search, full width ----------
   With the setting on, the theme prints the search above both columns and
   hides the one Algolia draws inside the listings. */

.spc-home__search {
	margin: 0 0 4px;
}

/* Any search box inside the listings column, at whatever depth the plugin
   version puts it. The theme prints its own above, so there is nothing to
   lose by hiding them all here. */
.spc-search-wide .spc-home__listings .aes-searchbox,
.spc-search-wide .spc-home__listings .aes-widget-searchbox,
.spc-search-wide .spc-home__listings .ais-SearchBox {
	display: none !important;
}