/* ===========================================
   SOBRE.CSS — estilos exclusivos da página Sobre
   =========================================== */

.sobre{
  padding:100px 0;
}
.sobre-grid{
  display:grid;
  grid-template-columns:0.85fr 1.15fr;
  gap:60px;
  align-items:center;
}
.photo-placeholder{
  aspect-ratio:4/5;
  border:2px dashed var(--gold);
  border-radius:6px;
  background:repeating-linear-gradient(45deg, rgba(122,59,34,0.04), rgba(122,59,34,0.04) 10px, transparent 10px, transparent 20px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:var(--rust);
  gap:8px;
  padding:20px;
}
.photo-placeholder strong{font-family:'Fraunces', serif; font-size:1.05rem;}
.photo-placeholder span{font-size:0.82rem; opacity:0.8; max-width:220px;}
.sobre h2{
  font-size:clamp(1.8rem, 3vw, 2.5rem);
  margin-bottom:20px;
  color:var(--ink);
}
.sobre p{
  color:var(--ink-soft);
  margin-bottom:16px;
  max-width:560px;
}
.text-placeholder{
  border:2px dashed var(--olive);
  border-radius:6px;
  padding:18px 20px;
  background:rgba(74,90,58,0.06);
  color:var(--olive);
  font-size:0.92rem;
  margin-bottom:16px;
}
.selos{
  display:flex; gap:14px; flex-wrap:wrap; margin-top:28px;
}
.selo{
  border:1px solid var(--gold);
  color:var(--rust);
  font-size:0.8rem;
  letter-spacing:0.04em;
  padding:8px 16px;
  border-radius:30px;
  text-transform:uppercase;
  font-weight:600;
}

/* VALORES */
.valores{
  background:var(--ink);
  color:var(--cream);
  padding:90px 0;
}
.valores .section-head{text-align:center; max-width:600px; margin:0 auto 50px;}
.valores h2{color:var(--cream); font-size:clamp(1.8rem,3vw,2.4rem); margin-top:14px;}
.valores .eyebrow{display:block; text-align:center;}
.valores-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:30px;}
.valor-card{
  background:rgba(244,236,217,0.06);
  border:1px solid rgba(201,161,59,0.3);
  border-radius:8px;
  padding:30px 26px;
}
.valor-card h3{color:var(--gold-light); font-size:1.1rem; margin-bottom:10px;}
.valor-card p{color:#cfc6ad; font-size:0.9rem;}

@media (max-width: 880px){
  .sobre-grid{grid-template-columns:1fr;}
  .valores-grid{grid-template-columns:1fr;}
  .sobre, .valores{padding:64px 0;}
}