/* ==========================================================================
   Empleos Perú — estilos del portal
   ========================================================================== */

.ep-board {
	--ep-primary: #c8102e;        /* rojo Perú */
	--ep-primary-dark: #9e0c24;
	--ep-text: #1d2433;
	--ep-muted: #5f6b7a;
	--ep-border: #e3e7ee;
	--ep-bg: #f6f8fb;
	--ep-card: #ffffff;
	--ep-green: #0f8a4b;
	--ep-red: #d92d20;
	--ep-orange: #e57a00;
	--ep-gray: #6b7280;
	--ep-blue: #1d4ed8;
	--ep-radius: 14px;
	--ep-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 4px 14px rgba(16, 24, 40, .06);
	--ep-sticky-top: 0px;

	color: var(--ep-text);
	/* Usa la fuente del tema (Poppins en el tema EmpleaSuyo). */
	font-family: var(--wp--preset--font-family--poppins, inherit);
	font-size: 16px;
	line-height: 1.5;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 16px 48px;
	box-sizing: border-box;
	/* Las columnas se calculan según el ancho real del portal (que depende del tema), no de la ventana. */
	container: ep / inline-size;
}

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

.admin-bar .ep-board { --ep-sticky-top: 32px; }
@media (max-width: 782px) { .admin-bar .ep-board { --ep-sticky-top: 0px; } }

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

/* ---------- Contadores ---------- */
.ep-stats {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 24px 0 16px;
}
@container ep (min-width: 860px) { .ep-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.ep-stat {
	background: var(--ep-card);
	border: 1px solid var(--ep-border);
	border-radius: var(--ep-radius);
	box-shadow: var(--ep-shadow);
	padding: 16px;
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: auto auto;
	column-gap: 12px;
	align-items: center;
}
.ep-stat__icon { grid-row: span 2; color: var(--ep-primary); background: #fdecee; border-radius: 12px; padding: 8px; width: 44px; height: 44px; }
.ep-stat--today .ep-stat__icon { color: var(--ep-red); background: #fdeceb; }
.ep-stat--companies .ep-stat__icon { color: var(--ep-blue); background: #e8efff; }
.ep-stat--regions .ep-stat__icon { color: var(--ep-green); background: #e6f6ee; }
.ep-stat__num { font-size: 1.75rem; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; }
.ep-stat__label { color: var(--ep-muted); font-size: .875rem; }

/* ---------- Filtros (sticky) ---------- */
.ep-filters {
	position: relative;
	z-index: 50;
	background: rgba(255, 255, 255, .97);
	backdrop-filter: saturate(1.4) blur(6px);
	border: 1px solid var(--ep-border);
	border-radius: var(--ep-radius);
	box-shadow: var(--ep-shadow);
	padding: 12px;
	margin: 16px 0 20px;
}
/* Sticky solo con espacio suficiente: en móvil taparía media pantalla. */
@container ep (min-width: 1060px) { .ep-filters { position: sticky; top: var(--ep-sticky-top); } }
.ep-filters__row { display: grid; gap: 8px; grid-template-columns: 1fr; }
@container ep (min-width: 600px) { .ep-filters__row { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ep-field--search { grid-column: 1 / -1; } }
@container ep (min-width: 1060px) { .ep-filters__row { grid-template-columns: minmax(0, 2fr) repeat(4, minmax(0, 1fr)); } .ep-field--search { grid-column: auto; } }

.ep-filters__row--secondary {
	margin-top: 10px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
}

.ep-field { position: relative; display: flex; align-items: center; margin: 0; }
.ep-field--search svg { position: absolute; left: 12px; color: var(--ep-muted); pointer-events: none; }
.ep-field input[type="search"],
.ep-select {
	width: 100%;
	height: 44px;
	border: 1px solid var(--ep-border);
	border-radius: 10px;
	background: #fff;
	padding: 0 12px;
	font-size: .95rem;
	color: var(--ep-text);
	margin: 0;
}
.ep-field--search input[type="search"] { padding-left: 38px; }
.ep-field input:focus,
.ep-select:focus { outline: 2px solid var(--ep-primary); outline-offset: 1px; border-color: transparent; }
.ep-field--order { gap: 6px; }
.ep-field__prefix { color: var(--ep-muted); font-size: .875rem; white-space: nowrap; }
.ep-field--order .ep-select { width: auto; min-width: 170px; }

.ep-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ep-chip {
	border: 1px solid var(--ep-border);
	background: #fff;
	color: var(--ep-text);
	border-radius: 999px;
	padding: 7px 14px;
	font-size: .875rem;
	cursor: pointer;
	line-height: 1.2;
	transition: background .15s, color .15s, border-color .15s;
}
.ep-chip:hover { border-color: var(--ep-primary); }
.ep-chip.is-active { background: var(--ep-primary); border-color: var(--ep-primary); color: #fff; }

.ep-filters__actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* ---------- Botones ---------- */
.ep-btn {
	display: inline-flex; align-items: center; justify-content: center;
	height: 44px; padding: 0 18px;
	border-radius: 10px; border: 1px solid transparent;
	font-weight: 700; font-size: .95rem;
	text-decoration: none !important; cursor: pointer;
	transition: background .15s, transform .05s;
}
.ep-btn:active { transform: translateY(1px); }
.ep-btn--primary { background: var(--ep-primary); color: #fff !important; }
.ep-btn--primary:hover { background: var(--ep-primary-dark); }
.ep-btn--ghost { background: transparent; color: var(--ep-muted); border-color: var(--ep-border); }
.ep-btn--ghost:hover { color: var(--ep-text); border-color: var(--ep-muted); }
.ep-btn--block { width: 100%; }
.ep-btn--lg { height: 52px; padding: 0 28px; font-size: 1.05rem; }

/* ---------- Layout ---------- */
.ep-layout { display: grid; grid-template-columns: 1fr; gap: 24px; }
@container ep (min-width: 1060px) { .ep-layout { grid-template-columns: minmax(0, 1fr) 300px; } }
.ep-main { min-width: 0; }
.ep-count { color: var(--ep-muted); margin: 0 0 12px; }

/* ---------- Grid de tarjetas: 1 / 2 / 3 columnas ---------- */
.ep-grid {
	display: grid;
	/* 1 columna en móvil, 2 en tablet, 3 en escritorio: según el espacio disponible. */
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
	gap: 16px;
	transition: opacity .2s;
}
.ep-grid.is-loading { opacity: .45; pointer-events: none; }

.ep-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	background: var(--ep-card);
	border: 1px solid var(--ep-border);
	border-radius: var(--ep-radius);
	box-shadow: var(--ep-shadow);
	padding: 16px;
	min-width: 0;
	overflow-wrap: anywhere;
	transition: transform .15s, box-shadow .15s;
}
.ep-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(16, 24, 40, .1); }

.ep-card__badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; min-height: 20px; margin-bottom: -4px; }
.ep-card__badges--inline { justify-content: flex-start; margin-bottom: 6px; }
.ep-card__head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ep-card__head > div { min-width: 0; }
.ep-card__logo {
	width: 60px; height: 60px; flex: 0 0 60px;
	object-fit: contain; border-radius: 10px;
	background: #eef1f5; border: 1px solid var(--ep-border);
}
.ep-card__company { font-size: .875rem; color: var(--ep-muted); font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ep-card__title { font-size: 1.05rem; line-height: 1.35; margin: 0; }
.ep-card__title a { color: var(--ep-text); text-decoration: none; }
.ep-card__title a:hover { color: var(--ep-primary); text-decoration: underline; }

.ep-card__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.ep-tag {
	font-size: .75rem; font-weight: 600;
	background: #f1f4f8; color: #3c4655;
	border-radius: 6px; padding: 3px 8px;
}
.ep-tag--type { background: #e8efff; color: var(--ep-blue); }
.ep-tag--cas { background: #fdecee; color: var(--ep-primary); }
.ep-tag--practicas { background: #f3e8ff; color: #7e22ce; }
.ep-tag--planilla-276, .ep-tag--planilla-728 { background: #e6f6ee; color: var(--ep-green); }
.ep-tag--concurso-publico { background: #fff4e5; color: #b45309; }
.ep-tag--servicios { background: #ecfeff; color: #0e7490; }

.ep-card__salary { font-size: 1.25rem; font-weight: 800; color: var(--ep-green); }
.ep-card__salary.is-empty { font-size: .95rem; font-weight: 600; color: var(--ep-muted); }

.ep-card__meta { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; font-size: .875rem; color: var(--ep-muted); }
.ep-card__meta li { display: flex; align-items: center; gap: 4px; margin: 0; }

.ep-card__foot { margin-top: auto; display: flex; align-items: center; gap: 12px; padding-top: 6px; }
.ep-card__foot .ep-btn { flex: 1; }
.ep-card__more { font-size: .875rem; color: var(--ep-muted); white-space: nowrap; }

/* ---------- Badges ---------- */
.ep-badge {
	display: inline-block; font-size: .7rem; font-weight: 800; letter-spacing: .02em;
	border-radius: 999px; padding: 3px 9px; line-height: 1.4; white-space: nowrap;
}
.ep-badge--new { background: var(--ep-primary); color: #fff; }
.ep-badge--public { background: #e8efff; color: var(--ep-blue); }
.ep-badge--private { background: #f1f4f8; color: #3c4655; }
.ep-badge--red { background: #fdeceb; color: var(--ep-red); }
.ep-badge--orange { background: #fff4e5; color: var(--ep-orange); }
.ep-badge--gray { background: #f1f4f8; color: var(--ep-gray); }

/* ---------- Paginación ---------- */
.ep-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 28px 0 8px; }
.ep-page {
	min-width: 40px; height: 40px; padding: 0 12px;
	display: inline-flex; align-items: center; justify-content: center; gap: 4px;
	border: 1px solid var(--ep-border); border-radius: 10px;
	background: #fff; color: var(--ep-text); text-decoration: none; font-weight: 600;
}
.ep-page:hover { border-color: var(--ep-primary); color: var(--ep-primary); }
.ep-page.is-current { background: var(--ep-primary); border-color: var(--ep-primary); color: #fff; }
.ep-page--dots { border: 0; background: transparent; }
@container ep (max-width: 480px) { .ep-page--prev span, .ep-page--next span { display: none; } }

.ep-empty { grid-column: 1 / -1; text-align: center; padding: 48px 16px; color: var(--ep-muted); background: var(--ep-card); border: 1px dashed var(--ep-border); border-radius: var(--ep-radius); }

/* ---------- Sidebar y widgets ---------- */
.ep-sidebar { display: flex; flex-direction: column; gap: 16px; }
.ep-widget { background: var(--ep-card); border: 1px solid var(--ep-border); border-radius: var(--ep-radius); padding: 16px; box-shadow: var(--ep-shadow); }
.ep-widget__title { font-size: 1rem; margin: 0 0 12px; }
.ep-widget__empty { color: var(--ep-muted); margin: 0; font-size: .9rem; }
.ep-list { list-style: none; margin: 0; padding: 0; }
.ep-list li { padding: 8px 0; border-bottom: 1px solid var(--ep-border); display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; }
.ep-list li:last-child { border-bottom: 0; }
.ep-list a { color: var(--ep-text); text-decoration: none; font-weight: 600; font-size: .9rem; }
.ep-list a:hover { color: var(--ep-primary); }
.ep-list__sub { width: 100%; color: var(--ep-muted); font-size: .8rem; }
.ep-list--counts li { flex-wrap: nowrap; justify-content: space-between; }
.ep-list--counts a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ep-count-pill { background: #f1f4f8; border-radius: 999px; padding: 1px 8px; font-size: .75rem; font-weight: 700; color: var(--ep-muted); }
.ep-quick-search { display: flex; gap: 6px; }
.ep-quick-search input { flex: 1; min-width: 0; height: 44px; border: 1px solid var(--ep-border); border-radius: 10px; padding: 0 12px; }

/* ---------- Espacios publicitarios (AdSense) ----------
   Se reserva altura mínima para evitar saltos de contenido (CLS). */
.ep-ad { text-align: center; margin: 20px 0; overflow: hidden; }
.ep-ad__label { display: block; font-size: .65rem; text-transform: uppercase; letter-spacing: .08em; color: #9aa4b2; margin-bottom: 4px; }
.ep-ad ins.adsbygoogle { min-height: 100px; }
.ep-ad--header ins.adsbygoogle,
.ep-ad--top ins.adsbygoogle,
.ep-ad--bottom ins.adsbygoogle { min-height: 90px; }
@media (max-width: 639px) {
	.ep-ad--header ins.adsbygoogle,
	.ep-ad--top ins.adsbygoogle,
	.ep-ad--bottom ins.adsbygoogle { min-height: 100px; }
}
.ep-ad--sidebar ins.adsbygoogle,
.ep-ad--sidebar_sticky ins.adsbygoogle,
.ep-ad--single_sidebar ins.adsbygoogle { min-height: 250px; }

/* In-feed: ocupa toda la fila del grid para no confundirse con una oferta. */
.ep-grid > .ep-ad { grid-column: 1 / -1; margin: 4px 0; padding: 8px; background: var(--ep-card); border: 1px solid var(--ep-border); border-radius: var(--ep-radius); }
.ep-sidebar .ep-ad { margin: 0; }
.ep-sticky-ad { display: none; }
@container ep (min-width: 1060px) { .ep-sticky-ad { display: block; position: sticky; top: calc(var(--ep-sticky-top) + 16px); } }

/* Vista previa para administradores */
.ep-ad--preview .ep-ad__box {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	min-height: 90px; padding: 12px;
	border: 2px dashed #c3cad5; border-radius: 10px; background: repeating-linear-gradient(45deg, #f6f8fb, #f6f8fb 10px, #eef1f5 10px, #eef1f5 20px);
	color: #5f6b7a; font-weight: 700; font-size: .85rem;
}
.ep-ad--preview .ep-ad__box small { font-weight: 400; font-size: .75rem; }
.ep-sidebar .ep-ad--preview .ep-ad__box,
.ep-ad--single_sidebar.ep-ad--preview .ep-ad__box { min-height: 250px; }

/* ---------- Ficha de oferta ---------- */
.ep-single { padding-top: 16px; }
.ep-breadcrumb { font-size: .875rem; color: var(--ep-muted); margin-bottom: 16px; }
.ep-breadcrumb a { color: var(--ep-muted); }
.ep-single__main { background: var(--ep-card); border: 1px solid var(--ep-border); border-radius: var(--ep-radius); box-shadow: var(--ep-shadow); padding: 20px; }
@container ep (min-width: 720px) { .ep-single__main { padding: 32px; } }
.ep-single__head { display: flex; gap: 16px; align-items: flex-start; }
.ep-single__logo { width: 80px; height: 80px; flex: 0 0 80px; object-fit: contain; border-radius: 12px; border: 1px solid var(--ep-border); background: #eef1f5; }
.ep-single__title { font-size: 1.5rem; line-height: 1.25; margin: 0 0 4px; }
@container ep (min-width: 720px) { .ep-single__title { font-size: 1.85rem; } }
.ep-single__company { color: var(--ep-muted); font-weight: 600; margin: 0; }
.ep-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 140px), 1fr)); gap: 12px; margin: 24px 0; padding: 0; }
.ep-facts > div { background: var(--ep-bg); border-radius: 10px; padding: 12px; }
.ep-facts dt { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ep-muted); margin: 0; }
.ep-facts dd { margin: 2px 0 0; font-weight: 700; }
.ep-facts__salary { color: var(--ep-green); }
.ep-single__content { line-height: 1.7; }
.ep-single__cta { margin: 28px 0 8px; text-align: center; }
.ep-single__note { font-size: .85rem; color: var(--ep-muted); margin-top: 10px; }

/* ==========================================================================
   Bloque destacado (hero) de la portada
   ========================================================================== */
.ep-hero {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	gap: 8px 24px;
	margin: 24px 0 20px;
	padding: 28px 20px 20px;
	border-radius: 24px;
	color: #fff;
	overflow: hidden;
	isolation: isolate;
	background:
		radial-gradient(circle at 85% 15%, rgba(255, 255, 255, .16), transparent 40%),
		linear-gradient(135deg, var(--ep-primary) 0%, #a50d27 55%, var(--ep-primary-dark) 100%);
	box-shadow: 0 18px 40px -18px rgba(158, 12, 36, .55);
}
/* Patrón andino (escalonado tipo chakana) muy sutil, en SVG inline: 0 peticiones extra. */
.ep-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	opacity: .09;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' d='M20 4h16v8h8v8h8v16h-8v8h-8v8H20v-8h-8v-8H4V20h8v-8h8z'/%3E%3Crect x='24' y='24' width='8' height='8' fill='%23fff'/%3E%3C/svg%3E");
	background-size: 56px 56px;
}
.ep-hero__body { position: relative; z-index: 1; }
.ep-hero__eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	margin: 0 0 12px; padding: 5px 12px;
	background: rgba(255, 255, 255, .16); border-radius: 999px;
	font-size: .8rem; font-weight: 600; letter-spacing: .01em;
}
.ep-hero__dot { width: 8px; height: 8px; border-radius: 50%; background: #4ade80; box-shadow: 0 0 0 3px rgba(74, 222, 128, .3); }
.ep-board .ep-hero__title {
	margin: 0 0 10px;
	color: #fff;
	font-size: clamp(1.6rem, 1.1rem + 2.4vw, 2.6rem);
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -0.02em;
	max-width: 18ch;
}
.ep-hero__subtitle { margin: 0 0 16px; max-width: 56ch; font-size: 1rem; line-height: 1.55; color: rgba(255, 255, 255, .9); }
.ep-hero__links { display: flex; flex-wrap: wrap; gap: 8px; }
.ep-hero__links a {
	padding: 8px 14px; border-radius: 999px;
	background: #fff; color: var(--ep-primary); text-decoration: none;
	font-weight: 700; font-size: .875rem;
	transition: transform .15s, box-shadow .15s;
}
.ep-hero__links a:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(0, 0, 0, .18); color: var(--ep-primary-dark); }

.ep-hero__art { display: flex; justify-content: center; align-items: flex-end; }
.ep-hero__art .ep-mascot { width: 160px; height: auto; max-height: 200px; object-fit: contain; filter: drop-shadow(0 12px 18px rgba(0, 0, 0, .25)); }

.ep-hero__stats { grid-column: 1 / -1; position: relative; z-index: 1; }
.ep-hero .ep-stats { margin: 16px 0 0; }
.ep-hero .ep-stat { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .22); box-shadow: none; color: #fff; backdrop-filter: blur(4px); }
.ep-hero .ep-stat__icon { color: #fff !important; background: rgba(255, 255, 255, .18) !important; }
.ep-hero .ep-stat__label { color: rgba(255, 255, 255, .85); }

/* Móvil: la mascota (imagen horizontal con cartel) va arriba, centrada. */
@container ep (max-width: 759px) {
	.ep-hero__art { order: -1; margin: -6px 0 6px; }
	.ep-hero__art .ep-mascot {
		width: 240px; max-width: 100%; height: auto; max-height: none;
		/* El corte recto inferior se difumina para no chocar con el título. */
		-webkit-mask-image: linear-gradient(#000 78%, transparent);
		mask-image: linear-gradient(#000 78%, transparent);
	}
	.ep-hero__subtitle { font-size: .92rem; }
	.ep-hero .ep-stat { padding: 12px; column-gap: 8px; }
	.ep-hero .ep-stat__icon { width: 36px; height: 36px; padding: 7px; }
	.ep-hero .ep-stat__num { font-size: 1.35rem; }
	.ep-hero .ep-stat__label { font-size: .78rem; line-height: 1.25; }
}
@container ep (min-width: 760px) {
	.ep-hero { padding: 40px 40px 28px; }
	/* La mascota ocupa la columna derecha de arriba abajo y se apoya en el borde inferior del bloque
	   (su imagen termina con un corte recto, como si "saliera" desde abajo). */
	.ep-hero.has-mascot { grid-template-columns: minmax(0, 1fr) minmax(280px, 420px); }
	.ep-hero.has-mascot .ep-hero__art { grid-column: 2; grid-row: 1 / span 2; align-self: end; margin-bottom: -28px; }
	.ep-hero.has-mascot .ep-hero__stats { grid-column: 1; }
	.ep-hero.has-mascot .ep-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ep-hero__art .ep-mascot { width: 100%; height: auto; max-height: none; filter: drop-shadow(0 10px 16px rgba(0, 0, 0, .22)); }
}

/* ==========================================================================
   Toques de diseño más llamativos
   ========================================================================== */
.ep-board .ep-card__title { font-weight: 700; }
.ep-card { border-top: 3px solid transparent; }
.ep-card:hover { border-color: var(--ep-border); border-top-color: var(--ep-primary); }
.ep-card__salary { font-weight: 800; letter-spacing: -0.01em; }
.ep-btn { font-family: inherit; }
.ep-filters { border-radius: 18px; }
.ep-widget__title { font-weight: 700; display: flex; align-items: center; gap: 8px; }
.ep-widget__title::before { content: ""; width: 4px; height: 18px; border-radius: 4px; background: var(--ep-primary); }

/* Mascotas fuera del hero */
.ep-empty .ep-mascot { display: block; width: 180px; height: auto; margin: 0 auto 12px; }
.ep-single__cta .ep-mascot { display: block; width: 120px; height: auto; margin: 0 auto 12px; }

/* Iniciales de color para empresas sin logo (tonos suaves, color estable por empresa) */
.ep-avatar {
	display: inline-flex; align-items: center; justify-content: center;
	background: hsl(var(--ep-avatar-h, 350) 70% 94%);
	color: hsl(var(--ep-avatar-h, 350) 55% 32%);
	border-color: hsl(var(--ep-avatar-h, 350) 60% 86%) !important;
	font-weight: 800; letter-spacing: .02em; line-height: 1;
	user-select: none;
}
.ep-card__logo.ep-avatar { font-size: 1.25rem; }
.ep-single__logo.ep-avatar { font-size: 1.6rem; }

/* Con mucho ancho, los 4 contadores caben en una fila junto a la mascota (va al final para ganar en la cascada). */
@container ep (min-width: 1200px) {
	.ep-hero.has-mascot .ep-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Anuncios laterales fijos (side rails): solo con margen libre a ambos lados del portal (1280 px + 2 × 184 px). */
.ep-rail { display: none; }
@media (min-width: 1680px) {
	.ep-rail { display: block; position: fixed; top: 120px; width: 160px; z-index: 40; }
	.ep-rail--left  { left:  calc(50% - 640px - 160px - 24px); }
	.ep-rail--right { right: calc(50% - 640px - 160px - 24px); }
	.ep-rail .ep-ad { margin: 0; }
	.ep-rail .ep-ad--preview .ep-ad__box { min-height: 600px; }
}