*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --sky: #4BA8D8;
  --sky-light: #D6EEFA;
  --sky-mid: #8CCCE8;
  --sky-dark: #1F6B9A;
  --navy: #0D3A5C;
  --warm-white: #F7FAFE;
  --soft-bg: #EEF6FC;
  --text-dark: #0D2A3D;
  --text-mid: #4A6478;
  --text-light: #8AABBE;
  --warm: #F0A868;
  --warm-light: #FEF3E8;
  --radius-lg: 16px;
  --radius-md: 10px;
  --gap: 12px;
  --section-pad-y: 72px;
  --block-pad-y: 80px;
  --card-pad-y: 32px;
}

/* ─── TWEAKS: paleta institucional ─── */
html[data-palette="acolhedor"] {
  --sky: #E08A5C;
  --sky-light: #FBE6D6;
  --sky-mid: #F0AE7D;
  --sky-dark: #B85F30;
  --navy: #5C2E14;
  --warm: #4BA8D8;
  --warm-light: #EAF6FC;
}
html[data-palette="clinico"] {
  --sky: #2E9B85;
  --sky-light: #D7F0EA;
  --sky-mid: #6FC4B0;
  --sky-dark: #1B6656;
  --navy: #123B33;
  --warm: #E08A5C;
  --warm-light: #FBE6D6;
}

/* ─── TWEAKS: densidade editorial ─── */
html[data-density="compacta"] {
  --gap: 8px;
  --section-pad-y: 44px;
  --block-pad-y: 52px;
  --card-pad-y: 20px;
}
html[data-density="espacosa"] {
  --gap: 20px;
  --section-pad-y: 108px;
  --block-pad-y: 128px;
  --card-pad-y: 44px;
}

/* ─── TWEAKS: estilo do título ─── */
html[data-title-style="sans"] .hero-busca-title,
html[data-title-style="sans"] .intro-split-title,
html[data-title-style="sans"] .areas-titulo,
html[data-title-style="sans"] .area-texto-title,
html[data-title-style="sans"] .section-title,
html[data-title-style="sans"] .step-title,
html[data-title-style="sans"] .apoio-title,
html[data-title-style="sans"] .fazemos-title,
html[data-title-style="sans"] .cta-title,
html[data-title-style="sans"] .contato-form h3,
html[data-title-style="sans"] .pilar-titulo,
html[data-title-style="sans"] .blog-titulo,
html[data-title-style="sans"] .page-hero-title,
html[data-title-style="sans"] .flow-num,
html[data-title-style="sans"] .flow-item h4,
html[data-title-style="sans"] .quote-band blockquote,
html[data-title-style="sans"] .metric-card h4,
html[data-title-style="sans"] .galeria-ano-num,
html[data-title-style="sans"] .galeria-evento-titulo,
html[data-title-style="sans"] .pub-title,
html[data-title-style="sans"] .pub-group-title {
  font-family: 'Nunito', sans-serif;
  font-weight: 800;
  letter-spacing: -0.01em;
}
html[data-title-style="sans"] .intro-split-title em,
html[data-title-style="sans"] .page-hero-title em {
  font-style: normal;
  font-weight: 800;
  color: var(--sky-dark);
}
html[data-title-style="sans"] .quote-band blockquote {
  font-style: normal;
}

body {
  font-family: 'Nunito', sans-serif;
  background: var(--soft-bg);
  color: var(--text-dark);
  font-size: 16px;
  line-height: 1.6;
}

/* ─── AVISO TOPO ─── */
.top-bar {
  background: #0D2A3D;
  padding: 10px 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.top-bar p {
  font-size: 13px;
  color: rgba(255,255,255,0.75);
  font-weight: 600;
}

.top-bar a {
  color: var(--sky-mid);
  text-decoration: underline;
  font-weight: 700;
}

.top-bar-close {
  background: none;
  border: none;
  color: rgba(255,255,255,0.5);
  font-size: 18px;
  cursor: pointer;
  line-height: 1;
}

/* ─── NAV ─── */
nav {
  background: white;
  padding: 0 48px;
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 1px 0 #D6EEFA;
  position: sticky;
  top: 0;
  z-index: 100;
}

.nav-logo {
  display: flex;
  align-items: center;
  gap: 10px;
}

.nav-logo-badge {
  background: var(--sky);
  color: white;
  font-family: 'Nunito', sans-serif;
  font-weight: 800;
  font-size: 15px;
  padding: 6px 14px;
  border-radius: 50px;
  letter-spacing: 0.04em;
}

.nav-logo-sub {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-light);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.nav-links {
  display: flex;
  gap: 28px;
  list-style: none;
}

.nav-links a {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-mid);
  text-decoration: none;
  transition: color 0.2s;
}

.nav-links a:hover { color: var(--sky); }

.nav-cta {
  background: var(--sky);
  color: white !important;
  padding: 10px 24px;
  border-radius: 50px;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.2s;
}

.nav-cta:hover { background: var(--sky-dark); }

.lang-switch { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; letter-spacing: 0.02em; margin-right: 4px; }
.lang-btn { background: none; border: none; padding: 4px 6px; border-radius: 6px; cursor: pointer; color: var(--text-light); font-family: 'Nunito', sans-serif; font-size: 13px; font-weight: 700; }
.lang-btn.active { color: var(--sky-dark); background: var(--sky-light); }
.lang-sep { color: var(--text-light); font-weight: 400; }

.nav-cta-group {
  display: flex;
  align-items: center;
  gap: 12px;
}

.nav-cta-whatsapp {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #25D366;
  color: white !important;
  padding: 10px 20px;
  border-radius: 50px;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.2s;
}

.nav-cta-whatsapp:hover { background: #1EBE5A; }

/* ─── HERO BUSCADOR (estilo Lilly Trials) ─── */
.hero-busca {
  position: relative;
  min-height: 520px;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.hero-busca-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.hero-busca-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: var(--hero-position-x, 50%) var(--hero-position-y, 32%);
}

.hero-busca-bg {
  position: absolute;
  inset: 0;
  background: rgba(13,42,61,0.82);
  z-index: 0;
}

@media (min-width: 1024px) {
  :root { --hero-position-x: 60%; --hero-position-y: 18%; }
}

@media (min-width: 1600px) {
  .hero-busca { min-height: 560px; max-height: 680px; }
  :root { --hero-position-x: 60%; --hero-position-y: 18%; }
}

@media (min-width: 1920px) {
  .hero-busca { min-height: 660px; max-height: none; }
  :root { --hero-position-x: 60%; --hero-position-y: 18%; }
}

@media (min-width: 2560px) {
  .hero-busca { min-height: 760px; }
  :root { --hero-position-x: 60%; --hero-position-y: 18%; }
}

.hero-busca-content {
  position: relative;
  z-index: 1;
  padding: var(--block-pad-y) 64px;
  max-width: 820px;
  transition: padding 0.35s ease;
}

.hero-busca-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sky-mid);
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.hero-busca-eyebrow::before {
  content: '';
  width: 24px;
  height: 2px;
  background: var(--sky);
  border-radius: 2px;
}

.hero-busca-title {
  font-family: 'DM Serif Display', serif;
  font-size: 58px;
  font-weight: 400;
  color: white;
  line-height: 1.08;
  margin-bottom: 48px;
}

.hero-busca-title em {
  font-style: italic;
  color: var(--sky-mid);
}

/* buscador */
.busca-form {
  background: rgba(255,255,255,0.10);
  border: 1.5px solid rgba(255,255,255,0.2);
  border-radius: var(--radius-lg);
  padding: 28px 32px;
  backdrop-filter: blur(12px);
  max-width: 680px;
}

.busca-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin-bottom: 8px;
  display: block;
}

.busca-input {
  width: 100%;
  background: rgba(255,255,255,0.12);
  border: 1.5px solid rgba(255,255,255,0.25);
  border-radius: 50px;
  padding: 14px 22px;
  font-size: 15px;
  font-family: 'Nunito', sans-serif;
  color: white;
  outline: none;
  margin-bottom: 14px;
  transition: border-color 0.2s;
}

.busca-input::placeholder { color: rgba(255,255,255,0.45); }
.busca-input:focus { border-color: var(--sky); }

.busca-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--sky);
  color: white;
  border: none;
  padding: 14px 30px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 700;
  font-family: 'Nunito', sans-serif;
  cursor: pointer;
  margin-top: 6px;
  transition: background 0.2s;
}

.busca-btn:hover { background: var(--sky-dark); }

/* ─── INTRO (estilo Roche — texto + foto) ─── */
.intro-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 480px;
  background: white;
  overflow: hidden;
}

.intro-split-text {
  padding: 80px 72px 80px 64px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.intro-split-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--sky-dark);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.intro-split-eyebrow::before {
  content: '';
  width: 20px;
  height: 2px;
  background: var(--sky);
  border-radius: 2px;
}

.intro-split-title {
  font-family: 'DM Serif Display', serif;
  font-size: 44px;
  font-weight: 400;
  color: var(--navy);
  line-height: 1.12;
  margin-bottom: 22px;
}

.intro-split-title em {
  font-style: italic;
  color: var(--sky);
}

.intro-split-body {
  font-size: 16px;
  color: var(--text-mid);
  line-height: 1.85;
  margin-bottom: 14px;
  max-width: 560px;
}

.intro-split-photo {
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 64px 40px 0;
  transition: padding 0.35s ease;
}

.somos-foto-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  grid-template-rows: repeat(6, 1fr);
  gap: 10px;
  width: 100%;
  max-width: 640px;
  height: 640px;
  max-height: 640px;
}

.somos-foto-cell { min-height: 0; overflow: hidden; border-radius: 14px; }
.somos-foto-cell img { width: 100%; height: 100%; object-fit: cover; display: block; }
.somos-foto-cell.somos-foto-big { grid-column: 1; grid-row: 1 / 5; }
.somos-foto-cell.somos-foto-esq-baixo { grid-column: 1; grid-row: 5 / 7; }
.somos-foto-cell.somos-foto-dir-1 { grid-column: 2; grid-row: 1 / 3; }
.somos-foto-cell.somos-foto-dir-2 { grid-column: 2; grid-row: 3 / 5; }
.somos-foto-cell.somos-foto-dir-3 { grid-column: 2; grid-row: 5 / 7; }

@media (max-width: 860px) {
  .somos-foto-grid { max-width: 100%; height: 340px; max-height: 340px; }
}

/* ─── CUIDADO QUE ACOLHE (hero interno) ─── */
.cuidado-hero-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 56px;
  align-items: center;
  margin-bottom: 24px;
}

.cuidado-hero-mini-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 28px;
  max-width: 560px;
}

.cuidado-hero-mini-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--sky-light);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}

.cuidado-hero-mini-title {
  font-size: 14px;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 4px;
}

.cuidado-hero-mini-desc {
  font-size: 12.5px;
  color: var(--text-mid);
  line-height: 1.5;
}

@media (max-width: 900px) {
  .cuidado-hero-grid { grid-template-columns: 1fr; }
  .cuidado-hero-mini-grid { grid-template-columns: 1fr; }
}

.cuidado-hero-ilustracao {
  position: relative;
  min-height: 380px;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, #eef7fc 0%, #e8f2fa 50%, #f7fbff 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px;
  overflow: hidden;
}

.cuidado-hero-ilustracao::before {
  content: '';
  position: absolute;
  width: 60%;
  height: 60%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(75,168,216,0.16), rgba(75,168,216,0) 70%);
  filter: blur(4px);
}

.cuidado-hero-ilustracao img {
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 20px 34px rgba(31,107,154,0.18));
}

/* ─── ÁREAS DE PESQUISA (filtro estilo Lilly) ─── */
.areas-section {
  padding: var(--block-pad-y) 64px;
  background: #FDF8F5;
  transition: padding 0.35s ease;
}

.areas-titulo {
  font-family: 'DM Serif Display', serif;
  font-size: 40px;
  font-weight: 400;
  color: var(--navy);
  text-align: center;
  margin-bottom: 40px;
}

.areas-filtros {
  display: flex;
  align-items: center;
  gap: 0;
  background: white;
  border-radius: 50px;
  padding: 6px;
  max-width: 900px;
  margin: 0 auto 52px;
  box-shadow: 0 2px 16px rgba(13,58,92,0.08);
  overflow-x: auto;
  scrollbar-width: none;
}

.areas-filtros::-webkit-scrollbar { display: none; }

.filtro-btn {
  padding: 10px 22px;
  border-radius: 50px;
  border: none;
  background: transparent;
  font-size: 14px;
  font-weight: 700;
  font-family: 'Nunito', sans-serif;
  color: var(--text-mid);
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s;
}

.filtro-btn:hover { color: var(--sky-dark); }

.filtro-btn.active {
  background: var(--sky);
  color: white;
}

.area-content {
  display: grid;
  grid-template-columns: 480px 1fr;
  gap: 64px;
  align-items: center;
  max-width: 1100px;
  margin: 0 auto;
}

.area-foto {
  border-radius: var(--radius-lg);
  overflow: hidden;
  height: 420px;
}

.area-texto-title {
  font-family: 'DM Serif Display', serif;
  font-size: 38px;
  font-weight: 400;
  color: var(--navy);
  margin-bottom: 20px;
  line-height: 1.2;
}

.area-texto-body {
  font-size: 16px;
  color: var(--text-mid);
  line-height: 1.85;
  margin-bottom: 28px;
}

/* ─── COMO FUNCIONA ─── */
.page { max-width: 1280px; margin: 0 auto; padding: 0 48px 80px; }

.section-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--sky-dark);
  margin-bottom: 10px;
}

.section-eyebrow::before {
  content: '';
  width: 20px;
  height: 2px;
  background: var(--sky);
  border-radius: 2px;
}

.section-title {
  font-family: 'DM Serif Display', serif;
  font-size: 36px;
  font-weight: 400;
  color: var(--navy);
  line-height: 1.2;
  margin-bottom: 36px;
}

.section-sep { height: 64px; }

.steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--gap);
}

.step-card {
  background: white;
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.step-foto {
  height: 180px;
}

.step-body { padding: 22px 22px 28px; }

.step-num {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--sky-light);
  color: var(--sky-dark);
  font-size: 13px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}

.step-title {
  font-family: 'DM Serif Display', serif;
  font-size: 19px;
  color: var(--navy);
  margin-bottom: 8px;
  line-height: 1.3;
}

.step-desc {
  font-size: 13px;
  color: var(--text-mid);
  line-height: 1.75;
}

/* ─── APOIE O ICAPE (faixa institucional com mosaico de losangos) ─── */
.apoio-banner {
  position: relative;
  background: linear-gradient(120deg, #0A2E4A 0%, #1F6B9A 100%);
  overflow: hidden;
  padding: 64px 0;
}

.apoio-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 48px;
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 420px;
}

.apoio-card {
  flex: 0 0 440px;
  background: white;
  border-radius: 58% 42% 52% 48% / 46% 54% 40% 60%;
  padding: 52px 46px;
  position: relative;
  z-index: 2;
  box-shadow: 0 34px 70px rgba(7,28,46,0.4);
}

.apoio-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--warm);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.apoio-eyebrow::before {
  content: '';
  width: 20px;
  height: 2px;
  background: var(--warm);
  border-radius: 2px;
}

.apoio-title {
  font-family: 'DM Serif Display', serif;
  font-size: 32px;
  color: var(--text-dark);
  line-height: 1.22;
  margin-bottom: 16px;
}

.apoio-body {
  font-size: 14.5px;
  color: var(--text-mid);
  line-height: 1.75;
  margin-bottom: 20px;
  max-width: 360px;
}

.apoio-mosaico {
  flex: 1;
  position: relative;
  height: 420px;
  min-width: 0;
}

.apoio-diamond {
  position: absolute;
  overflow: hidden;
  transform: rotate(45deg);
  border-radius: 14px;
  box-shadow: 0 12px 26px rgba(6,22,38,0.35);
}

.apoio-diamond img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 150%;
  height: 150%;
  object-fit: cover;
  transform: translate(-50%, -50%) rotate(-45deg);
}

.apoio-diamond--overlay::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(31,107,154,0.38);
}

@media (max-width: 960px) {
  .apoio-inner { flex-direction: column; align-items: stretch; gap: 32px; min-height: 0; padding: 0 24px; }
  .apoio-card { flex: none; border-radius: var(--radius-lg); }
  .apoio-mosaico { flex: none; height: 260px; }
  .apoio-diamond { transform: rotate(45deg) scale(0.72); }
}

/* ─── ÁREAS DE PESQUISA (filtro estilo Lilly) ─── */

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.tag {
  background: white;
  border: 1.5px solid #F0A868;
  color: #B87030;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 16px;
  border-radius: 50px;
}

.tag--sky {
  border-color: var(--sky-mid);
  color: var(--sky-dark);
}

/* ─── O QUE FAZEMOS (grid de serviços) ─── */
.fazemos-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap);
}

.fazemos-card {
  background: white;
  border-radius: var(--radius-lg);
  padding: var(--card-pad-y) 28px;
  transition: padding 0.35s ease;
}

.fazemos-photo {
  width: 100%;
  height: 168px;
  border-radius: 12px;
  margin-bottom: 20px;
  overflow: hidden;
  background: repeating-linear-gradient(135deg, var(--sky-light) 0px, var(--sky-light) 10px, #EAF3F7 10px, #EAF3F7 20px);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.fazemos-photo span {
  font-family: 'Courier New', monospace;
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sky-dark);
  background: rgba(255,255,255,0.82);
  padding: 6px 10px;
  border-radius: 6px;
  line-height: 1.4;
}

.fazemos-title {
  font-family: 'DM Serif Display', serif;
  font-size: 18px;
  color: var(--navy);
  margin-bottom: 8px;
  line-height: 1.3;
}

.fazemos-desc {
  font-size: 14px;
  color: var(--text-mid);
  line-height: 1.7;
}

@media (max-width: 860px) {
  .fazemos-grid { grid-template-columns: 1fr; }
}

/* ─── DEPOIMENTOS ─── */
.depo-section {
  background: var(--sky);
  border-radius: var(--radius-lg);
  padding: 60px 52px;
}

.depo-section .section-title { color: white; margin-bottom: 36px; }
.depo-section .section-eyebrow { color: rgba(255,255,255,0.55); }
.depo-section .section-eyebrow::before { background: rgba(255,255,255,0.4); }

.depo-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap);
}

.depo-card {
  background: rgba(255,255,255,0.14);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.depo-foto { height: 200px; }

.depo-body { padding: 22px 22px 26px; }

.depo-stars { display: flex; gap: 3px; margin-bottom: 10px; }
.star { color: rgba(255,255,255,0.85); font-size: 14px; }

.depo-text {
  font-size: 14px;
  color: rgba(255,255,255,0.85);
  line-height: 1.75;
  font-style: italic;
  margin-bottom: 16px;
}

.depo-name { font-size: 14px; font-weight: 700; color: white; }
.depo-cidade { font-size: 12px; color: rgba(255,255,255,0.5); }

/* ─── CTA FINAL (fundo full-bleed via .section-wrap.bg-navy no HTML) ─── */
.cta-final {
  display: grid;
  grid-template-columns: 1fr 380px;
  overflow: hidden;
  min-height: 360px;
}

.cta-texto {
  padding: 64px 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.cta-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  margin-bottom: 16px;
}

.cta-title {
  font-family: 'DM Serif Display', serif;
  font-size: 42px;
  color: white;
  line-height: 1.15;
  margin-bottom: 16px;
}

.cta-sub {
  font-size: 15px;
  color: rgba(255,255,255,0.6);
  line-height: 1.8;
  max-width: 400px;
  margin-bottom: 32px;
}

.cta-foto { overflow: hidden; }

/* ─── CONTATO ─── */
.contato-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
}

.contato-form {
  background: white;
  border-radius: var(--radius-lg);
  padding: 28px 32px;
  display: flex;
  flex-direction: column;
}

.contato-form h3 {
  font-family: 'DM Serif Display', serif;
  font-size: 22px;
  color: var(--navy);
  margin-bottom: 20px;
}

.form-grid-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 20px;
}

.form-group { margin-bottom: 14px; }

.form-group label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--text-mid);
  margin-bottom: 6px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.form-group input,
.form-group textarea,
.form-group select {
  width: 100%;
  background: var(--soft-bg);
  border: 1.5px solid transparent;
  border-radius: var(--radius-md);
  padding: 12px 16px;
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
  color: var(--text-dark);
  outline: none;
  transition: border-color 0.2s;
}

.form-group input:focus,
.form-group textarea:focus { border-color: var(--sky); }
.form-group textarea { resize: vertical; min-height: 68px; }

.contato-info {
  background: var(--navy);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.contato-info-foto { flex: none; height: 220px; }

/* ─── COMO APOIAR O ICAPE ─── */
.apoiar-icape-title {
  font-family: 'DM Serif Display', serif;
  font-weight: 700;
  font-size: 40px;
  color: var(--navy);
  text-align: center;
  margin-bottom: 16px;
}
.apoiar-icape-subtitle {
  font-family: 'Inter', sans-serif;
  font-size: 17px;
  color: #5a6473;
  text-align: center;
  max-width: 560px;
  margin: 0 auto 48px;
  line-height: 1.6;
}
.apoiar-icape-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
}
.apoiar-icape-item img:not(.protected-editorial-image), .apoiar-icape-photo:not(.protected-editorial-image) { width: 100%; height: 280px; display: block; margin-bottom: 20px; object-fit: cover; border-radius: 16px; }

/* =========================================================
   IMAGENS PROTEGIDAS — NÃO ALTERAR AUTOMATICAMENTE
   Ajustes manuais aprovados pela usuária (Voluntariado / Doador financeiro)
   ========================================================= */
#apoiar-voluntariado,
#apoiar-doador {
  width: 100%;
  height: 280px;
  display: block;
  margin-bottom: 20px;
  object-fit: cover;
  border-radius: 16px;
}
/* ENQUADRAMENTO APROVADO E BLOQUEADO PELA USUÁRIA — NÃO ALTERAR EM FUTURAS EDIÇÕES */
#apoiar-voluntariado { object-position: center top !important; }
#apoiar-doador { object-position: center center !important; }
.apoiar-icape-item-title {
  font-family: 'DM Serif Display', serif;
  font-weight: 700;
  font-size: 22px;
  color: var(--navy);
  text-align: center;
  margin-bottom: 10px;
}
.apoiar-icape-item .btn-round { margin-top: 6px; text-decoration: none; }
.apoiar-icape-item-desc {
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-mid);
  text-align: center;
}
@media (max-width: 720px) {
  .apoiar-icape-grid { grid-template-columns: 1fr; }
}

/* ─── VALORIZAMOS A DIVERSIDADE ─── */
.diversidade-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}
.diversidade-title {
  font-family: 'DM Serif Display', serif;
  font-weight: 700;
  font-size: 64px;
  line-height: 1.1;
  color: var(--navy);
  text-transform: uppercase;
  margin-bottom: 26px;
}
.diversidade-title em { font-style: italic; color: var(--sky-mid); }
.diversidade-subtitle {
  font-size: 24px;
  font-weight: 800;
  line-height: 1.4;
  color: var(--navy);
  margin-bottom: 22px;
}
.diversidade-subtitle em { font-family: 'DM Serif Display', serif; font-style: italic; color: var(--sky-mid); font-weight: 400; text-transform: none; }
.diversidade-body {
  font-size: 16px;
  line-height: 1.75;
  color: var(--text-mid);
  max-width: 480px;
}
.diversidade-photo {
  border-radius: 260px 24px 24px 24px;
  overflow: hidden;
  aspect-ratio: 4 / 3;
}
.diversidade-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 720px) {
  .diversidade-grid { grid-template-columns: 1fr; }
  .diversidade-title { font-size: 38px; }
}

/* ─── NEWSLETTER (faixa full-bleed) ─── */
.newsletter-band { background: var(--sky); }
.newsletter-headline {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 1.25;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  white-space: nowrap;
  margin-bottom: 12px;
}
.newsletter-subtitle {
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  margin-bottom: 32px;
}
.newsletter-fields-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 18px;
}
.newsletter-consent {
  font-size: 13px;
  line-height: 1.6;
  color: rgba(255,255,255,0.85);
  margin-bottom: 22px;
  max-width: 480px;
}
.newsletter-band .form-group label { color: rgba(255,255,255,0.75); }
.newsletter-band .form-group input {
  background: rgba(13,58,92,0.35);
  border: 1px solid rgba(255,255,255,0.25);
  color: #ffffff;
}
.btn-outline-white {
  background: transparent;
  border: 1.5px solid rgba(255,255,255,0.6);
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  padding: 12px 28px;
  border-radius: 999px;
  cursor: pointer;
}
.btn-outline-white:hover { background: rgba(255,255,255,0.1); }

.contato-info-dados {
  padding: 28px 32px 36px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.info-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  margin-bottom: 4px;
}

.info-value {
  font-size: 14px;
  color: rgba(255,255,255,0.85);
  font-weight: 600;
  line-height: 1.5;
}

/* ─── PESQUISA CLÍNICA: texto + foto ─── */
.pesquisa-split { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 56px; align-items: center; }
.pesquisa-split-photo { position: relative; border-radius: var(--radius-lg); overflow: hidden; min-height: 380px; }
.pesquisa-split-photo img { width: 100%; height: 100%; object-fit: cover; display: block; position: absolute; inset: 0; }
@media (max-width: 900px) {
  .pesquisa-split { grid-template-columns: 1fr; }
  .pesquisa-split-photo { min-height: 280px; }
}

/* ─── PESQUISA CLÍNICA: jornada em etapas ─── */
.jornada-track { display: flex; justify-content: space-between; gap: 20px; position: relative; margin-top: 48px; }
.jornada-track::before { content: ''; position: absolute; top: 22px; left: 0; right: 0; height: 2px; background: var(--sky-light); z-index: 0; }
.jornada-step { flex: 1; text-align: center; padding: 0 10px; position: relative; z-index: 1; }
.jornada-circle { width: 44px; height: 44px; border-radius: 50%; background: var(--sky); color: white; display: flex; align-items: center; justify-content: center; font-family: 'DM Serif Display', serif; font-size: 18px; margin: 0 auto 16px; }
.jornada-step h4 { font-size: 14.5px; font-weight: 800; color: var(--navy); margin-bottom: 8px; line-height: 1.3; }
.jornada-step p { font-size: 13px; color: var(--text-mid); line-height: 1.65; }
@media (max-width: 900px) {
  .jornada-track { flex-direction: column; gap: 28px; align-items: flex-start; }
  .jornada-track::before { display: none; }
  .jornada-step { text-align: left; padding: 0 0 0 60px; position: relative; }
  .jornada-circle { position: absolute; left: 0; top: 0; margin: 0; }
}

/* ─── PESQUISA CLÍNICA: faixa Anvisa ─── */
.anvisa-band { background: var(--navy); padding: 64px 48px; }
.anvisa-band .section-inner { max-width: 720px; }
.anvisa-eyebrow { font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--sky-mid); margin-bottom: 16px; }
.anvisa-title { font-family: 'DM Serif Display', serif; font-size: 32px; color: white; line-height: 1.25; margin-bottom: 16px; }
.anvisa-body { font-size: 15px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 28px; max-width: 560px; }

/* ─── PESQUISA CLÍNICA: estudos disponíveis ─── */
.estudos-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-bottom: 24px; }
.estudo-card { background: var(--soft-bg); border-radius: var(--radius-lg); padding: 26px 24px; }
.estudo-status { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; padding: 5px 12px; border-radius: 50px; margin-bottom: 14px; }
.estudo-status--recrutando { background: #D7F0EA; color: #1F7A5C; }
.estudo-status--avaliacao { background: #FBE6D6; color: #B5622C; }
.estudo-status--breve { background: #E5EEF3; color: var(--text-light); }
.estudo-card h4 { font-family: 'DM Serif Display', serif; font-size: 20px; color: var(--navy); font-weight: 400; margin-bottom: 6px; }
.estudo-area { font-size: 13px; color: var(--text-mid); margin-bottom: 20px; }
.estudos-aviso { font-size: 12.5px; color: var(--text-light); line-height: 1.6; max-width: 640px; }
@media (max-width: 860px) {
  .estudos-grid { grid-template-columns: 1fr; }
}

/* ─── FOOTER (faixa institucional, full-width) ─── */
footer {
  background: var(--navy);
  width: 100%;
}

.footer-main {
  max-width: 1280px;
  margin: 0 auto;
  padding: 26px 48px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 40px;
  flex-wrap: wrap;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.footer-brand {
  display: flex;
  flex-direction: column;
  max-width: 300px;
}

.footer-brand-desc {
  font-size: 13px;
  color: rgba(255,255,255,0.45);
  margin-top: 10px;
  line-height: 1.6;
}

.footer-links {
  display: flex;
  gap: 44px;
  flex-wrap: wrap;
}

.footer-col h4 {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  margin-bottom: 10px;
}

.footer-col ul { list-style: none; }
.footer-col ul li { margin-bottom: 6px; }
.footer-col ul li a {
  font-size: 13px;
  color: rgba(255,255,255,0.65);
  text-decoration: none;
  font-weight: 600;
  transition: color 0.2s;
  white-space: nowrap;
}
.footer-col ul li a:hover { color: var(--sky-mid); }

.footer-chronos-link {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 700;
  color: rgba(255,255,255,0.85);
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 50px;
  padding: 8px 16px;
  white-space: nowrap;
  transition: border-color 0.2s, color 0.2s;
}
.footer-chronos-link:hover { border-color: var(--sky-mid); color: var(--sky-mid); }

.footer-bottom {
  max-width: 1280px;
  margin: 0 auto;
  padding: 14px 48px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.footer-bottom p { font-size: 12px; color: rgba(255,255,255,0.28); }

.footer-legal-links { display: flex; gap: 18px; flex-wrap: wrap; }

.footer-legal-links a {
  font-size: 12px;
  color: rgba(255,255,255,0.4);
  text-decoration: none;
}
.footer-legal-links a:hover { color: rgba(255,255,255,0.7); }

@media (max-width: 700px) {
  .footer-main { padding: 24px 24px; gap: 28px; }
  .footer-links { gap: 28px 36px; }
  .footer-bottom { padding: 12px 24px; }
}

/* ─── BOTÕES ─── */
.btn-round {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--sky);
  color: white;
  padding: 14px 28px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  border: none;
  font-family: 'Nunito', sans-serif;
  cursor: pointer;
  transition: background 0.2s, transform 0.15s;
  align-self: flex-start;
}

.btn-round:hover { background: var(--sky-dark); transform: scale(1.02); }

.btn-round-outline {
  display: inline-flex;
  align-items: center;
  background: transparent;
  color: var(--navy);
  padding: 14px 28px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  border: 2px solid var(--sky-mid);
  font-family: 'Nunito', sans-serif;
  cursor: pointer;
  transition: all 0.2s;
}

.btn-round-outline:hover { background: var(--sky-light); }

/* ─── FOTO PLACEHOLDER ─── */
.ph {
  background: linear-gradient(135deg, #C8DFF0, #D9EDF8);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  color: #8AABBE;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  width: 100%;
  height: 100%;
}

.ph svg { opacity: 0.28; }

.ph-warm {
  background: linear-gradient(135deg, #F5E0C8, #FAE9D4);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  color: #C4895A;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  width: 100%;
  height: 100%;
}

.ph-warm svg { opacity: 0.28; }

.ph-dark {
  background: rgba(13,58,92,0.18);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  color: rgba(255,255,255,0.35);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  width: 100%;
  height: 100%;
}

.ph-dark svg { opacity: 0.2; filter: brightness(10); }

.pi { opacity: 0.3; }


/* ─── PILARES 3 CARDS (estilo Roche) ─── */
.pilares-btns {
  display: flex;
  gap: 14px;
  margin-bottom: 48px;
  flex-wrap: wrap;
}

.pilares-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap);
}

.pilar-card {
  background: white;
  border-radius: var(--radius-lg);
  transition: padding 0.35s ease;
  overflow: hidden;
  transition: transform 0.18s;
  cursor: pointer;
}

.pilar-card:hover { transform: translateY(-3px); }

.pilar-foto { overflow: hidden; }

.pilar-body {
  padding: 22px 24px 28px;
  border-top: 2px solid transparent;
  transition: border-color 0.2s;
}

.pilar-card:hover .pilar-body { border-top-color: var(--sky-light); }
.pilar-card--destaque:hover .pilar-body { border-top-color: var(--sky); }

.pilar-titulo-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.pilar-titulo {
  font-family: 'DM Serif Display', serif;
  font-size: 20px;
  color: var(--navy);
  font-weight: 400;
}

.pilar-titulo--blue { color: var(--sky-dark); }

.pilar-arrow {
  font-size: 18px;
  color: var(--text-light);
  transition: transform 0.2s, color 0.2s;
}

.pilar-card:hover .pilar-arrow { transform: translateX(4px); color: var(--sky); }

.pilar-arrow--blue { color: var(--sky); }

.pilar-desc {
  font-size: 14px;
  color: var(--text-mid);
  line-height: 1.75;
}


/* ─── BANNER UNIDOS (substitui hero "Acreditamos em uma saúde...") ─── */
.unidos-banner {
  width: 100%;
}
.unidos-banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(13,42,61,0.88) 0%, rgba(13,42,61,0.4) 50%, rgba(13,42,61,0.05) 100%);
  pointer-events: none;
}
.unidos-banner-text {
  position: absolute;
  left: 48px;
  right: 48px;
  bottom: 44px;
  z-index: 1;
  font-family: 'DM Serif Display', serif;
  font-size: 40px;
  line-height: 1.2;
  color: white;
  max-width: 760px;
}
.unidos-banner-text em { font-style: italic; color: var(--sky-mid); }
@media (max-width: 720px) {
  .unidos-banner-text { font-size: 26px; left: 24px; right: 24px; bottom: 24px; }
}
.quote-banner { position: relative; }
.pesquisa-cta-banner {
  --photo-position-x: 50%;
  --photo-position-y: 25%;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 56%) minmax(320px, 44%);
  min-height: 320px;
  border-radius: 20px;
  background: var(--navy);
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  align-items: stretch;
  overflow: hidden;
  box-sizing: border-box;
}
.pesquisa-cta-banner::after {
  display: none;
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(5,54,83,1) 0%, rgba(5,54,83,0.96) 42%, rgba(5,54,83,0.35) 65%, rgba(5,54,83,0) 82%);
}
.pesquisa-cta-visual {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 56% 44%;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.pesquisa-cta-branding { position: relative; min-width: 0; overflow: hidden; background: var(--navy); }
.pesquisa-cta-photo { position: relative; min-width: 0; overflow: hidden; }
.pesquisa-cta-photo img {
  width: 100%; height: 100%; display: block; object-fit: cover;
  object-position: var(--photo-position-x) var(--photo-position-y);
}
.pesquisa-cta-logo {
  position: absolute; z-index: 2; top: 26px; left: 30px;
  width: clamp(65px, 6vw, 100px); height: auto; object-fit: contain;
}
.pesquisa-cta-watermark-layer {
  position: absolute; left: 39%; top: 0; width: 47%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  pointer-events: none; z-index: 0; overflow: hidden;
}
.pesquisa-cta-watermark {
  width: 300px; max-width: none !important; height: auto;
  opacity: 0.025; object-fit: contain; transform: scale(2.5); transform-origin: center; position: static;
}
.pesquisa-cta-text {
  position: relative; z-index: 3; grid-column: 1;
  display: flex; flex-direction: column; justify-content: center;
  min-width: 0; max-width: 100%; box-sizing: border-box;
  padding: 68px 36px 32px;
}
.pesquisa-cta-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255,255,255,0.65); margin-bottom: 14px; }
.pesquisa-cta-title { max-width: 590px; font-family: 'DM Serif Display', serif; font-size: clamp(29px, 2.6vw, 42px); line-height: 1.15; color: white; margin-bottom: 18px; }
.pesquisa-cta-title em { font-style: italic; color: var(--sky-mid); }
.pesquisa-cta-desc { max-width: 590px; font-size: 16px; line-height: 1.7; color: rgba(255,255,255,0.82); margin-bottom: 28px; }
.pesquisa-cta-button { align-self: flex-start; max-width: 100%; min-height: 48px; box-sizing: border-box; }
.pesquisa-cta-logo-mobile, .pesquisa-cta-watermark-mobile-layer { display: none; }
@media (max-width: 1024px) {
  .pesquisa-cta-banner { display: flex; flex-direction: column; min-height: 0; height: auto; --photo-position-y: 20%; }
  .pesquisa-cta-visual { position: relative; inset: auto; display: grid; grid-template-columns: 55% 45%; width: 100%; aspect-ratio: 16 / 7; order: 1; }
  .pesquisa-cta-text { order: 2; grid-column: auto; width: 100%; max-width: none; padding: 28px 30px 32px; background: var(--navy); }
  .pesquisa-cta-logo { top: 20px; left: 22px; width: 78px; }
  .pesquisa-cta-watermark-layer { left: 39%; width: 47%; }
  .pesquisa-cta-watermark { width: 260px; opacity: 0.025; transform: scale(2.5); }
  .pesquisa-cta-title { max-width: 680px; font-size: clamp(28px, 4.5vw, 38px); }
}
.quote-banner-box {
  position: absolute;
  top: 50%;
  left: 42%;
  transform: translateY(-50%);
  background: var(--navy);
  color: white;
  font-family: 'DM Serif Display', serif;
  font-style: italic;
  font-size: 26px;
  line-height: 1.55;
  padding: 40px 48px;
  border-radius: 20px;
  max-width: 600px;
  text-align: center;
}
@media (max-width: 1023px) {
  .quote-banner-box { position: static; transform: none; margin: -60px 20px 20px; font-size: 20px; padding: 28px 28px; max-width: none; }
}
.unidos-banner-img {
  display: block;
  width: 100%;
  height: auto;
}

/* ─── ALTERNÂNCIA DE FUNDOS ─── */
.bg-white   { background: #ffffff; }
.bg-soft    { background: #EEF6FC; }
.bg-warm    { background: #FEF6EF; }
.bg-navy    { background: var(--navy); }
.bg-sky     { background: var(--sky); }

.section-wrap {
  width: 100%;
  padding: var(--section-pad-y) 0;
  transition: padding 0.35s ease;
}

.section-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 48px;
}

/* ─── MINI BLOG ─── */
.blog-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 36px;
}

.blog-ver-mais {
  font-size: 14px;
  font-weight: 700;
  color: var(--sky-dark);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: gap 0.2s;
}

.blog-ver-mais:hover { gap: 10px; }

.blog-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr;
  gap: var(--gap);
}

.blog-card {
  background: white;
  border-radius: var(--radius-lg);
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.18s, box-shadow 0.18s;
}

.blog-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(13,58,92,0.10);
}

.blog-foto { overflow: hidden; }

.blog-body { padding: 22px 24px 28px; }

.blog-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: var(--sky-light);
  color: var(--sky-dark);
  padding: 4px 12px;
  border-radius: 50px;
  margin-bottom: 12px;
}

.blog-tag--warn {
  background: #FEF3E8;
  color: #B87030;
}

.blog-tag--green {
  background: #E6F7EE;
  color: #1A7A45;
}

.blog-titulo {
  font-family: 'DM Serif Display', serif;
  font-size: 20px;
  color: var(--navy);
  line-height: 1.3;
  margin-bottom: 10px;
}

.blog-card--destaque .blog-titulo { font-size: 26px; }

.blog-resumo {
  font-size: 13px;
  color: var(--text-mid);
  line-height: 1.75;
  margin-bottom: 16px;
}

.blog-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--text-light);
  font-weight: 600;
}

.blog-meta::before {
  content: '';
  width: 20px;
  height: 1px;
  background: var(--mid-gray, #D0D6E2);
}

/* ─── SEPARADOR ─── */
.sep { height: 56px; }

/* ─── ESTADO ATIVO DO MENU (aditivo) ─── */
.nav-links a.active { color: var(--sky); }
.nav-links a { white-space: nowrap; }
html { scroll-behavior: smooth; }

/* nav com 6 itens: evita quebra em telas médias (aditivo, não altera o desktop amplo) */
@media (max-width: 1080px) {
  nav { padding: 0 28px; }
  .nav-links { gap: 20px; }
  .nav-logo-sub { display: none; }
}
@media (max-width: 960px) {
  .nav-links { gap: 16px; }
  .nav-links a { font-size: 13px; }
}

/* ─── NAV MOBILE ─── */
.nav-toggle { display: none; background: none; border: none; cursor: pointer; padding: 8px; margin-left: 8px; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--navy); border-radius: 2px; margin: 5px 0; transition: transform 0.25s, opacity 0.25s; }
.nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity: 0; }
.nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 780px) {
  nav { padding: 0 20px; }
  .nav-toggle { display: block; }
  .nav-links,
  .nav-cta-group {
    position: fixed;
    top: 84px;
    left: 0;
    right: 0;
    background: white;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 12px 20px 20px;
    box-shadow: 0 12px 24px rgba(11,58,92,0.12);
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.3s ease, opacity 0.2s ease, padding 0.3s ease;
    z-index: 99;
  }
  .nav-links.open,
  .nav-cta-group.open {
    max-height: 480px;
    opacity: 1;
    padding: 16px 20px 24px;
  }
  .nav-links li { width: 100%; }
  .nav-links a { display: block; padding: 12px 4px; font-size: 15px; }
  .nav-cta-group { top: auto; margin-top: -1px; border-top: 1px solid var(--sky-light); flex-direction: column; align-items: stretch; gap: 14px; }
  .lang-switch { margin-right: 0; }
  .nav-cta-whatsapp, .nav-cta { justify-content: center; }
}

/* ─── EXTENSÕES ADITIVAS PARA PÁGINAS INTERNAS ─── */
/* mantêm o mesmo acento itálico sky dos títulos serif da home */
.section-title em { font-style: italic; color: var(--sky); }
.areas-titulo em { font-style: italic; color: var(--sky); }

/* hero interno reutiliza a linguagem do intro-split */
.page-hero { display: grid; grid-template-columns: 1.15fr 0.85fr; align-items: stretch; }
.page-hero--full { display: block; position: relative; min-height: 460px; overflow: hidden; padding: 76px 64px; display: flex; flex-direction: column; justify-content: center; }
.page-hero-full-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.page-hero-full-overlay { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(11,58,92,0.88), rgba(11,58,92,0.45)); z-index: 0; }
.page-hero-text { padding: 76px 64px 76px 64px; display: flex; flex-direction: column; justify-content: center; }
.page-hero-photo { overflow: hidden; position: relative; min-height: 380px; }
.page-hero-photo-overlay { position: absolute; inset: 0; background: linear-gradient(160deg, rgba(11,58,92,0.35), rgba(11,94,148,0.12)); }

.hero-galeria-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr 0.85fr;
  grid-template-rows: repeat(3, 1fr);
  gap: 10px;
  width: 100%;
  height: 100%;
  padding: 24px;
}
.hg-cell { position: relative; overflow: hidden; border-radius: 14px; }
.hg-cell img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hg-cell.hg-big { grid-column: 1; grid-row: 1 / 3; }
.hg-cell:nth-child(2) { grid-column: 2; grid-row: 1; }
.hg-cell:nth-child(3) { grid-column: 2; grid-row: 2; }
.hg-cell:nth-child(4) { grid-column: 1; grid-row: 3; }
.hg-cell:nth-child(5) { grid-column: 2; grid-row: 3; }
.hg-cell.hg-extra { grid-column: 3; grid-row: 1; }
.page-hero-title { font-family: 'DM Serif Display', serif; font-size: 46px; line-height: 1.1; color: var(--text-dark); margin-bottom: 20px; }
.page-hero-title em { font-style: italic; color: var(--sky); }
.page-hero-lead { font-size: 17px; color: var(--text-mid); line-height: 1.8; max-width: 560px; }

/* texto corrido */
.prose p { font-size: 16px; color: var(--text-mid); line-height: 1.85; margin-bottom: 18px; max-width: 760px; }
.prose p strong { color: var(--text-dark); font-weight: 700; }
.lead { font-size: 18px; color: var(--text-mid); line-height: 1.8; max-width: 680px; margin-bottom: 8px; }

/* lista de princípios / bullets no tom da marca */
.check-list { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 16px 32px; margin-top: 8px; }
.check-list li { position: relative; padding-left: 30px; font-size: 15px; color: var(--text-mid); line-height: 1.6; font-weight: 600; }
.check-list li strong { color: var(--text-dark); }
.check-list li::before { content: ''; position: absolute; left: 0; top: 4px; width: 16px; height: 16px; border-radius: 50%; background: var(--sky-light); border: 2px solid var(--sky); }

/* card de destaque com número grande (jornada / etapas de texto) */
.flow-list { display: grid; gap: var(--gap); }
.flow-item { background: white; border-radius: var(--radius-lg); padding: 26px 30px; display: grid; grid-template-columns: 56px 1fr; gap: 22px; align-items: start; }
.flow-num { width: 44px; height: 44px; border-radius: 50%; background: var(--sky); color: white; display: flex; align-items: center; justify-content: center; font-family: 'DM Serif Display', serif; font-size: 20px; }
.flow-item h4 { font-family: 'DM Serif Display', serif; font-size: 21px; color: var(--navy); font-weight: 400; margin-bottom: 6px; }
.flow-item p { font-size: 14px; color: var(--text-mid); line-height: 1.7; }

/* faixa de citação (referência acadêmica) no tom acolhedor */
.quote-band { background: var(--sky); border-radius: var(--radius-lg); padding: 56px 60px; overflow: hidden; }
.quote-band blockquote { font-family: 'DM Serif Display', serif; font-size: 28px; line-height: 1.4; color: white; font-style: italic; max-width: 860px; }
.quote-band cite { display: block; margin-top: 20px; font-family: 'Nunito', sans-serif; font-style: normal; font-size: 13px; font-weight: 700; letter-spacing: 0.04em; color: rgba(255,255,255,0.7); }

/* mini-indicadores (o que medimos) — reusa tokens, sem números inventados */
.metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap); }
.metric-card { background: white; border-radius: var(--radius-lg); padding: 26px 26px 30px; border-top: 3px solid var(--sky-light); }
.metric-card .metric-dim { font-size: 10px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sky-dark); margin-bottom: 10px; }
.metric-card h4 { font-family: 'DM Serif Display', serif; font-size: 19px; color: var(--navy); font-weight: 400; margin-bottom: 8px; line-height: 1.25; }
.metric-card p { font-size: 13px; color: var(--text-mid); line-height: 1.7; }
.metric-card .metric-freq { display: inline-block; margin-top: 14px; font-size: 11px; font-weight: 700; color: var(--text-light); background: var(--soft-bg); padding: 4px 12px; border-radius: 50px; }

@media (max-width: 860px) {
  .page-hero { grid-template-columns: 1fr; }
  .page-hero-photo { min-height: 240px; }
  .check-list, .metric-grid { grid-template-columns: 1fr; }
}

/* ─── GALERIA DE EVENTOS ─── */
.filtro-anos { justify-content: flex-start; max-width: none; margin: 0 0 44px; width: fit-content; }
.galeria-ano { margin-bottom: 64px; }
.galeria-ano:last-child { margin-bottom: 0; }
.galeria-ano-head { display: flex; align-items: baseline; gap: 16px; padding-bottom: 16px; margin-bottom: 32px; border-bottom: 1px solid #D6EEFA; }
.galeria-ano-num { font-family: 'DM Serif Display', serif; font-size: 44px; color: var(--navy); line-height: 1; }
.galeria-ano-count { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-light); }
.galeria-evento { margin-bottom: 40px; }
.galeria-evento:last-child { margin-bottom: 0; }
.galeria-evento-titulo { font-family: 'DM Serif Display', serif; font-size: 24px; color: var(--text-dark); margin-bottom: 4px; }
.galeria-evento-meta { font-size: 13px; font-weight: 700; letter-spacing: 0.04em; color: var(--sky-dark); text-transform: uppercase; margin-bottom: 20px; }
.galeria-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 190px; gap: 14px; }
.galeria-foto { border-radius: var(--radius-md); overflow: hidden; background: var(--navy); cursor: pointer; position: relative; }
.galeria-foto.tall { grid-row: span 2; }
.galeria-foto.wide { grid-column: span 2; }
.galeria-foto .ph { width: 100%; height: 100%; min-height: 0; border-radius: 0; }
.galeria-foto:hover .galeria-foto-zoom { opacity: 1; }
.galeria-foto-zoom { position: absolute; inset: 0; background: rgba(13,58,92,0.32); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.25s; }
.galeria-foto-zoom svg { width: 34px; height: 34px; stroke: white; }

.galeria-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }

.galeria-cap-pill {
  position: absolute;
  top: 14px;
  left: 14px;
  right: 14px;
  background: white;
  color: #16324a;
  font-weight: 800;
  font-size: 13px;
  line-height: 1.3;
  padding: 8px 16px;
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(13,58,92,0.18);
  width: fit-content;
  max-width: calc(100% - 28px);
}

/* lightbox */
.lightbox { position: fixed; inset: 0; z-index: 1000; background: rgba(13,32,52,0.92); display: none; align-items: center; justify-content: center; padding: 40px; }
.lightbox.open { display: flex; }
.lightbox-inner { max-width: 900px; width: 100%; }
.lightbox-figura { background: var(--navy); border-radius: var(--radius-lg); aspect-ratio: 16/10; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.lightbox-figura .ph { border-radius: 0; }
.lightbox-cap { color: rgba(255,255,255,0.8); font-size: 14px; font-weight: 600; text-align: center; margin-top: 18px; }
.lightbox-close { position: absolute; top: 26px; right: 32px; width: 46px; height: 46px; border-radius: 50%; border: none; background: rgba(255,255,255,0.14); color: white; font-size: 26px; cursor: pointer; transition: background 0.2s; }
.lightbox-close:hover { background: rgba(255,255,255,0.28); }
.lightbox-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 52px; height: 52px; border-radius: 50%; border: none; background: rgba(255,255,255,0.14); color: white; font-size: 22px; cursor: pointer; transition: background 0.2s; }
.lightbox-nav:hover { background: rgba(255,255,255,0.28); }
.lightbox-prev { left: 26px; }
.lightbox-next { right: 26px; }

/* ─── PUBLICAÇÕES / RELATÓRIOS ─── */
.pub-list { display: grid; gap: var(--gap); }
.pub-card { background: white; border-radius: var(--radius-lg); padding: 30px 34px; display: grid; grid-template-columns: 60px 1fr auto; gap: 24px; align-items: center; transition: box-shadow 0.2s, transform 0.2s; }
.pub-card:hover { box-shadow: 0 10px 30px rgba(13,58,92,0.10); transform: translateY(-2px); }
.pub-icon { width: 56px; height: 56px; border-radius: var(--radius-md); background: var(--sky-light); display: flex; align-items: center; justify-content: center; }
.pub-icon svg { width: 26px; height: 26px; stroke: var(--sky-dark); }
.pub-body { min-width: 0; }
.pub-tag { display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sky-dark); background: var(--soft-bg); padding: 4px 12px; border-radius: 50px; margin-bottom: 10px; }
.pub-title { font-family: 'DM Serif Display', serif; font-size: 21px; color: var(--text-dark); margin-bottom: 6px; line-height: 1.25; }
.pub-desc { font-size: 14px; color: var(--text-mid); line-height: 1.65; max-width: 620px; }
.pub-meta { font-size: 12px; font-weight: 700; color: var(--text-light); margin-top: 10px; letter-spacing: 0.02em; }
.pub-action { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; padding: 12px 24px; border-radius: 50px; background: var(--navy); color: white; font-size: 14px; font-weight: 700; text-decoration: none; transition: background 0.2s; }
.pub-action:hover { background: var(--sky-dark); }

.pub-group-title { font-family: 'DM Serif Display', serif; font-size: 26px; color: var(--navy); margin: 0 0 22px; display: flex; align-items: baseline; gap: 14px; }
.pub-group-title span { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-light); font-family: 'Nunito', sans-serif; }
.pub-group { margin-bottom: 48px; }
.pub-group:last-child { margin-bottom: 0; }

@media (max-width: 860px) {
  .galeria-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 150px; }
  .galeria-foto.wide { grid-column: span 2; }
  .pub-card { grid-template-columns: 1fr; text-align: left; }
  .pub-action { justify-self: start; }
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE OVERHAUL — MOBILE-FIRST
   Breakpoints: mobile ≤767px · tablet 768–1023px · desktop 1024px+
═══════════════════════════════════════════════════════════════ */
html, body { max-width: 100%; overflow-x: hidden; }
img, svg, img, video { max-width: 100%; }

/* ---- TABLET (768–1023) ---- */
@media (max-width: 1023px) and (min-width: 768px) {
  .cta-final { grid-template-columns: 1fr 300px; }
  .apoio-card { flex: 0 0 340px; padding: 40px 36px; }
  .steps-grid, .depo-grid, .pilares-grid, .newsletter-fields-row, .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .area-content { grid-template-columns: 1fr; }
  .area-foto { height: 340px; }
  /* IMAGENS PROTEGIDAS \u2014 tablet: preservar enquadramento atual */
  #apoiar-voluntariado, #apoiar-doador { height: 280px; }
}

/* ---- MOBILE (≤767) ---- */
@media (max-width: 767px) {
  :root { --section-pad-y: 48px; --block-pad-y: 48px; --card-pad-y: 24px; --gap: 16px; }

  /* containers: consistent 20–24px side padding everywhere */
  .section-inner, .page, .apoio-inner, .footer-main, .footer-bottom,
  .anvisa-band .section-inner, .hero-busca-content, .intro-split-text,
  .areas-section, .page-hero-text, .page-hero--full, .cta-texto,
  .anvisa-band, .quote-band, .depo-section, .apoio-card, .apoio-banner,
  nav, .top-bar {
    padding-left: 20px;
    padding-right: 20px;
    max-width: 100%;
    box-sizing: border-box;
  }
  .hero-busca-content { padding-top: 44px; padding-bottom: 44px; max-width: 100%; }
  .intro-split-text { padding-top: 44px; padding-bottom: 0; }
  .intro-split-photo { padding: 32px 20px 44px; }
  .areas-section { padding-top: 44px; padding-bottom: 44px; }
  .page-hero-text { padding-top: 44px; padding-bottom: 44px; }
  .page-hero--full { padding-top: 52px; padding-bottom: 52px; }
  .cta-texto { padding-top: 44px; padding-bottom: 36px; }
  .cta-foto { min-height: 220px; }
  .anvisa-band { padding-top: 44px; padding-bottom: 44px; }
  .quote-band { padding-top: 36px; padding-bottom: 36px; }
  .depo-section { padding-top: 44px; padding-bottom: 44px; }
  .apoio-card { padding-top: 36px; padding-bottom: 36px; }
  .apoio-banner { padding-top: 44px; padding-bottom: 44px; }
  .top-bar { padding-top: 10px; padding-bottom: 10px; flex-wrap: wrap; }

  /* every multi-column layout collapses to one column */
  .intro-split, .cta-final, .contato-grid, .depo-grid, .pilares-grid,
  .steps-grid, .newsletter-fields-row, .area-content, .form-grid-2col,
  .check-list, .metric-grid, .apoiar-icape-grid, .diversidade-grid,
  .cuidado-hero-grid, .cuidado-hero-mini-grid, .fazemos-grid, .blog-grid,
  .estudos-grid, .jornada-track, .somos-foto-grid, .page-hero,
  .pesquisa-split, .apoio-inner {
    grid-template-columns: 1fr !important;
    flex-direction: column !important;
  }
  .apoio-inner { align-items: stretch; }
  .apoio-card { flex: none; }
  .somos-foto-grid { display: flex; flex-direction: column; height: auto; max-height: none; gap: 10px; }
  .somos-foto-cell { grid-column: auto !important; grid-row: auto !important; height: 200px; }
  .area-foto { height: 260px; }
  .galeria-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 140px; }
  .galeria-foto.wide, .galeria-foto.tall { grid-column: span 1; grid-row: span 1; }

  /* typography */
  .hero-busca {
    display: flex;
    flex-direction: column;
    min-height: auto;
    background: #0d2a3d;
  }
  .hero-busca-media { position: relative; inset: auto; width: 100%; aspect-ratio: 4/5; overflow: hidden; }
  .hero-busca-media img { object-fit: cover; object-position: 50% 22%; }
  .hero-busca-bg { display: none; }
  .hero-busca-content { position: relative; padding: 40px 24px 48px; max-width: 100%; }
  .hero-busca-title { font-size: 42px; line-height: 1.12; margin-bottom: 28px; }
  .hero-busca-title br, .pesquisa-cta-title br { display: none; }
  .intro-split-title, .page-hero-title, .cta-title, .apoiar-icape-title, .anvisa-title { font-size: 38px; line-height: 1.15; }
  .diversidade-title { font-size: 40px; }
  .areas-titulo, .section-title, .diversidade-subtitle, .area-texto-title { font-size: 30px; line-height: 1.22; }
  .apoiar-icape-subtitle, .intro-split-body, .area-texto-body, .cta-sub, .diversidade-body,
  .apoiar-icape-item-desc, .fazemos-desc, .page-hero-lead, .prose p, .lead, .anvisa-body,
  p { font-size: 16px; line-height: 1.7; }
  .apoiar-icape-title, .apoiar-icape-subtitle, .diversidade-title, .diversidade-subtitle, .diversidade-body { text-align: left; }
  .apoiar-icape-subtitle { margin-left: 0; margin-right: 0; max-width: 100%; }
  .unidos-banner-text { font-size: 24px; line-height: 1.25; left: 20px; right: 20px; bottom: 24px; }
  .pesquisa-cta-banner { width: 100%; border-radius: 16px; display: flex; flex-direction: column; height: auto; }
  .pesquisa-cta-visual { position: relative; inset: auto; display: block; width: 100%; aspect-ratio: auto; order: 2; }
  .pesquisa-cta-branding { display: none; }
  .pesquisa-cta-photo { position: relative; width: 100%; height: 320px; border-radius: 0 0 16px 16px; }
  .pesquisa-cta-text { order: 1; padding: 40px 20px 32px; border-radius: 16px 16px 0 0; position: relative; overflow: hidden; }
  .pesquisa-cta-logo-mobile { display: block; width: 68px; height: auto; margin-bottom: 20px; position: relative; z-index: 2; }
  .pesquisa-cta-watermark-mobile-layer { display: flex; position: absolute; inset: 0; align-items: center; justify-content: center; overflow: hidden; pointer-events: none; z-index: 0; }
  .pesquisa-cta-watermark-mobile { width: 280px; max-width: none; height: auto; opacity: 0.03; transform: translate(8%, 6%) scale(1.3); }
  .pesquisa-cta-eyebrow, .pesquisa-cta-title, .pesquisa-cta-desc, .pesquisa-cta-button { position: relative; z-index: 2; }
  .pesquisa-cta-eyebrow { font-size: 11px; line-height: 1.4; }
  .pesquisa-cta-title { max-width: 100%; font-size: clamp(27px, 8vw, 34px); line-height: 1.1; }
  .pesquisa-cta-desc { max-width: 100%; margin: 17px 0 22px; font-size: 15px; line-height: 1.65; }
  .pesquisa-cta-banner .btn-round { width: 100%; min-height: 52px; padding: 14px 18px; justify-content: center; white-space: normal; text-align: center; }
  .newsletter-headline { white-space: normal; font-size: 26px; }

  /* buttons: full readable width, comfortable height, centered label */
  .btn-round, .btn-round-outline, .busca-btn, .nav-cta-whatsapp, .footer-chronos-link {
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: 16px 24px;
    font-size: 15px;
  }
  .apoiar-icape-item .btn-round { align-self: stretch; }

  /* cards: full width, well-proportioned photos */
  .fazemos-photo { height: 200px; }
  .apoiar-icape-item img:not(.protected-editorial-image), .apoiar-icape-photo:not(.protected-editorial-image) { height: 220px; }
  /* IMAGENS PROTEGIDAS \u2014 mobile: preservar enquadramento atual */
  #apoiar-voluntariado, #apoiar-doador { height: 220px; }
  .step-foto { height: 200px; }
  .depo-foto { height: 200px; }
  .fazemos-card { padding: 24px 22px; }
  .pilar-body, .blog-body { padding: 20px 20px 24px; }

  /* footer */
  .footer-main { flex-direction: column; gap: 32px; padding-top: 40px; padding-bottom: 40px; }
  .footer-links { gap: 28px 32px; flex-wrap: wrap; }
  .footer-brand { max-width: 100%; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 10px; padding-top: 16px; padding-bottom: 16px; }
  .footer-chronos-link { align-self: stretch; }

  /* misc */
  .jornada-track { gap: 24px; }
  .contato-info-dados { grid-template-columns: 1fr 1fr; }
  .quote-banner-box { padding: 24px 22px; font-size: 18px; }
}


/* =========================================================
   PRODUÇÃO 31/07/2026 — estabilidade, desempenho e mobile
   ========================================================= */
html { -webkit-text-size-adjust: 100%; }
body { min-width: 0; }
img { height: auto; }
button, a, input, textarea, select { touch-action: manipulation; }

/* Evita que seções abaixo da dobra consumam renderização antes da hora. */
@supports (content-visibility: auto) {
  .section-wrap, .newsletter-band, footer { content-visibility: auto; contain-intrinsic-size: 1px 720px; }
}

/* Remove efeitos caros em aparelhos com preferência por menos movimento. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

/* Tablet e mobile: menu compacto e sem duas camadas sobrepostas. */
@media (max-width: 1023px) {
  nav {
    height: 72px;
    padding: 0 18px;
    gap: 10px;
    position: sticky;
    top: 0;
  }
  nav .nav-logo img { height: 52px !important; width: auto !important; }
  .nav-toggle { display: block; margin-left: 0; flex: 0 0 auto; }
  .nav-cta-group {
    position: static !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 6px !important;
    margin-left: auto;
    padding: 0 !important;
    max-height: none !important;
    opacity: 1 !important;
    overflow: visible !important;
    box-shadow: none !important;
    border: 0 !important;
    background: transparent !important;
  }
  .nav-cta-whatsapp { display: none !important; }
  .lang-switch { margin: 0; gap: 2px; }
  .lang-btn { padding: 4px 5px; font-size: 12px; }
  .nav-links {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 12px !important;
    right: 12px !important;
    bottom: auto !important;
    display: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 2px !important;
    width: auto !important;
    max-height: calc(100svh - 96px) !important;
    padding: 12px !important;
    overflow-y: auto !important;
    opacity: 1 !important;
    background: #fff !important;
    border: 1px solid #D6EEFA;
    border-radius: 16px;
    box-shadow: 0 18px 42px rgba(13,58,92,.18) !important;
    z-index: 120;
  }
  .nav-links.open { display: flex !important; }
  .nav-links li { width: 100%; }
  .nav-links a { display: flex; width: 100%; min-height: 44px; align-items: center; padding: 10px 12px; border-radius: 10px; font-size: 15px; white-space: normal; }
}

@media (max-width: 767px) {
  :root { --section-pad-y: 42px; --block-pad-y: 42px; --card-pad-y: 22px; }

  .top-bar { padding: 8px 12px; align-items: flex-start; flex-wrap: nowrap; }
  .top-bar p { font-size: 11.5px; line-height: 1.35; }
  .top-bar-close { flex: 0 0 auto; padding: 2px 0 0 8px; font-size: 16px; }
  nav { height: 68px; padding: 0 14px; }
  nav .nav-logo img { height: 48px !important; }

  /* Hero curto, legível e sem imagem gigante antes do conteúdo. */
  .hero-busca { min-height: 0; display: flex; flex-direction: column; background: #0D2A3D; }
  .hero-busca-media { position: relative; width: 100%; aspect-ratio: 16 / 10; min-height: 0; }
  .hero-busca-media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
  .hero-busca-bg { display: none; }
  .hero-busca-content { width: 100%; padding: 32px 20px 40px; }
  .hero-busca-eyebrow { font-size: 10px; line-height: 1.4; margin-bottom: 14px; }
  .hero-busca-title { font-size: clamp(34px, 10vw, 40px); line-height: 1.08; margin-bottom: 18px; }
  .hero-busca-content > p:first-of-type { font-size: 17px !important; margin: 10px 0 8px !important; line-height: 1.45 !important; }
  .hero-busca-content > p:nth-of-type(2) { font-size: 14.5px !important; margin: 0 0 24px !important; line-height: 1.6 !important; }
  .hero-busca-content .btn-round { min-height: 50px; }

  /* Mantém o mosaico aprovado, sem criar cinco fotos gigantes em sequência. */
  .intro-split-text { padding: 42px 20px 22px; }
  .intro-split-photo { padding: 0 16px 42px; }
  .somos-foto-grid {
    display: grid !important;
    grid-template-columns: 1.12fr .88fr !important;
    grid-template-rows: repeat(6, 1fr) !important;
    gap: 7px !important;
    width: 100% !important;
    height: 420px !important;
    max-height: 420px !important;
  }
  .somos-foto-cell { height: auto !important; min-height: 0; border-radius: 10px; }
  .somos-foto-cell.somos-foto-big { grid-column: 1 !important; grid-row: 1 / 5 !important; }
  .somos-foto-cell.somos-foto-esq-baixo { grid-column: 1 !important; grid-row: 5 / 7 !important; }
  .somos-foto-cell.somos-foto-dir-1 { grid-column: 2 !important; grid-row: 1 / 3 !important; }
  .somos-foto-cell.somos-foto-dir-2 { grid-column: 2 !important; grid-row: 3 / 5 !important; }
  .somos-foto-cell.somos-foto-dir-3 { grid-column: 2 !important; grid-row: 5 / 7 !important; }

  .section-inner { padding-left: 20px; padding-right: 20px; }
  .section-title, .areas-titulo, .area-texto-title { font-size: clamp(28px, 8vw, 32px); }
  .intro-split-title, .page-hero-title, .cta-title, .apoiar-icape-title, .anvisa-title { font-size: clamp(32px, 9vw, 38px); }
  .diversidade-title { font-size: 34px; }
  .diversidade-subtitle { font-size: 22px; }

  .fazemos-grid { gap: 16px; }
  .fazemos-card { padding: 20px; }
  .fazemos-photo { height: 190px; margin-bottom: 18px; }
  .fazemos-title { font-size: 21px; }

  .quote-banner > img { display: block; width: 100%; aspect-ratio: 16 / 10 !important; object-fit: cover; }
  .quote-banner-box { position: relative; margin: -30px 14px 14px; padding: 22px 18px; font-size: 18px; line-height: 1.45; border-radius: 15px; }

  .apoiar-icape-grid { gap: 38px; }
  .apoiar-icape-item { display: flex; flex-direction: column; }
  .apoiar-icape-item-title, .apoiar-icape-item-desc { text-align: left; }
  #apoiar-voluntariado, #apoiar-doador { height: 240px; }

  .diversidade-grid { gap: 28px; }
  .diversidade-photo { border-radius: 90px 18px 18px 18px; aspect-ratio: 4 / 3; }

  .metric-grid { gap: 14px; }
  .metric-card { padding: 22px; }

  .pesquisa-cta-banner { margin: 0; border-radius: 16px; }
  .pesquisa-cta-text { padding: 34px 20px 28px; }
  .pesquisa-cta-photo { height: 260px; }
  .pesquisa-cta-logo-mobile { width: 74px; }

  .blog-grid { gap: 14px; }
  .blog-card, .blog-card--destaque { min-width: 0; }

  .contato-grid { gap: 16px; }
  .contato-form { padding: 24px 20px; }
  .contato-info-dados { grid-template-columns: 1fr; }

  .newsletter-fields-row { gap: 4px; }
  .newsletter-headline { font-size: 24px; line-height: 1.2; }

  .footer-links { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .footer-main { padding-left: 20px; padding-right: 20px; }

  /* Páginas internas */
  .page-hero--full { min-height: 390px; padding: 48px 20px; }
  .page-hero-title { max-width: 100%; }
  .galeria-grid { grid-template-columns: repeat(2, minmax(0,1fr)); grid-auto-rows: 132px; gap: 8px; }
  .galeria-evento { margin-bottom: 36px; }
  .galeria-evento-titulo { font-size: 23px; }
  .lightbox { padding: 16px; }
  .lightbox-nav { width: 42px; height: 42px; }
  .lightbox-prev { left: 8px; }
  .lightbox-next { right: 8px; }
  .pub-card { padding: 22px 20px; gap: 16px; }
  .pub-action { width: 100%; justify-content: center; }
}

@media (max-width: 380px) {
  nav { padding: 0 10px; }
  nav .nav-logo img { height: 44px !important; }
  .lang-sep { display: none; }
  .lang-btn { font-size: 11px; padding: 4px; }
  .hero-busca-title { font-size: 33px; }
  .somos-foto-grid { height: 380px !important; max-height: 380px !important; }
  .galeria-grid { grid-template-columns: 1fr; grid-auto-rows: 210px; }
}

/* ═══════════════════════════════════════════════════════════════
   REFINO FINAL — 31/07/2026
   Direção: conteúdo centralizado no desktop + mobile compacto,
   proporcional e com ritmo visual próprio.
═══════════════════════════════════════════════════════════════ */

/* Base de estabilidade e leitura */
:root {
  --content-max: 1200px;
  --mobile-gutter: 18px;
}
html { scroll-padding-top: 88px; }
body { overflow-x: clip; }
.section-inner {
  width: min(var(--content-max), calc(100% - 48px));
  max-width: none;
  padding-inline: 0;
  margin-inline: auto;
}

/* Desktop: fundos podem ser full-bleed, mas o conteúdo fica sempre centralizado. */
@media (min-width: 1024px) {
  nav {
    padding-inline: max(32px, calc((100vw - var(--content-max)) / 2));
  }

  .hero-busca {
    min-height: clamp(600px, calc(100svh - 112px), 760px);
  }
  .hero-busca-content {
    width: min(var(--content-max), calc(100% - 48px));
    max-width: none;
    margin-inline: auto;
    padding: 0 0 0 min(55%, 660px);
    box-sizing: border-box;
  }
  .hero-busca-eyebrow,
  .hero-busca-title,
  .hero-busca-content > p,
  .hero-busca-content > div {
    max-width: 500px;
  }
  .hero-busca-title { font-size: clamp(48px, 4vw, 60px); margin-bottom: 28px; }

  .intro-split {
    width: min(1280px, 100%);
    margin-inline: auto;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .intro-split-text { padding-left: 40px; padding-right: 56px; }
  .intro-split-photo { padding-right: 40px; }

  .unidos-banner,
  .quote-banner,
  .pesquisa-cta-banner {
    width: min(1360px, 100%);
    margin-inline: auto;
  }

  .apoiar-icape-grid { gap: 28px; }
  .apoiar-icape-item {
    display: grid;
    grid-template-rows: 280px auto auto auto;
    align-content: start;
  }
  #apoiar-voluntariado,
  #apoiar-doador {
    width: 100%;
    height: 280px !important;
    aspect-ratio: 2 / 1;
    object-fit: cover !important;
    border-radius: 16px;
    margin-bottom: 18px;
  }
  #apoiar-voluntariado { object-position: 50% 43% !important; }
  #apoiar-doador { object-position: 50% 47% !important; }
}

/* Tablet: mantém densidade e evita cards muito largos. */
@media (min-width: 768px) and (max-width: 1023px) {
  .section-inner { width: min(100% - 40px, 920px); }
  .fazemos-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .apoiar-icape-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 22px; }
  #apoiar-voluntariado, #apoiar-doador {
    height: 230px !important;
    object-fit: cover !important;
  }
  #apoiar-voluntariado { object-position: 50% 43% !important; }
  #apoiar-doador { object-position: 50% 47% !important; }
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE — versão desenhada para celular, não desktop empilhado
═══════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  :root {
    --section-pad-y: 36px;
    --block-pad-y: 36px;
    --card-pad-y: 16px;
    --gap: 12px;
  }

  html { scroll-padding-top: 72px; }
  body { font-size: 15px; }
  .section-wrap { padding-block: 36px; }
  .section-wrap[style*="padding-top:8px"] { padding-block: 0 !important; }
  .section-inner { width: calc(100% - (var(--mobile-gutter) * 2)); }

  /* Cabeçalho mais baixo e organizado */
  .top-bar {
    padding: 7px 12px !important;
    min-height: 0;
  }
  .top-bar p { font-size: 10.5px !important; line-height: 1.35 !important; }
  nav {
    height: 62px !important;
    padding-inline: 12px !important;
    gap: 8px;
  }
  nav .nav-logo img { height: 42px !important; }
  .lang-btn { font-size: 11px !important; padding: 4px !important; }
  .nav-toggle { transform: scale(.88); transform-origin: right center; }
  .nav-links {
    left: 10px !important;
    right: 10px !important;
    top: calc(100% + 6px) !important;
    border-radius: 14px !important;
  }

  /* Hero: foto + mensagem compacta, ainda reconhecível como o desktop */
  .hero-busca { background: var(--navy); }
  .hero-busca-media {
    aspect-ratio: 16 / 10 !important;
    max-height: 250px;
  }
  .hero-busca-media img {
    object-position: 50% 24% !important;
  }
  .hero-busca-content {
    padding: 28px var(--mobile-gutter) 32px !important;
  }
  .hero-busca-eyebrow {
    font-size: 9px !important;
    letter-spacing: .13em;
    margin-bottom: 11px !important;
  }
  .hero-busca-title {
    font-size: clamp(31px, 8.6vw, 36px) !important;
    line-height: 1.04 !important;
    margin-bottom: 14px !important;
    min-height: 2.1em;
  }
  .hero-busca-content > p:first-of-type {
    font-size: 15.5px !important;
    line-height: 1.42 !important;
    margin: 4px 0 6px !important;
  }
  .hero-busca-content > p:nth-of-type(2) {
    font-size: 13.5px !important;
    line-height: 1.55 !important;
    margin: 0 0 18px !important;
  }
  .hero-busca-content .btn-round {
    width: auto !important;
    min-height: 44px !important;
    padding: 11px 18px !important;
    font-size: 13.5px !important;
  }

  /* Somos ICAPE: texto enxuto e mosaico compacto */
  .intro-split-text { padding: 36px var(--mobile-gutter) 18px !important; }
  .intro-split-title {
    font-size: clamp(30px, 8.4vw, 35px) !important;
    line-height: 1.08 !important;
    margin-bottom: 16px !important;
  }
  .intro-split-body {
    font-size: 14.5px !important;
    line-height: 1.62 !important;
    margin-bottom: 11px !important;
  }
  .intro-split-body[style] {
    font-size: 12.5px !important;
    padding-top: 14px !important;
    margin-top: 2px !important;
  }
  .tags { margin-top: 12px !important; }
  .tag { font-size: 11px; padding: 5px 13px; }
  .intro-split-photo { padding: 0 var(--mobile-gutter) 34px !important; }
  .somos-foto-grid {
    height: 320px !important;
    max-height: 320px !important;
    gap: 6px !important;
  }
  .somos-foto-cell { border-radius: 9px !important; }

  /* Banners de foto e citação */
  .unidos-banner img,
  .unidos-banner > img {
    aspect-ratio: 16 / 7 !important;
    object-fit: cover !important;
    object-position: center 35% !important;
  }
  .unidos-banner-text {
    inset: auto 18px 18px 18px !important;
    font-size: 20px !important;
    line-height: 1.2 !important;
    max-width: 310px;
  }

  .quote-banner > img {
    aspect-ratio: 16 / 8 !important;
    object-position: 50% 36% !important;
  }
  .quote-banner-box {
    margin: -24px 14px 12px !important;
    padding: 17px 16px !important;
    border-radius: 14px !important;
    font-size: 15.5px !important;
    line-height: 1.42 !important;
  }

  /* Títulos e textos gerais proporcionais */
  .section-eyebrow,
  .intro-split-eyebrow {
    font-size: 9.5px !important;
    margin-bottom: 10px !important;
  }
  .section-title,
  .areas-titulo,
  .area-texto-title,
  .apoiar-icape-title,
  .diversidade-title,
  .page-hero-title,
  .cta-title,
  .anvisa-title {
    font-size: clamp(28px, 7.8vw, 33px) !important;
    line-height: 1.1 !important;
  }
  .apoiar-icape-subtitle,
  .diversidade-body,
  .apoiar-icape-item-desc,
  .fazemos-desc,
  .metric-card p,
  .page-hero-lead,
  .prose p,
  .lead,
  .anvisa-body {
    font-size: 14px !important;
    line-height: 1.58 !important;
  }

  /* O que fazemos: trilho horizontal compacto, como interfaces mobile atuais */
  .section-eyebrow[style] { margin-top: 32px !important; }
  .section-title[style] { margin-bottom: 20px !important; }
  .fazemos-grid {
    display: flex !important;
    flex-direction: row !important;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    gap: 12px !important;
    margin-inline: calc(var(--mobile-gutter) * -1);
    padding: 0 var(--mobile-gutter) 8px;
  }
  .fazemos-grid::-webkit-scrollbar { display: none; }
  .fazemos-card {
    flex: 0 0 min(78vw, 288px);
    scroll-snap-align: start;
    padding: 13px !important;
    border-radius: 16px !important;
  }
  .fazemos-photo {
    height: 145px !important;
    margin-bottom: 13px !important;
    border-radius: 11px !important;
  }
  .fazemos-photo img { object-position: center 32%; }
  .fazemos-title {
    font-size: 19px !important;
    line-height: 1.18 !important;
    margin-bottom: 6px !important;
  }
  .fazemos-desc { font-size: 13px !important; line-height: 1.48 !important; }

  /* Apoie: dois cards claros, fotos baixas e rostos preservados */
  #apoiar-icape { padding-block: 38px !important; }
  .apoiar-icape-title { margin-bottom: 10px !important; }
  .apoiar-icape-subtitle { margin-bottom: 24px !important; }
  .apoiar-icape-grid { gap: 24px !important; }
  .apoiar-icape-item {
    background: #F5FAFE;
    border: 1px solid #E0F0F8;
    border-radius: 18px;
    padding: 12px 12px 14px;
  }
  #apoiar-voluntariado,
  #apoiar-doador {
    width: 100%;
    height: 180px !important;
    aspect-ratio: 16 / 9;
    object-fit: cover !important;
    border-radius: 13px !important;
    margin-bottom: 14px !important;
  }
  #apoiar-voluntariado { object-position: 50% 42% !important; }
  #apoiar-doador { object-position: 50% 46% !important; }
  .apoiar-icape-item-title {
    font-size: 23px !important;
    line-height: 1.15 !important;
    margin: 0 2px 7px !important;
    text-align: left !important;
  }
  .apoiar-icape-item-desc {
    margin: 0 2px 12px !important;
    text-align: left !important;
  }
  .apoiar-icape-item .btn-round {
    width: auto !important;
    align-self: flex-start !important;
    min-height: 42px !important;
    padding: 10px 16px !important;
    font-size: 13px !important;
  }

  /* Diversidade e portas de entrada */
  .diversidade-grid { gap: 20px !important; }
  .diversidade-subtitle {
    font-size: 19px !important;
    line-height: 1.32 !important;
    margin-top: 12px;
  }
  .diversidade-photo {
    aspect-ratio: 16 / 10 !important;
    border-radius: 46px 14px 14px 14px !important;
  }
  .metric-grid { gap: 10px !important; margin-top: 22px !important; }
  .metric-card {
    padding: 17px 18px 18px !important;
    border-radius: 15px !important;
  }
  .metric-card h4 { font-size: 18px !important; margin-bottom: 5px !important; }
  .metric-card p { margin: 0; }

  /* Pesquisa clínica: bloco curto e conectado à foto */
  .pesquisa-cta-banner { border-radius: 16px !important; }
  .pesquisa-cta-text { padding: 26px 18px 24px !important; }
  .pesquisa-cta-logo-mobile { width: 58px !important; margin-bottom: 14px !important; }
  .pesquisa-cta-eyebrow { font-size: 9.5px !important; margin-bottom: 10px !important; }
  .pesquisa-cta-title {
    font-size: clamp(27px, 7.6vw, 31px) !important;
    margin-bottom: 12px !important;
  }
  .pesquisa-cta-desc {
    font-size: 13.5px !important;
    line-height: 1.55 !important;
    margin: 0 0 16px !important;
  }
  .pesquisa-cta-banner .btn-round {
    width: auto !important;
    align-self: flex-start !important;
    min-height: 44px !important;
    padding: 11px 15px !important;
    font-size: 12.5px !important;
  }
  .pesquisa-cta-photo {
    height: 210px !important;
    border-radius: 0 0 16px 16px !important;
  }
  .pesquisa-cta-photo img { object-position: 50% 18% !important; }

  /* Galeria da home: trilho curto, não uma lista de fotos gigantes */
  #galeria-home .blog-header {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px 12px;
    align-items: end;
    margin-bottom: 18px !important;
  }
  #galeria-home .blog-header > div:first-child { min-width: 0; }
  #galeria-home .blog-ver-mais {
    font-size: 11.5px !important;
    line-height: 1.25;
    max-width: 105px;
    text-align: right;
  }
  #galeria-home .galeria-grid {
    display: flex !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    gap: 10px !important;
    margin: 0 calc(var(--mobile-gutter) * -1) !important;
    padding: 0 var(--mobile-gutter) 8px;
  }
  #galeria-home .galeria-grid::-webkit-scrollbar { display: none; }
  #galeria-home .galeria-foto {
    flex: 0 0 min(78vw, 286px);
    height: 190px !important;
    min-height: 190px;
    scroll-snap-align: start;
    grid-column: auto !important;
    grid-row: auto !important;
    border-radius: 14px !important;
  }
  .galeria-cap-pill {
    top: 10px !important;
    left: 10px !important;
    right: 10px !important;
    max-width: calc(100% - 20px) !important;
    padding: 6px 10px !important;
    border-radius: 10px !important;
    font-size: 10.5px !important;
  }

  /* Newsletter compacta */
  .newsletter-band { padding-block: 34px !important; }
  .newsletter-headline {
    font-size: 24px !important;
    line-height: 1.12 !important;
    max-width: 330px;
  }
  .newsletter-subtitle {
    font-size: 14px !important;
    line-height: 1.5 !important;
    margin: 8px 0 18px !important;
  }
  .newsletter-fields-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }
  .newsletter-fields-row .form-group:last-child { grid-column: 1 / -1; }
  .newsletter-band .form-group { margin-bottom: 0 !important; }
  .newsletter-band .form-group label { font-size: 9.5px !important; margin-bottom: 5px !important; }
  .newsletter-band .form-group input {
    min-height: 44px !important;
    padding: 10px 12px !important;
    border-radius: 11px !important;
  }
  .newsletter-consent {
    font-size: 11.5px !important;
    line-height: 1.45 !important;
    margin: 14px 0 !important;
  }
  .btn-outline-white {
    min-height: 42px !important;
    padding: 9px 19px !important;
    font-size: 13px !important;
  }

  /* Rodapé compacto */
  .footer-main {
    padding: 30px var(--mobile-gutter) 24px !important;
    gap: 22px !important;
  }
  .footer-brand img { width: 152px !important; }
  .footer-brand-desc {
    font-size: 12.5px !important;
    line-height: 1.55 !important;
    margin-top: 10px !important;
  }
  .footer-links {
    grid-template-columns: 1fr 1fr !important;
    gap: 18px 24px !important;
  }
  .footer-col h4 { font-size: 9.5px !important; margin-bottom: 9px !important; }
  .footer-col ul li { margin-bottom: 4px !important; }
  .footer-col ul li a { font-size: 12px !important; }
  .footer-chronos-link {
    width: auto !important;
    min-height: 40px !important;
    padding: 9px 16px !important;
    font-size: 12.5px !important;
  }
  .footer-bottom {
    padding: 14px var(--mobile-gutter) 18px !important;
    gap: 8px !important;
  }
  .footer-bottom p { font-size: 10.5px !important; line-height: 1.4 !important; }
  .footer-legal-links { gap: 10px !important; }
  .footer-legal-links a { font-size: 10.5px !important; }

  /* WhatsApp menor e afastado dos CTAs */
  a[aria-label*="WhatsApp"] {
    width: 42px !important;
    height: 42px !important;
    right: 12px !important;
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
    box-shadow: 0 5px 16px rgba(13,42,61,.26) !important;
  }
  a[aria-label*="WhatsApp"] svg { width: 21px !important; height: 21px !important; }

  /* Evita travadinhas em aparelhos móveis */
  .fazemos-card,
  .apoiar-icape-item,
  .metric-card,
  .galeria-foto,
  .btn-round,
  .btn-outline-white {
    transition: none !important;
  }
  .busca-form { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
}

@media (max-width: 380px) {
  :root { --mobile-gutter: 16px; }
  .hero-busca-title { font-size: 30px !important; }
  .somos-foto-grid { height: 295px !important; max-height: 295px !important; }
  .newsletter-fields-row { grid-template-columns: 1fr !important; }
  .newsletter-fields-row .form-group:last-child { grid-column: auto; }
  .fazemos-card, #galeria-home .galeria-foto { flex-basis: 82vw; }
}

/* ═══════════════════════════════════════════════════════════════
   ICAPE V2 — AJUSTES COMPLETOS DESKTOP + MOBILE (SEM CACHE)
   01/08/2026
═══════════════════════════════════════════════════════════════ */

/* wrappers dos dois banners fotográficos em largura total */
.fullbleed-banner-wrap {
  width: 100%;
  max-width: none;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: hidden;
}

@media (min-width: 1024px) {
  /* Hero inicial: apenas o bloco textual mais lateralizado à direita */
  .hero-busca-content {
    width: min(var(--content-max), calc(100% - 48px)) !important;
    max-width: none !important;
    margin-inline: auto !important;
    padding-left: 60% !important;
    padding-right: 0 !important;
  }
  .hero-busca-eyebrow,
  .hero-busca-title,
  .hero-busca-content > p,
  .hero-busca-content > div {
    max-width: 455px !important;
  }

  /* Faixa “Unidos...” de ponta a ponta, sem repuxar */
  .unidos-banner {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    overflow: hidden !important;
  }
  .unidos-banner > img,
  #banner-unidos-photo {
    width: 100% !important;
    height: clamp(360px, 29vw, 500px) !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: 50% 38% !important;
    display: block !important;
  }
  .unidos-banner-text {
    left: max(48px, calc((100vw - var(--content-max)) / 2)) !important;
    right: auto !important;
    bottom: 42px !important;
    max-width: 760px !important;
  }

  /* Faixa da mulher + box azul de ponta a ponta */
  .quote-banner {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    overflow: hidden !important;
    background: #0b3a5c !important;
  }
  .quote-banner > img,
  #banner-quote-photo {
    width: 100% !important;
    height: clamp(340px, 27vw, 470px) !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
  }
  .quote-banner-box {
    left: auto !important;
    right: max(48px, calc((100vw - var(--content-max)) / 2)) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: min(520px, 38vw) !important;
    max-width: 520px !important;
    padding: 34px 40px !important;
    font-size: 24px !important;
  }

  /* Apoie: enquadramento coerente e sem cortar cabeças */
  #apoiar-voluntariado,
  #apoiar-doador {
    width: 100% !important;
    height: 290px !important;
    object-fit: cover !important;
  }
  #apoiar-voluntariado { object-position: 50% 35% !important; }
  #apoiar-doador { object-position: 50% 45% !important; }
}

@media (min-width: 768px) and (max-width: 1023px) {
  #apoiar-voluntariado { object-position: 50% 35% !important; }
  #apoiar-doador { object-position: 50% 45% !important; }
}

@media (max-width: 767px) {
  /* HOME: mesma linguagem de Galeria/Relatórios — foto ao fundo + gradiente + texto */
  .hero-busca {
    position: relative !important;
    display: block !important;
    min-height: clamp(570px, 92svh, 680px) !important;
    overflow: hidden !important;
    background: var(--navy) !important;
  }
  .hero-busca-media {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    z-index: 0 !important;
  }
  .hero-busca-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: 50% 18% !important;
  }
  .hero-busca-bg {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    background: linear-gradient(
      180deg,
      rgba(11,58,92,.10) 0%,
      rgba(11,58,92,.28) 30%,
      rgba(11,58,92,.72) 63%,
      rgba(11,58,92,.96) 100%
    ) !important;
  }
  .hero-busca-content {
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    max-width: none !important;
    min-height: clamp(570px, 92svh, 680px) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: flex-start !important;
    padding: 32px var(--mobile-gutter) 34px !important;
  }
  .hero-busca-eyebrow,
  .hero-busca-title,
  .hero-busca-content > p,
  .hero-busca-content > div {
    max-width: min(100%, 330px) !important;
  }
  .hero-busca-title {
    min-height: 0 !important;
    margin-bottom: 12px !important;
  }
  .hero-busca-content > p:first-of-type {
    margin: 3px 0 7px !important;
  }
  .hero-busca-content > p:nth-of-type(2) {
    margin: 0 0 18px !important;
  }
  .hero-busca-content .btn-round {
    width: auto !important;
    min-width: 0 !important;
  }

  /* Foto nova do voluntariado: respeitar o recorte 4:3 enviado */
  #apoiar-voluntariado {
    height: auto !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
    object-position: center center !important;
  }
  #apoiar-doador {
    object-position: 50% 45% !important;
  }

  /* Mulher listrada + card azul: composição única e legível */
  .quote-banner {
    position: relative !important;
    overflow: hidden !important;
    border-radius: 18px !important;
    margin: 0 !important;
  }
  .quote-banner > img,
  #banner-quote-photo {
    content: url('../img/banner-quote2-hands.webp') !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
    object-position: 50% 39% !important;
  }
  .quote-banner::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(13,42,61,.02), rgba(13,42,61,.10) 45%, rgba(13,42,61,.30));
    pointer-events: none;
    z-index: 1;
  }
  .quote-banner-box {
    position: absolute !important;
    right: 14px !important;
    bottom: 14px !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    margin: 0 !important;
    width: min(78%, 290px) !important;
    max-width: calc(100% - 28px) !important;
    padding: 16px !important;
    border-radius: 16px !important;
    font-size: 14px !important;
    line-height: 1.48 !important;
    z-index: 2 !important;
    box-shadow: 0 14px 32px rgba(5,25,40,.24) !important;
  }

  /* CTAs finais de Galeria e Relatórios mais curtos */
  .cta-final {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    padding: 0 !important;
    border-radius: 20px !important;
    overflow: hidden !important;
  }
  .cta-texto {
    padding: 26px 20px 17px !important;
  }
  .cta-eyebrow {
    font-size: 9.5px !important;
    margin-bottom: 9px !important;
  }
  .cta-title {
    font-size: clamp(27px, 7.3vw, 31px) !important;
    line-height: 1.08 !important;
    margin-bottom: 9px !important;
  }
  .cta-sub {
    max-width: none !important;
    margin-bottom: 15px !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
  }
  .cta-texto .btn-round {
    width: auto !important;
    align-self: flex-start !important;
    min-height: 42px !important;
    padding: 10px 16px !important;
    font-size: 13px !important;
  }
  .cta-foto {
    min-height: 0 !important;
    height: 145px !important;
    overflow: hidden !important;
  }
  .cta-foto img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
  }
}

@media (max-width: 380px) {
  .hero-busca,
  .hero-busca-content {
    min-height: 540px !important;
  }
  .hero-busca-content { padding-bottom: 28px !important; }
  .quote-banner-box {
    width: min(82%, 268px) !important;
    padding: 14px !important;
    font-size: 13.5px !important;
  }
  .cta-foto { height: 132px !important; }
}


/* ═══════════════════════════════════════════════════════════════
   ICAPE V3 — correção final do hero desktop
   Bloco de texto alinhado à esquerda, conforme solicitado.
═══════════════════════════════════════════════════════════════ */
@media (min-width: 1024px) {
  .hero-busca-content {
    width: min(var(--content-max), calc(100% - 48px)) !important;
    max-width: none !important;
    margin-inline: auto !important;
    padding-left: 0 !important;
    padding-right: 58% !important;
    align-items: flex-start !important;
    text-align: left !important;
    box-sizing: border-box !important;
  }
  .hero-busca-eyebrow,
  .hero-busca-title,
  .hero-busca-content > p,
  .hero-busca-content > div {
    width: 100% !important;
    max-width: 490px !important;
    text-align: left !important;
  }
  .hero-busca-content .btn-round {
    align-self: flex-start !important;
  }
}

/* Evita que o padding percentual comprima o texto em monitores ultrawide. */
@media (min-width: 1600px) {
  .hero-busca-content {
    padding-right: 696px !important;
  }
}