/* =========================================================
   DN TECH — SERVICIO TÉCNICO
   Hoja aislada: solo carga en servicios.html.
   Todos los selectores específicos usan el prefijo .svc-.
   ========================================================= */

.page-services .svc-main {
  display:block;
  width:100%;
  flex:1;
}

.page-services .svc-hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  width:100%;
  color:#fff;
  background:
    radial-gradient(circle at 80% 17%,rgba(41,182,246,.17),transparent 29%),
    radial-gradient(circle at 16% 78%,rgba(22,119,255,.07),transparent 28%),
    linear-gradient(145deg,#06101d 0%,#0d2139 100%);
}

.page-services .svc-hero::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.14;
  background-image:
    linear-gradient(rgba(104,212,255,.09) 1px,transparent 1px),
    linear-gradient(90deg,rgba(104,212,255,.09) 1px,transparent 1px);
  background-size:52px 52px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.16) 34%,rgba(0,0,0,.72) 100%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.16) 34%,rgba(0,0,0,.72) 100%);
}

.page-services .svc-hero-ambient {
  position:absolute;
  z-index:-1;
  width:460px;
  height:460px;
  right:4%;
  top:7%;
  border-radius:50%;
  background:rgba(28,137,233,.12);
  filter:blur(100px);
  pointer-events:none;
}

.page-services .svc-hero-container {
  min-height:calc(100vh - var(--header-h));
  display:grid;
  grid-template-columns:1.04fr .96fr;
  gap:54px;
  align-items:center;
  padding-top:50px;
  padding-bottom:50px;
}

.page-services .svc-hero-copy {
  max-width:700px;
}

.page-services .svc-eyebrow {
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-bottom:25px;
  color:#64d4fb;
  text-transform:uppercase;
  letter-spacing:.15em;
  font-size:11px;
  line-height:1;
  font-weight:850;
}

.page-services .svc-eyebrow-dot {
  width:7px;
  height:7px;
  border-radius:50%;
  background:#68d4ff;
  box-shadow:0 0 0 5px rgba(104,212,255,.06),0 0 15px rgba(104,212,255,.45);
}

.page-services .svc-hero-title {
  margin:0 0 25px;
  max-width:720px;
  color:#fff;
  font-size:clamp(48px,5.35vw,72px);
  line-height:.99;
  letter-spacing:-.05em;
  text-wrap:balance;
}

.page-services .svc-title-accent {
  background:linear-gradient(90deg,#24a7f5 5%,#46c9ff 58%,#83e0ff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.page-services .svc-hero-description {
  max-width:650px;
  margin:0;
  color:#c6d6e6;
  font-size:17.5px;
  line-height:1.75;
}

.page-services .svc-actions {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin:32px 0 24px;
}

.page-services .svc-btn {
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:52px;
  padding:0 24px;
  overflow:hidden;
  border:1px solid transparent;
  border-radius:14px;
  color:#fff;
  font-size:13px;
  font-weight:820;
  transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease;
}

.page-services .svc-btn:hover { transform:translateY(-2px); }
.page-services .svc-btn-primary {
  background:linear-gradient(135deg,#187cff 0%,#0caeff 100%);
  border-color:rgba(122,221,255,.18);
  box-shadow:0 14px 34px rgba(20,129,255,.27),inset 0 1px 0 rgba(255,255,255,.18);
}
.page-services .svc-btn-primary:hover {
  box-shadow:0 17px 38px rgba(20,129,255,.36),0 0 0 1px rgba(112,214,255,.10);
}
.page-services .svc-btn-secondary {
  border-color:rgba(181,221,247,.24);
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.028));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.page-services .svc-btn-secondary:hover {
  border-color:rgba(104,212,255,.40);
  background:rgba(255,255,255,.085);
}
.page-services .svc-btn-arrow { color:#8fe4ff; transition:transform .18s ease; }
.page-services .svc-btn:hover .svc-btn-arrow { transform:translateX(3px); }

.page-services .svc-trust-badges {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.page-services .svc-trust-badge {
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:7px 12px;
  border:1px solid rgba(162,213,242,.12);
  border-radius:999px;
  background:linear-gradient(145deg,rgba(255,255,255,.052),rgba(255,255,255,.025));
  color:#b9d0e4;
  font-size:11.5px;
  font-weight:700;
}

.page-services .svc-check { color:#68d4ff; }

.page-services .svc-diagnostic-panel {
  position:relative;
  padding:22px;
  overflow:hidden;
  border:1px solid rgba(104,212,255,.16);
  border-radius:30px;
  background:linear-gradient(145deg,rgba(18,48,82,.90),rgba(6,17,30,.96));
  box-shadow:0 35px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.025);
}

.page-services .svc-diagnostic-panel::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(360px circle at 70% 10%,rgba(72,199,255,.07),transparent 64%);
}

.page-services .svc-panel-chrome,
.page-services .svc-panel-heading,
.page-services .svc-panel-cards,
.page-services .svc-help-link { position:relative; z-index:1; }

.page-services .svc-panel-chrome {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:16px;
}

.page-services .svc-panel-dots { display:flex; gap:7px; }
.page-services .svc-panel-dot { width:9px; height:9px; border-radius:50%; background:#35516d; }
.page-services .svc-panel-system { color:#5f819c; font-size:8.5px; font-weight:850; letter-spacing:.18em; }

.page-services .svc-panel-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin:0 3px 18px;
}

.page-services .svc-panel-kicker {
  display:block;
  margin-bottom:4px;
  color:#68d4ff;
  font-size:9.5px;
  font-weight:850;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.page-services .svc-panel-title {
  margin:0;
  color:#f3faff;
  font-size:27px;
  line-height:1.08;
  letter-spacing:-.03em;
}

.page-services .svc-panel-location {
  display:inline-flex;
  align-items:center;
  gap:7px;
  flex:none;
  padding:7px 10px;
  border:1px solid rgba(109,204,248,.10);
  border-radius:999px;
  background:rgba(255,255,255,.025);
  color:#8eabc1;
  font-size:9.5px;
  font-weight:750;
}

.page-services .svc-location-dot {
  width:5px;
  height:5px;
  border-radius:50%;
  background:#68d4ff;
  box-shadow:0 0 9px rgba(104,212,255,.50);
}

.page-services .svc-panel-cards { display:grid; gap:13px; }

.page-services .svc-diagnostic-card {
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  padding:19px 20px;
  border:1px solid rgba(166,217,245,.095);
  border-radius:20px;
  background:linear-gradient(135deg,rgba(255,255,255,.072),rgba(255,255,255,.020));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}

.page-services .svc-diagnostic-card:hover {
  transform:translateY(-2px);
  border-color:rgba(109,212,255,.27);
  background:linear-gradient(135deg,rgba(255,255,255,.095),rgba(255,255,255,.028));
}

.page-services .svc-diagnostic-icon {
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:15px;
  color:#68d4ff;
  background:linear-gradient(145deg,rgba(47,178,242,.17),rgba(17,103,192,.07));
  border:1px solid rgba(104,212,255,.18);
}

.page-services .svc-icon-svg {
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.page-services .svc-diagnostic-copy { min-width:0; }
.page-services .svc-diagnostic-kicker {
  display:block;
  margin-bottom:3px;
  color:#68d4ff;
  font-size:9.5px;
  font-weight:850;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.page-services .svc-diagnostic-title {
  margin:0;
  color:#fff;
  font-size:18.5px;
  line-height:1.25;
  letter-spacing:-.015em;
}

.page-services .svc-diagnostic-text {
  margin:5px 0 0;
  max-width:420px;
  color:#98b4ca;
  font-size:11.5px;
  line-height:1.52;
}

.page-services .svc-status {
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-width:126px;
  padding:7px 9px;
  border:1px solid rgba(104,212,255,.08);
  border-radius:999px;
  color:#9ebbd0;
  background:rgba(3,13,23,.28);
  font-size:9px;
  font-weight:780;
  white-space:nowrap;
}

.page-services .svc-status-dot { width:6px; height:6px; border-radius:50%; }
.page-services .svc-status-ready .svc-status-dot { background:#4ae0ad; box-shadow:0 0 10px rgba(74,224,173,.46); }
.page-services .svc-status-opt .svc-status-dot { background:#68d4ff; box-shadow:0 0 10px rgba(104,212,255,.44); }
.page-services .svc-status-compatible .svc-status-dot { background:#6e9cff; box-shadow:0 0 10px rgba(110,156,255,.42); }

.page-services .svc-help-link {
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  margin-top:13px;
  padding:12px 14px;
  border:1px solid rgba(104,212,255,.09);
  border-radius:16px;
  background:rgba(2,10,18,.25);
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}

.page-services .svc-help-link:hover {
  transform:translateY(-1px);
  border-color:rgba(104,212,255,.20);
  background:rgba(7,29,48,.36);
}

.page-services .svc-help-icon {
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:10px;
  border:1px solid rgba(104,212,255,.10);
  background:rgba(41,182,246,.08);
  color:#68d4ff;
  font-size:13px;
  font-weight:900;
}

.page-services .svc-help-copy { display:grid; gap:1px; }
.page-services .svc-help-title { color:#dcebf7; font-size:10.5px; }
.page-services .svc-help-text { color:#7797af; font-size:9.5px; }
.page-services .svc-help-arrow { color:#68d4ff; transition:transform .18s ease; }
.page-services .svc-help-link:hover .svc-help-arrow { transform:translateX(3px); }

/* Ajuste local del header. No altera Inicio ni otras páginas. */
.page-services .site-header {
  background:rgba(5,13,24,.92);
  border-bottom-color:rgba(104,212,255,.09);
}

@media (max-width:1100px) {
  .page-services .svc-hero-container { gap:40px; }
  .page-services .svc-hero-title { font-size:clamp(46px,5.3vw,66px); }
  .page-services .svc-status { min-width:auto; }
}

@media (max-width:980px) {
  .page-services .svc-hero-container {
    min-height:auto;
    grid-template-columns:1fr;
    padding-top:68px;
    padding-bottom:68px;
  }
  .page-services .svc-hero-copy { max-width:760px; }
  .page-services .svc-diagnostic-panel { max-width:760px; width:100%; }
}

@media (max-width:720px) {
  .page-services .svc-diagnostic-card {
    grid-template-columns:46px 1fr;
    align-items:start;
  }
  .page-services .svc-status {
    grid-column:2;
    justify-self:start;
  }
}

@media (max-width:640px) {
  .page-services .svc-hero-container { padding-top:48px; padding-bottom:50px; gap:38px; }
  .page-services .svc-eyebrow { margin-bottom:18px; font-size:9.5px; }
  .page-services .svc-hero-title { font-size:clamp(42px,13vw,58px); margin-bottom:20px; }
  .page-services .svc-hero-description { font-size:16px; line-height:1.7; }
  .page-services .svc-actions { gap:10px; }
  .page-services .svc-btn { width:100%; }
  .page-services .svc-trust-badge { width:100%; justify-content:flex-start; }
  .page-services .svc-diagnostic-panel { padding:15px; border-radius:24px; }
  .page-services .svc-panel-heading { flex-direction:column; align-items:flex-start; gap:10px; }
  .page-services .svc-panel-title { font-size:24px; }
  .page-services .svc-diagnostic-card { padding:16px; gap:13px; }
  .page-services .svc-diagnostic-icon { width:44px; height:44px; border-radius:13px; }
  .page-services .svc-diagnostic-title { font-size:17px; }
}

/* =========================================================
   V27 — PULIDO FINO DEL HERO DE SERVICIO TÉCNICO
   ========================================================= */

.page-services .svc-hero-title {
  max-width:660px;
}

.page-services .svc-btn-secondary {
  color:#f3f9fe;
}

.page-services .svc-btn-secondary:hover {
  border-color:rgba(111,214,255,.48);
  background:linear-gradient(145deg,rgba(83,186,230,.12),rgba(255,255,255,.055));
  box-shadow:0 12px 28px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.055);
}

.page-services .svc-trust-badges {
  gap:10px;
}

.page-services .svc-trust-badge {
  padding:6px 11px;
  font-size:11px;
}

.page-services .svc-diagnostic-panel {
  padding:20px;
}

.page-services .svc-panel-chrome {
  margin-bottom:14px;
}

.page-services .svc-panel-heading {
  margin-bottom:15px;
}

.page-services .svc-panel-title {
  font-size:26px;
}

.page-services .svc-panel-cards {
  gap:11px;
}

.page-services .svc-diagnostic-card {
  grid-template-columns:46px minmax(0,1fr) auto;
  gap:14px;
  padding:16px 18px;
  border-radius:18px;
}

.page-services .svc-diagnostic-icon {
  width:46px;
  height:46px;
  border-radius:14px;
}

.page-services .svc-diagnostic-title {
  font-size:18px;
}

.page-services .svc-diagnostic-text {
  margin-top:4px;
  color:#aac1d4;
  font-size:11.7px;
  line-height:1.5;
}

.page-services .svc-status {
  min-width:112px;
  justify-content:flex-start;
  padding:6px 9px;
  color:#aec8da;
  font-size:8.8px;
}

.page-services .svc-help-link {
  margin-top:11px;
  padding:13px 14px;
  border-color:rgba(104,212,255,.11);
  background:rgba(2,10,18,.30);
}

.page-services .svc-help-link:hover {
  transform:translateY(-2px);
  border-color:rgba(104,212,255,.28);
  background:linear-gradient(135deg,rgba(28,97,139,.20),rgba(7,29,48,.42));
  box-shadow:0 12px 26px rgba(0,0,0,.10);
}

.page-services .svc-help-title {
  color:#edf8ff;
  font-size:11px;
}

.page-services .svc-help-text {
  color:#8eabc0;
  font-size:9.7px;
}

@media (max-width:1100px) {
  .page-services .svc-hero-title { max-width:620px; }
}

@media (max-width:720px) {
  .page-services .svc-diagnostic-card {
    grid-template-columns:44px 1fr;
  }
  .page-services .svc-status {
    grid-column:2;
  }
}

/* =========================================================
   V28 — ACABADO DE PRODUCTO / SERVICIO TÉCNICO
   Microinteracciones, accesibilidad, estados y responsive.
   ========================================================= */

/* Hero ligeramente más compacto y controlado */
.page-services .svc-hero-copy {
  max-width:670px;
}

.page-services .svc-hero-title {
  max-width:625px;
}

/* Tarjetas: más aire y sensación de interfaz */
.page-services .svc-diagnostic-card {
  gap:17px;
  transition:
    transform .22s cubic-bezier(.2,.72,.22,1),
    border-color .22s ease,
    background .22s ease,
    box-shadow .22s ease;
}

.page-services .svc-diagnostic-card:hover {
  transform:translateY(-3px);
  border-color:rgba(112,215,255,.31);
  background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.03));
  box-shadow:0 16px 34px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.045);
}

.page-services .svc-diagnostic-icon {
  transition:
    transform .22s cubic-bezier(.2,.72,.22,1),
    border-color .22s ease,
    box-shadow .22s ease,
    background .22s ease;
}

.page-services .svc-diagnostic-card:hover .svc-diagnostic-icon {
  transform:translateY(-1px) scale(1.035);
  border-color:rgba(112,215,255,.34);
  background:linear-gradient(145deg,rgba(47,178,242,.23),rgba(17,103,192,.10));
  box-shadow:0 0 24px rgba(41,182,246,.10),inset 0 1px 0 rgba(255,255,255,.055);
}

/* Estados: mismo lenguaje, matices distintos y más legibles */
.page-services .svc-status {
  border-color:rgba(128,207,240,.10);
  background:rgba(4,16,28,.38);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}

.page-services .svc-status-ready {
  color:#b9dfcf;
  border-color:rgba(74,224,173,.12);
  background:rgba(28,102,78,.105);
}

.page-services .svc-status-opt {
  color:#bae4f4;
  border-color:rgba(104,212,255,.13);
  background:rgba(31,105,139,.11);
}

.page-services .svc-status-compatible {
  color:#c2d2f4;
  border-color:rgba(110,156,255,.13);
  background:rgba(55,81,141,.105);
}

/* CTA inferior: claramente interactivo sin convertirse en otro botón grande */
.page-services .svc-help-link {
  position:relative;
  overflow:hidden;
}

.page-services .svc-help-link::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  background:radial-gradient(220px circle at 78% 45%,rgba(80,206,255,.11),transparent 70%);
  transition:opacity .22s ease;
}

.page-services .svc-help-link:hover::before { opacity:1; }

.page-services .svc-help-link:hover .svc-help-icon {
  border-color:rgba(104,212,255,.25);
  background:rgba(41,182,246,.13);
  box-shadow:0 0 20px rgba(41,182,246,.08);
}

.page-services .svc-help-icon {
  transition:border-color .22s ease,background .22s ease,box-shadow .22s ease;
}

.page-services .svc-help-link:hover .svc-help-arrow {
  transform:translateX(5px);
}

/* Foco de teclado visible en todos los controles de esta pantalla */
.page-services .svc-btn:focus-visible,
.page-services .svc-help-link:focus-visible,
.page-services .site-header a:focus-visible,
.page-services .site-header button:focus-visible {
  outline:2px solid #76ddff;
  outline-offset:4px;
  border-radius:12px;
}

/* Responsive afinado: primero mensaje, después diagnóstico, sin panel interminable */
@media (max-width:980px) {
  .page-services .svc-hero-copy { max-width:700px; }
  .page-services .svc-hero-title { max-width:610px; }
  .page-services .svc-diagnostic-panel { max-width:700px; }
}

@media (max-width:720px) {
  .page-services .svc-diagnostic-card {
    gap:14px;
  }
  .page-services .svc-status {
    margin-top:2px;
  }
}

@media (max-width:640px) {
  .page-services .svc-hero-title {
    max-width:100%;
  }
  .page-services .svc-trust-badges {
    display:grid;
    grid-template-columns:1fr;
  }
  .page-services .svc-diagnostic-text {
    font-size:11.5px;
  }
  .page-services .svc-help-link {
    grid-template-columns:32px minmax(0,1fr) auto;
    padding:12px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .page-services .svc-diagnostic-card,
  .page-services .svc-diagnostic-icon,
  .page-services .svc-help-link,
  .page-services .svc-help-arrow,
  .page-services .svc-btn,
  .page-services .svc-btn-arrow {
    transition:none !important;
  }
  .page-services .svc-diagnostic-card:hover,
  .page-services .svc-diagnostic-card:hover .svc-diagnostic-icon,
  .page-services .svc-help-link:hover,
  .page-services .svc-btn:hover {
    transform:none !important;
  }
}

/* =========================================================
   V29 — ÚLTIMO PULIDO / SERVICIO TÉCNICO
   Ajustes vistos en navegador real: legibilidad, equilibrio,
   estados, CTA inferior y responsive compacto.
   ========================================================= */

/* Un poco más de presencia para el panel sin robar el hero */
.page-services .svc-hero-container {
  grid-template-columns:.99fr 1.01fr;
  gap:48px;
}

/* Más legibilidad en la interfaz técnica */
.page-services .svc-diagnostic-text {
  color:#b3c7d8;
  font-size:12.4px;
  line-height:1.56;
}

.page-services .svc-panel-kicker,
.page-services .svc-diagnostic-kicker {
  color:#75dcff;
}

.page-services .svc-status {
  min-width:118px;
  padding:7px 10px;
  font-size:9.5px;
  font-weight:800;
  border-width:1px;
}

.page-services .svc-status-dot {
  width:6.5px;
  height:6.5px;
  flex:none;
}

.page-services .svc-status-ready {
  border-color:rgba(74,224,173,.21);
  background:rgba(28,102,78,.14);
}

.page-services .svc-status-opt {
  border-color:rgba(104,212,255,.21);
  background:rgba(31,105,139,.145);
}

.page-services .svc-status-compatible {
  border-color:rgba(110,156,255,.21);
  background:rgba(55,81,141,.14);
}

/* CTA inferior más reconocible como acción */
.page-services .svc-help-link {
  padding:14px 15px;
  border-color:rgba(104,212,255,.15);
  background:linear-gradient(135deg,rgba(8,28,47,.48),rgba(2,11,20,.42));
}

.page-services .svc-help-title {
  font-size:11.7px;
  letter-spacing:-.005em;
}

.page-services .svc-help-text {
  color:#9eb7c9;
  font-size:10.2px;
}

.page-services .svc-help-arrow {
  font-size:16px;
  text-shadow:0 0 12px rgba(104,212,255,.18);
}

.page-services .svc-help-link:hover {
  border-color:rgba(104,212,255,.34);
  background:linear-gradient(135deg,rgba(22,80,116,.28),rgba(7,29,48,.54));
  box-shadow:0 14px 30px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.025);
}

/* El hero sigue mandando, pero con un ancho más controlado */
.page-services .svc-hero-copy {
  max-width:655px;
}

.page-services .svc-hero-description {
  max-width:620px;
}

/* Responsive: menos longitud vertical y panel compacto */
@media (max-width:980px) {
  .page-services .svc-hero-container {
    grid-template-columns:1fr;
    gap:38px;
  }

  .page-services .svc-diagnostic-panel {
    max-width:720px;
  }
}

@media (max-width:720px) {
  .page-services .svc-status {
    min-width:0;
    width:max-content;
  }
}

@media (max-width:640px) {
  .page-services .svc-hero-container {
    gap:32px;
    padding-top:42px;
    padding-bottom:44px;
  }

  .page-services .svc-actions {
    margin:26px 0 20px;
  }

  .page-services .svc-trust-badges {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
  }

  .page-services .svc-trust-badge {
    width:auto;
    min-height:34px;
    padding:6px 9px;
    font-size:10.5px;
  }

  .page-services .svc-trust-badge:last-child {
    grid-column:1 / -1;
    justify-self:start;
  }

  .page-services .svc-diagnostic-panel {
    padding:14px;
  }

  .page-services .svc-diagnostic-card {
    padding:15px;
  }

  .page-services .svc-diagnostic-text {
    font-size:11.8px;
  }

  .page-services .svc-help-title {
    font-size:11.2px;
  }

  .page-services .svc-help-text {
    font-size:9.7px;
  }
}

/* =========================================================
   DN TECH — V30 / HEADER UNIFICADO CON INICIO
   Mismo dark-glass, misma superposición y mismo estado scrolled.
   ========================================================= */

.page-services .site-header {
  position:fixed;
  top:0;
  left:0;
  right:0;
  width:100%;
  z-index:1000;
  background:
    linear-gradient(180deg,rgba(255,255,255,.045) 0%,rgba(255,255,255,.014) 44%,rgba(255,255,255,0) 100%),
    rgba(7,18,31,.58);
  -webkit-backdrop-filter:blur(22px) saturate(155%);
  backdrop-filter:blur(22px) saturate(155%);
  border-top:1px solid rgba(255,255,255,.028);
  border-bottom:1px solid rgba(112,205,246,.105);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 9px 30px rgba(0,0,0,.075);
}

.page-services .site-header.is-scrolled {
  background:
    linear-gradient(180deg,rgba(255,255,255,.042) 0%,rgba(255,255,255,.010) 46%,rgba(255,255,255,0) 100%),
    rgba(6,16,28,.76);
  -webkit-backdrop-filter:blur(24px) saturate(160%);
  backdrop-filter:blur(24px) saturate(160%);
  border-top-color:rgba(255,255,255,.018);
  border-bottom-color:rgba(105,201,243,.135);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.022),
    0 14px 38px rgba(0,0,0,.18);
}

/* Al estar el header superpuesto, el hero compensa su altura como Inicio. */
.page-services .svc-main { padding-top:0; }
.page-services .svc-hero { padding-top:0; }
.page-services .svc-hero-container {
  min-height:100vh;
  padding-top:calc(50px + var(--header-h));
  padding-bottom:50px;
}

/* Ajuste fino: un poco menos de brillo detrás del panel para que el header
   y el hero se sientan como una sola superficie. */
.page-services .svc-hero-ambient {
  background:rgba(28,137,233,.105);
}

@media (max-width:980px) {
  .page-services .svc-hero-container {
    min-height:auto;
    padding-top:calc(68px + var(--header-h));
  }
}

@media (max-width:640px) {
  .page-services .svc-hero-container {
    padding-top:calc(42px + var(--header-h));
    padding-bottom:44px;
  }
}

/* =========================================================
   DN TECH — V31 / POINTER GLOW + MICROINTERACCIONES
   Exclusivo de Servicio técnico. No afecta a Inicio ni a otras páginas.
   ========================================================= */

/* Halo ambiental que sigue al puntero, como en Inicio. */
.page-services .svc-hero {
  --svc-pointer-x:50%;
  --svc-pointer-y:46%;
}

.page-services .svc-hero::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(520px circle at var(--svc-pointer-x) var(--svc-pointer-y),
      rgba(76,201,255,.095),
      rgba(47,154,230,.035) 34%,
      transparent 68%);
  opacity:.95;
  transition:opacity .24s ease;
}

.page-services .svc-hero-container {
  position:relative;
  z-index:1;
}

/* El panel responde de forma muy sutil a la posición del cursor. */
.page-services .svc-diagnostic-panel {
  --svc-panel-x:66%;
  --svc-panel-y:18%;
  will-change:transform;
  transform-style:preserve-3d;
  transition:
    transform .24s cubic-bezier(.2,.72,.22,1),
    border-color .24s ease,
    box-shadow .24s ease;
}

.page-services .svc-diagnostic-panel::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  border-radius:inherit;
  background:radial-gradient(330px circle at var(--svc-panel-x) var(--svc-panel-y),rgba(80,207,255,.105),transparent 65%);
  opacity:.92;
}

.page-services .svc-diagnostic-panel:hover {
  border-color:rgba(104,212,255,.235);
  box-shadow:
    0 40px 88px rgba(0,0,0,.36),
    0 0 44px rgba(36,164,234,.035),
    inset 0 1px 0 rgba(255,255,255,.035);
}

/* Tarjetas: elevación, glow localizado y respuesta del icono/estado. */
.page-services .svc-diagnostic-card {
  --svc-card-x:50%;
  --svc-card-y:50%;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transition:
    transform .22s cubic-bezier(.2,.72,.22,1),
    border-color .22s ease,
    background .22s ease,
    box-shadow .22s ease;
}

.page-services .svc-diagnostic-card::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:radial-gradient(250px circle at var(--svc-card-x) var(--svc-card-y),rgba(86,211,255,.15),transparent 64%);
  opacity:0;
  transition:opacity .22s ease;
}

.page-services .svc-diagnostic-card > * {
  position:relative;
  z-index:1;
}

.page-services .svc-diagnostic-card:hover {
  transform:translateY(-4px) scale(1.003);
  border-color:rgba(110,215,255,.34);
  background:linear-gradient(135deg,rgba(255,255,255,.105),rgba(255,255,255,.032));
  box-shadow:
    0 16px 34px rgba(0,0,0,.15),
    inset 0 1px 0 rgba(255,255,255,.04);
}

.page-services .svc-diagnostic-card:hover::before {
  opacity:1;
}

.page-services .svc-diagnostic-icon {
  transition:
    transform .22s cubic-bezier(.2,.72,.22,1),
    border-color .22s ease,
    box-shadow .22s ease,
    background .22s ease;
}

.page-services .svc-diagnostic-card:hover .svc-diagnostic-icon {
  transform:translateY(-2px) scale(1.045);
  border-color:rgba(104,212,255,.36);
  background:linear-gradient(145deg,rgba(57,194,250,.22),rgba(18,111,201,.10));
  box-shadow:0 0 24px rgba(41,182,246,.09),inset 0 1px 0 rgba(255,255,255,.055);
}

.page-services .svc-status {
  transition:
    transform .22s cubic-bezier(.2,.72,.22,1),
    border-color .22s ease,
    background .22s ease,
    box-shadow .22s ease;
}

.page-services .svc-diagnostic-card:hover .svc-status {
  transform:translateX(-2px);
  box-shadow:0 0 18px rgba(78,194,244,.055);
}

.page-services .svc-help-link:hover .svc-help-icon {
  transform:translateY(-1px) scale(1.04);
}

.page-services .svc-help-icon {
  transition:transform .2s cubic-bezier(.2,.72,.22,1),border-color .2s ease,background .2s ease;
}

/* Touch y reduced motion: sin tilt ni movimientos innecesarios. */
@media (pointer:coarse) {
  .page-services .svc-hero::after { display:none; }
  .page-services .svc-diagnostic-panel,
  .page-services .svc-diagnostic-card { transform:none !important; }
}

@media (prefers-reduced-motion:reduce) {
  .page-services .svc-hero::after { display:none; }
  .page-services .svc-diagnostic-panel,
  .page-services .svc-diagnostic-card,
  .page-services .svc-diagnostic-icon,
  .page-services .svc-status,
  .page-services .svc-help-icon { transform:none !important; transition:none !important; }
}

/* =========================================================
   DN TECH — V32 / ÚLTIMOS MICROAJUSTES
   ========================================================= */

/* Más separación visual entre las tarjetas y el panel base. */
.page-services .svc-diagnostic-card {
  background:linear-gradient(135deg,rgba(255,255,255,.086),rgba(255,255,255,.026));
}

/* Las pills dejan de quedar tan pegadas al extremo derecho. */
.page-services .svc-status {
  margin-right:8px;
}

/* Párrafo del hero algo más editorial y compacto. */
.page-services .svc-hero-description {
  max-width:590px;
}

/* CTA inferior con algo más de presencia vertical. */
.page-services .svc-help-link {
  min-height:64px;
  padding:15px 16px;
}

@media (max-width:720px) {
  .page-services .svc-status { margin-right:0; }
}

/* =========================================================
   DN TECH — V34 / CIERRE DE SERVICIO TÉCNICO
   Office/Microsoft 365, alcance, CTA y revisión móvil.
   ========================================================= */

/* La pill de alcance necesita un poco más de anchura con "A domicilio". */
.page-services .svc-panel-location {
  padding-inline:11px;
  color:#a3bfd2;
}

/* CTA inferior un poco más visible y flecha con respuesta más clara. */
.page-services .svc-help-link {
  min-height:68px;
  padding:16px 16px;
}

.page-services .svc-help-arrow {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  font-size:17px;
  transition:transform .22s cubic-bezier(.2,.72,.22,1),text-shadow .22s ease,color .22s ease;
}

.page-services .svc-help-link:hover .svc-help-arrow {
  transform:translateX(7px);
  color:#91e8ff;
  text-shadow:0 0 18px rgba(104,212,255,.42);
}

/* El texto de software puede crecer ligeramente sin romper la tarjeta. */
.page-services #services-diagnostic-text-1 {
  max-width:440px;
}

/* Móvil: mensaje primero, acciones compactas, diagnóstico legible sin hacerse eterno. */
@media (max-width:640px) {
  .page-services .svc-hero-container {
    padding-top:calc(30px + var(--header-h));
    padding-bottom:38px;
    gap:28px;
  }

  .page-services .svc-eyebrow {
    margin-bottom:15px;
  }

  .page-services .svc-hero-title {
    font-size:clamp(38px,12.1vw,52px);
    line-height:1;
    margin-bottom:18px;
  }

  .page-services .svc-hero-description {
    font-size:15.5px;
    line-height:1.62;
  }

  .page-services .svc-actions {
    margin:22px 0 17px;
  }

  .page-services .svc-btn {
    min-height:48px;
  }

  .page-services .svc-trust-badges {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
  }

  .page-services .svc-trust-badge,
  .page-services .svc-trust-badge:last-child {
    grid-column:auto;
    justify-self:stretch;
    justify-content:center;
    min-height:32px;
    padding:5px 6px;
    font-size:9px;
    text-align:center;
  }

  .page-services .svc-diagnostic-panel {
    padding:13px;
    border-radius:22px;
  }

  .page-services .svc-panel-chrome {
    margin-bottom:10px;
  }

  .page-services .svc-panel-heading {
    gap:8px;
    margin-bottom:12px;
  }

  .page-services .svc-panel-title {
    font-size:22px;
  }

  .page-services .svc-panel-location {
    padding:6px 8px;
    font-size:8.5px;
  }

  .page-services .svc-panel-cards {
    gap:8px;
  }

  .page-services .svc-diagnostic-card {
    grid-template-columns:40px minmax(0,1fr);
    gap:10px 12px;
    padding:13px;
    border-radius:16px;
  }

  .page-services .svc-diagnostic-icon {
    width:40px;
    height:40px;
    border-radius:12px;
  }

  .page-services .svc-icon-svg {
    width:20px;
    height:20px;
  }

  .page-services .svc-diagnostic-kicker {
    font-size:8.3px;
  }

  .page-services .svc-diagnostic-title {
    font-size:15.8px;
  }

  .page-services .svc-diagnostic-text {
    font-size:10.7px;
    line-height:1.42;
  }

  .page-services .svc-status {
    grid-column:2;
    margin-top:-2px;
    padding:5px 8px;
    font-size:8.2px;
  }

  .page-services .svc-help-link {
    min-height:60px;
    margin-top:9px;
    padding:11px 12px;
    grid-template-columns:30px minmax(0,1fr) auto;
  }

  .page-services .svc-help-icon {
    width:30px;
    height:30px;
  }

  .page-services .svc-help-title {
    font-size:10.4px;
  }

  .page-services .svc-help-text {
    font-size:8.9px;
  }
}

@media (max-width:390px) {
  .page-services .svc-trust-badges {
    grid-template-columns:1fr 1fr;
  }
  .page-services .svc-trust-badge:last-child {
    grid-column:1 / -1;
    justify-self:start;
    width:auto;
    padding-inline:10px;
  }
}

/* =========================================================
   DN TECH — V35 / CIERRE VISUAL DEFINITIVO
   Microajustes finales vistos en navegador real.
   ========================================================= */

/* La pill de alcance respira un poco más sin ganar demasiado peso. */
.page-services .svc-panel-location {
  gap:8px;
  padding:7px 12px;
  color:#aac4d7;
  font-size:9.3px;
  letter-spacing:0;
  border-color:rgba(109,204,248,.13);
  background:rgba(255,255,255,.031);
}

/* +3–5 % de contraste en las descripciones de diagnóstico. */
.page-services .svc-diagnostic-text {
  color:#bbcedd;
}

/* El CTA de ayuda queda un poco más claramente accionable. */
.page-services .svc-help-link {
  border-color:rgba(104,212,255,.17);
}

.page-services .svc-help-arrow {
  color:#78dcff;
}

.page-services .svc-help-link:hover .svc-help-arrow {
  transform:translateX(8px);
  color:#a2edff;
  text-shadow:0 0 20px rgba(104,212,255,.52);
}

/* En móvil evitamos que la pill de alcance apriete el encabezado. */
@media (max-width:640px) {
  .page-services .svc-panel-heading {
    align-items:flex-start;
  }

  .page-services .svc-panel-location {
    max-width:100%;
    padding:6px 9px;
    font-size:8.2px;
    white-space:normal;
    line-height:1.25;
  }

  .page-services .svc-diagnostic-text {
    color:#b8ccdc;
  }

  .page-services .svc-help-arrow {
    font-size:16px;
  }
}