/**
 * Atalhos da home — 3 boxes na divisa Home → Como participar
 * Ref visual: Point Tap / Andes landings shortcuts
 */

/* Espaço no fim do hero para os cards sobreporem a divisa sem colidir com o CPF */
.hero__content {
	padding-bottom: clamp(8rem, 14vh, 14rem);
}

.home-shortcuts {
	--hs-card-bg: #00361a;
	--hs-card-top: #0b5e2b;
	--hs-lime: #a5fa00;
	--hs-shadow: 0 0 0 1px rgba(165, 250, 0, 0.55), 0 0 18px rgba(165, 250, 0, 0.35), 0 12px 24px rgba(0, 40, 15, 0.35);
	--hs-shadow-hover: 0 0 0 1px rgba(165, 250, 0, 0.9), 0 0 28px rgba(165, 250, 0, 0.6), 0 16px 30px rgba(0, 40, 15, 0.4);
	--hs-blue: #00361a;
	--hs-text: #ffffff;
	position: relative;
	z-index: 6;
	width: min(100% - 3.2rem, 112rem);
	margin: -10rem auto -5.6rem;
	padding: 0;
	box-sizing: border-box;
	pointer-events: auto;
}

.home-shortcuts__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.6rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.home-shortcuts__card {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 16.4rem;
	padding: 1.6rem 1.6rem 2.4rem;
	background:
		radial-gradient(70% 60% at 50% 32%, rgba(165, 250, 0, 0.22) 0%, rgba(165, 250, 0, 0) 70%),
		linear-gradient(180deg, var(--hs-card-top) 0%, var(--hs-card-bg) 100%);
	border: 2px solid var(--hs-lime);
	border-radius: 1.8rem;
	box-shadow: var(--hs-shadow), inset 0 0 14px rgba(165, 250, 0, 0.18);
	text-align: center;
	text-decoration: none;
	color: var(--hs-text);
	transition:
		transform 0.3s ease,
		box-shadow 0.3s ease;
}

.home-shortcuts__card:hover {
	transform: translateY(-0.4rem);
	box-shadow: var(--hs-shadow-hover), inset 0 0 18px rgba(165, 250, 0, 0.28);
}

.home-shortcuts__card:hover .home-shortcuts__thumb img {
	transform: scale(1.08) rotate(-3deg);
}

.home-shortcuts__card:focus-visible {
	outline: none;
	box-shadow:
		0 0 0 3px #ffffff,
		0 0 0 6px var(--hs-card-bg),
		var(--hs-shadow-hover);
}

.home-shortcuts__thumb {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 12rem;
	height: 8.4rem;
	margin: 0 0 1.4rem;
	padding: 0.6rem;
	box-sizing: border-box;
}

.home-shortcuts__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	filter: drop-shadow(0 6px 10px rgba(0, 30, 10, 0.45));
	transition: transform 0.3s ease;
	pointer-events: none;
	user-select: none;
	-webkit-user-drag: none;
}

.home-shortcuts__label {
	transition: color 0.3s ease;
	margin: 0;
	max-width: 100%;
	font-family: var(--font-heading, "Inter", sans-serif);
	font-size: 1.8rem;
	font-weight: 700;
	line-height: 1.25;
	color: var(--hs-text);
}

.home-shortcuts__card:hover .home-shortcuts__label {
	color: var(--hs-lime);
}

/* Ponteira lime + chevron verde-escuro (liquid tip) */
.home-shortcuts__tip {
	position: absolute;
	top: calc(100% + 1px);
	left: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 11.2rem;
	height: 3rem;
	transform: translateX(-50%) rotate(180deg);
	pointer-events: none;
}

.home-shortcuts__tip::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--hs-lime);
	clip-path: polygon(
		100% 29.85px,
		99% 29.8727px,
		98% 29.8671px,
		97% 29.8196px,
		96% 29.7243px,
		95% 29.5806px,
		94% 29.3915px,
		93% 29.1623px,
		92% 28.8993px,
		91% 28.6087px,
		90% 28.2958px,
		89% 27.9643px,
		88% 27.6162px,
		87% 27.2507px,
		86% 26.8651px,
		85% 26.4543px,
		84% 26.0117px,
		83% 25.5289px,
		82% 24.9974px,
		81% 24.4082px,
		80% 23.7532px,
		79% 23.0258px,
		78% 22.2211px,
		77% 21.337px,
		76% 20.3739px,
		75% 19.3354px,
		74% 18.228px,
		73% 17.0612px,
		72% 15.8469px,
		71% 14.5992px,
		70% 13.3338px,
		69% 12.0673px,
		68% 10.8163px,
		67% 9.59733px,
		66% 8.42565px,
		65% 7.31494px,
		64% 6.27678px,
		63% 5.32028px,
		62% 4.45191px,
		61% 3.67537px,
		60% 2.99174px,
		59% 2.3996px,
		58% 1.89545px,
		57% 1.47407px,
		56% 1.12905px,
		55% 0.853332px,
		54% 0.639775px,
		53% 0.481672px,
		52% 0.373244px,
		51% 0.310053px,
		50% 0.289306px,
		49% 0.310053px,
		48% 0.373244px,
		47% 0.481672px,
		46% 0.639775px,
		45% 0.853332px,
		44% 1.12905px,
		43% 1.47407px,
		42% 1.89545px,
		41% 2.3996px,
		40% 2.99174px,
		39% 3.67537px,
		38% 4.45191px,
		37% 5.32028px,
		36% 6.27678px,
		35% 7.31494px,
		34% 8.42565px,
		33% 9.59733px,
		32% 10.8163px,
		31% 12.0673px,
		30% 13.3338px,
		29% 14.5992px,
		28% 15.8469px,
		27% 17.0612px,
		26% 18.228px,
		25% 19.3354px,
		24% 20.3739px,
		23% 21.337px,
		22% 22.2211px,
		21% 23.0258px,
		20% 23.7532px,
		19% 24.4082px,
		18% 24.9974px,
		17% 25.5289px,
		16% 26.0117px,
		15% 26.4543px,
		14% 26.8651px,
		13% 27.2507px,
		12% 27.6162px,
		11% 27.9643px,
		10% 28.2958px,
		9% 28.6087px,
		8% 28.8993px,
		7% 29.1623px,
		6% 29.3915px,
		5% 29.5806px,
		4% 29.7243px,
		3% 29.8196px,
		2% 29.8671px,
		1% 29.8727px,
		0 29.85px,
		0 100%,
		100% 100%
	);
}

.home-shortcuts__tip svg {
	position: relative;
	z-index: 1;
	width: 1.6rem;
	height: 1.6rem;
	color: var(--hs-blue);
	transition: transform 0.3s ease;
}

.home-shortcuts__card:hover .home-shortcuts__tip svg {
	transform: translateY(0.4rem);
}

/* Mobile — 3 cards lado a lado */
@media (max-width: 767px) {
	.home-shortcuts {
		width: min(100% - 2.4rem, 100%);
		margin: -5.6rem auto -3.2rem;
		padding: 0 0.4rem;
	}

	.home-shortcuts__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 0.8rem;
	}

	.home-shortcuts__card {
		min-height: 12.8rem;
		min-width: 0;
		padding: 1.2rem 0.6rem 1.8rem;
		border-radius: 1.2rem;
		border-width: 1.5px;
	}

	.home-shortcuts__thumb {
		width: 100%;
		max-width: 7.2rem;
		height: 6rem;
		margin: 0 0 0.8rem;
		padding: 0.2rem;
	}

	.home-shortcuts__label {
		font-size: 1.2rem;
		line-height: 1.2;
		word-break: break-word;
		hyphens: auto;
	}

	.home-shortcuts__tip {
		width: 7.2rem;
		height: 2.2rem;
	}

	.home-shortcuts__tip svg {
		width: 1.4rem;
		height: 1.4rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.home-shortcuts__card,
	.home-shortcuts__thumb img,
	.home-shortcuts__tip svg {
		transition: none;
	}

	.home-shortcuts__card:hover .home-shortcuts__thumb img {
		transform: none;
	}

	.home-shortcuts__card:hover {
		transform: none;
	}

	.home-shortcuts__card:hover .home-shortcuts__tip svg {
		transform: translateY(0.2rem);
	}
}