@import url("simpledot-b2b.css?v=20260412-0001");

:root {
  --accent: #0b7ea8;
  --accent-dark: #085f82;
  --accent-soft: #eff8fd;
  --accent-deep: #09384d;
  --surface: #f4f8fb;
  --surface-deep: #eaf2f7;
}

body {
  background:
    radial-gradient(circle at top left, rgba(11, 126, 168, 0.11), transparent 28%),
    radial-gradient(circle at right 20%, rgba(24, 33, 50, 0.06), transparent 24%),
    var(--surface);
}

.hero {
  background:
    radial-gradient(circle at 80% 18%, rgba(11, 126, 168, 0.18), transparent 28%),
    radial-gradient(circle at 10% 10%, rgba(8, 95, 130, 0.12), transparent 26%),
    linear-gradient(135deg, #ffffff 0%, #f6fbfe 52%, #ebf4f9 100%);
}

.hero-points span {
  background: rgba(11, 126, 168, 0.1);
  border-color: rgba(11, 126, 168, 0.16);
}

.problem-section,
.whatsapp-section,
.cta-section {
  background:
    linear-gradient(180deg, rgba(11, 126, 168, 0.05), rgba(255, 255, 255, 0)),
    transparent;
}

.wa-thread--accent {
  background: linear-gradient(135deg, #eef8fc, #f8fcfe);
}

.cta-card {
  background:
    linear-gradient(135deg, rgba(11, 126, 168, 0.12), rgba(11, 126, 168, 0.04)),
    #fff;
}