/* ============================================================
   ÉGIDA — logotipo.css
   ============================================================ */

/* ---------- Logotipo ---------- */
.logotipo{ background:var(--grey); }
.brand-viewer{
  border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:0 30px 70px -30px rgba(17,17,36,.35);
  background:var(--white);
}
.brand-viewer__stage{
  height:clamp(280px,42vw,420px);
  display:grid; place-content:center; padding:2rem;
  background:var(--white);
  transition:background .5s ease;
}
.brand-viewer__stage img{
  width:min(660px,90%); transition:opacity .3s ease, transform .3s var(--ease);
}
@media (max-width:900px){
  .brand-viewer__stage img{ width:88%; }
}
.brand-viewer__stage img.swap{ opacity:0; transform:scale(.96); }
.brand-viewer__controls{
  display:flex; flex-wrap:wrap; gap:1.2rem; align-items:center;
  justify-content:space-between;
  padding:1.2rem 1.5rem; background:var(--dark);
}
.brand-viewer__variants{ display:flex; flex-wrap:wrap; gap:.5rem; }
.chip{
  font-family:var(--font-body); font-weight:400; font-size:.82rem;
  color:rgba(255,255,255,.75);
  padding:.45rem 1.05rem; border-radius:999px;
  border:1px solid var(--line);
  transition:background .3s, color .3s, border-color .3s, transform .3s var(--ease);
}
.chip:hover{ transform:translateY(-2px); color:var(--white); border-color:rgba(255,255,255,.4); }
.chip.is-active{
  background:var(--orange); border-color:var(--orange); color:var(--white); font-weight:500;
}
.brand-viewer__backgrounds{ display:flex; gap:.7rem; align-items:center; }
.dotbtn{
  width:26px; height:26px; border-radius:50%;
  background:var(--dot);
  border:2px solid var(--line);
  transition:transform .3s var(--ease), border-color .3s, box-shadow .3s;
}
.dotbtn:hover{ transform:scale(1.15); }
.dotbtn.is-active{
  border-color:var(--orange);
  box-shadow:0 0 0 3px var(--orange-soft);
}
.brand-row{
  margin-top:clamp(2.5rem,5vw,3.5rem);
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem;
}
.brand-card{
  background:var(--white); border-radius:var(--radius);
  padding:2.2rem 1.8rem; text-align:center;
  box-shadow:0 12px 34px -20px rgba(17,17,36,.3);
  transition:transform .4s var(--ease), box-shadow .4s;
}
.brand-card:hover{ transform:translateY(-8px); box-shadow:0 24px 50px -22px rgba(17,17,36,.4); }
.brand-card img{
  height:74px; width:auto; margin:0 auto 1.4rem;
  object-fit:contain;
}
.brand-card__duo{
  display:flex; justify-content:center; gap:.9rem; margin-bottom:1.4rem;
}
.brand-card__duo-box{
  width:92px; height:92px; border-radius:14px;
  background:var(--grey);
  display:grid; place-content:center;
}
.brand-card__duo-box img{ height:56px; width:auto; margin:0; }
.brand-card__duo-box--dark{ background:var(--dark); }
.brand-card h3{
  font-family:var(--font-display); font-weight:600; font-size:1.15rem; margin-bottom:.4rem;
}
.brand-card p{ font-size:.88rem; opacity:.72; }
