/* ===== Planos: dois cards 553.5 x 263 px ===== */
.planos-grid, .produtos .cards-grid:first-of-type{
  grid-auto-rows: 263px;
}
.plano-card{
  width: 553.5px; height: 263px; box-sizing: border-box;
  border: 1px solid rgba(2,32,120,.14);
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff, #f8f7fb);
  box-shadow: 0 6px 20px rgba(3,13,58,.06);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
/* Layout interno em 2 colunas (texto + imagem) */
.plano-card .plano-content{ display: grid; grid-template-columns: 1fr 180px; height: 100%; }
.plano-card .plano-text{ padding: 18px 20px; display: flex; flex-direction: column; gap: 10px; }
.plano-card h3{ margin: 0; font: 800 20px/1.25 Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:#0a1460; }
.plano-card p{ margin: 0; color:#2a3b6b; font: 500 14.5px/1.55 Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
               display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.plano-card .plano-cta{
  margin-top: auto; align-self: flex-start;
  padding: 10px 14px; border-radius: 12px;
  background: linear-gradient(180deg, #ffd100, #ffb800);
  color:#111; text-decoration:none; font-weight:800; font-size:14px;
  box-shadow: 0 6px 16px rgba(255,184,0,.35);
  transition: filter .2s ease, transform .2s ease;
}
.plano-card .plano-cta:hover{ filter:brightness(.96); transform: translateY(-1px); }

/* Mídia à direita, ocupa toda a altura com crop elegante */
.plano-card .plano-media{ position: relative; overflow:hidden; border-left: 1px solid rgba(2,32,120,.06); }
.plano-card .plano-media picture, .plano-card .plano-media img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center;
}

/* Hover */
.plano-card:hover{ transform: translateY(-4px); box-shadow: 0 14px 36px rgba(3,13,58,.14); border-color: rgba(2,32,120,.22); }
.plano-card::after{
  content:""; position:absolute; inset:-1px; border-radius:16px; pointer-events:none;
  background: radial-gradient(80% 60% at 50% 0%, rgba(46,120,255,.18), transparent 60%);
  opacity:0; transition: opacity .25s ease;
}
.plano-card:hover::after{ opacity:1; }

/* Responsivo: se não couber 553.5px, empilha mantendo altura fixa */
@media (max-width: 1200px){
  .plano-card{ width: 100%; }
  .plano-card .plano-content{ grid-template-columns: 1fr; }
  .plano-card .plano-media{ height: 120px; border-left:0; border-top:1px solid rgba(2,32,120,.06); }
}