[data-md-color-scheme="exosphere-dark"] {
    /* Header */
    --md-primary-fg-color: #08236b;
    --md-primary-bg-color: #FFFFFF;

    /* Main content */
    --md-default-fg-color: #66d1b5;
    --md-default-fg-color--light: #8bdfff;
    --md-default-fg-color--lighter: #daf5ff;
    --md-default-fg-color--lightest: #9E9E9E;
    
    --md-default-bg-color: #0f172b;
    --md-default-bg-color--light: #05184a;
    --md-default-bg-color--lighter: #08236b;
    --md-default-bg-color--lightest: #0c2d8b;
    --md-typeset-color: #ffffff;

    /* Accent color for links and headings */
    --md-accent-fg-color: #66d1b5;
    --md-typeset-a-color: #8bdfff;

    --md-code-fg-color: #daf5ff;
    --md-code-bg-color: #263048;


    --md-code-hl-color: #66d1b5;
    --md-code-hl-color--light: #0c246994;

    --md-admonition-bg-color: #05184a;
    --md-admonition-fg-color: #ffffff;

    --md-code-hl-number-color: hsla(0, 67%, 50%, 1);
    --md-code-hl-special-color: hsla(340, 83%, 47%, 1);
    --md-code-hl-function-color: #e4587d;
    --md-code-hl-constant-color: #8bdfff;
    --md-code-hl-keyword-color: #66d1b5;
    --md-code-hl-string-color: #daf5ff;
    --md-code-hl-name-color: #ffffff;
    --md-code-hl-operator-color: var(--md-default-fg-color--light);
    --md-code-hl-punctuation-color: var(--md-default-fg-color--light);
    --md-code-hl-comment-color: #9E9E9E;
    --md-code-hl-generic-color: var(--md-default-fg-color--light);
    --md-code-hl-variable-color: var(--md-default-fg-color--light);

    /* Footer */
    --md-footer-fg-color: #FFFFFF;
    --md-footer-bg-color: #121212;
}

[data-md-color-scheme="exosphere-light"] {
    /* Header */
    --md-primary-fg-color: #091129;
    --md-primary-bg-color: #daf5ff;

    /* Main content */
    --md-default-fg-color: #091129;
    --md-default-fg-color--light: #24378f;
    --md-default-fg-color--lighter: #24378f;
    --md-default-fg-color--lightest: #9E9E9E;

    --md-default-bg-color--light: #daf5ff;
    --md-default-bg-color--lighter: #daf5ff;
    --md-default-bg-color--lightest: #daf5ff;
    --md-default-bg-color: #f7fdff;

    --md-typeset-color: #1a1a1a;
    --md-typeset-a-color: #e4587d;

    /* Accent color for links and headings */
    --md-accent-fg-color: #e4587d;

    --md-code-fg-color: #031035;
    --md-code-bg-color: #daf5ff;

    --md-code-hl-color: #031035;
    --md-code-hl-color--light: #8bffaa4f;


    --md-code-hl-number-color: hsla(0, 67%, 50%, 1);
    --md-code-hl-special-color: hsla(340, 83%, 47%, 1);
    --md-code-hl-function-color: #e4587d;
    --md-code-hl-constant-color: #061d5f;
    --md-code-hl-keyword-color: #e4587d;
    --md-code-hl-string-color: #1a1a1a;
    --md-code-hl-name-color: #241c3b;
    --md-code-hl-operator-color: var(--md-default-fg-color--light);
    --md-code-hl-punctuation-color: var(--md-default-fg-color--light);
    --md-code-hl-comment-color: #6f6f6f;
    --md-code-hl-generic-color: var(--md-default-fg-color--light);
    --md-code-hl-variable-color: var(--md-default-fg-color--light);

    /* Footer */
    --md-footer-fg-color: #FFFFFF;
    --md-footer-bg-color: #031035;

}

/* Decrease margins for main content */
.md-content__inner {
    margin: 0rem 0rem !important;
}

.md-typeset {
    margin: 0.5rem 0 !important;
}

.md-content {
    margin: 0rem 0 !important;
}

.md-grid{
    max-width: 100% !important;
}

/* Feature Grid Styles */
.feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    margin: 2rem 0;
}

.feature-card {
    background: var(--md-default-bg-color);
    border-radius: 8px;
    padding: 1.5rem;
    border: 1px solid var(--md-default-fg-color--lighter);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.feature-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    border-color: var(--md-accent-fg-color);
}

.feature-card h3 {
    margin: 0 0 0.5rem 0;
}

.feature-card h3 a {
    color: var(--md-typeset-a-color);
    text-decoration: none;
    transition: color 0.2s ease;
}

.feature-card h3 a:hover {
    color: var(--md-accent-fg-color);
}

.feature-card p {
    margin: 0;
    color: var(--md-typeset-color);
    font-size: 0.9rem;
    line-height: 1.5;
    opacity: 0.85;
}

[data-md-color-scheme="exosphere-dark"] .feature-card {
    background: var(--md-default-bg-color);
    border-color: rgba(102, 209, 181, 0.2);
}

[data-md-color-scheme="exosphere-dark"] .feature-card:hover {
    border-color: var(--md-accent-fg-color);
}

[data-md-color-scheme="exosphere-light"] .feature-card {
    background: #ffffff;
    border-color: rgba(9, 17, 41, 0.1);
}

[data-md-color-scheme="exosphere-light"] .feature-card:hover {
    border-color: var(--md-accent-fg-color);
}