.loading-spinner{width:50px;height:50px;border-radius:50%;border:5px solid transparent;border-top:5px solid #00f2ff;animation:spin 1s linear infinite;box-shadow:0 0 10px #00f2ff,0 0 20px #00f2ff,0 0 30px #00f2ff,0 0 40px #00f2ff;background:radial-gradient(circle,#00f2ff,#001eff)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes glow{0%{box-shadow:0 0 10px #00f2ff,0 0 20px #00f2ff}50%{box-shadow:0 0 20px #00f2ff,0 0 30px #00f2ff}to{box-shadow:0 0 10px #00f2ff,0 0 20px #00f2ff}}.loading-spinner{animation:spin 1s linear infinite,glow 2s ease-in-out infinite}body{--background-color: #ffffff;--text-color: #4f4f4f;--card-background-color: #ffffff;--card-border-color: rgba(16, 185, 129, .1);--card-box-shadow-1: rgba(16, 185, 129, .05);--card-box-shadow-1-y: 3px;--card-box-shadow-1-blur: 6px;--card-box-shadow-2: rgba(16, 185, 129, .1);--card-box-shadow-2-y: 2px;--card-box-shadow-2-blur: 7px;--card-label-color: #616b68;--card-icon-color: #10b981;--card-icon-background-color: rgba(16, 185, 129, .05);--card-icon-border-color: rgba(16, 185, 129, .1);--card-shine-opacity: .3;--card-shine-gradient: conic-gradient( from 225deg at 50% 50%, rgba(16, 185, 129, 0) 0deg, #10b981 25deg, #c6f4d6 285deg, #ffffff 345deg, rgba(16, 185, 129, 0) 360deg );--card-line-color: #10b981;--card-tile-color: rgba(16, 185, 129, .08);--card-hover-border-color: rgba(16, 185, 129, .2);--card-hover-box-shadow-1: rgba(16, 185, 129, .1);--card-hover-box-shadow-1-y: 3px;--card-hover-box-shadow-1-blur: 6px;--card-hover-box-shadow-2: rgba(16, 185, 129, .2);--card-hover-box-shadow-2-y: 8px;--card-hover-box-shadow-2-blur: 15px;--card-hover-icon-color: #0a854d;--card-hover-icon-background-color: rgba(16, 185, 129, .1);--card-hover-icon-border-color: rgba(16, 185, 129, .2);--blur-opacity: .1}body.toggle .grid *{transition-duration:0s!important}.grid{display:grid;grid-gap:32px;position:relative;z-index:1;max-width:1200px;margin:20px 10px}@media (min-width: 900px){.grid{grid-template-columns:repeat(3,1fr)}}@media (max-width: 899px) and (min-width: 600px){.grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 599px){.grid{grid-template-columns:repeat(1,1fr)}}.card{background-color:var(--background-color);box-shadow:0 var(--card-box-shadow-1-y) var(--card-box-shadow-1-blur) var(--card-box-shadow-1),0 var(--card-box-shadow-2-y) var(--card-box-shadow-2-blur) var(--card-box-shadow-2),0 0 0 1px var(--card-border-color);padding:56px 16px 16px;border-radius:15px;cursor:pointer;position:relative;transition:box-shadow .25s}.card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:15px;background-color:var(--card-background-color)}.card .icon{z-index:2;position:relative;display:table;padding:8px}.card .icon:after{content:"";position:absolute;top:4.5px;right:4.5px;bottom:4.5px;left:4.5px;border-radius:50%;background-color:var(--card-icon-background-color);border:1px solid var(--card-icon-border-color);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:background-color .25s,border-color .25s}.card .icon svg{position:relative;z-index:1;display:block;width:24px;height:24px;transform:translateZ(0);color:var(--card-icon-color);transition:color .25s}.card h4{z-index:2;position:relative;margin:12px 0 4px;font-family:inherit;font-weight:600;font-size:14px;line-height:2;color:var(--card-label-color)}.card p{z-index:2;position:relative;margin:0;font-size:14px;line-height:1.7;color:var(--text-color)}.card .shine{border-radius:inherit;position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;overflow:hidden;opacity:0;transition:opacity .5s}.card .shine:before{content:"";width:150%;padding-bottom:150%;border-radius:50%;position:absolute;left:50%;bottom:55%;filter:blur(35px);opacity:var(--card-shine-opacity);transform:translate(-50%);background-image:var(--card-shine-gradient)}.card .background{border-radius:inherit;position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;-webkit-mask-image:radial-gradient(circle at 60% 5%,black 0%,black 15%,transparent 60%);mask-image:radial-gradient(circle at 60% 5%,black 0%,black 15%,transparent 60%);@keyframes tile{0%,12.5%,to{opacity:1}25%,82.5%{opacity:0}}}.card .background .tiles{opacity:0;transition:opacity .25s}.card .background .tiles .tile{position:absolute;background-color:var(--card-tile-color);animation-duration:8s;animation-iteration-count:infinite;opacity:0}.card .background .tiles .tile.tile-4,.card .background .tiles .tile.tile-6,.card .background .tiles .tile.tile-10{animation-delay:-2s}.card .background .tiles .tile.tile-3,.card .background .tiles .tile.tile-5,.card .background .tiles .tile.tile-8{animation-delay:-4s}.card .background .tiles .tile.tile-2,.card .background .tiles .tile.tile-9{animation-delay:-6s}.card .background .tiles .tile.tile-1{top:0;left:0;height:10%;width:22.5%}.card .background .tiles .tile.tile-2{top:0;left:22.5%;height:10%;width:27.5%}.card .background .tiles .tile.tile-3{top:0;left:50%;height:10%;width:27.5%}.card .background .tiles .tile.tile-4{top:0;left:77.5%;height:10%;width:22.5%}.card .background .tiles .tile.tile-5{top:10%;left:0;height:22.5%;width:22.5%}.card .background .tiles .tile.tile-6{top:10%;left:22.5%;height:22.5%;width:27.5%}.card .background .tiles .tile.tile-7{top:10%;left:50%;height:22.5%;width:27.5%}.card .background .tiles .tile.tile-8{top:10%;left:77.5%;height:22.5%;width:22.5%}.card .background .tiles .tile.tile-9{top:32.5%;left:50%;height:22.5%;width:27.5%}.card .background .tiles .tile.tile-10{top:32.5%;left:77.5%;height:22.5%;width:22.5%}.card .background .line{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .35s}.card .background .line:before,.card .background .line:after{content:"";position:absolute;background-color:var(--card-line-color);transition:transform .35s}.card .background .line:before{left:0;right:0;height:1px;transform-origin:0 50%;transform:scaleX(0)}.card .background .line:after{top:0;bottom:0;width:1px;transform-origin:50% 0;transform:scaleY(0)}.card .background .line.line-1:before{top:10%}.card .background .line.line-1:after{left:22.5%}.card .background .line.line-1:before,.card .background .line.line-1:after{transition-delay:.3s}.card .background .line.line-2:before{top:32.5%}.card .background .line.line-2:after{left:50%}.card .background .line.line-2:before,.card .background .line.line-2:after{transition-delay:.15s}.card .background .line.line-3:before{top:55%}.card .background .line.line-3:after{right:22.5%}.card:hover{box-shadow:0 3px 6px var(--card-hover-box-shadow-1),0 var(--card-hover-box-shadow-2-y) var(--card-hover-box-shadow-2-blur) var(--card-hover-box-shadow-2),0 0 0 1px var(--card-hover-border-color)}.card:hover .icon:after{background-color:var(--card-hover-icon-background-color);border-color:var(--card-hover-icon-border-color)}.card:hover .icon svg{color:var(--card-hover-icon-color)}.card:hover .shine{opacity:1;transition-duration:.5s;transition-delay:0s}.card:hover .background .tiles{opacity:1;transition-delay:.25s}.card:hover .background .tiles .tile{animation-name:tile}.card:hover .background .line{opacity:1;transition-duration:.15s}.card:hover .background .line:before{transform:scaleX(1)}.card:hover .background .line:after{transform:scaleY(1)}.card:hover .background .line.line-1:before,.card:hover .background .line.line-1:after{transition-delay:0s}.card:hover .background .line.line-2:before,.card:hover .background .line.line-2:after{transition-delay:.15s}.card:hover .background .line.line-3:before,.card:hover .background .line.line-3:after{transition-delay:.3s}.day-night{cursor:pointer;position:absolute;right:20px;top:20px;opacity:.3}.day-night input{display:none}.day-night input+div{border-radius:50%;width:20px;height:20px;position:relative;box-shadow:inset 8px -8px 0 0 var(--text-color);transform:scale(1) rotate(-2deg);transition:box-shadow .5s ease 0s,transform .4s ease .1s}.day-night input+div:before{content:"";width:inherit;height:inherit;border-radius:inherit;position:absolute;left:0;top:0;transition:background-color .3s ease}.day-night input+div:after{content:"";width:6px;height:6px;border-radius:50%;margin:-3px 0 0 -3px;position:absolute;top:50%;left:50%;box-shadow:0 -23px 0 var(--text-color),0 23px 0 var(--text-color),23px 0 0 var(--text-color),-23px 0 0 var(--text-color),15px 15px 0 var(--text-color),-15px 15px 0 var(--text-color),15px -15px 0 var(--text-color),-15px -15px 0 var(--text-color);transform:scale(0);transition:all .3s ease}.day-night input:checked+div{box-shadow:inset 20px -20px 0 0 var(--text-color);transform:scale(.5) rotate(0);transition:transform .3s ease .1s,box-shadow .2s ease 0s}.day-night input:checked+div:before{background:var(--text-color);transition:background-color .3s ease .1s}.day-night input:checked+div:after{transform:scale(1);transition:transform .5s ease .15s}html{box-sizing:border-box;-webkit-font-smoothing:antialiased}*{box-sizing:inherit}*:before,*:after{box-sizing:inherit}:root{font-family:Nunito,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#000000de;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh;position:relative;background-image:linear-gradient(to bottom,#ffd7be,#c9e4ca)}#root{margin:0 auto;text-align:center}.welcome-message{text-align:center;font-size:24px;font-weight:700;color:#333;line-height:1;display:flex;flex-direction:column;align-items:center;margin:0 auto;position:relative;padding-top:40px;padding-bottom:20px;background-image:linear-gradient(to bottom,#ffd7be,#c9e4ca)}.welcome-message h1{margin:0}.content-container{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;padding:40px}.navbar-container{position:sticky;top:0;z-index:1000}.section{display:flex;flex-direction:column;justify-content:center;align-items:center;padding-top:40px;padding-bottom:20px}.section.animate{opacity:1;transform:translateY(0)}#web-development{background-image:linear-gradient(to bottom,#c9e4ca,#87ceeb)}#data-ai{background-image:linear-gradient(to bottom,#87ceeb,#c9c3e6)}#contact{padding:20px;margin-top:0;background-color:#f9f9f9;text-align:center;position:relative;background-image:linear-gradient(to bottom,#c9c3e6,#c9e4ca)}#contact form{max-width:600px;margin:0 auto;padding:20px;background-color:#fff;border:1px solid #ddd;box-shadow:0 0 10px #0000001a;border-radius:10px;background-image:linear-gradient(to bottom,#fff,#f7f7f7)}@media (max-width: 768px){.content-container{flex-direction:column}.section{flex-basis:100%}}.content-box{background-color:#f6f8fa;padding:16px;border:1px solid #d1d5da;border-radius:6px;font-size:14px;line-height:1.5;max-width:500px;margin:0 auto}.annotation-types{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:5px 15px}@media only screen and (max-width: 768px){.annotation-types{grid-template-columns:1fr}}.annotation-type{background-color:#f7f7f7;padding:20px;border:1px solid #ddd;border-radius:10px;box-shadow:0 0 10px #0000001a;position:relative;overflow:hidden;transition:box-shadow .25s,transform .25s}.annotation-type:hover{box-shadow:0 3px 6px #00000029,0 3px 6px #0000003b;transform:translateY(-2px)}.annotation-type .shine{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;overflow:hidden;opacity:0;transition:opacity .5s;background-image:linear-gradient(120deg,#84fab0,#8fd3f4)}.annotation-type:hover .shine{opacity:1}.annotation-type h3{margin-top:0}.navbar-container a{transition:all .5s ease-in-out;font-size:24px;text-transform:uppercase;letter-spacing:2px}.navbar-container a:hover{color:#ff69b4;text-decoration:none;transform:scale(1.2)}.navbar-container.theme-light a{color:#f90;text-shadow:2px 2px #333}.navbar-container.theme-dark a{color:#6cf;text-shadow:2px 2px #fff}.header-container{text-align:center;padding:20px}.header-container h3{font-size:22px;margin-bottom:10px}.header-container p{font-size:18px;color:#666}