.crypto-grid,
.crypto-grid-2,
.crypto-grid-3,
.crypto-grid-4,
.crypto-row {
    gap: 22px;
}

.crypto-grid,
.crypto-grid-2,
.crypto-grid-3,
.crypto-grid-4 {
    display: grid;
}

.crypto-grid {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.crypto-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.crypto-grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.crypto-grid-4 {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.crypto-row {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}

.crypto-row > .crypto-block {
    flex: 1 1 280px;
}

.crypto-block {
    min-width: 0;
    padding: 12px;
    border-radius: 24px;
    border: 1px solid rgba(42, 157, 143, 0.12);
    background: rgba(255, 255, 255, 0.3);
}

body[data-theme="dark"] .crypto-block {
    background: rgba(26, 83, 92, 0.26);
}

.crypto-hero {
    padding: 16px;
    border-radius: 28px;
}

.crypto-small {
    padding: 8px;
    border-radius: 22px;
}

.crypto-circle {
    border-radius: 32px;
}

.crypto-highlight {
    background: rgba(42, 157, 143, 0.08);
    border-color: rgba(42, 157, 143, 0.3);
}

.crypto-layout-gap {
    margin-top: 24px;
}

.crypto-layout-title {
    margin: 34px 0 0;
    font-family: "Montserrat", sans-serif;
    font-size: 1.45rem;
    color: var(--text-primary);
}

.crypto-layout-title:first-of-type {
    margin-top: 0;
}

.crypto-section {
    margin-top: 24px;
}

@media (max-width: 1024px) {
    .crypto-grid-4 {
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    }

    .crypto-grid-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .crypto-grid-2,
    .crypto-grid-3,
    .crypto-grid-4 {
        grid-template-columns: 1fr;
    }

    .crypto-row {
        gap: 18px;
    }

    .crypto-block,
    .crypto-hero,
    .crypto-small {
        padding: 12px;
    }
}
