@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

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

html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

body {
    font-family: var(--font-body);
    font-size: var(--font-size-base);
    line-height: 1.6;
    color: var(--color-text);
    background-color: var(--color-white);
    overflow-x: hidden;
}

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

a { color: var(--color-blue); text-decoration: none; transition: color var(--transition-fast); }
a:hover { color: var(--color-blue-light); }

h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 700; line-height: 1.2; color: var(--color-black); }
h1 { font-size: var(--font-size-5xl); }
h2 { font-size: var(--font-size-4xl); margin-bottom: var(--space-lg); }
h3 { font-size: var(--font-size-2xl); margin-bottom: var(--space-md); }
h4 { font-size: var(--font-size-xl); }
p { margin-bottom: var(--space-sm); }

.btn {
    display: inline-flex; align-items: center; gap: 0.5rem;
    padding: 0.75rem 1.75rem; font-size: var(--font-size-base); font-weight: 600;
    border-radius: var(--border-radius); border: none; cursor: pointer;
    transition: all var(--transition-normal); text-decoration: none;
}
.btn-primary { background: var(--color-blue); color: var(--color-white); }
.btn-primary:hover { background: var(--color-blue-light); color: var(--color-white); transform: translateY(-2px); box-shadow: var(--shadow-md); }
.btn-outline { background: transparent; color: var(--color-blue); border: 2px solid var(--color-blue); }
.btn-outline:hover { background: var(--color-blue); color: var(--color-white); }

.badge { display: inline-block; padding: 0.25rem 0.75rem; font-size: var(--font-size-sm); font-weight: 600; border-radius: 100px; text-transform: uppercase; letter-spacing: 0.5px; }
.badge-event { background: #e3f2fd; color: #1565c0; }
.badge-news { background: #e8f5e9; color: #2e7d32; }
.badge-report { background: #fff3e0; color: #e65100; }

@media (max-width: 768px) {
    h1 { font-size: var(--font-size-3xl); }
    h2 { font-size: var(--font-size-2xl); }
    h3 { font-size: var(--font-size-xl); }
}