/* Servicios y Blog: se apoya en site.css y tema-prime.css. */
main { overflow-x: clip; }
@media (min-width: 1101px) { .tema-prime .nav-links { position: absolute; left: 50%; translate: -50% 0; margin: 0; } .tema-prime .nav .btn-sm { margin-left: auto; } }
[id] { scroll-margin-top: 96px; }
.grupo, .svc { scroll-margin-top: 150px; } /* la barra de saltos también queda fija */
main p, main li, main dd { font-size: 18px; }

.pag-head { display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; align-items: center; max-width: 1400px; margin: 0 auto; padding: 130px var(--pad) 40px; }
.pag-eti { font-weight: 600; color: var(--accent-deep); margin-bottom: 8px; }
.pag-head h1 { font-size: clamp(2.5rem, 1.4rem + 3.4vw, 4.5rem); }
.pag-head .lede { margin: 18px 0 26px; max-width: 58ch; color: var(--muted); }
.pag-av { margin: 0; background: #dcebff; border-radius: var(--radius); overflow: hidden; height: 340px; }
.pag-av img { width: 100%; height: 100%; object-fit: contain; object-position: 50% 100%; }

.saltos { position: sticky; top: 72px; z-index: 5; display: flex; gap: 8px; overflow-x: auto; max-width: 1400px; margin: 0 auto; padding: 12px var(--pad); background: var(--bg); }
.saltos a { flex: none; min-height: 44px; display: inline-flex; align-items: center; padding: 0 18px; border-radius: 999px; background: var(--card); color: var(--ink); text-decoration: none; font-weight: 500; }
.saltos a:hover { background: var(--accent-soft); }

.grupo { max-width: 1400px; margin: 0 auto; padding: 56px var(--pad) 24px; }
.grupo-head { display: grid; grid-template-columns: 1.3fr 1fr; gap: 32px; align-items: center; margin-bottom: 24px; }
.grupo-head figure { margin: 0; height: 190px; border-radius: var(--radius); overflow: hidden; background: #dcebff; }
.grupo-head img { width: 100%; height: 100%; object-fit: cover; }
.grupo-head img.dib { object-fit: contain; object-position: 50% 100%; }
.grupo-head p { margin-top: 10px; color: var(--muted); max-width: 62ch; }
.svc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.svc-grid, .arts { align-items: start; }
.svc, .art { background: var(--card); border-radius: var(--radius); overflow: hidden; }
summary { position: relative; display: block; padding: clamp(20px, 2.4vw, 28px); border-radius: var(--radius); cursor: pointer; list-style: none; }
summary::-webkit-details-marker { display: none; }
summary:hover h2, summary:hover h3 { color: var(--accent-deep); }
summary h2, summary h3 { font-size: 1.2rem; line-height: 1.2; }
summary h3 { padding-right: 36px; }
.thumb { position: relative; display: block; height: 220px; margin: calc(-1 * clamp(20px, 2.4vw, 28px)) calc(-1 * clamp(20px, 2.4vw, 28px)) 18px; background: #dcebff; }
.thumb img { width: 100%; height: 100%; object-fit: cover; }
.sim { position: absolute; left: 12px; bottom: 12px; padding: 3px 10px; border-radius: 999px; background: rgba(255, 255, 255, 0.92); color: var(--ink); font-size: 14px; }
.art summary .chev { top: 12px; right: 12px; background: #fff; }
.resumen { display: block; margin-top: 8px; font-size: 18px; line-height: 1.6; color: var(--muted); }
/* Cerradas miden igual: caben dos o tres líneas de título y tres de resumen. */
details:not([open]) .resumen { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.svc:not([open]) > summary { min-height: 196px; }
.art:not([open]) > summary { min-height: 430px; }
.tema-prime .svc[open], .tema-prime .art[open] { box-shadow: none; outline: 1.5px solid var(--accent); outline-offset: -1.5px; }
details:not([open]) > summary .chev { transform: none; }
summary .chev { position: absolute; top: clamp(20px, 2.4vw, 28px); right: 22px; transition: transform 0.2s; }
details[open] > summary .chev { transform: rotate(180deg); background: var(--bg); color: inherit; }
.mas p { padding: 0; max-width: none; animation: none; }
.mas { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 0 clamp(20px, 2.4vw, 28px) clamp(20px, 2.4vw, 28px); }
.mas > * { width: 100%; }
.svc:target { box-shadow: inset 0 0 0 2px var(--accent); }
.svc .mas > p { color: var(--muted); }
.svc h4 { margin: 6px 0 0; font: 600 1rem/1.3 Inter, sans-serif; }
.svc ul { margin: 0; padding-left: 20px; display: grid; gap: 4px; }
.svc dl { margin: 6px 0 0; display: grid; gap: 8px; padding-top: 14px; border-top: 1px solid var(--line); }
.svc dl div { display: grid; grid-template-columns: 112px 1fr; gap: 12px; }
.svc dt { font-weight: 600; font-size: 16px; }
.svc dd { margin: 0; color: var(--muted); }
.mas > .link-arrow { width: auto; }

.arts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; max-width: 1400px; margin: 0 auto; padding: 16px var(--pad) 24px; }
.art h3 { margin: 12px 0 -6px; font: 600 1.15rem/1.3 Inter, sans-serif; text-transform: none; letter-spacing: 0; }
.alerta { padding: 16px 20px; border-radius: 16px; background: #fdecec; color: #5e1414; }
.art-fuentes { padding-top: 4px; border-top: 1px solid var(--line); }
.art-fuentes h3 { font-size: 1rem; margin: 12px 0 4px; }
.art-fuentes ul { margin: 0; padding-left: 20px; }
.art-fuentes li { font-size: 16px; }

.nota { max-width: 1400px; margin: 0 auto; padding: 32px var(--pad) 0; color: var(--muted); }
.nota h2 { margin: 22px 0 10px; font-size: 1.2rem; }
.nota ul { margin: 0 0 12px; padding-left: 20px; columns: 2; }
.nota li { font-size: 16px; }

@media (max-width: 1100px) {
  .svc-grid, .arts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .svc-grid, .arts, .grupo-head { grid-template-columns: 1fr; }
  .grupo-head { gap: 16px; }
  .pag-head { grid-template-columns: 1fr; padding-top: 100px; gap: 24px; }
  .pag-av { height: 240px; }
  .nota ul { columns: 1; }
  .svc dl div { grid-template-columns: 112px minmax(0, 1fr); }
}

/* Teléfono: enlaces a fuentes de 44 px de alto. */
@media (max-width: 860px) { .nota li a, .art-fuentes li a { display: inline-flex; align-items: center; min-height: 44px; } }
@media (max-width: 400px) { .svc dl div { grid-template-columns: minmax(0, 1fr); gap: 2px; } }