/* ============================================================
   ICDS · Ajustes específicos da página Quem Somos
   (carrega depois de styles.css e pages.css)
   ============================================================ */



/* ---- Atendimentos e especialidades por unidade ---- */
.spec-block{margin-top:40px}
.spec-title{font-size:var(--ic-fs-h3);color:var(--ic-navy-900);margin-bottom:22px}
.spec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.spec-card{background:#fff;border:1px solid var(--ic-gray-200);border-radius:var(--ic-radius-card);padding:28px 26px;box-shadow:var(--ic-shadow-card)}
.spec-card .spec-head{display:flex;align-items:center;gap:14px;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--ic-gray-200)}
.spec-card .spec-uf{flex:none;width:44px;height:44px;border-radius:10px;background:var(--ic-primary-soft);color:var(--ic-primary);font-family:var(--ic-font-display);font-weight:800;display:inline-flex;align-items:center;justify-content:center;font-size:.9rem}
.spec-card h4{font-size:1.1rem;margin:0;line-height:1.2;color:var(--ic-navy-900)}
.spec-card .spec-loc{font-size:.82rem;color:var(--ic-gray-500)}
.spec-card .brand-tag{display:inline-flex;align-items:center;gap:7px;font-size:.76rem;font-weight:600;font-family:var(--ic-font-display);color:var(--ic-gray-500);margin-top:4px}
.spec-card .brand-tag .mdot{width:8px;height:8px;border-radius:50%;flex:none}
.spec-list{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.spec-list li{font-size:.82rem;font-weight:500;color:var(--ic-navy-800);background:var(--ic-gray-50);border:1px solid var(--ic-gray-200);border-radius:100px;padding:7px 13px}
@media(max-width:960px){.spec-grid{grid-template-columns:1fr}}

/* ---- Presidente em destaque (foto inteira sobre painel claro) ---- */
.leader.feature{grid-template-columns:.9fr 1.1fr;gap:60px;align-items:stretch}
.leader.feature .portrait{align-self:stretch;display:flex;align-items:flex-end;justify-content:center;
  background:radial-gradient(120% 85% at 50% 0,var(--ic-primary-soft) 0,#EEF3FC 60%,#E7EEF9 100%);
  border-radius:var(--ic-radius-card);padding:26px 18px 0;position:relative;overflow:hidden;min-height:460px}
.leader.feature .portrait::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(13,94,244,.16) 1.6px,transparent 1.6px);background-size:16px 16px;opacity:.5;pointer-events:none}
.leader.feature .portrait>img{position:relative;z-index:1;width:auto;max-width:100%;max-height:440px;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:0;box-shadow:none;filter:drop-shadow(0 24px 40px rgba(6,23,56,.22))}
.leader.feature h2{font-size:clamp(2rem,3.2vw,2.6rem)}
@media(max-width:900px){.leader.feature{grid-template-columns:1fr;gap:36px}.leader.feature .portrait{min-height:0;padding-top:26px}.leader.feature .portrait>img{max-height:380px}}

/* ---- Ícones nos pilares (governança / integridade / transparência) ---- */
.pillar .ic-iconbox{margin-bottom:18px}
.pillar .ic-iconbox svg{width:27px;height:27px;fill:#fff}

/* ---- Blocos de documento com miniatura (30% imagem / 70% conteúdo) ---- */
.doc-split-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media(max-width:820px){.doc-split-grid{grid-template-columns:1fr}}
.doc-split{display:grid;grid-template-columns:30% 1fr;align-items:stretch;background:#fff;border:1px solid var(--ic-gray-200);border-radius:var(--ic-radius-card);overflow:hidden;box-shadow:var(--ic-shadow-card);transition:transform var(--ic-t-med) var(--ic-ease),box-shadow var(--ic-t-med) var(--ic-ease)}
.doc-split:hover{transform:translateY(-6px);box-shadow:var(--ic-shadow-hover)}
.doc-split .thumb{position:relative;background:linear-gradient(155deg,var(--ic-primary),var(--ic-primary-light));display:flex;align-items:center;justify-content:center;color:#fff;min-height:158px}
.doc-split .thumb::after{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.2) 1.6px,transparent 1.6px);background-size:14px 14px}
.doc-split .thumb svg{position:relative;z-index:1;width:46px;height:46px;fill:#fff}
.doc-split .thumb img{width:100%;height:100%;object-fit:cover}
.doc-split .body{padding:26px 26px;display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.doc-split .body h3{font-size:1.15rem}
.doc-split .body p{font-size:var(--ic-fs-small);flex:1;margin:0}
@media(max-width:600px){.doc-split{grid-template-columns:36% 1fr}.doc-split .thumb{min-height:0}}

/* ---- Mapa estratégico (Balanced Scorecard) em HTML/CSS animado ---- */
.bsc-wrap{background:var(--ic-gray-50);border:1px solid var(--ic-gray-200);border-radius:26px;padding:20px}
.bsc-wrap.reveal{opacity:1;transform:none}            /* visível; .in dispara o stagger das células */
.bsc{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.bsc .cell{border-radius:12px;padding:15px 13px;display:flex;flex-direction:column;justify-content:center;min-height:72px;opacity:0;transform:translateY(14px) scale(.97)}
.bsc-wrap.in .cell{animation:bsc-pop .5s var(--ic-ease) forwards;animation-delay:calc(var(--i,0)*.05s)}
@keyframes bsc-pop{to{opacity:1;transform:none}}
.bsc .o{background:#fff;border:1px solid var(--ic-gray-200);color:var(--ic-gray-500);font-size:.72rem;line-height:1.3;font-weight:500}
.bsc .n{background:var(--ic-navy-900);color:#fff;align-items:center;text-align:center;gap:5px;font-family:var(--ic-font-display);font-weight:800;letter-spacing:.4px;text-transform:uppercase;font-size:.82rem;transition:transform var(--ic-t-fast) var(--ic-ease),box-shadow var(--ic-t-fast) var(--ic-ease)}
.bsc .n:hover{transform:translateY(-3px);box-shadow:var(--ic-shadow-card)}
.bsc .n .ar{color:var(--ic-primary-light);font-size:1.05rem;line-height:1;display:block}
.bsc .n.center{background:linear-gradient(135deg,var(--ic-primary-hover),var(--ic-primary));min-height:92px;font-size:.98rem}
.bsc .span2{grid-column:span 2}
@media(prefers-reduced-motion:no-preference){
  .bsc .ar.r{animation:ar-r 2.4s var(--ic-ease) infinite}
  .bsc .ar.d{animation:ar-d 2.4s var(--ic-ease) infinite}
  .bsc .ar.l{animation:ar-l 2.4s var(--ic-ease) infinite}
  .bsc .ar.u{animation:ar-u 2.4s var(--ic-ease) infinite}
}
@keyframes ar-r{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
@keyframes ar-d{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
@keyframes ar-l{0%,100%{transform:translateX(0)}50%{transform:translateX(-4px)}}
@keyframes ar-u{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(max-width:600px){.bsc{grid-template-columns:repeat(2,1fr)}}

/* ---- Identidade: imagem no topo de cada item ---- */
.identity .col{display:flex;flex-direction:column}
.identity .col-img{order:-1;height:104px;border-radius:10px;overflow:hidden;margin-bottom:20px}
.identity .col-img img{width:100%;height:100%;object-fit:cover}

/* ---- Especialidades em accordion (fechado por default) ---- */
.spec-block{margin-top:44px}
.spec-title{font-size:var(--ic-fs-h3);color:var(--ic-navy-900);margin-bottom:22px}
.spec-acc{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:start}
@media(max-width:900px){.spec-acc{grid-template-columns:1fr}}
.spec-item{background:#fff;border:1px solid var(--ic-gray-200);border-radius:var(--ic-radius-card);box-shadow:var(--ic-shadow-card);overflow:hidden}
.spec-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:13px;padding:16px 18px;transition:background var(--ic-t-fast)}
.spec-item summary:hover{background:var(--ic-gray-50)}
.spec-item summary::-webkit-details-marker{display:none}
.spec-logo{height:46px;width:auto;max-width:150px;flex:none;object-fit:contain}
.spec-h{display:flex;flex-direction:column;flex:1 1 auto;min-width:0}
.spec-h b{font-family:var(--ic-font-display);font-weight:700;color:var(--ic-navy-900);font-size:1.05rem;line-height:1.2}
.spec-h small{color:var(--ic-gray-500);font-size:.82rem;margin-top:2px}
.spec-arrow{width:20px;height:20px;fill:var(--ic-primary);flex:none;transition:transform var(--ic-t-fast)}
.spec-item[open] .spec-arrow{transform:rotate(180deg)}
.spec-item .spec-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0 22px 22px}
.spec-item .spec-list li{font-size:.82rem;font-weight:500;color:var(--ic-navy-800);background:var(--ic-gray-50);border:1px solid var(--ic-gray-200);border-radius:100px;padding:7px 13px}

/* ---- BSC: coluna esquerda menor / direita maior + hover nos blocos ---- */
.bsc-split{grid-template-columns:.6fr 1fr}
@media(max-width:900px){.bsc-split{grid-template-columns:1fr}}
.bsc .cell{transition:transform var(--ic-t-fast) var(--ic-ease),box-shadow var(--ic-t-fast) var(--ic-ease)}
.bsc .cell:hover{transform:scale(1.05)!important;z-index:2;position:relative;box-shadow:var(--ic-shadow-card)}

/* ---- Nossos Valores: centralizado com icone animado ---- */
.value-grid.values-center{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}
.values-center .value-card{flex:0 1 268px;text-align:center;display:flex;flex-direction:column;align-items:center}
.values-center .value-card p{max-width:34ch}
.val-ic{width:58px;height:58px;border-radius:50%;background:var(--ic-primary-soft);display:inline-flex;align-items:center;justify-content:center;margin-bottom:16px}
.val-ic svg{width:28px;height:28px;fill:var(--ic-primary);transition:fill var(--ic-t-fast)}
@media(prefers-reduced-motion:no-preference){
  .val-ic{animation:val-float 3s var(--ic-ease) infinite}
  .values-center .value-card:nth-child(3n) .val-ic{animation-delay:.5s}
  .values-center .value-card:nth-child(3n+2) .val-ic{animation-delay:1s}
}
@keyframes val-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.values-center .value-card:hover .val-ic{animation-play-state:paused;transform:scale(1.1)!important;background:var(--ic-primary)}
.values-center .value-card:hover .val-ic svg{fill:#fff}