/* ---------- Discover section (plugin: DiscoverPlugin, #descopera) ---------- */

.discover {
	padding: var(--s12) 0;
	position: relative;
}

.discover .container {
	width: 100%;
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 var(--s3);
}

.discover .section-head {
	margin: 0 auto var(--s8);
	text-align: center;
}

.discover .section-head .kicker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 800;
	font-size: .82rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--orange);
	margin-bottom: var(--s2);
}

.discover .kicker .dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--yellow);
	display: inline-block;
}

.discover .section-head h2 {
	font-family: var(--font-display);
	font-size: clamp(1.8rem, 3.6vw, 2.6rem);
	line-height: 1.15;
	margin: 0 0 var(--s2);
	color: var(--color-text);
}

.discover .section-head p {
	color: var(--color-text-muted);
	font-size: 1.06rem;
	max-width: 640px;
	margin: 0 auto;
}

/* ---------- Grid ---------- */

.disc-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--s2);
}

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

.disc-card {
	position: relative;
	overflow: hidden;
	border-radius: var(--r-lg);
	padding: var(--s4);
	min-height: 230px;
	text-decoration: none;
	color: var(--slate);
	box-shadow: var(--shadow-sm);
	display: flex;
	transition: transform .3s cubic-bezier(.34, 1.56, .64, 1), box-shadow .3s ease;
}

.disc-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--shadow-lg);
}

.disc-card:hover .bubble {
	transform: scale(1.2) translateY(10px);
}

.disc-card:hover:nth-child(even) .bubble {
	transform: scale(1.2) translateY(-10px);
}

/* color accents (icon color pairs with the card background) */
.disc-card--mint { background: var(--mint); }
.disc-card--mint .disc-ico { color: #2C7A52; }
.disc-card--pink { background: var(--pink); }
.disc-card--pink .disc-ico { color: #B83D63; }
.disc-card--yellow { background: var(--yellow); }
.disc-card--yellow .disc-ico { color: #8A6D00; }
.disc-card--peach { background: #F6B36B; }
.disc-card--peach .disc-ico { color: #B05E00; }
.disc-card--rose { background: #F6C6D4; }
.disc-card--rose .disc-ico { color: #B83D63; }

.disc-card .bubble {
	position: absolute;
	border-radius: 50%;
	z-index: 0;
	pointer-events: none;
	width: 120px;
	height: 120px;
	background: rgba(255, 255, 255, .28);
	top: -30px;
	right: -24px;
	transition:all .3s cubic-bezier(.34, 1.56, .64, 1);
}

/* vary the bubble position on every other card */
.disc-grid > .disc-card:nth-child(even) .bubble {
	top: auto;
	right: auto;
	bottom: -30px;
	left: -24px;
}

.disc-in {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
}

.disc-ico {
	width: 56px;
	height: 56px;
	border-radius: 18px;
	margin-bottom: var(--s2);
	background: rgba(255, 255, 255, .7);
	display: grid;
	place-items: center;
	box-shadow: var(--shadow-sm);
}

.disc-ico i[class^="icon-"] {
	font-size: 26px;
	line-height: 1;
}

.disc-card h3 {
	font-family: var(--font-display);
	margin: 0 0 6px;
	font-size: 1.25rem;
}

.disc-card p {
	margin: 0;
	font-size: .95rem;
	color: var(--slate-80);
}

.disc-more {
	margin-top: auto;
	padding-top: var(--s3);
	font-family: var(--font-display);
	font-weight: 700;
	font-size: .9rem;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.disc-more i[class^="icon-"] {
	font-size: 16px;
	line-height: 1;
	transition: transform .25s cubic-bezier(.34, 1.56, .64, 1);
}

.disc-card:hover .disc-more i[class^="icon-"] { transform: translateX(5px); }

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
	.disc-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
	.disc-grid { grid-template-columns: 1fr; }
}