/* ==== SOBRE (com imagens maiores) ==== */

/* Integração vertical */
.integration { padding: 44px 0; }
.vert-timeline {
  display: flex; flex-direction: column; gap: 22px; margin-top: 18px;
  border-left: 4px solid rgba(19,116,49,0.08); padding-left: 22px;
}
.vt-item {
  display: flex; gap: 22px; align-items: center;
  background: #fff; border: 1px solid #eef2f7; border-radius: 16px; padding: 14px;
  box-shadow: 0 10px 28px rgba(9,20,10,0.06);
}
.vt-media{
  width: 420px; height: 240px;        /* >>> maior <<< */
  background-size: cover; background-position: center;
  border-radius: 12px; flex: 0 0 420px;
  box-shadow: 0 8px 22px rgba(0,0,0,.08);
}
.vt-body h3{ margin: 0 0 8px; font-size: 20px; color: var(--green-900) }
.vt-body p{ margin: 0; color: var(--ink-2) }

/* Fazendas com IMAGEM */
.farm-timeline{ padding: 44px 0; }
/* antes:
.farms-grid{ display:grid; gap:18px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); margin-top:12px; }
*/
.farms-grid{
  display: grid;
  gap: 18px;
  grid-template-columns: 1fr; /* uma por linha */
  margin-top: 12px;
}
/* overview com imagem */
.overview-card{
  display: block;
  padding: 0;              /* sem padding no contêiner, vai no body */
  overflow: hidden;
  border-radius: 12px;
}
.overview-media{
  width: 100%;
  height: 140px;           /* banner landscape */
  background-size: cover;
  background-position: center;
}
.overview-body{ padding: 12px; }
.overview-body h4{ margin: 0 0 6px; }

.farm-card{
  background:#fff; border:1px solid #eef2f7; border-radius:16px; overflow:hidden;
  box-shadow:0 10px 28px rgba(0,0,0,.06);
}
.farm-media{
  width:100%; height: 220px;          /* landscape */
  background-size: cover; background-position:center;
}
.farm-body{ padding:12px 14px }
.farm-body h3{ margin:0 0 6px }
.farm-body p{ margin:0; color:var(--muted) }

/* Leadership */
.leadership{ padding: 40px 0; }
.leadership-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:18px; align-items:stretch; }
.lead-card{ display:flex; gap:16px; background:#fff; border:1px solid #eef2f7; border-radius:16px; padding:14px; box-shadow: var(--shadow); }
.lead-photo{ width:260px; height:160px; background-size:cover; background-position:center; border-radius:12px; flex:0 0 260px; }
.lead-body h3{ margin:0 0 6px }
.lead-body p.small{ margin-top:8px; color:var(--muted); font-size:13px }

/* Mini overview cards */
.mini-overview{ padding:40px 0; }
.overview-grid{ display:grid; grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap:12px; margin-top:12px; }
.overview-card{ display:block; background:#fff; border:1px solid #eef2f7; border-radius:12px; padding:12px; text-decoration:none; color:var(--ink); box-shadow: var(--shadow); }
.overview-card h4{ margin:0 0 6px }

/* Galeria — landscape grande, 2 colunas */
.gallery{ padding:40px 0 72px; }
.gallery-grid{
  display:grid; gap:16px;
  grid-template-columns: repeat(2, 1fr);  /* >>> duas por linha <<< */
  margin-top: 12px;
}
.gal-item{
  background:#fff; border:1px solid #eef2f7; border-radius:14px; overflow:hidden;
  box-shadow: var(--shadow);
}
.gal-item img{
  display:block; width:100%; height: 320px;  /* >>> maior e horizontal <<< */
  object-fit: cover; object-position: center;
}
.gal-item figcaption{ padding:10px 12px; font-size:14px; color:var(--muted) }

/* Responsivo */
@media (max-width: 1080px){
  .vt-media{ width: 100%; height: 260px; flex: 1 1 auto; }
  .vt-item{ flex-direction: column; align-items: stretch; }
  .leadership-grid{ grid-template-columns: 1fr; }
}
@media (max-width: 720px){
  .gal-item img{ height: 240px; }
  .gallery-grid{ grid-template-columns: 1fr; } /* cai para 1 coluna no mobile */
}
/* Logos quadradas SEM cortar */
.lead-photo{
  width: 128px;
  aspect-ratio: 1 / 1;                 /* quadrada */
  background: #fff center / contain no-repeat; /* <- contain não corta */
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 12px;                  /* 0 se quiser reto */
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
  flex: 0 0 auto;
  padding: 6px;                         /* respiro para não encostar nas bordas */
}

@media (max-width: 640px){
  .lead-photo{ width: 100px; padding: 4px; }
}
/* Link preenchendo o card sem alterar o layout flex do .lead-card */
.lead-card .lead-link{
  display: flex;
  gap: 16px;
  align-items: flex-start;
  text-decoration: none;
  color: inherit;
  width: 100%;
  height: 100%;
}
/* escopo: só o card da Group */
.lead-card--group { position: relative; overflow: hidden; }

/* link interno mantém layout */
.lead-card--group .lead-link{
  display: flex; gap: 16px; align-items: flex-start;
  text-decoration: none; color: inherit; width: 100%;
}

/* efeito “high-tech” sutil */
.lead-card--group{
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  border: 1px solid rgba(17,17,17,0.06);
}
.lead-card--group::before{
  content:""; position:absolute; inset:-1px;
  background: radial-gradient(120% 60% at 0% 0%, rgba(254,198,51,.20), transparent 60%),
              radial-gradient(120% 60% at 100% 100%, rgba(19,116,49,.16), transparent 60%);
  opacity: 0; transition: opacity .28s ease;
  pointer-events:none;
}
.lead-card--group:hover{
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
  border-color: rgba(254,198,51,.35);
}
.lead-card--group:hover::before{ opacity: .8; }

/* micro-parallax na imagem */
.lead-card--group .lead-photo{
  transition: transform .28s ease, box-shadow .28s ease;
}
.lead-card--group:hover .lead-photo{
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}

/* cursor de link apenas nesse card */
.lead-card--group:hover { cursor: pointer; }

/* Chip “Acessar site” (fica logo abaixo do h3) */
.lead-card--group .cta-chip{
  display:inline-flex; align-items:center; gap:8px;
  margin: 4px 0 6px 0; padding: 6px 12px;
  border-radius: 999px;
  font-weight: 600; font-size: .85rem; line-height: 1;
  background: linear-gradient(180deg, #FEC633, #e8b42d);
  color: #111; border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 1px 0 rgba(255,255,255,.5) inset;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.lead-card--group .cta-chip::after{
  content: "↗"; font-size: .9em; transform: translateY(1px);
}
.lead-card--group:hover .cta-chip{
  transform: translateY(-1px);
  background: linear-gradient(180deg, #ffd456, #f1bf37);
  box-shadow: 0 6px 16px rgba(254,198,51,.35);
}