/* ==================================================
   SPECIALITIES – VASAVI HOME FOODS
   Semantic + SEO Safe
================================================== */
.dr1007specialities {
	padding: 90px 20px;
	background: linear-gradient(180deg, #fffaf5, #fff1e6);
	font-family: 'Poppins', 'Montserrat', sans-serif;
	/* existing layout logic */
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 28px;
	align-items: stretch;
	text-align: center;
}

/* ===============================
   HEADER (h2 + description)
================================ */
.dr1007specialities .specialities-header {
	grid-column: 1/-1;
}

.dr1007specialities h2 {
	font-size: 36px;
	font-weight: 900;
	color: #7c2d12;
	margin-bottom: 14px;
	letter-spacing: -0.6px;
}

.dr1007specialities>header>p {
	font-size: 15.5px;
	color: #92400e;
	line-height: 1.9;
	max-width: 760px;
	margin: 0 auto 60px;
}

/* ===============================
   CARD
================================ */
.dr1007specialities .card {
	background: linear-gradient(180deg, #ffffff, #fffaf5);
	border-radius: 26px;
	padding: 26px 22px 30px;
	box-shadow: 0 24px 55px rgba(180, 83, 9, 0.18);
	position: relative;
	overflow: hidden;
	transition: transform 0.35s ease, box-shadow 0.35s ease;
}

/* Top decorative accent */
.dr1007specialities .card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 5px;
	background: linear-gradient(90deg, #f97316, #22c55e, #b45309);
}

/* Hover effect */
.dr1007specialities .card:hover {
	transform: translateY(-8px) scale(1.02);
	box-shadow: 0 36px 80px rgba(180, 83, 9, 0.35);
}

/* ===============================
   CARD TITLE
================================ */
.dr1007specialities .card h3 {
	font-size: 20px;
	font-weight: 800;
	color: #7c2d12;
	margin-bottom: 18px;
}

/* ===============================
   IMAGE
================================ */
.dr1007specialities .card figure {
	margin: 0;
}

.dr1007specialities .card img {
	width: 100%;
	max-width: 220px;
	margin: 0 auto 22px;
	display: block;
	border-radius: 18px;
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.15);
	transition: transform 0.4s ease;
}

.dr1007specialities .card:hover img {
	transform: scale(1.06) rotate(-1deg);
}

/* ===============================
   WHATSAPP BUTTON
================================ */
.dr1007specialities .whatsapp-chat {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 15px 20px;
	border-radius: 999px;
	text-decoration: none;
	font-size: 15px;
	font-weight: 800;
	color: #ffffff;
	background: linear-gradient(135deg, #22c55e, #16a34a);
	box-shadow: 0 18px 40px rgba(34, 197, 94, 0.45), inset 0 0 0 1px
		rgba(255, 255, 255, 0.35);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* CTA Hover */
.dr1007specialities .whatsapp-chat:hover {
	transform: translateY(-3px) scale(1.05);
	box-shadow: 0 28px 65px rgba(34, 197, 94, 0.65);
}

/* ===============================
   ACCESSIBILITY – SCREEN READERS
================================ */
.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ===============================
   MOBILE RESPONSIVE
================================ */
@media ( max-width : 640px) {
	.dr1007specialities {
		padding: 70px 16px;
		gap: 22px;
	}
	.dr1007specialities h2 {
		font-size: 28px;
	}
	.dr1007specialities>header>p {
		font-size: 14.5px;
		margin-bottom: 44px;
	}
	.dr1007specialities .card {
		padding: 24px 18px 26px;
	}
}