/* Escala tipográfica accesible compartida por todo el sitio SRR. */
:root {
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1rem;
  --leading-copy: 1.6;
}

body {
  font-size: var(--text-base);
  line-height: 1.55;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

p { line-height: var(--leading-copy); }

/* Navegación y controles compactos: nunca menos de 12 px. */
.topbar,
.topbar a,
.nav-menu > a,
.button,
.eyebrow,
.tag,
.section-heading--with-link > a {
  font-size: var(--text-xs);
}

/* Texto de lectura principal. */
.hero-copy > p:not(.eyebrow),
.intro-copy p,
.remote-copy p:not(.eyebrow),
.pbip p,
.sv-hero-copy > p:not(.eyebrow),
.sv-intro p,
.sv-portfolio > .shell > div:first-child > p,
.sv-benefits > div:first-child > p,
.sv-why p,
.sv-faq details p,
.contact-copy > p:not(.eyebrow),
.contact-heading > p:last-child,
.contact-faq p {
  font-size: var(--text-base);
  line-height: var(--leading-copy);
}

/* Tarjetas, listas y contenido secundario. */
.capabilities__grid span,
.service-card p,
.remote-cards p,
.pbip-services span,
.sector-grid h3,
.process-grid h3,
.process-grid p,
.article-grid h3,
.article-grid p,
.cta-band p,
.sv-checks li,
.sv-capabilities span,
.sv-service h3,
.sv-service p,
.sv-portfolio h3,
.sv-portfolio .sv-checks li,
.sv-benefits .sv-checks li,
.sv-sector h3,
.sv-process h3,
.sv-process p,
.sv-why-items span,
.sv-certifications span,
.sv-faq summary,
.sv-cta p,
.vp-feature p,
.ep-feature p,
.mt-feature p,
.sp-feature p,
.ic-feature p,
.contact-proof,
.contact-channels span,
.contact-services a,
.office-grid p,
.office-grid a {
  font-size: var(--text-sm);
  line-height: 1.5;
}

/* Formularios: etiquetas claras y campos a 16 px para evitar zoom móvil. */
.sv-form-card > p,
.sv-form-card label,
.sv-form-card .sv-form-note,
.contact-form-card > p,
.contact-form-card label,
#services-status,
#vp-status,
#ep-status,
#mt-status,
#sp-status,
#ic-status,
#contact-status {
  font-size: var(--text-sm);
  line-height: 1.5;
}

.sv-form-card input,
.sv-form-card select,
.sv-form-card textarea,
.contact-form-card input,
.contact-form-card select,
.contact-form-card textarea {
  min-height: 44px;
  font-size: var(--text-base);
  line-height: 1.4;
}

/* Información auxiliar y pie: mínimo absoluto de 12 px. */
.sv-form-trust span,
.footer p,
.footer__grid > div > a,
.footer__bottom,
.footer__bottom a,
.socials a,
.compliance-grid span,
.city-tags span {
  font-size: var(--text-xs);
  line-height: 1.5;
}

.footer h2,
.compliance-grid strong {
  font-size: var(--text-sm);
}

.footer__grid {
  row-gap: 28px;
}

/* Home: corrige la escala compacta heredada del boceto de referencia. */
.proof-item span,
.service-card a,
.remote-copy .button,
.coverage-card .button,
.process-grid li > span,
.article-grid span,
.article-grid a,
.cta-band .button {
  font-size: var(--text-xs) !important;
}

.service-card p,
.remote-cards p,
.pbip-services span,
.process-grid p,
.article-grid p,
.cta-band p {
  font-size: var(--text-sm) !important;
  line-height: 1.5;
}

/* Guarda Virtual usa una composición propia y requiere la misma escala. */
.gv-form-card > p,
.gv-form-card label,
.gv-form-status,
.gv-capabilities span,
.gv-form-trust span {
  font-size: var(--text-sm) !important;
  line-height: 1.5;
}

.gv-form-card input,
.gv-form-card select,
.gv-form-card textarea {
  min-height: 44px;
  font-size: var(--text-base) !important;
}

.gv-intro__grid p,
.gv-environments__copy p,
.gv-benefits__copy p,
.gv-why p,
.gv-faq details p,
.gv-final-cta p {
  font-size: var(--text-base) !important;
  line-height: var(--leading-copy);
}

.gv-checks li,
.gv-feature-grid p,
.gv-environment-cards li,
.gv-benefits__copy li,
.gv-sector-grid h3,
.gv-process h3,
.gv-process p,
.gv-why__item span,
.gv-certifications span,
.gv-faq summary,
.gv-final-cta span {
  font-size: var(--text-sm) !important;
  line-height: 1.5;
}

.gv-environments__copy .button,
.gv-final-cta .button,
.gv-process li > span {
  font-size: var(--text-xs) !important;
}

/* Normaliza reglas más específicas de las páginas de servicio. */
.sv-page .eyebrow,
.sv-page .sv-form-trust span {
  font-size: var(--text-xs) !important;
}

.sv-page .sv-portfolio-cards .sv-checks li,
.sv-page .sv-benefits .sv-checks li,
.sv-page .sv-process p,
.sv-page .sv-cta p:last-child,
.sv-page .sv-certifications span {
  font-size: var(--text-sm) !important;
  line-height: 1.5;
}

.vp-trust p,
.ep-trust p,
.mt-trust p,
.sp-trust p,
.ic-trust p {
  font-size: var(--text-base) !important;
  line-height: var(--leading-copy);
}

.sv-form-card select,
.contact-form-card select {
  font-size: var(--text-sm);
}

/* El contenido debe crecer y envolver sin recortarse. */
.service-card,
.remote-cards article,
.process-grid li,
.article-grid article,
.sv-service,
.sv-portfolio-cards article,
.sv-process li,
.contact-channels > a,
.contact-services > a {
  height: auto;
  overflow: visible;
}

h1, h2, h3 {
  text-wrap: balance;
}

@media (max-width: 760px) {
  body { font-size: var(--text-base); }

  .footer__grid > div > a,
  .footer p,
  .footer__bottom,
  .sv-form-trust span {
    font-size: var(--text-sm);
  }

  .sv-form-card select,
  .contact-form-card select {
    font-size: var(--text-base);
  }
}

/* Ocho credenciales: dos filas legibles en escritorio. */
.sv-certifications,
.gv-certifications {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sv-certifications > div:nth-child(5),
.gv-certifications > div:nth-child(5) {
  border-left: 0;
}

@media (max-width: 760px) {
  .sv-certifications,
  .gv-certifications {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sv-certifications > div:nth-child(odd),
  .gv-certifications > div:nth-child(odd) {
    border-left: 0;
  }
}

@media (max-width: 480px) {
  .sv-certifications,
  .gv-certifications {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   Sistema visual 2026: ritmo, jerarquía y microinteracciones
   ========================================================= */
:root {
  --surface-soft: #f4f7f8;
  --surface-warm: #fff7f2;
  --ink-deep: #0d1d27;
  --line-soft: #dfe6e9;
  --radius-lg: 22px;
  --shadow-soft: 0 18px 48px rgba(8, 27, 38, .09);
  --shadow-hover: 0 24px 54px rgba(8, 27, 38, .15);
}

/* Cada bloque respira y se reconoce como una escena independiente. */
.sv-page .sv-section {
  padding-block: clamp(48px, 6vw, 82px) !important;
}

.sv-page .sv-section + .sv-portfolio,
.sv-page .sv-portfolio + .sv-section {
  margin-top: 0;
}

.sv-page .sv-intro {
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.45fr) !important;
  gap: clamp(28px, 5vw, 72px) !important;
  padding: clamp(24px, 3.4vw, 48px);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, #fff 0%, #f6f9fa 100%);
  box-shadow: var(--shadow-soft);
}

.sv-page .sv-intro h2 {
  font-size: clamp(1.5rem, 2.1vw, 2.15rem) !important;
  line-height: 1.18 !important;
  letter-spacing: -.035em;
}

.sv-page .sv-intro p {
  max-width: 58ch;
  margin-top: 18px !important;
}

.sv-page .sv-intro img,
.sv-page .sp-intro-image {
  height: clamp(260px, 28vw, 390px) !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 44px rgba(4, 20, 30, .18);
  transition: transform .45s ease, box-shadow .45s ease;
}

.sv-page .sv-intro:hover img {
  transform: scale(1.015);
  box-shadow: 0 26px 54px rgba(4, 20, 30, .24);
}

.sv-page .sv-heading {
  position: relative;
  max-width: 820px;
  margin: clamp(46px, 6vw, 76px) auto 28px !important;
  font-size: clamp(1.45rem, 2.15vw, 2.05rem) !important;
  line-height: 1.2;
  letter-spacing: -.035em;
}

.sv-page .sv-heading::after,
.section-heading h2::after {
  content: "";
  display: block;
  width: 54px;
  height: 4px;
  margin: 13px auto 0;
  border-radius: 99px;
  background: var(--orange);
}

/* Tarjetas de alcance con mayor jerarquía y lectura por capas. */
.sv-page :is(.vp-features, .ep-features, .mt-features, .sp-features, .ic-features),
.sv-page .sv-services {
  gap: 16px !important;
}

.sv-page :is(.vp-feature, .ep-feature, .mt-feature, .sp-feature, .ic-feature),
.sv-page .sv-service {
  min-height: 220px;
  padding: 24px 20px !important;
  border: 1px solid var(--line-soft) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 8px 26px rgba(9, 30, 42, .055);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease !important;
}

.sv-page :is(.vp-feature, .ep-feature, .mt-feature, .sp-feature, .ic-feature):hover,
.sv-page .sv-service:hover {
  transform: translateY(-7px) !important;
  border-color: rgba(244, 81, 11, .45) !important;
  box-shadow: var(--shadow-hover) !important;
}

.sv-page :is(.vp-feature, .ep-feature, .mt-feature, .sp-feature, .ic-feature) > svg,
.sv-page .sv-service > svg {
  width: 46px !important;
  height: 46px !important;
  margin-bottom: 20px;
  padding: 9px;
  border-radius: 12px;
  background: var(--surface-warm);
}

.sv-page :is(.vp-feature, .ep-feature, .mt-feature, .sp-feature, .ic-feature) h3,
.sv-page .sv-service h3 {
  margin-bottom: 10px !important;
  font-size: 1rem !important;
  line-height: 1.25;
}

/* Banda oscura como pausa visual y scroll stopper. */
.sv-page .sv-portfolio {
  padding-block: clamp(52px, 6vw, 84px) !important;
  border-block: 1px solid rgba(255,255,255,.1);
}

.sv-page .sv-portfolio-grid {
  gap: clamp(34px, 5vw, 76px) !important;
  padding-block: 0 !important;
}

.sv-page .sv-portfolio-grid > div:first-child h2 {
  font-size: clamp(1.55rem, 2.3vw, 2.35rem);
  line-height: 1.12;
}

.sv-page .sv-portfolio-grid > div:first-child p {
  max-width: 46ch;
  margin-block: 18px 26px;
}

.sv-page .sv-portfolio-cards {
  gap: 18px !important;
}

.sv-page .sv-portfolio-cards article {
  min-height: 250px;
  padding: 24px 20px !important;
  border-color: rgba(255,255,255,.25) !important;
  border-radius: 15px !important;
  background: rgba(5, 25, 36, .76) !important;
  backdrop-filter: blur(10px);
  transition: transform .28s ease, background .28s ease, border-color .28s ease;
}

.sv-page .sv-portfolio-cards article:hover {
  transform: translateY(-7px);
  border-color: var(--orange) !important;
  background: rgba(8, 34, 48, .96) !important;
}

/* Beneficios: mensaje, resultados y fotografía en un panel editorial. */
.sv-page .sv-benefits {
  position: relative;
  align-items: stretch !important;
  gap: clamp(24px, 3.5vw, 48px) !important;
  padding: clamp(26px, 4vw, 52px);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, var(--surface-soft), #fff 62%);
  overflow: hidden;
}

.sv-page .sv-benefits > div:first-child {
  align-self: center;
}

.sv-page .sv-benefits h2 {
  font-size: clamp(1.45rem, 2.1vw, 2rem);
  line-height: 1.16;
  letter-spacing: -.035em;
}

.sv-page .sv-benefits .sv-checks {
  align-self: center;
  display: grid;
  gap: 9px;
}

.sv-page .sv-benefits .sv-checks li {
  margin: 0 !important;
  padding: 9px 12px;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 5px 16px rgba(9, 30, 42, .05);
}

.sv-page .sv-benefit-photo {
  min-height: 300px !important;
  border-radius: 16px !important;
  box-shadow: 0 18px 38px rgba(4, 20, 30, .2);
}

/* Sectores visuales: menos tabla, más galería. */
.sv-page .sv-sectors {
  gap: 14px !important;
}

.sv-page :is(.sv-sector, .sp-city, .ic-sector) {
  min-height: 176px !important;
  border: 0 !important;
  border-radius: 15px !important;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(5, 25, 36, .13);
  transition: transform .28s ease, box-shadow .28s ease !important;
}

.sv-page :is(.sv-sector, .sp-city, .ic-sector):hover {
  transform: translateY(-7px) scale(1.015);
  box-shadow: 0 22px 42px rgba(5, 25, 36, .22);
}

/* Proceso como recorrido; cada paso se puede leer por separado. */
.sv-page .sv-process {
  position: relative;
  gap: 16px !important;
  padding: 22px !important;
  border: 0 !important;
  border-radius: var(--radius-lg) !important;
  background: var(--surface-soft);
}

.sv-page .sv-process li {
  min-height: 190px;
  padding: 22px 18px !important;
  border: 1px solid var(--line-soft) !important;
  border-radius: 14px !important;
  background: #fff;
  box-shadow: 0 8px 20px rgba(9, 30, 42, .05);
  transition: transform .25s ease, box-shadow .25s ease;
}

.sv-page .sv-process li:nth-child(even) {
  transform: translateY(12px);
}

.sv-page .sv-process li:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 34px rgba(9, 30, 42, .11);
}

.sv-page .sv-process li > span {
  width: 42px !important;
  height: 42px !important;
  box-shadow: 0 9px 20px rgba(244, 81, 11, .25);
}

.sv-page .sv-process li::after {
  display: none !important;
}

/* Razones y credenciales pasan de tabla comprimida a paneles independientes. */
.sv-page :is(.sv-why, .vp-trust, .ep-trust, .mt-trust, .sp-trust, .ic-trust) {
  grid-template-columns: minmax(230px, .72fr) minmax(0, 2fr) !important;
  gap: clamp(28px, 4vw, 56px) !important;
  margin-top: clamp(52px, 7vw, 88px) !important;
  padding: clamp(28px, 4vw, 48px) !important;
  border: 0 !important;
  border-radius: var(--radius-lg) !important;
  background: linear-gradient(135deg, #fff7f2, #f4f7f8 70%);
}

.sv-page :is(.vp-trust, .ep-trust, .mt-trust, .sp-trust, .ic-trust) > div:first-child,
.sv-page .sv-why > div:first-child {
  align-self: center;
}

.sv-page .sv-why-items {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  padding: 0 !important;
}

.sv-page .sv-why-items > div {
  min-height: 150px;
  padding: 18px !important;
  border: 1px solid rgba(15, 41, 55, .09) !important;
  border-radius: 12px;
  background: rgba(255,255,255,.76);
}

.sv-page .sv-why-items svg {
  width: 30px !important;
  height: 30px !important;
  color: var(--orange);
}

.sv-page .sv-certifications {
  gap: 1px !important;
  margin-top: 24px !important;
  padding: 14px !important;
  border-radius: 16px !important;
  background: var(--ink-deep) !important;
  box-shadow: 0 18px 42px rgba(6, 22, 31, .18);
}

.sv-page .sv-certifications > div {
  min-height: 92px;
  padding: 14px !important;
  border: 0 !important;
  border-radius: 10px;
  transition: background .22s ease;
}

.sv-page .sv-certifications > div:hover {
  background: rgba(255,255,255,.08);
}

/* Home: separación clara entre sectores, proceso, cumplimiento y recursos. */
.home-page .sectors,
body:not(.sv-page) .sectors {
  padding-block: clamp(64px, 8vw, 108px);
  background: linear-gradient(180deg, #fff, #f4f7f8 48%, #fff);
}

.sector-grid {
  gap: 16px !important;
  margin-top: 30px;
}

.sector-grid article {
  min-height: 175px !important;
  border-radius: 16px !important;
  box-shadow: 0 14px 34px rgba(6, 26, 37, .14);
  transition: transform .28s ease, box-shadow .28s ease;
}

.sector-grid article:hover {
  transform: translateY(-8px) scale(1.015);
  box-shadow: 0 24px 48px rgba(6, 26, 37, .23);
}

.process-grid {
  gap: 14px !important;
  margin-block: 28px 52px;
}

.process-grid li {
  min-height: 190px !important;
  padding: 24px 20px !important;
  border: 0 !important;
  border-radius: 15px !important;
  background: #fff;
  box-shadow: 0 10px 28px rgba(8, 28, 40, .08);
}

.compliance {
  padding: clamp(30px, 4vw, 52px) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 22px 52px rgba(6, 24, 34, .2);
}

.compliance-grid {
  gap: 1px;
  margin-top: 24px;
}

.compliance-grid > div {
  min-height: 120px;
  padding: 18px !important;
  border-radius: 10px;
  transition: background .22s ease, transform .22s ease;
}

.compliance-grid > div:hover {
  transform: translateY(-4px);
  background: rgba(255,255,255,.08);
}

.resources {
  padding-block: clamp(64px, 8vw, 108px) !important;
}

.article-grid {
  gap: 24px !important;
  margin-top: 32px;
}

.article-grid article {
  min-height: 390px;
  display: flex !important;
  flex-direction: column;
  border: 0 !important;
  border-radius: 18px !important;
  overflow: hidden;
  box-shadow: var(--shadow-soft);
  transition: transform .28s ease, box-shadow .28s ease;
}

.article-grid article:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-hover);
}

.article-grid article img {
  width: 100% !important;
  height: 210px !important;
  object-fit: cover;
}

.article-grid article > div {
  padding: 24px !important;
}

/* Entrada progresiva: solo se activa cuando JavaScript está disponible. */
.reveal-ready {
  opacity: 1;
  transform: none;
}

.reveal-ready.is-visible {
  animation: section-reveal .62s cubic-bezier(.2,.75,.25,1) both;
}

@keyframes section-reveal {
  from { opacity: .35; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1100px) {
  .sv-page :is(.sv-why, .vp-trust, .ep-trust, .mt-trust, .sp-trust, .ic-trust) {
    grid-template-columns: 1fr !important;
  }
  .sv-page .sv-why-items { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (max-width: 760px) {
  .sv-page .sv-intro { grid-template-columns: 1fr !important; padding: 20px; }
  .sv-page .sv-section { padding-block: 48px !important; }
  .sv-page .sv-benefits { grid-template-columns: 1fr !important; padding: 22px; }
  .sv-page .sv-benefit-photo { min-height: 240px !important; }
  .sv-page .sv-process { grid-template-columns: 1fr 1fr !important; }
  .sv-page .sv-process li:nth-child(even) { transform: none; }
  .sv-page .sv-why-items { grid-template-columns: 1fr 1fr !important; }
  .sv-page .sv-portfolio-cards article { min-height: 220px; }
  .article-grid article { min-height: 0; }
}

@media (max-width: 480px) {
  .sv-page :is(.vp-features, .ep-features, .mt-features, .sp-features, .ic-features),
  .sv-page .sv-services,
  .sv-page .sv-process,
  .sv-page .sv-why-items { grid-template-columns: 1fr !important; }
  .sv-page :is(.vp-feature, .ep-feature, .mt-feature, .sp-feature, .ic-feature),
  .sv-page .sv-service,
  .sv-page .sv-process li,
  .sv-page .sv-why-items > div { min-height: 0; }
  .sv-page .sv-sectors {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
  .sv-page :is(.sv-sector, .sp-city, .ic-sector) { min-height: 150px !important; }
  .compliance-grid { grid-template-columns: 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
  .reveal-ready,
  .reveal-ready.is-visible { opacity: 1; transform: none; transition: none; }
  * { scroll-behavior: auto !important; }
}

/* =========================================================
   Ajustes editoriales: Home y vista general de Servicios
   ========================================================= */
.remote-grid {
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr) !important;
  gap: clamp(42px, 6vw, 86px) !important;
  min-height: 360px !important;
  padding-block: 54px !important;
}

.remote-copy h2 {
  max-width: 18ch;
  font-size: clamp(1.65rem, 2.4vw, 2.45rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -.035em;
}

.remote-copy > p:not(.eyebrow) {
  max-width: 50ch;
  margin-block: 18px 26px !important;
}

.remote-cards {
  gap: 16px !important;
}

.remote-cards article {
  min-height: 240px !important;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 26px 22px !important;
  text-align: left !important;
  border-radius: 16px !important;
  background: rgba(8, 25, 35, .82) !important;
  backdrop-filter: blur(10px);
  transition: transform .28s ease, border-color .28s ease, background .28s ease;
}

.remote-cards article:hover {
  transform: translateY(-7px);
  border-color: var(--orange);
  background: rgba(12, 36, 49, .96) !important;
}

.remote-cards svg {
  width: 52px !important;
  height: 52px !important;
  margin-bottom: 22px;
  padding: 11px;
  border-radius: 14px;
  color: var(--orange) !important;
  background: rgba(244, 81, 11, .1);
  box-shadow: inset 0 0 0 1px rgba(244,81,11,.28);
}

.remote-cards h3 {
  margin: 0 0 12px !important;
  font-size: 1rem !important;
  line-height: 1.3;
}

.remote-cards p {
  font-size: .9rem !important;
  line-height: 1.65 !important;
}

.pbip {
  padding-block: 48px;
  background: rgba(3, 14, 21, .7) !important;
}

.pbip__grid {
  grid-template-columns: minmax(0, 1.35fr) minmax(310px, .65fr) !important;
  gap: clamp(38px, 5vw, 70px) !important;
  align-items: stretch !important;
  padding-block: 0 !important;
}

.pbip h2 {
  font-size: clamp(1.45rem, 2vw, 2rem) !important;
}

.pbip h3 {
  margin: 8px 0 22px !important;
}

.pbip-services {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.pbip-services span {
  min-height: 145px;
  display: flex !important;
  flex-direction: column;
  align-items: flex-start !important;
  justify-content: flex-start;
  gap: 14px !important;
  padding: 18px 15px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 13px;
  color: #eef2f4 !important;
  font-size: .78rem !important;
  line-height: 1.5 !important;
  background: rgba(255,255,255,.045);
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}

.pbip-services span:hover {
  transform: translateY(-5px);
  border-color: rgba(244,81,11,.7);
  background: rgba(244,81,11,.08);
}

.pbip-services svg {
  width: 34px !important;
  height: 34px !important;
  padding: 7px;
  border-radius: 9px;
  color: var(--orange);
  background: rgba(244,81,11,.11);
}

.coverage-card {
  grid-template-columns: 1fr !important;
  align-content: center;
  gap: 24px !important;
  padding: 30px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(18,47,61,.92), rgba(5,22,31,.95));
  box-shadow: 0 22px 50px rgba(0,0,0,.24);
}

.coverage-emblem {
  display: grid;
  grid-template-columns: 64px 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 16px;
  color: white;
}

.coverage-emblem svg {
  grid-row: 1 / 3;
  width: 64px;
  height: 64px;
  padding: 13px;
  border-radius: 50%;
  color: var(--orange);
  background: rgba(244,81,11,.12);
  box-shadow: inset 0 0 0 1px rgba(244,81,11,.4);
}

.coverage-emblem strong {
  align-self: end;
  font-size: 2.4rem;
  line-height: 1;
}

.coverage-emblem span {
  align-self: start;
  color: #cfd9de;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.coverage-card h3 {
  margin-bottom: 16px !important;
  font-size: 1.2rem;
}

.city-tags {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 8px !important;
  margin-bottom: 22px;
}

.city-tags span {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: #eef3f5;
  background: rgba(255,255,255,.08);
}

.city-tags span::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 0 3px rgba(244,81,11,.16);
}

/* La vista general usa cuatro tarjetas en una cuadrícula 2x2 más generosa. */
.services-overview .sv-portfolio-grid {
  grid-template-columns: minmax(260px, .72fr) minmax(0, 1.45fr) !important;
  gap: clamp(46px, 6vw, 90px) !important;
  padding-right: 0 !important;
}

.services-overview .sv-portfolio-cards {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.services-overview .sv-portfolio-cards article {
  min-height: 240px !important;
  padding: 28px 24px !important;
}

.services-overview .sv-portfolio-cards article > svg {
  width: 42px !important;
  height: 42px !important;
  margin-bottom: 15px;
}

.services-overview .sv-portfolio-cards h3 {
  margin-bottom: 14px;
  font-size: 1.05rem !important;
}

.services-overview .sv-portfolio-cards .sv-checks {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 12px;
}

/* Los cinco pasos quedan exactamente alineados. */
.services-overview .sv-process {
  align-items: stretch;
}

.services-overview .sv-process li,
.services-overview .sv-process li:nth-child(even),
.services-overview .sv-process li:hover {
  height: 100%;
  min-height: 220px;
  transform: none !important;
}

.services-overview .sv-process h3 {
  min-height: 50px;
  display: flex;
  align-items: flex-start;
  font-size: .92rem !important;
}

@media (max-width: 1000px) {
  .pbip-services { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .services-overview .sv-portfolio-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 760px) {
  .remote-grid { grid-template-columns: 1fr !important; padding-block: 42px !important; }
  .remote-copy h2 { max-width: 22ch; }
  .remote-cards { grid-template-columns: 1fr 1fr !important; }
  .remote-cards article:last-child { grid-column: 1 / -1; }
  .pbip__grid { grid-template-columns: 1fr !important; }
  .services-overview .sv-portfolio-cards { grid-template-columns: 1fr 1fr !important; }
  .services-overview .sv-portfolio-cards .sv-checks { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .remote-cards,
  .pbip-services,
  .services-overview .sv-portfolio-cards { grid-template-columns: 1fr !important; }
  .remote-cards article:last-child { grid-column: auto; }
  .pbip-services span { min-height: 0; }
  .coverage-card { padding: 22px; }
  .city-tags { grid-template-columns: 1fr; }
  .services-overview .sv-process h3 { min-height: 0; }
}

/* =========================================================
   Auditoría global: todas las páginas internas
   ========================================================= */
/* Las franjas de capacidades dejan de funcionar como una tabla de seis
   columnas y pasan a ser tarjetas legibles en dos filas. */
.sv-page .sv-capabilities {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px;
  margin-top: 22px !important;
  padding: 14px;
  border: 0 !important;
  border-radius: 18px !important;
  background: #fff;
  box-shadow: var(--shadow-soft) !important;
}

.sv-page .sv-capabilities > div {
  min-height: 104px;
  padding: 18px !important;
  border: 1px solid var(--line-soft) !important;
  border-radius: 12px;
  background: #fbfcfc;
}

.sv-page .sv-capabilities svg {
  width: 38px !important;
  height: 38px !important;
}

.sv-page .sv-capabilities strong {
  margin-bottom: 6px;
  font-size: .9rem !important;
}

/* Los alcances se leen como una galería 3x2, con alturas y aire iguales. */
.sv-page :is(.vp-features, .ep-features, .mt-features, .ic-features) {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.sv-page .sp-features {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.sv-page :is(.vp-feature, .ep-feature, .mt-feature, .sp-feature, .ic-feature) {
  height: 100%;
  min-height: 245px;
}

/* Todas las bandas de portafolio usan el ancho completo y tarjetas parejas. */
.sv-page:not(.services-overview) .sv-portfolio-grid {
  grid-template-columns: minmax(250px, .7fr) minmax(0, 1.5fr) !important;
  gap: clamp(42px, 6vw, 84px) !important;
  padding-right: 0 !important;
}

.sv-page:not(.services-overview) .sv-portfolio-cards {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.sv-page:not(.services-overview) .sv-portfolio-cards article {
  height: 100%;
  min-height: 280px !important;
  padding: 28px 24px !important;
}

.sv-page .sv-portfolio-cards article > svg {
  width: 42px !important;
  height: 42px !important;
  margin-bottom: 16px;
}

.sv-page .sv-portfolio-cards h3 {
  min-height: 46px;
  margin-bottom: 14px !important;
  font-size: 1rem !important;
}

/* Las galerías sectoriales se distribuyen en dos filas amplias. */
.sv-page .sv-sectors {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.sv-page :is(.sv-sector, .sp-city, .ic-sector) {
  min-height: 205px !important;
}

/* El proceso mantiene una sola línea base: sin escalones ni saltos. */
.sv-page .sv-process {
  align-items: stretch !important;
  gap: 16px !important;
}

.sv-page .sv-process li,
.sv-page .sv-process li:nth-child(even),
.sv-page .sv-process li:hover {
  height: 100%;
  min-height: 220px !important;
  transform: none !important;
}

.sv-page .sv-process h3 {
  min-height: 50px;
  display: flex;
  align-items: flex-start;
  font-size: .92rem !important;
}

/* Credenciales y cierre dejan de ser una banda de texto diminuto. */
.sv-page .sv-certifications {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.sv-page .sv-certifications > div {
  min-height: 118px;
  padding: 18px !important;
}

.sv-page .sv-certifications span {
  font-size: .82rem !important;
}

.sv-page .sv-final {
  gap: 24px !important;
  margin-top: 28px !important;
}

/* Guarda Virtual: replica el mismo ritmo aunque use una plantilla propia. */
.gv-page .gv-section {
  padding-block: clamp(52px, 6vw, 84px) !important;
}

.gv-page .gv-capabilities__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px;
  padding: 14px;
  border-radius: 18px !important;
  background: #fff;
  box-shadow: var(--shadow-soft) !important;
}

.gv-page .gv-capabilities__grid > div {
  min-height: 104px;
  justify-content: flex-start;
  padding: 18px !important;
  border: 1px solid var(--line-soft) !important;
  border-radius: 12px;
  background: #fbfcfc;
}

.gv-page .gv-capabilities span,
.gv-page .gv-capabilities strong {
  font-size: .86rem !important;
}

.gv-page .gv-intro__grid {
  gap: clamp(34px, 5vw, 72px) !important;
  padding: clamp(24px, 3.4vw, 48px);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, #fff, #f6f9fa);
  box-shadow: var(--shadow-soft);
}

.gv-page .gv-intro__grid figure {
  height: clamp(260px, 28vw, 390px) !important;
  border-radius: 16px !important;
}

.gv-page .gv-feature-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

.gv-page .gv-feature-grid article {
  min-height: 225px;
  display: block;
  padding: 24px 20px !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 26px rgba(9,30,42,.055);
}

.gv-page .gv-feature-grid article > svg {
  width: 46px;
  height: 46px;
  margin-bottom: 18px;
  padding: 9px;
  border-radius: 12px;
  background: var(--surface-warm);
}

.gv-page .gv-feature-grid h3 {
  margin-bottom: 10px;
  font-size: 1rem !important;
}

.gv-page .gv-environments {
  padding-block: clamp(52px, 6vw, 84px);
}

.gv-page .gv-environments__grid {
  min-height: 0;
  grid-template-columns: minmax(250px, .7fr) minmax(0, 1.5fr) !important;
  gap: clamp(42px, 6vw, 84px) !important;
  padding-block: 0 !important;
  padding-right: 0 !important;
}

.gv-page .gv-environment-cards {
  gap: 18px !important;
}

.gv-page .gv-environment-cards article {
  min-height: 260px;
  padding: 26px 22px !important;
  border-radius: 15px !important;
}

.gv-page .gv-environment-cards h3 {
  font-size: 1rem !important;
}

.gv-page .gv-benefits__grid {
  gap: clamp(32px, 5vw, 70px) !important;
  padding: clamp(26px, 4vw, 52px);
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, var(--surface-soft), #fff 62%);
}

.gv-page .gv-benefits__grid figure {
  height: 300px !important;
  border-radius: 16px !important;
}

.gv-page .gv-sector-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.gv-page .gv-sector-grid article {
  min-height: 190px;
  padding: 20px !important;
  border-radius: 15px !important;
}

.gv-page .gv-process {
  gap: 16px !important;
  padding: 22px !important;
  border-radius: var(--radius-lg);
  background: var(--surface-soft);
}

.gv-page .gv-process li {
  min-height: 220px;
  padding: 22px 18px !important;
  border-radius: 14px !important;
  background: #fff;
  box-shadow: 0 8px 20px rgba(9,30,42,.05);
}

.gv-page .gv-process li > svg {
  display: none;
}

.gv-page .gv-process h3 {
  min-height: 50px;
  font-size: .92rem !important;
}

.gv-page .gv-why {
  grid-template-columns: minmax(250px, .8fr) repeat(3, minmax(0, 1fr)) !important;
  gap: 12px;
  padding: clamp(28px, 4vw, 48px);
  border: 0 !important;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0 !important;
  background: linear-gradient(135deg, #fff7f2, #f4f7f8 70%);
}

.gv-page .gv-why > div {
  min-height: 145px;
  padding: 18px !important;
  border: 1px solid rgba(15,41,55,.09) !important;
  border-radius: 12px;
  background: rgba(255,255,255,.76);
}

.gv-page .gv-why__item span,
.gv-page .gv-why__item strong,
.gv-page .gv-certifications span {
  font-size: .82rem !important;
}

.gv-page .gv-certifications {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px;
  padding: 14px;
  border-radius: 0 0 18px 18px !important;
}

.gv-page .gv-certifications > div {
  min-height: 112px;
  padding: 18px !important;
  border: 0 !important;
  border-radius: 10px;
}

@media (max-width: 1000px) {
  .sv-page .sv-sectors,
  .gv-page .gv-sector-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .sv-page:not(.services-overview) .sv-portfolio-grid,
  .gv-page .gv-environments__grid { grid-template-columns: 1fr !important; }
  .gv-page .gv-why { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 760px) {
  .sv-page .sv-capabilities,
  .gv-page .gv-capabilities__grid,
  .sv-page :is(.vp-features, .ep-features, .mt-features, .sp-features, .ic-features),
  .gv-page .gv-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .sv-page:not(.services-overview) .sv-portfolio-cards { grid-template-columns: 1fr !important; }
  .sv-page:not(.services-overview) .sv-portfolio-cards article { min-height: 0 !important; }
  .sv-page .sv-certifications,
  .gv-page .gv-certifications { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .gv-page .gv-benefits__copy { grid-template-columns: 1fr !important; }
  .gv-page .gv-environment-cards { grid-template-columns: 1fr !important; }
  .gv-page .gv-environments__photo { display: none; }
}

@media (max-width: 480px) {
  .sv-page .sv-capabilities,
  .gv-page .gv-capabilities__grid,
  .sv-page :is(.vp-features, .ep-features, .mt-features, .sp-features, .ic-features),
  .gv-page .gv-feature-grid,
  .sv-page .sv-sectors,
  .gv-page .gv-sector-grid,
  .gv-page .gv-why,
  .sv-page .sv-certifications,
  .gv-page .gv-certifications { grid-template-columns: 1fr !important; }
  .gv-page .gv-process li,
  .sv-page .sv-process li { min-height: 0 !important; }
}
