/* File: css/home-clinicas-escola.css */
/* Theme: portalv3.0 */
/* Estilo da section: Saúde pública / Clínicas-Escola */
/* Extraído de css/home.css (linhas 106-124). Regras originais permanecem em home.css. */

/* SAÚDE PÚBLICA */
.v2 .d-sp{background:var(--gray)}
.v2 .sp-lead{display:grid;grid-template-columns:55fr 45fr;padding:2.5rem 3rem 0}
.v2 .sp-img{position:relative;height:360px;overflow:hidden}
.v2 .sp-img img{width:100%;height:100%;object-fit:cover;filter:brightness(.72) saturate(.75);transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .6s ease}
.v2 .sp-img:hover img{transform:scale(1.08);filter:brightness(.82) saturate(.9)}
.v2 .sp-tag{position:absolute;bottom:14px;left:14px;background:var(--brand);color:#fff;font-family:var(--fn);font-size:10px;padding:4px 10px;text-transform:uppercase;letter-spacing:.8px}
.v2 .sp-copy{padding:0 0 0 3rem;display:flex;flex-direction:column;justify-content:center}
.v2 .sp-h{font-size:27px;font-weight:400;line-height:1.3;margin-bottom:.875rem}
.v2 .sp-p{font-family:var(--fn);font-size:13px;color:var(--tx2);line-height:1.75;margin-bottom:1.25rem}
.v2 .sp-rows{padding:0 3rem 3rem;margin-top:1.5rem}
.v2 .sp-row{display:grid;grid-template-columns:220px 1fr 96px;gap:2rem;align-items:start;padding:1.4rem 0;border-top:0.5px solid var(--border)}
.v2 .sp-row:last-child{border-bottom:0.5px solid var(--border)}
.v2 .sp-rt{font-family:var(--fn);font-size:14px;font-weight:700;line-height:1.4}
.v2 .sp-rd{font-family:var(--fn);font-size:13px;color:var(--tx2);line-height:1.7}
.v2 .sp-rd strong{color:var(--tx);font-weight:600;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.v2 .sp-ri{width:96px;height:74px;overflow:hidden}
.v2 .sp-ri img{width:100%;height:100%;object-fit:cover;object-position:center top}

/* ============================================================================
   RESPONSIVO (mobile/tablet) — Saúde pública no Cariri
   ----------------------------------------------------------------------------
   Este arquivo é extraído do home.css mas só trouxe as regras BASE (2 colunas)
   e NÃO as media queries. Como ele carrega DEPOIS do home.css com a mesma
   especificidade, o "grid-template-columns:55fr 45fr" vencia até no celular e a
   imagem ficava AO LADO do texto — só esta seção quebrava no mobile.
   Reproduzimos aqui o responsivo do home.css (linhas 317-323 e 379-381) para
   empilhar: imagem em cima, texto embaixo, igual às demais seções.
   ============================================================================ */
@media (max-width:1024px){
    .v2 .sp-lead{grid-template-columns:1fr;padding:1.5rem 1.25rem 0;gap:1.25rem}
    .v2 .sp-img{height:240px}
    .v2 .sp-copy{padding:0}
    .v2 .sp-h{font-size:22px}
    .v2 .sp-rows{padding:0 1.25rem 2rem}
    .v2 .sp-row{grid-template-columns:1fr;gap:.75rem}
    .v2 .sp-ri{display:none}
}

@media (max-width:640px){
    .v2 .sp-lead{padding:1.25rem 1rem 0}
    .v2 .sp-rows{padding:0 1rem 1.5rem}
    .v2 .sp-h{font-size:20px}
}