/* Refinamiento visual: mantiene los tokens de marca y reduce el aspecto genérico. */
.topbar { box-shadow: 0 1px 0 rgba(18, 59, 82, .04); }
.brand { letter-spacing: -.02em; }
.brand-muted { color: #587080; font-size: .88em; }
.hero { min-height: 540px; padding-top: 82px; padding-bottom: 72px; gap: 4.25rem; }
.hero h1 { max-width: 650px; font-size: clamp(2.8rem, 4.35vw, 4.1rem); }
.lead { max-width: 585px; font-size: 1.08rem; line-height: 1.65; }
.hero-art { box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 22px 48px rgba(18,59,82,.08); }
.services { padding-top: 52px; }
.expertise { display: flex; flex-wrap: wrap; gap: .55rem; list-style: none; margin: 2rem 0 0; padding: 0; }
.expertise li { align-items: center; background: #f4f8f8; border: 1px solid #dce9e9; border-radius: 999px; color: #365260; display: inline-flex; font-size: .85rem; font-weight: 500; gap: .35rem; padding: .42rem .72rem; }
.expertise .material-symbols-outlined { color: var(--teal); font-size: 1rem; }
.service-card { background: #fff; box-shadow: 0 1px 0 rgba(18,59,82,.03); }
.service-card:hover { transform: translateY(-3px); transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; }
.quote-card { border: 1px solid #d4e9e8; box-shadow: 0 12px 30px rgba(18,59,82,.06); }
@media (max-width: 760px) { .hero { min-height: auto; padding-top: 65px; padding-bottom: 60px; } .expertise { margin-top: 1.5rem; } }