:root{--background:#09090b;--surface:#18181b;--surface-hover:#27272a;--primary:#fafafa;--secondary:#a1a1aa;--accent:#3b82f6;--accent-hover:#2563eb;--border:#27272a;--border-hover:#3f3f46;--space-1:.25rem;--space-2:.5rem;--space-3:1rem;--space-4:1.5rem;--space-5:2.5rem;--space-6:3.5rem;--space-8:4.5rem;--space-10:7rem;--space-12:8rem;--space-16:10rem;--radius-sm:.25rem;--radius-md:.5rem;--radius-lg:1rem;--radius-full:9999px;--shadow-premium:0 20px 40px -20px #000000e6;--text-xs:.75rem;--text-sm:.8125rem;--text-base:.9375rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:2.5rem;--text-4xl:4.5rem;--font-base:"Inter", "Open Sans", sans-serif;--font-title:"Neue Machina", sans-serif;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-base:.25s cubic-bezier(.4, 0, .2, 1)}html{scroll-behavior:smooth}*{box-sizing:border-box;margin:0;padding:0;scroll-margin-top:5rem}@font-face{font-family:Neue Machina;src:url(/assets/NeueMachina-Regular-CtIflk9x.otf)}body{background-color:var(--background);color:var(--primary);font-family:var(--font-base);line-height:1.7;font-size:var(--text-base);letter-spacing:-.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--accent);transition:all var(--transition-fast);text-decoration:none}a:hover{color:var(--accent-hover)}h1,h2,h3,h4{font-family:var(--font-title);color:var(--primary);letter-spacing:-.04em;line-height:1.1}p{color:var(--secondary);margin-bottom:var(--space-4)}ul{list-style:none}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in-section{animation:.6s cubic-bezier(.4,0,.2,1) both fadeSlideIn}.fade-in-section:first-child{animation-delay:0s}.fade-in-section:nth-child(2){animation-delay:.1s}.fade-in-section:nth-child(3){animation-delay:.15s}.fade-in-section:nth-child(4){animation-delay:.2s}.fade-in-section:nth-child(5){animation-delay:.25s}.fade-in-section:nth-child(6){animation-delay:.3s}@media (prefers-reduced-motion:reduce){.fade-in-section{opacity:1;animation:none;transform:none}}.loading-state,.error-state{padding:var(--space-8);text-align:center;color:var(--secondary)}.counter{color:var(--accent);background:var(--accent-bg);border:2px solid #0000;border-radius:.3125rem;margin-bottom:1.5rem;padding:.3125rem .625rem;font-size:1rem;transition:border-color .3s}.counter:hover{border-color:var(--accent-border)}.counter:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hero{position:relative}.hero .base,.hero .framework,.hero .vite{margin:0 auto;inset-inline:0}.hero .base{z-index:0;width:10.625rem;position:relative}.hero .framework,.hero .vite{position:absolute}.hero .framework{z-index:1;height:1.75rem;top:2.125rem;transform:perspective(2000px)rotate(300deg)rotateX(44deg)rotateY(39deg)scale(1.4)}.hero .vite{z-index:0;width:auto;height:1.625rem;top:6.6875rem;transform:perspective(2000px)rotate(300deg)rotateX(40deg)rotateY(39deg)scale(.8)}#center{flex-direction:column;flex-grow:1;place-content:center;place-items:center;gap:1.125rem;padding:2rem 1.25rem 1.5rem;display:flex}#next-steps{text-align:center;border-top:1px solid var(--border);flex-direction:column;display:flex}#next-steps>div{flex:1 1 0;padding:1.5rem 1.25rem}#next-steps .icon{width:1.375rem;height:1.375rem;margin-bottom:1rem}#docs{border-right:none;border-bottom:1px solid var(--border)}#next-steps ul{flex-wrap:wrap;justify-content:center;gap:.5rem;margin:1.25rem 0 0;padding:0;list-style:none;display:flex}#next-steps ul li{flex:calc(50% - .5rem)}#next-steps ul .logo{height:1.125rem}#next-steps ul a{color:var(--text-h);background:var(--social-bg);box-sizing:border-box;border-radius:.375rem;justify-content:center;align-items:center;gap:.5rem;width:100%;padding:.375rem .75rem;font-size:1rem;text-decoration:none;transition:box-shadow .3s;display:flex}#next-steps ul a:hover{box-shadow:var(--shadow)}#next-steps ul a .button-icon{width:1.125rem;height:1.125rem}#spacer{border-top:1px solid var(--border);height:3rem}.ticks{width:100%;position:relative}.ticks:before,.ticks:after{content:"";border:.3125rem solid #0000;position:absolute;top:-.28125rem}.ticks:before{border-left-color:var(--border);left:0}.ticks:after{border-right-color:var(--border);right:0}@media (width>=1024px){#center{gap:1.5625rem;padding:0}#next-steps{text-align:left;flex-direction:row}#next-steps>div{padding:2rem}#docs{border-right:1px solid var(--border);border-bottom:none}#next-steps ul{justify-content:flex-start;margin:2rem 0 0}#next-steps ul li{flex:none}#next-steps ul a{width:auto}#spacer{height:5.5rem}}.layout{min-height:100vh;padding:var(--space-5) var(--space-5) var(--space-10);background-color:var(--background);gap:var(--space-8);flex-direction:column;max-width:75rem;margin:0 auto;display:flex;position:relative}.layout:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(circle at 10% 10%,#3b82f608 0%,#0000 50%),radial-gradient(circle at 90% 90%,#3b82f605 0%,#0000 50%);width:100%;height:100%;position:fixed;top:0;left:0}@media (width>=768px){.layout{padding:var(--space-8) var(--space-10);gap:var(--space-10)}.main{width:100%;max-width:56.25rem;margin:0 auto}}@media (width>=1024px){.layout{padding:clamp(2rem, 4vh, 4rem) var(--space-10);gap:0;max-width:87.5rem}}.navbar{z-index:1000;width:100%;padding:var(--space-4) 0;transition:all var(--transition-base);background:0 0;position:sticky;top:0}.navbar--scrolled{-webkit-backdrop-filter:blur(12px);padding:var(--space-3) 0;background:#09090bb3;border-bottom:1px solid #ffffff0d}.navbar-container{max-width:75rem;padding:0 var(--space-6);justify-content:space-between;align-items:center;margin:0 auto;display:flex}.navbar-logo{font-family:var(--font-title);font-size:var(--text-xl);color:var(--primary);letter-spacing:-.05em;font-weight:800;text-decoration:none}.navbar-logo span{color:var(--accent)}.navbar-logo:hover span{color:var(--primary)}.navbar-menu{align-items:center;gap:var(--space-4);display:none}.nav-link{font-size:var(--text-sm);color:var(--secondary);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);transition:all var(--transition-fast);font-weight:600;text-decoration:none}.nav-link:hover,.nav-link--active{color:var(--primary)}.nav-link--active{background:#ffffff0d;color:var(--accent)!important}.btn-navbar-cta{background-color:var(--accent);border-radius:var(--radius-md);font-size:var(--text-sm);margin-left:var(--space-2);transition:all var(--transition-base);padding:.5rem 1.125rem;font-weight:700;box-shadow:0 4px 14px #3b82f64d;color:#fff!important}.btn-navbar-cta:hover{background-color:var(--accent-hover);transform:translateY(-.125rem);box-shadow:0 6px 20px #3b82f666}.navbar-toggle{cursor:pointer;z-index:1100;background:0 0;border:none;flex-direction:column;justify-content:space-between;width:1.5rem;height:1.125rem;display:flex}.navbar-toggle span{background-color:var(--primary);border-radius:2px;width:100%;height:2px;transition:all .3s;display:block}.navbar-toggle--open span:first-child{transform:translateY(.5rem)rotate(45deg)}.navbar-toggle--open span:nth-child(2){opacity:0}.navbar-toggle--open span:nth-child(3){transform:translateY(-.5rem)rotate(-45deg)}.navbar-mobile{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);width:70%;height:100vh;padding:var(--space-16) var(--space-8);gap:var(--space-4);z-index:1050;background-color:#0c0c0e;flex-direction:column;transition:right .4s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;right:-100%;box-shadow:-10px 0 30px #00000080}.navbar-mobile--open{right:0}.nav-link-mobile{font-size:var(--text-lg);color:var(--secondary);padding:var(--space-2) 0;border-bottom:1px solid #ffffff0d;font-weight:700;text-decoration:none}.btn-navbar-cta-mobile{background-color:var(--accent);border-radius:var(--radius-md);text-align:center;padding:var(--space-2);margin-top:var(--space-4);font-weight:700;color:#fff!important}@media (width>=1024px){.navbar-menu{display:flex}.navbar-toggle,.navbar-mobile{display:none}.navbar-container{padding:0 var(--space-8)}.btn-navbar-cta-mobile{padding:var(--space-4)}}.button-atom{padding:var(--space-3) var(--space-8);border-radius:var(--radius-md);font-size:var(--text-sm);transition:all var(--transition-fast);cursor:pointer;font-weight:700;font-family:var(--font-base);border:none;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.button-atom--primary{background-color:var(--accent);box-shadow:0 10px 20px -10px #3b82f680;color:#fff!important}.button-atom--primary:hover{background-color:var(--accent-hover);transform:translateY(-.125rem);box-shadow:0 15px 25px -10px #3b82f699}.button-atom--secondary{background-color:var(--surface);color:var(--primary);border:1px solid var(--border)}.button-atom--secondary:hover{background-color:var(--surface-hover);border-color:var(--accent);color:var(--accent);transform:translateY(-.125rem)}.button-atom--ghost{background:0 0;border-radius:0;padding:0}@media (width<=768px){.button-atom{padding:var(--space-3) var(--space-6)}}.header{z-index:1000;width:100%;position:sticky;top:0}.project-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-sm);height:100%;transition:all var(--transition-base);background:#ffffff08;border:1px solid #3b82f633;flex-direction:column;display:flex;position:relative;overflow:hidden}.project-card.clickable{cursor:pointer}.project-image{aspect-ratio:16/9;background-color:var(--border);width:100%;position:relative;overflow:hidden}.project-image img{object-fit:cover;width:100%;height:100%;transition:transform .5s}.project-card:hover .project-image img{transform:scale(1.05)}.project-content{padding:var(--space-6);gap:var(--space-5);flex-direction:column;flex:1;display:flex}.project-card h3{font-size:var(--text-xl);color:var(--primary);line-height:1.2}.project-card p{font-size:var(--text-sm);color:var(--secondary);line-height:1.6}.project-actions{gap:var(--space-3);margin:auto 2rem 2rem;display:flex}@media (hover:hover) and (pointer:fine){.btn-deploy:hover{background-color:var(--accent-hover);transform:translateY(-.125rem)}.btn-repo:hover{background-color:var(--surface-hover);border-color:var(--accent);color:var(--accent);transform:translateY(-.125rem)}}@media (width>=768px){.project-card:hover{border:2px solid var(--accent);background:#ffffff0f;transform:translateY(-.5rem);box-shadow:0 10px 30px -15px #3b82f633}}.projects-grid{gap:var(--space-8);grid-template-columns:1fr;padding:0;list-style:none;display:grid}@media (width>=641px){.projects-grid{grid-template-columns:repeat(auto-fill,minmax(20rem,1fr))}}.hero{align-items:center;gap:var(--space-6);padding:var(--space-6) 0;text-align:center;background-color:#0000;flex-direction:column;display:flex;position:relative;overflow:visible}.hero:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(circle,#3b82f60d 0%,#0000 70%);width:140%;height:140%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hero-photo-area{z-index:2;position:relative}.photo-container{border-radius:var(--radius-full);background:linear-gradient(135deg, var(--accent) 0%, transparent 100%);width:10rem;height:10rem;transition:transform var(--transition-base);padding:.25rem;position:relative;box-shadow:0 0 40px #3b82f626}.photo-container:hover{transform:scale(1.05)}.hero .photo{border-radius:var(--radius-full);object-fit:cover;border:4px solid var(--surface);background-color:var(--surface);width:100%;height:100%}.hero-text-area{gap:var(--space-5);flex-direction:column;width:100%;max-width:37.5rem;display:flex}.identity{gap:var(--space-1);flex-direction:column;display:flex}.name{font-size:var(--text-3xl);color:var(--primary);letter-spacing:-.04em;font-weight:900;line-height:1}.job{font-size:var(--text-lg);color:var(--secondary);letter-spacing:.02em;font-weight:500}.value-prop{font-size:var(--text-sm);color:var(--secondary);opacity:.9;max-width:31.25rem;margin:0 auto;margin-top:var(--space-2);line-height:1.6}.actions{gap:var(--space-3);flex-wrap:wrap;justify-content:center;display:flex}.actions a{padding:var(--space-3) var(--space-8);border-radius:var(--radius-md);font-size:var(--text-sm);transition:all var(--transition-fast);font-weight:700}.btn-primary{background-color:var(--accent);box-shadow:0 10px 20px -10px #3b82f680;color:#fff!important}@media (hover:hover) and (pointer:fine){.btn-primary:hover{background-color:var(--accent-hover);transform:translateY(-.125rem);box-shadow:0 15px 25px -10px #3b82f699;color:#fff!important}.btn-secondary:hover{background-color:var(--surface-hover);border-color:var(--accent);color:var(--accent);transform:translateY(-.125rem)}}.btn-secondary{background-color:var(--surface);color:var(--primary);border:1px solid var(--border)}.contact-details{align-items:center;gap:var(--space-3);font-size:var(--text-xs);color:var(--secondary);flex-direction:column;display:flex}.quick-links{gap:var(--space-4);display:flex}.quick-links a{color:var(--secondary);transition:color var(--transition-fast)}.quick-links a:hover{color:var(--accent)}@media (width>=768px){.hero{text-align:left;justify-content:center;gap:var(--space-8);padding:var(--space-8) 0;flex-direction:row}.photo-container{width:13.75rem;height:13.75rem}.hero-text-area{max-width:50rem}.name{font-size:var(--text-4xl)}.job{font-size:var(--text-2xl)}.value-prop{font-size:var(--text-base);margin:var(--space-2) 0 0 0;max-width:34.375rem}.actions{justify-content:flex-start}.contact-details{gap:var(--space-5);flex-direction:row}.separator{background-color:var(--border);border-radius:var(--radius-full);width:.25rem;height:.25rem}}@media (width>=1024px){.hero{min-height:85vh;padding:var(--space-10) 0;justify-content:center;gap:var(--space-10)}.photo-container{width:17.5rem;height:17.5rem}.hero-text-area{max-width:56.25rem}.name{font-size:5rem}.job{font-size:var(--text-3xl)}.value-prop{font-size:var(--text-lg);max-width:40.625rem;margin-top:var(--space-3)}}.section{gap:var(--space-5);flex-direction:column;padding:clamp(4rem,6vh,8rem) 0;display:flex}.section-title{font-size:var(--text-xs);letter-spacing:.2rem;color:var(--accent);align-items:center;gap:var(--space-4);opacity:.8;font-weight:800;display:flex}.section-title:after{content:"";background-color:var(--border);opacity:.5;flex:1;height:1px}@media (width>=1024px){.section{padding:clamp(5rem,8vh,10rem) 0}}.title-atom{font-family:var(--font-title);color:var(--primary);letter-spacing:-.04em;margin:0;line-height:1.1}.title-atom--h1{font-size:var(--text-4xl)}.title-atom--h2{font-size:var(--text-3xl)}.title-atom--h3{font-size:var(--text-2xl)}.title-atom--h4{font-size:var(--text-xl)}@media (width<=768px){.title-atom--h1{font-size:var(--text-3xl)}.title-atom--h2{font-size:var(--text-2xl)}.title-atom--h3{font-size:var(--text-xl)}}.main{margin:auto 1rem}@media (width>=1024px){.main{flex-direction:column;gap:0;margin:0 auto;padding:0;display:flex}}.experience{gap:var(--space-6);padding:var(--space-2) 0;flex-direction:column;list-style:none;display:flex}.experience-item{background-color:var(--surface);padding:var(--space-6);border-radius:var(--radius-lg);border:1px solid var(--border);gap:var(--space-4);transition:all var(--transition-base);flex-direction:column;display:flex;position:relative;overflow:hidden}.experience-item:before{content:"";background-color:var(--accent);width:.25rem;height:0;transition:height var(--transition-base);position:absolute;top:0;left:0}.experience-item:hover{border-color:var(--accent);transform:translate(.25rem);box-shadow:0 10px 30px -15px #3b82f633}.experience-item:hover:before{height:100%}.experience-header{justify-content:space-between;align-items:flex-start;gap:var(--space-2);flex-direction:column;display:flex}.experience-item h3.title,.experience-item h3 a{font-size:var(--text-lg);color:var(--primary);font-weight:800;line-height:1.2}.experience-item h3 a:hover{color:var(--accent)}.experience-item .period{font-size:var(--text-xs);color:var(--accent);text-transform:uppercase;letter-spacing:.1rem;white-space:nowrap;border-radius:var(--radius-sm);background-color:#3b82f60d;border:1px solid #3b82f61a;padding:.25rem .625rem;font-weight:800}.impact-description{font-size:var(--text-base);color:var(--secondary);max-width:50rem;line-height:1.7}@media (width>=768px){.experience-header{gap:var(--space-4);flex-direction:row}}.skills{gap:var(--space-6);padding:var(--space-2) 0;flex-direction:column;display:flex}.skills section h3{font-size:var(--text-xs);color:var(--secondary);margin-bottom:var(--space-4);text-transform:uppercase;letter-spacing:.15rem;font-weight:700}.skills .tools ul{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(4rem,1fr));justify-content:flex-start;display:grid}.skills .tools ul li{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);width:4rem;height:4rem;transition:all var(--transition-base);justify-content:center;align-items:center;display:flex;position:relative}@media (hover:none){.skills .tools ul li{background-color:var(--surface-hover)}}.skills .tools ul li img{filter:drop-shadow(0 0 1px #ffffff4d);opacity:1;max-width:2rem;max-height:2rem;transition:all var(--transition-base)}@media (hover:hover) and (pointer:fine){.skills .tools ul li img{filter:brightness(0)invert();opacity:.6}.skills .tools ul li:hover img{filter:none;opacity:1}.skills .tools ul li:hover{border-color:var(--accent);background-color:var(--surface-hover);transform:translateY(-.25rem);box-shadow:0 10px 20px -5px #00000080}.skills .tools ul li:after{content:attr(data-skill);background-color:var(--surface-hover);color:var(--primary);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);white-space:nowrap;opacity:0;pointer-events:none;transition:all var(--transition-fast);border:1px solid var(--border);font-size:.625rem;font-weight:700;position:absolute;top:-2.1875rem;left:50%;transform:translate(-50%)translateY(.3125rem);box-shadow:0 5px 15px #0006}.skills .tools ul li:hover:after{opacity:1;transform:translate(-50%)translateY(0)}}.skills .personal ul{gap:var(--space-3);flex-wrap:wrap;display:flex}.skills .personal ul li{font-size:var(--text-sm);padding:var(--space-2) var(--space-4);background-color:var(--surface);color:var(--secondary);border-radius:var(--radius-full);border:1px solid var(--border);transition:all var(--transition-fast);font-weight:500}@media (hover:none){.skills .personal ul li{border-color:var(--accent);color:var(--primary);background-color:var(--surface-hover)}}@media (hover:hover) and (pointer:fine){.skills .personal ul li:hover{border-color:var(--accent);color:var(--primary);background-color:var(--surface-hover);transform:scale(1.02)}}@media (width>=1024px){.skills{gap:var(--space-8);grid-template-columns:1fr 1fr;display:grid}}.contact{background-color:var(--surface);border-radius:var(--radius-lg);padding:var(--space-10) var(--space-6);text-align:center;margin-top:var(--space-12);border:1px solid var(--border);position:relative;overflow:hidden}.contact:before{content:"";pointer-events:none;background:radial-gradient(circle at 10% 20%,#3b82f60d 0%,#0000 50%),radial-gradient(circle at 90% 80%,#3b82f608 0%,#0000 40%);width:100%;height:100%;position:absolute;top:0;left:0}.contact-container{gap:var(--space-6);z-index:2;flex-direction:column;max-width:43.75rem;margin:0 auto;display:flex;position:relative}.contact-title{font-size:var(--text-2xl);color:var(--primary);font-weight:800;line-height:1.1}.contact-description{font-size:var(--text-lg);color:var(--secondary);line-height:1.6}.contact-actions{align-items:center;gap:var(--space-5);flex-direction:column;display:flex}.btn-contact-primary{background-color:var(--accent);padding:var(--space-4) var(--space-10);border-radius:var(--radius-md);font-size:var(--text-base);transition:all var(--transition-base);font-weight:700;box-shadow:0 15px 30px -10px #3b82f666;color:#fff!important}.btn-contact-primary:hover{background-color:var(--accent-hover);transform:translateY(-.25rem);box-shadow:0 20px 40px -10px #3b82f680}.contact-social{gap:var(--space-4);display:flex}.btn-contact-secondary{color:var(--secondary);font-size:var(--text-sm);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);background-color:var(--surface-hover);border:1px solid var(--border);transition:all var(--transition-fast);font-weight:600}.btn-contact-secondary:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-.125rem)}@media (width>=768px){.contact-title{font-size:var(--text-3xl)}}.footer{text-align:center;margin-top:var(--space-12);background-color:#0c0c0e;border-top:1px solid #ffffff0d;padding:3.75rem 0 6.25rem}.footer-container{max-width:75rem;padding:0 var(--space-6);margin:0 auto}.footer-content{gap:var(--space-10);flex-direction:column;display:flex}.footer-brand,.footer-nav,.footer-social{flex-direction:column;align-items:center;max-width:100%;display:flex}.footer-brand{max-width:18.75rem}.footer-logo{font-family:var(--font-title);font-size:var(--text-2xl);color:var(--primary);margin-bottom:var(--space-1);letter-spacing:-.04em;font-weight:800}.footer-logo span{color:var(--accent)}.footer-job{font-size:var(--text-sm);color:var(--secondary);font-weight:500}.footer-title{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.1rem;color:var(--primary);margin-bottom:var(--space-4);font-weight:800}.footer-links{gap:var(--space-2);flex-direction:column;list-style:none;display:flex}.footer-links a{font-size:var(--text-sm);color:var(--secondary);transition:all var(--transition-fast);text-decoration:none}.footer-links a:hover{color:var(--accent);padding-left:.25rem}.footer-social-links{gap:var(--space-4);margin-bottom:var(--space-6);justify-content:center;display:flex}.footer-social-links a{font-size:var(--text-sm);color:var(--secondary);transition:color var(--transition-fast);font-weight:600;text-decoration:none}.footer-social-links a:hover{color:var(--accent)}.back-to-top{font-size:var(--text-xs);color:var(--accent);text-transform:uppercase;letter-spacing:.05rem;padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);transition:all var(--transition-base);background-color:#3b82f60d;font-weight:700;text-decoration:none;display:inline-block}.back-to-top:hover{background-color:var(--accent);transform:translateY(-.25rem);box-shadow:0 10px 20px #3b82f633;color:#fff!important}.footer-bottom{margin-top:var(--space-10);padding-top:var(--space-6);text-align:center;border-top:1px solid #ffffff08}.copyright{font-size:var(--text-xs);color:var(--secondary);opacity:.6}@media (width>=768px){.footer{padding:5rem 0 7.5rem}}@media (width>=1024px){.footer{text-align:left}.footer-content{flex-direction:row;justify-content:space-between;align-items:flex-start}.footer-brand,.footer-nav,.footer-social{align-items:flex-start}.footer-social-links{justify-content:flex-start}}.text-atom{margin:0;line-height:1.7}.text-atom--xs{font-size:var(--text-xs)}.text-atom--sm{font-size:var(--text-sm)}.text-atom--base{font-size:var(--text-base)}.text-atom--lg{font-size:var(--text-lg)}.text-atom--color-primary{color:var(--primary)}.text-atom--color-secondary{color:var(--secondary)}.text-atom--color-accent{color:var(--accent)}.tag-atom{padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05rem;color:var(--accent);background-color:#3b82f61a;border:1px solid #3b82f633;font-weight:700;display:inline-block}.tag-atom--secondary{background-color:var(--surface-hover);color:var(--secondary);border-color:var(--border)}.stack-list-molecule{gap:var(--space-2);flex-wrap:wrap;display:flex}.project-links-molecule{gap:var(--space-4);flex-wrap:wrap;display:flex}.project-links-molecule .btn-deploy,.project-links-molecule .btn-repo{text-align:center;padding:var(--space-3);border-radius:var(--radius-md);font-size:var(--text-sm);transition:all var(--transition-fast);font-weight:700}.btn-deploy{background-color:var(--accent);color:#fff!important}.btn-repo{border:1px solid var(--border);color:var(--primary);background-color:#0000}@media (width<=768px){.project-links-molecule{flex-direction:column;width:100%}.project-links-molecule .btn-custom{width:100%}}.challenge-card{gap:var(--space-4);padding:var(--space-4);background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);transition:all var(--transition-base);flex-direction:column;display:flex}.challenge-card:hover{border-color:var(--accent);transform:translateY(-.125rem)}.challenge-content{gap:var(--space-3);flex-direction:column;display:flex}@media (width>=48rem){.challenge-card{flex-direction:row;align-items:flex-start}.challenge-card:hover{transform:translate(.25rem)}}.feature-item{gap:var(--space-6);display:flex}.feature-marker{justify-content:center;padding-top:.5rem;display:flex}.feature-marker .line{background-color:var(--accent);border-radius:var(--radius-full);width:.25rem;height:2rem}.feature-content{gap:var(--space-2);flex-direction:column;display:flex}.section-detail{padding:var(--space-12) 0;border-bottom:1px solid var(--border)}.section-header{margin-bottom:var(--space-10)}.hero-content{gap:var(--space-10);flex-direction:column;align-items:center;display:flex}.hero-text{gap:var(--space-6);text-align:center;flex-direction:column;display:flex}.hero-description{max-width:43.75rem;margin:0 auto}.hero-image-container{border-radius:var(--radius-lg);border:1px solid var(--border);width:100%;box-shadow:var(--shadow-premium);background-color:var(--surface);overflow:hidden}.hero-image{object-fit:cover;width:100%;height:auto;transition:transform .5s;display:block}.hero-image-container:hover .hero-image{transform:scale(1.02)}.context-container{max-width:50rem}.context-text{margin-top:var(--space-6);line-height:1.8}.challenges-grid{gap:var(--space-6);grid-template-columns:1fr;display:grid}.architecture-grid{gap:var(--space-10);grid-template-columns:1fr;display:grid}.architecture-content{gap:var(--space-6);flex-direction:column;display:flex}.architecture-stack{padding:var(--space-8);background-color:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border)}.stack-title{margin-bottom:var(--space-6);color:var(--secondary);text-transform:uppercase;font-size:var(--text-xs);letter-spacing:.1rem}.features-grid{gap:var(--space-8);grid-template-columns:1fr;display:grid}.project-details-gallery{border-bottom:none}.gallery-grid{gap:var(--space-6);grid-template-columns:1fr;display:grid}.gallery-item{aspect-ratio:16/9;border-radius:var(--radius-md);border:1px solid var(--border);width:100%;overflow:hidden}.gallery-image{object-fit:cover;width:100%;height:100%;transition:transform .5s}.gallery-item:hover .gallery-image{transform:scale(1.05)}.lightbox{z-index:2000;opacity:0;background:#000000e6;justify-content:center;align-items:center;padding:1rem;animation:.3s forwards fadeIn;display:flex;position:fixed;inset:0}.lightbox-image{object-fit:contain;border-radius:var(--radius-md);width:auto;max-width:100%;height:auto;max-height:100%;animation:.3s forwards zoomIn;transform:scale(.95)}@keyframes fadeIn{0%{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:translateY(0)}}@keyframes zoomIn{to{transform:scale(1)}}@media (width>=48rem){.challenges-grid,.features-grid,.gallery-grid{grid-template-columns:1fr 1fr}.lightbox{padding:.5rem}.lightbox-image{border-radius:var(--radius-sm)}}@media (width>=64rem){.hero-content{align-items:center;gap:var(--space-16);flex-direction:row}.hero-text{text-align:left}.hero-description{margin:0}.architecture-grid{gap:var(--space-16);grid-template-columns:1.5fr 1fr}.gallery-grid{grid-template-columns:1fr 1fr 1fr}}.project-details-page{background-color:var(--background);min-height:100vh}.project-details-container{max-width:75rem;padding:0 var(--space-6);margin:0 auto}.section-detail{animation:.8s ease-out forwards fadeIn}.page-state{justify-content:center;align-items:center;gap:var(--space-6);height:100vh;color:var(--primary);text-align:center;flex-direction:column;display:flex}.btn-back{padding:var(--space-3) var(--space-8);background-color:var(--accent);color:#fff;border-radius:var(--radius-md);transition:all var(--transition-fast);font-weight:700;text-decoration:none}.btn-back:hover{background-color:var(--accent-hover);transform:translateY(-2px)}.project-navigation{padding:var(--space-12) 0;justify-content:center;display:flex}.btn-back-footer{color:var(--secondary);font-weight:600;font-size:var(--text-sm);transition:color var(--transition-fast);text-decoration:none}.btn-back-footer:hover{color:var(--accent)}@media (width>=1024px){.project-details-container{padding:0 var(--space-10)}}
