/* Custom visual helpers for the EXEO KEYCODE landing page */
.bg-dots {
    background-image: radial-gradient(
        rgba(255, 255, 255, 0.15) 1px,
        transparent 1px
    );
    background-size: 20px 20px;
}

.btn-route {
    background: #ffffff;
    border: 1px solid #dbeafe;
    color: #0b4db8;
    box-shadow: 0 12px 30px rgba(0, 29, 94, 0.18);
}

.btn-route:hover {
    background: #eff6ff;
    border-color: #bfd7ff;
    color: #093b90;
}

.section-shell {
    position: relative;
    overflow: hidden;
}

.section-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.75;
}

.section-hero {
    background: linear-gradient(135deg, #0047b3, #003a97);
}

.section-attributes {
    background: linear-gradient(180deg, #f8fbff 0%, #f2f7ff 100%);
}

.section-services {
    background:
        radial-gradient(circle at top left, rgba(0, 82, 204, 0.08), transparent 30%),
        linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.section-highlight {
    background:
        radial-gradient(circle at right center, rgba(0, 82, 204, 0.08), transparent 35%),
        linear-gradient(180deg, #f7fbff 0%, #edf3ff 100%);
}

.section-why {
    background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
}

.section-steps {
    background:
        radial-gradient(circle at top center, rgba(0, 82, 204, 0.06), transparent 40%),
        linear-gradient(180deg, #f7faff 0%, #eef4ff 100%);
}

.section-testimonials {
    background:
        radial-gradient(circle at top right, rgba(0, 82, 204, 0.06), transparent 32%),
        linear-gradient(180deg, #f6faff 0%, #edf4ff 100%);
}

.section-contact {
    background:
        radial-gradient(circle at left center, rgba(0, 82, 204, 0.08), transparent 32%),
        linear-gradient(180deg, #f8fbff 0%, #eef4ff 100%);
}