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

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: var(--leading-normal);
    color: var(--gray-800);
    background: #fff;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; content-visibility: auto; }
.img-container { position: relative; aspect-ratio: 16/9; overflow: hidden; background: var(--gray-100); border-radius: var(--radius-xl); }
.img-container img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.img-container:hover img { transform: scale(1.1); }

a { text-decoration: none; color: inherit; transition: color var(--transition-fast); }
ul, ol { list-style: none; }
button, input, textarea, select { font-family: inherit; font-size: inherit; outline: none; border: none; background: none; }
button { cursor: pointer; }

h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 700; line-height: var(--leading-tight); color: var(--gray-900); }
h1 { font-size: var(--text-5xl); }
h2 { font-size: var(--text-4xl); }
h3 { font-size: var(--text-3xl); }
h4 { font-size: var(--text-2xl); }
p { margin-bottom: var(--space-4); color: var(--gray-600); }

.text-gradient { background: var(--gradient-text); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }

.container { width: 100%; max-width: var(--container-xl); margin: 0 auto; padding: 0 var(--space-6); }
.section { padding: var(--space-24) 0; }
.section-dark { background: var(--gradient-dark); color: #fff; position: relative; overflow: hidden; }
.section-dark h2, .section-dark h3 { color: #fff; }
.section-dark p { color: var(--gray-300); }
.section-gray { background: var(--gray-50); }

.section-header { text-align: center; max-width: 700px; margin: 0 auto var(--space-12); }
.section-header .badge {
    display: inline-flex; align-items: center; gap: var(--space-2);
    padding: var(--space-2) var(--space-4); background: var(--primary-50);
    color: var(--primary-600); font-size: var(--text-sm); font-weight: 600;
    border-radius: var(--radius-full); margin-bottom: var(--space-4); border: 1px solid var(--primary-100);
}
.section-header h2 { margin-bottom: var(--space-4); }
.section-header p { font-size: var(--text-lg); color: var(--gray-500); }

.grid { display: grid; gap: var(--space-6); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.flex { display: flex; align-items: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.flex-center { display: flex; align-items: center; justify-content: center; }

@keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

.animate-in { opacity: 0; transform: translateY(30px); transition: opacity .6s ease, transform .6s ease; }
.animate-in.visible { opacity: 1; transform: translateY(0); }

::selection { background: var(--primary-200); color: var(--primary-900); }
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--gray-100); }
::-webkit-scrollbar-thumb { background: var(--gray-300); border-radius: var(--radius-full); }

@media (max-width: 1024px) {
    h1 { font-size: var(--text-4xl); } h2 { font-size: var(--text-3xl); }
    .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    html { font-size: 15px; } .section { padding: var(--space-12) 0; }
    .container { padding: 0 var(--space-4); }
    .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
}
