:root{--chalkboard-bg:#1a2f24;--chalk-white:#f4f6f0;--chalk-dust:#f4f6f026;--accent-cyan:#72e0ff;--accent-magenta:#ff85ec;--accent-yellow:#ffe975;--black:#111;--font-main:"Inter", sans-serif;--font-chalk:"Shadows Into Light", cursive;--font-chalk-secondary:"Shadows Into Light", cursive;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:32px;--spacing-xl:64px}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--chalkboard-bg);color:var(--chalk-white);font-family:var(--font-main);background-image:radial-gradient(circle,#ffffff08 0%,#0000 80%),url(https://www.transparenttextures.com/patterns/dark-matter.png);flex-direction:column;min-height:100vh;line-height:1.6;display:flex}h1,h2,h3,h4{font-family:var(--font-chalk);letter-spacing:1px;text-shadow:2px 2px 4px #0006;text-transform:uppercase}a{color:var(--chalk-white);text-decoration:none;transition:all .3s}ul{list-style:none}.container{max-width:1200px;padding:0 var(--spacing-lg);margin:0 auto}.section-spacing{padding:var(--spacing-xl) 0}.text-center{text-align:center}.text-cyan{color:var(--accent-cyan)}.text-magenta{color:var(--accent-magenta)}.text-yellow{color:var(--accent-yellow)}.navbar{padding:var(--spacing-md) 0;border-bottom:3px dashed var(--chalk-dust);margin-bottom:var(--spacing-lg);justify-content:space-between;align-items:center;display:flex}.nav-brand{align-items:center;gap:var(--spacing-md);display:flex}.nav-logo{filter:drop-shadow(2px 2px 4px #0000004d);width:auto;max-height:60px}.nav-title{font-family:var(--font-chalk);color:var(--accent-yellow);font-size:2rem}.nav-links{gap:var(--spacing-lg);display:flex}.nav-links a{font-family:var(--font-chalk);font-size:1.3rem;position:relative}.nav-links a:after{content:"";background-color:var(--accent-yellow);transform-origin:100% 100%;width:100%;height:2px;transition:transform .25s ease-out;position:absolute;bottom:0;left:0;transform:scaleX(0)}.nav-links a:hover:after{transform-origin:0 100%;transform:scaleX(1)}.nav-links a:hover{color:var(--accent-yellow)}.nav-dropdown{display:inline-block;position:relative}.nav-dropdown-content{background-color:var(--chalkboard-bg);border:2px dashed var(--chalk-dust);z-index:10;min-width:160px;padding:var(--spacing-sm) 0;border-radius:8px;display:none;position:absolute;top:100%;left:50%;transform:translate(-50%);box-shadow:0 8px 16px #00000080}.nav-dropdown:hover .nav-dropdown-content{flex-direction:column;display:flex}.nav-dropdown-content a{text-align:center;margin:0;padding:12px 16px}.nav-dropdown-content a:after{display:none}.nav-dropdown-content a:hover{background-color:#ffffff0d}.chalk-button{border:3px solid var(--chalk-white);color:var(--chalk-white);font-family:var(--font-chalk);cursor:pointer;background:0 0;border-radius:8px;padding:12px 24px;font-size:1.5rem;transition:all .2s cubic-bezier(.175,.885,.32,1.275);display:inline-block;box-shadow:2px 2px #fff3}.chalk-button:hover{background:#ffffff0d;transform:translateY(-4px)rotate(-2deg);box-shadow:4px 6px #ffffff4d}.chalk-button.primary{background-color:var(--accent-magenta);color:var(--black);border-color:var(--accent-magenta);box-shadow:2px 2px #ff85ec66}.chalk-button.primary:hover{background-color:var(--chalk-white);box-shadow:4px 6px #fff9}.chalk-button.secondary{background-color:var(--accent-cyan);color:var(--black);border-color:var(--accent-cyan);box-shadow:2px 2px #72e0ff66}.chalk-button.secondary:hover{background-color:var(--chalk-white);box-shadow:4px 6px #fff9}.chalk-button.tertiary{background-color:var(--accent-yellow);color:var(--black);border-color:var(--accent-yellow);box-shadow:2px 2px #ffe97566}.chalk-button.tertiary:hover{background-color:var(--chalk-white);box-shadow:4px 6px #fff9}.chalk-input{border:2px solid var(--chalk-dust);width:100%;color:var(--chalk-white);font-family:var(--font-main);margin-top:var(--spacing-sm);background:#ffffff08;border-radius:8px;outline:none;padding:16px;font-size:1.2rem;transition:all .3s}.chalk-input:focus{border-color:var(--accent-cyan);background:#ffffff14;box-shadow:0 0 10px #72e0ff33}.form-group{margin-bottom:var(--spacing-lg)}.form-label{font-family:var(--font-main);font-size:1.4rem;display:block}.chalk-box{border:3px solid var(--chalk-white);padding:var(--spacing-lg);box-shadow:inset 0 0 15px var(--chalk-dust);background:#ffffff05;border-radius:6px;position:relative}.chalk-box:before{content:"";pointer-events:none;border:1px solid #ffffff4d;border-radius:10px;position:absolute;inset:-6px}.placeholder-img{border:3px dashed var(--chalk-white);color:var(--chalk-white);font-family:var(--font-chalk);text-align:center;background:#ffffff0d;border-radius:8px;justify-content:center;align-items:center;width:100%;min-height:250px;padding:20px;font-size:1.5rem;display:flex}.grid-2-col{gap:var(--spacing-xl);grid-template-columns:1fr 1fr;align-items:center;display:grid}.grid-3-col{gap:var(--spacing-lg);grid-template-columns:repeat(auto-fit,minmax(300px,1fr));display:grid}.hero{flex-direction:column;justify-content:center;align-items:center;min-height:60vh;display:flex}.hero h1{margin-bottom:var(--spacing-md);font-size:5rem;transform:rotate(-1deg)}.hero p{font-family:var(--font-chalk-secondary);max-width:800px;margin:0 auto;margin-bottom:var(--spacing-xl);font-size:2rem}.hero-buttons{gap:var(--spacing-md);display:flex}.sticky-note{background:var(--chalk-dust);padding:var(--spacing-lg);border-radius:4px;transition:transform .3s;position:relative}.sticky-note:hover{transform:scale(1.05)rotate(2deg)}.workshop-card{flex-direction:column;height:100%;transition:transform .3s;display:flex}.workshop-card:hover{transform:translateY(-10px)}.workshop-card-content{padding:var(--spacing-md) 0;flex-direction:column;flex-grow:1;display:flex}.workshop-meta{border-top:1px dashed var(--chalk-dust);padding-top:var(--spacing-sm);font-family:var(--font-chalk);justify-content:space-between;margin-top:auto;display:flex}.footer{padding:var(--spacing-xl) 0 var(--spacing-lg);border-top:3px dashed var(--chalk-dust);text-align:center;margin-top:auto}@media (width<=768px){.grid-2-col{gap:var(--spacing-lg);grid-template-columns:1fr}.hero h1{font-size:3.5rem}.hero p{padding:0 16px;font-size:1.5rem}.hero-buttons{flex-direction:column;width:100%;padding:0 24px}.hero-buttons button{width:100%}.nav-links{flex-wrap:wrap;justify-content:center;gap:16px}.navbar{flex-direction:column;gap:16px}.section-spacing{padding:var(--spacing-lg) var(--spacing-md)}.nav-title{display:none}}
