/* Narrativa visual centrada en confianza verificable */
.hero {
  background:
    radial-gradient(circle at 76% 24%, #5be0b529, transparent 31%),
    radial-gradient(circle at 18% 82%, #5572ff12, transparent 34%),
    linear-gradient(135deg, #fbfdff, #f0f5ff);
}

.hero .tag { color: #236f63; }
.copy h1 { max-width: 700px; letter-spacing: -3.5px; }
.copy h1 em { color: #536cff; }
.copy > p { max-width: 670px; }

.hero-assurances {
  display: flex;
  flex-wrap: wrap;
  gap: 9px !important;
  margin-top: 30px;
}

.copy .hero-assurances span {
  padding: 8px 11px;
  border: 1px solid #d7e3ee;
  border-radius: 99px;
  background: #ffffffc9;
  color: #3f566f;
  box-shadow: 0 8px 22px #1735660a;
}

.hero-security {
  border-color: #9bdcc8;
  background: #f7fffcdd;
  box-shadow: 0 12px 35px #17755713;
}

.hero-security b { color: #14644f; }

.security-rail {
  background: linear-gradient(115deg, #092442, #0a3150);
}

.security-rail > small { color: #78e6c2; }

.security-rail article {
  border-color: #8cdcc62b;
  background: linear-gradient(135deg, #ffffff12, #4ae0af08);
}

.problem { background: linear-gradient(180deg, #fff, #f9fbfe); }
.problem .tag, .product .tag { color: #276f64; }

.zero {
  background:
    radial-gradient(circle at 20% 50%, #41d8a716, transparent 34%),
    linear-gradient(135deg, #f7fbff, #edf4fb);
}

.zero blockquote {
  padding: 18px 0 18px 22px;
  border-left: 4px solid #2fc79a;
  color: #15335c;
  line-height: 1.35;
}

.zero blockquote em { color: #2d6f63; }

.authority {
  background: linear-gradient(180deg, #f7fafc, #eef5f8);
}

.authority > small { color: #287264; font-weight: 800; letter-spacing: 1.7px; }
.authority > span { display: block; max-width: 820px; margin: 8px auto 0; color: #63758b; font-size: 17px; }

.final {
  background:
    radial-gradient(circle at 18% 50%, #40d9aa26, transparent 27%),
    linear-gradient(120deg, #102c52, #173a68);
}

.final .tag { color: #73e7c0; }
.final .white { box-shadow: 0 16px 38px #06152d4d; }

.btn, .plans button, .scenario-cta {
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.btn:hover, .plans button:hover, .scenario-cta:hover { transform: translateY(-2px); }
.btn:focus-visible, a:focus-visible, button:focus-visible { outline: 3px solid #50d9ae; outline-offset: 3px; }

@media (max-width: 700px) {
  .copy h1 { letter-spacing: -2px; }
  .hero-security { align-items: flex-start; flex-direction: column; }
  .hero-security span { white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
  .btn, .plans button, .scenario-cta { transition: none; }
}