/* ==========================================================================
   NOSCASAMOS.MX — Home Hub Section Styles
   Used by: home() in homeUi.php
   ========================================================================== */

/* Service cards */
.nc-services {
	padding: 110px 0;
	background: var(--white);
}
.svc-card {
	border: 1px solid rgba(0,0,0,0.04);
	border-radius: 24px;
	overflow: hidden;
	background: var(--white);
	transition: all 0.4s ease;
	height: 100%;
	text-decoration: none;
	display: block;
}
.svc-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 20px 60px rgba(166, 128, 124, 0.12);
	border-color: var(--rose-light);
}
.svc-card-visual {
	height: 220px;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	overflow: hidden;
}
.svc-card-visual-1 {
	background: linear-gradient(135deg, var(--champagne-light) 0%, var(--rose-light) 100%);
}
.svc-card-visual-2 {
	background: linear-gradient(135deg, var(--rose-light) 0%, var(--champagne-light) 100%);
}
.svc-card-visual i {
	font-size: 4rem;
	color: var(--rose-dark);
	opacity: 0.5;
	transition: all 0.4s ease;
}
.svc-card:hover .svc-card-visual i {
	transform: scale(1.15);
	opacity: 0.7;
}
.svc-card-visual::before {
	content: '';
	position: absolute;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	border: 1px solid rgba(0,0,0,0.04);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.svc-card-body {
	padding: 35px 30px;
	text-align: center;
}
.svc-card-body h3 {
	font-size: 1.8rem;
	font-weight: 400;
	color: var(--text);
	margin: 0 0 12px;
}
.svc-card-body p {
	font-size: 0.95rem;
	font-weight: 300;
	color: var(--text-light);
	line-height: 1.7;
	margin: 0 0 20px;
}
.svc-card-link {
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--rose-dark);
	transition: all 0.3s;
}
.svc-card:hover .svc-card-link {
	letter-spacing: 3px;
}

/* Why section */
.nc-why {
	padding: 110px 0;
	background: var(--cream);
}
.why-item {
	text-align: center;
	padding: 20px 15px;
}
.why-icon {
	width: 64px;
	height: 64px;
	margin: 0 auto 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--rose-light), var(--champagne-light));
	border-radius: 18px;
	transition: all 0.4s ease;
}
.why-icon i {
	font-size: 1.4rem;
	color: var(--rose-dark);
}
.why-item h6 {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	color: var(--text);
	margin-bottom: 6px;
}
.why-item p {
	font-size: 0.88rem;
	color: var(--text-light);
	font-weight: 300;
	line-height: 1.6;
}

/* CTA */
.nc-cta {
	padding: 110px 0;
	background: var(--white);
}
.cta-box {
	background: linear-gradient(135deg, var(--champagne-light) 0%, var(--rose-light) 100%);
	border-radius: 24px;
	padding: 70px 40px;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.cta-box::before {
	content: '';
	position: absolute;
	width: 400px;
	height: 400px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--rose) 0%, transparent 70%);
	opacity: 0.08;
	top: -30%;
	right: -10%;
}
.cta-box h2 {
	color: var(--text);
	position: relative;
	z-index: 2;
	margin-bottom: 15px;
}
.cta-box p {
	color: var(--text-light);
	font-size: 1.05rem;
	font-weight: 300;
	margin-bottom: 30px;
	position: relative;
	z-index: 2;
}

/* Responsive */
@media (max-width: 767px) {
	.nc-services, .nc-why, .nc-cta { padding: 70px 0; }
	.svc-card-visual { height: 160px; }
	.svc-card-visual i { font-size: 3rem; }
	.cta-box { padding: 50px 25px; }
}