:root { scroll-behavior: smooth; }
        body { background-color: #FFFFFF; color: #111111; overflow-x: hidden; }
        .page-node { display: none; }
        .page-node.active { display: block; animation: fadeIn 1s ease; }
        @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

        .magazine-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 2rem; }
        .drop-cap::first-letter {
            float: left; font-size: 5rem; line-height: 0.7; padding: 0.5rem 0.75rem 0 0;
            font-family: 'Playfair Display', serif; color: #4DB6AC; font-weight: 900;
        }
        .bg-pattern {
            background-image: radial-gradient(#4DB6AC 0.5px, transparent 0.5px);
            background-size: 24px 24px;
        }
        .hover-reveal { overflow: hidden; position: relative; }
        .hover-reveal img { transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1); }
        .hover-reveal:hover img { transform: scale(1.08); }
        
        /* Custom Scrollbar */
        ::-webkit-scrollbar { width: 5px; }
        ::-webkit-scrollbar-track { background: #f1f1f1; }
        ::-webkit-scrollbar-thumb { background: #4DB6AC; border-radius: 10px; }
    @keyframes fadeInOut {
  0%, 100% { opacity: 0; transform: translate(-50%, 10px); }
  10%, 90% { opacity: 1; transform: translate(-50%, 0); }
}
.animate-fadeInOut {
  animation: fadeInOut 3s ease forwards;
}