/* Página de aluguel (loja de Campina). Usa a base de home.css (inclusive o ticket e a etiqueta) e acrescenta os blocos próprios. */
.rental-note { display: inline-flex; align-items: center; gap: 8px; margin-top: 28px; color: var(--muted); font-size: 14px; font-weight: 700; }
.rental-note svg { width: 16px; height: 16px; color: var(--lime); }

/* Os passos não têm a estrada da home, então a margem fica na lista. */
.rental-steps { margin-top: 56px; }

/* Modelos para alugar (só aparecem com pages.rental.models.ids). */
.rental-models { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; margin-top: 48px; }
.rental-model { display: flex; flex-direction: column; align-items: flex-start; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--card); }
.rental-model .stage { width: 100%; }
.rental-model__meta { margin-top: 8px; color: var(--lime); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.rental-model h3 { margin-top: 6px; font-family: var(--font-display); font-size: 24px; font-weight: 800; letter-spacing: -.04em; }
.rental-model p { margin: 6px 0 18px; color: var(--muted); font-size: 14px; }
.rental-model .btn { margin-top: auto; }

/* Valores: o ticket (em home.css) e, se houver, a lista do que levar. */
.rental-values { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .6fr); gap: 32px; align-items: end; }
.rental-values--single { grid-template-columns: minmax(0, 1fr); }
.rental-values .ticket { margin-top: 44px; }
.rental-req { padding: 28px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--card); }
.rental-req ul { display: grid; gap: 12px; margin: 18px 0 0; padding: 0; list-style: none; }
.rental-req li { display: flex; gap: 10px; font-size: 15px; font-weight: 600; }
.rental-req li svg { color: var(--lime); }

/* Onde fica */
.rental-location { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.store--rental-page { padding: 32px; }
.store--rental-page .store__more { display: inline-flex; }

@media (max-width: 860px) {
  .rental-values, .rental-location { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 600px) {
  .rental-steps { margin-top: 40px; }
  .rental-values .ticket { margin-top: 32px; }
  .store--rental-page { padding: 24px; }
}