/* Servicios — templates/archive-servicio.html, single-servicio.html.
   Mismo criterio que blog.css/portfolio.css: estiliza las clases que ya
   genera el Query Loop en vez de reinventar la estructura. */

.sv-hero{padding:3.5rem 0 2.5rem;text-align:center}
.sv-hero .section-intro{margin:0 auto}
.sv-archive{padding-bottom:4rem}

.sv-grid .wp-block-post-template{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;list-style:none;margin:0;padding:0}
.sv-grid .wp-block-post{background:var(--cream);border:1px solid var(--gray-100);border-radius:var(--r-lg);padding:1.5rem;transition:transform var(--t),box-shadow var(--t)}
.sv-grid .wp-block-post:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm)}
.sv-grid .sv-card-tag{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--green-dark);background:var(--green-soft);padding:.25rem .55rem;border-radius:var(--r-sm);margin-bottom:.75rem}
.sv-grid .sv-card-tag a{color:inherit}
.sv-grid .wp-block-post-title{font-size:1.02rem;margin:0 0 .4rem}
.sv-grid .wp-block-post-title a{color:var(--black)}
.sv-grid .wp-block-post-title a:hover{color:var(--purple)}
.sv-grid .wp-block-post-excerpt{font-size:.9rem;color:var(--gray-700)}

@media (max-width:980px){.sv-grid .wp-block-post-template{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.sv-grid .wp-block-post-template{grid-template-columns:1fr}}

.sv-single{padding:3rem 0 4rem}
.sv-single-wrap{max-width:760px}
.sv-back{display:inline-block;margin-bottom:1.5rem;font-size:.88rem;font-weight:600;color:var(--green-dark)}
.sv-back:hover{text-decoration:underline}
.sv-single-tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--green-dark);background:var(--green-soft);padding:.3rem .65rem;border-radius:var(--r-sm);margin-bottom:.85rem}
.sv-single-tag a{color:inherit}
.sv-single .wp-block-post-title{margin-bottom:.75rem;font-size:clamp(1.7rem,3vw,2.2rem)}

/*
 * Ficha de servicio como página de ventas, no como artículo: entrada
 * (subtítulo) → el reto → qué incluye (beneficio, no solo lista) → cómo
 * funciona (pasos, quita incertidumbre) → modalidad → preguntas
 * frecuentes (maneja objeciones) → CTA. La estructura vive en el propio
 * contenido (títulos H2/H3 + listas) — este CSS solo estiliza esos
 * elementos genéricos, así que aplica igual a cualquier servicio nuevo
 * sin tener que enseñarle a nadie una sintaxis especial.
 */
.sv-lead{font-size:1.1rem;line-height:1.6;color:var(--black);font-weight:500;margin-bottom:2rem;padding-bottom:2rem;border-bottom:1px solid var(--gray-100)}

.sv-single .wp-block-post-content{font-size:1.02rem;line-height:1.75;color:var(--gray-700)}
.sv-single .wp-block-post-content > p{margin-bottom:1.25rem}
.sv-single .wp-block-post-content h2{display:flex;align-items:center;gap:.65rem;font-size:1.3rem;margin:2.5rem 0 1.1rem}
.sv-single .wp-block-post-content h2::before{content:'';flex:none;width:26px;height:3px;border-radius:2px;background:var(--green)}
.sv-single .wp-block-post-content h3{font-size:1.02rem;color:var(--black);margin:1.5rem 0 .4rem;display:flex;gap:.55rem;align-items:baseline}
.sv-single .wp-block-post-content h3::before{content:'P';flex:none;width:20px;height:20px;line-height:20px;text-align:center;border-radius:50%;background:var(--purple-soft);color:var(--purple);font-size:.72rem;font-weight:800;font-family:var(--serif-b)}

/* Listas genéricas (párrafos sueltos, listas sin className) — se ven bien
   por defecto sin tener que marcarlas a mano. */
.sv-single .wp-block-post-content > ul,.sv-single .wp-block-post-content > ol{margin:0 0 1.25rem 1.1rem}
.sv-single .wp-block-post-content > ul > li,.sv-single .wp-block-post-content > ol > li{margin-bottom:.5rem;color:var(--gray-700)}

/* "Qué incluye" — lista de beneficios con check, en vez de viñetas. */
.sv-single .wp-block-post-content ul.sv-benefits{list-style:none;margin:0 0 1.5rem;padding:0;display:flex;flex-direction:column;gap:.65rem}
.sv-single .wp-block-post-content ul.sv-benefits li{display:flex;align-items:flex-start;gap:.65rem;color:var(--black);font-weight:500;margin:0}
.sv-single .wp-block-post-content ul.sv-benefits li::before{content:'✓';flex:none;width:22px;height:22px;border-radius:50%;background:var(--green-soft);color:var(--green-dark);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:.72rem;margin-top:1px}

/* "Cómo funciona" — pasos numerados, quita incertidumbre del proceso. */
.sv-single .wp-block-post-content ol.sv-steps{list-style:none;margin:0 0 1.5rem;padding:0;counter-reset:sv-step;display:flex;flex-direction:column;gap:1rem}
.sv-single .wp-block-post-content ol.sv-steps li{counter-increment:sv-step;position:relative;padding-left:2.75rem;color:var(--gray-700);margin:0}
.sv-single .wp-block-post-content ol.sv-steps li::before{content:counter(sv-step);position:absolute;left:0;top:-2px;width:34px;height:34px;background:var(--purple);color:var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--serif-h);font-weight:800;font-size:.92rem}
.sv-single .wp-block-post-content ol.sv-steps li strong{display:block;color:var(--black);margin-bottom:.15rem}

/* Modalidad — callout, no un párrafo perdido entre el resto del texto. */
.sv-modality{background:var(--purple-soft);border:1px solid rgba(75,46,131,.18);border-radius:var(--r-md);padding:1rem 1.25rem;font-size:.94rem;color:var(--black);margin:0 0 1.5rem}
.sv-modality strong{color:var(--purple)}

.sv-cta{margin-top:2.5rem;padding:2rem;background:var(--gray-100);border-radius:var(--r-lg);text-align:center}
.sv-cta p{margin-bottom:1rem;color:var(--gray-700);font-size:1.02rem}