:root{--apple-blue: #007AFF;--apple-green: #34C759;--apple-orange: #FF9500;--apple-light-grey: #F2F2F7;--apple-white: #FFFFFF;--apple-black: #1C1C1E}:root[data-theme=light]{--bg-primary: #FFFFFF;--bg-secondary: #F2F2F7;--text-primary: #1C1C1E;--text-secondary: #6B6B70;--glass-bg: rgba(255, 255, 255, .15);--glass-bg-hover: rgba(255, 255, 255, .25);--glass-border: rgba(255, 255, 255, .2);--nav-glass-bg: rgba(255, 255, 255, .25);--nav-glass-border: rgba(255, 255, 255, .3)}:root[data-theme=dark]{--bg-primary: #000000;--bg-secondary: #1C1C1E;--text-primary: #FFFFFF;--text-secondary: #9B9B9F;--glass-bg: rgba(255, 255, 255, .1);--glass-bg-hover: rgba(255, 255, 255, .15);--glass-border: rgba(255, 255, 255, .15);--nav-glass-bg: rgba(0, 0, 0, .3);--nav-glass-border: rgba(255, 255, 255, .2)}:root{--glass-bg: rgba(255, 255, 255, .08);--glass-bg-hover: rgba(255, 255, 255, .12);--glass-border: rgba(255, 255, 255, .15);--glass-backdrop: blur(40px);--glass-shadow: 0 8px 32px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .08);--nav-glass-bg: rgba(255, 255, 255, .05);--nav-glass-border: rgba(255, 255, 255, .1);font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,system-ui,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:var(--apple-black);background:linear-gradient(135deg,var(--apple-blue) 0%,var(--apple-green) 100%);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;min-height:100vh;min-width:320px;background:linear-gradient(135deg,var(--apple-blue) 0%,var(--apple-green) 100%);background-attachment:fixed}.glass{background:var(--glass-bg);backdrop-filter:var(--glass-backdrop);-webkit-backdrop-filter:var(--glass-backdrop);border:.5px solid var(--glass-border);border-radius:16px;box-shadow:var(--glass-shadow);transition:all .3s cubic-bezier(.4,0,.2,1)}.glass:hover{background:var(--glass-bg-hover);border-color:#fff3;transform:translateY(-2px);box-shadow:0 12px 40px #00000014,0 2px 4px #0000001a}.glass-card{background:var(--glass-bg);backdrop-filter:var(--glass-backdrop);-webkit-backdrop-filter:var(--glass-backdrop);border:.5px solid var(--glass-border);border-radius:16px;padding:32px;box-shadow:var(--glass-shadow);color:#fff;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.glass-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);opacity:.6}.glass-card:hover{background:var(--glass-bg-hover);border-color:#ffffff40;transform:translateY(-4px) scale(1.02);box-shadow:0 20px 60px #00000026,0 4px 8px #0000001a;animation:cardFloat .6s cubic-bezier(.25,.46,.45,.94)}@keyframes cardFloat{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-6px) scale(1.03)}to{transform:translateY(-4px) scale(1.02)}}.btn{position:relative;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1);will-change:transform,box-shadow}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s cubic-bezier(.4,0,.2,1);pointer-events:none}.btn:hover:before{left:100%}.btn:active{transform:scale(.96);transition:transform .1s ease}@keyframes springIn{0%{transform:scale(.3) rotate(-5deg);opacity:0}50%{transform:scale(1.05) rotate(1deg)}70%{transform:scale(.95) rotate(-.5deg)}to{transform:scale(1) rotate(0);opacity:1}}.spring-in{animation:springIn .6s cubic-bezier(.34,1.56,.64,1)}@media (hover: none){.glass-card:hover{transform:none;box-shadow:var(--glass-shadow)}.glass-card:active{transform:scale(.98);transition:transform .1s ease}}h1{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,system-ui,sans-serif;font-size:clamp(2.5rem,5vw,4rem);font-weight:700;line-height:1.1;color:#fff;margin-bottom:1rem}h2{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,system-ui,sans-serif;font-size:clamp(2rem,4vw,3rem);font-weight:600;line-height:1.2;color:#fff;margin-bottom:.75rem}h3{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,system-ui,sans-serif;font-size:clamp(1.5rem,3vw,2rem);font-weight:500;line-height:1.3;color:#fff;margin-bottom:.5rem}p{font-size:clamp(1rem,2vw,1.125rem);line-height:1.6;color:#ffffffe6;margin-bottom:1rem}.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;border-radius:12px;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,system-ui,sans-serif;font-size:1rem;font-weight:500;text-decoration:none;border:none;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.btn-primary{background:var(--glass-bg);color:#fff;border:.5px solid var(--glass-border);backdrop-filter:var(--glass-backdrop);-webkit-backdrop-filter:var(--glass-backdrop);box-shadow:var(--glass-shadow);position:relative;overflow:hidden}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transition:left .5s ease}.btn-primary:hover:before{left:100%}.btn-primary:hover{background:var(--glass-bg-hover);border-color:#ffffff40;transform:translateY(-2px);box-shadow:0 12px 40px #0000001f,0 2px 4px #0000001a}.btn-secondary{background:var(--glass-bg);color:#fff;border:.5px solid var(--glass-border);backdrop-filter:var(--glass-backdrop);-webkit-backdrop-filter:var(--glass-backdrop);box-shadow:var(--glass-shadow);position:relative;overflow:hidden}.btn-secondary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transition:left .5s ease}.btn-secondary:hover:before{left:100%}.btn-secondary:hover{background:var(--glass-bg-hover);border-color:#ffffff40;transform:translateY(-2px);box-shadow:0 12px 40px #0000001f,0 2px 4px #0000001a}.nav{position:fixed;bottom:20px;left:20px;right:20px;z-index:1000;background:var(--nav-glass-bg);backdrop-filter:var(--glass-backdrop);-webkit-backdrop-filter:var(--glass-backdrop);border:.5px solid var(--nav-glass-border);border-radius:24px;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 8px 32px #0000000a,0 1px #ffffff1a inset;transition:all .3s cubic-bezier(.4,0,.2,1)}.nav-logo{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,system-ui,sans-serif;font-size:1.25rem;font-weight:600;color:#fff;text-decoration:none}.nav-menu{display:flex;list-style:none;gap:2rem;margin:0;padding:0}.nav-link{color:#ffffffd9;text-decoration:none;font-weight:500;padding:8px 12px;border-radius:8px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}.nav-link:hover{color:#fff;background:#ffffff1a;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.container{max-width:1200px;margin:0 auto;padding:0 20px}.nav-logo img{transition:all .3s ease}@media (max-width: 768px){.nav-logo img{height:28px!important}.glass-card img[alt="DiekerIT Logo"]{width:240px!important;max-width:90vw}}@media (max-width: 480px){.nav-logo img{height:24px!important}.glass-card img[alt="DiekerIT Logo"]{width:200px!important}}@media (max-width: 768px){.nav-menu{display:none;position:fixed;bottom:100px;left:20px;right:20px;background:var(--glass-bg);backdrop-filter:var(--glass-backdrop);-webkit-backdrop-filter:var(--glass-backdrop);border:.5px solid var(--glass-border);border-radius:16px;box-shadow:var(--glass-shadow);padding:20px;flex-direction:column;gap:1rem;z-index:999}.nav-menu.open{display:flex}.nav-toggle{display:block;background:transparent;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:8px;border-radius:4px;transition:background-color .2s ease}.nav-toggle:hover{background:#ffffff1a}.container{padding:0 16px}}@media (min-width: 769px){.nav-toggle{display:none}}html{scroll-behavior:smooth}*:focus{outline:2px solid var(--apple-blue);outline-offset:2px}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}
