/* Visa App Landing — Custom Styles */

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Roboto', sans-serif;
}

/* CTA Button */
.btn-accent {
  display: inline-block;
  background-color: #C8102E;
  color: #ffffff;
  font-weight: 700;
  padding: 1rem 2rem;
  border-radius: 0.5rem;
  text-decoration: none;
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.btn-accent:hover {
  background-color: #A50D25;
}

.btn-accent:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(200, 16, 46, 0.5);
}

/* Trust Card hover effect */
.trust-card {
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.trust-card:hover {
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.3), 0 10px 10px -5px rgba(0, 0, 0, 0.2);
  transform: translateY(-2px);
}

/* Phone Mockup fallback */
.phone-mockup-fallback {
  display: none;
}

/* Benefit item checkmark spacing */
.benefit-item svg {
  flex-shrink: 0;
}

/* Security section "no access" list */
#security ul li {
  list-style: none;
}

/* Responsive phone mockup */
@media (max-width: 767px) {
  .phone-mockup-fallback {
    min-height: 200px;
  }
}