/* Neumopedia+ v3 — Sistema de identidad visual.
   No sustituye styles.css ni premium.css. Puedes modificar solo estas variables. */
:root {
  --brand-petrol: #17445A;
  --brand-eucalyptus: #438F81;
  --brand-brass: #B28D5D;
  --brand-ivory: #F7F6F0;
  --brand-cloud: #E9F0EA;
  --brand-ink: #173A45;
}
html { scroll-padding-top: 116px; }
body { background: var(--brand-ivory); color: var(--brand-ink); }
::selection { background: #cfe4db; color: var(--brand-ink); }
.announcement { background: #153C46; letter-spacing: .065em; }
.header { background: rgba(247,246,240,.96); border-bottom: 1px solid rgba(23,68,90,.09); }
.nav { min-height: 98px; }
.brand { gap: 9px; }
.brand img { width: 51px; max-height: none; aspect-ratio: 256/220; object-fit: contain; }
.brand-name { color: var(--brand-petrol); font-weight: 800; letter-spacing: -1.35px; }
.brand-name span { color: var(--brand-eucalyptus); }
.brand-name b { color: var(--brand-brass); }
.brand-sub { color: #5c7475; letter-spacing: 1.8px; }
.main-nav>a:not(.nav-cta):hover { color: var(--brand-eucalyptus); }
.main-nav .nav-cta { background: var(--brand-petrol); }
.main-nav .nav-cta span { color: #D4EAE3; }
.hero h1 { color: var(--brand-ink); letter-spacing: -3.35px; }
.hero h1 em, .section h2 em, .contact h2 em, .privacy-wrap h1 em,
.care-path-head h2 em { color: var(--brand-eucalyptus); }
.hero .eyebrow { color: #607A79; }
.hero-proof strong { color: var(--brand-ink); }
.eyebrow .sparkle { color: var(--brand-brass); }
.btn-primary, .btn-dark { background: var(--brand-petrol); }
.btn-primary:hover, .btn-dark:hover { background: #255469; }
.nav-cta:hover { background: #27556C; }
.btn-quiet { border-color: #CFDCD5; }
.btn-quiet:hover { box-shadow: 0 10px 28px rgba(23,68,90,.10); }
.hero-visual .visual-art { box-shadow: 0 31px 78px rgba(23,68,90,.12); }
.floating-note { box-shadow: 0 14px 46px rgba(23,68,90,.08); }
.visual-caption { box-shadow: 0 15px 45px rgba(23,68,90,.09); }
.intro-strip { border-block: 1px solid #DDE8DF; }
.section h2, .care-path-head h2 { color: var(--brand-ink); }
.service-card, .location-card { border: 1px solid #DEE7DE; box-shadow: 0 14px 30px rgba(22,62,60,.028); }
.service-feature { background: var(--brand-petrol); color: white; }
.service-feature h3 { color: white; }
.service-feature p { color: #D8E7E5; }
.service-tag { color: #426F68; }
.care-path { background: #F0F3ED; }
.care-step { box-shadow: 0 10px 32px rgba(23,68,90,.03); }
.care-step-n { color: var(--brand-eucalyptus); }
.care-step h3 { color: var(--brand-ink); }
.about-shape { background-color: #D9E9E1; }
.about-shape img { width: clamp(180px, 42%, 255px); aspect-ratio: 256/220; height: auto; filter: none; }
.about-role { color: var(--brand-eucalyptus); }
.location-card h3 { color: var(--brand-petrol); }
.contact { background: var(--brand-petrol); }
.footer { background: #EAF0E9; }
.footer .brand img { width: 46px; }
.floating-whatsapp { background: #257A69; }
/* Focus indications and accessibility */
:focus-visible { outline: 3px solid var(--brand-brass); outline-offset: 4px; }
@media (max-width: 800px) {
  .nav { min-height: 80px; }
  .brand img { width: 45px; }
  .main-nav { background: var(--brand-ivory); }
}
@media (max-width: 520px) {
  .nav { min-height: 74px; }
  .brand img { width: 40px; }
  .brand-name { font-size: 21px; letter-spacing: -1.3px; }
  .brand-sub { font-size: 6.9px; letter-spacing: 1.5px; }
  .hero h1 { letter-spacing: -2.6px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}