/* RESET GLOBAL */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    line-height: 1.5;
}

:root {
    --primary: #2563eb;
    --primary-light: #4da6ff;
    --primary-dark: #1d4ed8;

    --violet: #7c3aed;
    --violet-dark: #5b21b6;
    --violet-light: #a78bfa;

    --text: #0f172a;
    --text-light: #475569;
    --text-muted: #64748b;

    --border: #e2e8f0;
    --background: #ffffff;
    --background-soft: #f8fbff;

    --gradient-dentopedia:
        radial-gradient(circle at top right, rgba(124,58,237,.14), transparent 42%),
        radial-gradient(circle at bottom left, rgba(56,189,248,.12), transparent 38%),
        linear-gradient(135deg, #ffffff, #f8fbff);

    --page-padding: clamp(20px, 6vw, 80px);
    --content-width: 1100px;

    --font-family: 'Poppins', sans-serif;
    --base-font-size: 16px;
    --line-height: 1.5;

    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 24px;
    --radius-xl: 34px;

    --transition-fast: 0.2s ease;
    --transition-medium: 0.3s ease;

    --header-height: 60px;
}

@media (min-width: 1024px) {
    :root {
        --header-height: 70px;
    }
}

body {
    font-family: var(--font-family, 'Poppins', sans-serif);
    font-size: var(--base-font-size, 16px);
    line-height: var(--line-height, 1.5);
    color: var(--text, #111);
    background: var(--background, #fff);
    overflow-x: hidden;
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
    color: inherit;
    transition: var(--transition-fast, 0.2s) ease;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

main,
.container {
    padding-left: var(--page-padding);
    padding-right: var(--page-padding);
}

main {
    max-width: var(--content-width);
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: 0;
    width: 100%;
}