/* ===============================
   Base mínima + Variáveis
   =============================== */
html,body{ margin:0; padding:0; }
.navbar-color{ background-color:rgba(68,68,68,.9)!important; }

:root{
  --oe-green:#22a559;
  --oe-green-ink:#1b8a4b;
  --oe-card-bg:#fff;
  --oe-card-ink:#111827;
  --oe-card-muted:#5f6773;
  --oe-shadow:0 8px 20px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.05);
  --oe-shadow-hover:0 14px 28px rgba(0,0,0,.12), 0 6px 12px rgba(0,0,0,.08);
  --oe-radius:22px;
  /* Espaçamento responsivo entre cards */
  --cards-gap:32px; /* Desktop - maior espaçamento */
}

/* ===============================
   Cover da Home
   =============================== */
.cover-home{
  background:url('/css/img/cover_background/AUDM_Home.png') center/cover no-repeat;
  min-height:100vh;
  position:relative;
  display:flex; flex-direction:column; justify-content:center;
  align-items: center;
  padding:84px 0 40px;
}

/* ===============================
   Score Flex Box - ESPAÇAMENTO RESPONSIVO
   =============================== */
.scores{ 
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--cards-gap);
  grid-auto-rows: 1fr;
}

.score-card{
  background:var(--oe-card-bg); 
  color:var(--oe-card-ink);
  border-radius:var(--oe-radius); 
  box-shadow:var(--oe-shadow);
  border:1px solid rgba(0,0,0,.05);
  padding:24px 22px; 
  display:flex; 
  flex-direction:column;
  transition:transform .15s ease, box-shadow .15s ease;
}

.score-card:hover{ 
  transform:translateY(-2px); 
  box-shadow:var(--oe-shadow-hover); 
}

.card-link{ 
  display:flex; 
  flex-direction:column; 
  align-items:center; 
  text-align:center; 
  text-decoration:none; 
  color:inherit; 
  width:100%; 
  height:100%; 
  justify-content: space-between; /* Distribui conteúdo */
}

.card-link:hover{ 
  color:inherit; 
  text-decoration:none; 
}

.score-icon{
  width:80px; height:80px; border-radius:50%;
  display:grid; place-items:center; margin-bottom:12px;
  background:rgba(34,165,89,.12); border:2px solid rgba(34,165,89,.28);
  flex-shrink: 0; /* Não encolhe */
}

.score-icon img{ 
  max-width:60%; max-height:60%; object-fit:contain; display:block; 
}

.score-title{ 
  font-size:18px; font-weight:700; margin:4px 0 6px; 
  flex-shrink: 0; /* Não encolhe */
}

.score-text{ 
  font-size:14px; line-height:1.55; color:var(--oe-card-muted); margin:0;
  flex-grow: 1; /* Ocupa espaço restante */
  display: flex;
  align-items: center; /* Centraliza texto verticalmente */
}

/* Responsive */
@media (max-width:1200px){
  :root{ --cards-gap:28px; } /* Telas grandes */
}
@media (max-width:992px){
  :root{ --cards-gap:24px; } /* Tablets */
  .scores{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width:768px){
  :root{ --cards-gap:20px; } /* Tablets pequenos */
}
@media (max-width:576px){
  :root{ --cards-gap:16px; } /* Mobile */
  .scores{ grid-template-columns: 1fr; }
}
@media (max-width:400px){
  :root{ --cards-gap:12px; } /* Mobile muito pequeno */
}

/* ===============================
   Landing sections (todas)
   =============================== */
.landing-section{ padding:40px 0; background:#f8fafc; }
.landing-section:nth-of-type(2n){ background:#ffffff; }
.section-title{ font-size:28px; font-weight:800; color:#111827; margin-bottom:1.25rem; }

/* ===============================
   Métricas
   =============================== */
.metrics-section .metric-card{
  background:#fff; border-radius:16px; padding:22px 18px; text-align:center;
  box-shadow:0 8px 20px rgba(0,0,0,.06), 0 2px 6px rgba(0,0,0,.04);
  border:1px solid rgba(0,0,0,.05);
}
.metric-number{ font-size:34px; font-weight:900; color:var(--oe-green-ink); line-height:1; }
.metric-label{ margin-top:6px; font-size:14px; color:#4b5563; }
.badge-red{ color:#fff; background-color:#f44336; }

/* ===============================
   Parceiros (grid grande)
   =============================== */
.partners-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:40px;
}
.partner-card{
  display:grid; place-items:center; background:#fff;
  border-radius:14px; border:1px solid rgba(0,0,0,.06);
  box-shadow:0 6px 16px rgba(0,0,0,.06);
  padding:48px; min-height:220px; text-decoration:none; color:inherit;
  transition:transform .12s ease, box-shadow .12s ease;
}
.partner-card:hover{ transform:translateY(-4px); box-shadow:0 12px 28px rgba(0,0,0,.12); }
.partner-card img{ max-width:100%; max-height:240px; object-fit:contain; display:block; }
@media (max-width:992px){ .partners-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:576px){ .partners-grid{ grid-template-columns:1fr; } }

/* ===============================
   Footer
   =============================== */
.site-footer{
  background-color:rgba(68,68,68,.9); color:#fff; width:100%; font-size:14px;
}
.site-footer .footer-link{ color:#ddd; text-decoration:none; }
.site-footer .footer-link:hover{ color:#fff; text-decoration:underline; }
.site-footer .social-icons a{ color:#ddd; font-size:18px; transition: color .3s, transform .2s; }
.site-footer .social-icons a:hover{ color:#fff; transform:scale(1.2); }
.cover-footer{ display:none; }

/* =======================================================
   QUEM SOMOS — TIMELINE (com cover atrás)
   ======================================================= */
.about-timeline-section{
  position:relative; overflow:hidden;
  padding:104px 0 64px; background:transparent!important;
}
.about-timeline-section::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:url('/css/img/cover_background/AUDM_Home.png') center/cover no-repeat; z-index:0;
}
.about-timeline-section::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to bottom, rgba(0,0,0,.28), rgba(0,0,0,.42)); z-index:1;
}
.about-timeline-section > .container, .about-timeline{ position:relative; z-index:2; }
.about-timeline-section .section-title{ color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.45); }

/* Linha central + itens (desktop) */
.about-timeline{
  position:relative; margin:0 auto; max-width:1100px; padding:8px 0;
}
.about-timeline::before{
  content:""; position:absolute; top:0; bottom:0; left:50%;
  width:3px; transform:translateX(-50%);
  background:linear-gradient(to bottom, rgba(34,165,89,.35), rgba(34,165,89,.10));
  border-radius:2px;
}
.about-timeline-item{
  position:relative; width:100%;
  display:grid; grid-template-columns:1fr 1fr; column-gap:84px;
  margin:24px 0; opacity:0; transform:translateY(12px);
  transition:opacity .5s ease, transform .5s ease;
}
.about-timeline-item.is-visible{ opacity:1; transform:translateY(0); }

/* Dot */
.about-timeline-dot{
  position:absolute; left:50%; top:18px; transform:translate(-50%,-50%);
  width:16px; height:16px; border-radius:50%; background:#fff;
  border:3px solid var(--oe-green); box-shadow:0 0 0 5px rgba(34,165,89,.18);
}

/* Cartão base */
.about-timeline-card{
  background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:16px;
  box-shadow:0 10px 22px rgba(0,0,0,.10), 0 2px 6px rgba(0,0,0,.06);
  padding:18px 20px; max-width:460px; position:relative;
  border-left:6px solid var(--oe-green);
}

/* Conector */
.about-timeline-card::before{
  content:""; position:absolute; top:24px; width:18px; height:2px;
  background:linear-gradient(90deg, rgba(34,165,89,.45), rgba(34,165,89,0));
}
.about-timeline-item:nth-child(odd) .about-timeline-card{ grid-column:2; justify-self:start; margin-left:22px; }
.about-timeline-item:nth-child(odd) .about-timeline-card::before{ left:-18px; }
.about-timeline-item:nth-child(even) .about-timeline-card{ grid-column:1; justify-self:end; margin-right:22px; }
.about-timeline-item:nth-child(even) .about-timeline-card::before{ right:-18px; }

/* Tipografia */
.about-year{
  display:inline-block; margin:0 0 6px 0; font-size:18px; font-weight:800;
  color:var(--oe-green-ink); text-transform:uppercase; letter-spacing:.3px;
  background:rgba(34,165,89,.10); border:1px solid rgba(34,165,89,.25);
  padding:4px 10px; border-radius:999px;
}
.about-title{ margin:0 0 6px; font-size:19px; font-weight:700; color:#111827; line-height:1.25; }
.about-desc{ margin:0; color:#4b5563; line-height:1.55; font-size:14px; }

/* Estado clicável + seta subtil */
.about-timeline-link{ display:block; text-decoration:none; color:inherit; transition:transform .12s ease, box-shadow .12s ease; }
.about-timeline-link:hover{ transform:translateY(-2px); box-shadow:0 16px 30px rgba(0,0,0,.14); }
.about-timeline-link::after{
  content:""; position:absolute; inset:auto 14px 14px auto; width:10px; height:10px;
  border-right:2px solid #9CA3AF; border-bottom:2px solid #9CA3AF;
  transform:rotate(-45deg); opacity:0; transition:opacity .12s, transform .12s;
}
.about-timeline-link:hover::after{ opacity:.9; transform:translate(2px,-2px) rotate(-45deg); }

/* Micro pulso ao aparecer */
.about-timeline-item.is-visible .about-timeline-dot{ animation:dotPulse .9s ease-out 1; }
@keyframes dotPulse{
  0%{ box-shadow:0 0 0 0 rgba(34,165,89,.35); }
  100%{ box-shadow:0 0 0 8px rgba(34,165,89,0); }
}

/* =======================================================
   MOBILE — TIMELINE (tudo à direita da linha) + dot centrado
   ======================================================= */
@media (max-width:767.98px){
  #quem-somos{ --tl-line-x:16px; --tl-line-w:3px; }

  #quem-somos .about-timeline{ max-width:100%!important; padding-inline:16px!important; box-sizing:border-box; }
  #quem-somos .about-timeline::before{ left:var(--tl-line-x)!important; width:var(--tl-line-w)!important; transform:none!important; }

  #quem-somos .about-timeline-item{
    display:grid!important; grid-template-columns:32px minmax(0,1fr)!important;
    column-gap:12px!important; align-items:start!important; margin:18px 0!important;
    opacity:1!important; transform:none!important;
  }

  #quem-somos .about-timeline-dot{
    left:calc(var(--tl-line-x) + var(--tl-line-w)/2)!important;
    width:12px!important; height:12px!important;
    transform:translate(-50%,-50%)!important;
    box-shadow:0 0 0 3px rgba(34,165,89,.18)!important;
  }

  #quem-somos .about-timeline-card{
    grid-column:2!important; justify-self:stretch!important; max-width:none!important;
    width:auto!important; margin:0!important; padding:16px!important; border-radius:14px!important;
    border-left-width:5px!important;
  }
  #quem-somos .about-timeline-card::before{ left:-14px; right:auto; width:14px; top:20px; }

  #quem-somos .about-timeline-item:nth-child(odd) .about-timeline-card,
  #quem-somos .about-timeline-item:nth-child(even) .about-timeline-card{ margin:0!important; }

  #quem-somos .about-year{ font-size:16px!important; margin-bottom:2px!important; }
  #quem-somos .about-title{ font-size:16px!important; }
  #quem-somos .about-desc{ font-size:14px!important; }
}
@media (max-width:399.98px){
  #quem-somos{ --tl-line-x:12px; }
  #quem-somos .about-timeline{ padding-inline:12px!important; }
  #quem-somos .about-timeline-item{ grid-template-columns:28px minmax(0,1fr)!important; column-gap:10px!important; }
  #quem-somos .about-timeline-card{ padding:14px!important; }
}

/* Acessibilidade: reduzir movimento */
@media (prefers-reduced-motion:reduce){
  .about-timeline-item{ transition:none!important; transform:none!important; opacity:1!important; }
  .about-timeline-link{ transition:none!important; }
}

/* ===============================
   MVV (Missão / Visão / Valores)
   =============================== */
.mvv-section{ background:#ffffff; }
.mvv-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
@media (max-width:992px){ .mvv-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:576px){ .mvv-grid{ grid-template-columns:1fr; } }

.mvv-card{
  background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:16px;
  box-shadow:0 8px 20px rgba(0,0,0,.06); padding:22px 20px; text-align:center;
  transition:transform .12s ease, box-shadow .12s ease;
}
.mvv-card:hover{ transform:translateY(-2px); box-shadow:0 14px 28px rgba(0,0,0,.12); }
.mvv-icon{ font-size:28px; color:var(--oe-green-ink); margin-bottom:8px; }
.mvv-title{ font-size:18px; font-weight:700; margin:0 0 6px; }
.mvv-text{ margin:0; color:#4b5563; }

/* ===============================
   Testemunhos - LAYOUT MASONRY (COLUNAS CSS)
   =============================== */
.testimonials-section{ background:#f8fafc; }

.testimonials-grid{ 
  columns: 3;
  column-gap: 24px;
  column-fill: balance;
}

@media (max-width:992px){ 
  .testimonials-grid{ 
    columns: 2;
    column-gap: 20px;
  } 
}

@media (max-width:576px){ 
  .testimonials-grid{ 
    columns: 1;
    column-gap: 0;
  } 
}

.testimonial{
  background: #fff; 
  border: 1px solid rgba(0,0,0,.06); 
  border-radius: 16px;
  box-shadow: 0 8px 20px rgba(0,0,0,.06); 
  padding: 24px 26px; 
  font-size: 15px; 
  color: #111827;
  line-height: 1.6;
  transition: transform .12s ease, box-shadow .12s ease;
  
  /* ESSENCIAL PARA COLUNAS CSS */
  break-inside: avoid;
  margin-bottom: 24px;
  display: block;
  width: 100%;
}

.testimonial:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(0,0,0,.12);
}

/* Variante vermelha */
.testimonial-red{
  background: linear-gradient(135deg, #f44336, #d32f2f);
  color: #fff;
  border: 1px solid rgba(244, 67, 54, 0.3);
}

.testimonial-red footer{
  color: rgba(255,255,255,0.9) !important;
}

/* CONTEÚDO DO TESTEMUNHO */
.testimonial-content {
  flex-grow:0;
  /* Conteúdo normal, sem flex */
}

.testimonial p{ 
  margin: 0 0 12px 0; 
}

.testimonial p:last-of-type{
  margin-bottom: 0;
}

/* FOOTER */
.testimonial footer{ 
  margin: 16px 0 0 0; 
  color: #6b7280; 
  font-size: 14px; 
  font-weight: 600;
  padding-top: 12px;
  border-top: 1px solid rgba(0,0,0,0.1);
}

.testimonial-red footer{
  border-top: 1px solid rgba(255,255,255,0.2);
}

.testimonial footer em{
  font-weight: 400;
  font-style: italic;
  opacity: 0.8;
}

/* Responsivo - ajustar espaçamentos */
@media (max-width: 768px) {
  .testimonial{
    padding: 20px 22px;
    font-size: 14px;
    margin-bottom: 20px;
  }
  
  .testimonial p{
    margin-bottom: 10px;
  }
  
  .testimonial footer{
    margin-top: 14px;
    padding-top: 10px;
  }
}

@media (max-width: 576px) {
  .testimonials-grid{
    column-gap: 0;
  }
  
  .testimonial{
    margin-bottom: 16px;
  }
}

/* ===============================
   Parceiros estratégicos (mini)
   =============================== */
.partners-mini{ background:#ffffff; }
.partners-mini-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:20px; align-items:center;
}
@media (max-width:992px){ .partners-mini-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:576px){ .partners-mini-grid{ grid-template-columns:1fr; } }

.partner-chip{
  display:grid; place-items:center; background:#fff;
  border:1px solid rgba(0,0,0,.06); border-radius:14px;
  box-shadow:0 6px 16px rgba(0,0,0,.06);
  padding:28px; text-decoration:none; color:inherit;
  transition: transform .12s ease, box-shadow .12s ease;
}
.partner-chip:hover{ transform: translateY(-2px); box-shadow:0 12px 24px rgba(0,0,0,.10); }
.partner-chip img{ max-width:100%; max-height:120px; object-fit:contain; display:block; }

/* ===============================
   CTA
   =============================== */
.cta-band{ background:linear-gradient(135deg, var(--oe-green-ink), #0c5a2f); color:#fff; padding:48px 0; }
.cta-content{ text-align:center; }
.cta-content h2{ font-weight:800; margin-bottom:8px; }
.cta-content p{ margin-bottom:18px; opacity:.95; }
.cta-actions .btn{ border-radius:999px; padding:.6rem 1.25rem; }

/* =======================================================
   ÓRGÃOS SOCIAIS — Secção com cover + cards
   ======================================================= */
.orgs-section{
  position:relative;
  padding:104px 0 64px;
  min-height:100vh;
  background:transparent!important;
}
.orgs-section::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:url('/css/img/cover_background/AUDM_Home.png') center/cover no-repeat;
}
.orgs-section::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:linear-gradient(to bottom, rgba(0,0,0,.25), rgba(0,0,0,.35));
}
.orgs-section > .container{ position:relative; z-index:2; }
.orgs-section .section-title{ color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.45); }
.orgs-block{ margin-top:10px; }

/* Grid de pessoas */
.org-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap:20px;
  margin-bottom: 36px;
}
@media (max-width:1200px){ .org-grid{ grid-template-columns: repeat(3, minmax(180px,1fr)); margin-bottom: 48px; } }
@media (max-width:992px){  .org-grid{ grid-template-columns: repeat(2, minmax(160px,1fr)); margin-bottom: 48px; } }
@media (max-width:576px){  .org-grid{ grid-template-columns: 1fr; margin-bottom: 48px; } }

/* Card de pessoa */
.org-card{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  background:#fff; color:inherit; text-decoration:none;
  border:1px solid rgba(0,0,0,.06); border-radius:16px;
  box-shadow:0 8px 20px rgba(0,0,0,.06);
  padding:18px; 
  /* REMOVER min-height fixo */
  /* min-height:260px; */
  transition: transform .12s ease, box-shadow .12s ease;
}
.org-card:hover{ transform: translateY(-2px); box-shadow:0 14px 28px rgba(0,0,0,.12); }

.org-photo{
  width:100%; aspect-ratio:1/1; max-width:220px;
  border-radius:14px; object-fit:cover; display:block;
  background:#f3f4f6; border:1px solid rgba(0,0,0,.05);
  margin-bottom:12px;
}
.org-name{ font-weight:800; color:#111827; font-size:16px; line-height:1.25; }
.org-role{ margin-top:4px; color:#4b5563; font-size:14px; }

.org-card-disabled {
  pointer-events: none;
  cursor: default;
}

/* ====== Contactos — Hero próprio (não afeta o resto) ====== */
.contacts-hero{
  /* um único background (gradiente + imagem) evita a “barra preta” */
  background:
    linear-gradient(to bottom,
      rgba(0,0,0,.28) 0%,
      rgba(0,0,0,.14) 60%,
      rgba(0,0,0,0) 100%
    ),
    url('/css/img/cover_background/AUDM_Home.png') center/cover no-repeat !important;
  padding: 104px 0 56px;           /* alinhado com as outras covers */
  min-height: 280px;               /* podes ajustar se quiseres mais alto/baixo */
  margin-bottom: -1px;             /* tapa micro “seam” com a secção seguinte */
}

.contacts-hero .section-title{
  color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.45);
}
.contacts-hero p{ color:rgba(255,255,255,.85); }

/* contacto: garantir que iframes não criam linhas fantasma */
.contacts-hero iframe,
section.landing-section iframe{ display:block; }




/* ===============================
   Gráficos de Evolução - DESIGN LIMPO
   =============================== */
.charts-evolution-section {
  background: #f8fafc;
}

.chart-card {
  background: white;
  border-radius: var(--oe-radius);
  box-shadow: var(--oe-shadow);
  border: 1px solid rgba(0,0,0,.06);
  padding: 30px 25px;
  transition: transform .12s ease, box-shadow .12s ease;
}

.chart-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--oe-shadow-hover);
}

.chart-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #111827;
  margin: 0 0 20px 0;
  text-align: center;
  padding-bottom: 15px;
  border-bottom: 2px solid #f3f4f6;
}

.chart-content {
  position: relative;
  height: 300px;
}

.chart-content canvas {
  width: 100% !important;
  height: 100% !important;
}

@media (max-width: 768px) {
  .chart-card {
    padding: 20px 15px;
  }
  
  .chart-title {
    font-size: 1.3rem;
    margin-bottom: 15px;
    padding-bottom: 10px;
  }
  
  .chart-content {
    height: 250px;
  }
}

/* CARD SEM FOTO - LAYOUT COMPACTO */
.org-card-no-photo {
  padding: 16px !important;
  /* Já não tem min-height, por isso não precisa de override */
}

.org-card-no-photo .org-name {
  margin-bottom: 4px !important;
}

.org-card-no-photo .org-role {
  margin: 0 !important;
}

/* Responsivo para cards sem foto */
@media (max-width: 768px) {
  .org-card {
    padding: 16px;
  }
  
  .org-card-no-photo {
    padding: 14px !important;
  }
}

@media (max-width: 576px) {
  .org-card {
    padding: 14px;
  }
  
  .org-card-no-photo {
    padding: 12px !important;
  }
}