@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;900&family=Space+Grotesk:wght@300;400;500;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;900&display=swap";:root{font-family:Inter,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;background-color:#f8fafc}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,sans-serif;background-color:#f8fafc;color:#333;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.hero-section{position:relative;overflow:hidden;background:radial-gradient(circle at 15% 25%,rgba(255,99,71,.9) 0%,transparent 45%),radial-gradient(circle at 85% 15%,rgba(255,20,147,.8) 0%,transparent 50%),radial-gradient(circle at 25% 85%,rgba(138,43,226,.85) 0%,transparent 48%),radial-gradient(circle at 75% 75%,rgba(0,191,255,.8) 0%,transparent 52%),radial-gradient(circle at 50% 50%,rgba(255,215,0,.6) 0%,transparent 65%),radial-gradient(circle at 90% 40%,rgba(0,255,127,.7) 0%,transparent 40%),linear-gradient(125deg,#ff634766,#ff14934d,#8a2be24d,#00bfff4d,#00ff7f4d,#ffd70066);background-size:400% 400%,350% 350%,380% 380%,360% 360%,450% 450%,320% 320%,200% 200%;animation:gradientFlow 20s ease-in-out infinite;border:1px solid rgba(255,255,255,.15);box-shadow:0 20px 60px #ff149340,0 12px 40px #8a2be233,inset 0 1px #ffffff1a;border-radius:28px;margin:30px;height:52vh;min-height:450px}@keyframes gradientFlow{0%{background-position:0% 50%,100% 0%,0% 100%,100% 50%,50% 0%,0% 0%,0% 50%}25%{background-position:50% 100%,0% 50%,100% 0%,50% 100%,100% 50%,50% 100%,25% 75%}50%{background-position:100% 50%,50% 100%,0% 50%,0% 0%,50% 100%,100% 50%,50% 50%}75%{background-position:50% 0%,100% 50%,50% 100%,100% 0%,0% 50%,50% 0%,75% 25%}to{background-position:0% 50%,100% 0%,0% 100%,100% 50%,50% 0%,0% 0%,0% 50%}}.hero-overlay{position:absolute;border-radius:28px;z-index:2;left:0;top:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:40px}.hero-container{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;max-width:800px}.hero-title{color:#fff;font-size:4.8em;text-align:center;font-weight:800;margin:0 0 30px;text-shadow:2px 2px 8px rgba(0,0,0,.3),0 0 30px rgba(255,255,255,.1);font-family:Nexa,Inter,sans-serif;letter-spacing:-.03em;line-height:.95}.hero-info{background:linear-gradient(135deg,#ffffff26,#ffffff14);backdrop-filter:blur(20px) saturate(1.2);-webkit-backdrop-filter:blur(20px) saturate(1.2);border:1px solid rgba(255,255,255,.2);margin:0;padding:25px 30px;border-radius:16px;font-size:1.1rem;max-width:600px;box-shadow:inset 0 1px #ffffff4d,0 8px 32px #0003}.hero-info ul{margin:0;padding:0;list-style:none;color:#fff}.hero-info li{margin:10px 0;color:#fffffff2;font-weight:500;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.hero-waves{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;border-radius:28px;overflow:hidden}.wave-animation{height:100%;width:100%}.hero-nav{position:absolute;top:20px;right:30px;z-index:3;display:flex;gap:15px}.nav-button{background:linear-gradient(135deg,#ffffff26,#ffffff14);backdrop-filter:blur(15px) saturate(1.2);-webkit-backdrop-filter:blur(15px) saturate(1.2);border:1px solid rgba(255,255,255,.25);border-radius:12px;padding:10px 20px;color:#fff;font-family:Space Grotesk,sans-serif;font-weight:500;font-size:.9rem;cursor:pointer;transition:all .3s ease;box-shadow:inset 0 1px #ffffff4d,0 4px 16px #0000001a;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.nav-button:hover{background:linear-gradient(135deg,#ffffff40,#ffffff26);border:1px solid rgba(255,255,255,.4);transform:translateY(-2px);box-shadow:inset 0 1px #fff6,0 8px 24px #00000026}.nav-button:active{transform:translateY(-1px)}@media screen and (max-width: 768px){.hero-section{margin:15px;min-height:400px;height:50vh}.hero-overlay{padding:25px}.hero-title{font-size:3.2em;margin-bottom:20px}.hero-info{max-width:100%;text-align:center;padding:20px;font-size:1rem}.hero-nav{top:15px;right:20px;gap:10px}.nav-button{padding:8px 16px;font-size:.8rem}}@media screen and (max-width: 480px){.hero-section{margin:10px;min-height:350px}.hero-overlay{padding:20px}.hero-title{font-size:2.5em;line-height:1}.hero-info{padding:15px;font-size:.9rem}}.projects-section{margin:50px}.projects-grid{column-count:auto;column-width:350px;column-gap:2rem;max-width:1600px;margin:0 auto}@media screen and (min-width: 1200px){.projects-grid{column-gap:2.5rem;column-width:320px}}.project-card{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:3px;overflow:hidden;transition:all .3s ease;width:100%;position:relative;display:inline-block;vertical-align:top;margin-bottom:2rem;height:fit-content;box-shadow:0 4px 16px #1f26870f;break-inside:avoid;page-break-inside:avoid}.project-card:before{content:"";position:absolute;inset:0;background:#fffc;border-radius:20px;z-index:-1}.project-card .project-link{background:#fffffff7;backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);border:1px solid rgba(255,255,255,.25);border-radius:18px;margin:0;display:block;box-shadow:inset 0 1px #fff3,0 4px 16px #1f26870d}.project-card:not(.no-preview) .project-link{border-radius:18px 18px 0 0}.project-card.no-preview .project-link{border-radius:18px}.project-card.no-preview{min-height:auto}.project-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #1f268726;border:1px solid rgba(255,255,255,.4)}.project-link{text-decoration:none;color:inherit;display:block;padding:1.5rem;flex-grow:1}.preview-link{text-decoration:none;display:block}.project-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.project-icon{font-size:2.5rem;flex-shrink:0}.project-name{font-size:1.3rem;font-weight:700;color:#333;font-family:Inter,sans-serif;line-height:1.2}.project-description{color:#666;line-height:1.5;margin-bottom:1rem;font-size:.95rem}.project-tech{display:flex;flex-wrap:wrap;gap:.5rem}.tech-tag{background:#8a2be2cc;color:#fff;padding:.35rem 1.5rem;border-radius:10px;font-size:.8rem;font-weight:500;box-shadow:0 2px 8px #8a2be214}.project-preview{position:relative;height:200px;background:#fff;border-radius:0 0 18px 18px;overflow:hidden}.project-preview iframe{width:100%;height:100%;border:none;transform:scale(.7);transform-origin:top left;width:142.857%;height:142.857%}.preview-overlay{position:absolute;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease;color:#fff;font-weight:600;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.project-card:hover .preview-overlay{opacity:1}@media screen and (max-width: 768px){.projects-section{margin:30px 20px}.projects-grid{column-count:1;column-gap:0}.project-card{margin-bottom:1.5rem;display:block}.section-title{font-size:2rem}.project-link{padding:1.25rem}.project-icon{font-size:2rem}.project-name{font-size:1.2rem}.project-preview{height:160px}}@media screen and (max-width: 480px){.projects-grid{column-gap:1rem}.project-card{margin-bottom:1rem}.project-link{padding:1rem}.project-header{gap:.75rem}.project-preview{height:150px}}.quotes-section{margin:50px}.quotes-container{max-width:1000px;margin:0 auto}@media screen and (min-width: 1200px){.quotes-container{max-width:1400px;display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(200px,auto);gap:3rem}.quote-card{margin:0}.quote-card:nth-child(1){grid-column:1;grid-row:1 / span 2}.quote-card:nth-child(2){grid-column:2 / span 2;grid-row:1}.quote-card:nth-child(3){grid-column:2;grid-row:2 / span 2}.quote-card:nth-child(4){grid-column:3;grid-row:2}}.quote-card{position:relative;overflow:hidden;border-radius:20px;margin:0;width:100%;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);padding:3px;transition:all .3s ease;box-shadow:0 4px 16px #1f26870f;height:fit-content}.quote-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #1f268726;border:1px solid rgba(255,255,255,.4)}.quote-content{color:#374151;position:relative;text-align:justify;padding:30px;background:#fffffffa;backdrop-filter:blur(10px) saturate(1);-webkit-backdrop-filter:blur(10px) saturate(1);border:1px solid rgba(255,255,255,.25);border-radius:17px;margin:0;box-shadow:inset 0 1px #fff3,0 4px 16px #1f26870d}.quote-text{position:relative;margin:30px 20px 25px;font-size:1.1rem;line-height:1.6;z-index:2}.quote-text:before{content:'"';font-size:4em;position:absolute;top:-35px;left:-25px;color:#ff149326;font-family:Georgia,serif;font-weight:700;z-index:1;line-height:1}.quote-text:after{content:'"';font-size:4em;position:absolute;bottom:-55px;right:-25px;color:#ff149326;font-family:Georgia,serif;font-weight:700;z-index:1;line-height:1}.quote-divider{border:none;height:1px;background:#ff149333;margin:25px 0}.quote-footer{display:flex;justify-content:space-between;align-items:center;margin-top:20px}.quote-source{font-style:italic;font-size:.9rem;color:#374151b3}.quote-author{font-weight:600;font-size:1rem;color:#374151}@media screen and (max-width: 768px){.quotes-section{margin:30px 20px}.quotes-container{grid-template-columns:1fr;gap:1.5rem;grid-auto-rows:auto}.quote-card:nth-child(2n),.quote-card:nth-child(3n){grid-row:span 1}.quote-card{margin:0}.quote-content{padding:20px}.quote-text{font-size:1rem;text-align:left;margin:25px 15px 20px}.quote-footer{flex-direction:column;align-items:flex-start;gap:8px}}@media screen and (max-width: 480px){.quote-content{padding:15px}.quote-text:before,.quote-text:after{font-size:2em}.quote-text:before{top:-15px;left:-5px}.quote-text:after{bottom:-25px;right:-5px}}.contacts-section{margin:50px}.contacts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1.5rem;justify-items:center;max-width:1200px;margin:0 auto}@media screen and (min-width: 1200px){.contacts-grid{grid-template-columns:repeat(6,1fr);gap:2rem;max-width:1000px}}.contact-link{text-decoration:none;color:inherit;transition:transform .2s ease}.contact-link:hover{transform:translateY(-4px)}.contact-card{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:2px;text-align:center;transition:all .3s ease;width:100%;max-width:180px;position:relative;overflow:hidden;box-shadow:0 6px 24px #1f268714}.contact-card .contact-content{background:#fffffff2;backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);border:1px solid rgba(255,255,255,.3);border-radius:14px;padding:1rem;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;box-shadow:inset 0 1px #ffffff4d,0 4px 16px #1f26870d}.contact-card:hover{transform:translateY(-4px);box-shadow:0 15px 30px #1f268726;border:1px solid rgba(255,255,255,.4)}.contact-logo{width:36px;height:36px;object-fit:contain;filter:brightness(0) saturate(100%) invert(20%) sepia(5%) saturate(50%) hue-rotate(0deg) brightness(95%) contrast(90%);transition:filter .2s ease}.contact-name{font-size:.95rem;font-weight:600;color:#333;font-family:Inter,sans-serif}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@media screen and (max-width: 768px){.contacts-section{margin:30px 20px}.contacts-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.contact-card{padding:1rem;min-height:100px;max-width:180px}.contact-logo{width:32px;height:32px}.contact-name{font-size:1rem}}@media screen and (max-width: 480px){.contacts-grid{grid-template-columns:repeat(2,1fr)}.contact-card{max-width:100%}}*{box-sizing:border-box}.App{font-family:Inter,sans-serif;background-color:#f8fafc;min-height:100vh;padding:0 80px;max-width:1800px;margin:0 auto}@media screen and (min-width: 1200px){.App{padding:0 120px}}@media screen and (max-width: 768px){.App{padding:0 20px}}.main-content{padding:0}.section-title{color:#333;font-size:2.5rem;font-weight:700;text-align:center;margin-bottom:2rem;font-family:Inter,sans-serif;position:relative}@media screen and (min-width: 1200px){.section-title{font-size:3rem;margin-bottom:3rem;color:#333;text-align:center}}.wave-path{stroke:#ffffff26;stroke-width:.3px;fill:transparent}
