@import "https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Quicksand:wght@400;500;600;700&display=swap";
:root{--color-primary:#ffb800;--color-primary-hover:#e5a500;--color-secondary:#5d4037;--color-secondary-light:#8d6e63;--color-accent:#ff7043;--color-flavor-chocolate:#d7ccc8;--color-flavor-matcha:#c8e6c9;--color-flavor-strawberry:#ffcdd2;--color-flavor-vanilla:#fff9c4;--color-dark:#3e2723;--color-text:#4e342e;--color-muted:#8d6e63;--color-bg:#fffdf7;--color-bg-alt:#fff5e1;--color-surface:#fff;--color-border:#efebe4;--font-title:"Fredoka", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-sans:"Quicksand", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-32:8rem;--radius-sm:.5rem;--radius-md:1rem;--radius-lg:1.5rem;--radius-xl:2rem;--radius-2xl:3rem;--radius-full:9999px;--shadow-sm:0 4px 0px #5d40371a;--shadow-md:0 8px 0px #5d40371a;--shadow-card:0 8px 24px #5d403714;--shadow-card-hover:0 12px 32px #5d40371f;--shadow-solid:4px 4px 0px var(--color-dark)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scroll-padding-top:100px;font-size:16px}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;line-height:1.6;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-title);color:var(--color-dark);font-weight:700;line-height:1.2}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}button{cursor:pointer;font-family:inherit}.container{width:100%;max-width:1200px;padding:0 var(--space-4);margin:0 auto}.text-center{text-align:center}.text-primary{color:var(--color-primary)}.text-accent{color:var(--color-accent)}.text-highlight{color:var(--color-dark);z-index:1;padding:0 .25rem;display:inline-block;position:relative}.text-highlight:after{content:"";background-color:var(--color-primary);z-index:-1;border-radius:var(--radius-sm);width:100%;height:.4em;position:absolute;bottom:.1em;left:0;transform:rotate(-1deg)}.section{padding:var(--space-16) 0}.section-lg{padding:var(--space-20) 0}.section-xl{padding:var(--space-24) 0}@media (max-width:768px){.section{padding:var(--space-12) 0}.section-lg,.section-xl{padding:var(--space-16) 0}.hide-on-mobile{display:none!important}}.btn{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-full);font-weight:700;font-family:var(--font-title);text-transform:uppercase;letter-spacing:.05em;border:2px solid #0000;transition:all .2s;display:inline-flex}.btn-lg{padding:var(--space-4) var(--space-8);font-size:1.125rem}.btn-sm{padding:var(--space-2) var(--space-4);font-size:.875rem}.btn-primary{background-color:var(--color-primary);color:var(--color-dark);border:2px solid var(--color-dark);box-shadow:3px 3px 0px var(--color-dark)}.btn-primary:hover{box-shadow:5px 5px 0px var(--color-dark);transform:translate(-2px,-2px)}.btn-primary:active{box-shadow:0px 0px 0px var(--color-dark);transform:translate(2px,2px)}.btn-outline{background-color:var(--color-surface);color:var(--color-dark);border:2px solid var(--color-dark);box-shadow:3px 3px 0px var(--color-dark)}.btn-outline:hover{background-color:var(--color-bg-alt);box-shadow:5px 5px 0px var(--color-dark);transform:translate(-2px,-2px)}.nav-wrapper{top:var(--space-4);width:calc(100% - var(--space-8));z-index:50;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:2px solid var(--color-dark);border-radius:var(--radius-full);max-width:1200px;box-shadow:4px 4px 0px var(--color-dark);background:#fffdf7e6;transition:all .3s;position:fixed;left:50%;transform:translate(-50%)}.nav-wrapper.scrolled{background:#fffdf7fa}.nav-container{justify-content:space-between;align-items:center;display:flex}.nav-links{gap:var(--space-6);align-items:center;display:flex}@media (max-width:768px){.nav-links{top:calc(100% + var(--space-2));background:var(--color-surface);width:100%;padding:var(--space-6);border:2px solid var(--color-dark);border-radius:var(--radius-xl);box-shadow:4px 4px 0px var(--color-dark);opacity:0;visibility:hidden;flex-direction:column;justify-content:flex-start;transition:all .3s;position:absolute;left:0;right:0;transform:translateY(-10px)}.nav-links.active{opacity:1;visibility:visible;transform:translateY(0)}.nav-mobile-btn{display:block}}@media (min-width:769px){.nav-mobile-btn{display:none}}.mobile-fab{bottom:var(--space-6);right:var(--space-6);background:var(--color-primary);color:var(--color-dark);border:2px solid var(--color-dark);width:64px;height:64px;box-shadow:4px 4px 0px var(--color-dark);z-index:9999;border-radius:50%;justify-content:center;align-items:center;transition:all .2s;animation:2s ease-in-out infinite bounce-slight;display:none;position:fixed}.mobile-fab:active{box-shadow:0px 0px 0px var(--color-dark);transform:translate(2px,2px)}@keyframes bounce-slight{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@media (max-width:768px){.mobile-fab{display:flex!important}}.hero-section{background:url("data:image/svg+xml;utf8,<svg width=\"100\" height=\"100\" viewBox=\"0 0 100 100\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"50\" cy=\"50\" r=\"2\" fill=\"%23FFB800\" opacity=\"0.5\"/></svg>");align-items:center;min-height:100vh;padding-top:100px;display:flex;position:relative}@media (max-width:768px){.hero-section{padding-top:180px}}.playful-card{background:var(--color-surface);border:2px solid var(--color-dark);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-solid);transition:transform .2s,box-shadow .2s}.playful-card:hover{box-shadow:6px 6px 0px var(--color-dark);transform:translateY(-4px)}.cloud-bg{background-color:var(--color-surface);padding:var(--space-12) var(--space-4);margin:var(--space-8) 0;border:2px solid var(--color-dark);box-shadow:var(--shadow-solid);border-radius:50px;position:relative}.badge{border-radius:var(--radius-full);text-transform:uppercase;border:2px solid var(--color-dark);background:var(--color-primary);color:var(--color-dark);padding:4px 12px;font-size:.75rem;font-weight:700;display:inline-block}.form-input{width:100%;padding:var(--space-3) var(--space-4);border:2px solid var(--color-dark);border-radius:var(--radius-lg);background:var(--color-surface);font-family:inherit;font-size:1rem;transition:all .2s}.form-input:focus{border-color:var(--color-accent);box-shadow:3px 3px 0px var(--color-accent);outline:none}