:root {
    --mp-primary: #00afe2;
    --mp-primary-rgb: 0, 175, 226; /* RGB values for --mp-primary */
    --mp-primary-light: #38c9ff;
    --mp-accent: #f6b400;
    --mp-dark: #0f172a;
    --mp-light: #f9fafb;
    --mp-muted: #6b7280;
    --mp-border-subtle: rgba(148, 163, 184, 0.4);
    --mp-radius-full: 999px;
    --mp-radius-lg: 18px;
    --mp-radius-xl: 24px;
    --mp-z-header: 1000;
    --mp-page-bg: #f3f4f6;
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: var(--mp-page-bg);
    color: var(--mp-dark);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

a {
    color: var(--mp-primary);
}

a:hover {
    color: var(--mp-primary-light);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

main {
    min-height: 60vh;
}

.mp-container {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding-inline: 1rem;
}