/* Exclusivo de /servicios/: conserva los estilos de la versión inglesa.
   Acentos existentes en global-header.css: azul, lila y verde NAVOA.
   Las 3 capacidades reutilizan el sistema .home-services (home-services.css/js, sin modificar)
   ya aprobado en la Home — aquí solo se ajusta lo propio de esta página. */
.services-editorial-page { --so-blue:#206EF3; --so-lilac:#7567E8; --so-green:#2F6B3A; }
.services-editorial-page .so-shell { width:min(1160px,calc(100% - 80px)); }
.services-editorial-page .so-hero { min-height:0; padding:144px 0 56px; }
.services-editorial-page .so-hero>.so-shell { min-height:0; }
.services-editorial-page .so-hero h1 { font-size:clamp(3.5rem,7vw,6rem); line-height:1.03; }
.services-editorial-page .so-hero__tagline { max-width:640px; margin:22px 0 0; color:#F2F6FA; font:500 clamp(1.1875rem,2vw,24px)/1.4 var(--font-body); letter-spacing:-.01em; }
.services-editorial-page .so-hero .so-hero__lead { max-width:780px; margin-top:22px; }
.services-editorial-page .so-hero .so-hero__body { margin-top:18px; }
.services-editorial-page .so-service-index { display:flex; flex-wrap:wrap; gap:12px; margin-top:40px; }
.services-editorial-page .so-service-index a { display:flex; align-items:center; gap:14px; min-height:48px; padding:10px 18px; border:1px solid var(--service-accent); border-radius:999px; color:#F7FAFD; text-decoration:none; font-size:.75rem; }
.services-editorial-page .so-service-index a[href$="#diagnostico"] { --service-accent:var(--so-blue); }
.services-editorial-page .so-service-index a[href$="#construir"] { --service-accent:var(--so-lilac); }
.services-editorial-page .so-service-index a[href$="#adoptar"] { --service-accent:var(--so-green); }
.services-editorial-page .so-service-index a>span { color:var(--service-accent); }
.services-editorial-page .so-service-index a>span:first-child { font-family:var(--font-mono); }
.services-editorial-page .so-service-index a:is(:hover,:focus-visible) { background:rgba(255,255,255,.07); box-shadow:inset 0 0 0 1px var(--service-accent); }
.services-editorial-page .so-service-index a:focus-visible { outline:2px solid var(--service-accent); outline-offset:5px; }
.services-editorial-page main a:focus-visible { outline:2px solid currentColor; outline-offset:5px; }

/* Las tres capacidades: mismas cards pastel que Home, con una línea adicional de desarrollo
   (esta página sí explica un poco más) y anclas para los links del hero (#diagnostico, etc.). */
.services-editorial-page .home-services { padding-top:24px; }
.services-editorial-page .home-services__service { scroll-margin-top:110px; }
.services-editorial-page .home-services__detail { margin:14px 0 0; max-width:44ch; color:#526071; font:400 .8438rem/1.6 var(--font-body); }

/* Reutiliza el CTA so-contact existente, adaptando solo su proporción. */
.services-editorial-page .so-contact h2 { max-width:760px; font-size:clamp(2.625rem,5vw,4.25rem); }
.services-editorial-page .so-contact__inner { gap:40px; }

@media(max-width:767px) {
  .services-editorial-page .so-shell { width:calc(100% - 40px); }
  .services-editorial-page .so-hero { padding:116px 0 44px; }
  .services-editorial-page .home-services { padding-top:8px; }
}
@media(max-width:479px) {
  .services-editorial-page .so-hero h1 { font-size:clamp(2.75rem,12vw,3.75rem); }
  .services-editorial-page .so-hero__tagline { font-size:1.125rem; }
  .services-editorial-page .so-service-index { gap:8px; margin-top:28px; }
  .services-editorial-page .so-service-index a { padding-inline:12px; gap:8px; }
  .services-editorial-page .so-contact { padding:64px 0; }
  .services-editorial-page .so-contact h2 { font-size:2.625rem; }
}