/* ============================================
   Component: ReclameAQUI
   Extracted from design-system.css
   ============================================ */
.ra-section { padding: var(--dt-space-16) 0; }
.ra-wrap {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--dt-space-14);
  align-items: center;
  max-width: 960px;
  margin: 0 auto;
}
.ra-content { min-width: 0; }
.ra-bullets {
  list-style: none;
  margin: 0 0 var(--dt-space-8);
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--dt-space-3);
}
.ra-bullets li {
  display: flex;
  align-items: center;
  gap: var(--dt-space-3);
  font-size: var(--dt-text-base);
  color: var(--dt-text-muted);
}
.ra-btn { display: inline-flex; align-items: center; gap: var(--dt-space-2); }
.ra-visual { display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ra-qr-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--dt-space-3);
  background: var(--dt-surface);
  border: 1px solid var(--dt-border);
  border-radius: var(--dt-radius-xl);
  padding: var(--dt-space-6);
  text-align: center;
  transition: border-color 0.3s;
}
.ra-qr-card:hover { border-color: var(--dt-orange); }
.ra-qr-label { font-size: var(--dt-text-sm); font-weight: var(--dt-font-semibold); color: var(--dt-text-muted); text-transform: uppercase; letter-spacing: 0.05em; margin: 0; }
.ra-qr-img { width: 220px; height: auto; border-radius: var(--dt-radius-lg); display: block; object-fit: contain; }
.ra-qr-sub { font-size: var(--dt-text-xs); color: var(--dt-text-dim); margin: 0; }
@media (max-width: 768px) {
  .ra-wrap { grid-template-columns: 1fr; gap: var(--dt-space-10); }
  .ra-visual { order: -1; }
  .ra-content .section-title,
  .ra-content .section-subtitle { text-align: center !important; }
  .ra-bullets li { justify-content: flex-start; }
  .ra-btn { width: 100%; justify-content: center; }
}