html {
    scroll-behavior: smooth
}

body {
    overflow-x: hidden
}

.graph-grid {
    background-image: linear-gradient(rgba(34, 199, 184, .11) 1px, transparent 1px), linear-gradient(90deg, rgba(34, 199, 184, .11) 1px, transparent 1px);
    background-size: 28px 28px
}

.dot-field {
    background-image: radial-gradient(rgba(34, 199, 184, .22) 1.5px, transparent 1.5px);
    background-size: 22px 22px
}

.soft-stripes {
    background-image: repeating-linear-gradient(135deg, transparent 0, transparent 18px, rgba(34, 199, 184, .07) 18px, rgba(34, 199, 184, .07) 20px)
}

.reveal {
    animation: rise .65s ease both
}

@media (max-width: 768px) {

    h1,
    h2 {
        font-size: 28px !important;
    }
}

@keyframes rise {
    from {
        opacity: 0;
        transform: translateY(14px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

summary::-webkit-details-marker {
    display: none
}