/* Subpáginas de Electrónica (inc/electronica-sub.php). Solo lo que no está ya
   en producto.css: el enlace de vuelta, las tarjetas enlazadas con foto, la
   cita, los pasos a tres columnas y la fila de chips para seguir por la
   sección. Todo con los tokens del tema. */

/* Enlace «Volver a Electrónica»: la flecha mira atrás y se mueve hacia atrás. */
.link.volver:hover svg{transform:translateX(-4px)}
.link.volver{color:var(--steel)}
.link.volver:hover{color:var(--ink)}
.chip.volver svg{transform:none}
.chip.volver:hover svg{transform:translateX(-3px)}

/* La subnavegación de sección tiene nueve entradas: se puede partir en dos
   líneas sin perder la línea base. */
.subnav-electronica .wrap{row-gap:0}

/* Tarjetas .ambitos enlazadas (servicios relacionados, sectores). */
.ambitos > a.tarjeta{display:block;color:inherit;text-decoration:none;border-radius:6px}
.ambitos > a.tarjeta article{height:100%;display:flex;flex-direction:column}
.ambitos > a.tarjeta .cuerpo{display:flex;flex-direction:column;flex:1}
.ambitos > a.tarjeta .cuerpo .link{margin-top:auto;padding-top:16px;font-size:.88rem;color:var(--steel);transition:color .3s}
.ambitos > a.tarjeta:hover .cuerpo .link{color:var(--orange-deep)}
.ambitos > a.tarjeta:hover .cuerpo .link svg{transform:translateX(4px)}
.ambitos .cuerpo > p + p{margin-top:10px}
.ambitos .cuerpo .lista-marcas{margin-top:12px}
.ambitos .cuerpo .lista-marcas + p{margin-top:12px}

/* Con foto: la tarjeta pierde el relleno y la foto ocupa la parte alta. */
.ambitos.con-foto{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.ambitos.con-foto article{padding:0;overflow:hidden}
.ambitos.con-foto figure{margin:0;aspect-ratio:16/10;background:var(--paper-2);overflow:hidden}
.ambitos.con-foto figure img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 1s var(--ease)}
.ambitos.con-foto article:hover figure img{transform:none}
.ambitos.con-foto .cuerpo{padding:22px 24px 26px}
@media (min-width:1001px){.ambitos.con-foto{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Cita del enfoque (Equipo y metodología). */
.cita{margin:clamp(40px,5vw,72px) 0 0;padding:clamp(24px,3vw,40px) 0 0;border-top:1px solid var(--line);max-width:52ch}
.cita > p:not(.eyebrow){margin-top:18px;font-family:var(--display);font-variation-settings:'wdth' 104;font-weight:500;font-size:clamp(1.35rem,2.2vw,2rem);letter-spacing:-.02em;line-height:1.22;color:var(--ink);text-wrap:balance}
.cita > p:not(.eyebrow)::before{content:"“";color:var(--orange)}
.cita > p:not(.eyebrow)::after{content:"”";color:var(--orange)}

/* Tres pasos en vez de cuatro (Cómo trabajamos). */
.pasos.tres{grid-template-columns:repeat(3,minmax(0,1fr))}
.pasos.tres li:nth-child(4n)::after{display:block}
.pasos.tres li:last-child::after{display:none}
@media (max-width:900px){.pasos.tres{grid-template-columns:repeat(2,minmax(0,1fr))}.pasos.tres li:nth-child(2n)::after{display:none}}
@media (max-width:560px){.pasos.tres{grid-template-columns:1fr}.pasos.tres li::after{display:none}}

/* El bloque oscuro con dos columnas de texto en vez de tres. */
.adv-foot.dos{grid-template-columns:repeat(2,minmax(0,1fr))}
.adv-foot.dos p{max-width:52ch}
.adv-foot h3 + p + p{margin-top:10px}
@media (max-width:1000px){.adv-foot.dos{grid-template-columns:1fr}}

/* Fila de chips para seguir por la sección, justo antes del contacto. */
.puertas-sec{padding-bottom:0}
.puertas-sec .doors{padding-top:clamp(24px,3vw,40px);border-top:1px solid var(--line)}
.puertas-sec .doors .lbl{width:100%;margin-bottom:6px}
.puertas-sec .chip{color:var(--ink)}

/* Rejilla de fichas: el claim como etiqueta bajo el título. */
.pj .cap .tags span{text-transform:none;letter-spacing:0;font-family:var(--body);font-size:.8rem;border:0;padding:0;color:var(--ink-2)}

/* Navegación de especialidades de Electrónica · 0.17.18 */
.barra-area{position:sticky;top:var(--nav-h);z-index:45;margin-top:76px;background:rgba(246,246,244,.9);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:inset 0 -1px 0 var(--line)}
.barra-area .wrap{display:flex;align-items:stretch;gap:clamp(18px,2.4vw,34px);height:54px;position:relative}
.barra-area .raiz{display:inline-flex;align-items:center;gap:8px;padding-right:clamp(18px,2.4vw,34px);border-right:1px solid var(--line);font-family:var(--display);font-variation-settings:'wdth' 110;font-weight:700;font-size:1.02rem;letter-spacing:-.02em;white-space:nowrap;box-shadow:inset 0 -2px 0 transparent;transition:color .3s,box-shadow .3s}
.barra-area .raiz svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.9;transition:transform .35s var(--ease)}
.barra-area .raiz:hover svg{transform:translateX(-3px)}
.barra-area .raiz[aria-current]{box-shadow:inset 0 -2px 0 var(--orange)}
.barra-area .raiz .i{color:var(--orange)}
.barra-area .items{display:flex;gap:clamp(16px,2.2vw,30px);overflow-x:auto;scrollbar-width:none}
.barra-area .items::-webkit-scrollbar{display:none}
.barra-area .items a{display:flex;align-items:center;font-size:.9rem;font-weight:500;color:var(--steel);white-space:nowrap;box-shadow:inset 0 -2px 0 transparent;transition:color .3s,box-shadow .3s}
.barra-area .items a:hover{color:var(--ink)}
.barra-area .items a[aria-current]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--orange)}
.barra-area .accion{margin-left:auto;align-self:center;padding:8px 14px;font-size:.84rem}
.barra-area .plegable{display:none;align-items:center;gap:8px;margin-left:auto;font-size:.88rem;font-weight:500;color:var(--ink-2)}
.barra-area .plegable .c{font-family:var(--mono);font-size:.64rem;color:var(--orange-deep)}
.barra-area .plegable svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.9;transition:transform .3s var(--ease)}
.barra-area.abierta .plegable svg{transform:rotate(180deg)}
@media (max-width:760px){
  .barra-area .items{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;padding:8px 0 14px;background:var(--paper);box-shadow:0 1px 0 var(--line),0 30px 40px -30px rgba(30,32,35,.4)}
  .barra-area.abierta .items{display:flex}
  .barra-area .items a{padding:12px 0;border-bottom:1px solid var(--line);box-shadow:none}
  .barra-area .items a[aria-current]{color:var(--orange-deep)}
  .barra-area .accion{display:none}
  .barra-area .plegable{display:inline-flex}
}
.ahero.tras-barra{padding-top:clamp(36px,5vw,72px)}
.crumb a.mark:hover span{color:var(--ink);text-decoration:underline;text-underline-offset:4px}

/* B · Especialidades en la portada del área (dos o más). */
.esp-grid{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:clamp(12px,1.4vw,20px);margin-top:clamp(28px,4vw,48px)}
.esp{display:flex;flex-direction:column;border-radius:6px;overflow:hidden;background:#fff;box-shadow:inset 0 0 0 1px var(--line);transition:transform .45s var(--ease),box-shadow .35s}
.esp:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px var(--line-strong),0 24px 40px -28px rgba(30,32,35,.45)}
.esp figure{margin:0;aspect-ratio:16/10;overflow:hidden;background:var(--paper-2)}
.esp figure img{width:100%;height:100%;object-fit:cover;transform:scale(1.03);transition:transform 1s var(--ease)}
.esp:hover figure img{transform:none}
.esp-grid.dos .esp figure{aspect-ratio:2/1}
.esp .cuerpo{display:flex;flex-direction:column;gap:8px;flex:1;padding:20px 22px 22px}
.esp .n{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;color:#9c5800}
.esp h3{font-size:1.12rem;letter-spacing:-.01em}
.esp p{font-size:.92rem;line-height:1.55;color:var(--ink-2)}
.esp .link{margin-top:auto;padding-top:14px;color:var(--steel);font-size:.88rem}
.esp:hover .link{color:var(--orange-deep)}
.esp:hover .link svg{transform:translateX(4px)}
@media (max-width:1000px){.esp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.esp-grid{grid-template-columns:1fr}}


.electronica-nav{top:76px}.electronica-nav .plegable{border:0;background:none;cursor:pointer;font:inherit}.electronica-nav a{text-decoration:none}.electronica-especialidades .esp{min-width:0;text-decoration:none;color:inherit}.electronica-articulos .notas{grid-template-columns:repeat(3,minmax(0,1fr))}#especialidades,#sectores,#proyectos,#articulos,#preguntas{scroll-margin-top:150px}@media(max-width:760px){.electronica-nav .raiz{font-size:.95rem}.electronica-articulos .notas{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.electronica-especialidades .esp,.electronica-especialidades img{transition:none;transform:none}}

/* Align with the fixed header when the WordPress toolbar is visible. */
.admin-bar .electronica-nav{top:108px}@media(max-width:782px){.admin-bar .electronica-nav{top:122px}}