:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#6687c9;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;overflow-x:hidden}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}}#root{width:100%;text-align:center}ul{list-style-type:none}.hero{height:100%;width:100%;display:flex;align-items:center;justify-content:center;position:relative;background:#000;overflow:hidden}.hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom right,#2563eb0d,#9333ea0d)}.hero-container{width:100%;margin-top:70px;padding:0 1.5rem;text-align:center;position:relative;z-index:10}.hero-content{display:flex;flex-direction:column;gap:1rem}.hero-heading{display:flex;flex-direction:column;gap:.2rem}.hero-intro{color:#60a5fa;font-size:1.125rem;font-weight:300;letter-spacing:.2em;text-transform:uppercase}.hero-title{font-size:3.75rem;font-weight:900;color:#fff;line-height:1.1}@media (min-width: 768px){.hero-title{font-size:6rem}}.hero-roles{font-size:1.25rem;font-weight:300;color:#d1d5db}.hero-roles-desktop{display:flex;align-items:center;justify-content:center;gap:1.5rem;color:#60a5fa}.role{display:flex;align-items:center;gap:.5rem}.laptop-only{display:none}.laptop-hidden{display:flex;justify-content:center;gap:.5rem;color:#60a5fa}@media (min-width: 768px){.laptop-only{display:flex}.laptop-hidden{display:none}}.hero-subtitle{font-size:1.125rem;color:#9ca3af;max-width:768px;margin:0 auto;line-height:1.75;font-weight:300}.hero-actions{display:flex;justify-content:center;gap:1.5rem;align-items:center}.contact-btn{display:flex;align-items:center;gap:.5rem;background:#fff;color:#000;padding:1rem 2rem;border-radius:9999px;font-weight:500;transition:all .3s ease}.contact-btn:hover{transform:scale(1.05);background:#f3f4f6}.social-icon{display:flex;align-items:center;justify-content:center;padding:1rem;background:#111827;color:#fff;border-radius:9999px;border:1px solid #374151;transition:all .3s ease}.social-icon:hover{background:#1f2937;border-color:#4b5563;transform:scale(1.1)}.scroll-btn{position:absolute;bottom:2rem;left:50%;z-index:50;transform:translate(-50%);color:#fff;animation:bounce 2s infinite;background:none;border:none;cursor:pointer;outline:none}.scroll-btn:focus{outline:none}@keyframes bounce{0%,to{transform:translate(-50%)}50%{transform:translate(-50%,-10px)}}.hero-actions-logo-wrapper{display:flex;flex-direction:column;align-items:center;gap:2rem;margin-top:2rem}.hero-logo img{width:100px;height:auto}@media (max-width: 400px){.hero-title{font-size:2.5rem;line-height:1.1}.hero-intro{font-size:.9rem;letter-spacing:.1em}.hero-subtitle{font-size:.98rem;padding:0 .5rem}.hero-roles-desktop{flex-direction:row;gap:1.5rem}.role{font-size:.85rem;gap:.5rem}.hero-actions{flex-direction:row;gap:1rem}.contact-btn{padding:.75rem 1.5rem;font-size:.85rem}.social-links{gap:.5rem}.social-icon{padding:.5rem}.scroll-btn{bottom:1rem;transform:translate(-50%)}.hero-actions-logo-wrapper{flex-direction:column;gap:2.5rem}}.logoloop{position:relative;overflow-x:hidden;--logoloop-gap: 32px;--logoloop-logoHeight: 28px;--logoloop-fadeColorAuto: #ffffff}.logoloop--scale-hover{padding-top:calc(var(--logoloop-logoHeight) * .1);padding-bottom:calc(var(--logoloop-logoHeight) * .1)}@media (prefers-color-scheme: dark){.logoloop{--logoloop-fadeColorAuto: #0b0b0b}}.logoloop__track{display:flex;width:max-content;will-change:transform;-webkit-user-select:none;user-select:none}.logoloop__list{display:flex;align-items:center}.logoloop__item{flex:0 0 auto;margin-right:var(--logoloop-gap);font-size:var(--logoloop-logoHeight);line-height:1}.logoloop__item:last-child{margin-right:var(--logoloop-gap)}.logoloop__node{display:inline-flex;align-items:center}.logoloop__item img{height:var(--logoloop-logoHeight);width:auto;display:block;object-fit:contain;image-rendering:-webkit-optimize-contrast;-webkit-user-drag:none;pointer-events:none;transition:transform .3s cubic-bezier(.4,0,.2,1)}.logoloop--scale-hover .logoloop__item{overflow:visible}.logoloop--scale-hover .logoloop__item:hover img,.logoloop--scale-hover .logoloop__item:hover .logoloop__node{transform:scale(1.2);transform-origin:center center}.logoloop--scale-hover .logoloop__node{transition:transform .3s cubic-bezier(.4,0,.2,1)}.logoloop__link{display:inline-flex;align-items:center;text-decoration:none;border-radius:4px;transition:opacity .2s ease}.logoloop__link:hover{opacity:.8}.logoloop__link:focus-visible{outline:2px solid currentColor;outline-offset:2px}.logoloop--fade:before,.logoloop--fade:after{content:"";position:absolute;top:0;bottom:0;width:clamp(24px,8%,120px);pointer-events:none;z-index:1}.logoloop--fade:before{left:0;background:linear-gradient(to right,var(--logoloop-fadeColor, var(--logoloop-fadeColorAuto)) 0%,rgba(0,0,0,0) 100%)}.logoloop--fade:after{right:0;background:linear-gradient(to left,var(--logoloop-fadeColor, var(--logoloop-fadeColorAuto)) 0%,rgba(0,0,0,0) 100%)}@media (prefers-reduced-motion: reduce){.logoloop__track{transform:translateZ(0)!important}.logoloop__item img,.logoloop__node{transition:none!important}}.navbar{position:fixed;top:0;margin-bottom:20px;width:100%;z-index:50;transition:all .3s ease;background:transparent}.navbar.scrolled{background:#000000f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #1f2937}.navbar-container{max-width:1280px;margin:0 auto;padding:0 1rem}.navbar-content{display:flex;justify-content:space-between;align-items:center;height:4rem}.navbar-logo h1{font-size:1.5rem;font-weight:900;color:#fff;letter-spacing:.05em}.navbar-links-desktop{display:none;gap:2rem}.navbar-link{color:#d1d5db;background:transparent;padding:.5rem 1rem;font-size:.875rem;font-weight:500;border-radius:9999px;transition:all .3s ease;cursor:pointer}.navbar-link:hover{color:#fff;background:#ffffff1a}.navbar-menu-mobile-button{display:flex}.menu-btn{color:#9ca3af;background:none;border:none;cursor:pointer;transition:color .3s ease}.menu-btn:hover{color:#fff}.navbar-menu-mobile{display:flex;flex-direction:column;background:#000000fa;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #1f2937}.navbar-menu-link{color:#d1d5db;background:transparent;padding:.75rem 1rem;font-size:1rem;font-weight:500;width:100%;text-align:left;border-radius:.5rem;transition:all .3s ease;cursor:pointer}.navbar-menu-link:hover{color:#fff;background:#ffffff1a}@media (min-width: 768px){.navbar-links-desktop{display:flex;align-items:center}.navbar-menu-mobile-button,.navbar-menu-mobile{display:none}}.about-section{padding:5rem 1rem;background:#000;color:#fff}.about-container{max-width:1280px;margin:0 auto;padding:0 1rem}.about-header{text-align:center;margin-bottom:4rem}.about-header h2{font-size:3rem;font-weight:900;margin-bottom:1.5rem;letter-spacing:-.02em}.about-header p{color:#9ca3af;font-size:1.125rem;font-weight:400;max-width:768px;margin:0 auto;line-height:1.75}.about-grid{display:grid;gap:3rem}@media (min-width: 1024px){.about-grid{grid-template-columns:1fr 1fr;align-items:center}}.about-journey h3{font-size:1.875rem;font-weight:700;margin-bottom:1.5rem}.about-journey p{color:#d1d5db;font-weight:350;line-height:1.75;margin-bottom:1.25rem}.about-tech{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}.about-tech-badge{padding:.5rem 1rem;background:#111827;color:#3b82f6;border-radius:9999px;font-size:.875rem;font-weight:500;border:1px solid #374151;transition:all .3s ease;cursor:default}.about-tech-badge:hover{border-color:#3b82f6;transform:scale(1.05)}.skills-grid{display:grid;gap:1.5rem}@media (min-width: 768px){.skills-grid{grid-template-columns:repeat(2,1fr)}}.skill-card{background:#111827;margin-top:20px;border:1px solid #1f2937;border-radius:.75rem;padding:1.5rem;transition:all .3s ease}.skill-card:hover{background:#1f2937;border-color:#4b5563;transform:scale(1.05)}.skill-icon{color:#3b82f6;margin-bottom:1rem}.skill-card h4{font-size:1.125rem;font-weight:700;margin-bottom:.5rem}.skill-card p{color:#9ca3af;font-size:.875rem;font-weight:400;line-height:1.5}.projects-section{padding:5rem 1rem;background:#000;color:#fff}.projects-container{max-width:1280px;margin:0 auto}.projects-header{text-align:center;margin-bottom:4rem}.projects-header h2{font-size:3rem;font-weight:900;margin-bottom:1.5rem}.projects-header p{color:#9ca3af;font-weight:300;max-width:768px;margin:0 auto;line-height:1.75}.projects-grid{display:grid;gap:2rem}@media (min-width: 768px){.projects-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.projects-grid{grid-template-columns:repeat(3,1fr)}}.project-card{background:#111827;border-radius:1rem;overflow:hidden;border:1px solid #1f2937;box-shadow:0 10px 15px #00000080;transition:all .3s ease;cursor:pointer}.project-card:hover{transform:scale(1.05);box-shadow:0 15px 25px #0009;border-color:#4b5563}.project-image-container{position:relative;overflow:hidden}.project-image{width:100%;height:12rem;object-fit:cover;transition:transform .3s ease}.project-card:hover .project-image{transform:scale(1.1)}.project-image-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.6),transparent)}.project-details{padding:1.5rem}.project-details h3{font-size:1.5rem;font-weight:700;margin-bottom:.75rem}.project-details p{color:#9ca3af;font-size:.875rem;line-height:1.5;margin-bottom:1rem;font-weight:300}.project-tech{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.project-tech-item{padding:.25rem .75rem;font-size:.75rem;font-weight:500;color:#60a5fa;background:#000;border-radius:9999px;border:1px solid #374151}.project-links{display:flex;gap:1rem}.project-link{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;transition:color .2s ease}.project-link.live{color:#60a5fa}.project-link.live:hover{color:#3b82f6}.project-link.code{color:#9ca3af}.project-link.code:hover{color:#d1d5db}.contact-section{padding:5rem 1rem;background:#000;color:#fff}.contact-container{max-width:1280px;margin:0 auto;padding:0 1rem}.contact-header{text-align:center;margin-bottom:4rem}.contact-header h2{font-size:3rem;font-weight:900;margin-bottom:1.5rem}.contact-header p{color:#9ca3af;font-weight:300;max-width:768px;margin:0 auto;line-height:1.75}.contact-card-wrapper{max-width:768px;margin:0 auto}.contact-card{background:#111827;border-radius:2rem;padding:3rem;border:1px solid #1f2937;text-align:center}.contact-icon{width:5rem;height:5rem;background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 2rem;color:#fff}.contact-info h3{font-size:2rem;font-weight:700;margin-bottom:1rem}.contact-info p{color:#9ca3af;font-weight:300;font-size:1rem;max-width:32rem;margin:0 auto 2rem;line-height:1.6}.contact-actions{display:flex;flex-direction:column;gap:1rem;align-items:center;justify-content:center;margin-bottom:2rem}.contact-email{display:flex;align-items:center;gap:.75rem;padding:1rem 2rem;background:#fff;color:#000;border-radius:9999px;font-weight:600;cursor:pointer;transition:all .3s ease;text-decoration:none}.contact-email:hover{transform:scale(1.05);background:#f3f4f6}.arrow-icon{transition:transform .3s ease}.contact-email:hover .arrow-icon{transform:translate(.25rem)}.social-links{display:flex;gap:1rem}.social-icon{padding:1rem;background:#1f2937;border-radius:50%;border:1px solid #374151;color:#fff;display:flex;align-items:center;justify-content:center;transition:all .3s ease;cursor:pointer}.social-icon:hover{background:#374151;border-color:#4b5563;transform:scale(1.1)}.contact-meta{display:grid;grid-template-columns:1fr;gap:1.5rem;border-top:1px solid #1f2937;padding-top:2rem}@media (min-width: 768px){.contact-meta{grid-template-columns:repeat(3,1fr)}}.meta-item h4{font-weight:600;color:#fff;margin-bottom:.5rem}.meta-item p{font-weight:300;font-size:.875rem;color:#9ca3af}.footer{background:#000;padding:4rem 1rem;border-top:1px solid #1f2937;color:#fff}.footer-container{max-width:1280px;margin:0 auto;padding:0 1rem}.footer-grid{display:grid;gap:3rem}@media (min-width: 768px){.footer-grid{grid-template-columns:repeat(3,1fr)}}.footer-about .footer-title{font-size:2rem;font-weight:900;margin-bottom:1rem}.footer-about .footer-description{color:#9ca3af;font-weight:300;margin-bottom:1.5rem}.footer-socials{display:flex;justify-content:center;gap:1rem}.social-icon{padding:.75rem;background:#111827;color:#9ca3af;border-radius:50%;border:1px solid #1f2937;display:flex;align-items:center;justify-content:center;transition:all .3s ease;cursor:pointer}.social-icon:hover{background:#1f2937;border-color:#4b5563;color:#fff;transform:scale(1.1)}.footer-links h4,.footer-services h4{font-weight:700;color:#fff;margin-bottom:1.5rem}.footer-links ul,.footer-services ul{list-style:none;padding:0;margin:0}.footer-link{background:none;border:none;color:#9ca3af;cursor:pointer;font-weight:300;padding:.25rem 0;transition:color .3s ease}.footer-link:hover{color:#fff}.footer-services li{color:#9ca3af;font-weight:300;padding:.25rem 0}.footer-bottom{border-top:1px solid #1f2937;margin-top:4rem;padding-top:2rem;text-align:center}.footer-bottom-text{color:#9ca3af;display:flex;align-items:center;justify-content:center;gap:.25rem;font-weight:300}.heart-icon{color:#ef4444}
