/* ============================================================
   AMARAN — deltas sobre numo-produto.css
   (alavancagem/revenda · 5 cards · gráfico comparativo CDI×Amaran
    · 2 plantas · lista de lazer · prova social Modelo B)
   ============================================================ */

/* ---- placeholders de imagem (image-slot) preenchem o container ---- */
.hero__photo image-slot { display: block; width: 100%; height: 100%; }
.estr__photo image-slot { display: block; width: 100%; height: 100%; min-height: 480px; }
.prova__feature-media image-slot { display: block; width: 100%; height: 100%; min-height: 100%; }
@media (max-width: 980px) {
  .prova__feature-media image-slot { aspect-ratio: 16/11; height: auto; min-height: 0; }
}
@media (max-width: 940px) {
  .estr__photo image-slot { min-height: 420px; }
}

/* ---- FORA DA CURVA: 4 cards numerados em uma única linha ---- */
@media (min-width: 1001px) {
  .fora__grid { grid-template-columns: repeat(4, 1fr); gap: 18px; }
  .fora__title { font-size: 1.08rem; }
  .fora__text { font-size: 14px; }
}

/* ---- depoimento da Sônia: mídia vira gatilho de vídeo ---- */
.prova__feature-media.js-vid { cursor: pointer; }
.prova__feature-media.js-vid:hover .dentro__play { transform: translate(-50%,-50%) scale(1.08); }

/* ---- GRÁFICO COMPARATIVO: linhas Amaran (verde) × CDI (azul claro) ---- */
.estr__chart .line--amaran { stroke: #6ff09a; }
.estr__chart .line--cdi { stroke: #8fb4ff; stroke-width: 2; }
.estr__chart .dot--amaran { fill: #6ff09a; }
.estr__chart .dot--cdi { fill: #8fb4ff; }
.estr__legend { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 10px; }
.estr__legend-item { display: inline-flex; align-items: center; gap: 8px;
  font-size: 12.5px; font-weight: var(--w-medium); color: rgba(247,255,255,.78); }
.estr__legend-dot { width: 11px; height: 11px; border-radius: 3px; display: inline-block; flex: none; }
.estr__legend-item.is-amaran .estr__legend-dot { background: #6ff09a; }
.estr__legend-item.is-cdi .estr__legend-dot { background: #8fb4ff; }
.estr__proj-note { margin: 12px 0 0; font-size: 11.5px; line-height: 1.45; color: rgba(247,255,255,.55); }

/* ---- LISTA DE LAZER (toggle dos 21 espaços) ---- */
.dentro__lazer-toggle { text-align: center; margin: 22px 0 0; }
.lazer-btn { display: inline-flex; align-items: center; gap: 9px; font-family: var(--font);
  font-size: 13px; font-weight: var(--w-bold); letter-spacing: .02em; color: var(--imperial-blue);
  background: var(--branco-gelo); border: 1px solid var(--border); border-radius: var(--r-pill);
  padding: 10px 18px; cursor: pointer; transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.lazer-btn:hover { background: #eef3fb; border-color: var(--imperial-300); }
.lazer-btn svg.lucide { width: 16px; height: 16px; }
.lazer-btn .lazer-chev { transition: transform var(--dur) var(--ease); }
.lazer-btn.is-open .lazer-chev { transform: rotate(180deg); }
.dentro__lazer { list-style: none; margin: 18px auto 0; max-width: 940px; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.dentro__lazer li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--azul-escuro);
  background: var(--branco-gelo); border: 1px solid var(--border); border-radius: var(--r-md); padding: 11px 15px; }
.dentro__lazer li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--imperial-blue); flex: none; }
@media (max-width: 720px) { .dentro__lazer { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px) { .dentro__lazer { grid-template-columns: 1fr; } }

/* ---- SELETOR DE PLANTAS (Tipo 1 / Tipo 2) ---- */
.planta-tabs { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 0 0 20px; }
.planta-tab { font-family: var(--font); font-size: 13px; font-weight: var(--w-bold); letter-spacing: .01em;
  color: var(--fg-muted); background: var(--branco-gelo); border: 1px solid var(--border);
  border-radius: var(--r-pill); padding: 11px 20px; cursor: pointer;
  transition: color var(--dur) var(--ease), background var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.planta-tab:hover { color: var(--imperial-blue); }
.planta-tab.is-active { background: var(--imperial-blue); color: #fff; border-color: var(--imperial-blue); }
.planta-view { display: none; }
.planta-view.is-active { display: block; }

/* ---- PROVA SOCIAL — MODELO B: a conta da operação ---- */
.prova__deal { margin: 16px 0 0; border: 1px solid rgba(143,180,255,.18); border-radius: var(--r-lg); overflow: hidden; }
.deal-row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 13px 18px; }
.deal-row + .deal-row { border-top: 1px solid rgba(255,255,255,.08); }
.deal-lbl { font-size: 14px; color: rgba(247,255,255,.72); line-height: 1.4; }
.deal-val { font-size: 1.02rem; font-weight: var(--w-bold); color: #fff; letter-spacing: -.01em; white-space: nowrap; }
.deal-note { margin: 0; padding: 11px 18px; font-size: 12px; line-height: 1.5; color: rgba(247,255,255,.5);
  background: rgba(255,255,255,.025); border-top: 1px solid rgba(255,255,255,.08); }
.deal-row--total { background: rgba(111,240,154,.08); border-top: 1px solid rgba(111,240,154,.18);
  padding-top: 15px; padding-bottom: 15px; }
.deal-row--total .deal-lbl { color: #fff; font-weight: var(--w-bold); }
.deal-val.pos { color: #6ff09a; font-size: 1.22rem; font-weight: var(--w-black); }

/* ---- depoimento da Sônia: escala reduzida para ficar mais elegante ---- */
.prova__feature { margin-top: 44px; grid-template-columns: 300px 1fr; }
.prova__feature-body { padding: 30px 36px; gap: 22px; }
.prova__feature-top { gap: 16px; }
.prova__stat-val { font-size: clamp(1.9rem, 2.8vw, 2.5rem); }
.prova__stat-lbl { font-size: .95rem; }
.prova__feature-quote { font-size: 1.02rem; padding-left: 20px; line-height: 1.45; }
.prova__who-name { font-size: 1.02rem; }
.prova__units-inline { padding-top: 20px; }
.prova__deal { margin-top: 14px; }
.deal-row { padding: 11px 16px; }
.deal-lbl { font-size: 13.5px; }
.deal-val { font-size: .98rem; }
.deal-val.pos { font-size: 1.1rem; }
.deal-note { padding: 10px 16px; }
@media (max-width: 980px) {
  .prova__feature { grid-template-columns: 1fr; }
}