:root {
	--teal-primary: #17b9c4;
	--teal-dark:    #0e969f;
	--teal-darker:  #0a7580;
	--teal-light:   #d0f2f4;
	--teal-xlight:  #edfbfc;
	--text-dark:    #1a2e35;
	--text-muted:   #5a7a80;
}

* { box-sizing: border-box; }

body {
	font-family: 'Inter', sans-serif;
	color: var(--text-dark);
	scroll-behavior: smooth;
}

/* ── NAVBAR ── */
.navbar {
	background: #fff;
	box-shadow: 0 2px 12px rgba(23,185,196,.15);
	padding: .9rem 0;
}
.navbar-brand {
	font-family: 'Playfair Display', serif;
	font-size: 1.6rem;
	color: var(--teal-primary) !important;
	letter-spacing: -.5px;
}
.navbar-brand span { color: var(--teal-darker); }
.nav-link {
	font-weight: 500;
	color: var(--text-dark) !important;
	padding: .4rem .9rem !important;
	border-radius: 6px;
	transition: all .2s;
}
.nav-link:hover, .nav-link.active {
	color: var(--teal-primary) !important;
	background: var(--teal-xlight);
}
.btn-nav-cta {
	background: var(--teal-primary);
	color: #fff !important;
	border-radius: 50px;
	padding: .45rem 1.4rem !important;
	font-weight: 600;
	transition: background .25s;
}
.btn-nav-cta:hover { background: var(--teal-dark); }
.brand-icon {
	font-size: 1.5rem;
	color: var(--teal-primary);
}

/* ── HERO ── */
#hero {
	background: linear-gradient(135deg, var(--teal-darker) 0%, var(--teal-primary) 60%, #4dd9e1 100%);
	min-height: 92vh;
	display: flex;
	align-items: center;
	position: relative;
	overflow: hidden;
}
#hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.hero-logo {
	width: clamp(140px, 22vw, 220px);
	height: auto;
	display: block;
	object-fit: contain;
	margin: 0 auto 1rem;
	filter: drop-shadow(0 8px 18px rgba(0,0,0,.2));
}
#hero h1 {
	font-family: 'Playfair Display', serif;
	font-size: clamp(2.2rem, 5vw, 3.6rem);
	color: #fff;
	line-height: 1.15;
	margin-bottom: 1.1rem;
}
#hero p.lead {
	color: rgba(255,255,255,.88);
	font-size: 1.08rem;
	max-width: 580px;
	line-height: 1.7;
}
.hero-cta-primary {
	background: #fff;
	color: var(--teal-darker) !important;
	border-radius: 50px;
	padding: .75rem 2rem;
	font-weight: 700;
	font-size: 1rem;
	border: none;
	box-shadow: 0 8px 24px rgba(0,0,0,.15);
	transition: transform .2s, box-shadow .2s;
}
.hero-cta-primary:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,0,0,.2); }
.hero-cta-secondary {
	background: transparent;
	color: #fff !important;
	border: 2px solid rgba(255,255,255,.6);
	border-radius: 50px;
	padding: .73rem 1.8rem;
	font-weight: 600;
	transition: all .2s;
}
.hero-cta-secondary:hover { background: rgba(255,255,255,.15); border-color: #fff; }
.hero-card {
	background: #fff;
	border-radius: 20px;
	padding: 1.8rem 2rem;
	box-shadow: 0 20px 60px rgba(0,0,0,.18);
}
.hero-stat big { font-size: 2rem; font-weight: 700; color: var(--teal-dark); }
.hero-stat small { color: var(--text-muted); font-size: .82rem; }
.hero-studies-title { color: var(--teal-dark); }
.study-item { background: var(--teal-xlight); }
.study-item-icon {
	color: var(--teal-primary);
	font-size: 1.1rem;
}
.study-item-text {
	font-size: .85rem;
	font-weight: 500;
}
.hero-studies-divider { border-color: var(--teal-light); }

/* ── SECTION TITLES ── */
.section-label {
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: 1.8px;
	text-transform: uppercase;
	color: var(--teal-primary);
	margin-bottom: .5rem;
}
.section-title {
	font-family: 'Playfair Display', serif;
	font-size: clamp(1.7rem, 3vw, 2.4rem);
	color: var(--text-dark);
	line-height: 1.25;
}
.section-divider {
	width: 48px; height: 4px;
	background: var(--teal-primary);
	border-radius: 4px;
	margin: 1rem auto 0;
}

/* ── SERVICES ── */
#services { background: var(--teal-xlight); }
.service-card {
	background: #fff;
	border-radius: 18px;
	padding: 2rem 1.6rem;
	border: 1.5px solid transparent;
	transition: all .3s;
	height: 100%;
}
.service-card:hover {
	border-color: var(--teal-primary);
	transform: translateY(-4px);
	box-shadow: 0 16px 40px rgba(23,185,196,.12);
}
.service-icon {
	width: 64px; height: 64px;
	background: var(--teal-xlight);
	border-radius: 16px;
	display: flex; align-items: center; justify-content: center;
	font-size: 2rem;
	color: var(--teal-primary);
	margin-bottom: 1.1rem;
	transition: background .3s;
}
.service-card:hover .service-icon { background: var(--teal-primary); color: #fff; }
.service-card h3 { font-weight: 700; font-size: 1.05rem; color: var(--text-dark); }
.service-card p { font-size: .88rem; color: var(--text-muted); line-height: 1.6; margin: 0; }

/* ── WHY IMAGING ── */
#why-imaging { background: #fff; }
.why-item {
	display: flex;
	gap: 1.2rem;
	align-items: flex-start;
	padding: 1.6rem;
	border-radius: 16px;
	background: var(--teal-xlight);
	height: 100%;
}
.why-num {
	min-width: 48px; height: 48px;
	background: var(--teal-primary);
	color: #fff;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-weight: 700;
	font-size: 1.1rem;
	flex-shrink: 0;
}
.why-item h3 { font-weight: 700; color: var(--text-dark); margin-bottom: .3rem; }
.why-item p { font-size: .87rem; color: var(--text-muted); margin: 0; line-height: 1.6; }
.why-imaging-text { line-height: 1.8; }

/* ── FEATURED SERVICE ── */
#featured { background: var(--teal-xlight); }
.featured-badge {
	display: inline-block;
	background: var(--teal-light);
	color: var(--teal-darker);
	border-radius: 50px;
	padding: .3rem 1rem;
	font-size: .8rem;
	font-weight: 700;
	margin-bottom: 1rem;
}
.check-list li {
	list-style: none;
	padding: .4rem 0;
	font-size: .93rem;
	display: flex;
	gap: .7rem;
	color: var(--text-dark);
}
.check-list li i { color: var(--teal-primary); font-size: 1.1rem; margin-top: .1rem; }
.img-placeholder {
	background: linear-gradient(135deg, var(--teal-darker) 0%, var(--teal-primary) 100%);
	border-radius: 24px;
	aspect-ratio: 4/3;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 8rem;
	color: rgba(255,255,255,.5);
	position: relative;
	overflow: hidden;
}
.img-placeholder::after {
	content: '';
	position: absolute;
	bottom: -30px; right: -30px;
	width: 180px; height: 180px;
	background: rgba(255,255,255,.08);
	border-radius: 50%;
}
.featured-description {
	font-size: .95rem;
	line-height: 1.8;
}

/* ── REVIEWS ── */
#reviews { background: #fff; }
.review-card {
	background: var(--teal-xlight);
	border-radius: 18px;
	padding: 1.8rem;
	height: 100%;
	border-left: 4px solid var(--teal-primary);
}
.review-stars i { color: #f5b800; font-size: .95rem; }
.review-text { font-style: italic; color: var(--text-dark); font-size: .93rem; line-height: 1.7; }
.reviewer-name { font-weight: 700; color: var(--teal-dark); margin-top: 1rem; margin-bottom: .1rem; }
.reviewer-label { font-size: .8rem; color: var(--text-muted); }
.avatar {
	width: 44px; height: 44px;
	border-radius: 50%;
	background: var(--teal-primary);
	display: flex; align-items: center; justify-content: center;
	color: #fff;
	font-weight: 700;
	font-size: 1rem;
	flex-shrink: 0;
}

/* ── ABOUT ── */
#about { background: var(--teal-xlight); }
.about-card {
	background: #fff;
	border-radius: 18px;
	padding: 2rem;
	text-align: center;
	height: 100%;
	box-shadow: 0 4px 20px rgba(23,185,196,.08);
}
.about-card .icon { font-size: 2.5rem; color: var(--teal-primary); margin-bottom: 1rem; }
.about-card h3 { font-weight: 700; color: var(--text-dark); margin-bottom: .5rem; }
.about-card p { font-size: .88rem; color: var(--text-muted); line-height: 1.6; margin: 0; }
.about-intro {
	max-width: 600px;
	line-height: 1.8;
}

/* ── CONTACT ── */
#contact { background: #fff; }
.contact-info-item {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	margin-bottom: 1.4rem;
}
.contact-icon {
	width: 46px; height: 46px;
	background: var(--teal-xlight);
	border-radius: 12px;
	display: flex; align-items: center; justify-content: center;
	color: var(--teal-primary);
	font-size: 1.3rem;
	flex-shrink: 0;
}
.contact-info-item h4 { font-weight: 700; margin-bottom: .15rem; font-size: .95rem; }
.contact-info-item p { font-size: .88rem; color: var(--text-muted); margin: 0; line-height: 1.5; }
.contact-title,
.contact-form-title { color: var(--teal-dark); }
.whatsapp-link {
	color: var(--teal-primary);
	text-decoration: none;
}
.social-link-teal {
	background: var(--teal-xlight);
	color: var(--teal-primary);
}
.contact-form-card { background: var(--teal-xlight); }
.contact-form-note { font-size: .8rem; }
.form-control:focus, .form-select:focus {
	border-color: var(--teal-primary);
	box-shadow: 0 0 0 .2rem rgba(23,185,196,.18);
}
.btn-primary-teal {
	background: var(--teal-primary);
	border-color: var(--teal-primary);
	color: #fff;
	border-radius: 50px;
	padding: .7rem 2.2rem;
	font-weight: 700;
	transition: all .25s;
}
.btn-primary-teal:hover { background: var(--teal-dark); border-color: var(--teal-dark); color: #fff; }

/* ── FOOTER ── */
footer {
	background: var(--text-dark);
	color: rgba(255,255,255,.7);
}
footer .brand { font-family: 'Playfair Display', serif; color: var(--teal-primary); font-size: 1.5rem; }
footer h3 { color: #fff; font-weight: 700; letter-spacing: .3px; }
footer a { color: rgba(255,255,255,.6); text-decoration: none; font-size: .88rem; transition: color .2s; }
footer a:hover { color: var(--teal-primary); }
.footer-divider { border-color: rgba(255,255,255,.1); }
.social-link {
	width: 38px; height: 38px;
	background: rgba(255,255,255,.08);
	border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	color: rgba(255,255,255,.7);
	font-size: 1rem;
	transition: all .2s;
}
.social-link:hover { background: var(--teal-primary); color: #fff; }
.social-link.social-link-teal {
	background: #ffffff;
	color: var(--teal-darker);
	border: 1px solid var(--teal-light);
}
.social-link.social-link-teal:hover {
	background: var(--teal-primary);
	color: #fff;
	border-color: var(--teal-primary);
}
.footer-description {
	font-size: .88rem;
	line-height: 1.8;
	color: rgba(255,255,255,.6);
}
.footer-bottom {
	font-size: .82rem;
	color: rgba(255,255,255,.45);
}

/* ── WHATSAPP FLOAT ── */
.whatsapp-float {
	position: fixed;
	bottom: 28px; right: 28px;
	width: 58px; height: 58px;
	background: #25D366;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 6px 22px rgba(37,211,102,.45);
	z-index: 9999;
	font-size: 1.7rem;
	color: #fff;
	transition: transform .2s;
}
.whatsapp-float:hover { transform: scale(1.1); color: #fff; }

/* ── DETALLES DE SERVICIOS ── */
.details-page { background: #f8fdfe; }
.details-hero {
	background: linear-gradient(135deg, var(--teal-darker) 0%, var(--teal-primary) 100%);
	padding: 90px 0 70px;
}
.details-title {
	font-family: 'Playfair Display', serif;
	font-size: clamp(2rem, 5vw, 3.2rem);
	color: #fff;
	margin-bottom: .8rem;
}
.details-subtitle {
	max-width: 760px;
	color: rgba(255,255,255,.88);
	font-size: 1rem;
	line-height: 1.7;
}
.details-section { padding-top: 70px; }
.details-card {
	background: #fff;
	border: 1px solid rgba(23,185,196,.18);
	border-radius: 16px;
	padding: 1.5rem;
	box-shadow: 0 10px 26px rgba(23,185,196,.08);
}
.details-card h3 {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--teal-dark);
	margin-bottom: 1rem;
}
.details-list {
	margin: 0;
	padding-left: 1.1rem;
	color: var(--text-dark);
}
.details-list li {
	font-size: .92rem;
	line-height: 1.6;
	margin-bottom: .35rem;
}
@media (min-width: 992px) {
	.details-list-columns {
		column-count: 2;
		column-gap: 1.5rem;
	}
	.details-list-columns li { break-inside: avoid; }
}

/* ── UTILS ── */
section { padding: 90px 0; }
@media (max-width: 767px) { section { padding: 60px 0; } }
