/* Homepage — abaixo do hero, alinhado ao visual “Informações” (claro, centralizado, azul #4eacff) */

/* Home: layout full-bleed; fundo = .page-box em custom.css (promo_bg.jpg) */
.home-below.page-box {
	width: 100%;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
	padding: clamp(2rem, 4.5vw, 3.75rem) 0 clamp(2.5rem, 5vw, 4.5rem);
	height: auto;
	min-height: 42vh;
	isolation: isolate;
}

.home-below.page-box > * {
	position: relative;
	z-index: 1;
}

.home-below.page-box > .home-hero-wave {
	z-index: 2;
}

.home-below .info-layout-wrap {
	max-width: min(1540px, 100%);
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

/* Onda: transição suave do hero para a área com promo_bg */
.home-hero-wave {
	position: relative;
	margin-top: -1px;
	line-height: 0;
	overflow: hidden;
	background: transparent;
}

.home-hero-wave svg {
	display: block;
	width: 100%;
	height: clamp(44px, 7vw, 88px);
}

.home-hero-wave__fill {
	fill: #f2f2f2;
}

.home-hero-wave path[stroke] {
	stroke: rgba(0, 0, 0, 0.06);
}

.home-panel-head--center {
	text-align: center;
}

.home-panel-head--center .info-panel__kicker {
	justify-content: center;
}

.home-panel-head--center .info-panel__title {
	margin-left: auto;
	margin-right: auto;
}

.home-panel-head--center .info-panel__lead {
	margin-left: auto;
	margin-right: auto;
}

/* Título extra acima de “Destaques do servidor” — hierarquia + gradiente */
.home-below .home-bento-head__overtitle {
	font-family: "Roboto Condensed", "Open Sans", sans-serif;
	font-size: clamp(1.08rem, 2.6vw, 1.42rem);
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	margin: 0 auto 0.85rem;
	max-width: 28rem;
	text-wrap: balance;
	background: linear-gradient(105deg, #1d4ed8 0%, #4eacff 42%, #6366f1 78%, #7c3aed 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

@supports not (background-clip: text) {
	.home-below .home-bento-head__overtitle {
		color: #2b8ae8;
		background: none;
	}
}

.home-below .home-bento-head__overtitle::after {
	content: "";
	display: block;
	width: min(3.5rem, 18vw);
	height: 3px;
	margin: 0.65rem auto 0;
	border-radius: 3px;
	background: linear-gradient(90deg, #4eacff, #a78bfa);
	opacity: 0.85;
}

.home-below .home-promo-cards__overtitle {
	display: block;
	text-align: center;
	margin-bottom: 0.5rem;
	max-width: 34rem;
}

.home-below .home-promo-cards__tagline {
	font-size: clamp(0.92rem, 2vw, 1.05rem);
	line-height: 1.55;
	color: #5a6573;
	text-align: center;
	max-width: 36rem;
	margin: 0 auto clamp(1.2rem, 3vw, 1.65rem);
	text-wrap: balance;
}

/* Home: sem halo azul ao redor dos painéis (fundo promo_bg aparece limpo) */
.home-below .info-layout-wrap::before {
	content: none;
}

.home-below .info-panel:not(.home-bento-panel):not(.home-spotlight-panel):not(.home-promo-panel) {
	background: #fff;
	border: 1px solid rgba(15, 23, 42, 0.08);
	box-shadow: 0 8px 32px rgba(15, 23, 42, 0.07);
}

.home-below .info-panel:not(.home-bento-panel):not(.home-spotlight-panel):not(.home-promo-panel)::before {
	height: 3px;
	background: linear-gradient(90deg, #e2e8f0, #cbd5e1, #e2e8f0);
}

/* —— Destaques do servidor: showcase com acentos por cartão —— */
.home-bento-showcase {
	position: relative;
}

.home-bento-panel {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(ellipse 80% 55% at 50% -8%, rgba(78, 172, 255, 0.14) 0%, transparent 58%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, #fff 42%, #f8fbff 100%);
	border: 1px solid rgba(78, 172, 255, 0.22);
	box-shadow:
		0 18px 52px rgba(15, 23, 42, 0.1),
		0 0 0 1px rgba(255, 255, 255, 0.75) inset;
}

.home-bento-panel::before {
	height: 4px;
	background: linear-gradient(
		90deg,
		#1d4ed8 0%,
		#4eacff 35%,
		#7ec4ff 55%,
		#4eacff 75%,
		#6366f1 100%
	);
}

.home-bento-panel__glow {
	position: absolute;
	inset: auto -12% -35% -12%;
	height: 55%;
	background: radial-gradient(ellipse at 50% 0%, rgba(78, 172, 255, 0.16) 0%, transparent 68%);
	pointer-events: none;
	z-index: 0;
}

.home-bento-panel__title {
	max-width: 22ch;
	text-wrap: balance;
}

.home-bento-panel__lead {
	margin: 0.85rem auto 0;
	max-width: 38rem;
	font-size: clamp(0.92rem, 1.85vw, 1.04rem);
	line-height: 1.58;
	color: #5a6573;
	text-wrap: balance;
}

.home-bento-panel__body {
	position: relative;
	z-index: 1;
	padding-top: 1.15rem;
}

.home-bento__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.85rem;
}

@media (min-width: 576px) {
	.home-bento__grid {
		gap: 1rem;
	}
}

@media (min-width: 768px) {
	.home-bento__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1200px) {
	.home-bento__grid {
		grid-template-columns: repeat(5, minmax(0, 1fr));
		gap: 1.05rem;
	}
}

/* Acentos por cartão */
.home-bento__cell[data-accent="cyan"] {
	--bento-accent: #0ea5e9;
	--bento-accent-soft: rgba(14, 165, 233, 0.22);
	--bento-accent-glow: rgba(14, 165, 233, 0.42);
}

.home-bento__cell[data-accent="amber"] {
	--bento-accent: #f59e0b;
	--bento-accent-soft: rgba(245, 158, 11, 0.24);
	--bento-accent-glow: rgba(245, 158, 11, 0.45);
}

.home-bento__cell[data-accent="emerald"] {
	--bento-accent: #22c55e;
	--bento-accent-soft: rgba(34, 197, 94, 0.22);
	--bento-accent-glow: rgba(34, 197, 94, 0.42);
}

.home-bento__cell[data-accent="rose"] {
	--bento-accent: #ec4899;
	--bento-accent-soft: rgba(236, 72, 153, 0.22);
	--bento-accent-glow: rgba(236, 72, 153, 0.42);
}

.home-bento__cell[data-accent="violet"] {
	--bento-accent: #a855f7;
	--bento-accent-soft: rgba(99, 102, 241, 0.22);
	--bento-accent-glow: rgba(99, 102, 241, 0.42);
}

.home-bento__cell {
	position: relative;
	min-height: 210px;
	aspect-ratio: 3 / 4;
	max-height: 380px;
	border-radius: 16px;
	overflow: hidden;
	border: 2px solid rgba(255, 255, 255, 0.65);
	box-shadow:
		0 10px 32px rgba(15, 23, 42, 0.12),
		0 0 0 1px rgba(15, 23, 42, 0.06);
	transition:
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.35s ease,
		border-color 0.35s ease;
}

.home-bento__cell::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	border-radius: inherit;
	box-shadow: inset 0 0 0 1px var(--bento-accent-soft);
	opacity: 0.85;
	pointer-events: none;
	transition: opacity 0.35s ease;
}

.home-bento__cell:hover,
.home-bento__cell:focus-within {
	transform: translateY(-6px) scale(1.02);
	border-color: var(--bento-accent);
	box-shadow:
		0 22px 48px rgba(15, 23, 42, 0.16),
		0 0 0 1px var(--bento-accent-soft),
		0 0 28px var(--bento-accent-glow);
}

.home-bento__cell:hover::before,
.home-bento__cell:focus-within::before {
	opacity: 1;
}

.home-bento__cell a {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	height: 100%;
	min-height: inherit;
	color: inherit;
	text-decoration: none;
}

.home-bento__cell a:focus-visible {
	outline: 2px solid var(--bento-accent);
	outline-offset: 3px;
}

.home-bento__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.home-bento__cell:hover .home-bento__img,
.home-bento__cell:focus-within .home-bento__img {
	transform: scale(1.08);
}

.home-bento__overlay {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(15, 23, 42, 0.08) 0%, transparent 28%),
		linear-gradient(180deg, transparent 32%, rgba(15, 23, 42, 0.35) 62%, rgba(15, 23, 42, 0.92) 100%);
	pointer-events: none;
	z-index: 2;
	transition: opacity 0.35s ease;
}

.home-bento__cell:hover .home-bento__overlay,
.home-bento__cell:focus-within .home-bento__overlay {
	background:
		linear-gradient(180deg, rgba(15, 23, 42, 0.04) 0%, transparent 22%),
		linear-gradient(180deg, transparent 28%, color-mix(in srgb, var(--bento-accent) 18%, rgba(15, 23, 42, 0.88)) 68%, rgba(15, 23, 42, 0.95) 100%);
}

.home-bento__shine {
	position: absolute;
	inset: -40% -60%;
	z-index: 3;
	background: linear-gradient(
		115deg,
		transparent 42%,
		rgba(255, 255, 255, 0.28) 50%,
		transparent 58%
	);
	transform: translateX(-120%) skewX(-12deg);
	pointer-events: none;
	transition: transform 0.75s ease;
}

.home-bento__cell:hover .home-bento__shine,
.home-bento__cell:focus-within .home-bento__shine {
	transform: translateX(120%) skewX(-12deg);
}

.home-bento__meta {
	position: relative;
	padding: 1.05rem 1.1rem 1.15rem;
	z-index: 4;
}

.home-bento__tag {
	display: inline-block;
	padding: 0.28rem 0.62rem;
	font-size: 0.58rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 700;
	color: #fff;
	margin-bottom: 0.45rem;
	border-radius: 999px;
	background: color-mix(in srgb, var(--bento-accent) 72%, rgba(15, 23, 42, 0.35));
	border: 1px solid rgba(255, 255, 255, 0.28);
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
}

.home-bento__title {
	margin: 0;
	font-family: "Roboto Condensed", "Open Sans", sans-serif;
	font-size: clamp(1rem, 2.1vw, 1.22rem);
	font-weight: 700;
	line-height: 1.15;
	color: #fff;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
}

.home-bento__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin-top: 0.55rem;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.92);
	opacity: 0;
	transform: translateY(6px);
	transition:
		opacity 0.3s ease,
		transform 0.3s ease,
		color 0.3s ease;
}

.home-bento__cta i {
	font-size: 0.68rem;
	transition: transform 0.3s ease;
}

.home-bento__cell:hover .home-bento__cta,
.home-bento__cell:focus-within .home-bento__cta {
	opacity: 1;
	transform: translateY(0);
	color: #fff;
}

.home-bento__cell:hover .home-bento__cta i,
.home-bento__cell:focus-within .home-bento__cta i {
	transform: translateX(3px);
}

@media (max-width: 575.98px) {
	.home-bento__grid {
		display: flex;
		gap: 0.85rem;
		overflow-x: auto;
		padding-bottom: 0.35rem;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
		scrollbar-color: rgba(78, 172, 255, 0.45) transparent;
	}

	.home-bento__cell {
		flex: 0 0 min(72vw, 260px);
		scroll-snap-align: start;
	}

	.home-bento__cta {
		opacity: 1;
		transform: none;
	}
}

/* Miniaturas nos painéis (legado / ranking) */
.home-promo-thumb {
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid rgba(15, 23, 42, 0.1);
	margin-bottom: 1rem;
	box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
}

.home-promo-thumb img {
	display: block;
	width: 100%;
	height: 200px;
	object-fit: cover;
	object-position: center;
}

.home-promo-thumb--rank .home-promo-panel__visual--ranking {
	height: 200px;
	margin: 0;
	border: none;
	border-radius: 0;
}

.home-promo-panel__visual--ranking {
	background: url("../images/bg-ranking.gif") center 38% / cover no-repeat;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding-bottom: 0.85rem;
}

.home-podium {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	gap: 0.45rem;
	height: 120px;
}

.home-podium__stand {
	width: 64px;
	border-radius: 6px 6px 0 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 800;
	font-size: 1.35rem;
	color: rgba(255, 255, 255, 0.95);
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-bottom: none;
}

.home-podium__stand--2 {
	height: 64px;
	background: linear-gradient(180deg, #64748b, #475569);
}

.home-podium__stand--1 {
	height: 88px;
	width: 72px;
	background: linear-gradient(180deg, #fbbf24, #d97706);
	color: #1e293b;
	text-shadow: none;
}

.home-podium__stand--3 {
	height: 50px;
	background: linear-gradient(180deg, #ea580c, #9a3412);
}

.home-section-block .btn-primary.rounded-pill,
.home-section-block .btn-outline-primary.rounded-pill {
	font-weight: 700;
	font-size: 0.82rem;
	padding: 0.45rem 1rem;
}

.home-section-block .btn-outline-primary.rounded-pill {
	border-width: 2px;
}

/* —— Mais formas de jogar: showcase —— */
.home-promo-showcase {
	position: relative;
}

.home-promo-panel {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(ellipse 75% 50% at 50% -5%, rgba(78, 172, 255, 0.13) 0%, transparent 58%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, #fff 45%, #f8fbff 100%);
	border: 1px solid rgba(78, 172, 255, 0.22);
	box-shadow:
		0 18px 52px rgba(15, 23, 42, 0.1),
		0 0 0 1px rgba(255, 255, 255, 0.75) inset;
}

.home-promo-panel::before {
	height: 4px;
	background: linear-gradient(
		90deg,
		#1d4ed8 0%,
		#4eacff 35%,
		#7ec4ff 55%,
		#4eacff 75%,
		#6366f1 100%
	);
}

.home-promo-panel__glow {
	position: absolute;
	inset: auto -10% -30% -10%;
	height: 50%;
	background: radial-gradient(ellipse at 50% 0%, rgba(78, 172, 255, 0.1) 0%, transparent 68%);
	pointer-events: none;
	z-index: 0;
}

.home-promo-panel__title {
	max-width: 28ch;
	text-wrap: balance;
}

.home-promo-panel__lead {
	margin: 0.85rem auto 0;
	max-width: 34rem;
	font-size: clamp(0.92rem, 1.85vw, 1.04rem);
	line-height: 1.58;
	color: #5a6573;
	text-wrap: balance;
}

.home-promo-panel__body {
	position: relative;
	z-index: 1;
	padding-top: 0.35rem;
}

.home-promo__grid > [class*="col-"] {
	min-width: 0;
}

.home-promo-card[data-accent="cyan"] {
	--promo-accent: #0ea5e9;
	--promo-accent-soft: rgba(14, 165, 233, 0.16);
	--promo-accent-glow: rgba(14, 165, 233, 0.34);
}

.home-promo-card[data-accent="rose"] {
	--promo-accent: #ec4899;
	--promo-accent-soft: rgba(236, 72, 153, 0.16);
	--promo-accent-glow: rgba(236, 72, 153, 0.34);
}

.home-promo-card[data-accent="amber"] {
	--promo-accent: #f59e0b;
	--promo-accent-soft: rgba(245, 158, 11, 0.16);
	--promo-accent-glow: rgba(245, 158, 11, 0.34);
}

.home-promo-card[data-accent="violet"] {
	--promo-accent: #a855f7;
	--promo-accent-soft: rgba(168, 85, 247, 0.16);
	--promo-accent-glow: rgba(168, 85, 247, 0.34);
}

.home-promo-card {
	position: relative;
	flex: 1 1 auto;
	width: 100%;
	border-radius: 16px;
	overflow: hidden;
	background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
	border: 1px solid rgba(15, 23, 42, 0.08);
	box-shadow: 0 8px 28px rgba(15, 23, 42, 0.07);
	transition:
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.35s ease,
		border-color 0.35s ease;
}

.home-promo-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--promo-accent), color-mix(in srgb, var(--promo-accent) 55%, #4eacff));
	opacity: 0.85;
	z-index: 2;
	transition: opacity 0.35s ease;
}

.home-promo-card:hover,
.home-promo-card:focus-within {
	transform: translateY(-6px);
	border-color: color-mix(in srgb, var(--promo-accent) 45%, rgba(78, 172, 255, 0.35));
	box-shadow:
		0 20px 44px rgba(15, 23, 42, 0.12),
		0 0 0 1px var(--promo-accent-soft),
		0 0 26px var(--promo-accent-glow);
}

.home-promo-card:hover::before,
.home-promo-card:focus-within::before {
	opacity: 1;
}

.home-promo-card__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.home-promo-card__link:focus-visible {
	outline: 2px solid var(--promo-accent, #4eacff);
	outline-offset: 3px;
	border-radius: 16px;
}

.home-promo-card__thumb {
	position: relative;
	overflow: hidden;
	aspect-ratio: 16 / 10;
	border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.home-promo-card__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.home-promo-card:hover .home-promo-card__thumb img,
.home-promo-card:focus-within .home-promo-card__thumb img {
	transform: scale(1.07);
}

.home-promo-card__thumb-frame {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(15, 23, 42, 0.04) 0%, transparent 40%, rgba(15, 23, 42, 0.08) 100%);
	pointer-events: none;
	transition: background 0.35s ease;
}

.home-promo-card:hover .home-promo-card__thumb-frame,
.home-promo-card:focus-within .home-promo-card__thumb-frame {
	background: linear-gradient(180deg, transparent 0%, color-mix(in srgb, var(--promo-accent) 12%, transparent) 100%);
}

.home-promo-card__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	padding: 1rem 1.1rem 1.15rem;
}

.home-promo-card__tag {
	display: inline-block;
	align-self: flex-start;
	padding: 0.26rem 0.62rem;
	margin-bottom: 0.55rem;
	font-size: 0.58rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--promo-accent);
	border-radius: 999px;
	background: var(--promo-accent-soft);
	border: 1px solid color-mix(in srgb, var(--promo-accent) 35%, transparent);
}

.home-promo-card__title {
	margin: 0 0 0.55rem;
	font-family: "Roboto Condensed", "Open Sans", sans-serif;
	font-size: clamp(1rem, 2vw, 1.12rem);
	font-weight: 700;
	line-height: 1.2;
	color: #0f172a;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.home-promo-card__desc {
	flex: 1 1 auto;
	margin: 0 0 1rem;
	font-size: 0.875rem;
	line-height: 1.55;
	color: #64748b;
}

.home-promo-card__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	margin-top: auto;
	align-self: flex-start;
	padding: 0.48rem 1rem;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #fff;
	border-radius: 999px;
	background: linear-gradient(135deg, var(--promo-accent), color-mix(in srgb, var(--promo-accent) 70%, #4eacff));
	box-shadow: 0 4px 16px var(--promo-accent-glow);
	transition:
		transform 0.3s ease,
		box-shadow 0.3s ease,
		gap 0.3s ease;
}

.home-promo-card__cta i {
	font-size: 0.68rem;
	transition: transform 0.3s ease;
}

.home-promo-card:hover .home-promo-card__cta,
.home-promo-card:focus-within .home-promo-card__cta {
	box-shadow: 0 6px 22px var(--promo-accent-glow);
}

.home-promo-card:hover .home-promo-card__cta i,
.home-promo-card:focus-within .home-promo-card__cta i {
	transform: translateX(3px);
}

@media (max-width: 767.98px) {
	.home-promo__grid {
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		gap: 0.85rem;
		margin-left: -0.25rem;
		margin-right: -0.25rem;
		padding-bottom: 0.35rem;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
		scrollbar-color: rgba(78, 172, 255, 0.45) transparent;
	}

	.home-promo__grid > [class*="col-"] {
		flex: 0 0 min(82vw, 320px);
		scroll-snap-align: start;
	}
}

/* Espaçamento entre blocos */
.home-below .info-panel + .info-panel {
	margin-top: 0;
}

.home-section-block {
	margin-bottom: 1.75rem;
}

@media (min-width: 992px) {
	.home-section-block {
		margin-bottom: 2rem;
	}
}

/* —— Instâncias & loot: showcase —— */
.home-spotlight-showcase {
	position: relative;
}

.home-spotlight-panel {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(ellipse 70% 50% at 12% 0%, rgba(78, 172, 255, 0.12) 0%, transparent 55%),
		radial-gradient(ellipse 55% 45% at 88% 100%, rgba(78, 172, 255, 0.08) 0%, transparent 52%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, #fff 50%, #f8fbff 100%);
	border: 1px solid rgba(78, 172, 255, 0.22);
	box-shadow:
		0 18px 52px rgba(15, 23, 42, 0.1),
		0 0 0 1px rgba(255, 255, 255, 0.75) inset;
}

.home-spotlight-panel::before {
	height: 4px;
	background: linear-gradient(
		90deg,
		#1d4ed8 0%,
		#4eacff 35%,
		#7ec4ff 55%,
		#4eacff 75%,
		#6366f1 100%
	);
}

.home-spotlight-panel__glow {
	position: absolute;
	inset: -20% -8% auto -8%;
	height: 50%;
	background: radial-gradient(ellipse at 18% 80%, rgba(78, 172, 255, 0.14) 0%, transparent 62%);
	pointer-events: none;
	z-index: 0;
}

.home-spotlight-panel__body {
	position: relative;
	z-index: 1;
	padding: clamp(1.35rem, 3vw, 2rem) clamp(1.25rem, 3vw, 2.35rem) clamp(1.5rem, 3.5vw, 2.35rem);
}

.home-spotlight__overtitle {
	display: block;
	text-align: left;
	margin: 0 0 0.75rem;
	max-width: none;
}

.home-spotlight__overtitle::after {
	margin-left: 0;
	margin-right: auto;
}

.home-spotlight__title {
	margin-bottom: 0.65rem;
	text-wrap: balance;
}

.home-below .home-spotlight__lead {
	margin: 0 0 1.35rem;
	max-width: 38rem;
	font-size: clamp(0.92rem, 1.75vw, 1.02rem);
	line-height: 1.58;
	color: #5a6573;
}

.home-below .home-spotlight__visual {
	position: relative;
	border-radius: 16px;
	overflow: hidden;
	border: 2px solid rgba(78, 172, 255, 0.28);
	box-shadow:
		0 14px 40px rgba(15, 23, 42, 0.14),
		0 0 0 1px rgba(255, 255, 255, 0.55) inset;
	aspect-ratio: 4 / 5;
	max-height: min(420px, 70vh);
	margin-inline: auto;
	max-width: 400px;
	transition:
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.35s ease,
		border-color 0.35s ease;
}

.home-spotlight__visual-frame {
	position: absolute;
	inset: 0;
	z-index: 2;
	border-radius: inherit;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
	background: linear-gradient(180deg, rgba(78, 172, 255, 0.08) 0%, transparent 35%, rgba(15, 23, 42, 0.12) 100%);
	pointer-events: none;
	transition: opacity 0.35s ease;
}

.home-below .home-spotlight__visual:hover {
	transform: translateY(-6px) scale(1.02);
	border-color: rgba(78, 172, 255, 0.55);
	box-shadow:
		0 22px 48px rgba(15, 23, 42, 0.16),
		0 0 28px rgba(78, 172, 255, 0.28);
}

@media (min-width: 992px) {
	.home-below .home-spotlight__visual {
		max-width: none;
		margin-inline: 0;
		max-height: 440px;
	}
}

.home-below .home-spotlight__visual img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.home-below .home-spotlight__visual:hover img {
	transform: scale(1.06);
}

.home-below .home-spotlight__list {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.home-spotlight__row[data-accent="amber"] {
	--spot-accent: #f59e0b;
	--spot-accent-soft: rgba(245, 158, 11, 0.16);
	--spot-accent-glow: rgba(245, 158, 11, 0.32);
}

.home-spotlight__row[data-accent="emerald"] {
	--spot-accent: #22c55e;
	--spot-accent-soft: rgba(34, 197, 94, 0.16);
	--spot-accent-glow: rgba(34, 197, 94, 0.32);
}

.home-spotlight__row[data-accent="cyan"] {
	--spot-accent: #0ea5e9;
	--spot-accent-soft: rgba(14, 165, 233, 0.16);
	--spot-accent-glow: rgba(14, 165, 233, 0.32);
}

.home-below .home-spotlight__row {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	padding: 0.95rem 1.1rem;
	border-radius: 14px;
	text-decoration: none;
	color: inherit;
	background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
	border: 1px solid rgba(15, 23, 42, 0.08);
	box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
	transition:
		background 0.3s ease,
		border-color 0.3s ease,
		box-shadow 0.3s ease,
		transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.home-below .home-spotlight__row:hover,
.home-below .home-spotlight__row:focus-visible {
	background: linear-gradient(135deg, #fff 0%, color-mix(in srgb, var(--spot-accent) 6%, #fff) 100%);
	border-color: color-mix(in srgb, var(--spot-accent) 45%, rgba(78, 172, 255, 0.35));
	box-shadow:
		0 10px 28px rgba(15, 23, 42, 0.08),
		0 0 0 1px var(--spot-accent-soft),
		0 0 22px var(--spot-accent-glow);
	transform: translateY(-3px);
}

.home-below .home-spotlight__row:focus-visible {
	outline: 2px solid var(--spot-accent, #4eacff);
	outline-offset: 3px;
}

.home-below .home-spotlight__ico {
	flex-shrink: 0;
	width: 2.75rem;
	height: 2.75rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	font-size: 1.08rem;
	color: var(--spot-accent, #2b8ae8);
	background: var(--spot-accent-soft, rgba(78, 172, 255, 0.12));
	border: 1px solid color-mix(in srgb, var(--spot-accent, #4eacff) 35%, transparent);
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
	transition:
		transform 0.3s ease,
		box-shadow 0.3s ease;
}

.home-below .home-spotlight__row:hover .home-spotlight__ico,
.home-below .home-spotlight__row:focus-visible .home-spotlight__ico {
	transform: scale(1.06);
	box-shadow: 0 6px 18px var(--spot-accent-glow, rgba(78, 172, 255, 0.2));
}

.home-below .home-spotlight__row-body {
	min-width: 0;
	flex: 1;
}

.home-below .home-spotlight__row-title {
	display: block;
	font-family: "Roboto Condensed", "Open Sans", sans-serif;
	font-size: 1.02rem;
	font-weight: 700;
	color: #0f172a;
	letter-spacing: 0.01em;
}

.home-below .home-spotlight__row-desc {
	display: block;
	margin-top: 0.22rem;
	font-size: 0.875rem;
	line-height: 1.48;
	color: #64748b;
}

.home-spotlight__arrow {
	flex-shrink: 0;
	width: 2rem;
	height: 2rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	font-size: 0.72rem;
	color: var(--spot-accent, #2b8ae8);
	background: var(--spot-accent-soft, rgba(78, 172, 255, 0.12));
	opacity: 0;
	transform: translateX(-6px);
	transition:
		opacity 0.3s ease,
		transform 0.3s ease,
		background 0.3s ease,
		color 0.3s ease;
}

.home-below .home-spotlight__row:hover .home-spotlight__arrow,
.home-below .home-spotlight__row:focus-visible .home-spotlight__arrow {
	opacity: 1;
	transform: translateX(0);
}

@media (max-width: 575.98px) {
	.home-spotlight__arrow {
		opacity: 1;
		transform: none;
	}

	.home-below .home-spotlight__row {
		padding: 0.85rem 0.95rem;
	}
}

/* Popup Festa da Pipoca — cartaz na index com X */
.popup.popup--pipoca {
	z-index: 4000;
	padding: 24px;
	background: transparent;
}

.popup.popup--pipoca .popup__bg {
	background: rgba(8, 10, 18, 0.78);
	backdrop-filter: blur(6px);
}

.popup.popup--pipoca .popup--pipoca__content {
	max-width: min(560px, 92vw);
	margin: 0 auto;
}

.popup.popup--pipoca .popup__cancel {
	top: -12px;
	right: -12px;
	width: 44px;
	height: 44px;
	border: 0;
	padding: 0;
	z-index: 3;
	color: #fff;
	font-size: 28px;
	line-height: 1;
	background-color: #4eacff;
}

.popup.popup--pipoca .popup--pipoca__close span {
	display: block;
	margin-top: -2px;
	font-weight: 700;
}

.popup--pipoca__link {
	display: block;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
	background: #111;
}

.popup--pipoca__img {
	display: block;
	width: 100%;
	height: auto;
	max-height: min(78vh, 880px);
	object-fit: contain;
}

.popup--pipoca__cta {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 12px;
	padding: 0.7rem 1rem;
	border-radius: 12px;
	background: #4eacff;
	color: #fff;
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none;
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
}

.popup--pipoca__cta:hover,
.popup--pipoca__cta:focus {
	color: #fff;
	background: #3b97e8;
	text-decoration: none;
}

body.popup-pipoca-open {
	overflow: hidden;
}

@media (max-width: 575.98px) {
	.popup.popup--pipoca {
		padding: 16px;
	}

	.popup.popup--pipoca .popup__cancel {
		top: 8px;
		right: 8px;
	}
}

