:root {
    --primary: #4ea580;
    --accent: #8ed870;
    --bg-page: #0d1410;
    --bg-hero: #16201a;
    --bg-card-base: #1a2620;
    --text-main: #e8efe5;
}

html { scroll-behavior: smooth; }
body { 
    font-family: 'Inter', sans-serif; 
    background-color: var(--bg-page); 
    color: var(--text-main); 
    margin: 0; 
    transition: background-color 0.7s ease, color 0.7s ease;
    overflow-x: hidden;
}

.font-poppins { font-family: 'Poppins', sans-serif; }

/* Aspect Ratios */
.aspect-video { aspect-ratio: 16 / 9; }
.aspect-square { aspect-ratio: 1 / 1; }
.aspect-4-3 { aspect-ratio: 4 / 3; }
.aspect-3-4 { aspect-ratio: 3 / 4; }
.aspect-4-5 { aspect-ratio: 4 / 5; }
.aspect-9-16 { aspect-ratio: 9 / 16; }

/* Scrollbar */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #888; border-radius: 10px; opacity: 0.5; }

/* Utilities */
iframe { pointer-events: none; }
.group:hover iframe { pointer-events: auto; }
.break-inside-avoid { break-inside: avoid; }

.neon-border { position: relative; border-radius: 2.5rem; overflow: hidden; }
.neon-border::before { content: ""; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: conic-gradient(transparent, var(--accent), transparent 30%); animation: rotate 4s linear infinite; z-index: 0; }
.neon-border::after { content: ""; position: absolute; inset: 3px; background: var(--bg-card-base); border-radius: 2.3rem; z-index: 1; }
.neon-content { position: relative; z-index: 2; }
@keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

@media (max-width: 640px) {
    .hero-title { font-size: 3.5rem !important; }
}