/* Market Prices – metrics typography */

.mp-price-main {
    font-size: 20px;
    font-weight: 600;
    color: var(--color-solar-yellow);
}

.mp-price-sub {
    font-size: 12px;
    color: var(--color-text-secondary);
}

.mp-timestamp {
    font-size: 11px;
    color: var(--color-matte-grey);
}

.mp-info {
    display: inline-block;
    margin-top: 8px;
    font-size: 13px;
    color: var(--color-matte-grey);
}

/* Tighter feature section spacing on this page */

.features-section {
    padding-top: 32px;
    padding-bottom: 16px;
}

    .features-section .section-title {
        margin-bottom: 24px;
    }

.features-grid {
    gap: 24px;
}

/* Market Prices page container */

.market-prices-page {
    max-width: 1400px;
    margin: 0 auto;
    padding: var(--space-32) var(--space-24) var(--space-48);
}

    /* Card hover: lift only, keep typography stable */

    .market-prices-page .feature-card {
        transition: transform var(--duration-normal) var(--ease-standard), box-shadow var(--duration-normal) var(--ease-standard), border-color var(--duration-normal) var(--ease-standard);
    }

        .market-prices-page .feature-card:hover {
            transform: translateY(-4px);
            box-shadow: var(--shadow-lg);
            border-color: var(--color-solar-yellow);
        }

    /* Base text colours inside cards */

    .market-prices-page .feature-title {
        font-size: 20px;
        font-weight: 600;
        color: var(--color-platinum-grey);
    }

    .market-prices-page .feature-description {
        font-size: 16px;
        line-height: 1.6;
        color: var(--color-matte-grey);
    }

    /* Do not change font size/weight/colour on hover */

    .market-prices-page .feature-card:hover .feature-title,
    .market-prices-page .feature-card:hover .feature-description {
        font-size: inherit;
        font-weight: inherit;
        color: inherit;
    }

    /* Keep price colouring consistent */

    .market-prices-page .mp-price-main {
        font-size: 20px;
        font-weight: 600;
        color: var(--color-solar-yellow);
    }

    .market-prices-page .mp-price-sub,
    .market-prices-page .mp-timestamp,
    .market-prices-page .mp-info {
        font-size: 13px;
        color: var(--color-matte-grey);
    }