
        :root {
            --primary: #91C75E;
            --secondary: #7A588D;
            --background: #F5F5F5;
            --dark: #1A202C;
            --surface: #FFFFFF;
        }

        body {
            background-color: var(--background);
            color: var(--dark);
            overflow-x: hidden;
            scroll-behavior: smooth;
            font-family: 'Inter', sans-serif;
            -webkit-font-smoothing: antialiased;
        }

        ::selection {
            background-color: var(--secondary);
            color: white;
        }

        /* Typography */
        .font-doodle { font-family: 'Caveat', cursive; }
        
        .text-primary-custom { color: var(--primary) !important; }
        .text-secondary-custom { color: var(--secondary) !important; }
        .text-dark-custom { color: var(--dark) !important; }
        .text-gray-600 { color: #4B5563 !important; }

        .text-xs { font-size: 0.75rem; line-height: 1rem; }
        .text-2xl { font-size: 1.5rem; line-height: 2rem; }
        .text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
        .text-5xl { font-size: 3rem; line-height: 1; }
        .text-6xl { font-size: 3.75rem; line-height: 1; }
        
        .tracking-wider { letter-spacing: 0.05em; }

        @media (min-width: 768px) {
            .md-text-5xl { font-size: 3rem; line-height: 1; }
            .md-text-6xl { font-size: 4rem; line-height: 1.1; }
        }

        /* Layout & Colors */
        .bg-surface { background-color: var(--surface) !important; }
        .bg-background-custom { background-color: var(--background) !important; }
        .bg-primary-custom { background-color: var(--primary) !important; }
        .bg-secondary-custom { background-color: var(--secondary) !important; }
        
        .opacity-20 { opacity: 0.2; }
        
        /* Spacing (Tailwind Equivalents) */
        .pt-28 { padding-top: 7rem; }
        .pb-20 { padding-bottom: 5rem; }
        .mt-24 { margin-top: 6rem; }
        .mb-10 { margin-bottom: 2.5rem; }
        .row-gap-8 { --bs-gutter-x: 2rem; --bs-gutter-y: 2rem; }

        /* Organic, hand-drawn looking borders */
        .doodle-border {
            border: 3px solid var(--dark);
            /*border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;*/
        }
        
        /*.doodle-border-alt {
            border: 3px solid var(--dark);
            border-radius: 15px 225px 15px 255px/255px 15px 225px 15px;
        }

        .doodle-border-thin {
            border: 2px solid var(--dark);
            border-radius: 255px 25px 225px 25px/25px 225px 25px 255px;
        }*/

        /* Shadows */
        /*.shadow-doodle { box-shadow: 6px 6px 0px 0px var(--dark); }*/
        .shadow-doodle-primary { box-shadow: 6px 6px 0px 0px var(--primary); }
        .hover-shadow-doodle-primary:hover { box-shadow: 6px 6px 0px 0px var(--primary); }

        /* Interactions & Transitions */
        .transition-all-300 { transition: all 0.3s ease; }
        .transition-transform-500 { transition: transform 0.5s ease; }
        .transition-colors-300 { transition: color 0.3s ease; }

        .hover-translate-y-minus-2:hover { transform: translateY(-0.5rem); }

        .group:hover .group-hover-scale-110 { transform: scale(1.1); }
        .group:hover .group-hover-text-secondary { color: var(--secondary) !important; }

        .line-clamp-2 {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        /* Animations */
        @keyframes float {
            0%, 100% { transform: translateY(0) rotate(0deg); }
            50% { transform: translateY(-10px) rotate(2deg); }
        }
        @keyframes float-alt {
            0%, 100% { transform: translateY(0) rotate(0deg); }
            50% { transform: translateY(10px) rotate(-2deg); }
        }
        @keyframes wiggle {
            0%, 100% { transform: rotate(-3deg); }
            50% { transform: rotate(3deg); }
        }
        @keyframes spin-slow {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
        @keyframes draw {
            to { stroke-dashoffset: 0; }
        }

        .animate-float { animation: float 6s ease-in-out infinite; }
        .animate-float-alt { animation: float-alt 7s ease-in-out infinite; }
        .animate-wiggle-hover:hover { animation: wiggle 0.5s ease-in-out infinite; }
        .animate-spin-slow { animation: spin-slow 15s linear infinite; }

        .path-draw {
            stroke-dasharray: 1000;
            stroke-dashoffset: 1000;
            animation: draw 3s ease-out forwards;
        }

        /* Custom Scrollbar */
        ::-webkit-scrollbar { width: 10px; }
        ::-webkit-scrollbar-track { background: var(--background); border-left: 2px solid var(--dark); }
        ::-webkit-scrollbar-thumb { background: var(--primary); border: 2px solid var(--dark); border-radius: 10px; }
        ::-webkit-scrollbar-thumb:hover { background: var(--secondary); }

        /* Blog Content Typography Styles */
        .prose p {
            margin-bottom: 1.5rem;
            line-height: 1.8;
            font-size: 1.125rem;
            color: #374151;
        }
        .prose h2 {
            font-family: 'Caveat', cursive;
            font-size: 2.5rem;
            color: var(--secondary);
            margin-top: 3rem;
            margin-bottom: 1rem;
            line-height: 1.2;
        }
        .first-letter-huge::first-letter {
            font-family: 'Caveat', cursive;
            font-size: 4rem;
            font-weight: bold;
            color: var(--primary);
            float: left;
            line-height: 1;
            padding-right: 0.5rem;
            margin-top: -0.25rem;
        }
